合并

views/Brand.vue

@@ -26,14 +26,14 @@
 					}" @tap="jumpSwiper(index, $event)" class="icon"
 						:src="swiperIndex === index ? $baseUrl + icon.activeUrl : $baseUrl + icon.baseUrl"
 						v-for="(icon, index) in swiperIconList" :key="index"></image> -->
-						<image :src="$baseUrl + 'brandpage/indicatorDotsBg.png'" class="indicatorDotsBg"></image>
+					<image :src="$baseUrl + 'brandpage/indicatorDotsBg.png'" class="indicatorDotsBg"></image>
 					<view class="indicatorDots">
 						<template class="dotbox" v-for="(item, index) in swiperIconList" :key="index">
 							<view class="dot" :class="swiperIndex === index ? 'dot-active' : 'dot-normal'">
 							</view>
 						</template>
 						<text class="dotText">{{ swiperIconList[swiperIndex]?.text }}</text>
-						</view>
+					</view>
 				</view>
 			</view>
 			<view class="videoposterbox">
@@ -65,19 +65,19 @@
 								:style="{
 									background: `url(${$baseUrl}brandpage/infoBoxBg.png) no-repeat center/contain`
 								}" :data-log="{
-							xcxClick: '品牌故事-次屏页面点击',
-							pageName: '品牌故事-次屏页面',
-							buttonName: `${productTabList[channelTabIndex] + '中的' + infoItem.title}+'商品'`
+									xcxClick: '品牌故事-次屏页面点击',
+									pageName: '品牌故事-次屏页面',
+									buttonName: `${productTabList[channelTabIndex] + '中的' + infoItem.title}+'商品'`
 								}" @tap="jumpProduct(infoItem, $event)">
-						<view class="flexbox">
-							<view class="infotitle">
-								{{ infoItem.title }}
+								<view class="flexbox">
+									<view class="infotitle">
+										{{ infoItem.title }}
+									</view>
+									<image class="infoimg" :src="$baseUrl + infoItem.bgUrl"></image>
+								</view>
+								<view class="infodesc">{{ infoItem.desc }}</view>
 							</view>
-							<image class="infoimg" :src="$baseUrl + infoItem.bgUrl"></image>
 						</view>
-						<view class="infodesc">{{ infoItem.desc }}</view>
-					</view>
-				</view>
 						<view class="product-row">
 							<view class="infobox" :key="'bottom-' + index"
 								v-for="(infoItem, index) in productInfoList[channelTabIndex].filter((item, i) => i % 2 === 1)"
@@ -105,17 +105,18 @@
 			</view>
 
 			<view class="videoposterbox">
-				<video class="videoposter" :src="videoPosterUrl" controls="false"
-					:poster="posterUrl" :style="{ width: '100%', height: '100%' }"
-					@loadedmetadata="onVideoLoadedMeta"></video>
+				<video class="videoposter" :src="videoPosterUrl" controls="false" :poster="posterUrl"
+					:style="{ width: '100%', height: '100%' }" @loadedmetadata="onVideoLoadedMeta"></video>
 			</view>
 			<view id="thirdScreen" class="ipbox"
 				:style="{ background: `url(${$baseUrl}brandpage/hexiaofeiBg.png) no-repeat center/contain` }">
-				<image :data-log="{
-					xcxClick: '品牌故事-三屏页面点击',
-					pageName: '品牌故事-三屏页面',
-					buttonName: `全家形象`
-				}" @tap="showPopup(1, $event)" class="iphexiaofei" :src="erqiPeizhi.iphexiaofeiUrl"></image>
+				<store-product appid="wx1ad0903b95889ea1" product-id="10000239570622" custom-content="true">
+					<image :data-log="{
+						xcxClick: '品牌故事-三屏页面点击',
+						pageName: '品牌故事-三屏页面',
+						buttonName: `全家形象`
+					}" class="iphexiaofei" :src="erqiPeizhi.iphexiaofeiUrl"></image>
+				</store-product>
 				<view class="ipcard">
 					<view class="title">
 						{{ erqiPeizhi.title2 }}
@@ -130,17 +131,21 @@
 								xcxClick: '品牌故事-三屏页面点击',
 								pageName: '品牌故事-三屏页面',
 								buttonName: `${hexiaofeiNameList[0]}`
-							}" @tap="showPopup(1, $event)" :src="erqiPeizhi.ipImg1">
+							}" :src="erqiPeizhi.ipImg1">
 							</image>
 						</view>
+
 						<view class="ipright">
 							<view class="ipbg ip2">
-								<image :data-log="{
-									xcxClick: '品牌故事-三屏页面点击',
-									pageName: '品牌故事-三屏页面',
-									buttonName: `${hexiaofeiNameList[1]}`
-								}" @tap="showPopup(1, $event)" :src="erqiPeizhi.ipImg2">
-								</image>
+								<store-product appid="wx1ad0903b95889ea1" product-id="10000239356280"
+									custom-content="true">
+									<image :data-log="{
+										xcxClick: '品牌故事-三屏页面点击',
+										pageName: '品牌故事-三屏页面',
+										buttonName: `${hexiaofeiNameList[1]}`
+									}" @tap="showPopup(1, $event)" :src="erqiPeizhi.ipImg2">
+									</image>
+								</store-product>
 							</view>
 							<view style="display: flex;justify-content: space-between;margin-top: 20rpx;">
 								<view class="ipbg ip3">
@@ -150,6 +155,7 @@
 										buttonName: `${hexiaofeiNameList[2]}`
 									}" @tap="showPopup(0, $event)" :src="erqiPeizhi.ipImg3">
 									</image>
+
 								</view>
 								<view class="ipbg ip4">
 									<image :data-log="{
@@ -276,7 +282,7 @@ export default {
 			}
 		},
 	},
-	
+
 	data() {
 		return {
 			popType: 'bottom',
@@ -311,13 +317,13 @@ export default {
 		}
 	},
 	mounted() {
-		
+
 		this.initBrandInfo();
-		
+
 		// 初始化曝光检测工具
 		this.exposureTracker = new ExposureTracker(this);
 		this.exposureTracker.addExposureElements(EXPOSURE_CONFIGS);
-		
+
 		// 初始检查曝光
 		this.$nextTick(() => {
 			this.checkExposure(this.scrollTop);
@@ -901,6 +907,7 @@ export default {
 					pageName: `品牌故事-鹤小飞家族小红书二维码半屏`,
 				});
 			}
+
 			this.$refs.popup.open(this.popType);
 		},
 		closePop() {
@@ -994,7 +1001,13 @@ export default {
 			if (this.exposureTracker) {
 				this.exposureTracker.resetAllExposure();
 			}
-		}
+		},
+		//跳转微店
+		// 		商品ID
+		// 10000239356280
+		// 商品ID
+		// 10000239570622
+
 	}
 }
 </script>
@@ -1176,7 +1189,7 @@ export default {
 							margin-bottom: 0;
 						}
 
-				.infobox {
+						.infobox {
 							margin-right: 20rpx;
 							flex-shrink: 0;
 
@@ -1294,6 +1307,7 @@ export default {
 					.ip1 {
 						width: 288rpx;
 						height: 380rpx;
+						overflow: hidden;
 
 						image {
 							width: 195rpx;