Skip to content

飞
飞鹤小程序
Commit e28d21e2 authored by chenkai1's avatar chenkai1
Browse files
Options

添加埋点

parent 27757f0c
Hide whitespace changes
Inline Side-by-side
Showing with 1786 additions and 1677 deletions
pages/expertTeamPage/expertTeamPage.vue
View file @ e28d21e2
...@@ -37,6 +37,8 @@ ...@@ -37,6 +37,8 @@
getHealthField getHealthField
} from "@/api/common"; } from "@/api/common";
import md from '@/md';
const curTabIndex = ref(1); const curTabIndex = ref(1);
onLoad((options) => { onLoad((options) => {
...@@ -44,10 +46,21 @@ ...@@ -44,10 +46,21 @@
console.log('接收到的参数:', curTabIndex.value) console.log('接收到的参数:', curTabIndex.value)
}); });
const onSelTab = (index) => { const onSelTab = (index) => {
let str = index === 1 ? '名医专家' : (index === 2 ? '科研专家' : '权威机构')
md.sensorLogTake({
xcxClick: "专家团二级页面点击",
pageName: "专家团-二级页面",
buttonName: str + "tab按钮点击",
});
curTabIndex.value = index; curTabIndex.value = index;
} }
//跳转到医生问诊页面 //跳转到医生问诊页面
const onLink = async () => { const onLink = async () => {
md.sensorLogTake({
xcxClick: "专家团二级页面点击",
pageName: "专家团-二级页面",
buttonName: "专家在线咨询按钮点击",
});
const res = await getHealthField(); const res = await getHealthField();
if (!res.success) { if (!res.success) {
......
views/Home.vue
View file @ e28d21e2
<template> <template>
<view class="home-container" @scroll="onPageScroll"> <view class="home-container" @scroll="onPageScroll">
<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">
<swiper-item v-for="(item, index) in swiperList" :key="item.url"> <swiper-item v-for="(item, index) in swiperList" :key="item.url">
<view class="swiper-item banneritem"> <view class="swiper-item banneritem">
<image @tap="jumpBannerHandler(item, index)" class="b-img" :src="$baseUrl + item.url"></image> <image @tap="jumpBannerHandler(item, index)" class="b-img" :src="$baseUrl + item.url"></image>
</view> </view>
</swiper-item> </swiper-item>
</swiper> </swiper>
<!-- 溯源测试按钮 --> <!-- 溯源测试按钮 -->
<!-- <button style="width: 100%;height: 100rpx;background-color: #fff;color: #000;" @tap="testSource">溯源测试</button> --> <!-- <button style="width: 100%;height: 100rpx;background-color: #fff;color: #000;" @tap="testSource">溯源测试</button> -->
<!-- <view class="swiper-mask"> <!-- <view class="swiper-mask">
<image class="swiper-mask-img" :src="$baseUrl + 'homepage/home_format_v2.png'"></image> <image class="swiper-mask-img" :src="$baseUrl + 'homepage/home_format_v2.png'"></image>
</view> --> </view> -->
<!-- 自定义指示点，仿照示意图 --> <!-- 自定义指示点，仿照示意图 -->
<view class="custom-banner-indicator"> <view class="custom-banner-indicator">
<view v-for="(item, idx) in swiperList" :key="item.url + idx" <view v-for="(item, idx) in swiperList" :key="item.url + idx"
:class="['banner-dot', { 'active': idx === bannerCurrentIndex }]"></view> :class="['banner-dot', { 'active': idx === bannerCurrentIndex }]"></view>
</view> </view>
<view class="barbox" :style="`top:${statusBarHeight}px;`"> <view class="barbox" :style="`top:${statusBarHeight}px;`">
<image class="btnlogo" :src="$baseUrl + 'homepage/btnlogo.png'"></image> <image class="btnlogo" :src="$baseUrl + 'homepage/btnlogo.png'"></image>
<image :data-log="{ <image :data-log="{
xcxClick: '首页-首屏页面点击', xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏', pageName: '首页-首屏',
buttonName: '搜索框' buttonName: '搜索框'
}" class="btnsearch" @tap="goSearchHandler" :src="$baseUrl + 'homepage/btnsearch.png'"> }" class="btnsearch" @tap="goSearchHandler" :src="$baseUrl + 'homepage/btnsearch.png'">
</image> </image>
<view class="customer-btn-wrap"> <view class="customer-btn-wrap">
<image :data-log="{ <image :data-log="{
xcxClick: '首页-首屏页面点击', xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏', pageName: '首页-首屏',
buttonName: '客服入口' buttonName: '客服入口'
}" @tap="goCustomerHandler" class="btncustomer" :src="$baseUrl + 'homepage/btncustomer.png'"> }" @tap="goCustomerHandler" class="btncustomer" :src="$baseUrl + 'homepage/btncustomer.png'">
</image> </image>
<button v-if="homeStore && !homeStore.isLogin" open-type="getPhoneNumber" <button v-if="homeStore && !homeStore.isLogin" open-type="getPhoneNumber"
@getphonenumber="onGetPhoneNumber" class="phone-auth-btn-cover"></button> @getphonenumber="onGetPhoneNumber" class="phone-auth-btn-cover"></button>
</view> </view>
</view> </view>
<!-- <view :data-log="{ <!-- <view :data-log="{
xcxClick: '首页-首屏页面点击', xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏', pageName: '首页-首屏',
buttonName: '文字资源位入口' buttonName: '文字资源位入口'
}" @tap="showPopup(1, $event)" class="txtbox"> }" @tap="showPopup(1, $event)" class="txtbox">
<text class="txtlink">星妈会医生在线答疑群，为孩子成长保驾护航</text> <text class="txtlink">星妈会医生在线答疑群，为孩子成长保驾护航</text>
<image class="icon_arrow_yellow" :src="$baseUrl + 'homepage/icon_arrow_yellow.png'"></image> <image class="icon_arrow_yellow" :src="$baseUrl + 'homepage/icon_arrow_yellow.png'"></image>
</view> --> </view> -->
<!--推荐工具--> <!--推荐工具-->
<view class="tools_box"> <view 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"
:next-margin="'0rpx'" :previous-margin="'0'" @change="onSwiperChange"> :next-margin="'0rpx'" :previous-margin="'0'" @change="onSwiperChange">
<swiper-item v-for="(item, index) in toolList.tools" :key="index" <swiper-item v-for="(item, index) in toolList.tools" :key="index"
:class="['swiperItem', { 'active': currentIndex === index }]"> :class="['swiperItem', { 'active': currentIndex === index }]">
<view class="tool"> <view class="tool">
<button v-if="homeStore && !homeStore.isLogin" open-type="getPhoneNumber" <button v-if="homeStore && !homeStore.isLogin" open-type="getPhoneNumber"
@getphonenumber="onGetPhoneNumber" class="sq_btn"></button> @getphonenumber="onGetPhoneNumber" class="sq_btn"></button>
<image class="tool_bg" :src="$baseUrl + item.icon" @click="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>
<!-- 自定义指示点 --> <!-- 自定义指示点 -->
<view class="custom-indicator"> <view class="custom-indicator">
<view v-for="(item, index) in toolList.tools" :key="index" class="indicator-dot" <view v-for="(item, index) in toolList.tools" :key="index" class="indicator-dot"
:class="{ 'active': currentIndex === index }"> :class="{ 'active': currentIndex === index }">
</view> </view>
</view> </view>
</view> </view>
<!--推荐工具--> <!--推荐工具-->
<!--专家团--> <!--专家团-->
<view class="et_box"> <view class="et_box">
<view class="et_maintitle">{{ expertTeam.maintitle }}</view> <view class="et_maintitle">{{ expertTeam.maintitle }}</view>
<view :data-log="{ <view :data-log="{
xcxClick: '首页-首屏页面点击', xcxClick: '首页-二屏页面点击',
pageName: '首页-首屏', pageName: '首页-二屏',
buttonName: '文字资源位入口' buttonName: '专家团副标题点击'
}" @tap="showPopup(1, $event)" class="et_subtitle"> }" class="et_subtitle">
<view class="txtlink">星妈会医生在线答疑群，为孩子成长保驾护航</view> <view class="txtlink" @tap="showPopup1(1, 1)">星妈会医生在线答疑群，为孩子成长保驾护航</view>
<image class="icon_more" :src="$baseUrl + 'homepage/et_more.png'"></image> <image class="icon_more" @tap="showPopup1(1, 2)" :src="$baseUrl + 'homepage/et_more.png'"></image>
</view> </view>
<view class="et_main_box"> <view class="et_main_box">
<view class="et_con_bg"> <view class="et_con_bg">
<view class="et_tab_box"> <view class="et_tab_box">
<view class="tab_box" @tap="onSelEtTap(0)"> <view class="tab_box" @tap="onSelEtTap(0)">
<image class="et_tab" v-show="etTabSelIndex == 0" <image class="et_tab" v-show="etTabSelIndex == 0"
:src="$baseUrl + 'homepage/et_sel_tab11.png'"> :src="$baseUrl + 'homepage/et_sel_tab11.png'">
</image> </image>
<image class="et_tab" v-show="etTabSelIndex != 0" <image class="et_tab" v-show="etTabSelIndex != 0"
:src="$baseUrl + 'homepage/et_tab11.png'"> :src="$baseUrl + 'homepage/et_tab11.png'">
</image> </image>
</view> </view>
<view class="tab_box" @tap="onSelEtTap(1)"> <view class="tab_box" @tap="onSelEtTap(1)">
<image class="et_tab" v-show="etTabSelIndex == 1" <image class="et_tab" v-show="etTabSelIndex == 1"
:src="$baseUrl + 'homepage/et_sel_tab2.png'"> :src="$baseUrl + 'homepage/et_sel_tab2.png'">
</image> </image>
<image class="et_tab" v-show="etTabSelIndex != 1" <image class="et_tab" v-show="etTabSelIndex != 1"
:src="$baseUrl + 'homepage/et_tab2.png'"> :src="$baseUrl + 'homepage/et_tab2.png'">
</image> </image>
</view> </view>
<view class="tab_box" @tap="onSelEtTap(2)"> <view class="tab_box" @tap="onSelEtTap(2)">
<image class="et_tab" v-show="etTabSelIndex == 2" <image class="et_tab" v-show="etTabSelIndex == 2"
:src="$baseUrl + 'homepage/et_sel_tab3.png'"> :src="$baseUrl + 'homepage/et_sel_tab3.png'">
</image> </image>
<image class="et_tab" v-show="etTabSelIndex != 2" <image class="et_tab" v-show="etTabSelIndex != 2"
:src="$baseUrl + 'homepage/et_tab3.png'"> :src="$baseUrl + 'homepage/et_tab3.png'">
</image> </image>
</view> </view>
</view> </view>
<view class="et_con_box" @tap="onETMore"> <view class="et_con_box" @tap="onETMore(1, etTabSelIndex)">
<image class="et_con1" v-if="etTabSelIndex == 0" :src="$baseUrl + expertTeam.etConUrl1"> <image class="et_con1" v-if="etTabSelIndex == 0" :src="$baseUrl + expertTeam.etConUrl1">
</image> </image>
<image class="et_con2" v-if="etTabSelIndex == 1" :src="$baseUrl + expertTeam.etConUrl2"> <image class="et_con2" v-if="etTabSelIndex == 1" :src="$baseUrl + expertTeam.etConUrl2">
</image> </image>
<image class="et_con3" v-if="etTabSelIndex == 2" :src="$baseUrl + expertTeam.etConUrl3"> <image class="et_con3" v-if="etTabSelIndex == 2" :src="$baseUrl + expertTeam.etConUrl3">
</image> </image>
</view> </view>
<view class="et_more_txt" @tap="onETMore"> <view class="et_more_txt" @tap="onETMore(2, etTabSelIndex)">
<text class="txtlink">点击查看更多</text> <text class="txtlink">点击查看更多</text>
<image class="icon_arrow_yellow" :src="$baseUrl + 'homepage/icon_arrow_yellow.png'"></image> <image class="icon_arrow_yellow" :src="$baseUrl + 'homepage/icon_arrow_yellow.png'"></image>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!--专家团--> <!--专家团-->
<!-- <view class="cardScroller"> <!-- <view class="cardScroller">
<view class="cardbox"> <view class="cardbox">
<view class="cardboxitem" v-for="cardData in vipCardList" :key="cardData.level"> <view class="cardboxitem" v-for="cardData in vipCardList" :key="cardData.level">
<image :data-log="{ <image :data-log="{
xcxClick: '首页-首屏页面点击', xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏', pageName: '首页-首屏',
buttonName: `腰部banner-${cardData.level}` buttonName: `腰部banner-${cardData.level}`
}" @tap="jumpLinkCard(cardData, $event)" class="bg" :src="$baseUrl + cardData.bgUrl"></image> }" @tap="jumpLinkCard(cardData, $event)" class="bg" :src="$baseUrl + cardData.bgUrl"></image>
<text class="level">{{ cardData.level }}</text> <text class="level">{{ cardData.level }}</text>
<text class="subTitle">{{ cardData.subTitle }}</text> <text class="subTitle">{{ cardData.subTitle }}</text>
<view class="showCornerTxt" v-if="cardData.showCornerTxt && cardData.showCornerTxt.length > 0"> <view class="showCornerTxt" v-if="cardData.showCornerTxt && cardData.showCornerTxt.length > 0">
{{ cardData.showCornerTxt }} {{ cardData.showCornerTxt }}
</view> </view>
<view v-if="cardData.btnTitle && cardData.btnTitle.length > 0" :data-log="{ <view v-if="cardData.btnTitle && cardData.btnTitle.length > 0" :data-log="{
xcxClick: '首页-首屏页面点击', xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏', pageName: '首页-首屏',
buttonName: `腰部banner-${cardData.level}` buttonName: `腰部banner-${cardData.level}`
}" class="cardbtn" @tap="jumpLinkWithLogin(cardData.link, $event)"> }" class="cardbtn" @tap="jumpLinkWithLogin(cardData.link, $event)">
<image class="cardbtnbg" :src="$baseUrl + 'homepage/btn_receive.png'"></image> <image class="cardbtnbg" :src="$baseUrl + 'homepage/btn_receive.png'"></image>
<text class="btnTitle" :style="cardData.btnTitle.length > 7 ? 'font-size:22rpx;' : ''">{{ <text class="btnTitle" :style="cardData.btnTitle.length > 7 ? 'font-size:22rpx;' : ''">{{
cardData.btnTitle }}</text> cardData.btnTitle }}</text>
<text class="btnSubTitle">{{ cardData.btnSubTitle }}</text> <text class="btnSubTitle">{{ cardData.btnSubTitle }}</text>
<button v-if="homeStore && !homeStore.isLogin" open-type="getPhoneNumber" <button v-if="homeStore && !homeStore.isLogin" open-type="getPhoneNumber"
@getphonenumber="onGetPhoneNumber" class="phone-auth-btn-cover"></button> @getphonenumber="onGetPhoneNumber" class="phone-auth-btn-cover"></button>
</view> </view>
</view> </view>
</view> </view>
</view> --> </view> -->
<!-- <view class="contentbox" id="secondScreen"> <!-- <view class="contentbox" id="secondScreen">
<image class="contentbg" :src="$baseUrl + 'homepage/contentbg.png'" alt="" /> <image class="contentbg" :src="$baseUrl + 'homepage/contentbg.png'" alt="" />
<image class="contentitem" :key="index" :style="contentItem._style" <image class="contentitem" :key="index" :style="contentItem._style"
v-for="(contentItem, index) in contentImgList" :src="$baseUrl + contentItem.bgUrl" :data-log="{ v-for="(contentItem, index) in contentImgList" :src="$baseUrl + contentItem.bgUrl" :data-log="{
xcxClick: '首页-二屏页面点击', xcxClick: '首页-二屏页面点击',
pageName: '首页-二屏', pageName: '首页-二屏',
buttonName: `品牌介绍${index + 1}` buttonName: `品牌介绍${index + 1}`
}" @tap="jumpLink(contentItem.link, contentItem.videoUrl, index, $event)"></image> }" @tap="jumpLink(contentItem.link, contentItem.videoUrl, index, $event)"></image>
</view> --> </view> -->
<view class="channelbox"> <view 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>
<image class="icon_more" :src="$baseUrl + 'homepage/home_more_btn_v2.png'" :data-log="{ <image class="icon_more" :src="$baseUrl + 'homepage/home_more_btn_v2.png'" :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `次位内容资源位-查看更多文字` buttonName: `次位内容资源位-查看更多文字`
}" @tap="jumpLink(suggest.link, false, false, $event)"></image> }" @tap="jumpLink(suggest.link, false, false, $event)"></image>
</view> </view>
<view class="channelscroll"> <view class="channelscroll">
<view class="box"> <view class="box">
<view class="infobox" :key="index" v-for="(infoItem, index) in childrenInfoList" :data-log="{ <view class="infobox" :key="index" v-for="(infoItem, index) in childrenInfoList" :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `次位内容资源位-轮播-${index + 1}` buttonName: `次位内容资源位-轮播-${index + 1}`
}" @tap="jumpLink(infoItem.link, false, false, $event)"> }" @tap="jumpLink(infoItem.link, false, false, $event)">
<image class="infoimg" :src="$baseUrl + infoItem.bgUrl"></image> <image class="infoimg" :src="$baseUrl + infoItem.bgUrl"></image>
<view class="infotitlebox"> <view class="infotitlebox">
<view class="infotitlecon"> <view class="infotitlecon">
<view class="infotitle">{{ infoItem.desc }}</view> <view class="infotitle">{{ infoItem.desc }}</view>
<image v-if="infoItem.isNew" class="infotitletag" <image v-if="infoItem.isNew" class="infotitletag"
:src="$baseUrl + 'homepage/home_new_tag_v3.png'">New</image> :src="$baseUrl + 'homepage/home_new_tag_v3.png'">New</image>
</view> </view>
<view class="infodesc">{{ infoItem.desc2 }}</view> <view class="infodesc">{{ infoItem.desc2 }}</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- <view :data-log="{ <!-- <view :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `次位内容资源位-查看更多文字` buttonName: `次位内容资源位-查看更多文字`
}" @tap="jumpLink(suggest.link, false, false, $event)" class="desc desc2"> }" @tap="jumpLink(suggest.link, false, false, $event)" class="desc desc2">
更多星妈会权威专家服务团 <view class="desc1"> 点击查看 > </view> 更多星妈会权威专家服务团 <view class="desc1"> 点击查看 > </view>
</view> --> </view> -->
</view> </view>
<view class="channelbox" id="thirdScreen"> <view class="channelbox" id="thirdScreen">
<text class="maintitle">{{ channelTabListMianTitle }}</text> <text class="maintitle">{{ channelTabListMianTitle }}</text>
<view class="subtitle_box"> <view class="subtitle_box">
<text class="subtitle">用声音传递爱与智慧，守护宝贝成长的每一步</text> <text class="subtitle">用声音传递爱与智慧，守护宝贝成长的每一步</text>
<image class="icon_more" :src="$baseUrl + 'homepage/home_more_btn_v2.png'" :data-log="{ <image class="icon_more" :src="$baseUrl + 'homepage/home_more_btn_v2.png'" :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `首位内容资源位-查看更多文字` buttonName: `首位内容资源位-查看更多文字`
}" @tap="jumpLink(voiceStory.link, false, false, $event)"></image> }" @tap="jumpLink(voiceStory.link, false, false, $event)"></image>
</view> </view>
<view class="listbox"> <view class="listbox">
<view @tap="channelTabHandler(index, $event)" :data-log="{ <view @tap="channelTabHandler(index, $event)" :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `首页内容资源位分类${index + 1}-${item}` buttonName: `首页内容资源位分类${index + 1}-${item}`
}" :class="channelTabIndex === index ? 'tabitem tabActive' : 'tabitem'" v-for="(item, index) in channelTabList" }" :class="channelTabIndex === index ? 'tabitem tabActive' : 'tabitem'" v-for="(item, index) in channelTabList"
:key="index"> :key="index">
{{ item }} {{ item }}
</view> </view>
</view> </view>
<view class="channelscroll2"> <view class="channelscroll2">
<view class="box2"> <view class="box2">
<view class="infobox2" :key="index" <view class="infobox2" :key="index"
v-for="(infoItem, index) in changelInfoList[channelTabIndex]" :data-log="{ v-for="(infoItem, index) in changelInfoList[channelTabIndex]" :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `首页内容资源位分类${channelTabIndex + 1}-${channelTabList[channelTabIndex]}-${index + 1}` buttonName: `首页内容资源位分类${channelTabIndex + 1}-${channelTabList[channelTabIndex]}-${index + 1}`
}" @tap="jumpLink(infoItem.link, false, false, $event)"> }" @tap="jumpLink(infoItem.link, false, false, $event)">
<image class="infoimg2" :src="$baseUrl + infoItem.bgUrl"></image> <image class="infoimg2" :src="$baseUrl + infoItem.bgUrl"></image>
<view class="infotitle2box"> <view class="infotitle2box">
<view class="infotitle2"> <view class="infotitle2">
{{ infoItem.desc }} {{ infoItem.desc }}
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- <view :data-log="{ <!-- <view :data-log="{
xcxClick: '首页-三屏页面点击', xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏', pageName: '首页-三屏',
buttonName: `首位内容资源位-查看更多文字` buttonName: `首位内容资源位-查看更多文字`
}" @tap="jumpLink(voiceStory.link, false, false, $event)" class="desc"> }" @tap="jumpLink(voiceStory.link, false, false, $event)" class="desc">
滑动或者点击查看全部 <view class="desc1"> 有声故事 > </view> 滑动或者点击查看全部 <view class="desc1"> 有声故事 > </view>
</view> --> </view> -->
</view> </view>
<view id="fourthScreen" class="bottomlink"> <view id="fourthScreen" class="bottomlink">
<image class="bottombg" :src="$baseUrl + 'homepage/bottombg.png'"></image> <image class="bottombg" :src="$baseUrl + 'homepage/bottombg.png'"></image>
<view class="box"> <view class="box">
<image class="icon" v-for="(icon, index) in bottomLinkList" :key="index" :data-log="{ <image class="icon" v-for="(icon, index) in bottomLinkList" :key="index" :data-log="{
xcxClick: '首页-四屏页面点击', xcxClick: '首页-四屏页面点击',
pageName: '首页-四屏', pageName: '首页-四屏',
buttonName: `${qrNameList[index]}` buttonName: `${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>
<view> <view>
<!-- 普通弹窗 --> <!-- 普通弹窗 -->
<uni-popup :is-mask-click="false" :safe-area="false" ref="popup" background-color="#fff" <uni-popup :is-mask-click="false" :safe-area="false" ref="popup" background-color="#fff"
border-radius="48rpx"> border-radius="48rpx">
<view v-if="qrObj !== null" class="popup-content"> <view v-if="qrObj !== null" class="popup-content">
<image class="btnclose" @tap="closePop" :src="$baseUrl + 'homepage/btnclose.png'"></image> <image class="btnclose" @tap="closePop" :src="$baseUrl + 'homepage/btnclose.png'"></image>
<view class="title"> <view class="title">
{{ qrObj.title || '' }} {{ qrObj.title || '' }}
</view> </view>
<rich-text class="desc" :nodes="qrObj.desc || ''"></rich-text> <rich-text class="desc" :nodes="qrObj.desc || ''"></rich-text>
<image :show-menu-by-longpress="true" class="qrcode" :src="$baseUrl + (qrObj.qrUrl || '')"></image> <image :show-menu-by-longpress="true" class="qrcode" :src="$baseUrl + (qrObj.qrUrl || '')"></image>
<image @tap="downloadHandler($baseUrl + (qrObj.qrUrl || ''))" class="btndownload" <image @tap="downloadHandler($baseUrl + (qrObj.qrUrl || ''))" class="btndownload"
:src="$baseUrl + 'homepage/btn_download.png'"></image> :src="$baseUrl + 'homepage/btn_download.png'"></image>
</view> </view>
<view v-else class="popup-content" style="height: 977rpx;"> <view v-else class="popup-content" style="height: 977rpx;">
<image class="xingmahui" :src="$baseUrl + 'homepage/xingmahui.png'"></image> <image class="xingmahui" :src="$baseUrl + 'homepage/xingmahui.png'"></image>
<image class="btnclose" @tap="closePop" :src="$baseUrl + 'homepage/btnclose.png'"></image> <image class="btnclose" @tap="closePop" :src="$baseUrl + 'homepage/btnclose.png'"></image>
</view> </view>
</uni-popup> </uni-popup>
</view> </view>
<!-- 新增图片弹窗 --> <!-- 新增图片弹窗 -->
<uni-popup :is-mask-click="false" :safe-area="false" ref="imagePopup" background-color="transparent"> <uni-popup :is-mask-click="false" :safe-area="false" ref="imagePopup" background-color="transparent">
<view class="image-popup-content"> <view class="image-popup-content">
<image class="popup-image" :src="popupImageUrl" mode="aspectFit" @tap="imagePopupJump"></image> <image class="popup-image" :src="popupImageUrl" mode="aspectFit" @tap="imagePopupJump"></image>
<image class="popup-close-btn" @tap="closeImagePopup" :src="$baseUrl + 'homepage/btnclose.png'"></image> <image class="popup-close-btn" @tap="closeImagePopup" :src="$baseUrl + 'homepage/btnclose.png'"></image>
</view> </view>
</uni-popup> </uni-popup>
<view v-if="showVideo" class="video-popup"> <view v-if="showVideo" class="video-popup">
<video :src="currentVideoUrl" controls autoplay :style="{ width: '100vw', height: videoHeight }"></video> <video :src="currentVideoUrl" controls autoplay :style="{ width: '100vw', height: videoHeight }"></video>
<view class="close-btn-bottom" @tap="closeVideo">×</view> <view class="close-btn-bottom" @tap="closeVideo">×</view>
</view> </view>
<RegisterLayer v-model="showRegisterLayer" /> <RegisterLayer v-model="showRegisterLayer" />
</view> </view>
</template> </template>
<script> <script>
import { jump, JumpType } from '../utils'; import {
import { useHomeStore } from '../stores/home'; jump,
import { fetchHomeJSON } from '../api/home'; JumpType
import { useUserStore } from '../stores/user'; } from '../utils';
import RegisterLayer from "../components/RegisterLayer.vue"; import {
import md from '../md'; useHomeStore
import ExposureTracker from '../utils/exposure'; } from '../stores/home';
import { getHealthField } from "@/api/common"; import {
fetchHomeJSON
// const homeStore = useHomeStore(); } from '../api/home';
const userStore = useUserStore(); import {
useUserStore
// 定义需要曝光检测的元素配置 } from '../stores/user';
const EXPOSURE_CONFIGS = [ import RegisterLayer from "../components/RegisterLayer.vue";
{ import md from '../md';
id: 'firstScreen', import ExposureTracker from '../utils/exposure';
logParams: { import {
xcxPage: '首页-首屏页面浏览', getHealthField
pageName: '首页-首屏' } from "@/api/common";
}
}, // const homeStore = useHomeStore();
// 可以添加更多需要曝光检测的元素配置 const userStore = useUserStore();
{
id: 'secondScreen', // 定义需要曝光检测的元素配置
logParams: { const EXPOSURE_CONFIGS = [{
xcxPage: '首页-二屏页面浏览', id: 'firstScreen',
pageName: '首页-二屏' logParams: {
} xcxPage: '首页-首屏页面浏览',
}, pageName: '首页-首屏'
{ }
id: 'thirdScreen', },
logParams: { // 可以添加更多需要曝光检测的元素配置
xcxPage: '首页-三屏页面浏览', {
pageName: '首页-三屏' id: 'secondScreen',
} logParams: {
}, xcxPage: '首页-二屏页面浏览',
{ pageName: '首页-二屏'
id: 'fourthScreen', }
logParams: { },
xcxPage: '首页-四屏页面浏览', {
pageName: '首页-四屏' id: 'thirdScreen',
} logParams: {
} xcxPage: '首页-三屏页面浏览',
]; pageName: '首页-三屏'
}
export default { },
beforeDestroy() { {
if (this.exposureTracker) { id: 'fourthScreen',
this.exposureTracker.resetAllExposure(); logParams: {
} xcxPage: '首页-四屏页面浏览',
}, pageName: '首页-四屏'
deactivated() { }
if (this.exposureTracker) { }
this.exposureTracker.resetAllExposure(); ];
}
}, export default {
data() { beforeDestroy() {
return { if (this.exposureTracker) {
popType: 'bottom', this.exposureTracker.resetAllExposure();
statusBarHeight: 38, }
showRegisterLayer: false, },
swiperList: [], deactivated() {
indicatorDots: true, if (this.exposureTracker) {
autoplay: true, this.exposureTracker.resetAllExposure();
interval: 4000, }
duration: 500, },
indicatoractiveColor: "#a6a0a1", data() {
indicatorColor: "rgba(255, 255, 255, 1)", return {
toolList: {}, popType: 'bottom',
expertTeam: {}, statusBarHeight: 38,
vipCardList: [], showRegisterLayer: false,
contentImgList: [], swiperList: [],
channelTabList: [], indicatorDots: true,
channelTabIndex: 0, autoplay: true,
changelInfoList: [], interval: 4000,
childrenInfoList: [], duration: 500,
bottomLinkList: [], indicatoractiveColor: "#a6a0a1",
qrInfoObj: undefined, indicatorColor: "rgba(255, 255, 255, 1)",
popupIndex: 0, toolList: {},
qrInfoList: [{ title: '', desc: '', qrUrl: '' }, { title: '', desc: '', qrUrl: '' }, { title: '', desc: '', qrUrl: '' }, { title: '', desc: '', qrUrl: '' }], expertTeam: {},
qrObj: { title: '', desc: '', qrUrl: '' }, vipCardList: [],
showVideo: false, contentImgList: [],
currentVideoUrl: '', channelTabList: [],
isClickPhoneAuth: false, channelTabIndex: 0,
voiceStory: {}, changelInfoList: [],
suggest: {}, childrenInfoList: [],
videoHeight: '56vw', bottomLinkList: [],
qrNameList: ['公众号', '企业微信', '视频号', '小红书'], qrInfoObj: undefined,
windowHeight: 0, popupIndex: 0,
isFirstScreenExposed: false, qrInfoList: [{
scrollTimer: null, title: '',
exposureTracker: null, desc: '',
currentIndex: 0, qrUrl: ''
etTabSelIndex: 0, }, {
bannerCurrentIndex: 0, title: '',
childrenInfoListMianTitle: '', desc: '',
channelTabListMianTitle: '', qrUrl: ''
popupImageUrl: '', }, {
popupImageObj: {}, title: '',
} desc: '',
}, qrUrl: ''
components: { }, {
RegisterLayer title: '',
}, desc: '',
computed: { qrUrl: ''
homeStore() { }],
return useHomeStore(); qrObj: {
} title: '',
}, desc: '',
props: { qrUrl: ''
scrollTop: { },
type: Number, showVideo: false,
default: 0 currentVideoUrl: '',
} isClickPhoneAuth: false,
}, voiceStory: {},
watch: { suggest: {},
homeStore: { videoHeight: '56vw',
handler(newVal) { qrNameList: ['公众号', '企业微信', '视频号', '小红书'],
this.showRegisterLayer = this.isClickPhoneAuth && newVal.isLogin && !newVal.babyExistence; windowHeight: 0,
if (newVal.homeInfo !== null) { isFirstScreenExposed: false,
this.initHomeInfo(); scrollTimer: null,
this.checkAndShowPopup(); exposureTracker: null,
} currentIndex: 0,
}, etTabSelIndex: 0,
deep: true, bannerCurrentIndex: 0,
immediate: true childrenInfoListMianTitle: '',
}, channelTabListMianTitle: '',
scrollTop: { popupImageUrl: '',
handler(newVal) { popupImageObj: {},
this.checkExposure(newVal); }
} },
} components: {
}, RegisterLayer
mounted() { },
const menuButtonInfo = wx.getMenuButtonBoundingClientRect(); computed: {
this.statusBarHeight = menuButtonInfo.top; homeStore() {
this.isClickPhoneAuth = false; return useHomeStore();
}
// 获取窗口高度 },
const systemInfo = uni.getSystemInfoSync(); props: {
this.windowHeight = systemInfo.windowHeight; scrollTop: {
type: Number,
// 初始化曝光检测工具 default: 0
this.exposureTracker = new ExposureTracker(this); }
this.exposureTracker.addExposureElements(EXPOSURE_CONFIGS); },
watch: {
// 初始检查曝光 homeStore: {
this.$nextTick(() => { handler(newVal) {
this.checkExposure(this.scrollTop); this.showRegisterLayer = this.isClickPhoneAuth && newVal.isLogin && !newVal.babyExistence;
}); if (newVal.homeInfo !== null) {
}, this.initHomeInfo();
unmounted() { this.checkAndShowPopup();
// 组件销毁时清理弹窗状态（可选，根据业务需求决定是否保留状态） }
// 如果需要重置弹窗状态，可以在这里调用 this.resetPopupState() },
}, deep: true,
methods: { immediate: true
},
testSource() { scrollTop: {
uni.navigateTo({ handler(newVal) {
url: '/pages/syWebview/syWebview?p=xmh' this.checkExposure(newVal);
}) }
}, }
async initHomeInfo() { },
const { data } = await fetchHomeJSON(); mounted() {
console.warn("data", data) const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
if (data) { this.statusBarHeight = menuButtonInfo.top;
this.swiperList = data.swiperList; this.isClickPhoneAuth = false;
this.vipConfigList = data.vipConfigList;
// this.vipCardList = data.vipCardList; // 获取窗口高度
this.contentImgList = data.contentImgList; const systemInfo = uni.getSystemInfoSync();
this.channelTabList = data.channelTabList; this.windowHeight = systemInfo.windowHeight;
this.changelInfoList = data.changelInfoList;
this.childrenInfoList = data.childrenInfoList[0] || []; // 初始化曝光检测工具
this.bottomLinkList = data.bottomLinkList; this.exposureTracker = new ExposureTracker(this);
this.qrInfoList = data.qrInfoList || []; this.exposureTracker.addExposureElements(EXPOSURE_CONFIGS);
this.toolList = data.toolList;
this.expertTeam = data.expertTeam; // 初始检查曝光
this.vipCardList = data.vipCardList; this.$nextTick(() => {
this.voiceStory = data.voiceStory; this.checkExposure(this.scrollTop);
this.suggest = data.suggest; });
this.childrenInfoListMianTitle = data.childrenInfoListMianTitle; },
this.channelTabListMianTitle = data.channelTabListMianTitle; unmounted() {
this.popupImageUrl = this.$baseUrl + data.popupImageObj?.imageUrl || ''; // 组件销毁时清理弹窗状态（可选，根据业务需求决定是否保留状态）
this.popupImageObj = data.popupImageObj || {}; // 如果需要重置弹窗状态，可以在这里调用 this.resetPopupState()
},
if (this.homeStore.isLogin) { methods: {
this.vipCardList[0] = data.vipConfigList.find(item => item.grade === this.homeStore.homeInfo?.grade);
this.vipCardList[0].level = this.homeStore.homeInfo?.gradeName; testSource() {
uni.navigateTo({
url: '/pages/syWebview/syWebview?p=xmh'
})
},
async initHomeInfo() {
const {
data
} = await fetchHomeJSON();
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 || {};
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];
}
}
},
changeIndicatorDots(e) {
this.indicatorDots = !this.indicatorDots
},
changeAutoplay(e) {
this.autoplay = !this.autoplay
},
intervalChange(e) {
this.interval = e.target.value
},
durationChange(e) {
this.duration = e.target.value
},
jumpBannerHandler(item, index) {
md.sensorLogTake({
xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏',
buttonName: `第${index + 1}张焦点图-入口`,
});
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 // 当前显示的图片
});
}
},
previewImage(url) {
uni.previewImage({
urls: [url], // 预览当前图片
current: url // 当前显示的图片
});
},
jumpLinkWithLogin(link, evt) {
if (evt) {
md.sensorLog(evt);
}
if (this.homeStore.isLogin) {
jump(link);
}
},
jumpLinkCard(item, evt) {
if (evt) {
md.sensorLog(evt);
}
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 (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);
}
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 (_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;
},
onBannerSwiperChange(e) {
this.bannerCurrentIndex = e.detail.current;
},
async handleToolClick(item) {
md.sensorLogTake({
xcxClick: "首页-二屏页面点击",
pageName: "首页-二屏",
buttonName: 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按钮点击",
});
this.etTabSelIndex = index;
},
onETMore(index, type) {
let str = '';
if (type === 0) {
str = '名医专家';
} else if (type === 1) {
str = '科研专家';
} else { } else {
this.vipCardList[0] = data.vipConfigList[0]; str = '权威机构';
} }
}
},
changeIndicatorDots(e) {
this.indicatorDots = !this.indicatorDots
},
changeAutoplay(e) {
this.autoplay = !this.autoplay
},
intervalChange(e) {
this.interval = e.target.value
},
durationChange(e) {
this.duration = e.target.value
},
jumpBannerHandler(item, index) {
md.sensorLogTake({
xcxClick: '首页-首屏页面点击',
pageName: '首页-首屏',
buttonName: `第${index + 1}张焦点图-入口`,
});
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 // 当前显示的图片
});
}
},
previewImage(url) {
uni.previewImage({
urls: [url], // 预览当前图片
current: url // 当前显示的图片
});
},
jumpLinkWithLogin(link, evt) {
if (evt) {
md.sensorLog(evt);
}
if (this.homeStore.isLogin) {
jump(link);
}
},
jumpLinkCard(item, evt) {
if (evt) {
md.sensorLog(evt);
}
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 (videoUrl) {
if (videoUrl.indexOf('http') === -1) {
videoUrl = this.$baseUrl + videoUrl;
}
// 弹出视频
this.currentVideoUrl = videoUrl;
if (index === 1) { if (index === 1) {
this.videoHeight = "100vw"; str += '内容'
} else { } else {
this.videoHeight = "56vw"; str += '点击查看更多';
} }
this.showVideo = true; md.sensorLogTake({
return; xcxClick: "首页-二屏页面点击",
// 视频弹窗出现后，video标签的autoplay会自动播放 pageName: "首页-二屏",
} else if (link) { buttonName: str + "-点击",
if (!link || link === '') { });
return; jump({
} type: 1,
// 其他跳转逻辑 url: '/pages/expertTeamPage/expertTeamPage?tab=' + (this.etTabSelIndex + 1)
jump(link); });
} },
}, closeImagePopup() {
channelTabHandler(_index, evt) { this.$refs.imagePopup.close();
if (evt) { },
md.sensorLog(evt);
} imagePopupJump() {
this.channelTabIndex = _index; jump({
}, type: this.popupImageObj.jumpType,
showPopup(_index, evt) { url: this.popupImageObj.jumpUrl
if (evt) { });
md.sensorLog(evt); },
} showImagePopup() {
md.sensorLogTake({ this.$refs.imagePopup.open('center');
xcxPage: `${this.qrNameList[_index]}拉起半屏二维码入口页面浏览`, },
pageName: `${this.qrNameList[_index]}拉起半屏二维码入口`, closePop1() {
}); this.$refs.imagePopup.close();
},
if (_index === 3) {
this.qrObj = null; // 重置弹窗状态（可在需要时调用）
} else { resetPopupState() {
_index = Math.max(0, Math.min(_index, this.qrInfoList.length - 1)); this.homeStore.resetPopupState(); // 重置 store 中的弹窗状态
this.qrObj = this.qrInfoList[_index]; },
}
this.popupIndex = _index; // 检查并显示弹窗（使用 store 全局状态管理）
this.$refs.popup.open(this.popType); checkAndShowPopup() {
}, // 使用 store 中的 hasShownPopup 来记录是否已经显示过弹窗
closePop() { if (!this.homeStore.hasShownPopup && this.homeStore.homeInfo?.showPop1) {
this.$refs.popup.close(); this.homeStore.markPopupAsShown(); // 标记已显示过弹窗（全局状态）
}, this.$nextTick(() => {
goSearchHandler(e) { setTimeout(() => {
md.sensorLog(e); this.showImagePopup();
uni.navigateTo({ }, 500);
url: "/pages/search/search" });
}) }
}, }
downloadHandler(imgurl) { }
md.sensorLogTake({ }
xcxClick: `${this.qrNameList[this.popupIndex]}拉起半屏二维码入口页面点击`, </script>
pageName: `${this.qrNameList[this.popupIndex]}拉起半屏二维码入口页面点击`,
buttonName: `下载二维码` <style lang="less" scoped>
}); @import '@/common.less';
uni.downloadFile({ .home-container {
url: imgurl, width: 100vw;
success: (downloadRes) => { overflow-x: hidden;
if (downloadRes.statusCode === 200) { background-color: white;
uni.saveImageToPhotosAlbum({
filePath: downloadRes.tempFilePath, .content {
success: (res) => { background-color: white;
uni.showToast({ padding-bottom: 200rpx;
title: '保存成功',
icon: 'success' .banner {
}); height: 1116rpx;
},
fail: (err) => { .banneritem {
uni.showToast({ width: 750rpx;
title: '保存失败', height: 1116rpx;
icon: 'none'
}); .b-img {
} width: 100%;
}); height: 100%;
} else { }
uni.showToast({ }
title: '下载失败', }
icon: 'none'
}); .swiper-mask {
} position: absolute;
}, left: 0;
fail: (err) => { width: 750rpx;
uni.showToast({ height: 192rpx;
title: '下载失败', z-index: 1;
icon: 'none' top: 1065rpx;
});
} .swiper-mask-img {
}); width: 100%;
}, height: 100%;
closeVideo() { }
this.showVideo = false; }
this.currentVideoUrl = '';
}, // 自定义banner指示器样式
onGetPhoneNumber(e) { .custom-banner-indicator {
if (e.detail.errMsg !== 'getPhoneNumber:ok') { position: absolute;
uni.showToast({ top: 1075rpx;
title: '请授权使用手机号', left: 50%;
icon: 'none', transform: translateX(-50%);
}); display: flex;
return; align-items: center;
} justify-content: center;
console.log('detail', e.detail); gap: 16rpx;
this.isClickPhoneAuth = true;
userStore.phoneCallback(e.detail); .banner-dot {
}, width: 16rpx;
goCustomerHandler(e) { height: 16rpx;
md.sensorLog(e); border-radius: 50%;
const { memberId, mobile, openId, unionId } = this.homeStore.homeInfo; background-color: #feebc4;
const customerUrl = `https://intelcc-user.icsoc.net/?channelKey=45839e0505554f8c8aea3c7b6259b049&init=1&crmld=${memberId}&mobile=${mobile}&openId=${openId}&unionId=${unionId}`; transition: all 0.3s ease;
jump({ type: JumpType.H5, url: customerUrl }); flex-shrink: 0;
},
checkExposure(scrollTop) { &.active {
if (this.exposureTracker) { width: 40rpx;
this.exposureTracker.checkExposure(scrollTop); height: 16rpx;
} border-radius: 8rpx;
}, background-color: #D3A358;
resetExposure() { }
if (this.exposureTracker) { }
this.exposureTracker.resetAllExposure(); }
}
}, .barbox {
position: absolute;
onSwiperChange(e) { top: 97rpx;
this.currentIndex = e.detail.current; left: 32rpx;
}, display: flex;
align-items: center;
onBannerSwiperChange(e) {
this.bannerCurrentIndex = e.detail.current; .btnlogo {
}, width: 184rpx;
height: 66rpx;
async handleToolClick(item) { }
md.sensorLogTake({
xcxClick: "我的页面点击", .btnsearch {
pageName: "我的页面", width: 150rpx;
buttonName: item.title, height: 68rpx;
}); margin-left: 20rpx;
}
if (item.title === "医生问诊") {
// if (!cfgStatus.value.isRegister) return; .customer-btn-wrap {
const res = await getHealthField(); position: relative;
display: inline-block;
if (!res.success) { }
uni.showToast({
title: "获取健康字段失败", .btncustomer {
icon: "none", width: 70rpx;
}); height: 68rpx;
return; margin-left: 110rpx;
} }
const { sign, timestamp, appId, partnerUserId, env } = res.data; .phone-auth-btn-cover {
position: absolute;
jump({ left: 0;
type: JumpType.MINI, top: 0;
url: "/pages/partner/redirect", right: 0;
extra: { bottom: 0;
appId: "wx81ecfb5aa3fb512f", width: 100%;
envVersion: env, height: 100%;
extraData: { background: transparent;
sign, // 参考 4.请求参数 opacity: 0;
timestamp, // 参考 4.请求参数 border: none;
appId, // 参考 4.请求参数 padding: 0;
partnerUserId, // 参考 4.请求参数 margin: 0;
targetApp: z-index: 10;
"/h5/partner/shining-like-a-start/landing-free-consult?sysType=CRF", pointer-events: auto;
}, }
}, }
});
} else { // .txtbox {
jump({ type: item.link.type, url: item.link.url }); // width: 100%;
} // height: 76rpx;
}, // background-color: @color-white-soft;
// text-align: center;
onSelEtTap(index) {
this.etTabSelIndex = index; // .txtlink {
}, // color: @color-gold-cover;
onETMore() { // font-size: 24rpx;
jump({ type: 1, url: '/pages/expertTeamPage/expertTeamPage?tab=' + (this.etTabSelIndex + 1) }); // text-underline-offset: 10rpx;
}, // text-decoration: underline;
closeImagePopup() { // }
this.$refs.imagePopup.close();
}, // .icon_arrow_yellow {
// width: 12rpx;
imagePopupJump() { // height: 20rpx;
jump({ type: this.popupImageObj.jumpType, url: this.popupImageObj.jumpUrl }); // margin-left: 10rpx;
}, // }
showImagePopup() { // }
this.$refs.imagePopup.open('center');
}, .tools_box {
closePop1() { width: 750rpx;
this.$refs.imagePopup.close(); height: 840rpx;
}, margin-top: 40rpx;
overflow-x: scroll;
// 重置弹窗状态（可在需要时调用） padding-left: 38rpx;
resetPopupState() {
this.homeStore.resetPopupState(); // 重置 store 中的弹窗状态 .tools_maintitle {
}, font-size: 42rpx;
color: #000;
// 检查并显示弹窗（使用 store 全局状态管理） }
checkAndShowPopup() {
// 使用 store 中的 hasShownPopup 来记录是否已经显示过弹窗 .tools_subtitle {
if (!this.homeStore.hasShownPopup && this.homeStore.homeInfo?.showPop1) { margin-top: 10rpx;
this.homeStore.markPopupAsShown(); // 标记已显示过弹窗（全局状态） font-size: 24rpx;
this.$nextTick(() => { color: #999;
setTimeout(() => { }
this.showImagePopup();
}, 500); .tool_swiper {
}); margin-top: 35rpx;
} width: 720rpx;
} height: 700rpx;
} overflow: visible;
} /* 关键：允许内容溢出 */
</script>
.swiperItem {
<style lang="less" scoped> width: 400rpx;
@import '@/common.less'; height: 700rpx;
top: 40rpx;
.home-container { }
width: 100vw;
overflow-x: hidden; /* 当前激活项放大 */
background-color: white; .swiperItem.active {
top: 0rpx !important;
.content { z-index: 10;
background-color: white; transition: top 0.4s ease;
padding-bottom: 200rpx; }
.banner { .tool {
height: 1116rpx; position: absolute;
width: 400rpx;
.banneritem { height: 700rpx;
width: 750rpx;
height: 1116rpx; .sq_btn {
position: absolute;
.b-img { left: 0rpx;
width: 100%; top: 0rpx;
height: 100%; width: 400rpx;
} height: 650rpx;
} // background-color: red;
} opacity: 0;
z-index: 2;
.swiper-mask { }
position: absolute;
left: 0; .tool_bg {
width: 750rpx; position: absolute;
height: 192rpx; left: 0rpx;
z-index: 1; top: 0rpx;
top: 1065rpx; width: 400rpx;
height: 650rpx;
.swiper-mask-img { border-radius: 40rpx;
width: 100%; z-index: 1;
height: 100%; }
}
} .tool_icon {
position: absolute;
// 自定义banner指示器样式 left: 0rpx;
.custom-banner-indicator { top: 0rpx;
position: absolute; width: 400rpx;
top: 1075rpx; height: 470rpx;
left: 50%; border-radius: 40rpx;
transform: translateX(-50%); }
display: flex;
align-items: center; .tool_jt {
justify-content: center; position: absolute;
gap: 16rpx; left: 300rpx;
top: 510rpx;
.banner-dot { width: 74rpx;
width: 16rpx; height: 44rpx;
height: 16rpx; }
border-radius: 50%;
background-color: #feebc4; .tool_title {
transition: all 0.3s ease; position: absolute;
flex-shrink: 0; left: 30rpx;
top: 510rpx;
&.active { color: #000;
width: 40rpx; font-size: 36rpx;
height: 16rpx; width: 300rpx;
border-radius: 8rpx;
background-color: #D3A358; }
}
} .tool_context {
} position: absolute;
left: 30rpx;
.barbox { top: 575rpx;
position: absolute; font-size: 24rpx;
top: 97rpx; color: #999;
left: 32rpx; width: 300rpx;
display: flex; }
align-items: center; }
}
.btnlogo {
width: 184rpx;
height: 66rpx; /* 自定义指示点样式 */
} .custom-indicator {
width: 200rpx;
.btnsearch { height: 10rpx;
width: 150rpx; margin-top: -15rpx;
height: 68rpx; margin-left: -20rpx;
margin-left: 20rpx; display: flex;
} justify-content: center;
gap: 10rpx;
.customer-btn-wrap { }
position: relative;
display: inline-block; .indicator-dot {
} width: 10rpx;
height: 10rpx;
.btncustomer { border-radius: 10rpx;
width: 70rpx; background-color: #feefcc;
height: 68rpx; transition: all 0.3s;
margin-left: 110rpx; }
}
.indicator-dot.active {
.phone-auth-btn-cover { width: 70rpx;
position: absolute; border-radius: 10rpx;
left: 0; background-color: #d3a358;
top: 0; }
right: 0; }
bottom: 0;
width: 100%; .et_box {
height: 100%; width: 750rpx;
background: transparent; // height: 840rpx;
opacity: 0; margin-top: 30rpx;
border: none; padding-left: 38rpx;
padding: 0;
margin: 0; .et_maintitle {
z-index: 10; font-size: 42rpx;
pointer-events: auto; color: #000;
} }
}
.et_subtitle {
// .txtbox { width: 700rpx;
// width: 100%; margin-top: 10rpx;
// height: 76rpx; display: flex;
// background-color: @color-white-soft;
// text-align: center; .txtlink {
width: 500rpx;
// .txtlink { color: @color-gold-cover;
// color: @color-gold-cover; font-size: 24rpx;
// font-size: 24rpx; text-underline-offset: 5rpx;
// text-underline-offset: 10rpx; text-decoration: underline;
// text-decoration: underline; }
// }
.icon_more {
// .icon_arrow_yellow { width: 140rpx;
// width: 12rpx; height: 36rpx;
// height: 20rpx; margin-left: 45rpx;
// margin-left: 10rpx; margin-top: 2rpx;
// } }
// } }
.tools_box { .et_main_box {
width: 750rpx; padding-top: 30rpx;
height: 840rpx; margin-top: 35rpx;
margin-top: 40rpx; width: 670rpx;
overflow-x: scroll; height: 602rpx;
padding-left: 38rpx; background-color: #fde8bb;
border-radius: 38rpx;
.tools_maintitle {
font-size: 42rpx; .et_con_bg {
color: #000; margin-left: 3rpx;
} width: 651rpx;
height: 562rpx;
.tools_subtitle { background-color: #ffffff;
margin-top: 10rpx; border-radius: 38rpx;
font-size: 24rpx; padding-left: 15rpx;
color: #999; padding-top: 25rpx;
}
.et_tab_box {
.tool_swiper { height: 70rpx;
margin-top: 35rpx; display: flex;
width: 720rpx; gap: 15rpx;
height: 700rpx;
overflow: visible; .tab_box {
/* 关键：允许内容溢出 */ width: 204rpx;
height: 70rpx;
.swiperItem {
width: 400rpx; .et_tab {
height: 700rpx; width: 204rpx;
top: 40rpx; height: 70rpx;
} }
}
/* 当前激活项放大 */ }
.swiperItem.active {
top: 0rpx !important; .et_con_box {
z-index: 10; width: 631rpx;
transition: top 0.4s ease; height: 365rpx;
} margin-top: 40rpx;
.tool { .et_con1 {
position: absolute; width: 631rpx;
width: 400rpx; height: 365rpx;
height: 700rpx; }
.sq_btn{ .et_con2 {
position: absolute; width: 631rpx;
left: 0rpx; height: 365rpx;
top: 0rpx; }
width: 400rpx;
height: 650rpx; .et_con3 {
// background-color: red; width: 598rpx;
opacity: 0; height: 303rpx;
z-index: 2; margin-top: 20rpx;
} margin-left: 16rpx;
}
.tool_bg { }
position: absolute;
left: 0rpx; .et_more_txt {
top: 0rpx; width: 100%;
width: 400rpx; font-size: 24rpx;
height: 650rpx; color: @color-gold-cover;
border-radius: 40rpx; text-align: center;
z-index: 1; margin-top: 30rpx;
}
.icon_arrow_yellow {
.tool_icon { width: 12rpx;
position: absolute; height: 20rpx;
left: 0rpx; margin-left: 5rpx;
top: 0rpx; }
width: 400rpx; }
height: 470rpx; }
border-radius: 40rpx; }
} }
.tool_jt { .cardScroller {
position: absolute; width: 750rpx;
left: 300rpx; overflow-x: scroll;
top: 510rpx; }
width: 74rpx;
height: 44rpx; .cardbox {
} //
position: relative;
.tool_title { display: inline-flex;
position: absolute; flex-wrap: nowrap;
left: 30rpx; margin-top: 32rpx;
top: 510rpx;
color: #000; .cardboxitem {
font-size: 36rpx; width: 380rpx;
width: 300rpx; height: 232rpx;
position: relative;
} margin-left: 32rpx;
.tool_context { .bg {
position: absolute; width: 380rpx;
left: 30rpx; height: 232rpx;
top: 575rpx; position: absolute;
font-size: 24rpx; z-index: 0;
color: #999;
width: 300rpx; }
}
} .level {
} position: absolute;
left: 24rpx;
top: 30rpx;
/* 自定义指示点样式 */ font-size: 32rpx;
.custom-indicator { font-weight: bold;
width: 200rpx; color: @color-gold-cover;
height: 10rpx; pointer-events: none;
margin-top: -15rpx; }
margin-left: -20rpx;
display: flex; .subTitle {
justify-content: center; position: absolute;
gap: 10rpx; left: 24rpx;
} top: 80rpx;
font-size: 24rpx;
.indicator-dot { color: @color-black-deep;
width: 10rpx; pointer-events: none;
height: 10rpx; }
border-radius: 10rpx;
background-color: #feefcc; .showCornerTxt {
transition: all 0.3s; position: absolute;
} right: 0;
top: 0;
.indicator-dot.active { color: white;
width: 70rpx; font-size: 24rpx;
border-radius: 10rpx; padding: 10rpx;
background-color: #d3a358; border-radius: 0 10rpx 0 10rpx;
} background-color: @color-gold-main;
} }
.et_box { .cardbtn {
width: 750rpx; position: relative;
// height: 840rpx; left: 6rpx;
margin-top: 30rpx; top: 130rpx;
padding-left: 38rpx;
.phone-auth-btn-cover {
.et_maintitle { position: absolute;
font-size: 42rpx; width: 368rpx;
color: #000; height: 88rpx;
} z-index: 0;
left: 0;
.et_subtitle { top: 0;
width: 700rpx; opacity: 0;
margin-top: 10rpx; pointer-events: auto;
display: flex;
}
.txtlink {
width: 500rpx; .cardbtnbg {
color: @color-gold-cover; position: absolute;
font-size: 24rpx; width: 368rpx;
text-underline-offset: 5rpx; height: 88rpx;
text-decoration: underline; z-index: 0;
} left: 0;
top: 0;
.icon_more { }
width: 140rpx;
height: 36rpx; .btnTitle {
margin-left: 45rpx; position: absolute;
margin-top: 2rpx; // z-index: 1;
} width: 180rpx;
} text-align: center;
font-size: 24rpx;
.et_main_box { color: white;
padding-top: 30rpx; // border: 1px solid red;
margin-top: 35rpx; top: 23rpx;
width: 670rpx; left: 20rpx;
height: 602rpx; }
background-color: #fde8bb;
border-radius: 38rpx; .btnSubTitle {
position: absolute;
.et_con_bg { top: 23rpx;
margin-left: 3rpx; // z-index: 1;
width: 651rpx; font-size: 24rpx;
height: 562rpx; font-weight: bold;
background-color: #ffffff; color: @color-gold-light;
border-radius: 38rpx; left: 210rpx;
padding-left: 15rpx; }
padding-top: 25rpx; }
}
.et_tab_box { }
height: 70rpx;
display: flex; .contentbox {
gap: 15rpx; width: 750rpx;
height: 1429rpx;
.tab_box { position: relative;
width: 204rpx; margin-top: 32px;
height: 70rpx;
.contentbg {
.et_tab { width: 100%;
width: 204rpx; height: 100%;
height: 70rpx; position: absolute;
} }
}
} .contentitem {
position: absolute;
.et_con_box { }
width: 631rpx;
height: 365rpx; }
margin-top: 40rpx;
.channelbox {
.et_con1 { margin-top: 32rpx;
width: 631rpx; margin-left: 32rpx;
height: 365rpx;
} .maintitle {
color: @color-black-deep;
.et_con2 { font-size: 38rpx;
width: 631rpx; font-weight: bold;
height: 365rpx; display: block;
} margin-left: 5rpx;
}
.et_con3 {
width: 598rpx; .subtitle_box {
height: 303rpx; display: flex;
margin-top: 20rpx; margin-top: 10rpx;
margin-left: 16rpx; margin-left: 5rpx;
} width: 700rpx;
}
.subtitle {
.et_more_txt { width: 500rpx;
width: 100%; color: @color-black-deep;
font-size: 24rpx; font-size: 24rpx;
color: @color-gold-cover; }
text-align: center;
margin-top: 30rpx; .icon_more {
width: 127rpx;
.icon_arrow_yellow { height: 34rpx;
width: 12rpx; margin-left: 45rpx;
height: 20rpx; margin-top: 2rpx;
margin-left: 5rpx; }
} }
}
}
}
} .listbox {
display: flex;
.cardScroller { margin-top: 20rpx;
width: 750rpx; width: 686rpx;
overflow-x: scroll; align-content: center;
} justify-content: space-between;
.cardbox { .tabitem {
// color: @color-black-deep;
position: relative; background-color: #e9edf1;
display: inline-flex; padding: 15rpx 20rpx;
flex-wrap: nowrap; font-size: 22rpx;
margin-top: 32rpx; // margin-right: 15rpx;
border-radius: 30rpx;
.cardboxitem { }
width: 380rpx;
height: 232rpx; .tabActive {
position: relative; color: white;
margin-left: 32rpx; background-color: @color-gold-main;
}
.bg { }
width: 380rpx;
height: 232rpx; .channelscroll {
position: absolute; width: 718rpx;
z-index: 0; overflow-y: scroll;
margin-top: 32rpx;
} height: 620rpx;
.level { .box {
position: absolute; display: flex;
left: 24rpx; flex-direction: column;
top: 30rpx;
font-size: 32rpx; .infobox {
font-weight: bold; width: 670rpx;
color: @color-gold-cover; height: 180rpx;
pointer-events: none; display: flex;
} align-items: center;
background-color: #fff;
.subTitle { border-radius: 16rpx;
position: absolute; border: 2rpx solid #feeecb;
left: 24rpx; margin-bottom: 20rpx;
top: 80rpx;
font-size: 24rpx; .infoimg {
color: @color-black-deep; border-radius: 12rpx 0rpx 0rpx 12rpx;
pointer-events: none; -webkit-flex-shrink: 0;
} flex-shrink: 0;
height: 180rpx;
.showCornerTxt { /* margin-top: -1rpx ; */
position: absolute; width: 180rpx;
right: 0; }
top: 0;
color: white; .infotitlebox {
font-size: 24rpx; flex: 1;
padding: 10rpx; margin-left: 20rpx;
border-radius: 0 10rpx 0 10rpx; display: flex;
background-color: @color-gold-main; flex-direction: column;
} justify-content: center;
.cardbtn { .infotitlecon {
position: relative; display: flex;
left: 6rpx; flex-direction: row;
top: 130rpx;
.infotitle {
.phone-auth-btn-cover { color: @color-black-deep;
position: absolute; width: 400rpx;
width: 368rpx; font-size: 24rpx;
height: 88rpx; font-weight: bold;
z-index: 0; margin-bottom: 8rpx;
left: 0; display: -webkit-box;
top: 0; -webkit-line-clamp: 1;
opacity: 0; -webkit-box-orient: vertical;
pointer-events: auto; overflow: hidden;
line-height: 1.3;
} }
.cardbtnbg { .infotitletag {
position: absolute; width: 46rpx;
width: 368rpx; height: 22rpx;
height: 88rpx; color: #fff;
z-index: 0;
left: 0; }
top: 0; }
}
.btnTitle {
position: absolute; .infodesc {
// z-index: 1; color: #999999;
width: 180rpx; font-size: 22rpx;
text-align: center; width: 450rpx;
font-size: 24rpx; line-height: 1.3;
color: white; display: -webkit-box;
// border: 1px solid red; -webkit-line-clamp: 3;
top: 23rpx; -webkit-box-orient: vertical;
left: 20rpx; overflow: hidden;
} }
}
.btnSubTitle {
position: absolute;
top: 23rpx;
// z-index: 1; }
font-size: 24rpx; }
font-weight: bold;
color: @color-gold-light; }
left: 210rpx;
} .channelscroll2 {
} width: 718rpx;
} margin-top: 32rpx;
} margin-left: -16rpx;
.contentbox { .box2 {
width: 750rpx; width: 718rpx;
height: 1429rpx; display: flex;
position: relative; flex-wrap: wrap;
margin-top: 32px; justify-content: space-between;
.contentbg { .infobox2 {
width: 100%; width: 330rpx;
height: 100%; height: 430rpx;
position: absolute; display: flex;
} flex-direction: column;
align-items: center;
.contentitem { background-color: #fff;
position: absolute; border-radius: 16rpx;
} border: 4rpx solid #feeecb;
margin-bottom: 20rpx;
} position: relative;
.channelbox { .infoimg2 {
margin-top: 32rpx; width: 330rpx;
margin-left: 32rpx; height: 306rpx;
border-radius: 12rpx 12rpx 0rpx 0rpx;
.maintitle { flex-shrink: 0;
color: @color-black-deep; }
font-size: 38rpx;
font-weight: bold; .infotitle2box {
display: block; margin-top: 10rpx;
margin-left: 5rpx; flex: 1;
} display: flex;
flex-direction: column;
.subtitle_box { justify-content: center;
display: flex; width: 100%;
margin-top: 10rpx; padding: 0 10rpx;
margin-left: 5rpx;
width: 700rpx; .infotitle2 {
color: @color-black-deep;
.subtitle { width: 90%;
width: 500rpx; font-size: 24rpx;
color: @color-black-deep; font-weight: bold;
font-size: 24rpx; margin-bottom: 8rpx;
} display: -webkit-box;
-webkit-line-clamp: 2;
.icon_more { -webkit-box-orient: vertical;
width: 127rpx; overflow: hidden;
height: 34rpx; line-height: 1.3;
margin-left: 45rpx; text-align: left;
margin-top: 2rpx; margin-left: 5%;
} }
} }
}
}
}
.listbox {
display: flex;
margin-top: 20rpx; .desc {
width: 686rpx;
align-content: center; color: @color-black-deep;
justify-content: space-between; font-size: 24rpx;
display: flex;
.tabitem { align-items: center;
color: @color-black-deep; justify-content: center;
background-color: #e9edf1; margin-top: 32rpx;
padding: 15rpx 20rpx;
font-size: 22rpx; .desc1 {
// margin-right: 15rpx; color: @color-gold-cover;
border-radius: 30rpx; margin-left: 5rpx;
} }
}
.tabActive {
color: white; .desc2 {
background-color: @color-gold-main; padding-bottom: 32rpx;
} }
} }
.channelscroll { .bottomlink {
width: 718rpx; width: 750rpx;
overflow-y: scroll; height: 247rpx;
margin-top: 32rpx;
height: 620rpx; .bottombg {
width: 750rpx;
.box { height: 247rpx;
display: flex; position: absolute;
flex-direction: column; }
.infobox { .box {
width: 670rpx; position: relative;
height: 180rpx; top: 100rpx;
display: flex; width: 74%;
align-items: center; left: 13%;
background-color: #fff; display: flex;
border-radius: 16rpx; align-items: flex-end;
border: 2rpx solid #feeecb; justify-content: space-between;
margin-bottom: 20rpx;
.icon {}
.infoimg {
border-radius: 12rpx 0rpx 0rpx 12rpx; }
-webkit-flex-shrink: 0; }
flex-shrink: 0;
height: 180rpx; }
/* margin-top: -1rpx ; */
width: 180rpx; .popup-content {
} width: 750rpx;
height: 812rpx;
.infotitlebox { border-top-left-radius: 48rpx;
flex: 1; border-top-right-radius: 48rpx;
margin-left: 20rpx; position: relative;
display: flex;
flex-direction: column; .btnclose {
justify-content: center; width: 70rpx;
height: 70rpx;
.infotitlecon { position: absolute;
display: flex; top: 36rpx;
flex-direction: row; right: 32rpx;
}
.infotitle {
color: @color-black-deep; .xingmahui {
width: 400rpx; width: 750rpx;
font-size: 24rpx; height: 100%;
font-weight: bold; position: absolute;
margin-bottom: 8rpx; bottom: 0;
display: -webkit-box; }
-webkit-line-clamp: 1;
-webkit-box-orient: vertical; .title {
overflow: hidden; position: absolute;
line-height: 1.3; top: 47rpx;
} left: 32rpx;
font-size: 36rpx;
.infotitletag { color: @color-black-deep;
width: 46rpx; font-weight: bold;
height: 22rpx;
color: #fff; }
} .desc {
} position: absolute;
top: 108rpx;
left: 32rpx;
font-size: 28rpx;
.infodesc { color: @color-black-medium;
color: #999999; font-weight: bold;
font-size: 22rpx;
width: 450rpx; }
line-height: 1.3;
display: -webkit-box; .qrcode {
-webkit-line-clamp: 3; width: 340rpx;
-webkit-box-orient: vertical; height: 340rpx;
overflow: hidden; position: absolute;
} top: 220rpx;
} left: 205rpx;
}
.btndownload {
} width: 286rpx;
} height: 89rpx;
position: absolute;
} top: 630rpx;
left: 232rpx;
.channelscroll2 { }
width: 718rpx; }
margin-top: 32rpx;
margin-left: -16rpx; .video-popup {
position: fixed;
.box2 { left: 0;
width: 718rpx; top: 0;
display: flex; right: 0;
flex-wrap: wrap; bottom: 0;
justify-content: space-between; background: rgba(0, 0, 0, 0.7);
display: flex;
.infobox2 { flex-direction: column;
width: 330rpx; align-items: center;
height: 430rpx; justify-content: center;
display: flex; z-index: 9999;
flex-direction: column; }
align-items: center;
background-color: #fff; .close-btn-bottom {
border-radius: 16rpx; margin: 32rpx auto 0 auto;
border: 4rpx solid #feeecb; width: 64rpx;
margin-bottom: 20rpx; height: 64rpx;
position: relative; border-radius: 50%;
background: rgba(0, 0, 0, 0.5);
.infoimg2 { color: #fff;
width: 330rpx; font-size: 44rpx;
height: 306rpx; line-height: 64rpx;
border-radius: 12rpx 12rpx 0rpx 0rpx; text-align: center;
flex-shrink: 0; z-index: 10001;
} display: flex;
align-items: center;
.infotitle2box { justify-content: center;
margin-top: 10rpx; }
flex: 1;
display: flex; .phone-auth-mask {
flex-direction: column; position: fixed;
justify-content: center; left: 0;
width: 100%; top: 0;
padding: 0 10rpx; right: 0;
bottom: 0;
.infotitle2 { background: rgba(0, 0, 0, 0.5);
color: @color-black-deep; z-index: 1000;
width: 90%; }
font-size: 24rpx;
font-weight: bold; .phone-auth-popup {
margin-bottom: 8rpx; position: fixed;
display: -webkit-box; left: 50%;
-webkit-line-clamp: 2; top: 50%;
-webkit-box-orient: vertical; transform: translate(-50%, -50%);
overflow: hidden; background: #fff;
line-height: 1.3; border-radius: 16rpx;
text-align: left; padding: 40rpx 32rpx;
margin-left: 5%; z-index: 1001;
} display: flex;
} flex-direction: column;
} align-items: center;
} }
}
.phone-auth-btn {
background: #ffd700;
.desc { color: #333;
font-size: 32rpx;
color: @color-black-deep; border-radius: 8rpx;
font-size: 24rpx; padding: 20rpx 60rpx;
display: flex; margin-bottom: 20rpx;
align-items: center; }
justify-content: center;
margin-top: 32rpx; .close-btn {
font-size: 40rpx;
.desc1 { color: #999;
color: @color-gold-cover; margin-top: 10rpx;
margin-left: 5rpx; }
}
} .image-popup-content {
width: 100%;
.desc2 { height: 100%;
padding-bottom: 32rpx; display: flex;
} flex-direction: column;
} align-items: center;
justify-content: center;
.bottomlink { border-radius: 16rpx;
width: 750rpx; position: relative;
height: 247rpx;
.popup-image {
.bottombg { width: 500rpx;
width: 750rpx; height: 700rpx;
height: 247rpx; border-radius: 16rpx;
position: absolute; object-fit: cover;
} }
.box { .popup-close-btn {
position: relative; width: 70rpx;
top: 100rpx; height: 70rpx;
width: 74%; position: absolute;
left: 13%; bottom: -50rpx;
display: flex; left: 50%;
align-items: flex-end; transform: translateX(-50%);
justify-content: space-between; z-index: 10;
}
.icon {} }
}
}
}
}
.popup-content {
width: 750rpx;
height: 812rpx;
border-top-left-radius: 48rpx;
border-top-right-radius: 48rpx;
position: relative;
.btnclose {
width: 70rpx;
height: 70rpx;
position: absolute;
top: 36rpx;
right: 32rpx;
}
.xingmahui {
width: 750rpx;
height: 100%;
position: absolute;
bottom: 0;
}
.title {
position: absolute;
top: 47rpx;
left: 32rpx;
font-size: 36rpx;
color: @color-black-deep;
font-weight: bold;
}
.desc {
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 {
width: 286rpx;
height: 89rpx;
position: absolute;
top: 630rpx;
left: 232rpx;
}
}
.video-popup {
position: fixed;
left: 0;
top: 0;
right: 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 {
margin: 32rpx auto 0 auto;
width: 64rpx;
height: 64rpx;
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;
}
.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 {
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: 500rpx;
height: 700rpx;
border-radius: 16rpx;
object-fit: cover;
}
.popup-close-btn {
width: 70rpx;
height: 70rpx;
position: absolute;
bottom: -50rpx;
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