sundongyu/dykj-football
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成首页

Browse Source
This commit is contained in:
sundongyu 2024-04-17 23:37:47 +08:00
parent fdf3561446
commit 5536a33dbd
2 changed files with 120 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
main.js
View File

@ -1,18 +1,6 @@
import App from './App';
import uviewPlus from '@/uni_modules/uview-plus';
// #ifndef VUE3
import Vue from 'vue';
import './uni.promisify.adaptor';
Vue.config.productionTip = false;
App.mpType = 'app';
const app = new Vue({
...App
});
app.$mount();
// #endif
// #ifdef VUE3
import { createSSRApp } from 'vue';
export function createApp() {
const app = createSSRApp(App);
@ -21,4 +9,3 @@ export function createApp() {
app
};
}
// #endif

130
pages/index/index.vue
View File

@ -19,11 +19,59 @@
<u-icon name="arrow-right" size="12" color="#555555"></u-icon>
</view>
</view>
<view class="Pitch-card">
<view class="">1</view>
<view class="">2</view>
<view class="">3</view>
<view class="">4</view>
<view style="height: 900rpx; overflow-y: auto; -webkit-overflow-scrolling: touch">
<view v-for="item in 3" class="Pitch-card">
<view class="one">
<view style="width: 330rpx; display: flex; justify-content: space-evenly; align-items: center">
<span style="color: #e4b895">¥</span>
<span style="color: #e4b895; font-size: 45rpx">888.00</span>
<u-tag text="未购买" type="warning" size="mini" bgColor="#fef3ef" color="#e4b895" borderColor="#fef3ef"></u-tag>
</view>
<view style="margin-right: 35rpx; margin-top: 10rpx">
<u-tag text="泰国联赛杯" size="mini" type="warning" plain color="#e4b895" borderColor="#e4b895"></u-tag>
</view>
</view>
<view class="two">
<view>刚开球，来得及!</view>
</view>
<view class="three">
<view style="display: flex; width: 200rpx; align-items: center; justify-content: space-evenly">
<u-avatar src=""></u-avatar>
<view class="">人名</view>
</view>
<view style="font-size: 26rpx; margin-right: 35rpx">2024-04-11 18:59:52</view>
</view>
<view class="four">
<u-button style="color: #e5b29f; font-weight: 700" type="primary" text="立即购买" color="#fef3ef"></u-button>
</view>
</view>
</view>
<view>
<view class="Master-card">
<view class="top">
<view class="left" style="font-weight: 700; font-size: 34rpx">推荐高手</view>
<view class="right">
<view style="font-size: 24rpx; margin-right: 15rpx">查看更多</view>
<u-icon name="arrow-right" size="12" color="#555555"></u-icon>
</view>
</view>
</view>
<view style="height: 900rpx; overflow-y: auto; -webkit-overflow-scrolling: touch">
<view v-for="(item, index) in 5" class="Master-card-buttom">
<view class="left">
<u-avatar src=""></u-avatar>
<view class="">人名</view>
</view>
<view class="right">
<view>
<span style="color: red; font-weight: 700">9连红</span>
<span style="color: red; margin-left: 15rpx; font-weight: 700">近20中15</span>
</view>
<view class="texta">行走江湖多年关系网遍布全球</view>
<view class="textb">全球，周易，五行，术数</view>
</view>
</view>
</view>
</view>
</view>
</view>
@ -45,7 +93,10 @@ const text = ref([
txt: '高玩区'
}
]);
const src = ref({
src: 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg',
text: '无头像'
});
// #ifdef H5 || APP
console.log('运行在 App');
// #endif
@ -58,13 +109,12 @@ console.log('不是运行在微信小程序');
<style lang="scss" scoped>
.color {
background-image: linear-gradient(to bottom, rgba(246, 233, 224), rgba(255, 255, 255));
height: 750rpx;
height: 100%;
display: flow-root;
}
.index-page {
background-size: contain;
background-repeat: no-repeat;
/* #ifdef H5 */
padding-top: 20rpx;
/* #endif */
@ -119,10 +169,70 @@ console.log('不是运行在微信小程序');
}
.Pitch-card {
width: 650rpx;
height: 250rpx;
height: 400rpx;
border-radius: 15rpx;
margin: auto;
margin: 20rpx auto;
background-color: #fff;
border: 1rpx solid #b6b5b3;
.one {
display: flex;
margin-top: 20rpx;
justify-content: space-between;
}
.two {
font-size: 35rpx;
font-weight: 700;
margin: 10rpx 0 10rpx 20rpx;
}
.three {
display: flex;
justify-content: space-between;
align-items: center;
}
.four {
margin: 45rpx;
}
}
.Master-card {
width: 650rpx;
margin: auto;
.top {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20rpx;
}
.right {
display: flex;
}
}
.Master-card-buttom {
width: 650rpx;
height: 250rpx;
margin: auto;
border: 1rpx solid #b6b5b3;
display: flex;
justify-content: space-between;
align-items: center;
background-color: #fff;
.left {
display: flex;
align-items: center;
}
.texta {
width: 300rpx;
height: 80rpx;
border: 1rpx solid #e4b895;
color: #e4b895;
font-size: 16rpx;
margin-top: 16rpx;
margin-bottom: 16rpx;
}
.textb {
border: 1rpx solid #e4b895;
color: #e4b895;
width: 300rpx;
font-size: 16rpx;
}
}
</style>