zjs_project 1 年之前
父节点
当前提交
536e146edc

+ 2 - 2
src/App.vue

@@ -62,9 +62,9 @@
 				console.warn("***error***",error)
 				// 区分是否是js错误
 				if (error.message) {
-					alert("error" + error.message)
+					console.warn("error" + error.message)
 				} else {
-					alert('监测到E1004错误' + error);
+					console.warn('监测到E1004错误' + error);
 				}
 			}, true)
 

+ 5 - 0
src/components/krpanoVideo/index.vue

@@ -300,6 +300,11 @@
                 // 视频暂停了,自动刷新页面, 并且保存,当前的参数
                 window.videopausedFunc = () => {
                 }
+				//红包被点击中了,说明抢到了红包
+				window.toggleRedBox = () => {
+					console.warn("***winLottery***")
+					this.$parent.winLottery();//中奖了
+				}
 				//截图成功了
 				window.show_img = (shottingImg) => {
 					console.warn("***show_img***",shottingImg)

+ 5 - 1
src/components/krpanoVideo/panoramic_no_drag.xml

@@ -126,9 +126,13 @@
 			autoresume="true"
 			scale="1"
 			zorder="2"
-			enabled="false"
+			enabled="true"
+			onclick="toggleRedBox();"
 		>
 		</hotspot>
+		<action name="toggleRedBox">
+			jscall('window.toggleRedBox()');
+		</action>
 		<action name="showRedBox">
 			set(hotspot[redBox].visible, 'true');
 			hotspot[redBox].playvideo(%1, '', false);

+ 1 - 0
src/components/newBottomCom/viewAI/viewAI.vue

@@ -271,6 +271,7 @@
 								ath:_ps.redBoxAth,
 								atv:_ps.redBoxAtv,
 								scale:1,
+								lottieIndex:this.specialIndex,
 								count:this.$parent.redBoxData.count,
 								money:this.$parent.redBoxData.money,
 								message:this.$parent.redBoxData.message,

+ 47 - 0
src/pages/webgl_rxdz_krpano720/webgl_rxdz_krpano720.html

@@ -11,4 +11,51 @@
 	<div v-if="videoUrl" class="voice-btn rows justify-center" @click="updateMuted">
 		<span :class="[muted?'iconfont icon-jingyin':'iconfont icon-yinliang']" style="color: #ffffff;"></span>
 	</div>
+	<div class="music-view rows justify-center" v-if="bgMusic.title">
+		<img class="icon-yinle" src="https://dm.static.elab-plus.com/miniProgram/music_icon.png" alt=""></img>
+		{{bgMusic.title}}
+	</div>
+	<div id="lottie-view" class="lottie-view" v-show="showAnim"></div>
+	<!-- 中奖蒙层 -->
+	<div class="mask-lottery" v-if="showLottery">
+		<!-- 成功 -->
+		<div class="main win" v-if="result.status==1">
+			<div class="iconfont icon-cancel" @click="closeLottery"></div>
+			<div class="win-title">
+				恭喜您<br />
+				获得红包
+			</div>
+			<div class="win-info rows justify-center" style="align-items: flex-end;">
+				<span class="win-unit">¥</span>{{result.amount}}
+			</div>
+			<div class="win-messges">恭喜发财,大吉大利</div>
+			<div class="btn btn-style rows justify-center">立即收下</div>
+		</div>
+		<!-- 过期 -->
+		<div class="main fail" v-else-if="result.status==4">
+			<div class="iconfont icon-cancel"></div>
+			<div class="common-title">
+				红包已过期
+			</div>
+			<div class="common-desc">
+				红包已经过期了,<br />
+				去广场看看其他作品吧
+			</div>
+			<img class="common-img" src="https://dm.static.elab-plus.com/miniProgram/red-fail.png" alt=""></img>
+			<div class="btn common-style rows justify-center">知道了</div>
+		</div>
+		<!-- 抢完了 -->
+		<div class="main fail" v-else-if="result.status==3">
+			<div class="iconfont icon-cancel"></div>
+			<div class="common-title">
+				红包已抢完
+			</div>
+			<div class="common-desc">
+				红包已被抢完了!<br />
+				去广场看看其他作品吧
+			</div>
+			<img class="common-img1" src="https://dm.static.elab-plus.com/miniProgram/red-over.png" alt=""></img>
+			<div class="btn common-style rows justify-center">知道了</div>
+		</div>
+	</div>
 </div>

+ 136 - 0
src/pages/webgl_rxdz_krpano720/webgl_rxdz_krpano720.scss

@@ -20,4 +20,140 @@ page {
 	height:100vh;
     overflow-x: hidden;
     overflow-y: hidden;
+}
+.music-view{
+	position: absolute;
+	left: 42px;
+	top: 38px;
+	font-family: "Verdana";
+	font-weight: 400;
+	font-size: 24px;
+	color: #fff;
+	z-index: 9;
+	.icon-yinle{
+		width: 32px;
+		height: 38.5px;
+		color: #fff;
+		margin-right: 20px;
+	}
+}
+.mask-lottery{
+	position: fixed;
+	width: 100vw;
+	height: 100vh;
+	left: 0px;
+	top: 0px;
+	z-index: 999;
+	background-color: transparent;
+	.main{
+		position: absolute;
+		left: 50%;
+		top: 50%;
+		transform: translate(-50%,-50%);
+		width: 450px;
+		height: 594px;
+		border-radius: 60px;
+		box-sizing: border-box;
+		padding-top: 78px;
+		// padding-left:30px;
+		text-align: center
+	}
+	.win{
+		backdrop-filter: blur(30px);
+		background: linear-gradient(360deg, rgba(255, 255, 255, 0.3) 0%,  rgba(255, 64, 64, 0.8)100%);
+		border: 6px solid #ffb8a7;
+	}
+	.win-title{
+		font-family: "Helvetica Bold";
+		font-weight: 700;
+		font-size: 44px;
+		color: #fff;
+		margin-bottom: 34px;
+	}
+	.win-info{
+		color: rgb(255, 255, 255);
+		font-family: Verdana;
+		font-weight: 700;
+		margin-bottom: 36px;
+		font-size: 100px;
+		// line-height: 100px;
+		box-sizing: border-box;
+	}
+	.win-unit{
+		font-size: 52px;
+		margin-bottom: 10px;
+	}
+	.win-messges{
+		font-family: "Helvetica";
+		font-weight: 400;
+		font-size: 26px;
+		color: #fff;
+	}
+	.fail{
+		background: linear-gradient(360deg, #fff 0%, #ffeaea 100%);
+	}
+	.btn{
+		width: 290px;
+		height: 84px;
+		border-radius: 40px;
+		background: #fff;
+		font-family: "Helvetica Neue Bold";
+		font-weight: 700;
+		font-size: 32px;
+		color: #ff895e;
+	}
+	.btn-style{
+		position: absolute;
+		bottom: -42px;
+		left: 50%;
+		transform: translateX(-50%);
+	}
+	.common-style{
+		position: absolute;
+		bottom: 20px;
+		left: 50%;
+		transform: translateX(-50%);
+		background: #c96161;
+		color: #fff;
+	}
+	.common-title{
+		font-family: "Helvetica Bold";
+		font-weight: 700;
+		font-size: 44px;
+		color: #5f1a1a;
+		margin-bottom: 20px;
+	}
+	.common-desc{
+		font-family: "Helvetica";
+		font-weight: 400;
+		font-size: 26px;
+		color: rgba(39, 39, 39, 0.6);
+		margin-bottom: 20px;
+	}
+	.common-img{
+		width: 192.46px;
+		height: 144.6px;
+		opacity: 0.24;
+	}
+	.common-img1{
+		margin-top: 48px;
+		width: 204.72px;
+		height: 148.5px;
+		opacity: 0.46;
+	}
+	.icon-cancel{
+		position: absolute;
+		right: -30px;
+		top: -50px;
+		font-size: 50px;
+		color: #fff;
+	}
+}
+.lottie-view{
+	position: fixed;
+	left: 0px;
+	top: 0px;
+	width: 100vw;
+	height: 100vh;
+	z-index: 99;
 }

+ 83 - 4
src/pages/webgl_rxdz_krpano720/webgl_rxdz_krpano720.vue

@@ -4,6 +4,7 @@
 <script>
 	import krpanoVideo from "@/components/krpanoVideo/index.vue";
 	import commonPageMethod from '@/mixins/commonPageMethod.js';
+	import lottie from "lottie-web"; //lottie
 	// import commonPageMethod from '@/common/commonPageMethod.js';
 	export default {
 		components: {
@@ -42,6 +43,34 @@
 				muted: true,
 				coordinate: '',
 				type:'',
+				AIPeople:'',
+				AIPet:'',
+				bgMusic:'',
+				redBox:'',
+				showLottery:false,//是否显示中红包状态
+				result:{
+					"amount": 0,	//抢的红包金额
+					"status": 3,	//状态 1:成功抢到红包,2:已经抢过,3:红包已经被抢完了
+				},	//中奖
+				showAnim:false,	//是否添加lottie动画
+				anim:null,
+				specialList:[
+					{
+						id:1,
+						url:'https://dm.static.elab-plus.com/miniProgram/lottieJson/gold.json',
+						title:'金光闪闪',
+					},
+					{
+						id:2,
+						url:'https://dm.static.elab-plus.com/miniProgram/lottieJson/fireworks.json',
+						title:'烟花',
+					},
+					{
+						id:3,
+						url:'https://dm.static.elab-plus.com/miniProgram/lottieJson/coloreRibbon.json',
+						title:'彩带',
+					},
+				],
 			}
 		},
 		beforeDestroy() {
@@ -57,10 +86,10 @@
 			// this.scale = this.$route.query.scale || '1';
 			this.type = this.$route.query.type || '';
 			
-			this.AIPeople = JSON.parse(this.$route.query.AIPeople) || '';
-			this.AIPet = JSON.parse(this.$route.query.AIPet) || '';
-			this.bgMusic = JSON.parse(this.$route.query.bgMusic) || '';
-			this.redBox = JSON.parse(this.$route.query.redBox) || '';
+			this.AIPeople = this.$route.query.AIPeople ? JSON.parse(this.$route.query.AIPeople) : '';
+			this.AIPet = this.$route.query.AIPet ? JSON.parse(this.$route.query.AIPet) : '';
+			this.bgMusic = this.$route.query.bgMusic ? JSON.parse(this.$route.query.bgMusic) : '';
+			this.redBox = this.$route.query.redBox ? JSON.parse(this.$route.query.redBox) : '';
 			this.initAI();
 		},
 		methods: {
@@ -81,6 +110,56 @@
 			updateMuted() {
 				this.muted = !this.muted;
 			},
+			closeLottery(){
+				this.showLottery = false;
+			},
+			//用户选中了红包,要派奖了
+			async winLottery(){
+				//必须是微信用户
+				if(!this.$route.query.leavePhoneCustomerId){
+					console.warn("***no-leavePhoneCustomerId***")
+					return false
+				}
+				if(!this.$route.query.redpackId){
+					console.warn("***no-redpackId***")
+					return false
+				}
+				let res = await requestConfig("rob", {
+					"brandId": $config.brandId,
+					"redpackId": this.$route.query.redpackId,
+					"userId": this.$route.query.leavePhoneCustomerId,
+				});
+				if (res.success) {
+					this.result = res.single;
+					this.showLottery = true;
+					if(this.result.status==1){
+						this.lottieAni()
+					}
+				}else{
+					this.result = null;
+				}
+			},
+			//播放lottie动画
+			lottieAni(){
+				this.showAnim = true;
+				let lottieIndex = this.redBox.lottieIndex || 0;
+				// 播放lottie动画
+				lottie.destroy("lottieView");
+				var element = document.getElementById("lottie-view");
+				this.anim = lottie.loadAnimation({
+					container: element,
+					name: "lottieView",
+					renderer: "svg",
+					loop: false,
+					autoplay: true,
+					path: this.specialList[lottieIndex].url, //动画json
+				});
+				setTimeout(()=>{
+					lottie.destroy("lottieView");
+					this.showAnim = false;
+				},2000)
+			}
+			
 		}
 	}
 </script>

+ 8 - 4
src/pages/webgl_rxdz_krpanoclipImg/webgl_rxdz_krpanoclipImg.vue

@@ -61,6 +61,10 @@
 				type:1,
 				bottomLeftX:0,
 				bottomLeftY:0,
+				AIPeople:'',
+				AIPet:'',
+				bgMusic:'',
+				redBox:'',
 			}
 		},
 		beforeDestroy() {
@@ -74,10 +78,10 @@
 			this.bgUrl = this.$route.query.bgUrl || 'https://elab-marketing-web.oss-accelerate.aliyuncs.com/replicate_images/1702457671501.png';
 			// this.coordinate = this.$route.query.coordinate || '';
 			// this.scale = this.$route.query.scale || '1';
-			this.AIPeople = JSON.parse(this.$route.query.AIPeople) || '';
-			this.AIPet = JSON.parse(this.$route.query.AIPet) || '';
-			this.bgMusic = JSON.parse(this.$route.query.bgMusic) || '';
-			this.redBox = JSON.parse(this.$route.query.redBox) || '';
+			this.AIPeople = this.$route.query.AIPeople ? JSON.parse(this.$route.query.AIPeople) : '';
+			this.AIPet = this.$route.query.AIPet ? JSON.parse(this.$route.query.AIPet) : '';
+			this.bgMusic = this.$route.query.bgMusic ? JSON.parse(this.$route.query.bgMusic) : '';
+			this.redBox = this.$route.query.redBox ? JSON.parse(this.$route.query.redBox) : '';
 			
 			let screenWidth = window.screen.width;
 			let screenHeight = window.screen.height;

+ 3 - 3
src/pages/webgl_rxdz_roam/webgl_rxdz_roam.vue

@@ -295,9 +295,9 @@
 				tweenCameraAnma = value
 			}
 			function attendEvent () {
-				renderer.domElement.addEventListener('touchstart', onPointerStart, false);
-				renderer.domElement.addEventListener('touchmove', onPointerMove, false);
-				renderer.domElement.addEventListener('touchend', onPointerUp, false);
+				renderer && renderer.domElement && renderer.domElement.addEventListener('touchstart', onPointerStart, false);
+				renderer && renderer.domElement && renderer.domElement.addEventListener('touchmove', onPointerMove, false);
+				renderer && renderer.domElement && renderer.domElement.addEventListener('touchend', onPointerUp, false);
 			}
 			//取消事件监听-避免二次进入时触发多次事件
 			function clearEvent(){

+ 1 - 0
src/services/requestConfig.js

@@ -38,6 +38,7 @@ const endpoints = {
 	getPredictions: 'elab-marketing-content/aiGenerateImg/getPredictions', // 获取任务进度-新版
 	shareDetail: 'elab-marketing-content/aiDreamHouse/V3.0/shareDetail', // 分享查看
 	queryEnumList: 'elab-marketing-user/enum/queryEnumList', // 获取数字人
+	rob: 'elab-marketing-file/redpack/rob', // 抢红包
 	// predictions: "https://api.replicate.com/v1/deployments/feathers-wing/spacely-realistic-style-softedge-a100/predictions", // 分享查看
 };
 window.requestConfig = async(endpoint, options, isHideLoading = false, preventDoubleClick = false, method = 'post') => {