|
|
|
@ -16,32 +16,30 @@ |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="middle"> |
|
|
|
<uni-group mode="card"> |
|
|
|
<uni-grid :column="2" :square="true" :highlight="false" @change="change" :showBorder="true"> |
|
|
|
<uni-grid-item v-for="(val, i) in funcList" :index="i" :key="i"> |
|
|
|
<uni-row class="middle-uni-row" gutter="40"> |
|
|
|
<uni-col :span="12" class="middle-uni-col" v-for="(val, i) in funcList" :index="i" :key="i"> |
|
|
|
<view class="grid-item-box"> |
|
|
|
<!-- <uni-icons type="image" :size="30" color="#777" /> --> |
|
|
|
<text class="text uni-white">{{ val.title }}</text> |
|
|
|
<image :src="val.icon" class="iconImage" mode="aspectFill" /> |
|
|
|
<text class="text">{{ val.title }}</text> |
|
|
|
</view> |
|
|
|
</uni-grid-item> |
|
|
|
</uni-grid> |
|
|
|
</uni-group> |
|
|
|
</uni-col> |
|
|
|
</uni-row> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="foot"> |
|
|
|
<uni-group mode="card" title="素材数据" style="text-align:center;"> |
|
|
|
<uni-grid :column="3" :square="true" :highlight="false"> |
|
|
|
<uni-grid-item v-for="(params, v) in list" :index="v" :key="v"> |
|
|
|
<view class="grid-item-box"> |
|
|
|
<uni-row class="foot-uni-row" gutter="88"> |
|
|
|
<uni-col :span="8" class="foot-uni-col" v-for="(params, v) in list" :index="v" :key="v"> |
|
|
|
<view class="grid-item-box uni-white"> |
|
|
|
<!-- <uni-icons type="image" :size="30" color="#777" /> --> |
|
|
|
<view class="icom-div"> |
|
|
|
<image :src="params.icon" class="listIconImage" mode="aspectFill" /> |
|
|
|
</view> |
|
|
|
<text class="text">{{ params.text }}</text> |
|
|
|
<text class="text">{{ params.num }}</text> |
|
|
|
</view> |
|
|
|
</uni-grid-item> |
|
|
|
</uni-grid> |
|
|
|
</uni-group> |
|
|
|
</uni-col> |
|
|
|
</uni-row> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
@ -56,7 +54,11 @@ |
|
|
|
data() { |
|
|
|
return { |
|
|
|
userInfo:{}, |
|
|
|
banner:[], |
|
|
|
banner:[ |
|
|
|
{ |
|
|
|
bannerImg: "/static/material.png" |
|
|
|
} |
|
|
|
], |
|
|
|
current: 0, |
|
|
|
mode: 'nav', |
|
|
|
swiperDotIndex: 0, |
|
|
|
@ -76,37 +78,37 @@ |
|
|
|
list: [{ |
|
|
|
typeId: 1, |
|
|
|
text: '头像', |
|
|
|
num: '', |
|
|
|
num: '10', |
|
|
|
icon: '/static/headBack.png' |
|
|
|
}, |
|
|
|
{ |
|
|
|
typeId: 2, |
|
|
|
text: 'Gif动图', |
|
|
|
num: '', |
|
|
|
num: '10', |
|
|
|
icon: '/static/gifBack.png' |
|
|
|
}, |
|
|
|
{ |
|
|
|
typeId: 3, |
|
|
|
text: '手机壁纸', |
|
|
|
num: '', |
|
|
|
num: '20', |
|
|
|
icon: '/static/phoneBack.png' |
|
|
|
}, |
|
|
|
{ |
|
|
|
typeId: 4, |
|
|
|
text: '朋友圈', |
|
|
|
num: '', |
|
|
|
num: '10', |
|
|
|
icon: '/static/friendBack.png' |
|
|
|
}, |
|
|
|
{ |
|
|
|
typeId: 5, |
|
|
|
text: '表情包', |
|
|
|
num: '', |
|
|
|
num: '15', |
|
|
|
icon: '/static/emoBack.png' |
|
|
|
}, |
|
|
|
{ |
|
|
|
typeId: 6, |
|
|
|
text: 'iwatch', |
|
|
|
num: '', |
|
|
|
num: '3', |
|
|
|
icon: '/static/iwatchBack.png' |
|
|
|
} |
|
|
|
] |
|
|
|
@ -121,9 +123,9 @@ |
|
|
|
showCancel: false, |
|
|
|
success() { |
|
|
|
//没有缓存则跳转登录页面 |
|
|
|
uni.reLaunch({ |
|
|
|
url: '/pages/login/login' |
|
|
|
}); |
|
|
|
// uni.reLaunch({ |
|
|
|
// url: '/pages/login/login' |
|
|
|
// }); |
|
|
|
} |
|
|
|
}); |
|
|
|
} else { |
|
|
|
@ -277,9 +279,10 @@ |
|
|
|
|
|
|
|
@media screen and (min-width: 500rpx) { |
|
|
|
.uni-swiper-dot-box { |
|
|
|
width: 400rpx; |
|
|
|
margin: 0 auto; |
|
|
|
margin-top: 8rpx; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
// margin: 0 auto; |
|
|
|
// margin-top: 8rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.image { |
|
|
|
@ -302,3 +305,79 @@ |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
|
|
|
<style scoped lang="scss"> |
|
|
|
.container { |
|
|
|
min-height: 100vh; |
|
|
|
background: #FFC542; |
|
|
|
border-top: 2rpx solid #FFC542; |
|
|
|
|
|
|
|
.top { |
|
|
|
width: 638rpx; |
|
|
|
// height: 272rpx; |
|
|
|
margin: 40rpx auto; |
|
|
|
border-radius: 50rpx; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
|
|
|
|
.middle { |
|
|
|
width: 638rpx; |
|
|
|
margin: 0 auto; |
|
|
|
|
|
|
|
.grid-item-box { |
|
|
|
height: 360rpx; |
|
|
|
background: rgb(62, 213, 152); |
|
|
|
border-radius: 25px; |
|
|
|
position: relative; |
|
|
|
|
|
|
|
.text { |
|
|
|
font-size: 48rpx; |
|
|
|
position: absolute; |
|
|
|
top: 84rpx; |
|
|
|
left: auto; |
|
|
|
right: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.iconImage { |
|
|
|
position: absolute; |
|
|
|
bottom: 0; |
|
|
|
left: auto; |
|
|
|
right: auto; |
|
|
|
width: 158rpx; |
|
|
|
height: 186rpx; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.foot { |
|
|
|
margin-top: 40rpx; |
|
|
|
padding: 56rpx; |
|
|
|
background: #2A3C44; |
|
|
|
border-radius: 80rpx 0px 0px 0px; |
|
|
|
|
|
|
|
.grid-item-box { |
|
|
|
margin-bottom: 14rpx; |
|
|
|
|
|
|
|
.icom-div { |
|
|
|
background: #30444E; |
|
|
|
border-radius: 24rpx; |
|
|
|
|
|
|
|
.listIconImage { |
|
|
|
height: 130rpx; |
|
|
|
width: 130rpx; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.text { |
|
|
|
text-align: center; |
|
|
|
font-size: 24rpx; |
|
|
|
line-height: 30rpx; |
|
|
|
margin-top: 10rpx; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
