Skip to content

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

修改积分页面商品列表背景图,添加除商品外的点击跳转

parent 21736cfc
Hide whitespace changes
Inline Side-by-side
Showing with 419 additions and 24 deletions
a.json 0 → 100644
View file @ e00ef795
{
"swiper": [
{
"bannerImg": "integralBannerBg0.png",
"url": "subPackages/shopMainList/topicNew/index?id=1000916",
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e"
}
},
{
"bannerImg": "integralBannerBg1.png",
"url": "",
"type": 0
},
{
"bannerImg": "integralBannerBg2.png",
"url": "",
"type": 0
}
],
"viplv": {
"imgs": [
"imgPlatinum0.png",
"imgPlatinum1.png",
"imgPlatinum2.png",
"imgPlatinum3.png",
"imgPlatinum4.png"
]
},
"vipIntegral": {
"gonglue": {
"url": "https://mom.feihe.com/member/mine/pointStrategy",
"type": 3,
"img": "strategyBtn.png"
},
"progressBar": {
"barImg": "progressBarIntegral.png",
"barBgImg": "progressBarBgIntegral.png"
},
"excharge": {
"url": "subPackages/shopMainList/topicNew/index?id=1000187",
"type": 2,
"img": "integralExchargeBtn.png",
"extra": {
"appId": "wx4205ec55b793245e"
}
},
"integralDetail": {
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot",
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e"
}
},
"jifenmingxi": {
"url": "https://mom.feihe.com/member/mine/newPointDetail?crmId={crmid}&appCode=XMH",
"type": 3
}
},
"qunyiInfo": {
"vipRule": {
"url": "https://mom.feihe.com/member/mine/pointStrategy",
"type": 3
},
"imgInfos": [
{
"img": "yueyueliBtn.png",
"width": "68rpx",
"height": "87rpx",
"name": "月月礼"
},
{
"img": "shengriBtn.png",
"width": "70rpx",
"height": "91rpx",
"name": "生日礼"
},
{
"img": "yuerBtn.png",
"width": "94rpx",
"height": "87rpx",
"name": "育儿礼"
},
{
"img": "heliBtn.png",
"width": "48rpx",
"height": "87rpx",
"name": "贺礼"
},
{
"img": "xinrenliBtn.png",
"width": "71rpx",
"height": "88rpx",
"name": "新人礼"
},
{
"img": "mianfeiBtn.png",
"width": "95rpx",
"height": "87rpx",
"name": "免费礼"
},
{
"img": "zhuanduanli.png",
"width": "70rpx",
"height": "86rpx",
"name": "专端礼"
},
{
"img": "changxianBtn.png",
"width": "94rpx",
"height": "87rpx",
"name": "尝鲜礼"
},
{
"img": "jinjiBtn.png",
"width": "70rpx",
"height": "89rpx",
"name": "进阶礼"
},
{
"img": "suyuanBtn.png",
"width": "71rpx",
"height": "90rpx",
"name": "溯源礼"
}
],
"rule": {
"url": "https://mom.feihe.com/member/mine/pointStrategy",
"type": 2
},
"vipLvsQuanyi": [
{
"qunyiList": [0, 2, 4, 5],
"isNewArr": []
},
{
"qunyiList": [6, 7, 0, 2, 4, 5],
"isNewArr": [6, 7]
},
{
"qunyiList": [7, 8, 0, 2, 4, 5],
"isNewArr": [7, 8]
},
{
"qunyiList": [9, 0, 2, 4, 5, 6, 7, 8],
"isNewArr": [9]
},
{
"qunyiList": [9, 0, 2, 4, 5, 6, 7, 8],
"isNewArr": [9]
}
]
},
"vipActive": [
{
"img": "vipAct0.png",
"url": "subPackages/shopMainList/topicNew/index?id=1000911",
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e"
}
},
{
"img": "vipAct1.png",
"url": "subPackages/shopMainList/topicNew/index?id=1000912",
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e"
}
},
{
"img": "vipAct2.png",
"url": "/subPackages/shopMainProcess/lottery/index?utm_campaign=%E6%BA%AF%E6%BA%90%E6%8A%BD%E5%A5%96&_channel_track_key=ngSppZAj",
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e"
}
}
],
"goodsListData": {
"listCommon": {
"listItemImgBg": "integral/1001/listItemImgBg.png"
},
"tabInfo": {
"tabBg": "tapSelectBg.png",
"tabTexts": [
{
"line1": "星品榜单",
"line2": ""
},
{
"line1": "0元爆款",
"line2": ""
},
{
"line1": "北纬专场",
"line2": ""
}
]
},
"goodsData": [
{
"titles": [
"六水香清禾香大米2.5kg",
"EDI纯水手口湿巾迷你...",
"全麦手撕面包麦香浓郁...",
"艾草植萃除菌除螨洗衣...",
"内衣专护洗衣液",
"婴儿专护除菌除螨洗衣...",
"宝宝钙维生素D软胶囊...",
"北纬47度鲜甜低GI水果...",
"牙博士青柠亮白牙膏",
"六水香泰来大米2.5kg",
"钙铁锌牛乳软饼干6g*...",
"飞鹤茁然儿童配方奶2...",
"酵素洗衣皂抑菌柔护尿...",
"云柔保湿纸巾乳霜纸...",
"超级飞侠儿童绘画笔套...",
"婴蓓INBER 儿童糖果..."
],
"prices": [3200, 990, 1990, 1990, 1590, 2190, 2680, 990, 1580, 4000, 2490, 5200, 1990, 3900, 7900, 1990],
"goodsImgs": [
"listItemImgJx0.png",
"listItemImgJx1.png",
"listItemImgJx2.png",
"listItemImgJx3.png",
"listItemImgJx4.png",
"listItemImgJx5.png",
"listItemImgJx6.png",
"listItemImgJx7.png",
"listItemImgJx8.png",
"listItemImgJx9.png",
"listItemImgJx10.png",
"listItemImgJx11.png",
"listItemImgJx12.png",
"listItemImgJx13.png",
"listItemImgJx14.png",
"listItemImgJx15.png"
]
},
{
"titles": [
"星飞帆4段儿童成长...",
"星飞帆卓睿4段儿童...",
"金装1962-高锌多维学...",
"香葱流心可颂面包500g",
"茁然 茁护儿童配方奶...",
"六水香清禾香大米5kg",
"星蕴孕产妇奶粉听装700g",
"美维仕宝宝钙维生素...",
"金装1962-中老年高钙...",
"金装1962-高钙高蛋白...",
"茁然纯牛奶(A2 B酪蛋...",
"北纬47度黄糯鲜玉米",
"钙铁锌牛乳软饼干6g*...",
"迪奥口红 烈焰蓝金唇...",
"浅香(ASAKA)百合氨基...",
"心相印茶语精选320抽..."
],
"prices": [188, 368, 89, 19.9, 268, 69, 158, 78, 89, 89, 65, 66, 39.9, 158.51, 31, 29],
"goodsImgs": [
"listItemImgXL0.png",
"listItemImgXL1.png",
"listItemImgXL2.png",
"listItemImgXL3.png",
"listItemImgXL4.png",
"listItemImgXL5.png",
"listItemImgXL6.png",
"listItemImgXL7.png",
"listItemImgXL8.png",
"listItemImgXL9.png",
"listItemImgXL10.png",
"listItemImgXL11.png",
"listItemImgXL12.png",
"listItemImgXL13.png",
"listItemImgXL14.png",
"listItemImgXL15.png"
]
},
{
"titles": [
"北纬47度水果玉米",
"北纬47度黄糯鲜玉米",
"北纬47度白甜糯玉米",
"北纬47度东北烧烤...",
"北纬47度花甜糯玉米",
"北纬47度黑珍珠玉米",
"N47°植物酵素乳245...",
"N47°水果玉米汁245..."
],
"prices": [4200, 3840, 3840, 5990, 4200, 4200, 5500, 4990],
"goodsImgs": [
"listItemImgPzh0.png",
"listItemImgPzh1.png",
"listItemImgPzh2.png",
"listItemImgPzh3.png",
"listItemImgPzh4.png",
"listItemImgPzh5.png",
"listItemImgPzh6.png",
"listItemImgPzh7.png"
]
}
]
}
}
\ No newline at end of file
views/Integral.vue
View file @ e00ef795
...@@ -126,11 +126,7 @@ ...@@ -126,11 +126,7 @@
</view> </view>
</view> </view>
<!-- 第三行 -->
<view class="info-row">
<text class="count-text">{{ `当前：${points}` }}</text>
<text class="expire-text">{{`(有${willExpiredPoints ? willExpiredPoints : 0}积分将到期)`}}</text>
</view>
</view> </view>
<image <image
...@@ -139,7 +135,23 @@ ...@@ -139,7 +135,23 @@
mode="aspectFit" mode="aspectFit"
@click="gonglueHandler" @click="gonglueHandler"
/> />
<!-- 第三行 -->
<view class="info-row-container">
<view
class="info-row"
@click="integralDetailHandler"
>
<text class="count-text">{{ `当前：${points}` }}</text>
<text class="expire-text">{{`(有${willExpiredPoints ? willExpiredPoints : 0}积分将到期)`}}</text>
<image
class="integral-detail-arrow"
:src="$baseUrl + 'integral/1001/integralArrow.png'"
mode="aspectFit"
/>
</view>
</view>
</view> </view>
</view> </view>
...@@ -217,7 +229,7 @@ ...@@ -217,7 +229,7 @@
class="vip-active-img" class="vip-active-img"
:src="$baseUrl + `integral/1001/${item?.img}`" :src="$baseUrl + `integral/1001/${item?.img}`"
mode="aspectFit" mode="aspectFit"
@click="handleVipActiveClick(index, item?.url)" @click="handleVipActiveClick(index, item)"
/> />
</swiper-item> </swiper-item>
</swiper> </swiper>
...@@ -253,7 +265,16 @@ ...@@ -253,7 +265,16 @@
class="goods-item" class="goods-item"
v-for="i in goodsData[0]?.titles?.length" v-for="i in goodsData[0]?.titles?.length"
:key="i" :key="i"
:style="{
background:`url(${$baseUrl}${listCommon?.listItemImgBg}) no-repeat center/contain`
}"
> >
<!-- <image
class="goods-img-bg"
:src="$baseUrl + `integral/1001/listItemImgBg.png`"
mode="aspectFit"
/> -->
<image <image
class="goods-img" class="goods-img"
:src="$baseUrl + `integral/1001/${goodsData[0]?.goodsImgs[i-1]}`" :src="$baseUrl + `integral/1001/${goodsData[0]?.goodsImgs[i-1]}`"
...@@ -275,6 +296,9 @@ ...@@ -275,6 +296,9 @@
class="goods-item" class="goods-item"
v-for="i in goodsData[1]?.titles?.length" v-for="i in goodsData[1]?.titles?.length"
:key="i" :key="i"
:style="{
background:`url(${$baseUrl}${listCommon?.listItemImgBg}) no-repeat center/contain`
}"
> >
<image <image
class="goods-img" class="goods-img"
...@@ -297,6 +321,9 @@ ...@@ -297,6 +321,9 @@
class="goods-item" class="goods-item"
v-for="i in goodsData[2]?.titles?.length" v-for="i in goodsData[2]?.titles?.length"
:key="i" :key="i"
:style="{
background:`url(${$baseUrl}${listCommon?.listItemImgBg}) no-repeat center/contain`
}"
> >
<image <image
class="goods-img" class="goods-img"
...@@ -414,6 +441,10 @@ ...@@ -414,6 +441,10 @@
{ {
appId: "wx4205ec55b793245e" appId: "wx4205ec55b793245e"
} }
},
jifenmingxi:{
url:"https://mom.feihe.com/member/mine/newPointDetail?crmId={crmid}&appCode=XMH",
type:3,
} }
}, },
qunyiInfo: { qunyiInfo: {
...@@ -514,26 +545,41 @@ ...@@ -514,26 +545,41 @@
{ {
img:"vipAct0.png", img:"vipAct0.png",
url:"subPackages/shopMainList/topicNew/index?id=1000911", url:"subPackages/shopMainList/topicNew/index?id=1000911",
type:0 type:2,
extra:
{
appId: "wx4205ec55b793245e"
}
}, },
{ {
img:"vipAct1.png", img:"vipAct1.png",
url:"subPackages/shopMainList/topicNew/index?id=1000912", url:"subPackages/shopMainList/topicNew/index?id=1000912",
type:0 type:2,
extra:
{
appId: "wx4205ec55b793245e"
}
}, },
{ {
img:"vipAct2.png", img:"vipAct2.png",
url:"/subPackages/shopMainProcess/lottery/index?utm_campaign=%E6%BA%AF%E6%BA%90%E6%8A%BD%E5%A5%96&_channel_track_key=ngSppZAj", url:"/subPackages/shopMainProcess/lottery/index?utm_campaign=%E6%BA%AF%E6%BA%90%E6%8A%BD%E5%A5%96&_channel_track_key=ngSppZAj",
type:0 type:2,
extra:
{
appId: "wx4205ec55b793245e"
}
} }
], ],
goodsListData:{ goodsListData:{
listCommon:{
listItemImgBg:"integral/1001/listItemImgBg.png"
},
tabInfo:{ tabInfo:{
tabBg:"tapSelectBg.png", tabBg:"tapSelectBg.png",
tabTexts: [ tabTexts: [
{ line1: '精选榜单', line2: '' }, { line1: '星品榜单', line2: '' },
{ line1: '品质专区', line2: '' }, { line1: '0元爆款', line2: '' },
{ line1: '限量推荐', line2: '' } { line1: '北纬专场', line2: '' }
] ]
}, },
goodsData:[ goodsData:[
...@@ -546,15 +592,15 @@ ...@@ -546,15 +592,15 @@
1990,3900,7900,1990], 1990,3900,7900,1990],
goodsImgs:['listItemImgJx0.png','listItemImgJx1.png','listItemImgJx2.png','listItemImgJx3.png','listItemImgJx4.png','listItemImgJx5.png','listItemImgJx6.png','listItemImgJx7.png','listItemImgJx8.png','listItemImgJx9.png','listItemImgJx10.png','listItemImgJx11.png','listItemImgJx12.png','listItemImgJx13.png','listItemImgJx14.png','listItemImgJx15.png'] goodsImgs:['listItemImgJx0.png','listItemImgJx1.png','listItemImgJx2.png','listItemImgJx3.png','listItemImgJx4.png','listItemImgJx5.png','listItemImgJx6.png','listItemImgJx7.png','listItemImgJx8.png','listItemImgJx9.png','listItemImgJx10.png','listItemImgJx11.png','listItemImgJx12.png','listItemImgJx13.png','listItemImgJx14.png','listItemImgJx15.png']
}, },
{
titles:['北纬47度水果玉米','北纬47度黄糯鲜玉米','北纬47度白甜糯玉米','北纬47度东北烧烤...','北纬47度花甜糯玉米','北纬47度黑珍珠玉米','N47°植物酵素乳245...','N47°水果玉米汁245...'],
prices:[4200,3840,3840,5990,4200,4200,5500,4990],
goodsImgs:['listItemImgPzh0.png','listItemImgPzh1.png','listItemImgPzh2.png','listItemImgPzh3.png','listItemImgPzh4.png','listItemImgPzh5.png','listItemImgPzh6.png','listItemImgPzh7.png']
},
{ {
titles:['星飞帆4段儿童成长...','星飞帆卓睿4段儿童...','金装1962-高锌多维学...','香葱流心可颂面包500g','茁然 茁护儿童配方奶...','六水香清禾香大米5kg','星蕴孕产妇奶粉听装700g','美维仕宝宝钙维生素...','金装1962-中老年高钙...','金装1962-高钙高蛋白...','茁然纯牛奶(A2 B酪蛋...','北纬47度黄糯鲜玉米','钙铁锌牛乳软饼干6g*...','迪奥口红 烈焰蓝金唇...','浅香(ASAKA)百合氨基...','心相印茶语精选320抽...'], titles:['星飞帆4段儿童成长...','星飞帆卓睿4段儿童...','金装1962-高锌多维学...','香葱流心可颂面包500g','茁然 茁护儿童配方奶...','六水香清禾香大米5kg','星蕴孕产妇奶粉听装700g','美维仕宝宝钙维生素...','金装1962-中老年高钙...','金装1962-高钙高蛋白...','茁然纯牛奶(A2 B酪蛋...','北纬47度黄糯鲜玉米','钙铁锌牛乳软饼干6g*...','迪奥口红 烈焰蓝金唇...','浅香(ASAKA)百合氨基...','心相印茶语精选320抽...'],
prices:[188,368,89,19.9,268,69,158,78,89,89,65,66,39.9,158.51,31,29], prices:[188,368,89,19.9,268,69,158,78,89,89,65,66,39.9,158.51,31,29],
goodsImgs:['listItemImgXL0.png','listItemImgXL1.png','listItemImgXL2.png','listItemImgXL3.png','listItemImgXL4.png','listItemImgXL5.png','listItemImgXL6.png','listItemImgXL7.png','listItemImgXL8.png','listItemImgXL9.png','listItemImgXL10.png','listItemImgXL11.png','listItemImgXL12.png','listItemImgXL13.png','listItemImgXL14.png','listItemImgXL15.png'] goodsImgs:['listItemImgXL0.png','listItemImgXL1.png','listItemImgXL2.png','listItemImgXL3.png','listItemImgXL4.png','listItemImgXL5.png','listItemImgXL6.png','listItemImgXL7.png','listItemImgXL8.png','listItemImgXL9.png','listItemImgXL10.png','listItemImgXL11.png','listItemImgXL12.png','listItemImgXL13.png','listItemImgXL14.png','listItemImgXL15.png']
},
{
titles:['北纬47度水果玉米','北纬47度黄糯鲜玉米','北纬47度白甜糯玉米','北纬47度东北烧烤...','北纬47度花甜糯玉米','北纬47度黑珍珠玉米','N47°植物酵素乳245...','N47°水果玉米汁245...'],
prices:[4200,3840,3840,5990,4200,4200,5500,4990],
goodsImgs:['listItemImgPzh0.png','listItemImgPzh1.png','listItemImgPzh2.png','listItemImgPzh3.png','listItemImgPzh4.png','listItemImgPzh5.png','listItemImgPzh6.png','listItemImgPzh7.png']
} }
// 其他分类数据... // 其他分类数据...
] ]
...@@ -568,6 +614,7 @@ ...@@ -568,6 +614,7 @@
const vipIntegral = ref({});//积分明细\ const vipIntegral = ref({});//积分明细\
const vipActive = ref([]);//会员活动 const vipActive = ref([]);//会员活动
const tabInfo = ref({});//tabbar信息 const tabInfo = ref({});//tabbar信息
const listCommon = ref({});//商品列表通用信息
const goodsData = ref([]);//商品数据 const goodsData = ref([]);//商品数据
const imgInfos = ref([]);//权益信息 const imgInfos = ref([]);//权益信息
const vipRule = ref({});//会员规则跳转 const vipRule = ref({});//会员规则跳转
...@@ -719,9 +766,31 @@ ...@@ -719,9 +766,31 @@
console.log('vipRuleHandler') console.log('vipRuleHandler')
} }
const handleVipActiveClick = (index, url) => { //积分明细点击事件
const integralDetailHandler = () => {
const url = vipIntegral.value.jifenmingxi.url.replace("{crmid}", memberInfo.value.memberId);
const type = vipIntegral.value.jifenmingxi.type;
// url = url.;
jump({
type: type,
url: url
})
}
//会员活动点击事件
const handleVipActiveClick = (index, item) => {
console.log('handleVipActiveClick：',index); console.log('handleVipActiveClick：',index);
console.log('url',url); console.log('url',url);
const url = item?.url;
const type = item?.type;
const extra = item?.extra;
jump({
type: type,
url: url,
extra:extra
})
} }
const handleScroll = (e) => { const handleScroll = (e) => {
...@@ -847,6 +916,7 @@ ...@@ -847,6 +916,7 @@
vipIntegral.value = integralData.value.vipIntegral; vipIntegral.value = integralData.value.vipIntegral;
vipActive.value = integralData.value.vipActive; vipActive.value = integralData.value.vipActive;
tabInfo.value = integralData.value.goodsListData.tabInfo; tabInfo.value = integralData.value.goodsListData.tabInfo;
listCommon.value = integralData.value.goodsListData.listCommon;
goodsData.value = integralData.value.goodsListData.goodsData; goodsData.value = integralData.value.goodsListData.goodsData;
vipRule.value = integralData.value.qunyiInfo.vipRule; vipRule.value = integralData.value.qunyiInfo.vipRule;
imgInfos.value = integralData.value.qunyiInfo.imgInfos; imgInfos.value = integralData.value.qunyiInfo.imgInfos;
...@@ -1134,12 +1204,17 @@ ...@@ -1134,12 +1204,17 @@
} }
} }
}
.info-row-container {
position: relative;
bottom: 45rpx;
.info-row { .info-row {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
position: relative; position: relative;
height: 26rpx; height: 26rpx;
margin-top: -5rpx; // margin-top: -5rpx;
margin-left: 26rpx; margin-left: 26rpx;
.count-text { .count-text {
font-size: 26rpx; font-size: 26rpx;
...@@ -1152,12 +1227,18 @@ ...@@ -1152,12 +1227,18 @@
font-size: 22rpx; font-size: 22rpx;
color: #6f6d67; color: #6f6d67;
} }
}
.integral-detail-arrow{
position: absolute;
right: 20rpx;
top: 8rpx;
width: 11rpx;
height: 19rpx;
}
}
} }
.strategy-icon { .strategy-icon {
position: absolute; position: absolute;
right: 0rpx; right: 0rpx;
...@@ -1341,9 +1422,17 @@ ...@@ -1341,9 +1422,17 @@
position: relative; position: relative;
width: 333rpx; width: 333rpx;
height: 459rpx; height: 459rpx;
background: #fff; // background: #fff;
border-radius: 16rpx; // border-radius: 16rpx;
// padding: 20rpx; // padding: 20rpx;
// .goods-img-bg{
// width: 333rpx;
// height: 459rpx;
// position: absolute;
// top: 0rpx;
// left: 0rpx;
// }
.goods-img { .goods-img {
width: 100%; width: 100%;
......
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