|
@@ -3,18 +3,34 @@
|
|
<view class="container-pages clearfix">
|
|
<view class="container-pages clearfix">
|
|
<scroll-view scroll-x>
|
|
<scroll-view scroll-x>
|
|
<view class="tui-goods__list">
|
|
<view class="tui-goods__list">
|
|
|
|
+ <view class="tui-goods__item ross" v-if="isRossShow">
|
|
|
|
+ <view class="tui-goods__ross" @click="this.$api.navigateTo('/pages/supplier/user/my-shop?shopId=1378')">
|
|
|
|
+ <image class="ross-image" src="https://static.caimei365.com/app/img/ross/ross-image@3x.jpg" mode=""></image>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
<view class="tui-goods__item" v-if="tempData.liveList != ''">
|
|
<view class="tui-goods__item" v-if="tempData.liveList != ''">
|
|
<view class="tui-group-name" @click="LiveGoPath">
|
|
<view class="tui-group-name" @click="LiveGoPath">
|
|
<view class="tui-group-title"><text>采美LIVE</text></view>
|
|
<view class="tui-group-title"><text>采美LIVE</text></view>
|
|
<view class="iconfont icon-xiayibu"></view>
|
|
<view class="iconfont icon-xiayibu"></view>
|
|
</view>
|
|
</view>
|
|
- <view class="tui-goods__main" :class="flIndex == 0 ? 'one' : ''" v-for="(live, flIndex) in tempData.liveList" :key="flIndex" @click="LiveGoPathPros(live)">
|
|
|
|
|
|
+ <view
|
|
|
|
+ class="tui-goods__main"
|
|
|
|
+ :class="flIndex == 0 ? 'one' : ''"
|
|
|
|
+ v-for="(live, flIndex) in tempData.liveList"
|
|
|
|
+ :key="flIndex"
|
|
|
|
+ @click="LiveGoPathPros(live)"
|
|
|
|
+ >
|
|
<view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
<view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
<image :src="live.homePageImage" mode="" class="tui-goods__img"></image>
|
|
<image :src="live.homePageImage" mode="" class="tui-goods__img"></image>
|
|
<view class="tui-goods__name">{{ live.liveTitle }}</view>
|
|
<view class="tui-goods__name">{{ live.liveTitle }}</view>
|
|
<view class="tui-goods__statu">
|
|
<view class="tui-goods__statu">
|
|
<text class="iconfont icon-weikaishi" v-if="live.liveStatus == 1"></text>
|
|
<text class="iconfont icon-weikaishi" v-if="live.liveStatus == 1"></text>
|
|
- <image :src="iconLive" mode="widthFix" class="icon-live" v-if="live.liveStatus == 2"></image>
|
|
|
|
|
|
+ <image
|
|
|
|
+ :src="iconLive"
|
|
|
|
+ mode="widthFix"
|
|
|
|
+ class="icon-live"
|
|
|
|
+ v-if="live.liveStatus == 2"
|
|
|
|
+ ></image>
|
|
<text class="iconfont icon-jieshu" v-if="live.liveStatus == 3"></text>
|
|
<text class="iconfont icon-jieshu" v-if="live.liveStatus == 3"></text>
|
|
<text>{{ live.liveStatus | statusType }}</text>
|
|
<text>{{ live.liveStatus | statusType }}</text>
|
|
</view>
|
|
</view>
|
|
@@ -27,7 +43,13 @@
|
|
<view class="tui-group-title"><text>最新活动</text></view>
|
|
<view class="tui-group-title"><text>最新活动</text></view>
|
|
<view class="iconfont icon-xiayibu"></view>
|
|
<view class="iconfont icon-xiayibu"></view>
|
|
</view>
|
|
</view>
|
|
- <view class="tui-goods__main" :class="flIndex == 0 ? 'one' : ''" v-for="(cmImage, flIndex) in tempData.cmImageList" :key="flIndex" @click="NewActivityListPath(cmImage)">
|
|
|
|
|
|
+ <view
|
|
|
|
+ class="tui-goods__main"
|
|
|
|
+ :class="flIndex == 0 ? 'one' : ''"
|
|
|
|
+ v-for="(cmImage, flIndex) in tempData.cmImageList"
|
|
|
|
+ :key="flIndex"
|
|
|
|
+ @click="NewActivityListPath(cmImage)"
|
|
|
|
+ >
|
|
<view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
<view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
<image :src="cmImage.homePageImage" mode="" class="tui-goods__img"></image>
|
|
<image :src="cmImage.homePageImage" mode="" class="tui-goods__img"></image>
|
|
<view class="tui-goods__name">{{ cmImage.title }}</view>
|
|
<view class="tui-goods__name">{{ cmImage.title }}</view>
|
|
@@ -36,11 +58,20 @@
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="tui-goods__item" v-if="tempData.infoList != ''">
|
|
<view class="tui-goods__item" v-if="tempData.infoList != ''">
|
|
- <view class="tui-group-name" @click="NavArticlePath('https://www.caimei365.com/info/center-3-1.html')">
|
|
|
|
|
|
+ <view
|
|
|
|
+ class="tui-group-name"
|
|
|
|
+ @click="NavArticlePath('https://www.caimei365.com/info/center-3-1.html')"
|
|
|
|
+ >
|
|
<view class="tui-group-title"><text>热门文章</text></view>
|
|
<view class="tui-group-title"><text>热门文章</text></view>
|
|
<view class="iconfont icon-xiayibu"></view>
|
|
<view class="iconfont icon-xiayibu"></view>
|
|
</view>
|
|
</view>
|
|
- <view class="tui-goods__main" :class="flIndex == 0 ? 'one' : ''" v-for="(info, flIndex) in tempData.infoList" :key="flIndex" @click="NavArticlePath(info.link)">
|
|
|
|
|
|
+ <view
|
|
|
|
+ class="tui-goods__main"
|
|
|
|
+ :class="flIndex == 0 ? 'one' : ''"
|
|
|
|
+ v-for="(info, flIndex) in tempData.infoList"
|
|
|
|
+ :key="flIndex"
|
|
|
|
+ @click="NavArticlePath(info.link)"
|
|
|
|
+ >
|
|
<view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
<view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
<image :src="info.homePageImage" mode="" class="tui-goods__img"></image>
|
|
<image :src="info.homePageImage" mode="" class="tui-goods__img"></image>
|
|
<view class="tui-goods__name">{{ info.title }}</view>
|
|
<view class="tui-goods__name">{{ info.title }}</view>
|
|
@@ -48,20 +79,29 @@
|
|
<view class="tui-goods__text" v-if="flIndex > 0">{{ info.title }}</view>
|
|
<view class="tui-goods__text" v-if="flIndex > 0">{{ info.title }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
- <!-- 采美百科 -->
|
|
|
|
- <view class="tui-goods__item" v-if="tempData.baikeList.length > 0">
|
|
|
|
- <view class="tui-group-name" @click="NavArticlePath('https://www.caimei365.com/encyclopedia/product.html')">
|
|
|
|
- <view class="tui-group-title"><text>热门百科</text></view>
|
|
|
|
- <view class="iconfont icon-xiayibu"></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="tui-goods__main" :class="flIndex == 0 ? 'one' : ''" v-for="(item, flIndex) in tempData.baikeList" :key="flIndex" @click="NavArticlePath(item.link)">
|
|
|
|
- <view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
|
|
- <image :src="item.image" mode="" class="tui-goods__img"></image>
|
|
|
|
- <view class="tui-goods__name">{{ item.name }}</view>
|
|
|
|
- </view>
|
|
|
|
- <view class="tui-goods__text" v-if="flIndex > 0">{{ item.name }}</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
|
|
+ <!-- 采美百科 -->
|
|
|
|
+ <view class="tui-goods__item" v-if="tempData.baikeList.length > 0">
|
|
|
|
+ <view
|
|
|
|
+ class="tui-group-name"
|
|
|
|
+ @click="NavArticlePath('https://www.caimei365.com/encyclopedia/product.html')"
|
|
|
|
+ >
|
|
|
|
+ <view class="tui-group-title"><text>热门百科</text></view>
|
|
|
|
+ <view class="iconfont icon-xiayibu"></view>
|
|
|
|
+ </view>
|
|
|
|
+ <view
|
|
|
|
+ class="tui-goods__main"
|
|
|
|
+ :class="flIndex == 0 ? 'one' : ''"
|
|
|
|
+ v-for="(item, flIndex) in tempData.baikeList"
|
|
|
|
+ :key="flIndex"
|
|
|
|
+ @click="NavArticlePath(item.link)"
|
|
|
|
+ >
|
|
|
|
+ <view class="tui-goods__imgbox" v-if="flIndex === 0">
|
|
|
|
+ <image :src="item.image" mode="" class="tui-goods__img"></image>
|
|
|
|
+ <view class="tui-goods__name">{{ item.name }}</view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="tui-goods__text" v-if="flIndex > 0">{{ item.name }}</view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
@@ -69,293 +109,317 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
- import { mapState,mapMutations} from 'vuex'
|
|
|
|
- import cmsMixins from '@/mixins/cmsMixins.js'
|
|
|
|
- export default{
|
|
|
|
- mixins: [cmsMixins],
|
|
|
|
- name:'pagesProduct',
|
|
|
|
- props:{
|
|
|
|
- templateData:{
|
|
|
|
- type:Object
|
|
|
|
|
|
+import { mapState, mapMutations } from 'vuex'
|
|
|
|
+import cmsMixins from '@/mixins/cmsMixins.js'
|
|
|
|
+export default {
|
|
|
|
+ mixins: [cmsMixins],
|
|
|
|
+ name: 'pagesProduct',
|
|
|
|
+ props: {
|
|
|
|
+ templateData: {
|
|
|
|
+ type: Object
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ tempData: {},
|
|
|
|
+ iconLive: 'https://static.caimei365.com/app/img/icon/icon-live.gif'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ filters: {
|
|
|
|
+ statusType: function(value) {
|
|
|
|
+ switch (value) {
|
|
|
|
+ case 1:
|
|
|
|
+ return '未开始'
|
|
|
|
+ break
|
|
|
|
+ case 2:
|
|
|
|
+ return '直播中'
|
|
|
|
+ break
|
|
|
|
+ case 3:
|
|
|
|
+ return '看回放'
|
|
|
|
+ break
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- data() {
|
|
|
|
- return{
|
|
|
|
- tempData:{},
|
|
|
|
- iconLive:'https://static.caimei365.com/app/img/icon/icon-live.gif'
|
|
|
|
|
|
+ NumFormat: function(value) {
|
|
|
|
+ //处理金额
|
|
|
|
+ return Number(value).toFixed(2)
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ this.initData(this.templateData)
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ ...mapState(['isRossShow'])
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ initData(data) {
|
|
|
|
+ this.tempData = data
|
|
|
|
+ },
|
|
|
|
+ NavArticlePath(LINK) {
|
|
|
|
+ // 友盟埋点首页文章模块点击
|
|
|
|
+ if (process.env.NODE_ENV != 'development') {
|
|
|
|
+ this.$uma.trackEvent('Um_Event_HomeArticleTemplateClick', {
|
|
|
|
+ Um_Key_ArticleLink: `${LINK}`,
|
|
|
|
+ Um_Key_PageName: '首页文章模块',
|
|
|
|
+ Um_Key_SourcePage: '商城首页'
|
|
|
|
+ })
|
|
}
|
|
}
|
|
|
|
+ // 采美埋点首页文章模块数据统计
|
|
|
|
+ this.cmsSysStatistics(4)
|
|
|
|
+ this.$api.navigateTo(`/pages/h5/article/path?link=${LINK}`)
|
|
},
|
|
},
|
|
- filters: {
|
|
|
|
- statusType:function(value) {
|
|
|
|
- switch (value) {
|
|
|
|
- case 1:
|
|
|
|
- return '未开始'
|
|
|
|
- break
|
|
|
|
- case 2:
|
|
|
|
- return '直播中'
|
|
|
|
- break
|
|
|
|
- case 3:
|
|
|
|
- return '看回放'
|
|
|
|
- break
|
|
|
|
|
|
+ NewActivityList() {
|
|
|
|
+ this.$api.navigateTo('/pages/h5/activity/activity-list')
|
|
|
|
+ },
|
|
|
|
+ NewActivityListPath(pros) {
|
|
|
|
+ // 友盟埋点首页活动模块点击
|
|
|
|
+ if (process.env.NODE_ENV != 'development') {
|
|
|
|
+ this.$uma.trackEvent('Um_Event_HomeActivityTemplateClick', {
|
|
|
|
+ Um_Key_ActivityName: `${pros.title}`,
|
|
|
|
+ Um_Key_PageName: '首页活动模块',
|
|
|
|
+ Um_Key_SourcePage: '商城首页'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ // 采美埋点首页活动模块数据统计
|
|
|
|
+ this.cmsSysStatistics(3)
|
|
|
|
+ /**
|
|
|
|
+ * 页面跳转类型
|
|
|
|
+ * 1、二级页面,2、搜索项目仪器,3、直播页面,4、自由页面,5、商品详情,6、仪器项目详情,7、供应商主页
|
|
|
|
+ * 8、专题活动页,9、二手市场介绍,10、二手商品列表,11、二手商品发布,12、商品搜索,13、信息详情
|
|
|
|
+ * 14、品牌招商介绍页,15、维修保养介绍页,16、首页,17、注册页,18、信息中心,19、供应商列表
|
|
|
|
+ **/
|
|
|
|
+ if (pros.linkType) {
|
|
|
|
+ console.log(pros.linkType)
|
|
|
|
+ const typeMap = {
|
|
|
|
+ 1: `/pages/goods/goods-instrument?linkId=${pros.linkParam.id}&title=${pros.name}`,
|
|
|
|
+ 2: `/pages/goods/instrument-details?id=${pros.linkParam.id}`,
|
|
|
|
+ 4: `/pages/h5/activity/activity?title=${pros.title}&link=${pros.appletsLink}`,
|
|
|
|
+ 5: `/pages/goods/product?id=${pros.linkParam.id}`,
|
|
|
|
+ // 7:`/pages/supplier/user/my-shop?shopId=${pros.linkParam.id}`,
|
|
|
|
+ 8: '/pages/h5/activity/activity-list',
|
|
|
|
+ 9: '/pages/second/form/introduce',
|
|
|
|
+ 10: '/pages/second/product/product-list',
|
|
|
|
+ 11: '/pages/second/form/form',
|
|
|
|
+ 12: `/pages/search/search?keyWord=${pros.linkParam.keyword}`,
|
|
|
|
+ 13: `/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
+ 14: `/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
+ 15: `/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
+ 17: '/pages/login/register-select',
|
|
|
|
+ 18: `/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
+ 19: `/pages/search/search-supplier?keyWord=${pros.linkParam.keyword}`,
|
|
|
|
+ 20: `/pages/goods/good-floor?linkId=${pros.linkParam.id}&title=${pros.name}`,
|
|
|
|
+ 21: '/pages/h5/activity/meobohui',
|
|
|
|
+ 22: `/pages/goods/good-floor-temp?linkId=${pros.linkParam.id}&title=${pros.name}`,
|
|
|
|
+ 23: `/pages/h5/activity/activity-topic?linkId=${pros.linkParam.id}`, //活动专题页面
|
|
|
|
+ 25: '/pages/goods/goods-doc-list', //美业资料
|
|
|
|
+ 28: `/pages/h5/article/path?link=${pros.link}`, // 采美认证通
|
|
|
|
+ 29: '/pages/user/coupon/coupon-collection' //领券中心
|
|
}
|
|
}
|
|
- },
|
|
|
|
- NumFormat:function(value) {//处理金额
|
|
|
|
- return Number(value).toFixed(2)
|
|
|
|
- },
|
|
|
|
|
|
+ const url = typeMap[pros.linkType]
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: url
|
|
|
|
+ })
|
|
|
|
+ }
|
|
},
|
|
},
|
|
- created(){
|
|
|
|
- this.initData(this.templateData)
|
|
|
|
|
|
+ LiveGoPath() {
|
|
|
|
+ //查看直播
|
|
|
|
+ this.$api.navigateTo('/pages/h5/article/path-live')
|
|
|
|
+
|
|
|
|
+ // uni.navigateToMiniProgram({
|
|
|
|
+ // appId: 'wx92d650b253f8f2e3',
|
|
|
|
+ // path: '/pages/index/index',
|
|
|
|
+ // extraData: {
|
|
|
|
+ // 'data1': 'test'
|
|
|
|
+ // },
|
|
|
|
+ // envVersion: 'develop',
|
|
|
|
+ // success(res) {
|
|
|
|
+ // // 打开成功
|
|
|
|
+ // console.log(res)
|
|
|
|
+ // }
|
|
|
|
+ // })
|
|
},
|
|
},
|
|
- methods:{
|
|
|
|
- initData(data){
|
|
|
|
- this.tempData = data
|
|
|
|
- },
|
|
|
|
- NavArticlePath(LINK){
|
|
|
|
- // 友盟埋点首页文章模块点击
|
|
|
|
- if(process.env.NODE_ENV != 'development'){
|
|
|
|
- this.$uma.trackEvent('Um_Event_HomeArticleTemplateClick', {
|
|
|
|
- Um_Key_ArticleLink: `${LINK}`,
|
|
|
|
- Um_Key_PageName: '首页文章模块',
|
|
|
|
- Um_Key_SourcePage: '商城首页',
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- // 采美埋点首页文章模块数据统计
|
|
|
|
- this.cmsSysStatistics(4)
|
|
|
|
- this.$api.navigateTo(`/pages/h5/article/path?link=${LINK}`)
|
|
|
|
- },
|
|
|
|
- NewActivityList(){
|
|
|
|
- this.$api.navigateTo('/pages/h5/activity/activity-list')
|
|
|
|
- },
|
|
|
|
- NewActivityListPath(pros){
|
|
|
|
- // 友盟埋点首页活动模块点击
|
|
|
|
- if(process.env.NODE_ENV != 'development'){
|
|
|
|
- this.$uma.trackEvent('Um_Event_HomeActivityTemplateClick', {
|
|
|
|
- Um_Key_ActivityName: `${pros.title}`,
|
|
|
|
- Um_Key_PageName: '首页活动模块',
|
|
|
|
- Um_Key_SourcePage: '商城首页',
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- // 采美埋点首页活动模块数据统计
|
|
|
|
- this.cmsSysStatistics(3)
|
|
|
|
- /**
|
|
|
|
- * 页面跳转类型
|
|
|
|
- * 1、二级页面,2、搜索项目仪器,3、直播页面,4、自由页面,5、商品详情,6、仪器项目详情,7、供应商主页
|
|
|
|
- * 8、专题活动页,9、二手市场介绍,10、二手商品列表,11、二手商品发布,12、商品搜索,13、信息详情
|
|
|
|
- * 14、品牌招商介绍页,15、维修保养介绍页,16、首页,17、注册页,18、信息中心,19、供应商列表
|
|
|
|
- **/
|
|
|
|
- if(pros.linkType){
|
|
|
|
- console.log(pros.linkType)
|
|
|
|
- const typeMap = {
|
|
|
|
- 1:`/pages/goods/goods-instrument?linkId=${pros.linkParam.id}&title=${pros.name}`,
|
|
|
|
- 2:`/pages/goods/instrument-details?id=${pros.linkParam.id}`,
|
|
|
|
- 4:`/pages/h5/activity/activity?title=${pros.title}&link=${pros.appletsLink}`,
|
|
|
|
- 5:`/pages/goods/product?id=${pros.linkParam.id}`,
|
|
|
|
- // 7:`/pages/supplier/user/my-shop?shopId=${pros.linkParam.id}`,
|
|
|
|
- 8:'/pages/h5/activity/activity-list',
|
|
|
|
- 9:'/pages/second/form/introduce',
|
|
|
|
- 10:'/pages/second/product/product-list',
|
|
|
|
- 11:'/pages/second/form/form',
|
|
|
|
- 12:`/pages/search/search?keyWord=${pros.linkParam.keyword}`,
|
|
|
|
- 13:`/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
- 14:`/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
- 15:`/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
- 17:'/pages/login/register-select',
|
|
|
|
- 18:`/pages/h5/article/path?link=${pros.link}`,
|
|
|
|
- 19:`/pages/search/search-supplier?keyWord=${pros.linkParam.keyword}`,
|
|
|
|
- 20:`/pages/goods/good-floor?linkId=${pros.linkParam.id}&title=${pros.name}`,
|
|
|
|
- 21:'/pages/h5/activity/meobohui',
|
|
|
|
- 22:`/pages/goods/good-floor-temp?linkId=${pros.linkParam.id}&title=${pros.name}`,
|
|
|
|
- 23:`/pages/h5/activity/activity-topic?linkId=${pros.linkParam.id}`, //活动专题页面
|
|
|
|
- 25:'/pages/goods/goods-doc-list' ,//美业资料
|
|
|
|
- 28:`/pages/h5/article/path?link=${pros.link}`, // 采美认证通
|
|
|
|
- 29:'/pages/user/coupon/coupon-collection',//领券中心
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- const url = typeMap[pros.linkType]
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url:url
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- LiveGoPath(){//查看直播
|
|
|
|
- this.$api.navigateTo('/pages/h5/article/path-live')
|
|
|
|
-
|
|
|
|
- // uni.navigateToMiniProgram({
|
|
|
|
- // appId: 'wx92d650b253f8f2e3',
|
|
|
|
- // path: '/pages/index/index',
|
|
|
|
- // extraData: {
|
|
|
|
- // 'data1': 'test'
|
|
|
|
- // },
|
|
|
|
- // envVersion: 'develop',
|
|
|
|
- // success(res) {
|
|
|
|
- // // 打开成功
|
|
|
|
- // console.log(res)
|
|
|
|
- // }
|
|
|
|
- // })
|
|
|
|
- },
|
|
|
|
- LiveGoPathPros(live){
|
|
|
|
- // 友盟埋点首页直播模块点击
|
|
|
|
- if(process.env.NODE_ENV != 'development'){
|
|
|
|
- this.$uma.trackEvent('Um_Event_HomeLiveTemplateClick', {
|
|
|
|
- Um_Key_LiveName: `${live.liveTitle}`,
|
|
|
|
- Um_Key_PageName: '首页直播模块',
|
|
|
|
- Um_Key_SourcePage: '商城首页',
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- // 采美埋点首页直播模块数据统计
|
|
|
|
- this.cmsSysStatistics(2)
|
|
|
|
- this.$api.navigateTo(`/pages/h5/article/page-image?title=${live.liveTitle}&image=${live.advertisingImage}`)
|
|
|
|
|
|
+ LiveGoPathPros(live) {
|
|
|
|
+ // 友盟埋点首页直播模块点击
|
|
|
|
+ if (process.env.NODE_ENV != 'development') {
|
|
|
|
+ this.$uma.trackEvent('Um_Event_HomeLiveTemplateClick', {
|
|
|
|
+ Um_Key_LiveName: `${live.liveTitle}`,
|
|
|
|
+ Um_Key_PageName: '首页直播模块',
|
|
|
|
+ Um_Key_SourcePage: '商城首页'
|
|
|
|
+ })
|
|
}
|
|
}
|
|
|
|
+ // 采美埋点首页直播模块数据统计
|
|
|
|
+ this.cmsSysStatistics(2)
|
|
|
|
+ this.$api.navigateTo(`/pages/h5/article/page-image?title=${live.liveTitle}&image=${live.advertisingImage}`)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
- .container-pages{
|
|
|
|
- width: 100%;
|
|
|
|
- height:508rpx;
|
|
|
|
- padding: 24rpx;
|
|
|
|
- float: left;
|
|
|
|
- background-color: #F7F7F7;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- background-color: #F7F7F7;
|
|
|
|
- overflow: hidden;
|
|
|
|
|
|
+.container-pages {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 508rpx;
|
|
|
|
+ padding: 24rpx;
|
|
|
|
+ float: left;
|
|
|
|
+ background-color: #f7f7f7;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ background-color: #f7f7f7;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ .tui-goods__list {
|
|
display: flex;
|
|
display: flex;
|
|
align-items: center;
|
|
align-items: center;
|
|
- .tui-goods__list {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__item {
|
|
|
|
+ background-color: #fff;
|
|
|
|
+ width: 307rpx;
|
|
|
|
+ height: 460rpx;
|
|
|
|
+ border-radius: 16rpx;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ margin-right: 16rpx;
|
|
|
|
+ padding: 17rpx;
|
|
|
|
+ &.ross{
|
|
|
|
+ padding: 0;
|
|
}
|
|
}
|
|
- .tui-goods__item {
|
|
|
|
- background-color: #fff;
|
|
|
|
|
|
+ .tui-goods__ross{
|
|
width: 307rpx;
|
|
width: 307rpx;
|
|
height: 460rpx;
|
|
height: 460rpx;
|
|
- border-radius: 16rpx;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- margin-right: 16rpx;
|
|
|
|
- padding: 17rpx;
|
|
|
|
- }
|
|
|
|
- .tui-group-name{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 36rpx;
|
|
|
|
|
|
+ text-align: center;
|
|
|
|
+ background-color: #F3920D;
|
|
|
|
+ line-height: 460rpx;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-size: 40rpx;
|
|
float: left;
|
|
float: left;
|
|
- margin-bottom: 13rpx;
|
|
|
|
- .tui-group-title{
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- line-height: 36rpx;
|
|
|
|
- float: left;
|
|
|
|
- color: #333333;
|
|
|
|
- }
|
|
|
|
- .icon-xiayibu{
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- line-height: 36rpx;
|
|
|
|
- float: right;
|
|
|
|
- color: #909090;
|
|
|
|
|
|
+ border-radius: 16rpx;
|
|
|
|
+ .ross-image{
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ border-radius: 16rpx;
|
|
|
|
+ display: block;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .tui-goods__main{
|
|
|
|
- width: 100%;
|
|
|
|
- height: auto;
|
|
|
|
|
|
+ }
|
|
|
|
+ .tui-group-name {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 36rpx;
|
|
|
|
+ float: left;
|
|
|
|
+ margin-bottom: 13rpx;
|
|
|
|
+ .tui-group-title {
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
+ line-height: 36rpx;
|
|
float: left;
|
|
float: left;
|
|
- position: relative;
|
|
|
|
- &.one{
|
|
|
|
- margin-bottom: 14rpx;
|
|
|
|
- }
|
|
|
|
|
|
+ color: #333333;
|
|
}
|
|
}
|
|
- .tui-goods__imgbox {
|
|
|
|
- width: 273rpx;
|
|
|
|
- height: 273rpx;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- border-radius: 8rpx;
|
|
|
|
|
|
+ .icon-xiayibu {
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
+ line-height: 36rpx;
|
|
|
|
+ float: right;
|
|
|
|
+ color: #909090;
|
|
}
|
|
}
|
|
- .tui-goods__img {
|
|
|
|
- max-width: 273rpx;
|
|
|
|
- max-height: 273rpx;
|
|
|
|
- border-radius: 8rpx;
|
|
|
|
- display: block;
|
|
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__main {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: auto;
|
|
|
|
+ float: left;
|
|
|
|
+ position: relative;
|
|
|
|
+ &.one {
|
|
|
|
+ margin-bottom: 14rpx;
|
|
}
|
|
}
|
|
- .tui-goods__name{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 48rpx;
|
|
|
|
- float: left;
|
|
|
|
- line-height: 48rpx;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- padding-left: 12rpx;
|
|
|
|
- font-size: $font-size-24;
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- background-color: rgba(0,0,0,0.4);
|
|
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__imgbox {
|
|
|
|
+ width: 273rpx;
|
|
|
|
+ height: 273rpx;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ border-radius: 8rpx;
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__img {
|
|
|
|
+ max-width: 273rpx;
|
|
|
|
+ max-height: 273rpx;
|
|
|
|
+ border-radius: 8rpx;
|
|
|
|
+ display: block;
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__name {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 48rpx;
|
|
|
|
+ float: left;
|
|
|
|
+ line-height: 48rpx;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ padding-left: 12rpx;
|
|
|
|
+ font-size: $font-size-24;
|
|
|
|
+ color: #ffffff;
|
|
|
|
+ background-color: rgba(0, 0, 0, 0.4);
|
|
|
|
+ position: absolute;
|
|
|
|
+ bottom: 0;
|
|
|
|
+ left: 0;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ border-radius: 0 0 8rpx 8rpx;
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__statu {
|
|
|
|
+ padding-left: 45rpx;
|
|
|
|
+ padding-right: 10rpx;
|
|
|
|
+ height: 35rpx;
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 17rpx;
|
|
|
|
+ left: 17rpx;
|
|
|
|
+ background-color: rgba(0, 0, 0, 0.4);
|
|
|
|
+ border-radius: 18rpx;
|
|
|
|
+ line-height: 35rpx;
|
|
|
|
+ color: #ffffff;
|
|
|
|
+ text-align: right;
|
|
|
|
+ font-size: $font-size-20;
|
|
|
|
+ .icon-live {
|
|
|
|
+ width: 17rpx;
|
|
|
|
+ height: 17rpx;
|
|
|
|
+ display: block;
|
|
|
|
+ margin: 0 auto;
|
|
position: absolute;
|
|
position: absolute;
|
|
- bottom: 0;
|
|
|
|
- left: 0;
|
|
|
|
- white-space: nowrap;
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
- overflow: hidden;
|
|
|
|
- border-radius:0 0 8rpx 8rpx;
|
|
|
|
|
|
+ left: 15rpx;
|
|
|
|
+ top: 9rpx;
|
|
}
|
|
}
|
|
- .tui-goods__statu{
|
|
|
|
- padding-left: 45rpx;
|
|
|
|
- padding-right: 10rpx;
|
|
|
|
|
|
+ .iconfont {
|
|
|
|
+ width: 35rpx;
|
|
height: 35rpx;
|
|
height: 35rpx;
|
|
- position: absolute;
|
|
|
|
- top: 17rpx;
|
|
|
|
- left: 17rpx;
|
|
|
|
- background-color: rgba(0,0,0,0.4);
|
|
|
|
- border-radius: 18rpx;
|
|
|
|
line-height: 35rpx;
|
|
line-height: 35rpx;
|
|
- color: #FFFFFF;
|
|
|
|
- text-align: right;
|
|
|
|
- font-size: $font-size-20;
|
|
|
|
- .icon-live{
|
|
|
|
- width: 17rpx;
|
|
|
|
- height: 17rpx;
|
|
|
|
- display: block;
|
|
|
|
- margin: 0 auto;
|
|
|
|
- position: absolute;
|
|
|
|
- left: 15rpx;
|
|
|
|
- top: 9rpx;
|
|
|
|
- }
|
|
|
|
- .iconfont{
|
|
|
|
- width: 35rpx;
|
|
|
|
- height: 35rpx;
|
|
|
|
- line-height: 35rpx;
|
|
|
|
- display: block;
|
|
|
|
- position: absolute;
|
|
|
|
- left: 10rpx;
|
|
|
|
- font-size: $font-size-26;
|
|
|
|
- &.icon-weikaishi{
|
|
|
|
- color: #E56D00;
|
|
|
|
- left:0;
|
|
|
|
- }
|
|
|
|
- &.icon-jieshu{
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- left:0;
|
|
|
|
- font-size: 22rpx;
|
|
|
|
- }
|
|
|
|
|
|
+ display: block;
|
|
|
|
+ position: absolute;
|
|
|
|
+ left: 10rpx;
|
|
|
|
+ font-size: $font-size-26;
|
|
|
|
+ &.icon-weikaishi {
|
|
|
|
+ color: #e56d00;
|
|
|
|
+ left: 0;
|
|
}
|
|
}
|
|
- }
|
|
|
|
- .tui-goods__text{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 44rpx;
|
|
|
|
- float: left;
|
|
|
|
- line-height: 44rpx;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- padding-left: 12rpx;
|
|
|
|
- font-size: $font-size-24;
|
|
|
|
- color: #666666;
|
|
|
|
- white-space: nowrap;
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
- overflow: hidden;
|
|
|
|
- position: relative;
|
|
|
|
- &::before{
|
|
|
|
- content: '';
|
|
|
|
- width: 8rpx;
|
|
|
|
- height: 8rpx;
|
|
|
|
- border-radius: 50%;
|
|
|
|
- background-color: #cccccc;
|
|
|
|
- position: absolute;
|
|
|
|
|
|
+ &.icon-jieshu {
|
|
|
|
+ color: #ffffff;
|
|
left: 0;
|
|
left: 0;
|
|
- top: 18rpx;
|
|
|
|
|
|
+ font-size: 22rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- }
|
|
|
|
|
|
+ }
|
|
|
|
+ .tui-goods__text {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 44rpx;
|
|
|
|
+ float: left;
|
|
|
|
+ line-height: 44rpx;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ padding-left: 12rpx;
|
|
|
|
+ font-size: $font-size-24;
|
|
|
|
+ color: #666666;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ position: relative;
|
|
|
|
+ &::before {
|
|
|
|
+ content: '';
|
|
|
|
+ width: 8rpx;
|
|
|
|
+ height: 8rpx;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ background-color: #cccccc;
|
|
|
|
+ position: absolute;
|
|
|
|
+ left: 0;
|
|
|
|
+ top: 18rpx;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
</style>
|
|
</style>
|