Skip to content

飞
飞鹤小程序
Commit 14f19695 authored by 王炽's avatar 王炽
Browse files
Options

积分页优化

parent 82f5703a
Hide whitespace changes
Inline Side-by-side
Showing with 64 additions and 24 deletions
views/Integral.vue
View file @ 14f19695
......@@ -36,22 +36,28 @@
:key="index"
@click="handleVipClick"
:style="{
background: `url(${$baseUrl}integral/${tupianBanben}/vipDetailBg.png) no-repeat center/contain`
background: `url(${$baseUrl}integral/${tupianBanben}/${item?.vipIconBg}) no-repeat center/contain`
}"
>
<image
class="vip-icon"
<image
class="vip-icon"
:src="$baseUrl + `integral/${tupianBanben}/${item?.vipIcon}`"
mode="aspectFit"
/>
<view class="vip-info">
<text class="vip-name"
:style="{
color: islogin ? '#b27c1e' : '#6f6d67',
color: islogin ? `${item?.nickNameColor}` : '#6f6d67',
}"
>{{`${nickName}`}}</text>
<view class="title-container">
<text class="vip-title">{{`${item?.vipName}`}}</text>
<view class="title-container">
<text v-if="!islogin" class="vip-title1">{{`${item?.vipName}`}}</text>
<image
v-if="islogin"
class="vip-title"
:src="$baseUrl + `integral/${tupianBanben}/${item?.vipNameImg}`"
mode="aspectFit"
/>
<button
v-if="!islogin"
type="primary"
......@@ -72,10 +78,13 @@
background: `url(${$baseUrl}integral/${tupianBanben}/tabNowBg.png) no-repeat center/contain`
}"
>
<text class="tag-text">当前</text>
</view>
</view>
<text class="tag-text"
:style="{
color: `${item?.dangqianColor}`,
}">当前</text>
</view>
</view>
</view>
</swiper-item>
</swiper>
......@@ -279,7 +288,7 @@
>
<!-- <image
class="goods-img-bg"productIdUrl
:src="$baseUrl + `integral/1007/listItemImgBg.png`"
:src="$baseUrl + `integral/1008/listItemImgBg.png`"
mode="aspectFit"
/> -->
<view class="goods-item-container" @click="handleGoodsItemClick('xingpin',i)">
......@@ -402,7 +411,7 @@
import RegisterLayer from "../components/RegisterLayer.vue";
const integralData = ref({
"tupianBanben": "1007",
"tupianBanben": "1008",
"swiper": [
{
"bannerImg": "integralBannerBg0.png",
......@@ -422,6 +431,17 @@
"imgPlatinum3.png",
"imgPlatinum4.png"
],
"imgBgs":[
"imgPlatinumBg0.png",
"imgPlatinumBg1.png",
"imgPlatinumBg2.png",
"imgPlatinumBg3.png",
"imgPlatinumBg4.png"
],
"nickNameColors":["#1d1e25","#1d1e25","#1d1e25","#1d1e25","#ffffff"],
"dangqianColors":["#b27c1e","#447ab0","#332288","#674513","#674513"],
"vipLvIcon":["imgPlatinumIcon0.png","imgPlatinumIcon1.png","imgPlatinumIcon2.png","imgPlatinumIcon3.png","imgPlatinumIcon4.png"],
"vipNameImgs":["imgPlatinumName0.png","imgPlatinumName1.png","imgPlatinumName2.png","imgPlatinumName3.png","imgPlatinumName4.png"],
"upLvTxts": [
"扫罐内码或下单有机会提升至/V2铂金会员",
"扫罐内码或下单有机会提升至/V3钻石会员",
......@@ -559,15 +579,15 @@
"isNewArr": [6, 7]
},
{
"qunyiList": [8, 6, 7, 0, 2, 4, 5],
"isNewArr": [8]
"qunyiList": [8, 1, 6, 7, 0, 2, 4, 5],
"isNewArr": [8, 1]
},
{
"qunyiList": [9, 8, 6, 7, 0, 2, 4, 5],
"qunyiList": [9, 8, 1, 6, 7, 0, 2, 4, 5],
"isNewArr": [9]
},
{
"qunyiList": [9, 8, 6, 7, 0, 2, 4, 5],
"qunyiList": [9, 8, 1, 6, 7, 0, 2, 4, 5],
"isNewArr": [9]
}
]
......@@ -603,7 +623,7 @@
],
"goodsListData": {
"listCommon": {
"listItemImgBg": "integral/1007/listItemImgBg.png"
"listItemImgBg": "integral/1008/listItemImgBg.png"
},
"tabInfo": {
"tabBg": "tapSelectBg.png",
......@@ -1183,6 +1203,10 @@
const swiperData = ref(integralData.value.swiper);//banner图片地方
const vipLvIcons = ref(integralData.value.viplv.imgs);//会员等级图标
const vipLvNameImgs = ref(integralData.value.viplv.vipNameImgs);//会员等级名称图片
const vipLvIconBgs = ref(integralData.value.viplv.imgBgs);//会员等级图标背景
const nickNameColors = ref(integralData.value.viplv.nickNameColors);//会员等级昵称颜色
const dangqianColors = ref(integralData.value.viplv.dangqianColors);//当前等级颜色
const upLvTxts = ref(integralData.value.viplv.upLvTxts);//会员等级提升文字
const vipIntegral = ref(integralData.value.vipIntegral);//积分明细\
const clickMore = ref(integralData.value.clickMore);//点击更多
......@@ -1252,6 +1276,8 @@
'xinrenliBtn.png','mianfeiBtn.png','zhuanduanli.png','changxianBtn.png',
'jinjiBtn.png','suyuanBtn.png'
]);
const vipBgArr = ref([]);
const privilegeSizes = ref([
{ width: '68rpx', height: '87rpx', name: '月月礼' },
{ width: '70rpx', height: '91rpx', name: '生日礼' },
......@@ -1295,6 +1321,8 @@
swiperData.value = integralData.value.swiper;
vipLvIcons.value = integralData.value.viplv.imgs;
vipLvIconBgs.value = integralData.value.viplv.imgBgs;
vipLvNameImgs.value = integralData.value.viplv.vipNameImgs;
vipIntegral.value = integralData.value.vipIntegral;
clickMore.value = integralData.value.clickMore;
vipActive.value = integralData.value.vipActive;
......@@ -1352,6 +1380,10 @@
});
vipLvDatas.value[index].vipIcon = vipLvIcons.value[index];
vipLvDatas.value[index].vipIconBg = vipLvIconBgs.value[index];
vipLvDatas.value[index].vipNameImg = vipLvNameImgs.value[index];
vipLvDatas.value[index].nickNameColor = nickNameColors.value[index];
vipLvDatas.value[index].dangqianColor = dangqianColors.value[index];
});
}else{
......@@ -1359,6 +1391,9 @@
vipLvDatas.value = [{
"vipName": "登录查看会员等级",
"vipIcon": "imgPlatinum-1.png",
"vipIconBg": "imgPlatinumBg-1.png",
"nickNameColor": "#1d1e25",
"dangqianColor": "#b27c1e"
}];
}
}
......@@ -1679,7 +1714,7 @@
height: 154rpx;
// margin-left: 32rpx;
// margin-right: 32rpx;
// background: url('@{baseUrl}integral/1007/vipDetailBg.png') no-repeat center/cover;
// background: url('@{baseUrl}integral/1008/vipDetailBg.png') no-repeat center/cover;
flex-direction: row;
position: relative;
display: flex;
......@@ -1687,8 +1722,8 @@
.vip-icon {
width: 97rpx;
height: 92rpx;
margin-left: 15rpx;
margin-top: 30rpx;
margin-left: 30rpx;
margin-top: 32rpx;
}
.vip-info {
......@@ -1707,12 +1742,17 @@
.title-container{
width: 100%;
display: flex;
.vip-title {
.vip-title1 {
// margin-right: -15rpx;
font-size: 31rpx;
font-weight: bold;
color: #1d1e25;
}
.vip-title{
margin-top: 6rpx;
width: 174rpx;
height: 31rpx;
}
.phone-button{
top:82rpx;
......@@ -1734,7 +1774,7 @@
height: 37rpx;
margin-left: 10rpx;
margin-top: 5rpx;
// background: url('@{baseUrl}integral/1007/tabNowBg.png') no-repeat center/contain;
// background: url('@{baseUrl}integral/1008/tabNowBg.png') no-repeat center/contain;
display: flex;
align-items: center;
justify-content: center;
......@@ -1770,7 +1810,7 @@
// flex: 1;
height: 144rpx;
width: 492rpx;
// background: url('@{baseUrl}integral/1007/inteBarAreaBg.png') no-repeat center/cover;
// background: url('@{baseUrl}integral/1008/inteBarAreaBg.png') no-repeat center/cover;
margin-left: 16rpx;
// padding: 16rpx 24rpx;
.integralClick {
......@@ -2028,8 +2068,8 @@
justify-content: center;
&.active {
//https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/integral/1007/tapSelectBg.png
// background-image: url('@{baseUrl}integral/1007/tapSelectBg.png');
//https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/integral/1008/tapSelectBg.png
// background-image: url('@{baseUrl}integral/1008/tapSelectBg.png');
background-size: 100% 100%;
.tab-line1 { color: #1d1e25; }
.tab-line2 { color: #b27c1e; }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment