Skip to content

飞
飞鹤小程序
Commit 51549197 authored by spc's avatar spc
Browse files
Options

fixed home and brand

parent c57e08d0
Hide whitespace changes
Inline Side-by-side
Showing with 2180 additions and 2003 deletions
mock/home.json
View file @ 51549197
{ {
"contentImgList": [ "contentImgList": [
{
"videoUrl": "https://course.feihe.com/momclub-picture/homepage/4-0%E5%AE%98%E7%BD%91%E8%A7%86%E9%A2%91.mp4",
"_style": "width:311rpx;height: 324rpx;left: 40rpx;top: 0;",
"link": "www.baidu.com",
"bgUrl": "homepage/content_1.png"
},
{
"videoUrl": "https://course.feihe.com/momclub-picture/homepage/%E9%A6%96%E9%A1%B5_2%E9%A3%9E%E9%B9%A4%E8%BF%9E%E7%BB%AD%E4%BA%94%E5%B9%B4%E5%A5%B6%E7%B2%89%E7%AC%AC%E4%B8%80.mp4",
"_style": "width:263rpx;height: 324rpx;right: 40rpx;top: 400rpx;",
"link": "www.baidu.com",
"bgUrl": "homepage/content_2.png"
},
{
"videoUrl": "https://course.feihe.com/momclub-picture/homepage/%E9%A6%96%E9%A1%B5_3%E3%80%909%E6%9C%8827%E6%97%A5%E3%80%91%E9%A3%9E%E9%B9%A4_%E4%B8%96%E7%95%8C%E6%97%85%E6%B8%B8%E6%97%A5.mp4",
"_style": "width:418rpx;height: 345rpx;left: 40rpx;top: 750rpx;",
"link": "www.baidu.com",
"bgUrl": "homepage/content_3.png"
},
{
"_style": "width:263rpx;height: 324rpx;right: 40rpx;top: 1120rpx;",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/HhBF5h8xX8zOrthsy2-Y-A"
},
"bgUrl": "homepage/content_4.png"
}
],
"toolList": {
"maintitle": "工具推荐",
"jtIcon": "homepage/tool_jt.png",
"subtitle": "更多妈妈都在用，告别手忙脚乱，助你轻松带娃！",
"tools": [
{ {
"videoUrl": "https://course.feihe.com/momclub-picture/homepage/4-0%E5%AE%98%E7%BD%91%E8%A7%86%E9%A2%91.mp4", "icon": "homepage/tool_icon_7.png",
"_style": "width:311rpx;height: 324rpx;left: 40rpx;top: 0;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/content_1.png" "type": 1,
"url": "/pages/xingmaLab/xingmaLab"
},
"context": "记录我们的珍藏时刻",
"type": 1,
"title": "星妈会Lab"
},
{
"icon": "homepage/tool_icon_2.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/feedingIndex/feedingIndex"
},
"context": "一键更新喂养记录",
"type": 1,
"title": "喂养工具"
}, },
{ {
"videoUrl": "https://course.feihe.com/momclub-picture/homepage/%E9%A6%96%E9%A1%B5_2%E9%A3%9E%E9%B9%A4%E8%BF%9E%E7%BB%AD%E4%BA%94%E5%B9%B4%E5%A5%B6%E7%B2%89%E7%AC%AC%E4%B8%80.mp4", "icon": "homepage/tool_icon_3.png",
"_style": "width:263rpx;height: 324rpx;right: 40rpx;top: 400rpx;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/content_2.png" "type": 1,
"url": "/pages/postnatalCheckUp/postnatalCheckUp"
},
"context": "孕周检查准时告知",
"type": 1,
"title": "产检提醒"
}, },
{ {
"videoUrl": "https://course.feihe.com/momclub-picture/homepage/%E9%A6%96%E9%A1%B5_3%E3%80%909%E6%9C%8827%E6%97%A5%E3%80%91%E9%A3%9E%E9%B9%A4_%E4%B8%96%E7%95%8C%E6%97%85%E6%B8%B8%E6%97%A5.mp4", "icon": "homepage/tool_icon_4.png",
"_style": "width:418rpx;height: 345rpx;left: 40rpx;top: 750rpx;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/content_3.png" "type": 1,
"url": "/pages/shengzhangTools/shengzhangTools"
},
"context": "发育偏离预警早报",
"type": 1,
"title": "宝宝生长测评"
}, },
{ {
"_style": "width:263rpx;height: 324rpx;right: 40rpx;top: 1120rpx;", "icon": "homepage/tool_icon_6.png",
"link": { "link": {
"extra": {}, "extra": {},
"type": 3, "type": 3,
"url": "https://mp.weixin.qq.com/s/HhBF5h8xX8zOrthsy2-Y-A" "url": "https://ali.xudankeji.com/play/rCeXjMai"
},
"context": "测体质选奶粉",
"type": 1,
"title": "体质测试"
},
{
"icon": "homepage/tool_icon_1.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/naming/naming"
}, },
"bgUrl": "homepage/content_4.png" "context": "AI生成吉利好名",
"type": 1,
"title": "星妈起名"
} }
], ],
"toolList": { "bgUrl": "homepage/toolBg.png"
"maintitle": "工具推荐", },
"jtIcon": "homepage/tool_jt.png", "suggest": {
"subtitle": "更多妈妈都在用，告别手忙脚乱，助你轻松带娃！", "link": {
"tools": [ "type": 3,
{ "url": "https://mom.feihe.com/expertsView?from=home"
"icon": "homepage/tool_icon_7.png", }
"link": { },
"extra": {}, "channelTabList": [
"type": 1, "凯叔讲故事",
"url": "/pages/xingmaLab/xingmaLab" "品格培养",
}, "知识科普",
"context": "记录我们的珍藏时刻", "睡眠作息",
"type": 1, "宝贝喂养"
"title": "星妈会Lab" ],
}, "popupImageObj": {
{ "btnName": "立即寻宝",
"icon": "homepage/tool_icon_2.png", "jumpType": 1,
"link": { "imageUrl": "homepage/popImg/popBgImg2.jpg",
"extra": {}, "jumpExtra": {},
"type": 1, "title": "北纬47°鲜活溯源之旅",
"url": "/pages/feedingIndex/feedingIndex" "jumpUrl": "/pages/syWebview/syWebview?p=xmh11"
}, },
"context": "一键更新喂养记录", "voiceStory": {
"type": 1, "link": {
"title": "喂养工具" "type": 3,
}, "url": "https://mom.feihe.com/babyWikipedia?from=song&sourceFrom=moreTools&source=moreTools&num=1&bir=2024-05-23&monthAge=12&month=null"
{ }
"icon": "homepage/tool_icon_3.png", },
"link": { "channelTabListMianTitle": "有声频道",
"extra": {}, "swiperList": [
"type": 1, {
"url": "/pages/postnatalCheckUp/postnatalCheckUp" "videoUrl": "homepage/video3.mp4",
}, "link": {},
"context": "孕周检查准时告知", "title": "烤肉的秘密",
"type": 1, "url": "homepage/homeSwiper/V1/krdmm.jpg"
"title": "产检提醒"
},
{
"icon": "homepage/tool_icon_4.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/shengzhangTools/shengzhangTools"
},
"context": "发育偏离预警早报",
"type": 1,
"title": "宝宝生长测评"
},
{
"icon": "homepage/tool_icon_6.png",
"link": {
"extra": {},
"type": 3,
"url": "https://ali.xudankeji.com/play/rCeXjMai"
},
"context": "测体质选奶粉",
"type": 1,
"title": "体质测试"
},
{
"icon": "homepage/tool_icon_1.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/naming/naming"
},
"context": "AI生成吉利好名",
"type": 1,
"title": "星妈起名"
}
],
"bgUrl": "homepage/toolBg.png"
}, },
"suggest": { {
"videoUrl": "homepage/homeSwiper/V1/lfdxs1.mp4",
"link": {},
"title": "东北真行乡村振兴篇",
"url": "homepage/homeSwiper/V1/lfdxs.jpg"
},
{
"videoUrl": "homepage/homeSwiper/V1/dbzx1.mp4",
"link": {},
"title": "东北真行寻人",
"url": "homepage/homeSwiper/V1/dbzx.jpeg"
},
{
"videoUrl": "",
"link": { "link": {
"extra": {},
"type": 3, "type": 3,
"url": "https://mom.feihe.com/expertsView?from=home" "url": "https://fh0926-activity.dexfu.cn/customShare/share?id=Did1NjI1MzU"
},
"title": "晒出飞鹤宝宝",
"url": "homepage/homeSwiper/V1/scfhbb1.jpg"
},
{
"videoUrl": "",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "/subPackages/shopMainList/topicNew/index?id=1001146"
},
"title": "双节28会员日",
"url": "homepage/homeSwiper/V1/13.jpg"
}
],
"childrenInfoList": [
[
{
"desc2": "乙肝母婴传播可防可控，但“时间窗口”不容错过！",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/8OHpMdvbuwJPGsfdXs7aDg"
},
"isNew": false,
"desc": "新生儿出生后24小时必做！错过可能影响一生健康",
"bgUrl": "homepage/children/childrenV1/1.jpg"
},
{
"desc2": "家长通过科学抚触，不仅能激活宝宝大脑神经突触，还能为宝宝的认知力、自护力打下坚实基础。",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/vMyPcDbAmwMsZCMlW0kkDA"
},
"isNew": false,
"desc": "0-3岁宝宝触觉发育关键期，附按摩手法！",
"bgUrl": "homepage/children/childrenV1/2.jpg"
},
{
"desc2": "究竟是体质虚弱？生病了？还是缺乏某些营养元素呢？星妈会带你一次性搞懂宝宝出汗的秘密！",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/pnYVG4yTuBSbNN-fIYKrCQ"
},
"isNew": false,
"desc": "宝宝满头汗vs全身湿！小心这4种疾病，正在偷走健康！",
"bgUrl": "homepage/children/childrenV1/3.jpg"
} }
]
],
"vipConfigList": [
{
"btnTitle": "首注200元优惠券",
"subTitle": "新人礼权益",
"level": "注册会员",
"btnSubTitle": "立即注册",
"grade": "-1",
"bgUrl": "homepage/cardbg1.png"
}, },
"channelTabList": [ {
"凯叔讲故事", "btnTitle": "三甲医生在线问诊",
"品格培养", "subTitle": "免费问诊权益",
"知识科普", "btnSubTitle": "立即了解",
"睡眠作息", "grade": "0",
"宝贝喂养" "link": {
], "extra": {
"popupImageObj": { "envVersion": "release",
"btnName": "立即寻宝", "appId": "wx4205ec55b793245e"
"jumpType": 1, },
"imageUrl": "homepage/popImg/popBgImg2.jpg", "type": 2,
"jumpExtra": {}, "url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
"title": "北纬47°鲜活溯源之旅", },
"jumpUrl": "/pages/syWebview/syWebview?p=xmh11" "bgUrl": "homepage/cardbg1.png"
}, },
"voiceStory": { {
"btnTitle": "12类系列课程",
"subTitle": "育儿课程权益",
"btnSubTitle": "立即了解",
"grade": "1",
"link": { "link": {
"type": 3, "extra": {
"url": "https://mom.feihe.com/babyWikipedia?from=song&sourceFrom=moreTools&source=moreTools&num=1&bir=2024-05-23&monthAge=12&month=null" "envVersion": "release",
} "appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
},
"bgUrl": "homepage/cardbg1.png"
},
{
"btnTitle": "12类系列课程",
"subTitle": "育儿课程权益",
"btnSubTitle": "立即了解",
"grade": "2",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
},
"bgUrl": "homepage/cardbg1.png"
},
{
"btnTitle": "1分购、优惠券",
"subTitle": "月月礼权益",
"btnSubTitle": "立即了解",
"grade": "3",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
},
"bgUrl": "homepage/cardbg1.png"
}, },
"channelTabListMianTitle": "有声频道", {
"swiperList": [ "btnTitle": "1分购、优惠券",
"subTitle": "月月礼权益",
"btnSubTitle": "立即了解",
"grade": "4",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
},
"bgUrl": "homepage/cardbg1.png"
}
],
"changelInfoList": [
[
{ {
"videoUrl": "homepage/video3.mp4", "link": {
"link": {}, "extra": {},
"title": "烤肉的秘密", "type": 3,
"url": "homepage/homeSwiper/V1/krdmm.jpg" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22101&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【藏好了吗】",
"bgUrl": "homepage/channel/soundChannelV1/1/1.jpg"
}, },
{ {
"videoUrl": "homepage/homeSwiper/V1/lfdxs1.mp4", "link": {
"link": {}, "extra": {},
"title": "东北真行乡村振兴篇", "type": 3,
"url": "homepage/homeSwiper/V1/lfdxs.jpg" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22102&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【水和风和娃娃】",
"bgUrl": "homepage/channel/soundChannelV1/1/2.jpg"
}, },
{ {
"videoUrl": "homepage/homeSwiper/V1/dbzx1.mp4", "link": {
"link": {}, "extra": {},
"title": "东北真行寻人", "type": 3,
"url": "homepage/homeSwiper/V1/dbzx.jpeg" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22103&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【羽绒被】",
"bgUrl": "homepage/channel/soundChannelV1/1/3.jpg"
}, },
{ {
"videoUrl": "",
"link": { "link": {
"extra": {}, "extra": {},
"type": 3, "type": 3,
"url": "https://fh0926-activity.dexfu.cn/customShare/share?id=Did1NjI1MzU" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22104&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
}, },
"title": "晒出飞鹤宝宝", "desc": "凯叔·金子美铃童诗：【知了的外衣】",
"url": "homepage/homeSwiper/V1/scfhbb1.jpg" "bgUrl": "homepage/channel/soundChannelV1/1/4.jpg"
}, },
{ {
"videoUrl": "",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22106&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "/subPackages/shopMainList/topicNew/index?id=1001146"
}, },
"title": "双节28会员日", "desc": "凯叔·金子美铃童诗：【风】",
"url": "homepage/homeSwiper/V1/13.jpg" "bgUrl": "homepage/channel/soundChannelV1/1/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22107&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【我和小鸟和铃铛】",
"bgUrl": "homepage/channel/soundChannelV1/1/6.jpg"
} }
], ],
"childrenInfoList": [ [
[
{
"desc2": "乙肝母婴传播可防可控，但“时间窗口”不容错过！",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/8OHpMdvbuwJPGsfdXs7aDg"
},
"isNew": false,
"desc": "新生儿出生后24小时必做！错过可能影响一生健康",
"bgUrl": "homepage/children/childrenV1/1.jpg"
},
{
"desc2": "家长通过科学抚触，不仅能激活宝宝大脑神经突触，还能为宝宝的认知力、自护力打下坚实基础。",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/vMyPcDbAmwMsZCMlW0kkDA"
},
"isNew": false,
"desc": "0-3岁宝宝触觉发育关键期，附按摩手法！",
"bgUrl": "homepage/children/childrenV1/2.jpg"
},
{
"desc2": "究竟是体质虚弱？生病了？还是缺乏某些营养元素呢？星妈会带你一次性搞懂宝宝出汗的秘密！",
"link": {
"extra": {},
"type": 3,
"url": "https://mp.weixin.qq.com/s/pnYVG4yTuBSbNN-fIYKrCQ"
},
"isNew": false,
"desc": "宝宝满头汗vs全身湿！小心这4种疾病，正在偷走健康！",
"bgUrl": "homepage/children/childrenV1/3.jpg"
}
]
],
"vipConfigList": [
{ {
"btnTitle": "首注200元优惠券", "link": {
"subTitle": "新人礼权益", "extra": {},
"level": "注册会员", "type": 3,
"btnSubTitle": "立即注册", "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21891&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
"grade": "-1", },
"bgUrl": "homepage/cardbg1.png" "desc": "培养宝宝不虚荣的好品格：【红舞鞋】",
"bgUrl": "homepage/channel/soundChannelV1/2/1.jpg"
}, },
{ {
"btnTitle": "三甲医生在线问诊",
"subTitle": "免费问诊权益",
"btnSubTitle": "立即了解",
"grade": "0",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21845&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
}, },
"bgUrl": "homepage/cardbg1.png" "desc": "【动物王国】教宝宝学会爱护东西：【谁是破坏王】",
"bgUrl": "homepage/channel/soundChannelV1/2/2.jpg"
}, },
{ {
"btnTitle": "12类系列课程",
"subTitle": "育儿课程权益",
"btnSubTitle": "立即了解",
"grade": "1",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21930&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
}, },
"bgUrl": "homepage/cardbg1.png" "desc": "培养宝宝拒绝的勇气：【该说不，就说不】",
"bgUrl": "homepage/channel/soundChannelV1/2/3.jpg"
}, },
{ {
"btnTitle": "12类系列课程",
"subTitle": "育儿课程权益",
"btnSubTitle": "立即了解",
"grade": "2",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21898&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
}, },
"bgUrl": "homepage/cardbg1.png" "desc": "培养宝宝专心的好习惯：【两个青年学棋】",
"bgUrl": "homepage/channel/soundChannelV1/2/4.jpg"
}, },
{ {
"btnTitle": "1分购、优惠券",
"subTitle": "月月礼权益",
"btnSubTitle": "立即了解",
"grade": "3",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21953&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
}, },
"bgUrl": "homepage/cardbg1.png" "desc": "培养宝宝坚持的好品格：【不怕挫折的渔夫】",
"bgUrl": "homepage/channel/soundChannelV1/2/5.jpg"
}, },
{ {
"btnTitle": "1分购、优惠券",
"subTitle": "月月礼权益",
"btnSubTitle": "立即了解",
"grade": "4",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21840&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
}, },
"bgUrl": "homepage/cardbg1.png" "desc": "培养宝宝的自制力：【一次只要一个】",
"bgUrl": "homepage/channel/soundChannelV1/2/6.jpg"
} }
], ],
"changelInfoList": [ [
[ {
{ "link": {
"link": { "extra": {},
"extra": {}, "type": 3,
"type": 3, "url": "https://mom.feihe.com/calendar/parentchildsongsdetail?id=22281"
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22101&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0" },
}, "desc": "营养健康小知识：营养元素钙铁锌",
"desc": "凯叔·金子美铃童诗：【藏好了吗】", "bgUrl": "homepage/channel/soundChannelV1/3/1.jpg"
"bgUrl": "homepage/channel/soundChannelV1/1/1.jpg" },
}, {
{ "link": {
"link": { "extra": {},
"extra": {}, "type": 3,
"type": 3, "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21328&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22102&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0" },
}, "desc": "宝宝指甲长倒刺是缺维生素吗？",
"desc": "凯叔·金子美铃童诗：【水和风和娃娃】", "bgUrl": "homepage/channel/soundChannelV1/3/2.jpg"
"bgUrl": "homepage/channel/soundChannelV1/1/2.jpg" },
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22103&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【羽绒被】",
"bgUrl": "homepage/channel/soundChannelV1/1/3.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22104&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【知了的外衣】",
"bgUrl": "homepage/channel/soundChannelV1/1/4.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22106&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【风】",
"bgUrl": "homepage/channel/soundChannelV1/1/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=22107&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "凯叔·金子美铃童诗：【我和小鸟和铃铛】",
"bgUrl": "homepage/channel/soundChannelV1/1/6.jpg"
}
],
[
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21891&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "培养宝宝不虚荣的好品格：【红舞鞋】",
"bgUrl": "homepage/channel/soundChannelV1/2/1.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21845&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "【动物王国】教宝宝学会爱护东西：【谁是破坏王】",
"bgUrl": "homepage/channel/soundChannelV1/2/2.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21930&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "培养宝宝拒绝的勇气：【该说不，就说不】",
"bgUrl": "homepage/channel/soundChannelV1/2/3.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21898&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "培养宝宝专心的好习惯：【两个青年学棋】",
"bgUrl": "homepage/channel/soundChannelV1/2/4.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21953&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "培养宝宝坚持的好品格：【不怕挫折的渔夫】",
"bgUrl": "homepage/channel/soundChannelV1/2/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21840&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "培养宝宝的自制力：【一次只要一个】",
"bgUrl": "homepage/channel/soundChannelV1/2/6.jpg"
}
],
[
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/calendar/parentchildsongsdetail?id=22281"
},
"desc": "营养健康小知识：营养元素钙铁锌",
"bgUrl": "homepage/channel/soundChannelV1/3/1.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21328&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝指甲长倒刺是缺维生素吗？",
"bgUrl": "homepage/channel/soundChannelV1/3/2.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21545&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "如何分辨宝宝是攒肚还是便秘？",
"bgUrl": "homepage/channel/soundChannelV1/3/3.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21310&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "手足口疫苗有必要打吗？",
"bgUrl": "homepage/channel/soundChannelV1/3/4.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21734&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝多大开始刷牙？一定不能晚于这个时间！",
"bgUrl": "homepage/channel/soundChannelV1/3/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=25897&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "如何缓解0-6月宝宝肠绞痛？",
"bgUrl": "homepage/channel/soundChannelV1/3/6.jpg"
}
],
[
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21533&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "如何拯救睡渣宝宝？培养自主入睡？",
"bgUrl": "homepage/channel/soundChannelV1/4/1.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21602&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "开灯睡觉影响宝宝智力发育？",
"bgUrl": "homepage/channel/soundChannelV1/4/2.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21613&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝都爱“投降式睡姿”？要纠正吗？",
"bgUrl": "homepage/channel/soundChannelV1/4/3.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21494&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "娃睡得正香，要不要叫醒吃奶？",
"bgUrl": "homepage/channel/soundChannelV1/4/4.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21633&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝总夜醒怎么办？",
"bgUrl": "homepage/channel/soundChannelV1/4/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21629&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝每天睡多久合适？",
"bgUrl": "homepage/channel/soundChannelV1/4/6.jpg"
}
],
[
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21357&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝夏日拉肚子该怎么办？",
"bgUrl": "homepage/channel/soundChannelV1/5/1.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21497&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "给宝宝冲奶粉，冲稀点不上火，浓点更营养？",
"bgUrl": "homepage/channel/soundChannelV1/5/2.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21506&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "怎样辨别奶粉中含有香精？",
"bgUrl": "homepage/channel/soundChannelV1/5/3.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21455&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "怎样判断宝宝吃饱了没？",
"bgUrl": "homepage/channel/soundChannelV1/5/4.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21495&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "奶粉颜色偏黄好？还是偏白好？",
"bgUrl": "homepage/channel/soundChannelV1/5/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21489&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "冲奶粉，不能用哪种水？",
"bgUrl": "homepage/channel/soundChannelV1/5/6.jpg"
}
]
],
"bottomLinkList": [
{ {
"_style": "width:70rpx;height:109rpx;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/iconwx.png" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21545&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "如何分辨宝宝是攒肚还是便秘？",
"bgUrl": "homepage/channel/soundChannelV1/3/3.jpg"
}, },
{ {
"_style": "width:95rpx;height:109rpx;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/iconqw.png" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21310&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "手足口疫苗有必要打吗？",
"bgUrl": "homepage/channel/soundChannelV1/3/4.jpg"
}, },
{ {
"_style": "width:70rpx;height:109rpx;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/iconsph.png" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21734&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝多大开始刷牙？一定不能晚于这个时间！",
"bgUrl": "homepage/channel/soundChannelV1/3/5.jpg"
}, },
{ {
"_style": "width:88rpx;height:99rpx;", "link": {
"link": "www.baidu.com", "extra": {},
"bgUrl": "homepage/iconxhs.png" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=25897&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "如何缓解0-6月宝宝肠绞痛？",
"bgUrl": "homepage/channel/soundChannelV1/3/6.jpg"
} }
], ],
"vipCardList": [ [
{ {
"btnTitle": "12类系列课程",
"subTitle": "育儿课程权益",
"level": "钻石会员",
"btnSubTitle": "立即了解",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21533&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
}, },
"bgUrl": "homepage/cardbg1.png" "desc": "如何拯救睡渣宝宝？培养自主入睡？",
"bgUrl": "homepage/channel/soundChannelV1/4/1.jpg"
}, },
{ {
"btnTitle": "",
"showCornerTxt": "",
"subTitle": "来自万年黑土的健康食品",
"level": "北纬47°系列",
"btnSubTitle": "",
"link": { "link": {
"extra": { "extra": {},
"envVersion": "release", "type": 3,
"appId": "wx4205ec55b793245e" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21602&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"type": 2,
"url": "subPackages/shopMainList/topicNew/index?id=1000265&entrySource=xmh_wechatmp_home_recgoods"
}, },
"bgUrl": "homepage/cardbg2.png" "desc": "开灯睡觉影响宝宝智力发育？",
"bgUrl": "homepage/channel/soundChannelV1/4/2.jpg"
}, },
{ {
"btnTitle": "",
"showCornerTxt": "",
"subTitle": "专家文章、育儿知识、饮食知识",
"level": "育儿宝典",
"btnSubTitle": "",
"link": { "link": {
"extra": {}, "extra": {},
"type": 1, "type": 3,
"url": "/pages/library/ContentLibrary" "url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21613&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝都爱“投降式睡姿”？要纠正吗？",
"bgUrl": "homepage/channel/soundChannelV1/4/3.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21494&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
}, },
"bgUrl": "homepage/cardbg3.png" "desc": "娃睡得正香，要不要叫醒吃奶？",
"bgUrl": "homepage/channel/soundChannelV1/4/4.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21633&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝总夜醒怎么办？",
"bgUrl": "homepage/channel/soundChannelV1/4/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21629&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝每天睡多久合适？",
"bgUrl": "homepage/channel/soundChannelV1/4/6.jpg"
} }
], ],
"qrInfoList": [ [
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21357&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "宝宝夏日拉肚子该怎么办？",
"bgUrl": "homepage/channel/soundChannelV1/5/1.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21497&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "给宝宝冲奶粉，冲稀点不上火，浓点更营养？",
"bgUrl": "homepage/channel/soundChannelV1/5/2.jpg"
},
{ {
"qrUrl": "homepage/qrcode_gzh.png", "link": {
"title": "公众号", "extra": {},
"desc": "长按关注<span style:'color:#D3A358;'>星妈会</span>公众号，了解更多专业育儿资讯" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21506&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "怎样辨别奶粉中含有香精？",
"bgUrl": "homepage/channel/soundChannelV1/5/3.jpg"
}, },
{ {
"qrUrl": "homepage/qrcode_qw.png", "link": {
"title": "企业微信", "extra": {},
"desc": "长按添加<span style:'color:#D3A358;'>星妈管家</span>，享受专家问诊与社群福利活动" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21455&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "怎样判断宝宝吃饱了没？",
"bgUrl": "homepage/channel/soundChannelV1/5/4.jpg"
}, },
{ {
"qrUrl": "homepage/qrcode_sph.png", "link": {
"title": "视频号", "extra": {},
"desc": "扫码关注<span style:'color:#D3A358;'>星妈会</span>视频号，了解更多专业育儿资讯" "type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21495&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "奶粉颜色偏黄好？还是偏白好？",
"bgUrl": "homepage/channel/soundChannelV1/5/5.jpg"
},
{
"link": {
"extra": {},
"type": 3,
"url": "https://mom.feihe.com/babyWikipedia/audioDetail?id=21489&type=3&period_id=5&tag_id=1&navActive=1&fnTagId=0"
},
"desc": "冲奶粉，不能用哪种水？",
"bgUrl": "homepage/channel/soundChannelV1/5/6.jpg"
} }
], ]
"childrenInfoListMianTitle": "育儿智库", ],
"expertTeam": { "bottomLinkList": [
"maintitle": "专家团", {
"etConUrl2": "homepage/et_con2.png", "_style": "width:70rpx;height:109rpx;",
"etConUrl3": "homepage/et_con3.png", "link": "www.baidu.com",
"etConUrl1": "homepage/et_con11.png" "bgUrl": "homepage/iconwx.png"
},
{
"_style": "width:95rpx;height:109rpx;",
"link": "www.baidu.com",
"bgUrl": "homepage/iconqw.png"
},
{
"_style": "width:70rpx;height:109rpx;",
"link": "www.baidu.com",
"bgUrl": "homepage/iconsph.png"
},
{
"_style": "width:88rpx;height:99rpx;",
"link": "www.baidu.com",
"bgUrl": "homepage/iconxhs.png"
}
],
"vipCardList": [
{
"btnTitle": "12类系列课程",
"subTitle": "育儿课程权益",
"level": "钻石会员",
"btnSubTitle": "立即了解",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
},
"bgUrl": "homepage/cardbg1.png"
},
{
"btnTitle": "",
"showCornerTxt": "",
"subTitle": "来自万年黑土的健康食品",
"level": "北纬47°系列",
"btnSubTitle": "",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/shopMainList/topicNew/index?id=1000265&entrySource=xmh_wechatmp_home_recgoods"
},
"bgUrl": "homepage/cardbg2.png"
},
{
"btnTitle": "",
"showCornerTxt": "",
"subTitle": "专家文章、育儿知识、饮食知识",
"level": "育儿宝典",
"btnSubTitle": "",
"link": {
"extra": {},
"type": 1,
"url": "/pages/library/ContentLibrary"
},
"bgUrl": "homepage/cardbg3.png"
}
],
"qrInfoList": [
{
"qrUrl": "homepage/qrcode_gzh.png",
"title": "公众号",
"desc": "长按关注<span style:'color:#D3A358;'>星妈会</span>公众号，了解更多专业育儿资讯"
},
{
"qrUrl": "homepage/qrcode_qw.png",
"title": "企业微信",
"desc": "长按添加<span style:'color:#D3A358;'>星妈管家</span>，享受专家问诊与社群福利活动"
},
{
"qrUrl": "homepage/qrcode_sph.png",
"title": "视频号",
"desc": "扫码关注<span style:'color:#D3A358;'>星妈会</span>视频号，了解更多专业育儿资讯"
}
],
"childrenInfoListMianTitle": "育儿智库",
"expertTeam": {
"maintitle": "专家团",
"etConUrl2": "homepage/et_con2.png",
"etConUrl3": "homepage/et_con3.png",
"etConUrl1": "homepage/et_con11.png"
},
"floatIcon": {
"imageUrl": "homepage/btnclose.png",
"videoUrl": "homepage/video3.mp4",
"link": {
"extra": {
"envVersion": "release",
"appId": "wx4205ec55b793245e"
},
"type": 2,
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot"
} }
} }
\ No newline at end of file }
\ No newline at end of file
views/Brand.vue
View file @ 51549197
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
</view> </view>
</view> </view>
</view> </view>
<view class="videoposterbox"> <view class="videoposterbox" v-if="video1Channel.videoUrl">
<video v-if="video1Channel.videoUrl" ref="brandVideo1Ref" id="brandVideo1" class="videoposter" <video v-if="video1Channel.videoUrl" ref="brandVideo1Ref" id="brandVideo1" class="videoposter"
:src="$baseUrl + video1Channel.videoUrl" :autoplay="false" :data-log="{ :src="$baseUrl + video1Channel.videoUrl" :autoplay="false" :data-log="{
xcxClick: '品牌故事-次屏页面点击', xcxClick: '品牌故事-次屏页面点击',
...@@ -61,8 +61,11 @@ ...@@ -61,8 +61,11 @@
}" @tap="openChannel(video1Channel, $event)" class="videoposter" :src="$baseUrl + video1Channel.posterUrl"> }" @tap="openChannel(video1Channel, $event)" class="videoposter" :src="$baseUrl + video1Channel.posterUrl">
</image> </image>
<view class="videoposterboxtitle">{{ video1Channel.title || "" }}</view>
</view> </view>
<view id="secondScreen" class="productcontai"> <view id="secondScreen" class="productcontai"
v-if="productTabList.length > 0 && productInfoList.length > 0">
<text class="maintitle">{{ erqiPeizhi.title1 }}</text> <text class="maintitle">{{ erqiPeizhi.title1 }}</text>
<scroll-view class="listbox" scroll-x="true" show-scrollbar="false" <scroll-view class="listbox" scroll-x="true" show-scrollbar="false"
:scroll-into-view="'tab-' + channelTabIndex" :scroll-with-animation="true"> :scroll-into-view="'tab-' + channelTabIndex" :scroll-with-animation="true">
...@@ -140,7 +143,7 @@ ...@@ -140,7 +143,7 @@
</view> </view>
<view class="videoposterbox"> <view class="videoposterbox" v-if="video2Channel.videoUrl">
<video v-if="video2Channel.videoUrl" ref="brandVideo2Ref" id="brandVideo2" class="videoposter" <video v-if="video2Channel.videoUrl" ref="brandVideo2Ref" id="brandVideo2" class="videoposter"
:src="$baseUrl + video2Channel.videoUrl" :autoplay="false" :src="$baseUrl + video2Channel.videoUrl" :autoplay="false"
:poster="video2Channel.posterUrl ? $baseUrl + video2Channel.posterUrl : ''" object-fit="cover" :poster="video2Channel.posterUrl ? $baseUrl + video2Channel.posterUrl : ''" object-fit="cover"
...@@ -152,15 +155,18 @@ ...@@ -152,15 +155,18 @@
componentContent: video2Channel.title || '' componentContent: video2Channel.title || ''
}" @tap="openChannel(video2Channel, $event)" :src="$baseUrl + video2Channel.posterUrl"> }" @tap="openChannel(video2Channel, $event)" :src="$baseUrl + video2Channel.posterUrl">
</image> </image>
<view class="videoposterboxtitle">{{ video2Channel.title || "" }}</view>
</view> </view>
<view id="thirdScreen" class="ipbox" <view id="thirdScreen" class="ipbox" v-if="erqiPeizhi.appId1 && erqiPeizhi.appId2"
:style="{ background: `url(${$baseUrl}brandpage/hexiaofeiBg.png) no-repeat center/contain` }"> :style="{ background: `url(${$baseUrl}brandpage/hexiaofeiBg.png) no-repeat center/contain` }">
<!-- <store-product appid="wx1ad0903b95889ea1" product-id="10000239570622" custom-content="true"> --> <!-- <store-product appid="wx1ad0903b95889ea1" product-id="10000239570622" custom-content="true"> -->
<image :data-log="{ <image :data-log="{
xcxClick: '品牌故事-三屏页面点击', xcxClick: '品牌故事-三屏页面点击',
pageName: '品牌故事-三屏页面', pageName: '品牌故事-三屏页面',
buttonName: `全家形象` buttonName: `全家形象`
}" class="iphexiaofei" :src="erqiPeizhi.iphexiaofeiUrl"></image> }" class="iphexiaofei" @tap="jumpLink(erqiPeizhi.link, erqiPeizhi.videoUrl, $event)"
:src="erqiPeizhi.iphexiaofeiUrl">
</image>
<!-- </store-product> --> <!-- </store-product> -->
<view class="ipcard"> <view class="ipcard">
<view class="title"> <view class="title">
...@@ -172,7 +178,8 @@ ...@@ -172,7 +178,8 @@
</view> </view>
<view class="ipflex"> <view class="ipflex">
<view class="ipbg ip1" id="ip1" @tap="ipTapEvent(1, $event)"> <view class="ipbg ip1" id="ip1" @tap="ipTapEvent(1, $event)">
<store-product appid="wx1ad0903b95889ea1" product-id="10000239570622" custom-content="true"> <store-product appid={erqiPeizhi.appId1} product-id={erqiPeizhi.productId1}
custom-content="true">
<image :data-log="{ <image :data-log="{
xcxClick: '品牌故事-三屏页面点击', xcxClick: '品牌故事-三屏页面点击',
pageName: '品牌故事-三屏页面', pageName: '品牌故事-三屏页面',
...@@ -184,7 +191,7 @@ ...@@ -184,7 +191,7 @@
<view class="ipright"> <view class="ipright">
<view class="ipbg ip2" id="ip2" @tap="ipTapEvent(2, $event)"> <view class="ipbg ip2" id="ip2" @tap="ipTapEvent(2, $event)">
<store-product appid="wx1ad0903b95889ea1" product-id="10000239356280" <store-product appid={erqiPeizhi.appId2} product-id={erqiPeizhi.productId2}
custom-content="true"> custom-content="true">
<image :data-log="{ <image :data-log="{
xcxClick: '品牌故事-三屏页面点击', xcxClick: '品牌故事-三屏页面点击',
...@@ -224,7 +231,8 @@ ...@@ -224,7 +231,8 @@
<!-- <text class="subtitle">关注祖国下一代的营养、教育和陪伴</text> --> <!-- <text class="subtitle">关注祖国下一代的营养、教育和陪伴</text> -->
<view class="channelscroll"> <view class="channelscroll">
<view class="box"> <view class="box">
<view class="infobox" :key="index" v-for="(infoItem, index) in esgInfoList" :id="'esg' + (index + 1)" <view class="infobox" :key="index" v-for="(infoItem, index) in esgInfoList"
:id="'esg' + (index + 1)"
:style="{ background: `url(${$baseUrl}brandpage/esgItemBg.png) no-repeat center/505rpx 638rpx` }" :style="{ background: `url(${$baseUrl}brandpage/esgItemBg.png) no-repeat center/505rpx 638rpx` }"
:data-log="{ :data-log="{
xcxClick: `品牌故事-三屏页面点击`, xcxClick: `品牌故事-三屏页面点击`,
...@@ -372,7 +380,7 @@ export default { ...@@ -372,7 +380,7 @@ export default {
video2Channel: {}, video2Channel: {},
currentPlayingVideo: null, // 当前正在播放的视频标识 currentPlayingVideo: null, // 当前正在播放的视频标识
videoContexts: {}, // 存储视频上下文，使用id作为key videoContexts: {}, // 存储视频上下文，使用id作为key
ipExStr:['鹤小飞商品', '鹤小飞商品', '鹤小飞', '鹤小飞'], ipExStr: ['鹤小飞商品', '鹤小飞商品', '鹤小飞', '鹤小飞'],
} }
}, },
mounted() { mounted() {
...@@ -534,10 +542,10 @@ export default { ...@@ -534,10 +542,10 @@ export default {
md.sensorComponentLogTake(evt.currentTarget.dataset.comlog); md.sensorComponentLogTake(evt.currentTarget.dataset.comlog);
} }
} }
const { productId, skuId, contentImg, contentImgLen, shareTitle, shareImg, title } = item; const { productId, skuId, contentImg, contentImgLen, shareTitle, shareImg, title, link } = item;
const tabName = this.productTabList[this.channelTabIndex]; const tabName = this.productTabList[this.channelTabIndex];
if(productId && skuId){ if (productId && skuId) {
const url = `subPackages/shopMainProcess/product/index?productId=${productId}&skuId=${skuId}`; const url = `subPackages/shopMainProcess/product/index?productId=${productId}&skuId=${skuId}`;
const type = JumpType.MINI; const type = JumpType.MINI;
const extra = { const extra = {
...@@ -550,12 +558,14 @@ export default { ...@@ -550,12 +558,14 @@ export default {
jump({ jump({
type: type, type: type,
url: url, url: url,
extra:extra extra: extra
})
}else{
uni.navigateTo({
url: "/pages/product/product?productId=" + productId + "&skuId=" + skuId + "&contentImg=" + contentImg + "&contentImgLen=" + contentImgLen + "&shareTitle=" + shareTitle + "&shareImg=" + shareImg + "&tabName=" + tabName + "&title=" + title
}) })
} else {
jump(link)
// console.warn("/pages/product/product?productId=" + productId + "&skuId=" + skuId + "&contentImg=" + contentImg + "&contentImgLen=" + contentImgLen + "&shareTitle=" + shareTitle + "&shareImg=" + shareImg + "&tabName=" + tabName + "&title=" + title)
// uni.navigateTo({
// url: "/pages/product/product?productId=" + productId + "&skuId=" + skuId + "&contentImg=" + contentImg + "&contentImgLen=" + contentImgLen + "&shareTitle=" + shareTitle + "&shareImg=" + shareImg + "&tabName=" + tabName + "&title=" + title
// })
} }
}, },
channelTabHandler(_index, evt) { channelTabHandler(_index, evt) {
...@@ -665,7 +675,7 @@ export default { ...@@ -665,7 +675,7 @@ export default {
openChannel(videoChannel, evt) { openChannel(videoChannel, evt) {
if (evt) { if (evt) {
md.sensorLog(evt); md.sensorLog(evt);
if (evt.currentTarget.dataset.comlog) { if (evt.currentTarget.dataset.comlog) {
md.sensorComponentLogTake(evt.currentTarget.dataset.comlog); md.sensorComponentLogTake(evt.currentTarget.dataset.comlog);
} }
} }
...@@ -947,8 +957,28 @@ export default { ...@@ -947,8 +957,28 @@ export default {
object-fit: cover; object-fit: cover;
} }
.videoposterboxtitle {
font-size: 28rpx;
color: #ffffff;
font-weight: 500;
margin-left: 20rpx;
line-height: 1.4;
margin-top: -56rpx;
z-index: 2;
position: relative;
// padding: 8rpx 16rpx;
// background-color: rgba(0, 0, 0, 0.5);
border-radius: 8rpx;
width: 476rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
} }
.productcontai { .productcontai {
margin-top: 32rpx; margin-top: 32rpx;
margin-left: 32rpx; margin-left: 32rpx;
......
views/Home.vue
View file @ 51549197
<template> <template>
<view class="home-container" @scroll="onPageScroll"> <view class="home-container" @scroll="onPageScroll">
<!-- 可拖拽悬浮图片 -->
<view class="floating-image-container" v-if="floatIcon.imageUrl"
:style="{ left: floatIconPosition.left + 'px', top: floatIconPosition.top + 'px' }"
@touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="onTouchEnd" @tap="onfloatIconClick">
<image class="floating-image" :src="$baseUrl + floatIcon.imageUrl"></image>
</view>
<view class="content"> <view class="content">
<swiper id="firstScreen" class="swiper banner" circular :autoplay="autoplay" :interval="interval" <swiper id="firstScreen" class="swiper banner" circular :autoplay="autoplay" :interval="interval"
:duration="duration" :indicator-dots="false" @change="onBannerSwiperChange"> :duration="duration" :indicator-dots="false" @change="onBannerSwiperChange">
...@@ -50,7 +56,7 @@ ...@@ -50,7 +56,7 @@
</view> --> </view> -->
<!--推荐工具--> <!--推荐工具-->
<view class="tools_box"> <view v-if="toolList?.tools?.length > 0" class="tools_box">
<view class="tools_maintitle">{{ toolList.maintitle }}</view> <view class="tools_maintitle">{{ toolList.maintitle }}</view>
<view class="tools_subtitle">{{ toolList.subtitle }}</view> <view class="tools_subtitle">{{ toolList.subtitle }}</view>
<swiper :vertical="false" :circular="true" class="tool_swiper" :display-multiple-items="1.65" <swiper :vertical="false" :circular="true" class="tool_swiper" :display-multiple-items="1.65"
...@@ -63,10 +69,10 @@ ...@@ -63,10 +69,10 @@
open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber" class="sq_btn"></button> --> open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber" class="sq_btn"></button> -->
<image class="tool_bg" :src="$baseUrl + item.icon" @tap="handleToolClick(item)"> <image class="tool_bg" :src="$baseUrl + item.icon" @tap="handleToolClick(item)">
</image> </image>
<!-- <image class="tool_icon" :src="$baseUrl + item.icon"></image> <!-- <image class="tool_icon" :src="$baseUrl + item.icon"></image> -->
<image class="tool_jt" :src="$baseUrl + toolList.jtIcon"></image> <!-- <image class="tool_jt" :src="$baseUrl + toolList.jtIcon"></image> -->
<view class="tool_title">{{ item.title }}</view> <view class="tool_title">{{ item.title }}</view>
<view class="tool_context">{{ item.context }}</view> --> <view class="tool_context">{{ item.context }}</view>
</view> </view>
</swiper-item> </swiper-item>
</swiper> </swiper>
...@@ -177,7 +183,7 @@ ...@@ -177,7 +183,7 @@
</view> --> </view> -->
<view id="childrenInfoList" class="channelbox"> <view v-if="childrenInfoList.length > 0" id="childrenInfoList" class="channelbox">
<text class="maintitle">{{ childrenInfoListMianTitle }}</text> <text class="maintitle">{{ childrenInfoListMianTitle }}</text>
<view class="subtitle_box"> <view class="subtitle_box">
<text class="subtitle">从专业到实用，一站式解决你的育儿难题</text> <text class="subtitle">从专业到实用，一站式解决你的育儿难题</text>
...@@ -281,12 +287,12 @@ ...@@ -281,12 +287,12 @@
pageName: '首页-四屏', pageName: '首页-四屏',
buttonName: `${qrNameList[index]}` buttonName: `${qrNameList[index]}`
}" :data-comlog="{ }" :data-comlog="{
xcxComponentClick: 'true', xcxComponentClick: 'true',
xcxComponentExposure: 'true', xcxComponentExposure: 'true',
pageName: '首页', pageName: '首页',
componentName: '跳转工具', componentName: '跳转工具',
componentContent: `${qrNameList[index]}` componentContent: `${qrNameList[index]}`
}" :src="$baseUrl + icon.bgUrl" :style="icon._style" @tap="showPopup(index, $event)"></image> }" :src="$baseUrl + icon.bgUrl" :style="icon._style" @tap="showPopup(index, $event)"></image>
</view> </view>
</view> </view>
</view> </view>
...@@ -329,1629 +335,1758 @@ ...@@ -329,1629 +335,1758 @@
<script> <script>
import { import {
jump, jump,
JumpType JumpType
} from '../utils'; } from '../utils';
import { import {
useHomeStore useHomeStore
} from '../stores/home'; } from '../stores/home';
import { import {
fetchHomeJSON fetchHomeJSON
} from '../api/home'; } from '../api/home';
import { import {
useUserStore useUserStore
} from '../stores/user'; } from '../stores/user';
import RegisterLayer from "../components/RegisterLayer.vue"; import RegisterLayer from "../components/RegisterLayer.vue";
import md from '../md'; import md from '../md';
import ExposureTracker from '../utils/exposure'; import ExposureTracker from '../utils/exposure';
import { import {
getHealthField getHealthField
} from "@/api/common"; } from "@/api/common";
// const homeStore = useHomeStore(); // const homeStore = useHomeStore();
const userStore = useUserStore(); const userStore = useUserStore();
// 定义需要曝光检测的元素配置 // 定义需要曝光检测的元素配置
const EXPOSURE_CONFIGS = [{ const EXPOSURE_CONFIGS = [{
id: 'firstScreen', id: 'firstScreen',
logParams: { logParams: {
xcxPage: '首页-首屏页面浏览', xcxPage: '首页-首屏页面浏览',
pageName: '首页-首屏' pageName: '首页-首屏'
} }
},
// 可以添加更多需要曝光检测的元素配置
{
id: 'secondScreen',
logParams: {
xcxPage: '首页-二屏页面浏览',
pageName: '首页-二屏'
}
},
{
id: 'thirdScreen',
logParams: {
xcxPage: '首页-三屏页面浏览',
pageName: '首页-三屏'
}
},
{
id: 'fourthScreen',
logParams: {
xcxPage: '首页-四屏页面浏览',
pageName: '首页-四屏'
}
}
];
export default {
beforeDestroy() {
if (this.exposureTracker) {
this.exposureTracker.resetAllExposure();
}
},
deactivated() {
if (this.exposureTracker) {
this.exposureTracker.resetAllExposure();
}
},
data() {
return {
popType: 'bottom',
// 悬浮图片位置配置
floatIconPosition: {
left: 300, // 初始左位置
top: 500 // 初始上位置
},
// 悬浮图片相关配置
floatIcon: {
// imageUrl: 'homepage/btnclose.png',
// link: {
// extra: {
// envVersion: 'release',
// appId: 'wx4205ec55b793245e'
// },
// type: 2,
// url: 'subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot'
// },
// videoUrl: 'homepage/video3.mp4'
},
isDragging: false, // 是否正在拖拽
touchStartX: 0, // 触摸开始X坐标
touchStartY: 0, // 触摸开始Y坐标
statusBarHeight: 38,
showRegisterLayer: false,
swiperList: [],
indicatorDots: true,
autoplay: true,
interval: 4000,
duration: 500,
indicatoractiveColor: "#a6a0a1",
indicatorColor: "rgba(255, 255, 255, 1)",
toolList: {},
expertTeam: {},
vipCardList: [],
contentImgList: [],
channelTabList: [],
channelTabIndex: 0,
changelInfoList: [],
childrenInfoList: [],
bottomLinkList: [],
qrInfoObj: undefined,
popupIndex: 0,
qrInfoList: [{
title: '',
desc: '',
qrUrl: ''
}, {
title: '',
desc: '',
qrUrl: ''
}, {
title: '',
desc: '',
qrUrl: ''
}, {
title: '',
desc: '',
qrUrl: ''
}],
qrObj: {
title: '',
desc: '',
qrUrl: ''
},
showVideo: false,
currentVideoUrl: '',
isClickPhoneAuth: false,
voiceStory: {},
suggest: {},
videoHeight: '56vw',
qrNameList: ['公众号', '企业微信', '视频号', '小红书'],
windowHeight: 0,
isFirstScreenExposed: false,
scrollTimer: null,
exposureTracker: null,
currentIndex: 0,
etTabSelIndex: 0,
bannerCurrentIndex: 0,
childrenInfoListMianTitle: '',
channelTabListMianTitle: '',
popupImageUrl: '',
popupImageObj: {},
}
},
components: {
RegisterLayer
},
computed: {
homeStore() {
return useHomeStore();
}
},
props: {
scrollTop: {
type: Number,
default: 0
}
},
watch: {
homeStore: {
handler(newVal) {
this.showRegisterLayer = this.isClickPhoneAuth && newVal.isLogin && !newVal.babyExistence;
if (newVal.homeInfo !== null) {
this.initHomeInfo();
this.checkAndShowPopup();
}
},
deep: true,
immediate: true
}, },
// 可以添加更多需要曝光检测的元素配置 scrollTop: {
{ handler(newVal) {
id: 'secondScreen', this.checkExposure(newVal);
logParams: {
xcxPage: '首页-二屏页面浏览',
pageName: '首页-二屏'
} }
}
},
mounted() {
const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
this.statusBarHeight = menuButtonInfo.top;
this.isClickPhoneAuth = false;
// 获取窗口高度
const systemInfo = uni.getSystemInfoSync();
this.windowHeight = systemInfo.windowHeight;
// 初始化曝光检测工具
this.exposureTracker = new ExposureTracker(this);
this.exposureTracker.addExposureElements(EXPOSURE_CONFIGS);
// 初始检查曝光
this.$nextTick(() => {
this.checkExposure(this.scrollTop);
});
},
unmounted() {
// 组件销毁时清理弹窗状态（可选，根据业务需求决定是否保留状态）
// 如果需要重置弹窗状态，可以在这里调用 this.resetPopupState()
},
methods: {
testSource() {
uni.navigateTo({
url: '/pages/syWebview/syWebview?p=xmh'
})
}, },
{ async initHomeInfo() {
id: 'thirdScreen', const {
logParams: { data
xcxPage: '首页-三屏页面浏览', } = await fetchHomeJSON();
pageName: '首页-三屏' console.warn("data", data)
if (data) {
this.swiperList = data.swiperList;
this.vipConfigList = data.vipConfigList;
// this.vipCardList = data.vipCardList;
this.contentImgList = data.contentImgList;
this.channelTabList = data.channelTabList;
this.changelInfoList = data.changelInfoList;
this.childrenInfoList = data.childrenInfoList[0] || [];
this.bottomLinkList = data.bottomLinkList;
this.qrInfoList = data.qrInfoList || [];
this.toolList = data.toolList;
this.expertTeam = data.expertTeam;
this.vipCardList = data.vipCardList;
this.voiceStory = data.voiceStory;
this.suggest = data.suggest;
this.childrenInfoListMianTitle = data.childrenInfoListMianTitle;
this.channelTabListMianTitle = data.channelTabListMianTitle;
this.popupImageUrl = this.$baseUrl + data.popupImageObj?.imageUrl || '';
this.popupImageObj = data.popupImageObj || {};
this.floatIcon = data.floatIcon || {};
if (this.homeStore.isLogin) {
this.vipCardList[0] = data.vipConfigList.find(item => item.grade === this.homeStore.homeInfo
?.grade);
this.vipCardList[0].level = this.homeStore.homeInfo?.gradeName;
} else {
this.vipCardList[0] = data.vipConfigList[0];
}
//拿到数据之后，初始化曝光一些节点
this.initExposure();
} }
}, },
{ initExposure() {
id: 'fourthScreen', const componentContent = this.toolList.tools?.[this.currentIndex]?.title || '';
logParams: { md.sensorComponentLogTake({
xcxPage: '首页-四屏页面浏览', xcxComponentExposure: "true",
pageName: '首页-四屏' pageName: "首页",
} componentName: "工具推荐",
} componentContent: componentContent
]; });
md.sensorComponentLogTake({
xcxComponentExposure: "true",
pageName: "首页",
componentName: "首页banner",
componentContent: this.swiperList[0]?.title || ''
});
export default { const childrenInfoList = this.childrenInfoList;
beforeDestroy() { childrenInfoList.forEach((item, index) => {
if (this.exposureTracker) { this.exposureTracker.addExposureElement({
this.exposureTracker.resetAllExposure(); id: 'childrenInfoList' + index,
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '育儿智库',
componentContent: item.desc
}
});
});
this.qrNameList.forEach((item, index) => {
this.exposureTracker.addExposureElement({
id: 'bottomLink' + index,
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '跳转工具',
componentContent: `${item}`
}
});
});
//动态添加专家团的首屏数据
this.exposureTracker.addExposureElements([{
id: 'expertTeam',
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '专家团',
componentContent: '专家团tab切换-名医专家'
}
},
{
id: 'et_joingroup',
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '专家团',
componentContent: '专家团-进群咨询'
}
}, {
id: 'et_more',
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '专家团',
componentContent: '专家团-查看更多'
}
}, {
id: 'childrenInfoList',
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '育儿智库',
componentContent: '育儿智库'
}
},
{
id: 'childrenInfoListMore',
logParams: {
xcxComponentExposure: 'true',
pageName: '首页',
componentName: '育儿智库',
componentContent: '育儿智库-more'
}
} }
]);
}, },
deactivated() { changeIndicatorDots(e) {
if (this.exposureTracker) { this.indicatorDots = !this.indicatorDots
this.exposureTracker.resetAllExposure(); },
changeAutoplay(e) {
this.autoplay = !this.autoplay
},
intervalChange(e) {
this.interval = e.target.value
},
durationChange(e) {
this.duration = e.target.value
},
jumpBannerHandler(item, index) {
console.log("item====", item)
md.sensorLogTake({
xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏',
buttonName: `第${index + 1}张焦点图-入口`,
});
md.sensorComponentLogTake({
xcxComponentClick: "true",
pageName: "首页",
componentName: "首页banner",
componentContent: item.title
});
if (item.videoUrl) {
this.currentVideoUrl = this.$baseUrl + item.videoUrl;
this.showVideo = true;
return;
}
if (item.link) {
// 有 link，执行跳转
jump(item.link);
} else {
// 没有 link，预览图片
uni.previewImage({
urls: [this.$baseUrl + item.url], // 预览当前图片
current: this.$baseUrl + item.url // 当前显示的图片
});
} }
}, },
data() { previewImage(url) {
return { uni.previewImage({
popType: 'bottom', urls: [url], // 预览当前图片
statusBarHeight: 38, current: url // 当前显示的图片
showRegisterLayer: false, });
swiperList: [], },
indicatorDots: true, jumpLinkWithLogin(link, evt) {
autoplay: true, if (evt) {
interval: 4000, md.sensorLog(evt);
duration: 500, }
indicatoractiveColor: "#a6a0a1", if (this.homeStore.isLogin) {
indicatorColor: "rgba(255, 255, 255, 1)", jump(link);
toolList: {},
expertTeam: {},
vipCardList: [],
contentImgList: [],
channelTabList: [],
channelTabIndex: 0,
changelInfoList: [],
childrenInfoList: [],
bottomLinkList: [],
qrInfoObj: undefined,
popupIndex: 0,
qrInfoList: [{
title: '',
desc: '',
qrUrl: ''
}, {
title: '',
desc: '',
qrUrl: ''
}, {
title: '',
desc: '',
qrUrl: ''
}, {
title: '',
desc: '',
qrUrl: ''
}],
qrObj: {
title: '',
desc: '',
qrUrl: ''
},
showVideo: false,
currentVideoUrl: '',
isClickPhoneAuth: false,
voiceStory: {},
suggest: {},
videoHeight: '56vw',
qrNameList: ['公众号', '企业微信', '视频号', '小红书'],
windowHeight: 0,
isFirstScreenExposed: false,
scrollTimer: null,
exposureTracker: null,
currentIndex: 0,
etTabSelIndex: 0,
bannerCurrentIndex: 0,
childrenInfoListMianTitle: '',
channelTabListMianTitle: '',
popupImageUrl: '',
popupImageObj: {},
} }
}, },
components: { jumpLinkCard(item, evt) {
RegisterLayer if (evt) {
md.sensorLog(evt);
}
if (item.btnSubTitle.length > 0 && item.btnTitle.length > 0) {
return; //如果有按钮的话，废弃这个点击事件
}
if (item.link) {
jump(item.link);
}
}, },
computed: { jumpLink(link, videoUrl, index, evt) {
homeStore() { if (evt) {
return useHomeStore(); md.sensorLog(evt);
if (evt.currentTarget.dataset.comlog) {
md.sensorComponentLog(evt);
}
}
if (videoUrl) {
if (videoUrl.indexOf('http') === -1) {
videoUrl = this.$baseUrl + videoUrl;
}
// 弹出视频
this.currentVideoUrl = videoUrl;
if (index === 1) {
this.videoHeight = "100vw";
} else {
this.videoHeight = "56vw";
}
this.showVideo = true;
return;
// 视频弹窗出现后，video标签的autoplay会自动播放
} else if (link) {
if (!link || link === '') {
return;
}
// 其他跳转逻辑
jump(link);
} }
}, },
props: { channelTabHandler(_index, evt) {
scrollTop: { if (evt) {
type: Number, md.sensorLog(evt);
default: 0
} }
this.channelTabIndex = _index;
}, },
watch: { showPopup(_index, evt) {
homeStore: { if (evt) {
handler(newVal) { md.sensorLog(evt);
this.showRegisterLayer = this.isClickPhoneAuth && newVal.isLogin && !newVal.babyExistence; if (evt.currentTarget.dataset.comlog) {
if (newVal.homeInfo !== null) { md.sensorComponentLog(evt);
this.initHomeInfo();
this.checkAndShowPopup();
}
},
deep: true,
immediate: true
},
scrollTop: {
handler(newVal) {
this.checkExposure(newVal);
} }
} }
md.sensorLogTake({
xcxPage: `${this.qrNameList[_index]}拉起半屏二维码入口页面浏览`,
pageName: `${this.qrNameList[_index]}拉起半屏二维码入口`,
});
if (_index === 3) {
this.qrObj = null;
} else {
_index = Math.max(0, Math.min(_index, this.qrInfoList.length - 1));
this.qrObj = this.qrInfoList[_index];
}
this.popupIndex = _index;
this.$refs.popup.open(this.popType);
}, },
mounted() { showPopup1(_index, type) {
const menuButtonInfo = wx.getMenuButtonBoundingClientRect(); md.sensorLogTake({
this.statusBarHeight = menuButtonInfo.top; xcxClick: `首页-二屏页面点击`,
this.isClickPhoneAuth = false; pageName: `首页-二屏`,
buttonName: type == 1 ? '专家团副标题点击' : '专家团进群咨询按钮点击'
// 获取窗口高度
const systemInfo = uni.getSystemInfoSync();
this.windowHeight = systemInfo.windowHeight;
// 初始化曝光检测工具
this.exposureTracker = new ExposureTracker(this);
this.exposureTracker.addExposureElements(EXPOSURE_CONFIGS);
// 初始检查曝光
this.$nextTick(() => {
this.checkExposure(this.scrollTop);
}); });
if (type == 2) {
md.sensorComponentLogTake({
xcxComponentClick: "true",
pageName: "首页",
componentName: "专家团",
componentContent: '专家团-进群咨询'
});
}
if (_index === 3) {
this.qrObj = null;
} else {
_index = Math.max(0, Math.min(_index, this.qrInfoList.length - 1));
this.qrObj = this.qrInfoList[_index];
}
this.popupIndex = _index;
this.$refs.popup.open(this.popType);
},
closePop() {
this.$refs.popup.close();
}, },
unmounted() { goSearchHandler(e) {
// 组件销毁时清理弹窗状态（可选，根据业务需求决定是否保留状态） md.sensorLog(e);
// 如果需要重置弹窗状态，可以在这里调用 this.resetPopupState() uni.navigateTo({
url: "/pages/search/search"
})
}, },
methods: { downloadHandler(imgurl) {
md.sensorLogTake({
xcxClick: `${this.qrNameList[this.popupIndex]}拉起半屏二维码入口页面点击`,
pageName: `${this.qrNameList[this.popupIndex]}拉起半屏二维码入口页面点击`,
buttonName: `下载二维码`
});
testSource() { uni.downloadFile({
uni.navigateTo({ url: imgurl,
url: '/pages/syWebview/syWebview?p=xmh' success: (downloadRes) => {
}) if (downloadRes.statusCode === 200) {
}, uni.saveImageToPhotosAlbum({
async initHomeInfo() { filePath: downloadRes.tempFilePath,
const { success: (res) => {
data uni.showToast({
} = await fetchHomeJSON(); title: '保存成功',
console.warn("data", data) icon: 'success'
if (data) { });
this.swiperList = data.swiperList; },
this.vipConfigList = data.vipConfigList; fail: (err) => {
// this.vipCardList = data.vipCardList; uni.showToast({
this.contentImgList = data.contentImgList; title: '保存失败',
this.channelTabList = data.channelTabList; icon: 'none'
this.changelInfoList = data.changelInfoList; });
this.childrenInfoList = data.childrenInfoList[0] || []; }
this.bottomLinkList = data.bottomLinkList; });
this.qrInfoList = data.qrInfoList || [];
this.toolList = data.toolList;
this.expertTeam = data.expertTeam;
this.vipCardList = data.vipCardList;
this.voiceStory = data.voiceStory;
this.suggest = data.suggest;
this.childrenInfoListMianTitle = data.childrenInfoListMianTitle;
this.channelTabListMianTitle = data.channelTabListMianTitle;
this.popupImageUrl = this.$baseUrl + data.popupImageObj?.imageUrl || '';
this.popupImageObj = data.popupImageObj || {};
if (this.homeStore.isLogin) {
this.vipCardList[0] = data.vipConfigList.find(item => item.grade === this.homeStore.homeInfo
?.grade);
this.vipCardList[0].level = this.homeStore.homeInfo?.gradeName;
} else { } else {
this.vipCardList[0] = data.vipConfigList[0]; uni.showToast({
title: '下载失败',
icon: 'none'
});
} }
//拿到数据之后，初始化曝光一些节点 },
this.initExposure(); fail: (err) => {
uni.showToast({
title: '下载失败',
icon: 'none'
});
} }
}, });
initExposure() { },
const componentContent = this.toolList.tools?.[this.currentIndex]?.title || ''; closeVideo() {
md.sensorComponentLogTake({ this.showVideo = false;
xcxComponentExposure: "true", this.currentVideoUrl = '';
pageName: "首页", },
componentName: "工具推荐", onGetPhoneNumber(e) {
componentContent: componentContent if (e.detail.errMsg !== 'getPhoneNumber:ok') {
}); uni.showToast({
md.sensorComponentLogTake({ title: '请授权使用手机号',
xcxComponentExposure: "true", icon: 'none',
pageName: "首页",
componentName: "首页banner",
componentContent: this.swiperList[0]?.title || ''
}); });
return;
}
console.log('detail', e.detail);
this.isClickPhoneAuth = true;
userStore.phoneCallback(e.detail);
},
goCustomerHandler(e) {
md.sensorLog(e);
const {
memberId,
mobile,
openId,
unionId
} = this.homeStore.homeInfo;
const customerUrl =
`https://intelcc-user.icsoc.net/?channelKey=45839e0505554f8c8aea3c7b6259b049&init=1&crmld=${memberId}&mobile=${mobile}&openId=${openId}&unionId=${unionId}`;
jump({
type: JumpType.H5,
url: customerUrl
});
},
checkExposure(scrollTop) {
if (this.exposureTracker) {
this.exposureTracker.checkExposure(scrollTop);
}
},
resetExposure() {
if (this.exposureTracker) {
this.exposureTracker.resetAllExposure();
}
},
const childrenInfoList = this.childrenInfoList; onSwiperChange(e) {
childrenInfoList.forEach((item, index) => { this.currentIndex = e.detail.current;
this.exposureTracker.addExposureElement({ const componentContent = this.toolList.tools?.[this.currentIndex]?.title || '';
id: 'childrenInfoList' + index, md.sensorComponentLogTake({
logParams: { xcxComponentExposure: "true",
xcxComponentExposure: 'true', pageName: "首页",
pageName: '首页', componentName: "工具推荐",
componentName: '育儿智库', componentContent: componentContent
componentContent: item.desc });
} },
onBannerSwiperChange(e) {
this.bannerCurrentIndex = e.detail.current;
md.sensorComponentLogTake({
xcxComponentExposure: "true",
pageName: "首页",
componentName: "首页banner",
componentContent: this.swiperList[e.detail.current].title
});
},
async handleToolClick(item) {
md.sensorLogTake({
xcxClick: "首页-二屏页面点击",
pageName: "首页-二屏",
buttonName: item.title + "工具点击",
});
md.sensorComponentLogTake({
xcxComponentClick: "true",
pageName: "首页",
componentName: "工具推荐",
componentContent: item.title
});
if (item.title === "医生问诊") {
// if (!cfgStatus.value.isRegister) return;
const res = await getHealthField();
if (!res.success) {
uni.showToast({
title: "获取健康字段失败",
icon: "none",
}); });
return;
}
const {
sign,
timestamp,
appId,
partnerUserId,
env
} = res.data;
jump({
type: JumpType.MINI,
url: "/pages/partner/redirect",
extra: {
appId: "wx81ecfb5aa3fb512f",
envVersion: env,
extraData: {
sign, // 参考 4.请求参数
timestamp, // 参考 4.请求参数
appId, // 参考 4.请求参数
partnerUserId, // 参考 4.请求参数
targetApp: "/h5/partner/shining-like-a-start/landing-free-consult?sysType=CRF",
},
},
}); });
this.qrNameList.forEach((item, index) => { } else {
this.exposureTracker.addExposureElement({ jump({
id: 'bottomLink' + index, type: item.link.type,
logParams: { url: item.link.url,
xcxComponentExposure: 'true', extra: item.link.extra,
pageName: '首页',
componentName: '跳转工具',
componentContent: `${item}`
}
});
}); });
}
},
//动态添加专家团的首屏数据 onSelEtTap(index) {
this.exposureTracker.addExposureElements([{ let str = index === 0 ? '名医专家' : (index === 1 ? '科研专家' : '权威机构')
id: 'expertTeam', md.sensorLogTake({
logParams: { xcxClick: "首页-二屏页面点击",
xcxComponentExposure: 'true', pageName: "首页-二屏",
pageName: '首页', buttonName: str + "tab按钮点击",
componentName: '专家团', });
componentContent: '专家团tab切换-名医专家' md.sensorComponentLogTake({
} xcxComponentClick: "true",
}, xcxComponentExposure: "true",
{ pageName: "首页",
id: 'et_joingroup', componentName: "专家团",
logParams: { componentContent: '专家团tab切换-' + str
xcxComponentExposure: 'true', });
pageName: '首页',
componentName: '专家团', this.etTabSelIndex = index;
componentContent: '专家团-进群咨询' },
} onETMore(index, type) {
}, { let str = '';
id: 'et_more', if (type === 0) {
logParams: { str = '名医专家';
xcxComponentExposure: 'true', } else if (type === 1) {
pageName: '首页', str = '科研专家';
componentName: '专家团', } else {
componentContent: '专家团-查看更多' str = '权威机构';
} }
}, { if (index === 1) {
id: 'childrenInfoList', str += '内容'
logParams: { } else {
xcxComponentExposure: 'true', str += '点击查看更多';
pageName: '首页', }
componentName: '育儿智库', md.sensorLogTake({
componentContent: '育儿智库' xcxClick: "首页-二屏页面点击",
} pageName: "首页-二屏",
}, buttonName: str + "-点击",
{ });
id: 'childrenInfoListMore', md.sensorComponentLogTake({
logParams: { xcxComponentClick: "true",
xcxComponentExposure: 'true', pageName: "首页",
pageName: '首页', componentName: "专家团",
componentName: '育儿智库', componentContent: str
componentContent: '育儿智库-more' });
} jump({
} type: 1,
url: '/pages/expertTeamPage/expertTeamPage?tab=' + (this.etTabSelIndex + 1)
});
},
closeImagePopup() {
this.$refs.imagePopup.close();
},
]); imagePopupJump() {
md.sensorPopLogTake({
xcxPopClick: "true",
toolName: "首页",
popName: this.popupImageObj.title || "北纬47°鲜活溯源之旅",
buttonName: this.popupImageObj.btnName || "立即寻宝"
});
jump({
type: this.popupImageObj.jumpType,
url: this.popupImageObj.jumpUrl,
extra: this.popupImageObj.jumpExtra
});
},
showImagePopup() {
md.sensorPopLogTake({
xcxPopExposure: "true",
toolName: "首页",
popName: this.popupImageObj.title || "北纬47°鲜活溯源之旅"
});
this.$refs.imagePopup.open('center');
},
closePop1() {
this.$refs.imagePopup.close();
},
}, // 重置弹窗状态（可在需要时调用）
changeIndicatorDots(e) { resetPopupState() {
this.indicatorDots = !this.indicatorDots this.homeStore.resetPopupState(); // 重置 store 中的弹窗状态
}, },
changeAutoplay(e) {
this.autoplay = !this.autoplay // 检查并显示弹窗（使用 store 全局状态管理）
}, checkAndShowPopup() {
intervalChange(e) { // 使用 store 中的 hasShownPopup 来记录是否已经显示过弹窗
this.interval = e.target.value if (!this.homeStore.hasShownPopup && this.homeStore.homeInfo?.showPop1) {
}, this.homeStore.markPopupAsShown(); // 标记已显示过弹窗（全局状态）
durationChange(e) { this.$nextTick(() => {
this.duration = e.target.value setTimeout(() => {
}, this.showImagePopup();
jumpBannerHandler(item, index) { }, 500);
console.log("item====", item)
md.sensorLogTake({
xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏',
buttonName: `第${index + 1}张焦点图-入口`,
}); });
}
},
// 悬浮图片拖拽相关方法
onTouchStart(e) {
this.isDragging = false;
this.touchStartX = e.touches[0].clientX;
this.touchStartY = e.touches[0].clientY;
},
onTouchMove(e) {
// 防止触发页面滚动
e.stopPropagation();
// 判断是否为拖拽操作
const deltaX = Math.abs(e.touches[0].clientX - this.touchStartX);
const deltaY = Math.abs(e.touches[0].clientY - this.touchStartY);
// 如果移动距离超过10px，则认为是拖拽
if (deltaX > 10 || deltaY > 10) {
this.isDragging = true;
// 获取窗口尺寸
const windowWidth = wx.getSystemInfoSync().windowWidth;
const windowHeight = wx.getSystemInfoSync().windowHeight;
// 计算新位置（限制在窗口范围内）
let newLeft = e.touches[0].clientX - 37.5; // 37.5是75的一半
let newTop = e.touches[0].clientY - 37.5;
// 限制在窗口范围内
newLeft = Math.max(0, Math.min(newLeft, windowWidth - 75));
newTop = Math.max(0, Math.min(newTop, windowHeight - 75));
// 更新位置
this.floatIconPosition.left = newLeft;
this.floatIconPosition.top = newTop;
}
},
onTouchEnd() {
// 拖拽结束后的处理
},
// 悬浮图片点击事件
onfloatIconClick() {
// 如果正在拖拽，则不触发点击事件
if (!this.isDragging) {
// 记录点击日志
md.sensorComponentLogTake({ md.sensorComponentLogTake({
xcxComponentClick: "true", xcxComponentClick: "true",
pageName: "首页", pageName: "首页",
componentName: "首页banner", componentName: "悬浮图片",
componentContent: item.title componentContent: "点击悬浮图片"
}); });
if (item.videoUrl) {
this.currentVideoUrl = this.$baseUrl + item.videoUrl; if (this.floatIcon.videoUrl) {
// 播放视频
this.currentVideoUrl = this.$baseUrl + this.floatIcon.videoUrl;
this.showVideo = true; this.showVideo = true;
return; return;
} else if (this.floatIcon.link) {
// 执行跳转
jump(this.floatIcon.link);
} }
if (item.link) { }
// 有 link，执行跳转 }
jump(item.link); }
} else { }
// 没有 link，预览图片 </script>
uni.previewImage({
urls: [this.$baseUrl + item.url], // 预览当前图片 <style lang="less" scoped>
current: this.$baseUrl + item.url // 当前显示的图片 @import '@/common.less';
});
} .home-container {
}, width: 100vw;
previewImage(url) { overflow-x: hidden;
uni.previewImage({ background-color: white;
urls: [url], // 预览当前图片 position: relative;
current: url // 当前显示的图片
}); // 可拖拽悬浮图片样式
}, .floating-image-container {
jumpLinkWithLogin(link, evt) { position: fixed;
if (evt) { width: 75px;
md.sensorLog(evt); height: 75px;
} z-index: 999;
if (this.homeStore.isLogin) { touch-action: none; // 禁止默认触摸行为
jump(link); border-radius: 50%;
} background-color: rgba(255, 255, 255, 0.9);
}, box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
jumpLinkCard(item, evt) { display: flex;
if (evt) { align-items: center;
md.sensorLog(evt); justify-content: center;
padding: 5px;
transition: all 0.3s ease;
&:active {
transform: scale(0.95);
}
}
.floating-image {
width: 100%;
height: 100%;
}
.content {
background-color: white;
padding-bottom: 200rpx;
.banner {
height: 1116rpx;
.banneritem {
width: 750rpx;
height: 1116rpx;
.b-img {
width: 100%;
height: 100%;
} }
if (item.btnSubTitle.length > 0 && item.btnTitle.length > 0) { }
return; //如果有按钮的话，废弃这个点击事件 }
}
if (item.link) {
jump(item.link);
}
},
jumpLink(link, videoUrl, index, evt) {
if (evt) {
md.sensorLog(evt);
if (evt.currentTarget.dataset.comlog) {
md.sensorComponentLog(evt);
}
}
if (videoUrl) {
if (videoUrl.indexOf('http') === -1) {
videoUrl = this.$baseUrl + videoUrl;
}
// 弹出视频
this.currentVideoUrl = videoUrl;
if (index === 1) {
this.videoHeight = "100vw";
} else {
this.videoHeight = "56vw";
}
this.showVideo = true;
return;
// 视频弹窗出现后，video标签的autoplay会自动播放
} else if (link) {
if (!link || link === '') {
return;
}
// 其他跳转逻辑
jump(link);
}
},
channelTabHandler(_index, evt) {
if (evt) {
md.sensorLog(evt);
}
this.channelTabIndex = _index;
},
showPopup(_index, evt) {
if (evt) {
md.sensorLog(evt);
if (evt.currentTarget.dataset.comlog) {
md.sensorComponentLog(evt);
}
}
md.sensorLogTake({
xcxPage: `${this.qrNameList[_index]}拉起半屏二维码入口页面浏览`,
pageName: `${this.qrNameList[_index]}拉起半屏二维码入口`,
});
if (_index === 3) {
this.qrObj = null;
} else {
_index = Math.max(0, Math.min(_index, this.qrInfoList.length - 1));
this.qrObj = this.qrInfoList[_index];
}
this.popupIndex = _index;
this.$refs.popup.open(this.popType);
},
showPopup1(_index, type) {
md.sensorLogTake({
xcxClick: `首页-二屏页面点击`,
pageName: `首页-二屏`,
buttonName: type == 1 ? '专家团副标题点击' : '专家团进群咨询按钮点击'
});
if (type == 2) {
md.sensorComponentLogTake({
xcxComponentClick: "true",
pageName: "首页",
componentName: "专家团",
componentContent: '专家团-进群咨询'
});
}
if (_index === 3) {
this.qrObj = null;
} else {
_index = Math.max(0, Math.min(_index, this.qrInfoList.length - 1));
this.qrObj = this.qrInfoList[_index];
}
this.popupIndex = _index;
this.$refs.popup.open(this.popType);
},
closePop() {
this.$refs.popup.close();
},
goSearchHandler(e) {
md.sensorLog(e);
uni.navigateTo({
url: "/pages/search/search"
})
},
downloadHandler(imgurl) {
md.sensorLogTake({
xcxClick: `${this.qrNameList[this.popupIndex]}拉起半屏二维码入口页面点击`,
pageName: `${this.qrNameList[this.popupIndex]}拉起半屏二维码入口页面点击`,
buttonName: `下载二维码`
});
uni.downloadFile({
url: imgurl,
success: (downloadRes) => {
if (downloadRes.statusCode === 200) {
uni.saveImageToPhotosAlbum({
filePath: downloadRes.tempFilePath,
success: (res) => {
uni.showToast({
title: '保存成功',
icon: 'success'
});
},
fail: (err) => {
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
});
} else {
uni.showToast({
title: '下载失败',
icon: 'none'
});
}
},
fail: (err) => {
uni.showToast({
title: '下载失败',
icon: 'none'
});
}
});
},
closeVideo() {
this.showVideo = false;
this.currentVideoUrl = '';
},
onGetPhoneNumber(e) {
if (e.detail.errMsg !== 'getPhoneNumber:ok') {
uni.showToast({
title: '请授权使用手机号',
icon: 'none',
});
return;
}
console.log('detail', e.detail);
this.isClickPhoneAuth = true;
userStore.phoneCallback(e.detail);
},
goCustomerHandler(e) {
md.sensorLog(e);
const {
memberId,
mobile,
openId,
unionId
} = this.homeStore.homeInfo;
const customerUrl =
`https://intelcc-user.icsoc.net/?channelKey=45839e0505554f8c8aea3c7b6259b049&init=1&crmld=${memberId}&mobile=${mobile}&openId=${openId}&unionId=${unionId}`;
jump({
type: JumpType.H5,
url: customerUrl
});
},
checkExposure(scrollTop) {
if (this.exposureTracker) {
this.exposureTracker.checkExposure(scrollTop);
}
},
resetExposure() {
if (this.exposureTracker) {
this.exposureTracker.resetAllExposure();
}
},
onSwiperChange(e) {
this.currentIndex = e.detail.current;
const componentContent = this.toolList.tools?.[this.currentIndex]?.title || '';
md.sensorComponentLogTake({
xcxComponentExposure: "true",
pageName: "首页",
componentName: "工具推荐",
componentContent: componentContent
});
},
onBannerSwiperChange(e) {
this.bannerCurrentIndex = e.detail.current;
md.sensorComponentLogTake({
xcxComponentExposure: "true",
pageName: "首页",
componentName: "首页banner",
componentContent: this.swiperList[e.detail.current].title
});
},
async handleToolClick(item) {
md.sensorLogTake({
xcxClick: "首页-二屏页面点击",
pageName: "首页-二屏",
buttonName: item.title + "工具点击",
});
md.sensorComponentLogTake({
xcxComponentClick: "true",
pageName: "首页",
componentName: "工具推荐",
componentContent: item.title
});
if (item.title === "医生问诊") {
// if (!cfgStatus.value.isRegister) return;
const res = await getHealthField();
if (!res.success) {
uni.showToast({
title: "获取健康字段失败",
icon: "none",
});
return;
}
const {
sign,
timestamp,
appId,
partnerUserId,
env
} = res.data;
jump({
type: JumpType.MINI,
url: "/pages/partner/redirect",
extra: {
appId: "wx81ecfb5aa3fb512f",
envVersion: env,
extraData: {
sign, // 参考 4.请求参数
timestamp, // 参考 4.请求参数
appId, // 参考 4.请求参数
partnerUserId, // 参考 4.请求参数
targetApp: "/h5/partner/shining-like-a-start/landing-free-consult?sysType=CRF",
},
},
});
} else {
jump({
type: item.link.type,
url: item.link.url
});
}
},
onSelEtTap(index) {
let str = index === 0 ? '名医专家' : (index === 1 ? '科研专家' : '权威机构')
md.sensorLogTake({
xcxClick: "首页-二屏页面点击",
pageName: "首页-二屏",
buttonName: str + "tab按钮点击",
});
md.sensorComponentLogTake({
xcxComponentClick: "true",
xcxComponentExposure: "true",
pageName: "首页",
componentName: "专家团",
componentContent: '专家团tab切换-' + str
});
this.etTabSelIndex = index;
},
onETMore(index, type) {
let str = '';
if (type === 0) {
str = '名医专家';
} else if (type === 1) {
str = '科研专家';
} else {
str = '权威机构';
}
if (index === 1) {
str += '内容'
} else {
str += '点击查看更多';
}
md.sensorLogTake({
xcxClick: "首页-二屏页面点击",
pageName: "首页-二屏",
buttonName: str + "-点击",
});
md.sensorComponentLogTake({
xcxComponentClick: "true",
pageName: "首页",
componentName: "专家团",
componentContent: str
});
jump({
type: 1,
url: '/pages/expertTeamPage/expertTeamPage?tab=' + (this.etTabSelIndex + 1)
});
},
closeImagePopup() {
this.$refs.imagePopup.close();
},
imagePopupJump() { .swiper-mask {
md.sensorPopLogTake({ position: absolute;
xcxPopClick: "true", left: 0;
toolName: "首页", width: 750rpx;
popName: this.popupImageObj.title || "北纬47°鲜活溯源之旅", height: 192rpx;
buttonName: this.popupImageObj.btnName || "立即寻宝" z-index: 1;
}); top: 1065rpx;
jump({
type: this.popupImageObj.jumpType,
url: this.popupImageObj.jumpUrl,
extra: this.popupImageObj.jumpExtra
});
},
showImagePopup() {
md.sensorPopLogTake({
xcxPopExposure: "true",
toolName: "首页",
popName: this.popupImageObj.title || "北纬47°鲜活溯源之旅"
});
this.$refs.imagePopup.open('center');
},
closePop1() {
this.$refs.imagePopup.close();
},
// 重置弹窗状态（可在需要时调用） .swiper-mask-img {
resetPopupState() { width: 100%;
this.homeStore.resetPopupState(); // 重置 store 中的弹窗状态 height: 100%;
}, }
}
// 检查并显示弹窗（使用 store 全局状态管理） // 自定义banner指示器样式
checkAndShowPopup() { .custom-banner-indicator {
// 使用 store 中的 hasShownPopup 来记录是否已经显示过弹窗 position: absolute;
if (!this.homeStore.hasShownPopup && this.homeStore.homeInfo?.showPop1) { top: 1075rpx;
this.homeStore.markPopupAsShown(); // 标记已显示过弹窗（全局状态） left: 50%;
this.$nextTick(() => { transform: translateX(-50%);
setTimeout(() => { display: flex;
this.showImagePopup(); align-items: center;
}, 500); justify-content: center;
}); gap: 16rpx;
.banner-dot {
width: 16rpx;
height: 16rpx;
border-radius: 50%;
background-color: #feebc4;
transition: all 0.3s ease;
flex-shrink: 0;
&.active {
width: 40rpx;
height: 16rpx;
border-radius: 8rpx;
background-color: #D3A358;
} }
} }
} }
}
</script>
<style lang="less" scoped>
@import '@/common.less';
.home-container { .barbox {
width: 100vw; position: absolute;
overflow-x: hidden; top: 97rpx;
background-color: white; left: 32rpx;
display: flex;
align-items: center;
.content { .btnlogo {
background-color: white; width: 184rpx;
padding-bottom: 200rpx; height: 66rpx;
}
.banner { .btnsearch {
height: 1116rpx; width: 150rpx;
height: 68rpx;
margin-left: 20rpx;
}
.banneritem { .customer-btn-wrap {
width: 750rpx; position: relative;
height: 1116rpx; display: inline-block;
}
.b-img { .btncustomer {
width: 100%; width: 70rpx;
height: 100%; height: 68rpx;
} margin-left: 110rpx;
}
} }
.swiper-mask { .phone-auth-btn-cover {
position: absolute; position: absolute;
left: 0; left: 0;
width: 750rpx; top: 0;
height: 192rpx; right: 0;
z-index: 1; bottom: 0;
top: 1065rpx; width: 100%;
height: 100%;
.swiper-mask-img { background: transparent;
width: 100%; opacity: 0;
height: 100%; border: none;
} padding: 0;
margin: 0;
z-index: 10;
pointer-events: auto;
} }
}
// 自定义banner指示器样式 // .txtbox {
.custom-banner-indicator { // width: 100%;
position: absolute; // height: 76rpx;
top: 1075rpx; // background-color: @color-white-soft;
left: 50%; // text-align: center;
transform: translateX(-50%);
display: flex; // .txtlink {
align-items: center; // color: @color-gold-cover;
justify-content: center; // font-size: 24rpx;
gap: 16rpx; // text-underline-offset: 10rpx;
// text-decoration: underline;
.banner-dot { // }
width: 16rpx;
height: 16rpx; // .icon_arrow_yellow {
border-radius: 50%; // width: 12rpx;
background-color: #feebc4; // height: 20rpx;
transition: all 0.3s ease; // margin-left: 10rpx;
flex-shrink: 0; // }
// }
&.active {
width: 40rpx; .tools_box {
height: 16rpx; width: 750rpx;
border-radius: 8rpx; height: 840rpx;
background-color: #D3A358; margin-top: 40rpx;
} overflow-x: scroll;
} padding-left: 38rpx;
.tools_maintitle {
// font-size: 42rpx;
// color: #000;
color: @color-black-deep;
font-size: 38rpx;
font-weight: bold;
} }
.barbox { .tools_subtitle {
position: absolute; margin-top: 10rpx;
top: 97rpx; font-size: 24rpx;
left: 32rpx; color: #999;
display: flex; }
align-items: center;
.btnlogo {
width: 184rpx;
height: 66rpx;
}
.btnsearch {
width: 150rpx;
height: 68rpx;
margin-left: 20rpx;
}
.customer-btn-wrap { .tool_swiper {
position: relative; margin-top: 35rpx;
display: inline-block; width: 720rpx;
} height: 700rpx;
overflow: visible;
/* 关键：允许内容溢出 */
.btncustomer { .swiperItem {
width: 70rpx; width: 400rpx;
height: 68rpx; height: 700rpx;
margin-left: 110rpx; top: 40rpx;
} }
.phone-auth-btn-cover { /* 当前激活项放大 */
position: absolute; .swiperItem.active {
left: 0; top: 0rpx !important;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background: transparent;
opacity: 0;
border: none;
padding: 0;
margin: 0;
z-index: 10; z-index: 10;
pointer-events: auto; transition: top 0.4s ease;
}
}
// .txtbox {
// width: 100%;
// height: 76rpx;
// background-color: @color-white-soft;
// text-align: center;
// .txtlink {
// color: @color-gold-cover;
// font-size: 24rpx;
// text-underline-offset: 10rpx;
// text-decoration: underline;
// }
// .icon_arrow_yellow {
// width: 12rpx;
// height: 20rpx;
// margin-left: 10rpx;
// }
// }
.tools_box {
width: 750rpx;
height: 840rpx;
margin-top: 40rpx;
overflow-x: scroll;
padding-left: 38rpx;
.tools_maintitle {
// font-size: 42rpx;
// color: #000;
color: @color-black-deep;
font-size: 38rpx;
font-weight: bold;
}
.tools_subtitle {
margin-top: 10rpx;
font-size: 24rpx;
color: #999;
} }
.tool_swiper { .tool {
margin-top: 35rpx; position: absolute;
width: 720rpx; width: 400rpx;
height: 700rpx; height: 700rpx;
overflow: visible;
/* 关键：允许内容溢出 */
.swiperItem { .sq_btn {
position: absolute;
left: 0rpx;
top: 0rpx;
width: 400rpx; width: 400rpx;
height: 700rpx; height: 650rpx;
top: 40rpx; // background-color: red;
opacity: 0;
z-index: 2;
} }
/* 当前激活项放大 */ .tool_bg {
.swiperItem.active { position: absolute;
top: 0rpx !important; left: 0rpx;
z-index: 10; top: 0rpx;
transition: top 0.4s ease; width: 400rpx;
height: 650rpx;
border-radius: 40rpx;
z-index: 1;
} }
.tool { .tool_icon {
position: absolute; position: absolute;
left: 0rpx;
top: 0rpx;
width: 400rpx; width: 400rpx;
height: 700rpx; height: 470rpx;
border-radius: 40rpx;
.sq_btn { }
position: absolute;
left: 0rpx;
top: 0rpx;
width: 400rpx;
height: 650rpx;
// background-color: red;
opacity: 0;
z-index: 2;
}
.tool_bg {
position: absolute;
left: 0rpx;
top: 0rpx;
width: 400rpx;
height: 650rpx;
border-radius: 40rpx;
z-index: 1;
}
.tool_icon { .tool_jt {
position: absolute; position: absolute;
left: 0rpx; left: 300rpx;
top: 0rpx; top: 510rpx;
width: 400rpx; width: 74rpx;
height: 470rpx; height: 44rpx;
border-radius: 40rpx; }
}
.tool_jt { .tool_title {
position: absolute; position: absolute;
left: 300rpx; left: 30rpx;
top: 510rpx; top: 510rpx;
width: 74rpx; color: #000;
height: 44rpx; font-size: 36rpx;
} width: 300rpx;
z-index: 2;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
max-width: 7em;
.tool_title { }
position: absolute;
left: 30rpx;
top: 510rpx;
color: #000;
font-size: 36rpx;
width: 300rpx;
} .tool_context {
position: absolute;
left: 30rpx;
top: 575rpx;
font-size: 24rpx;
color: #999;
width: 300rpx;
z-index: 2;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
line-height: 1.5;
max-height: 3em;
.tool_context {
position: absolute;
left: 30rpx;
top: 575rpx;
font-size: 24rpx;
color: #999;
width: 300rpx;
}
} }
} }
}
/* 自定义指示点样式 */ /* 自定义指示点样式 */
.custom-indicator { .custom-indicator {
width: 200rpx; width: 200rpx;
height: 10rpx; height: 10rpx;
margin-top: -15rpx; margin-top: -15rpx;
margin-left: -20rpx; margin-left: -20rpx;
display: flex; display: flex;
justify-content: center; justify-content: center;
gap: 10rpx; gap: 10rpx;
} }
.indicator-dot { .indicator-dot {
width: 10rpx; width: 10rpx;
height: 10rpx; height: 10rpx;
border-radius: 10rpx; border-radius: 10rpx;
background-color: #feefcc; background-color: #feefcc;
transition: all 0.3s; transition: all 0.3s;
} }
.indicator-dot.active { .indicator-dot.active {
width: 70rpx; width: 70rpx;
border-radius: 10rpx; border-radius: 10rpx;
background-color: #d3a358; background-color: #d3a358;
}
} }
}
.et_box { .et_box {
width: 750rpx; width: 750rpx;
// height: 840rpx; // height: 840rpx;
margin-top: 30rpx; margin-top: 30rpx;
padding-left: 38rpx; padding-left: 38rpx;
.et_maintitle { .et_maintitle {
// font-size: 42rpx; // font-size: 42rpx;
// color: #000; // color: #000;
color: @color-black-deep; color: @color-black-deep;
font-size: 38rpx; font-size: 38rpx;
font-weight: bold; font-weight: bold;
} }
.et_subtitle { .et_subtitle {
width: 700rpx; width: 700rpx;
margin-top: 10rpx; margin-top: 10rpx;
display: flex; display: flex;
.txtlink { .txtlink {
width: 500rpx; width: 500rpx;
color: @color-gold-cover; color: @color-gold-cover;
font-size: 24rpx; font-size: 24rpx;
text-underline-offset: 5rpx; text-underline-offset: 5rpx;
text-decoration: underline; text-decoration: underline;
} }
.icon_more { .icon_more {
width: 140rpx; width: 140rpx;
height: 36rpx; height: 36rpx;
margin-left: 45rpx; margin-left: 45rpx;
margin-top: 2rpx; margin-top: 2rpx;
}
} }
}
.et_main_box { .et_main_box {
padding-top: 30rpx; padding-top: 30rpx;
margin-top: 35rpx; margin-top: 35rpx;
width: 670rpx; width: 670rpx;
height: 602rpx; height: 602rpx;
background-color: #fde8bb; background-color: #fde8bb;
border-radius: 38rpx;
.et_con_bg {
margin-left: 3rpx;
width: 651rpx;
height: 562rpx;
background-color: #ffffff;
border-radius: 38rpx; border-radius: 38rpx;
padding-left: 15rpx;
padding-top: 25rpx;
.et_con_bg { .et_tab_box {
margin-left: 3rpx; height: 70rpx;
width: 651rpx; display: flex;
height: 562rpx; gap: 15rpx;
background-color: #ffffff;
border-radius: 38rpx;
padding-left: 15rpx;
padding-top: 25rpx;
.et_tab_box { .tab_box {
width: 204rpx;
height: 70rpx; height: 70rpx;
display: flex;
gap: 15rpx;
.tab_box { .et_tab {
width: 204rpx; width: 204rpx;
height: 70rpx; height: 70rpx;
.et_tab {
width: 204rpx;
height: 70rpx;
}
} }
} }
}
.et_con_box { .et_con_box {
width: 631rpx;
height: 365rpx;
margin-top: 40rpx;
.et_con1 {
width: 631rpx; width: 631rpx;
height: 365rpx; height: 365rpx;
margin-top: 40rpx; }
.et_con1 {
width: 631rpx;
height: 365rpx;
}
.et_con2 { .et_con2 {
width: 631rpx; width: 631rpx;
height: 365rpx; height: 365rpx;
} }
.et_con3 { .et_con3 {
width: 598rpx; width: 598rpx;
height: 303rpx; height: 303rpx;
margin-top: 20rpx; margin-top: 20rpx;
margin-left: 16rpx; margin-left: 16rpx;
}
} }
}
.et_more_txt { .et_more_txt {
width: 100%; width: 100%;
font-size: 24rpx; font-size: 24rpx;
color: @color-gold-cover; color: @color-gold-cover;
text-align: center; text-align: center;
margin-top: 30rpx; margin-top: 30rpx;
.icon_arrow_yellow { .icon_arrow_yellow {
width: 12rpx; width: 12rpx;
height: 20rpx; height: 20rpx;
margin-left: 5rpx; margin-left: 5rpx;
}
} }
} }
} }
} }
}
.cardScroller { .cardScroller {
width: 750rpx; width: 750rpx;
overflow-x: scroll; overflow-x: scroll;
} }
.cardbox {
//
position: relative;
display: inline-flex;
flex-wrap: nowrap;
margin-top: 32rpx;
.cardbox { .cardboxitem {
// width: 380rpx;
height: 232rpx;
position: relative; position: relative;
display: inline-flex; margin-left: 32rpx;
flex-wrap: nowrap;
margin-top: 32rpx;
.cardboxitem { .bg {
width: 380rpx; width: 380rpx;
height: 232rpx; height: 232rpx;
position: absolute;
z-index: 0;
}
.level {
position: absolute;
left: 24rpx;
top: 30rpx;
font-size: 32rpx;
font-weight: bold;
color: @color-gold-cover;
pointer-events: none;
}
.subTitle {
position: absolute;
left: 24rpx;
top: 80rpx;
font-size: 24rpx;
color: @color-black-deep;
pointer-events: none;
}
.showCornerTxt {
position: absolute;
right: 0;
top: 0;
color: white;
font-size: 24rpx;
padding: 10rpx;
border-radius: 0 10rpx 0 10rpx;
background-color: @color-gold-main;
}
.cardbtn {
position: relative; position: relative;
margin-left: 32rpx; left: 6rpx;
top: 130rpx;
.bg { .phone-auth-btn-cover {
width: 380rpx;
height: 232rpx;
position: absolute; position: absolute;
width: 368rpx;
height: 88rpx;
z-index: 0; z-index: 0;
left: 0;
top: 0;
opacity: 0;
pointer-events: auto;
} }
.level { .cardbtnbg {
position: absolute; position: absolute;
left: 24rpx; width: 368rpx;
top: 30rpx; height: 88rpx;
font-size: 32rpx; z-index: 0;
font-weight: bold; left: 0;
color: @color-gold-cover; top: 0;
pointer-events: none;
} }
.subTitle { .btnTitle {
position: absolute; position: absolute;
left: 24rpx; // z-index: 1;
top: 80rpx; width: 180rpx;
text-align: center;
font-size: 24rpx; font-size: 24rpx;
color: @color-black-deep; color: white;
pointer-events: none; // border: 1px solid red;
top: 23rpx;
left: 20rpx;
} }
.showCornerTxt { .btnSubTitle {
position: absolute; position: absolute;
right: 0; top: 23rpx;
top: 0; // z-index: 1;
color: white;
font-size: 24rpx; font-size: 24rpx;
padding: 10rpx; font-weight: bold;
border-radius: 0 10rpx 0 10rpx; color: @color-gold-light;
background-color: @color-gold-main; left: 210rpx;
} }
}
}
}
.cardbtn { .contentbox {
position: relative; width: 750rpx;
left: 6rpx; height: 1429rpx;
top: 130rpx; position: relative;
margin-top: 32px;
.phone-auth-btn-cover {
position: absolute;
width: 368rpx;
height: 88rpx;
z-index: 0;
left: 0;
top: 0;
opacity: 0;
pointer-events: auto;
}
.cardbtnbg {
position: absolute;
width: 368rpx;
height: 88rpx;
z-index: 0;
left: 0;
top: 0;
}
.btnTitle {
position: absolute;
// z-index: 1;
width: 180rpx;
text-align: center;
font-size: 24rpx;
color: white;
// border: 1px solid red;
top: 23rpx;
left: 20rpx;
}
.btnSubTitle { .contentbg {
position: absolute; width: 100%;
top: 23rpx; height: 100%;
// z-index: 1; position: absolute;
font-size: 24rpx;
font-weight: bold;
color: @color-gold-light;
left: 210rpx;
}
}
}
} }
.contentbox { .contentitem {
width: 750rpx; position: absolute;
height: 1429rpx; }
position: relative;
margin-top: 32px;
.contentbg { }
width: 100%;
height: 100%;
position: absolute;
}
.contentitem { .channelbox {
position: absolute; margin-top: 32rpx;
} margin-left: 32rpx;
.maintitle {
color: @color-black-deep;
font-size: 38rpx;
font-weight: bold;
display: block;
margin-left: 5rpx;
} }
.channelbox { .subtitle_box {
margin-top: 32rpx; display: flex;
margin-left: 32rpx; margin-top: 10rpx;
margin-left: 5rpx;
width: 700rpx;
.maintitle { .subtitle {
width: 500rpx;
color: @color-black-deep; color: @color-black-deep;
font-size: 38rpx; font-size: 24rpx;
font-weight: bold;
display: block;
margin-left: 5rpx;
} }
.subtitle_box { .icon_more {
display: flex; width: 127rpx;
margin-top: 10rpx; height: 34rpx;
margin-left: 5rpx; margin-left: 45rpx;
width: 700rpx; margin-top: 2rpx;
.subtitle {
width: 500rpx;
color: @color-black-deep;
font-size: 24rpx;
}
.icon_more {
width: 127rpx;
height: 34rpx;
margin-left: 45rpx;
margin-top: 2rpx;
}
} }
}
.listbox { .listbox {
display: flex; display: flex;
margin-top: 20rpx; margin-top: 20rpx;
width: 686rpx; width: 686rpx;
align-content: center; align-content: center;
justify-content: space-between; justify-content: space-between;
.tabitem { .tabitem {
color: @color-black-deep; color: @color-black-deep;
background-color: #e9edf1; background-color: #e9edf1;
padding: 15rpx 20rpx; padding: 15rpx 20rpx;
font-size: 22rpx; font-size: 22rpx;
// margin-right: 15rpx; // margin-right: 15rpx;
border-radius: 30rpx; border-radius: 30rpx;
} }
.tabActive { .tabActive {
color: white; color: white;
background-color: @color-gold-main; background-color: @color-gold-main;
}
} }
}
.channelscroll { .channelscroll {
width: 718rpx; width: 718rpx;
overflow-y: scroll; overflow-y: scroll;
margin-top: 32rpx; margin-top: 32rpx;
height: 620rpx; height: 620rpx;
.box { .box {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.infobox { .infobox {
width: 670rpx; width: 670rpx;
height: 180rpx;
display: flex;
align-items: center;
background-color: #fff;
border-radius: 16rpx;
border: 2rpx solid #feeecb;
margin-bottom: 20rpx;
.infoimg {
border-radius: 12rpx 0rpx 0rpx 12rpx;
-webkit-flex-shrink: 0;
flex-shrink: 0;
height: 180rpx; height: 180rpx;
display: flex; /* margin-top: -1rpx ; */
align-items: center; width: 180rpx;
background-color: #fff;
border-radius: 16rpx;
border: 2rpx solid #feeecb;
margin-bottom: 20rpx;
.infoimg {
border-radius: 12rpx 0rpx 0rpx 12rpx;
-webkit-flex-shrink: 0;
flex-shrink: 0;
height: 180rpx;
/* margin-top: -1rpx ; */
width: 180rpx;
}
.infotitlebox {
flex: 1;
margin-left: 20rpx;
display: flex;
flex-direction: column;
justify-content: center;
.infotitlecon {
display: flex;
flex-direction: row;
.infotitle {
color: @color-black-deep;
width: 400rpx;
font-size: 24rpx;
font-weight: bold;
margin-bottom: 8rpx;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.3;
}
.infotitletag {
width: 46rpx;
height: 22rpx;
color: #fff;
}
}
.infodesc {
color: #999999;
font-size: 22rpx;
width: 450rpx;
line-height: 1.3;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
}
} }
}
}
.channelscroll2 {
width: 718rpx;
margin-top: 32rpx;
margin-left: -16rpx;
.box2 {
width: 718rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.infobox2 { .infotitlebox {
width: 330rpx; flex: 1;
height: 430rpx; margin-left: 20rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; justify-content: center;
background-color: #fff;
border-radius: 16rpx;
border: 4rpx solid #feeecb;
margin-bottom: 20rpx;
position: relative;
.infoimg2 {
width: 330rpx;
height: 306rpx;
border-radius: 12rpx 12rpx 0rpx 0rpx;
flex-shrink: 0;
}
.infotitle2box { .infotitlecon {
margin-top: 10rpx;
flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
justify-content: center;
width: 100%;
padding: 0 10rpx;
.infotitle2 { .infotitle {
color: @color-black-deep; color: @color-black-deep;
width: 90%; width: 400rpx;
font-size: 24rpx; font-size: 24rpx;
font-weight: bold; font-weight: bold;
margin-bottom: 8rpx; margin-bottom: 8rpx;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 1;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
line-height: 1.3; line-height: 1.3;
text-align: left;
margin-left: 5%;
} }
.infotitletag {
width: 46rpx;
height: 22rpx;
color: #fff;
}
}
.infodesc {
color: #999999;
font-size: 22rpx;
width: 450rpx;
line-height: 1.3;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
} }
} }
} }
} }
}
.desc { .channelscroll2 {
width: 718rpx;
margin-top: 32rpx;
margin-left: -16rpx;
color: @color-black-deep; .box2 {
font-size: 24rpx; width: 718rpx;
display: flex; display: flex;
align-items: center; flex-wrap: wrap;
justify-content: center; justify-content: space-between;
margin-top: 32rpx;
.desc1 { .infobox2 {
color: @color-gold-cover; width: 330rpx;
margin-left: 5rpx; height: 430rpx;
} display: flex;
} flex-direction: column;
align-items: center;
background-color: #fff;
border-radius: 16rpx;
border: 4rpx solid #feeecb;
margin-bottom: 20rpx;
position: relative;
.desc2 { .infoimg2 {
padding-bottom: 32rpx; width: 330rpx;
height: 306rpx;
border-radius: 12rpx 12rpx 0rpx 0rpx;
flex-shrink: 0;
}
.infotitle2box {
margin-top: 10rpx;
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
padding: 0 10rpx;
.infotitle2 {
color: @color-black-deep;
width: 90%;
font-size: 24rpx;
font-weight: bold;
margin-bottom: 8rpx;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.3;
text-align: left;
margin-left: 5%;
}
}
}
} }
} }
.bottomlink {
width: 750rpx;
height: 247rpx;
.bottombg {
width: 750rpx;
height: 247rpx;
position: absolute;
}
.box { .desc {
position: relative;
top: 100rpx;
width: 74%;
left: 13%;
display: flex;
align-items: flex-end;
justify-content: space-between;
.icon {} color: @color-black-deep;
font-size: 24rpx;
display: flex;
align-items: center;
justify-content: center;
margin-top: 32rpx;
.desc1 {
color: @color-gold-cover;
margin-left: 5rpx;
} }
} }
.desc2 {
padding-bottom: 32rpx;
}
} }
.popup-content { .bottomlink {
width: 750rpx; width: 750rpx;
height: 812rpx; height: 247rpx;
border-top-left-radius: 48rpx;
border-top-right-radius: 48rpx;
position: relative;
.btnclose {
width: 70rpx;
height: 70rpx;
position: absolute;
top: 36rpx;
right: 32rpx;
}
.xingmahui { .bottombg {
width: 750rpx; width: 750rpx;
height: 100%; height: 247rpx;
position: absolute; position: absolute;
bottom: 0;
} }
.title { .box {
position: absolute; position: relative;
top: 47rpx; top: 100rpx;
left: 32rpx; width: 74%;
font-size: 36rpx; left: 13%;
color: @color-black-deep; display: flex;
font-weight: bold; align-items: flex-end;
justify-content: space-between;
}
.desc { .icon {}
position: absolute;
top: 108rpx;
left: 32rpx;
font-size: 28rpx;
color: @color-black-medium;
font-weight: bold;
} }
}
.qrcode { }
width: 340rpx;
height: 340rpx;
position: absolute;
top: 220rpx;
left: 205rpx;
}
.btndownload { .popup-content {
width: 286rpx; width: 750rpx;
height: 89rpx; height: 812rpx;
position: absolute; border-top-left-radius: 48rpx;
top: 630rpx; border-top-right-radius: 48rpx;
left: 232rpx; position: relative;
}
.btnclose {
width: 70rpx;
height: 70rpx;
position: absolute;
top: 36rpx;
right: 32rpx;
} }
.video-popup { .xingmahui {
position: fixed; width: 750rpx;
left: 0; height: 100%;
top: 0; position: absolute;
right: 0;
bottom: 0; bottom: 0;
background: rgba(0, 0, 0, 0.7);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 9999;
} }
.close-btn-bottom { .title {
margin: 32rpx auto 0 auto; position: absolute;
width: 64rpx; top: 47rpx;
height: 64rpx; left: 32rpx;
border-radius: 50%; font-size: 36rpx;
background: rgba(0, 0, 0, 0.5); color: @color-black-deep;
color: #fff; font-weight: bold;
font-size: 44rpx;
line-height: 64rpx;
text-align: center;
z-index: 10001;
display: flex;
align-items: center;
justify-content: center;
}
.phone-auth-mask {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 1000;
} }
.phone-auth-popup { .desc {
position: fixed; position: absolute;
left: 50%; top: 108rpx;
top: 50%; left: 32rpx;
transform: translate(-50%, -50%); font-size: 28rpx;
background: #fff; color: @color-black-medium;
border-radius: 16rpx; font-weight: bold;
padding: 40rpx 32rpx;
z-index: 1001;
display: flex;
flex-direction: column;
align-items: center;
} }
.phone-auth-btn { .qrcode {
background: #ffd700; width: 340rpx;
color: #333; height: 340rpx;
font-size: 32rpx; position: absolute;
border-radius: 8rpx; top: 220rpx;
padding: 20rpx 60rpx; left: 205rpx;
margin-bottom: 20rpx;
} }
.close-btn { .btndownload {
font-size: 40rpx; width: 286rpx;
color: #999; height: 89rpx;
margin-top: 10rpx; position: absolute;
top: 630rpx;
left: 232rpx;
} }
}
.image-popup-content { .video-popup {
width: 100%; position: fixed;
height: 100%; left: 0;
display: flex; top: 0;
flex-direction: column; right: 0;
align-items: center; bottom: 0;
justify-content: center; background: rgba(0, 0, 0, 0.7);
border-radius: 16rpx; display: flex;
position: relative; flex-direction: column;
align-items: center;
justify-content: center;
z-index: 9999;
}
.popup-image { .close-btn-bottom {
width: 600rpx; margin: 32rpx auto 0 auto;
height: 600rpx; width: 64rpx;
border-radius: 16rpx; height: 64rpx;
object-fit: cover; border-radius: 50%;
} background: rgba(0, 0, 0, 0.5);
color: #fff;
font-size: 44rpx;
line-height: 64rpx;
text-align: center;
z-index: 10001;
display: flex;
align-items: center;
justify-content: center;
}
.popup-close-btn { .phone-auth-mask {
width: 70rpx; position: fixed;
height: 70rpx; left: 0;
position: absolute; top: 0;
bottom: -120rpx; right: 0;
left: 50%; bottom: 0;
transform: translateX(-50%); background: rgba(0, 0, 0, 0.5);
z-index: 10; z-index: 1000;
} }
.phone-auth-popup {
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background: #fff;
border-radius: 16rpx;
padding: 40rpx 32rpx;
z-index: 1001;
display: flex;
flex-direction: column;
align-items: center;
}
.phone-auth-btn {
background: #ffd700;
color: #333;
font-size: 32rpx;
border-radius: 8rpx;
padding: 20rpx 60rpx;
margin-bottom: 20rpx;
}
.close-btn {
font-size: 40rpx;
color: #999;
margin-top: 10rpx;
}
.image-popup-content {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 16rpx;
position: relative;
.popup-image {
width: 600rpx;
height: 600rpx;
border-radius: 16rpx;
object-fit: cover;
}
.popup-close-btn {
width: 70rpx;
height: 70rpx;
position: absolute;
bottom: -120rpx;
left: 50%;
transform: translateX(-50%);
z-index: 10;
} }
} }
}
</style> </style>
\ No newline at end of file
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