blame | 历史 | 补丁 | 提交 | 提交对比
Jacob
9 天以前 74bd629e27bb16b8e07ceecc8960083d2d0748c7 
 pages/zone/index.vue
....@@ -14,6 +14,9 @@
1414 		<view :style="{ height: marTop + 'px' }"></view>
1515 		<yueyangZone ref=yueyangZoneRef v-if="isYueyangZone" :zoneInfo="info" :careBeanRate="careBeanRate"
1616 			style="position: relative;z-index: 2;" @goLottery="goLottery" :relationKey="relationKey"></yueyangZone>
17
+		<view v-if="isYueyangZone" class="detail-btn" @click="goDetail">
18
+			<text>消耗明细</text>
19
+		</view>
1720 		<view v-else>
1821 			<view class="expireTime" v-if="expireTime && expireTime.length">
1922 				<text>专区将在</text>
....@@ -24,6 +27,24 @@
2427 			</view>
2528 			<view class="head_img">
2629 				<image :src="info.image"></image>
30
+			</view>
31
+			<view v-if="info.zoneType == 8 && info.info" class="rich-content">
32
+				<rich-text :nodes="info.info"></rich-text>
33
+			</view>
34
+			<view v-if="info.zoneType == 8 && info.uploadVideo" class="video-wrap">
35
+				<view v-show="!videoControls" style="width:100%;height:750rpx">
36
+					<video id="zoneVideo" :src='info.uploadVideo' objectFit="contain" controls
37
+						style="width:100%;height:100%" show-center-play-btn="true" show-mute-btn="true" muted="true"
38
+						show-fullscreen-btn="true" auto-pause-if-navigate :custom-cache="false"
39
+						:enable-progress-gesture="true" show-progress="false"
40
+						:poster="info.uploadVideoImg || info.image" @pause="zoneVideoPause"></video>
41
+				</view>
42
+				<view class="video-poster" v-show="videoControls">
43
+					<image class="image" :src="info.uploadVideoImg || info.image"></image>
44
+				</view>
45
+				<view class="video-stop" v-show="videoControls" @tap="bindZoneVideoPlay">
46
+					<image class="image" src="https://ossacmall.bluedeer.com.cn/app/static/images/stop.png"></image>
47
+				</view>
2748 			</view>
2849 			<view class="tag-wrap-container" :style="'top:' + (marTop) + 'px;'" v-if="info.zoneType == 7">
2950 				<view class="tag-wrap">
....@@ -67,9 +88,8 @@
6788 					</view>
6889 				</view>
6990 			</view>
70
-			<view @click="goLottery" class="lottery_banner" v-if="info && info.isLottery">
71
-				<image class="lottery_bannerImg"
72
-					src="https://ossacmall.bluedeer.com.cn/app/static/images/zone_lotteryBanner.gif" mode="widthFix">
91
+			<view @click="goLottery" class="lottery_banner" v-if="info && info.isLottery && info.lotteryBanner">
92
+				<image class="lottery_bannerImg" :src="info.lotteryBanner" mode="widthFix">
7393 				</image>
7494 			</view>
7595 			<view class="tag-img-container" v-if="info.zoneType == 7">
....@@ -495,7 +515,7 @@
495515 
496516 <script>
497517 import {
498
-	HTTP_REQUEST_URL
518
+	WEB_ACTIVITY_BASE
499519 } from '@/config/app';
500520 import {
501521 	mapGetters
....@@ -596,6 +616,8 @@
596616 			isYueyangZone: false,
597617 			isOpen: false, // 默认收起，false收起/true展开
598618 			currentIndex: -1, // 默认选中第一个【全部】
619
+			videoControls: true, // 专区活动视频是否显示海报+播放按钮
620
+			zoneVideoContext: '', // 活动视频播放上下文
599621 			partitionList: [],
600622 			partitionProject: {},
601623 			tagList: [],
....@@ -835,6 +857,17 @@
835857 		}
836858 	},
837859 	methods: {
860
+		/**
861
+		 * 专区活动视频：点击海报播放按钮后播放
862
+		 */
863
+		bindZoneVideoPlay() {
864
+			if (!this.zoneVideoContext) {
865
+				this.zoneVideoContext = uni.createVideoContext('zoneVideo', this);
866
+			}
867
+			this.$set(this, 'videoControls', false);
868
+			this.zoneVideoContext.play();
869
+		},
870
+		zoneVideoPause() { },
838871 		handleCouponRule() {
839872 			this.$refs.personalAndShareCouponRuleRef.show(this.info.ruleContentText)
840873 		},
....@@ -1195,6 +1228,11 @@
11951228 				// that.myCareBean = res2.data.totalCareBeans;
11961229 			});
11971230 		},
1231
+		goDetail() {
1232
+			uni.navigateTo({
1233
+				url: '/pages/consumption/index?zoneId=' + this.info.id
1234
+			})
1235
+		},
11981236 		goLottery() {
11991237 			let that = this;
12001238 			var data = {
....@@ -1206,11 +1244,7 @@
12061244 			this.addTrack('yy_marketPageClick', data);
12071245 
12081246 			function go() {
1209
-				let webUrl = 'https://ossacmall.bluedeer.com.cn/acmall_lottery/index.html'
1210
-				if (HTTP_REQUEST_URL.indexOf('tohours') > 0) {
1211
-					webUrl = webUrl.replace('https://ossacmall.bluedeer.com.cn',
1212
-						'https://sit.tohours.com/crmeb_web')
1213
-				}
1247
+				let webUrl = `${WEB_ACTIVITY_BASE}/acmall_lottery/index.html`
12141248 				webUrl += '?token=' +
12151249 					that.$store.getters.token + '&unionId=' + that.$store.getters.unionId + '&mdayId=' + that.info
12161250 						.mdayId
....@@ -1449,6 +1483,7 @@
14491483 			console.log('专区详情入参：：', params)
14501484 			getZoneDetail(that.id, params).then(res => {
14511485 				that.info = res.data;
1486
+				//that.info.zoneType=8;
14521487 				that.updateZoneShareMenu();
14531488 				if (res.data.zoneType == 6) {
14541489 					that.setYueyangZone()
....@@ -1633,13 +1668,11 @@
16331668 .lottery_banner {
16341669 	margin: 15rpx auto;
16351670 	width: 690rpx;
1636
-	height: 120rpx;
16371671 	text-align: center;
16381672 }
16391673 
16401674 .lottery_bannerImg {
16411675 	width: 690rpx;
1642
-	height: 120rpx;
16431676 }
16441677 
16451678 .tag-wrap-container {
....@@ -1840,6 +1873,21 @@
18401873 	transform: translate(0, -50%);
18411874 }
18421875 
1876
+.detail-btn {
1877
+	border: 2rpx solid #fff;
1878
+	border-top-left-radius: 20rpx;
1879
+	border-bottom-left-radius: 20rpx;
1880
+	padding: 10rpx;
1881
+	background-color: #daf2b2;
1882
+	color: #1e984f;
1883
+	width: 50rpx;
1884
+	position: fixed;
1885
+	top: 200rpx;
1886
+	right: 0rpx;
1887
+	line-height: 1rem;
1888
+	z-index: 99;
1889
+}
1890
+
18431891 .head_img {
18441892 	width: 750rpx;
18451893 	height: 422rpx;
....@@ -1850,6 +1898,48 @@
18501898 	}
18511899 }
18521900 
1901
+.rich-content {
1902
+	padding: 24rpx 30rpx;
1903
+	background-color: #fff;
1904
+}
1905
+
1906
+.video-wrap {
1907
+	position: relative;
1908
+	width: 100%;
1909
+	height: 750rpx;
1910
+	background-color: #000;
1911
+}
1912
+
1913
+.video-wrap .video-poster {
1914
+	position: absolute;
1915
+	top: 0;
1916
+	left: 0;
1917
+	width: 100%;
1918
+	height: 750rpx;
1919
+	z-index: 9;
1920
+}
1921
+
1922
+.video-wrap .video-poster .image {
1923
+	width: 100%;
1924
+	height: 100%;
1925
+}
1926
+
1927
+.video-wrap .video-stop {
1928
+	position: absolute;
1929
+	top: 50%;
1930
+	left: 50%;
1931
+	width: 136rpx;
1932
+	height: 136rpx;
1933
+	margin-top: -68rpx;
1934
+	margin-left: -68rpx;
1935
+	z-index: 9;
1936
+}
1937
+
1938
+.video-wrap .video-stop .image {
1939
+	width: 100%;
1940
+	height: 100%;
1941
+}
1942
+
18531943 .toolbarList {
18541944 	width: 750rpx;
18551945 	position: -webkit-sticky;