新版

src/assets/common.css

@@ -62,9 +62,9 @@ div {
 
 .grid-view {
     display: grid;
-    grid-template-columns: repeat(2, 1fr);
+    grid-template-columns: repeat(4, 1fr);
     /* grid-row-gap: 20rem; */
-    grid-gap: 20rem 80rem;
+    grid-gap: 20px 20px;
 }
 
 ::-webkit-scrollbar {

src/components/krpanoVideo/index.vue

@@ -58,10 +58,10 @@
 				type: [Boolean,String],
 				default: true,
 			},
-			scale: {
-				type: [Number,String],
-				default: 1,
-			},
+			// scale: {
+			// 	type: [Number,String],
+			// 	default: 1,
+			// },
 			coordinate: {
 				type: String,
 				default: '',
@@ -73,7 +73,7 @@
 					if (newVal && newVal.length>0) {
 						console.warn("***videoUrl-webgl_rxdz_krpanoVideo***", newVal,oldVal)
 						if(this.sceneLoaded){
-							this.playVideo(newVal)
+							// this.playVideo(newVal)
 						}
 					}
 				},
@@ -97,20 +97,20 @@
 				},
 				immediate: true,
 			},
-			scale: {
-				handler(newVal,oldVal) {
-					console.warn("***scale-webgl_rxdz_krpanoVideo***", newVal,'---',oldVal)
-					if(this.panoramicKrpano){
-						let sc = newVal;
-						if(newVal.toString().includes('{')){
-							let scale = JSON.parse(newVal);
-							sc = scale.x;
-						}
-						this.panoramicKrpano.call(`scaleChange(${sc})`);
-					}
-				},
-				immediate: true,
-			},
+			// scale: {
+			// 	handler(newVal,oldVal) {
+			// 		console.warn("***scale-webgl_rxdz_krpanoVideo***", newVal,'---',oldVal)
+			// 		if(this.panoramicKrpano){
+			// 			let sc = newVal;
+			// 			if(newVal.toString().includes('{')){
+			// 				let scale = JSON.parse(newVal);
+			// 				sc = scale.x;
+			// 			}
+			// 			// this.panoramicKrpano.call(`scaleChange(${sc})`);
+			// 		}
+			// 	},
+			// 	immediate: true,
+			// },
 			coordinate: {
 				handler(newVal,oldVal) {
 					console.warn("***coordinate-webgl_rxdz_krpanoVideo***", newVal,oldVal)
@@ -119,8 +119,32 @@
 			},
 		},
         methods: {
-			playVideo(){
-				this.panoramicKrpano.call(`playSceneName(${this.videoUrl})`);
+			scaleChange(scale,tabIndex){
+				console.warn("**scaleChange****",scale,tabIndex)
+				if(tabIndex==0){//数字人
+					this.panoramicKrpano.call(`scalePeopleChange(${scale})`);
+				}else if(tabIndex==1){//数字宠物
+					this.panoramicKrpano.call(`scalePetChange(${scale})`);
+				}
+			},
+			aiChange(item,type,tabIndex){
+				console.warn("**aiChange****",item,type,tabIndex)
+				if(tabIndex==0){
+					if(type=='add'){
+						this.playVideo(item.url)
+					}else if(type=='canel'){
+						this.stopPeopleVideo()
+					}
+				}else if(tabIndex==1){
+					if(type=='add'){
+						this.playPetVideo(item.url)
+					}else if(type=='canel'){
+						this.stopPetVideo()
+					}
+				}
+			},
+			playVideo(url){
+				this.panoramicKrpano.call(`playSceneName(${url})`);
 				// wx.config({
 				// 	debug: false,
 				// 	appId: '',
@@ -135,6 +159,18 @@
 				// })
 				console.warn("***playSceneName-playVideo***")
 			},
+			stopPeopleVideo(){
+				this.panoramicKrpano.call(`stopPeopleVideo()`);
+				console.warn("***playSceneName-stopPeopleVideo***")
+			},
+			playPetVideo(url){
+				this.panoramicKrpano.call(`playPetVideo(${url})`);
+				console.warn("***playSceneName-playPetVideo***")
+			},
+			stopPetVideo(){
+				this.panoramicKrpano.call(`stopPetVideo()`);
+				console.warn("***playSceneName-stopPetVideo***")
+			},
             panoramic() {
 				console.warn("***panoramicKrpano***",this.videoUrl)
                 this.panoramicKrpano = document.getElementById('panoramic');
@@ -147,7 +183,7 @@
 					console.warn("***sceneLoad***")
 					this.videoBefore = false;
 					this.sceneLoaded = true;
-					this.playVideo();//播放绿幕视频
+					// this.playVideo();//播放绿幕视频
 					if(this.coordinate){
 						let position = JSON.parse(this.coordinate);
 						if(position.ath && position.atv){
@@ -221,7 +257,11 @@
 			},
 			getScale(){
 				let video = this.panoramicKrpano.get("hotspot[video]");
-				console.warn("***getScale***",video.scale);
+				console.warn("***getPeolpeScale***",video.scale);
+			},
+			getPetScale(){
+				let petVideo = this.panoramicKrpano.get("hotspot[petVideo]");
+				console.warn("***getPetScale***",petVideo.scale);
 			},
 			getPosition(){
 				let video = this.panoramicKrpano.get("hotspot[video]");

src/components/krpanoVideo/panoramic.xml

@@ -97,12 +97,13 @@
 			ondown.addevent="set(cursor,grabbing);"
 			onup.addevent="set(cursor,grab);"
 			zorder="2"
+			enabled="true"
 		>
 		</hotspot>
-		
-		<hotspot name="image_hotspot" ath="50.082" atv="14" rotate="-45.0" zorder="1"
+		<!-- 电子人的阴影 -->
+		<!-- <hotspot name="image_hotspot" ath="50.082" atv="14" rotate="-45.0" zorder="1"
 			distorted="true" scale="0.5" alpha="0.5"
-			url="https://dm.static.elab-plus.com/miniProgram/grass.jpg" keep="true"></hotspot>
+			url="https://dm.static.elab-plus.com/miniProgram/grass.jpg" keep="true"></hotspot> -->
 		<action name="draghotspot">
 			spheretoscreen(ath, atv, hotspotcenterx, hotspotcentery, calc(mouse.stagex LT stagewidth/2 ? 'l' : 'r'));
 			sub(drag_adjustx, mouse.stagex, hotspotcenterx);
@@ -111,10 +112,48 @@
 				sub(dx, mouse.stagex, drag_adjustx);
 				sub(dy, mouse.stagey, drag_adjusty);
 				screentosphere(dx, dy, ath, atv);
-				set(hotspot[image_hotspot].ath, get(ath));
-				set(hotspot[image_hotspot].atv, get(atv));
+				<!-- set(hotspot[image_hotspot].ath, get(ath)); -->
+				<!-- set(hotspot[image_hotspot].atv, get(atv)); -->
+			);
+		</action>
+		<!-- 宠物视频 -->
+		<hotspot name="petVideo"
+			ath="80.0" 
+			atv="14"
+			url="https://dm.static.elab-plus.com/videoplayer.js"
+			videourl=""
+			width="180"
+			height="320"
+			chromakey="0x238E54|0.294|0.133"
+			preload="true"
+			pausedonstart="false"
+			loop="true"
+			distorted="true"
+			muted="true"
+			zoom="true"
+			autopause="true"
+			autoresume="true"
+			scale="1"
+			onvideoready="videoreadyFunc"
+			onvideoplay="videoplayHandle"
+			ondown="dragpetspot();"
+			cursor="grab"
+			ondown.addevent="set(cursor,grabbing);"
+			onup.addevent="set(cursor,grab);"
+			zorder="2"
+		>
+		</hotspot>
+		<action name="dragpetspot">
+			spheretoscreen(ath, atv, hotspotcenterx, hotspotcentery, calc(mouse.stagex LT stagewidth/2 ? 'l' : 'r'));
+			sub(drag_adjustx, mouse.stagex, hotspotcenterx);
+			sub(drag_adjusty, mouse.stagey, hotspotcentery);
+			asyncloop(pressed,
+				sub(dx, mouse.stagex, drag_adjustx);
+				sub(dy, mouse.stagey, drag_adjusty);
+				screentosphere(dx, dy, ath, atv);
 			);
 		</action>
+		
 		<action name="mobilescale" autorun="preinit" devices="mobile">
 		    mul(stagescale,0.5);
 		</action>
@@ -124,22 +163,43 @@
 		    <!-- showlog(true, top); -->
 		    <!-- mobilescale(); -->
 		    <!-- 播放视频 -->
+			set(hotspot[video].visible, 'true');
 		    hotspot[video].playvideo(%1, '', false);
 			set(hotspot[video].scale, get(scale));
-			<!-- set(hotspot[video].videourl, %1); -->
 		</action>
+		<action name="stopPeopleVideo">
+			<!-- 播放视频 -->
+			<!-- hotspot[video].playvideo('', '', false); -->
+			hotspot[video].stop();
+			set(hotspot[video].visible, get(false));
+		</action>
+		<action name="playPetVideo">
+			def(scale, string, get(hotspot[petVideo].scale));
+			<!-- 播放视频 -->
+			set(hotspot[petVideo].visible, 'true');
+			hotspot[petVideo].playvideo(%1, '', false);
+			set(hotspot[petVideo].scale, get(scale));
+		</action>
+		<!-- 隐藏数字宠物 -->
+		<action name="stopPetVideo">
+			<!-- 停止视频 -->
+			<!-- hotspot[petVideo].playvideo('', '', false); -->
+			hotspot[petVideo].stop();
+			set(hotspot[petVideo].visible, get(false));
+		</action>
+		
 		<!-- 设置缩放大小 -->
-		<action name="scaleChange">
+		<action name="scalePeopleChange">
 			set(hotspot[video].scale, %1);
 		</action>
-		<!-- 获取缩放大小 -->
-		<action name="getmyScale">
-			def(scale, string, get(hotspot[video].scale));
-			jscall(calc("window.getScaleHandle('"+ get(scale) +"')") );
+		<!-- 设置缩放大小 -->
+		<action name="scalePetChange">
+			set(hotspot[petVideo].scale, %1);
 		</action>
 		<!-- 切换状态播放，暂停 -->
 		<action name="toggleMute">
 			set(hotspot[video].muted, %1);
+			set(hotspot[petVideo].muted, %1);
 		</action>
 		<!-- 视频初始化完成 -->
 		<action name="videoreadyFunc">

src/components/newBottomCom/viewAI/viewAI.html

@@ -1,19 +1,65 @@
 <div class="ai-view">
 	<div class="ai-title rows">
-		<div class="title-btn rows justify-center" :class="{active:tabIndex==0}" @click.stop="tabChange(0)">平台数字人</div>
-		<div class="title-btn rows justify-center" :class="{active:tabIndex==1}" @click.stop="tabChange(1)">明星数字人</div>
+		<div class="title-btn rows justify-center" :class="{active:tabIndex==2}" @click.stop="tabChange(2)">红包</div>
+		<div class="title-btn rows justify-center" :class="{active:tabIndex==0}" @click.stop="tabChange(0)">数字人</div>
+		<div class="title-btn rows justify-center" :class="{active:tabIndex==1}" @click.stop="tabChange(1)">数字宠物</div>
+		<div class="title-btn rows justify-center" :class="{active:tabIndex==3}" @click.stop="tabChange(3)">音乐</div>
 	</div>
-	<div class="ai-tips">
-		点击下面人物替换到全景中，可调整大小和拖动到摆放位置
+	<div class="ai-people" v-if="tabIndex==0">
+		<div class="main grid-view1">
+			<div :class="['item', peopleIndex==idx ? 'active': '']" v-for="(item, idx) in leftList"
+				:key="idx" @click="selectAction(item,idx)">
+				<img class="itemImg" :src="item.icon"/>
+				<div class="item-name rows justify-center">{{item.value}}</div>
+			</div>
+		</div>
+	</div>
+	<div class="ai-people" v-else-if="tabIndex==1">
+		<div class="main grid-view1">
+			<div :class="['item', petIndex==idx ? 'active': '']" v-for="(item, idx) in rightList"
+				:key="idx" @click="selectAction(item,idx)">
+				<img class="itemImg" :src="item.icon"/>
+				<div class="item-name rows justify-center">{{item.value}}</div>
+			</div>
+		</div>
 	</div>
-	<div class="ai-people">
+	<!-- 红包视图 -->
+	<div class="redbox" v-else-if="tabIndex==2">
+		<div class="main-box rows rows-between flex-start">
+			<div class="left-box">
+				<div class="title" style="text-align: left;">点击红包添加</div>
+				<div class="left-main rows">
+					<div class="main-red columns justify-center">
+						<img class="red-img" src="../../krpanoImg/img/horn-img.png"/>
+						<div class="red-btn rows justify-center">塞钱</div>
+					</div>
+					<div class="plus">+</div>
+					<img class="special-img" :src="specialImg"/>
+				</div>
+			</div>
+			<div class="right-box">
+				<div class="title">选择特效</div>
+				<div class="select-view columns" style="justify-content:space-around">
+					<div class="select-btn" :class="{active:specialIndex==0}" @click.stop="specialChange(0)">金光闪闪</div>
+					<div class="select-btn" :class="{active:specialIndex==1}" @click.stop="specialChange(1)">烟花喷射</div>
+					<div class="select-btn" :class="{active:specialIndex==2}" @click.stop="specialChange(2)">彩带飘落</div>
+				</div>
+				
+			</div>
+		</div>
+	</div>
+	<!-- 音乐列表 -->
+	<div class="ai-people" v-else-if="tabIndex==3">
 		<div class="main rows">
-			<div :class="['item', selectIndex==idx ? 'active': '']" v-for="(item, idx) in dataList"
+			<div :class="['item', petIndex==idx ? 'active': '']" v-for="(item, idx) in musicList"
 				:key="idx" @click="selectAction(item,idx)">
 				<img class="itemImg" :src="item.icon"/>
 				<div class="item-name rows justify-center">{{item.value}}</div>
 			</div>
 		</div>
 	</div>
+	<div class="ai-tips">
+		点击添加到场景中，可调整大小和拖动到摆放位置
+	</div>
 	<div class="ai-bottom rows justify-center" @click.stop="mynavigateFuc">发布全景</div>
 </div>

src/components/newBottomCom/viewAI/viewAI.scss

@@ -10,7 +10,7 @@
 		padding-left: 40px;
 		margin-bottom: 20px;
 		.title-btn{
-			width: 210px;
+			// width: 210px;
 			height: 56px;
 			border-radius: 16px;
 			font-family: "Verdana";
@@ -18,46 +18,62 @@
 			font-size: 30px;
 			background: #fff;
 			color: #4e4e4e;
+			padding: 7px 17px;
+			box-sizing: border-box;
 		}
 		.title-btn.active{
 			background: #343434;
 			color: #cef5bc;
 		}
+		
 	}
 	.ai-tips{
 		position: relative;
 		width: 100%;
-		padding-left: 40px;
+		// padding-left: 40px;
 		font-family: "Verdana";
 		font-weight: 400;
 		font-size: 26px;
 		color: #4e4e4e;
 		opacity: 0.5;
 		margin-bottom: 30px;
+		margin-top: 20px;
+		text-align:center;
+	}
+	.grid-view1 {
+	    display: grid;
+	    grid-template-columns: repeat(4, 1fr);
+	    /* grid-row-gap: 20rem; */
+	    grid-gap: 20px 20px;
 	}
 	.ai-people{
 		position: relative;
 		width: 100%;
 		padding-left: 40px;
-		overflow-x: auto;
+		padding-right: 40px;
+		
 		.main{
+			max-height: 400px;
+			overflow-y: auto;
 			.item{
-				margin-right: 20px;
+				// margin-right: 20px;
 				font-size: 0px;
 				.item-name{
 					font-family: "Verdana";
 					font-weight: 400;
 					font-size: 28px;
 					color: #4e4e4e;
+					height: 30px;
 				}
 				.itemImg{
 					width: 150px;
-					height: 210px;
+					height: 140px;
 					border-radius: 20px;
 					border: solid 4px transparent;
 					font-size: 0px;
 					margin-bottom: 10px;
 					box-sizing: border-box;
+					object-fit: contain;
 				}
 			}
 			.item:last-child{
@@ -89,66 +105,70 @@
 	}
 }
 
-.plus_park {
+.redbox{
 	position: relative;
-}
-.shell-view{
-	position: fixed;
-	left: 0px;
-	bottom: 0px;
-	width: 100vw;
-	height: 200px;
-	border-radius: 40px 40px 0 0;
-	background: #fff;
-	box-shadow: 0 -6px 12px #0000001f;
 	box-sizing: border-box;
-	z-index: 315;
-	padding:0px 40px;
-	padding-top:30px;
-	padding-bottom:60px;
-	transition: height 1s;
-}
-.shell-view2{
-	height: 800px;
-}
-.shell-signscoll{
-	position: absolute;
-	top:-50px;
-	left:275px;
-	width:200px;
-	height: 100px;
-	z-index: 120;
-	/* padding-top:50px; */
-	box-sizing: border-box;
-}
-.signscoll-block{
-	position: absolute;
-	width: 90px;
-	height: 10px;
-	border-radius: 5px;
-	background: #707070;
-	opacity: 0.6;
-	bottom: 30px;
-}
-.floor-view{
-	position: absolute;
-	transform: translateY(-150%);
-	left:30px;
-	width: 72px;
-	border-radius: 12px;
-	background: rgba(0, 0, 0, 0.4);
-	overflow: hidden;
-}
-.floor-item{
-	height: 60px;
-	color: #fff;
-	font-size: 28px;
-}
-.floor-item.active{
-	color: #faa040;
-	background: #fff;
-	border-radius: 12px;
+	padding: 0px 40px;
+	margin-top: 50px;
+	.main-box{
+		.title{
+			font-family: "Verdana";
+			font-weight: 400;
+			font-size: 24px;
+			text-align: center;
+			color: #4e4e4e;
+			opacity: 0.5;
+		}
+		.left-box{
+			.left-main{
+				.main-red{
+					.red-img{
+						width: 217px;
+						height: 217px;
+					}
+					.red-btn{
+						width: 124px;
+						height: 54px;
+						border-radius: 27px;
+						background: #f27966;
+						font-family: "DIN Alternate Bold";
+						font-weight: 700;
+						font-size: 24px;
+						color: #fff;
+						margin-top:20px;
+					}
+				}
+				.plus{
+
+					font-size: 20px;
+				}
+				.special-img{
+					width: 242px;
+					height: 242px;
+					margin-left:50px;
+				}
+				
+			}
+		}
+		.right-box{
+			.select-view{
+				margin-top: 50px;
+			}
+			.select-btn{
+				font-family: "Verdana";
+				font-weight: 400;
+				font-size: 28px;
+				margin-bottom: 27px;
+				color: rgba(54, 93, 57, 0.3);
+			}
+			.select-btn.active{
+				color: #365d39;
+			}
+		}
+	}
 }
+
+
 .tips-view{
 	position: absolute;
 	left:50%;
@@ -164,35 +184,3 @@
 	pointer-events: none;
 }
 
-.zoom-view{
-	position: fixed;
-	top:42px;
-	right:30px;
-	width: 52px;
-	height: 52px;
-}
-.zoom-view .icon {
-	width: 52px;
-	height: 52px;
-}
-.connect-view{
-	position: absolute;
-	width: 139px;
-	height: 184px;
-	background: transparent;
-	top:-190px;
-	right:24px; 
-	box-sizing: border-box;
-	.defaultHead{
-		width: 139px;
-		height: 184px;
-	}
-}
-button{
-	background-color: unset;
-	line-height: unset;
-	padding: unset;
-}
-button::after {
-    border: none;
-}

src/components/newBottomCom/viewAI/viewAI.vue

@@ -15,10 +15,14 @@
 			return {
 				leftList:[],
 				rightList:[],
+				musicList:[],//音乐列表
 				dataList:[],
 				tabIndex:0,//当前选中的tab序号
-				selectIndex:0,
-				lastTabIndex:0,
+				selectIndex:-1,
+				peopleIndex:-1,
+				petIndex:-1,
+				specialIndex:0,
+				specialImg:'https://dm.static.elab-plus.com/miniProgram/ai-icon.png',
 			}
 		},
 		props:{
@@ -28,7 +32,10 @@
 		async mounted() {
 			// await this.getCityHouseList();		
 			console.warn("***viewAI***")
-			this.getDatalist();
+			Indicator.open('加载中...');
+			this.getDatalist(0);
+			this.getDatalist(1);
+			this.getDatalist(3);
 		},
 		// 页面被展示时执行
 		onPageShow: function() {  
@@ -42,6 +49,14 @@
 			resolveIndex(index){
 				this.selectIndex = index || 0;
 			},
+			specialChange(index){
+				if(this.specialIndex == index){
+					return false;
+				}
+				this.specialIndex = index;
+				this.specialImg = 'https://dm.static.elab-plus.com/miniProgram/ai-icon.png';
+			},
+			
 			tabChange(index){
 				if(this.tabIndex == index){
 					return false;
@@ -53,19 +68,23 @@
 					return false
 				}
 				this.tabIndex = index;
-				if(index==0){
-					this.dataList = this.leftList;
-				}else{
-					this.dataList = this.rightList;
-				}
-				this.selectIndex = 0;
-				this.aiPeopleChange(this.dataList[this.selectIndex])
+				this.$emit("tabChange",this.tabIndex);//通知页面，户型大类发生了变更
 			},
 			//AI数字人切换
 			selectAction(selItem,index) {
 				console.log('点击动作111：', selItem,index)
-				if(this.selectIndex == index){
-					return false
+				if(this.tabIndex==0){
+					if(this.peopleIndex == index){//取消选中
+						this.aiPeopleChange(this.leftList[this.peopleIndex],'canel')
+						this.peopleIndex = -1;
+						return false
+					}
+				}else if(this.tabIndex==1){
+					if(this.petIndex == index){//取消选中
+						this.aiPeopleChange(this.rightList[this.petIndex],'canel')
+						this.petIndex = -1;
+						return false
+					}
 				}
 				if(this.$parent.repeatFlag == true){
 					Toast({
@@ -73,26 +92,40 @@
 					});
 					return false
 				}
-				this.selectIndex = index;
-				this.aiPeopleChange(this.dataList[this.selectIndex])
+				if(this.tabIndex==0){
+					this.peopleIndex = index;
+					this.aiPeopleChange(this.leftList[this.peopleIndex],'add')
+				}else if(this.tabIndex==1){
+					this.petIndex = index;
+					this.aiPeopleChange(this.rightList[this.petIndex],'add')
+				}
 			},
 			// 获取瀑布流数据
-			async getDatalist() {
-				Indicator.open('加载中...');
+			async getDatalist(type) {
+				let typeName = "Virtual_Human";
+				if(type==0){
+					typeName = "Virtual_Human";
+				}else if(type==1){
+					typeName = "Virtual_Pet";
+				}else if(type==3){
+					typeName = "Virtual_Music";
+					Indicator.close();
+				}
 				var parmas = {
-					"type": "Virtual_Human",
+					"type": typeName,
 					// "brandId": $config.brandId,
 				}
 				let res = await requestConfig('queryEnumList', parmas)
-				Indicator.close();
-				this.dataList = [];
 				this.selectIndex = 0;
 				if (res && res.success && res.list) {
 					let list = res.list;
-					this.leftList = list.filter(it=>it.name=='platform');
-					this.rightList = list.filter(it=>it.name=='star');
-					this.dataList = this.leftList;
-					this.aiPeopleChange(this.dataList[this.selectIndex])
+					if(type==0){
+						this.leftList = list;
+					}else if(type==1){
+						this.rightList = list;
+					}else if(type==3){
+						this.musicList = list;
+					}
 				}
 			},
 			catchTouchMove: function() {
@@ -102,8 +135,8 @@
 			// 	this.$emit('hideOrShowActor',type);//隐藏所有视角
 			// },
 			//种子户型变更-户型大类变更
-			aiPeopleChange(item){
-				this.$emit("aiPeopleChange", item);//通知页面，户型大类发生了变更
+			aiPeopleChange(item,type){
+				this.$emit("aiPeopleChange", item,type,this.tabIndex);//通知页面，户型大类发生了变更
 			},
 			//发布全景
 			mynavigateFuc(e) {

src/pages/webgl_rxdz_krpanovr/webgl_rxdz_krpanovr.html

@@ -7,18 +7,18 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <div class="main-view">
-	<krpanoVideo ref="krpanoVideo" :videoUrl="videoUrl" :bgUrl="bgUrl" :muted="muted" :scale="scale"></krpanoVideo>
+	<krpanoVideo ref="krpanoVideo" :bgUrl="bgUrl" :muted="muted"></krpanoVideo>
 	<div class="voice-btn rows justify-center" @click="updateMuted">
 		<span :class="[muted?'iconfont icon-jingyin':'iconfont icon-yinliang']" style="color: #ffffff;"></span>
 	</div>
 	<div class="slide-mask"></div>
 	<!-- 数字人大小滚动条 -->
-	<div class="slide-view columns rows-between">
-		<div class="slide-tips">数字人<br>大小</div>
+	<div class="slide-view columns rows-between" v-if="tabIndex==0 || tabIndex==1">
+		<div class="slide-tips">{{tabIndex==0?'数字人':'数字宠物'}}<br>大小</div>
 		<div class="slide-word">放大</div>
 		<el-slider
 			class="rangeview"
-		    v-model="rangeValue"
+		    v-model="value"
 		    vertical
 			:min="10"
 			:max="100"
@@ -29,5 +29,5 @@
 		<div class="slide-word">缩小</div>
 	</div>
 	<!-- AI数字人组件 -->
-	<viewAI ref="viewAI" @aiPeopleChange="aiPeopleChange" style="z-index: 13;"></viewAI>
+	<viewAI ref="viewAI" @aiPeopleChange="aiPeopleChange" @tabChange="tabChange" style="z-index: 13;"></viewAI>
 </div>

src/pages/webgl_rxdz_krpanovr/webgl_rxdz_krpanovr.vue

@@ -39,8 +39,12 @@
 				isIOS: false,
 				videoUrl:'',
 				bgUrl:'',
-				rangeValue:50,
-				scale:1,
+				tabIndex:0,
+				value:50,
+				peopleRangeValue:50,
+				petRangeValue:50,
+				peopleScale:1,//数字人的大小
+				petScale:1,	//宠物的大小
 				muted:true,
 			}
 		},
@@ -67,24 +71,29 @@
 				return position;
 			},
 			rangeChange(e){
-				let sca = (this.rangeValue - 50)/50 + 1;
-				if(sca >= 1){
-					sca = sca *2;
+				let sca = 1;
+				sca = (this.value - 50)/50 + 1;
+				if(this.tabIndex==0){
+					this.peopleRangeValue = this.value
+				}else if(this.tabIndex==1){
+					this.petRangeValue = this.value
 				}
-				this.scale = sca;
-				// this.videoMeshChange(this.rangeValue)
+				this.$refs.krpanoVideo.scaleChange(sca,this.tabIndex);
 			},
-			aiPeopleChange(item){
+			tabChange(tabIndex){
+				this.tabIndex = tabIndex;
+				this.value = tabIndex==0?this.peopleRangeValue:this.petRangeValue;
+			},
+			aiPeopleChange(item,type,tabIndex){
 				let self = this;
-				console.warn("***aiPeopleChange***",item);
+				// console.warn("***aiPeopleChange***",item,type,tabIndex);
 				if(!item || !item.url){
 					Toast({
 						message: '没有地址...请稍后再试',
 					});
 					return false;
 				}
-				self.videoUrl = item.url;
-				// self.videoHandle();
+				this.$refs.krpanoVideo.aiChange(item,type,tabIndex);
 			}
 		}
 	}