Merge branch 'feature_plus小程序' of elab-damai-h5/h5-webgl-program into develop

src/App.vue

@@ -9,7 +9,7 @@
 		<router-view v-if="!$route.meta.keepAlive"></router-view>
 		<div class="loadingShadow" v-show="loading">
 			<div class="loadData">
-				<img src="https://skyforest.static.elaber.cn/detail/loading.gif" alt="" />
+				<img src="https://dm.static.elab-plus.com/miniProgram/loading.gif" alt="" />
 				<div class="loadingMsg">{{loadingMsg}}</div>
 			</div>
 		</div>
@@ -47,11 +47,31 @@
 			let userInfo = getStorage('userInfo') ? JSON.parse(getStorage('userInfo')) : null;
 			let userId = this.$route.query.leavePhoneCustomerId ? this.$route.query.leavePhoneCustomerId : (userInfo?userInfo.userId:'');
 			let xcxHouseId = this.$route.query.xcxHouseId ? this.$route.query.xcxHouseId : (this.$route.query.houseId || '');
+			let landDataId = this.$route.query.landDataId ? this.$route.query.landDataId : '';//土地id
+			let houseName = this.$route.query.houseName ? this.$route.query.houseName : '';//项目名称
+			let cityCode = this.$route.query.cityCode ? this.$route.query.cityCode : '';//土地id
+			let customizedRecordId = this.$route.query.customizedRecordId ? this.$route.query.customizedRecordId : '';//作品id-说明已经存储了
+			let ueId = this.$route.query.ueId ? this.$route.query.ueId : '';//ueId-说明选择了具体的户型
 			let query = this.$route.query;
 			let brandId = this.$route.query.brandId || this.$route.query.special_ID;
 			if (brandId) { //如果存在集团id
 				$config.brandId = brandId;
 			}
+            if (landDataId) { //如果存在土地id
+                this.$store.state.landDataId = landDataId;
+            }
+            if (houseName) { //如果存在项目名称
+                this.$store.state.houseName = houseName;
+            }
+            if (cityCode) { //如果存在cityCode
+                this.$store.state.cityCode = cityCode;
+            }
+            if (customizedRecordId) { //如果存在customizedRecordId
+                this.$store.state.customizedRecordId = customizedRecordId;
+            }
+            if (ueId) { //如果存在ueId
+                this.$store.state.ueId = ueId;
+            }
 			if (xcxHouseId) { //如果存在houseid
 				this.$store.dispatch('setHouseId', xcxHouseId);
 			}
@@ -144,7 +164,6 @@
 		color: #2c3e50;
 		margin-top: 60px; */
 	}
-
 	body {
 		background: #181C28;
 	}

src/components/newBottomCom/viewMask/viewMask.html

@@ -19,12 +19,6 @@
 	<div class="indicator-view rows" v-if="aiImagesList && aiImagesList.length>1 && showAIImage">
 		<div class="indicator-item" :class="{'active': currentIndex == idx}" v-for="(item, idx) in aiImagesList" :key="idx"></div>
 	</div>
-	<!-- <div class="loading_more" v-if="aiFlag && aiImagesList.length>0 && showAIImage">
-		<img class="loading_img"
-			src="https://dm.static2.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_Img.png"
-			mode="aspectFit"></image>
-			自动生成更多图片中{{random+'%'}}...
-	</div> -->
 	<div class="btn-view columns" v-if="showAIImage==false">
 		<!-- 切换视图-退出当前模式 -->
 		<div class="compareBtn btn1" @click.stop="showOrHideWebGl" v-if="aiImagesList && aiImagesList.length>0">
@@ -107,7 +101,7 @@
 		</div>
 	</div>
 	<div class="loadData" v-show="myloading">
-		<img src="https://skyforest.static.elaber.cn/detail/loading.gif" alt="" />
+		<img src="https://dm.static.elab-plus.com/miniProgram/loading.gif" alt="" />
 		<div class="loadingMsg">{{loadingMsg}}</div>
 	</div>
 </div>

src/components/newQCCom/viewMask/viewMask.html

@@ -19,12 +19,6 @@
 	<div class="indicator-view rows" v-if="aiImagesList && aiImagesList.length>1 && showAIImage">
 		<div class="indicator-item" :class="{'active': currentIndex == idx}" v-for="(item, idx) in aiImagesList" :key="idx"></div>
 	</div>
-	<!-- <div class="loading_more" v-if="aiFlag && aiImagesList.length>0 && showAIImage">
-		<img class="loading_img"
-			src="https://dm.static2.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_Img.png"
-			mode="aspectFit"></image>
-			自动生成更多图片中{{random+'%'}}...
-	</div> -->
 	<div class="btn-view columns" v-if="showAIImage==false">
 		<!-- 切换视图-退出当前模式 -->
 		<div class="compareBtn btn1" @click.stop="showOrHideWebGl" v-if="aiImagesList && aiImagesList.length>0">
@@ -54,10 +48,10 @@
 		</div>
 	</div>
 	<!-- 微信客服 -->
-	<div class="connect-view columns"
+	<!-- <div class="connect-view columns"
 		@click.stop="mynavigateFuc" data-jumptype="50" v-if="connectUsImg">
 		<img class="defaultHead" :src="connectUsImg" mode="widthFix"/>
-	</div>
+	</div> -->
 	<!-- 风格层主操作视图 -->
 	<div class="layout-view">
 		<!-- 手势区域 -->
@@ -100,14 +94,17 @@
 				<div class="btn AiBtn rows justify-center up1" @click.stop="aiSubmit(1)">
 					<div class="iconfont icon-a-lujing35039 style1"></div>{{aiImagesList && aiImagesList.length>0?'继续生成':'开始设计'}}
 				</div>
-				<div class="btn houseType rows justify-center up2" @click.stop="gonext">
+				<!-- <div class="btn houseType rows justify-center up2" @click.stop="gonext">
 					下一步
-				</div>
+				</div> -->
+                <div class="btn houseType rows justify-center up2" @click.stop="submit">
+                	提交
+                </div>
 			</div>
 		</div>
 	</div>
 	<div class="loadData" v-show="myloading">
-		<img src="https://skyforest.static.elaber.cn/detail/loading.gif" alt="" />
+		<img src="https://dm.static.elab-plus.com/miniProgram/loading.gif" alt="" />
 		<div class="loadingMsg">{{loadingMsg}}</div>
 	</div>
 </div>

src/components/newQCCom/viewMask/viewMask.vue

@@ -167,6 +167,8 @@
 				datalist:[],
 				connectUsImg:'',
 				curSpaceId:'',
+                queryObj:null,
+                form:null,
 			}
 		},
 		props:{
@@ -215,6 +217,15 @@
 				}
 				this.updataLable();
 			},
+            customizedRecordId: {
+                handler(newVal) {
+                    console.warn("***watch-customizedRecordId***", newVal);
+                    if (newVal != null) {
+                    	this.getIdData();
+                    }
+                },
+                immediate: true,
+            },
 		},
 		filters:{
 		// 	spaceTypeFilter(type){
@@ -253,6 +264,8 @@
 			if(firstData && firstData[0]){
 				this.connectUsImg = firstData[0].selectOptionImageUrl;
 			}
+            let queryObj = getStorage('queryObj') ? JSON.parse(getStorage('queryObj')) : null;
+            this.queryObj = queryObj;
 		},
 		beforeDestroy:function(){
 			console.warn("***beforeDestroy***");//更新到页面上的数据
@@ -262,9 +275,21 @@
 			aiData() {
 				return this.$store.state.aiData;
 			},
+            landDataId() {
+            	return this.$store.state.landDataId;
+            },
+            houseName() {
+            	return this.$store.state.houseName;
+            },
 			curHouseObj() {
 				return this.$store.state.curHouseObj;
 			},
+            userId() {
+            	return this.$store.state.userId;
+            },
+            customizedRecordId() {
+            	return this.$store.state.customizedRecordId;
+            },
 		},
 		methods:{
 			//更改空间显示名称 X空间 类型 根据布局所属类型来显示
@@ -510,7 +535,7 @@
 			async getAiBeautyFamily() {
 				// const spaceName = this.spaceTypes[this.spaceObj.spaceType - 1].title;
 				let res = await requestConfig("getHardboundEffects", {
-					"houseId": this.$route.query.houseId || this.$store.state.houseId,
+					// "houseId": this.$route.query.houseId || this.$store.state.houseId,
 					"spaceType": this.spaceObj.layoutSpaceType || this.spaceObj.spaceType,
 					"spaceName": this.spaceObj.layoutSpaceName || this.spaceObj.spaceName,
 				});
@@ -1058,6 +1083,194 @@
 					}
 				});
 			},
+            submit() {
+                this.spaceAIHandle();
+                setTimeout(()=>{
+                    if(this.customizedRecordId){//修改
+                        this.updateHandle();
+                    }else{//完全新增
+                        this.resultDataHandle();
+                    }
+                },200)
+            },
+            //获取作品信息
+            async getIdData(){
+            	let userId = this.userId || '';
+            	let params = {
+            		id: this.customizedRecordId,
+            		brandId: $config.brandId,
+            		houseId: this.houseId,
+            		userId,
+            		type:'QIANCE',
+            	};
+            	const res = await requestConfig('getCustomizedRecord', params);
+                if (res.success && res.list && res.list[0]) {
+                    let single = res.list[0];
+                    this.form = single;
+                    // this.hardboundEffect = this.form.layoutImgCustomized? [this.form.layoutImgCustomized] : [];//赋值轮播图
+                }
+            },
+            //提交结果数据处理
+            async resultDataHandle(){
+                
+            	// let firstData = JSON.parse(getStorage('firstData'));
+            	let secondData = JSON.parse(getStorage('secondData'));
+            	let thirdData = JSON.parse(getStorage('thirdData'));
+            	let curHouseObj = JSON.parse(getStorage('curHouseObj'));
+            	let spaceList = JSON.parse(getStorage('spaceList'));
+            	let shottingImg = getStorage('shottingImg');
+            	let expand = [];//扩展数据
+            	let checkIndexList = [];
+                let otherlist = [];
+            	let userId = this.userId ? this.userId : '';
+            	let houseData = {
+            		"layoutId": curHouseObj.id,
+            		"layoutName": curHouseObj.name,
+            		"layoutArea": curHouseObj.houseArea,
+            		"floor": 1,
+            		"layoutImgCustomized": shottingImg,
+            		"style": "",
+            		"houseJson": []
+            	}
+            	// firstData.forEach(it=>{
+            	// 	let _dt = {
+            	// 		name:it.name,
+            	// 		value:it.selectOptionImageUrl,
+            	// 	}
+            	// 	expand.push(_dt);
+            	// })
+            	secondData.forEach(it=>{
+            		let _dt = {
+            			name:it.name,
+            			value:it.selectOptionName,
+            		}
+            		expand.push(_dt);
+            	})
+                thirdData.forEach(it=>{
+                	let _dt = {
+                		name:it.spaceName,
+                		value:it.selectOptionName,
+                	}
+                	expand.push(_dt);
+                })
+                let mainImage = '';
+                if(thirdData && thirdData.length>0){
+                    mainImage = thirdData[1] ? thirdData[1].hardboundEffect[0] : thirdData[0].hardboundEffect[0];
+                }
+            	houseData.houseJson = spaceList.concat(thirdData);
+            	// houseData.expand = expand;
+            	let param = {
+            		"brandId": $config.brandId,
+            		"houseId": this.houseId || curHouseObj.houseId,
+            		"userId": userId,
+            		"floot": 1,
+            		"spaceName": curHouseObj.name,
+            		"spaceStructure": '',
+            		"curFloor":1,
+            		layoutStruct:[houseData],
+            		type:'QIANCE',
+            		expand:JSON.stringify(expand),
+                    mainImage:mainImage,
+            	}
+                if(this.landDataId){
+                    param.landDataId = this.landDataId;
+                }
+                if(this.houseName){
+                    param.houseName = this.houseName;
+                }
+            	console.warn("submitHouse-param: ", param);
+            	// setStorage('envData',checkIndexList);
+            	const loading = this.$loading({
+            		lock: true,
+            		text: '提交中...',
+            		spinner: 'el-icon-loading',
+            		background: 'rgba(0, 0, 0, 0.7)'
+            	});
+            	let res = await requestConfig("saveCustomizedRecord", param);
+            	loading.close();
+            	if(res && res.success && res.single){//提交成功
+            		let data = {
+            			houseId:this.houseId || curHouseObj.houseId,
+            			id:res.single,
+            		}
+            		router.push({
+            			name: "webgl_rxdz_text_customize",
+            			query:data
+            		});
+            	}
+            },
+            //修改结果数据处理
+            async updateHandle(){
+            	// let firstData = JSON.parse(getStorage('firstData'));
+            	// let secondData = JSON.parse(getStorage('secondData'));
+            	// let thirdData = JSON.parse(getStorage('thirdData'));
+            	let curHouseObj = JSON.parse(getStorage('curHouseObj'));
+            	let spaceList = JSON.parse(getStorage('spaceList'));
+            	let shottingImg = getStorage('shottingImg');
+            	let expand = [];//扩展数据
+            	let checkIndexList = [];
+                let otherlist = [];
+            	let userId = this.userId ? this.userId : '';
+            	let houseData = {
+            		"layoutId": curHouseObj.id,
+            		"layoutName": curHouseObj.name,
+            		"layoutArea": curHouseObj.houseArea,
+            		"floor": 1,
+            		"layoutImgCustomized": shottingImg,
+            		"style": "",
+            		"houseJson": []
+            	}
+
+                // let mainImage = '';
+                // if(thirdData && thirdData.length>0){
+                //     mainImage = thirdData[1] ? thirdData[1].hardboundEffect[0] : thirdData[0].hardboundEffect[0];
+                // }
+            	// houseData.houseJson = spaceList.concat(this.form.layoutStruct[0].houseJson);
+            	houseData.houseJson = this.form.layoutStruct[0].houseJson.concat(spaceList);
+            	// houseData.expand = expand;
+            	let param = {
+                    id:this.customizedRecordId,
+            		"brandId": $config.brandId,
+            		"houseId": this.houseId || curHouseObj.houseId,
+            		"userId": userId,
+            		"floot": 1,
+            		"spaceName": curHouseObj.name,
+            		"spaceStructure": '',
+            		"curFloor":1,
+            		layoutStruct:[houseData],
+            		type:'QIANCE',
+            		expand:this.form.expand,
+                    // mainImage:this.form.mainImage,
+            	}
+                if(this.landDataId){
+                    param.landDataId = this.landDataId;
+                }
+                if(this.houseName){
+                    param.houseName = this.houseName;
+                }
+            	console.warn("submitHouse-update-param: ", param);
+            	// setStorage('envData',checkIndexList);
+            	const loading = this.$loading({
+            		lock: true,
+            		text: '提交中...',
+            		spinner: 'el-icon-loading',
+            		background: 'rgba(0, 0, 0, 0.7)'
+            	});
+            	let res = await requestConfig("saveCustomizedRecord", param);
+            	loading.close();
+            	if(res && res.success && res.single){//提交成功
+            		let data = {
+            			houseId:this.houseId || curHouseObj.houseId,
+            			id:res.single,
+            		}
+                    wx.miniProgram.redirectTo({url: '/webgl/pages/webgl_rxdz_text_customize/webgl_rxdz_text_customize?id='+data.id+"&houseId="+(this.houseId || curHouseObj.houseId)})
+            		// router.push({
+            		// 	name: "webgl_rxdz_text_customize",
+            		// 	query:data
+            		// });
+            	}
+            },
+            
 			showToast(title,time=3000){
 				this.myloading = false;
 				this.$store.state.loading = true;

src/components/newQCCom/viewShell/viewShell.html

@@ -12,16 +12,16 @@
 		{{pageType==1?'点击进入空间':'单击圆点切换视角'}}
 	</div> -->
 	<!-- 放大缩小操作区域 -->
-	<div class="zoom-view" @click.stop="zoomInOut">
+	<!-- <div class="zoom-view" @click.stop="zoomInOut">
 		<img class="icon" :src="styleType==2?'https://dm.static.elab-plus.com/miniProgram/iconfont/zoomin.png':'https://dm.static.elab-plus.com/miniProgram/iconfont/zoomout.png'" mode="widthFix"/>
-	</div>
+	</div> -->
 	<!-- 微信客服 -->
-	<div class="connect-view columns" v-if="connectUsImg"
+	<!-- <div class="connect-view columns" v-if="connectUsImg"
 		@click="mynavigateFuc" data-jumptype="50">
 		<img class="defaultHead" :src="connectUsImg" mode="widthFix"/>
-	</div>
-	<!-- 手势操作区域 -->
-	<div v-if="showSignscoll" class="shell-signscoll rows justify-center" @click="upScrollOrDown" @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend">
+	</div> -->
+	<!-- 手势操作区域  @click="upScrollOrDown" @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend" -->
+	<div v-if="showSignscoll" class="shell-signscoll rows justify-center">
 		<div class="signscoll-block"></div>
 	</div>
 	<!-- 精细化视图 -->

src/components/newQCCom/viewShell/viewShell.vue

@@ -32,7 +32,7 @@
 				shellHeight:'200px',
 				isShare: false,
 				shareVideoItem:null,
-				styleType:1,	//当前底部组件的状态
+				styleType:2,	//当前底部组件的状态
 				seedItem:null,	//当前选中的种子户型
 				showSignscoll:true,	//是否显示手势操作区域
 				selectSpace:null,//用户选择的空间

src/mixins/commonPageMethod.js

@@ -107,6 +107,9 @@ export default {
 				};
 				util.trackRequest(param);//发送统一PV埋点
 			}
+            if(this.onShow && typeof(this.onShow) ==='function'){
+                this.onShow()
+            }
 		},
 		pvCloseHandle(){
 			if(this.pvId){

src/mixins/createImgHandle.js

@@ -48,6 +48,8 @@ export default {
 			}
 			return new Promise(async (resolve, reject) => {
 				let _data = JSON.parse(JSON.stringify(parmas))
+                _data.keyword = "zhiqite";
+                _data.model = "controlnet";
 				delete _data.webhook;
 				let res = await requestConfig("img2img_local", _data);
 				if (res.success) {
@@ -120,8 +122,8 @@ export default {
 				prompt: prompt,
 				"batchSize": 1,
 				brandId: $config.brandId,
-				height: 1,
-				width: 1,
+				height: 512,
+				width: 768,
 				"moduleType": "AI_Biography",
 				"steps": 20,
 				"sampler": "DDIM",
@@ -130,8 +132,10 @@ export default {
 				"denoising": 0.9,
 				image: imgUrl,
 				// styleImage:imgUrl,
-				keyword: "replicate",
-				model: 'batouresearch/sdxl-controlnet-lora',
+				// keyword: "zhiqite",
+                // model: 'controlnet',
+                keyword: "replicate",
+				model: 'lucataco/ssd-1b',
 			};
 			let result = await this.prevHandle(parmas);
 			console.warn("***prevHandle***", result)
@@ -355,7 +359,9 @@ export default {
 					this.loadingMsg = '启动中';
 				}
 				this.count = this.count + 1;
-				this.getOutPicture();
+                setTimeout(()=>{
+                    this.getOutPicture();
+                },10000)
 			} else if (single.status == 'processing') {
 				let random = single.progress || 0;
 				if (random >= 100) {
@@ -363,7 +369,9 @@ export default {
 				}
 				// this.myloading = true;
 				this.loadingMsg = '生成中…' + parseInt(random) + '%';
-				this.getOutPicture();
+				setTimeout(()=>{
+				    this.getOutPicture();
+				},10000)
 			} else if (single.status == 'succeeded') {
 				// this.myloading = true;
 				this.loadingMsg = '生成中…100%';

src/mixins/floorMethod.js

@@ -36,6 +36,63 @@ export default {
 				this.loaderGraseSpace(list);//加载草地的模型-所有地块都添加，填补房间里面的
 			}
 		},
+        //获取所有空间的中心点-水平面
+        getAllSpaceCenter(list){
+            if(!list || list.length==0){
+                return false;
+            }
+            let xmin = null;
+            let xmax = null;
+            let zmin = null;
+            let zmax = null;
+            list.forEach(obj=>{
+                let positionX = obj.centerX / 100;
+                let positionY = -obj.centerY / 100;
+                let width = obj.spaceWidth / 100;
+                let height = obj.spaceHeight / 100;
+                let x1 = positionX - width/2;//X 轴负方向
+                let x2 = positionX + width/2;//X 轴正方向
+                let z1 = positionY - height/2;//Z 轴负方向
+                let z2 = positionY + height/2;//Z 轴正方向
+                if(!xmax){
+                    xmax = x2;
+                }
+                if(!xmin){
+                    xmin = x1;
+                }
+                if(!zmax){
+                    zmax = z2;
+                }
+                if(!zmin){
+                    zmin = z1;
+                }
+                
+                if(x2 >= xmax){
+                    xmax = x2;
+                }
+                if(x1 <= xmin){
+                    xmin = x1;
+                }
+                if(z2 >= zmax){
+                    zmax = z2;
+                }
+                if(z1 <= zmin){
+                    zmin = z1;
+                }
+            })
+            let position = new THREE.Vector3();//当前几何体的位置参数
+            let positionX = (xmin + xmax)/2;
+            let positionY = (zmin + zmax)/2;
+            position.set(positionX, 0, positionY);
+            // const pointLight = new THREE.PointLight( 0xff0000, 1, 100 );
+            // pointLight.position.set(positionX, 0, positionY);
+            // this.scene.add( pointLight );
+            // const sphereSize = 1;
+            // const pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
+            // this.scene.add( pointLightHelper );
+            console.warn("***getAllSpaceCenter****",xmin,xmax,zmin,zmax);
+            return position;
+        },
 		loaderCommonSpace(gltfSpaceUrl,list,type=1){
 			var that = this;
 			this.loader.load(gltfSpaceUrl,  ( gltf ) => {

src/pages/webgl_rxdz_houseList/webgl_rxdz_houseList.scss

@@ -18,6 +18,7 @@
 	position: relative;
 	height: calc(100% - 210px);
 	padding-top: 170px;
+    box-sizing: border-box;
 	.main{
 		// max-height: 400px;
 		max-height: 100%;

src/pages/webgl_rxdz_test/webgl_rxdz_test.html

@@ -15,6 +15,10 @@
 			</div>
 		</div>
 	</div>
+    <!-- 定位视图 -->
+    <div class="location-view rows justify-center" @click.stop="locationHandle">
+        <span class="iconfont icon-pipei" style="color: #000;font-size: 44rpx;"></span>
+    </div>
     <div id="mapDiv" ref="webgl"></div>
 	<canvas id="glcanvas" width="100vw" height="100vh" ref="glcanvas"
 	 :style="{'height':canvasHeight+'px'}">
@@ -34,4 +38,6 @@
 	<!-- <div id="labels"></div> -->
 	<!-- 左侧操作区域 -->
 	<!-- <left-operate-comp @operateHandle="operateHandle"></left-operate-comp> -->
+    <!-- 生成截屏的画布对象 -->
+    <canvas id="canvas" type="2d" :style="{'height':'200px','top':'200px'}"></canvas>
 </div>

src/pages/webgl_rxdz_test/webgl_rxdz_test.scss

@@ -54,6 +54,16 @@ canvas { width:100vw; height:calc(100vh - 200px);z-index: 10; }
 	position: absolute;
 	left:0px;
 }
+.location-view{
+    position: absolute;
+    top: 100px;
+    right: 20px;
+    width: 80px;
+    height: 80px;
+    border-radius: 24px;
+    background: radial-gradient(50.00% 50.00% at 50.00% 50.00%, #fff 0%, #f7f7f7 67.98%, #fff 100%);
+    border: 2px solid #d6d6d6;
+}
 .area-view{
 	position: absolute;
 	top:10px;

src/pages/webgl_rxdz_test/webgl_rxdz_test.vue

@@ -85,6 +85,7 @@
 				curHouseObj: null,
 				controlStarPosition : { x:0, y:0, z:0},	//控制器初始位置
 				cameraStarPosition : { x:0, y:30, z:0}	,//摄像头初始位置
+                allSpaceCenter:null,//所有空间的中心点-水平面
 				// cameraLastPosition: null,		//摄像头上一次移动到的位置
 				// controlLastPosition: null,		//观察点上一次移动到的位置
 				canvasHeight:200,	//canvas视图的高度-计算得出
@@ -126,13 +127,14 @@
 				overChange:false,	//是否形变中
 				isIOS:false,	//是否ios手机。默认不是
 				currentChangeSpaceId:null,	//当前变化的空间id
-				styleType:1,
+				styleType:2,
 				sumArea:0,	//总面积
 				changeArea:0,	//当次变化的面积
 				fixedArea:0,	//初始面积值
 				layoutArea:0,	//总面积
 				selectSpace:null,//
 				changeStatus:false,
+                // selectIndex:'',
 			}
 		},
 		beforeDestroy() {
@@ -182,16 +184,22 @@
 			console.warn("***beforeDestroy-webgl_rxdz***");
 		},
         mounted() {
-			console.log("***onLoad-webgl_rxdz_test***", this.$route.query,this.$store.state.houseId);
+			console.log("***onLoad-webgl_rxdz_test***", this.$route.query,this.$store.state.houseId,this.customizedRecordId);
 			let isIOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
 			this.isIOS = isIOS;
 			var that = this;
 			this.houseId = this.$store.state.houseId || '';
-			if(true){
-				this.curHouseObj = JSON.parse(getStorage('curHouseObj'));
-			}else{
-				this.curHouseObj = JSON.parse(JSON.stringify(this.$store.state.curHouseObj));
-			}
+			// this.selectIndex = this.$route.query.selectIndex || 0;
+            if(this.customizedRecordId){
+                this.curHouseObj = null;
+            }else{
+                if(getStorage('curHouseObj')){
+                	this.curHouseObj = JSON.parse(getStorage('curHouseObj'));
+                }
+                else if(this.$store.state.curHouseObj){
+                	this.curHouseObj = JSON.parse(JSON.stringify(this.$store.state.curHouseObj));
+                }
+            }
 			console.warn("***this.curHouseObj***",this.curHouseObj)
 			let screenWidth = window.screen.width;
 			let screenHeight = window.screen.height;
@@ -202,8 +210,7 @@
 				screenHeight = Math.min(window.innerHeight,window.screen.height)
 			}
 			let unit = screenWidth / 750;//单位rpm 对应 px 的值
-			that.canvasHeight = screenHeight - (200 * unit) + (20 * unit);
-			
+			that.canvasHeight = screenHeight - (600 * unit) + (20 * unit);
 			const container = this.$refs.webgl;
             const canvas3d = this.canvas = this.$refs.glcanvas;
 			
@@ -232,13 +239,17 @@
 			this.tweenCameraAnmaChange = tweenCameraAnmaChange;
 			this.gradientResize = gradientResize;
 			this.moveMeshCenterHandle = moveMeshCenterHandle;
+            this.movePositionHandle = movePositionHandle;
 			this.starRender = starRender;//对外暴露启动渲染的方法
 			this.stopRender = stopRender;//对外暴露停止渲染的方法
 			this.cameraInit = cameraInit;
 			this.resetControl = resetControl;
+            this.setControlTarget = setControlTarget;
 			if(this.curHouseObj){
 				this.houseInit()
-			}
+			}else{
+                this.findHouseTypeSpaceListByIds();
+            }
 			function init() {
 
                 scene.background = new THREE.Color("#FFFFFF");
@@ -318,6 +329,7 @@
 				controls.maxPolarAngle = Math.PI / 2; // 默认Math.PI，即可以向下旋转到的视角。
 				controls.target.set(that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
 				controls.enableZoom = true;//启用摄像机的缩放
+				controls.enablePan  = false;//启用或禁用摄像机平移，默认为true
 				
 				// 监听相机移动事件-限制只能在当前空间范围内移动
 				// controls.addEventListener('change', () => {
@@ -342,6 +354,12 @@
             //初始状态
             function resetControl(){
             	controls.reset();
+            }
+            //设置控制器的焦点
+            function setControlTarget(target){
+                if(target.isVector3){
+                    controls.target = target;
+                }
             }
 			function onWindowResize() {
 			    camera.aspect = screenWidth / that.canvasHeight;
@@ -446,7 +464,31 @@
 					// updateLables();
 				},1001);//动画结束后回复原始状态
 			}
-			
+			//把摄像机移动到目标点位
+			function movePositionHandle(position = null, height=null){
+				let cameraNewPosition ={};
+				let targetNewPosition ={};
+				let oldUp = {};
+				let newUp = {};
+                let cy = height ? height : camera.position.y;
+				let _juli = cy * Math.tan(Math.PI / 8);
+				cameraNewPosition = {
+					x:position.x,
+					y:cy, 
+					z:position.z + _juli,//增加偏差，防止极点翻转问题？不知道为啥会有用
+				}
+				//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为0
+				targetNewPosition = {
+					x:position.x,
+					y:position.y, 
+					z:position.z
+				}
+				oldUp = camera.up;//俯视状态
+				newUp = camera.up;
+				// console.warn("**movePositionHandle***",position,JSON.stringify(camera.position),JSON.stringify(controls.target)
+				// ,cameraNewPosition,targetNewPosition,JSON.stringify(camera.up))
+				tweenCamera(camera.position,controls.target,cameraNewPosition,targetNewPosition,oldUp,newUp,500);
+			}
             // oldP  相机原来的位置
             // oldT  target原来的位置
             // newP  相机新的位置
@@ -455,9 +497,9 @@
 				if(JSON.stringify(oldP) == JSON.stringify(newP) && JSON.stringify(oldT) == JSON.stringify(newT)){
 					return false;
 				}
-				if (!chooseMesh) {
-					return false;
-				}
+				// if (!chooseMesh) {
+				// 	return false;
+				// }
 				tweenCameraAnma = true;
 				var tween = new TWEEN.Tween({
 					x1: oldP.x, // 相机x
@@ -512,7 +554,7 @@
 				// let _timeStep = 20;//单位 毫秒
 				// let unit = screenWidth / 750;//单位rpm 对应 px 的值
 				// that.canvasHeight = screenHeight - (200 * unit) + (20 * unit);
-				
+				return false;//不在执行变化
 				let unit = screenWidth / 750;//单位rpx 对应 px 的值
 				let _height = startHeight - endHeight;//高度变化-单位rpx
 				let _jisua = that.canvasHeight;
@@ -615,9 +657,27 @@
 				requestId = requestAnimationFrame(render, canvas3d);
 				renderer.render(scene, camera);//单次渲染
 				if (that.screenshotResolve) {
-					stopRender();
-					that.screenshotResolve()
-					that.screenshotResolve = null;//释放Promise
+					// stopRender();
+					// that.screenshotResolve()
+					// that.screenshotResolve = null;//释放Promise
+                    // 上述代码是全canvas截图，下述代码是canvas部分截图
+                    let gl = renderer.getContext();
+                    let pix = window.devicePixelRatio;
+                    let width = parseInt(screenWidth*pix);
+                    let height = parseInt((that.canvasHeight - 40)*pix);//丢弃上面高度为40px 的区域
+                    let pixelData = new Uint8Array(width * height * 4);
+                    if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) === gl.FRAMEBUFFER_COMPLETE) {
+                    	// gl.readPixels(0, 0, frameBuffer.x, frameBuffer.y, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
+                    	gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
+                    	// 确保有像素，微信小程序安卓在进入子页面返回本页面后，再一次readPixels稳定无像素
+                    	if (pixelData.some(i => i !== 0)) {
+                    		stopRender();
+                    		console.warn("***screenshotResolve-pixelData***");
+                    		that.screenshotResolve({pixelData, width, height})
+                    		that.screenshotResolve = null;//释放Promise
+                    		pixelData = null;//清空内存中的数据
+                    	}
+                    }
 				}
             }
 			
@@ -638,9 +698,88 @@
 			userId() {
 				return this.$store.state.userId;
 			},
+            customizedRecordId() {
+            	return this.$store.state.customizedRecordId;
+            },
+            ueId() {
+            	return this.$store.state.ueId;
+            },
 		},
 
 		methods: {
+            async getInitData(){
+            	let parmas = {
+            		childLayout:this.childLayout || 0,
+            		houseId:this.houseId,
+            	}
+            	const res = await requestConfig('getHouseTypeSpaceDetailsV2', parmas, true);
+            	if (res.success && res.list) {
+            		let list = res.list || [];
+            		list && list.forEach((single,index)=>{
+            			single.layoutStruct.forEach((item)=>{
+            				if(item.houseJson){
+            					let spaceList = JSON.parse(item.houseJson);
+            					// 交换centerX， centerY
+            					for (let index = 0; index < spaceList.length; index++) {
+            					    var element = spaceList[index];
+            					    const {centerX, centerY} = element;
+            					    element.centerX = centerY;
+            					    element.centerY = centerX;
+            					}
+            					item.houseJson = JSON.stringify(spaceList);
+            				}
+            			})
+            		})
+            		console.log("户型详情列表-接口原始数据: ", list);
+            		this.houseList = list;//数据会同步到组件中-进而反馈更新页面数据
+            	}
+            },
+            // 查询户型列表
+            async findHouseTypeSpaceListByIds() {
+                // let parmas = {
+                // 	childLayout:this.childLayout || 0,
+                // 	houseId:this.houseId,
+                // }
+                // let _url = "getHouseTypeSpaceDetailsV2";
+                var parmas = {
+                    brandId: $config.brandId,
+                    houseId: this.houseId,
+                    pageNo: 1,
+                    pageSize: 2000,
+                    ids: this.ueId ? [this.ueId] : [286],
+                };
+                let res = await requestConfig("findHouseTypeSpaceListByIds", parmas);
+                if (res.success && res.list) {
+                    let list = res.list || [];
+                    list && list.forEach((item, index) => {
+                        if (item.houseJson) {
+                            let spaceList = JSON.parse(item.houseJson);
+                            // 交换centerX， centerY
+                            for (let index = 0; index < spaceList.length; index++) {
+                                var element = spaceList[index];
+                                const {
+                                    centerX,
+                                    centerY
+                                } = element;
+                                element.centerX = centerY;
+                                element.centerY = centerX;
+                                //默认布局和实际默认布局对不上时的处理方案
+                                if (element.layouts.length > 1) {
+                                    let layout = element.layouts.find(it => it.isDefault == true);
+                                    if (layout) {
+                                        element.layoutId = layout.layoutId;
+                                    }
+                                }
+                            }
+                            item.houseJson = JSON.stringify(spaceList);
+                            console.log("户型详情列表: ", spaceList);
+                        }
+                    })
+                    this.curHouseObj = res.list[0];
+                    setStorage('curHouseObj', this.curHouseObj);
+                    this.houseInit();
+                }
+            },
 			voiceMaskChange(voiceMask){
 				this.voiceMaskShow = voiceMask;
 			},
@@ -815,6 +954,9 @@
 				
 				this.changeSpaceColor(data.spaceId,1);//设置选中空间的颜色
 				this.moveMeshCenter(space);
+                // setTimeout(()=>{
+                //     this.setControlTarget(this.allSpaceCenter)
+                // },1100)
 			},
 			//具体空间面积变化-拖动产生的
 			//data = {
@@ -1637,13 +1779,17 @@
 					this.$message.warning("空间正在调整");
 					return false
 				}
-				let shottingImg = await this.shottingAction() + "?x-oss-process=image/auto-orient,1/quality,Q_46/format,jpg";//开始截图
-				console.warn("***shottingImg***",shottingImg);
-				setStorage('shottingImg', shottingImg);//把空间选择的数据存入本地缓存里面，方便后续使用
-				let gltf = this.lableItem.find(it=>it.spaceId==spaceId);
-				if(gltf){
-					this.goRoam(gltf)
-				}
+                this.locationHandle();
+                setTimeout( async ()=>{
+                    let shottingImg = await this.shottingAction() + "?x-oss-process=image/auto-orient,1/quality,Q_46/format,jpg";//开始截图
+                    console.warn("***shottingImg***",shottingImg);
+                    setStorage('shottingImg', shottingImg);//把空间选择的数据存入本地缓存里面，方便后续使用
+                    let gltf = this.lableItem.find(it=>it.spaceId==spaceId);
+                    if(gltf){
+                        this.goRoam(gltf)
+                    }
+                },550);
+				
 			},
 			//物体漫游-切换页面的方式进入
 			goRoam(gltf){
@@ -1681,6 +1827,9 @@
 					this.moveMeshCenterHandle(obj,type);
 				}
 			},
+            locationHandle(){
+                this.movePositionHandle(this.allSpaceCenter,this.cameraStarPosition.y);//把摄像机移动到所有模型的中心点（水平面中心）
+            },
             // 绘制地板
             async loadSpace(){
 				this.spaceList = [];
@@ -1715,6 +1864,7 @@
                         this.curSpaceObj = this.spaceList[0];
                     }
                 }
+                this.allSpaceCenter = this.getAllSpaceCenter(this.spaceList);//获取所有空间的中心点
                 console.log("该户型空间数据:", this.spaceList, this.layoutIds,type);
                 console.log("当前选中的空间:", this.curSpaceObj,this.curHouseObj);
 				this.spaceListBackup = JSON.parse(JSON.stringify(this.spaceList));
@@ -1814,13 +1964,14 @@
 				});
 				Promise.all(promise_list).then(()=>{
 					let endTime = new Date().getTime();
-					console.log("模型全部加载完成，时间：",endTime - startTime);
+					console.log("模型全部加载完成，时间：",endTime - startTime,this.allSpaceCenter);
 					this.progress = 100;
 					// this.$refs.myLoading.showLoading("加载中..." + this.progress + '%')
 					// 设置空间数组的墙体信息
 					// this.setSpaceListWallInfo();
 					this.$nextTick(()=>{
-						this.moveMeshCenter(this.curSpaceObj);
+                        this.movePositionHandle(this.allSpaceCenter);//把摄像机移动到所有模型的中心点（水平面中心）
+						// this.moveMeshCenter(this.curSpaceObj);
 						// this.myLoadingStatus = false;
 						// this.$refs.myLoading.hideLoading();
 						setTimeout(()=>{

src/pages/webgl_rxdz_test1_env/webgl_rxdz_test1_env.html

@@ -0,0 +1,97 @@
+<div class="bookingSheet">
+    <!-- <shareOption @afterUserHandle="afterShareOptionHandle" @optionChange="optionChange" :showShareOptions="showShareOptions"></shareOption> -->
+    <mynavbar :barData='navbar'/>
+	<!-- <authview id="authView" :showPhoneModel="showPhoneModel"></authview> -->
+    <div class="contentBox" >
+        <!-- 角色图片轮播区域 -->
+        <div class="master-pic" v-if="aiImagesList && aiImagesList.length>0" @touchmove="catchTouchMove">
+        	<el-carousel :autoplay="false" :loop="false" :indicator-dots="false"
+				:initial-index="currentIndex"
+        		@change="swiperChangeImg" class="master-pic-swiper" arrow="always"
+        		ref="carousel" indicator-position="none">
+				<!-- <el-carousel-item class="master-pic-item rows justify-center">
+				    <img @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend" 
+					class="master-pic-img" :src="firstImg" mode="aspectFill" />
+				</el-carousel-item> -->
+                <el-carousel-item v-for="(item,s) in aiImagesList" :key="item.id" 
+        			:item-id="item.id" class="master-pic-item rows justify-center">
+                    <img @touchstart.stop="mytouchstart" @touchmove.stop="mytouchmove" @touchend.stop="mytouchend"
+                    @click="previewImg(item.imageUrl)" 
+        			class="master-pic-img" :src="item.imageUrl" mode="aspectFill" />
+                    <!-- <el-image 
+                        @touchstart.stop="mytouchstart" @touchmove.stop="mytouchmove" @touchend.stop="mytouchend"
+                        class="master-pic-img" :src="item.imageUrl" mode="aspectFill"
+                        :preview-src-list="[item.imageUrl]">
+                    </el-image> -->
+                </el-carousel-item>
+            </el-carousel>
+			<div class="indicator-view rows" v-if="aiImagesList && aiImagesList.length>1">
+				<div class="indicator-item" :class="{'active': currentIndex == idx}" v-for="(item, idx) in aiImagesList" :key="idx"></div>
+			</div>
+			<!-- v-if="aiFlag && aiImagesList.length>0 && showAIImage" -->
+            <div class="load-mask-top"></div>
+			<div class="load-mask"></div>
+			<div class="loading_more" v-if="noMore">
+				<template v-if="!startCreate">
+					<img class="leftSwiperImg"
+						src="https://dm.static.elab-plus.com/miniProgram/leftSwiperImg.png"
+						mode="aspectFit"></image>
+				</template>
+				<template v-else>
+					<img class="loading_img"
+						src="https://dm.static.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_Img.png"
+						mode="aspectFit" />
+					<span class="loading_text" v-if="loadingMsg">{{loadingMsg}}</span>
+				</template>
+			</div>
+        </div>
+		
+		<!-- 底部视图 -->
+		<div class="bottom-view">
+			<!-- 左侧按钮  -->
+			<div class="btn-view columns" v-if="aiImagesList[currentIndex]">
+				<!-- 下载 -->
+				<!-- <div class="compareBtn btn1" @click.stop="save" v-if="showAIImage">
+					<img class="down" src="https://dm.static.elab-plus.com/miniProgram/iconfont/down.png" mode="widthFix"/>
+				</div> -->
+				<!-- 点赞喜欢 -->
+				<div class="likeBtn columns" @click.stop="changeAIImg" :class="{like:checked}">
+					<div class="iconfont icon-qeuren"></div>
+					喜欢
+				</div>
+			</div>
+			<!-- 大类 -->
+			<div class="tabList">
+				<div class="tab-content rows flex-start">
+					<div @click="changeTab(index)" class="tab-item columns"
+						:class="{'tabActive': tabIndex == index}" 
+						v-for="(tab,index) in tabData" :key="index" >
+						<div class="tab-text">{{tab.fatherContent}}</div>
+						<div class="tab-info rows justify-center" :class="{'select': tab.checkedIndex > -1}">
+							<i class="iconfont icon-Hook-1"></i>
+						</div>
+					</div>
+					<div class="tab-line"></div>
+				</div>
+			</div>
+			<!-- 选项 -->
+			<div class="swiper-view">
+				<div class="tab-content rows flex-start">
+					<div @click="changeOption(index)" class="tab-item columns"
+						:class="{'tabActive': optionIndex == index}" 
+						v-for="(tab,index) in options" :key="index" >
+						<img class="tab-img" :src="tab.imageUrl" mode="aspectFill" />
+						<div class="tab-text">{{tab.content}}</div>
+					</div>
+				</div>
+			</div>
+			<div class="question rows justify-center" v-if="tabData && tabData[tabIndex]">
+				{{tabData[tabIndex].subName}}
+			</div>
+			<!-- 底部按钮 -->
+			<div class="bottom-btn rows justify-center" @click="enterAction" :class="{'active': allSelect}">
+				下一步
+			</div>
+		</div>
+    </div>
+</div>

src/pages/webgl_rxdz_test1_env/webgl_rxdz_test1_env.scss

@@ -0,0 +1,359 @@
+/**newIndex.wxss**/
+
+page {
+}
+
+.pointerEvents{
+    pointer-events: none;
+}
+/deep/.el-carousel__container{
+	height: 100%!important;
+}
+.bookingSheet{
+    overscroll-behavior: none; /* 禁用回弹效果 */
+    overflow: hidden; /* 如果需要隐藏滚动条 */ 
+}
+.contentBox{
+	position: relative;
+    width: 100vw;
+	height: 100vh;
+    box-sizing: border-box;
+	background-color: white;
+	z-index: 2;
+    overscroll-behavior: none; /* 禁用回弹效果 */
+    overflow: hidden; /* 如果需要隐藏滚动条 */ 
+	.master-pic{
+	    position: relative;
+	    width: 100%;
+	    height:880px;
+	    // padding: 10px;
+	    box-sizing: border-box;
+	    // background-color: #171717;
+		.master-pic-swiper{
+			width: 100%;
+			height: 100%;
+            overflow: hidden;
+		}
+		.master-pic-item{
+			width: 100%;
+			height: 100%;
+            background: linear-gradient(180deg, #00000000 0%, #00000066 100%);
+			.master-pic-img{
+			    width: 100%;
+			    height: 880px;
+			    display: block;
+				object-fit: contain;
+			}
+		}
+	}
+	.bottom-view{
+		position: fixed;
+		bottom: 0px;
+		left: 0px;
+		width: 100vw;
+		height: calc(100vh - 820px);
+		border-radius: 40px 40px 0 0;
+		background: #fff;
+		padding: 30px 0px;
+		box-sizing: border-box;
+		z-index: 3;
+	}
+    .tabList{
+		position: relative;
+		width: 100%;
+		height: 90px;
+		// top:926px;
+		overflow-x: auto;
+		overflow-y: hidden;
+		margin-bottom: 40px;
+		z-index: 9;
+		.tab-content{
+			position: absolute;
+			min-width: 100vw;
+            justify-content: space-around;
+			.tab-line{
+				position: absolute;
+				left: 0px;
+				bottom: 21px;
+				width: 100%;
+				height: 1px;
+				background: rgba(112, 112, 112, 0.46);
+				opacity: 1;
+				z-index: 1;
+			}
+		}
+        .tab-item{
+			width:max-content;
+            font-family: "Verdana";
+            font-weight: 400;
+            font-size: 24px;
+            color: #1d1d1d;
+			text-align:center;
+			padding:2px;
+			box-sizing: border-box;
+			// margin-right: 60px;
+			z-index: 2;
+			// &:first-child{
+			// 	margin-left: 112px;
+			// }
+			// &:last-child{
+			// 	margin-right: 0px;
+			// }
+            
+			.tab-text{
+				font-family: "Verdana";
+				font-weight: 400;
+				font-size: 32px;
+				color: rgba(39, 39, 39, 0.5);
+			}
+			&.tabActive .tab-text{
+				font-family: "Verdana Bold";
+				font-weight: 700;
+				color: #272727;
+			}
+			.tab-info{
+				position: relative;
+				width: 40px;
+				height: 40px;
+				font-size: 20px;
+				background: #d2c9ba;
+				border: 2px solid #fff;
+				border-radius: 50%;
+				box-sizing: border-box;
+				color: #fff;
+				&.select {
+					background: #ff870f;
+				}
+				i{
+					font-size: 14px;
+				}
+			}
+        }
+    }
+	.swiper-view{
+		position: relative;
+		width: 100%;
+		height: 190px;
+		// top:926px;
+		overflow-x: auto;
+		overflow-y: hidden;
+		margin-bottom: 40px;
+		z-index: 10;
+		background-color: #fff;
+		.tab-content{
+			position: absolute;
+		}
+		.tab-item{
+			// width:190px;
+			width:max-content;
+		    font-family: "Verdana";
+		    font-weight: 400;
+		    font-size: 0px;
+		    color: rgba(69, 69, 69, 0.6);
+			text-align:center;
+			box-sizing: border-box;
+			margin-right: 20px;
+			&:first-child{
+				margin-left: 30px;
+			}
+			&:last-child{
+				margin-right: 0px;
+			}
+		    .tab-img{
+		    	width: 140px;
+		    	height: 140px;
+		    	object-fit: cover;
+				margin-bottom: 8px;
+				border-radius: 12px;
+				border: transparent 2px solid;
+				box-sizing: border-box;
+		    }
+			.tab-text{
+				height: 40px;
+				font-family: "Verdana";
+				font-weight: 400;
+				font-size: 28px;
+				color: #4e4e4e;
+			}
+			&.tabActive .tab-text{
+				font-family: "Verdana Bold";
+				font-weight: 700;
+				color: #f9870f;
+			}
+			&.tabActive .tab-img{
+				border-color: rgba(249, 135, 15, 1);
+			}
+		}
+	}
+    .question{
+		position: fixed;
+		width: 100%;
+		bottom: 178px;
+		font-family: "Verdana";
+		font-weight: 400;
+		height: 34px;
+		font-size: 24px;
+		color: rgba(78, 78, 78, 0.47);
+		z-index: 9;
+	}
+}
+.bottom-btn{
+    position: fixed;
+    width: 652px;
+    height: 88px;
+    border-radius: 44px;
+	left: 50px;
+	bottom: 60px;
+    // background-image:linear-gradient(124deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 1) 100%);
+	background-color: #D6D6D6;
+    box-sizing: border-box;
+	z-index: 11;
+	font-family: "Verdana Bold";
+	font-weight: 700;
+	font-size: 30px;
+	color: rgba(255, 255, 255, 0.7);
+	&.active{
+		background-image:linear-gradient(124deg, rgba(245, 201, 82, 01) 0%, rgba(253, 148, 41, 1) 100%);
+		color: #fff;
+	}
+}
+.indicator-view{
+	position: absolute;
+	z-index: 12;
+	bottom: 70px;
+	left:50%;
+	transform: translateX(-50%);
+	.indicator-item{
+		width: 12px;
+		height: 12px;
+		background: #fff;
+		opacity: 0.52;
+		margin-right:6px;
+		border-radius: 50%;
+		&.active{
+			opacity:1;
+		}
+		&:last-child{
+			margin-right:0px;
+		}
+	}
+}
+.load-mask-top{
+    position: absolute;
+    width: 100%;
+    height: 158px;
+    z-index: 0;
+    background: linear-gradient(0deg, #00000000 0%, #00000066 100%);
+    top: 0px;
+}
+.load-mask{
+	position: absolute;
+	width: 100%;
+	height: 158px;
+	z-index: 2;
+	background: linear-gradient(180.00deg, #00000000 0%, #00000066 100%);
+	bottom: 20px;
+}
+.loading_more {
+	position: absolute;
+	width: 100%;
+	z-index: 12;
+	bottom: 86px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	z-index: 25;
+	color:#fff;
+	font-size:28px;
+	.leftSwiperImg{
+		width: 234.32px;
+		height: 40px;
+	}
+	.loading_img {
+		width: 40px;
+		height: 40px;
+		-webkit-animation: rotation 1s linear infinite;
+		animation: rotation 1s linear infinite;
+	}
+	.loading_text {
+		height: 40px;
+		margin-left: 10px;
+	}
+}
+@keyframes rotation {
+	0% {
+		transform: rotate(0deg);
+	}
+
+	100% {
+		transform: rotate(360deg);
+	}
+}
+.btn-view{
+	position: absolute;
+	top: calc(-132px - 30px);
+	left: 30px;
+	width: 72px;
+	z-index: 13;
+	pointer-events: auto;
+	.compareBtn {
+		position: relative;
+		background: rgba(0,0,0,0.2);
+		border-radius: 50%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		pointer-events: auto;
+		z-index:11;
+		width: 72px;
+		height: 72px;
+	}
+	.likeBtn{
+		width: 72px;
+		height: 132px;
+		border-radius: 36px;
+		padding:30px 10px;
+		background: rgba(0, 0, 0, 0.5);
+		box-sizing: border-box;
+		font-family: "Verdana Bold";
+		font-weight: 700;
+		font-size: 24px;
+		color: #fff;
+		text-align: center;
+		justify-content:unset;
+		z-index: 13;
+		pointer-events: auto;
+		.icon-qeuren{
+			margin-bottom:10px;
+			font-size:30px;
+		}
+	}
+	.like{
+		background: rgba(249, 193, 102, 0.5);
+	}
+	.btn1{
+		margin-bottom:20px;
+	}
+	.compareIcon {
+		width: 42px;
+		height: 44px;
+	}
+	.down{
+		width: 40px;
+		height: 39px;
+	}
+}
+@media screen and (max-height: 750px){
+	.master-pic{
+		height:850px!important;
+	}
+	.bottom-view{
+		height: calc(100vh - 790px)!important;
+	}
+	.question{
+		bottom: 140px!important;
+	}
+	.bottom-btn{
+		bottom: 30px!important;
+	}
+}

src/pages/webgl_rxdz_test1_env/webgl_rxdz_test1_env.vue

@@ -0,0 +1,461 @@
+<template src="./webgl_rxdz_test1_env.html">
+</template>
+
+<script>
+	const util = require('@/utils/util.js').default;
+	const config = require('@/services/urlConfig.js');
+	import router from "@/router";
+	import {
+		setStorage,
+		getStorage,
+		removeItem,
+	} from '@/utils/localStorage';
+	import {
+		Toast
+	} from 'mint-ui';
+	import { MessageBox } from 'mint-ui';
+	import touchHandle from '@/mixins/touchHandle.js';
+	import createImgHandle from '@/mixins/createImgHandle.js';
+	import commonPageMethod from '@/mixins/commonPageMethod.js';
+	export default {
+		mixins: [touchHandle, commonPageMethod,createImgHandle],
+		/**
+		 * 页面的初始数据
+		 */
+		data() {
+			return {
+				pvId: 'p_2cmina_21012501',
+				locusBehaviorName: "环境偏好",
+				locusValue: "",
+				locusName: "",
+				pvCurPageName: "role_set",
+				pvCurPageParams: null,
+				navbar: {
+					showCapsule: 1,
+					title: '环境偏好',
+					titleColor: '#fff',
+					navPadding: 0,
+					navPaddingBg: 'transparent',
+					navBarColor: 'transparent',
+					navBackColor: 'transparent',
+					haveCallback: false, // 如果是 true 会接手 navbarBackClk
+					fromShare: false,
+					fromProject: 0,
+					shareToken: "",
+					pageName: this.pvCurPageName,
+				},
+				houseId: $config.houseIdHs,
+
+				id: '', //题目
+				allSelect:false,//是否所有大类都选择了
+				currentIndex: 0,
+				// featureImgList: [],
+				showPhoneModel: false,
+				tabIndex: 0, //当前在第几个tab
+				optionIndex: -1, //选项选中的序号
+				options: [], //选项数据
+				aiImagesList: [], //角色数据，单独
+				AIImg:'',	//AI生成所需要的垫图
+				tabData: [],
+				checked:false,	//是否喜欢
+				subDataList:[],	//提交的数据对象
+				queryObj:null,
+                noMore:false,
+			}
+		},
+		/**
+		 * 生命周期函数--监听页面加载
+		 */
+		mounted(options) {
+			console.log("***onLoad-webgl_rxdz_customize***", this.$route.query)
+			const that = this;
+			this.houseId = this.$route.query.houseId ? this.$route.query.houseId : (this.$store.state.houseId || '');
+			let queryObj = getStorage('queryObj') ? JSON.parse(getStorage('queryObj')) : null;
+			this.id = this.$route.query.id3 ? this.$route.query.id3 : (queryObj && queryObj.id3?queryObj.id3:'111');
+			this.queryObj = queryObj;
+			this.queryTestcaseSingle();
+		},
+		computed: {
+			userId() {
+				return this.$store.state.userId;
+			},
+		},
+
+		methods: {
+			swiperChangeImg(e) {
+				console.log("***swiperChangeImg***", e);
+				this.currentIndex = e.detail ? e.detail.current : e;
+				this.checked = this.aiImagesList[this.currentIndex].checked;
+                //不存在提示词，则没有
+                if(!this.options[this.optionIndex].remark || !this.options[this.optionIndex].tips){
+                    this.noMore = false;
+                }else{
+                    this.noMore = true;
+                }
+				// this.optionIndex = this.currentIndex;
+				// this.tabData[0].checkedIndex = this.currentIndex;
+			},
+			rightScroll() { //右滑
+				if (this.currentIndex <= (this.aiImagesList.length - 1) && this.currentIndex > 0) {
+					this.$refs.carousel.prev();
+					this.$forceUpdate()
+				}
+			},
+			leftScroll() { //继续生成
+				console.log("***leftScroll***", this.currentIndex,this.aiImagesList.length);
+				if (this.currentIndex != this.aiImagesList.length - 1) {
+					if (this.currentIndex < this.aiImagesList.length - 1) {
+						this.$refs.carousel.next();
+					}
+					return false;
+				}
+				console.log("***leftScroll***",this.AIImg,this.options)
+				let obj = {
+					imgUrl:this.AIImg,
+					prompt:this.options[this.optionIndex].remark,
+					negativePrompt:this.options[this.optionIndex].tips,
+					tabIndex:this.tabIndex,
+					optionIndex:this.optionIndex,
+				}
+                if(obj.prompt && obj.negativePrompt){//有提示词
+                    this.startServer(obj);//继续生成下一张
+                }
+			},
+			//点赞喜欢
+			changeAIImg() {
+				// let lastPage = getCurrentPages()[getCurrentPages().length - 2] ? getCurrentPages()[getCurrentPages().length - 2].$vm : null;
+				this.checked = !this.checked;//变更选项
+				this.aiImagesList[this.currentIndex].checked = this.checked;
+				console.warn("***changeAIImg***",this.checked)
+				let img = this.aiImagesList[this.currentIndex].imageUrl;
+				let obj = this.options[this.optionIndex].hardboundEffect.find(it=>it.imageUrl==img);
+				if(obj){
+					obj.checked = this.checked;
+				}
+			},
+			//查询题目数据
+			async queryTestcaseSingle() {
+				let userId = this.userId || '';
+				let params = {
+					id: this.id,
+					brandId: $config.brandId,
+					houseId: this.houseId,
+					userId,
+				};
+				// params.userId = this.userId;
+				const res = await requestConfig('queryTestcaseSingle', params);
+				if (res.success) {
+					let list = res.list;
+					list.forEach(it => {
+						it.checkedIndex = -1;////增加当前题目用户选择的需要，默认不选中
+						it.options.forEach(option=>{
+							if(option.imageUrls){
+								option.hardboundEffect = option.imageUrls.map(it=>{
+									return {
+										imageUrl: it,
+										checked: false,
+										type:'system',//表示系统生成的
+									}
+								})
+							}
+							// option.hardboundEffect = [
+							// 	{
+							// 		imageUrl :option.imageUrl,
+							// 		type:'system',//人为添加的
+							// 	}
+							// ];//AI生成图存放对象
+						})
+					});
+					let envData = getStorage('envData') ? JSON.parse(getStorage('envData')) : null;
+					this.tabData = list;
+					this.tabData[0].checkedIndex = 0;
+					this.optionIndex = 0;
+					this.options = this.tabData[0].options; //选项数据
+					this.AIImg = this.tabData[0].options[0].imageUrl2;//AI生成所需的垫图
+					this.aiImagesList = this.tabData[0].options[0].hardboundEffect;
+					if(envData && envData.length>0){
+						removeItem('envData');//用完后删除
+					}else{
+						this.submitAnswer()
+					}
+					if(!this.options[this.optionIndex].remark || !this.options[this.optionIndex].tips){
+					    this.noMore = false;
+					}else{
+					    this.noMore = true;
+					}
+					//初始化待提交的数据对象
+					// list.forEach(it=>{
+					// 	let obj = {
+					// 		fatherContent:it.fatherContent,
+					// 		name:it.fatherContent,
+					// 		houseId:it.houseId,
+					// 		houseName:it.houseName,
+					// 		id:it.id,
+					// 		hardboundEffect:[]
+					// 	}
+					// 	this.subDataList.push(obj);
+					// });
+				}
+			},
+			//切换大类
+			changeTab(id) {
+				if (id == this.tabIndex) {
+					return
+				}
+				this.tabIndex = id;
+				this.options = this.tabData[this.tabIndex].options; //选项数据
+				this.optionIndex = this.tabData[this.tabIndex].checkedIndex; //获取用户已经选中的选项
+				if(this.optionIndex>-1){
+					this.aiImagesList = this.options[this.optionIndex].hardboundEffect;
+					this.checked = this.aiImagesList[this.currentIndex].checked;
+                    if(!this.options[this.optionIndex].remark || !this.options[this.optionIndex].tips){
+                        this.noMore = false;
+                    }else{
+                        this.noMore = true;
+                    }
+				}else{
+                    this.noMore = false;
+                }
+				// let param = {
+				// 	type: 'CLK', //埋点类型
+				// 	clkId: 'clk_2cmina_24012601', //点击ID
+				// 	clkName: 'tab_clk', //点击前往的页面名称
+				// 	clkParams: {
+				// 		type: this.tabData[this.tabIndex].fatherContent,
+				// 		locusName: "大类选择",
+				// 	}
+				// };
+				// util.trackRequest(param);
+			},
+			//切换选项
+			changeOption(id) {
+				if (id == this.optionIndex) {
+					return false;
+				}
+				this.optionIndex = id;
+				this.tabData[this.tabIndex].checkedIndex = this.optionIndex;
+				this.allSelect = !this.tabData.some(it=>it.checkedIndex==-1);
+				this.AIImg = this.options[this.optionIndex].imageUrl2;//AI生成图的垫图
+				//替换对应的队列为选中的选项的数组对象
+				this.aiImagesList = this.options[this.optionIndex].hardboundEffect;
+				this.currentIndex = 0;
+				this.$refs.carousel.setActiveItem(0); //切换到第一张
+				this.checked = this.aiImagesList[this.currentIndex].checked;
+				console.warn("***changeOption***", this.tabData,this.AIImg,this.subDataList)
+                if(!this.options[this.optionIndex].remark || !this.options[this.optionIndex].tips){
+                    this.noMore = false;
+                }else{
+                    this.noMore = true;
+                }
+				// let param = {
+				// 	type: 'CLK', //埋点类型
+				// 	clkId: 'clk_2cmina_24012602', //点击ID
+				// 	clkName: 'option_clk', //点击前往的页面名称
+				// 	clkParams: {
+				// 		type: this.options[this.optionIndex].content,
+				// 		locusName: "选项选择",
+				// 	}
+				// };
+				// util.trackRequest(param);
+				this.submitAnswer()
+			},
+			submitAnswer(){
+				let userId = this.userId || '';
+				let params = {
+					"answerContent": [
+						{
+							"optionTitle": this.options[this.optionIndex].content,
+							"questionTitle": this.tabData[this.tabIndex].subContent,//问题标题
+							"subOptionId": this.options[this.optionIndex].id,
+							"subQuestionId": this.tabData[this.tabIndex].id,
+						}
+					],
+					brandId: $config.brandId,
+					houseId: this.houseId,
+					channel:this.queryObj ? this.queryObj.channel : '',
+					city:this.queryObj ? this.queryObj.city : '',
+					district:this.queryObj ? this.queryObj.district : '',
+					province:this.queryObj ? this.queryObj.province : '',
+					paperTitle:'',//试卷id
+					testThemeId:'',
+					testcaseId:this.id,
+					uuid:userId,
+					xcxCustomerId:userId,
+				};
+				requestConfig('submitAnswer', params,true);
+				let param = {
+					type: 'CLK', //埋点类型
+					clkId: 'clk_2cmina_24022003', //点击ID
+					clkName: 'option_clk', //点击前往的页面名称
+					clkParams: {
+						locusValue: this.options[this.optionIndex].content,
+						locusName: "选项选择",
+					}
+				};
+				util.trackRequest(param);
+			},
+			catchTouchMove: function() {
+                alert("***catchTouchMove***")
+				return false;
+			},
+            //预览图片
+            previewImg(img){
+            	if(window.__wxjs_environment === 'miniprogram'){
+            		this.pvCloseHandle();//小程序跳转会主动杀死关闭当前页面-不经过vue跳转关闭逻辑-所以需要主动触发关闭埋点
+            		wx.miniProgram.navigateTo({url: '/activityPackage/pages/scale-img/scaleImg?imgPath=' + img + "&locusValue=" + img + "&houseId=" + this.houseId})
+            	}else{
+            		this.$message.warning("请在小程序中使用");
+            		// this.showPop();
+            	}
+            },
+			//提交结果数据处理
+			async resultDataHandle(){
+                let otherlist = [];
+                this.tabData.forEach(tab=>{
+                	let list = tab.options[tab.checkedIndex].hardboundEffect.filter(it=>it.checked==true);//过滤选中的
+                	list = list.map(it=>{
+                		return it.imageUrl
+                	})
+                	let obj = tab.options[tab.checkedIndex];
+                	let data = {
+                		spaceName:tab.fatherName,
+                		spaceId:'',
+                		hardboundEffect:(list && list.length>0)?list:[obj.imageUrl],
+                	}
+                	otherlist.push(data);
+                })
+                setStorage('thirdData', otherlist);//把环境选择的数据存入本地缓存里面，方便后续使用
+				let firstData = JSON.parse(getStorage('firstData'));
+				let secondData = JSON.parse(getStorage('secondData'));
+				let thirdData = JSON.parse(getStorage('thirdData'));
+				let curHouseObj = JSON.parse(getStorage('curHouseObj'));
+				let spaceList = JSON.parse(getStorage('spaceList'));
+				let shottingImg = getStorage('shottingImg');
+				let expand = [];//扩展数据
+				let checkIndexList = [];
+				let userId = this.userId ? this.userId : '';
+				let houseData = {
+					"layoutId": curHouseObj.id,
+					"layoutName": curHouseObj.name,
+					"layoutArea": curHouseObj.houseArea,
+					"floor": 1,
+					"layoutImgCustomized": shottingImg,
+					"style": "",
+					"houseJson": []
+				}
+				firstData.forEach(it=>{
+					let _dt = {
+						name:it.name,
+						value:it.selectOptionImageUrl,
+					}
+					expand.push(_dt);
+				})
+				secondData.forEach(it=>{
+					let _dt = {
+						name:it.name,
+						value:it.selectOptionName,
+					}
+					expand.push(_dt);
+				})
+                thirdData.forEach(it=>{
+                	let _dt = {
+                		name:it.fatherName,
+                		value:it.options[it.checkedIndex].content,
+                	}
+                	expand.push(_dt);
+                    checkIndexList.push(it.checkedIndex);
+                })
+				// this.tabData.forEach(tab=>{
+				// 	let list = tab.options[tab.checkedIndex].hardboundEffect.filter(it=>it.checked==true);//过滤选中的
+				// 	list = list.map(it=>{
+				// 		return it.imageUrl
+				// 	})
+				// 	let obj = tab.options[tab.checkedIndex];
+				// 	let data = {
+				// 		spaceName:tab.fatherName,
+				// 		spaceId:'',
+				// 		hardboundEffect:(list && list.length>0)?list:[obj.imageUrl],
+				// 	}
+				// 	otherlist.push(data);
+				// 	expand.push({
+				// 		name:tab.fatherName,
+				// 		value:obj.content,
+				// 	});
+				// 	checkIndexList.push(tab.checkedIndex);
+				// })
+				houseData.houseJson = spaceList.concat(otherlist);
+				// houseData.expand = expand;
+				let param = {
+					"brandId": $config.brandId,
+					"houseId": this.houseId || curHouseObj.houseId,
+					"userId": userId,
+					"floot": 1,
+					"spaceName": curHouseObj.name,
+					"spaceStructure": '',
+					"curFloor":1,
+					layoutStruct:[houseData],
+					type:'QIANCE',
+					expand:JSON.stringify(expand),
+				}
+				console.warn("submitHouse-param: ", param);
+				setStorage('envData',checkIndexList);
+				const loading = this.$loading({
+					lock: true,
+					text: '提交中...',
+					spinner: 'el-icon-loading',
+					background: 'rgba(0, 0, 0, 0.7)'
+				});
+				let res = await requestConfig("saveCustomizedRecord", param);
+				loading.close();
+				if(res && res.success && res.single){//提交成功
+					let data = {
+						houseId:this.houseId || curHouseObj.houseId,
+						id:res.single,
+					}
+					router.push({
+						name: "webgl_rxdz_text_customize",
+						query:data
+					});
+				}
+			},
+			
+            //进入下一步
+            enterAction() {
+            	let index = this.tabData.findIndex(it=>it.checkedIndex==-1);
+            	if(index>-1){
+            		Toast({
+            			message: this.tabData[index].fatherContent + '选项不能为空',
+            		});
+            		return false;
+            	}
+                let otherlist = [];
+            	this.tabData.forEach(tab=>{
+            		let list = tab.options[tab.checkedIndex].hardboundEffect.filter(it=>it.checked==true);//过滤选中的
+            		list = list.map(it=>{
+            			return it.imageUrl
+            		})
+            		let obj = tab.options[tab.checkedIndex];
+            		let data = {
+            			spaceName:tab.fatherName,
+            			spaceId:'',
+            			selectOptionName:obj.content,
+            			hardboundEffect:(list && list.length>0)?list:[obj.imageUrl],
+            		}
+            		otherlist.push(data);
+            	})
+            	setStorage('thirdData', otherlist);//把环境选择的数据存入本地缓存里面，方便后续使用
+            	let data = {
+            		houseId:this.houseId || 100297,
+            	}
+            	router.push({
+            		name: "webgl_rxdz_test_houseList",
+            		query:data
+            	});
+            },
+		}
+
+	}
+</script>
+<style lang="scss" scoped>
+	@import "./webgl_rxdz_test1_env.scss";
+</style>

src/pages/webgl_rxdz_test_env/webgl_rxdz_test_env.html

@@ -27,12 +27,12 @@
 			<!-- <div class="loading_more">
 				<template v-if="!startCreate">
 					<img class="leftSwiperImg"
-						src="https://dm.static2.elab-plus.com/miniProgram/leftSwiperImg.png"
+						src="https://dm.static.elab-plus.com/miniProgram/leftSwiperImg.png"
 						mode="aspectFit"></image>
 				</template>
 				<template v-else>
 					<img class="loading_img"
-						src="https://dm.static2.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_Img.png"
+						src="https://dm.static.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_Img.png"
 						mode="aspectFit" />
 					<span class="loading_text" v-if="loadingMsg">{{loadingMsg}}</span>
 				</template>

src/pages/webgl_rxdz_text_customize/webgl_rxdz_text_customize.html

@@ -21,10 +21,27 @@
             </div>
 			<div class="mask"></div>
 			<img class="text-img" src="https://dm.static.elab-plus.com/miniProgram/text-img.png" mode="widthFix"/>
-			<div class="lookHouseView rows justify-center" v-if="tabIndex==0 && (!shareUserId || shareUserId==userId)" @click="toMode">
+            <template v-if="tabIndex==0 && projectUserId==userId">
+                <div class="lookHouseView rows justify-center" v-if="form && form.layoutId" @click="toMode">
+                	<img class="icon-ai" src="https://dm.static.elab-plus.com/miniProgram/iconfont/icon-ai.png" mode="widthFix"/>
+                	查看户型
+                </div>
+                <template v-else>
+                    <!-- 已经定制过 -->
+                    <div class="lookHouseView rows justify-center" v-if="houseDZ" @click="toMode">
+                    	<img class="icon-ai" src="https://dm.static.elab-plus.com/miniProgram/iconfont/icon-ai.png" mode="widthFix"/>
+                    	查看户型
+                    </div>
+                    <div class="lookHouseView rows justify-center" v-else-if="layoutStruct.ueIds && layoutStruct.ueIds.length>0" @click="toUEDatail">
+                    	<img class="icon-ai" src="https://dm.static.elab-plus.com/miniProgram/iconfont/icon-ai.png" mode="widthFix"/>
+                    	柔性定制
+                    </div>
+                </template>
+            </template>
+			<!-- <div class="lookHouseView rows justify-center" v-if="tabIndex==0 && projectUserId==userId" @click="toMode">
 				<img class="icon-ai" src="https://dm.static.elab-plus.com/miniProgram/iconfont/icon-ai.png" mode="widthFix"/>
 				查看户型
-			</div>
+			</div> -->
             <div class="tabList rows flex-start">
 				<div @click="changeTab(index)" class="tab-item columns" :class="{'tabActive': tabIndex == index}" 
 					v-for="(tab,index) in tabData" :key="index" >
@@ -43,11 +60,11 @@
 			<div class="writingBox rows">
 				<img class="writing-img" :src="layoutStruct.houseImg || plotHeadDeafultImg" />
 				<div class="wiriting-right" >
-					<div class="font40 wiriting-text">{{shareUserId&&shareUserId!=userId?'':'我的'}}私人定制</div>
+					<div class="font40 wiriting-text">{{projectUserId&&projectUserId!=userId?'':'我的'}}私人定制</div>
 					<div class="font52 wiriting-text">{{layoutStruct.houseName || ''}}</div>
 				</div>
 			</div> -->
-			<div class="title">{{layoutStruct.houseName}} · 我的梦想设计</div>
+			<div class="title">{{layoutStruct.houseName}} · 梦想设计</div>
             <!-- 文字信息区域 -->
             <div class="info-bar">
 				<div class="info-item" v-for="(item,index) in expand" :key="index">
@@ -56,9 +73,22 @@
 				</div>
             </div>
         </div>
-		
-		<!-- 底部按钮 -->
-		<div class="info-view columns justify-center" v-if="layoutStruct && typeStatus">
+		<!-- 支付后的显示视图 -->
+		<div class="pay-view columns" v-if="projectUserId==userId">
+		    <div class="t1 rows" style="margin-bottom: 6px;">订金权益说明<i class="iconfont icon-shuoming rows" style="margin-left: 6px;"></i></div>
+		    <div class="t2">支付订金 ￥99</div>
+		    <div class="t2" style="margin-bottom: 22.5px;">立得专属私人空间定制方案</div>
+		    <div class="rows " v-if="payed==1">
+		        <div class="bottom-btn btn-qw rows justify-center" @click="conectUS">
+		            加企微 · 定制服务
+		        </div>
+		        <div class="bottom-btn btn-share rows justify-center" @click="share">
+		            <i class="iconfont icon-Shared rows" style="margin-right: 8px;"></i>立即分享
+		        </div>
+		    </div>
+		</div>
+        <!-- 作品支持说明 不是作者本人 -->
+		<div class="info-view columns justify-center" v-if="layoutStruct && projectUserId!=userId">
 			<div class="bottom-title" :style="{'color':tabIndex==0?'#fff':'#000'}">
 				- 支持我的梦想家 -
 			</div>
@@ -66,22 +96,22 @@
 				喜欢我的设计吗，给我投一票吧~
 			</div>
 			<!-- 支持率 -->
-			<div class="rows justify-center info-point">
+			<!-- <div class="rows justify-center info-point">
 				<div class="left-word">{{proportion}}%</div>
 				<div class="line-view rows">
 					<div class="left-line" :style="{width:proportion+'%'}"></div>
 					<div class="right-line" :style="{width:(100 - proportion)+'%'}"></div>
 				</div>
 				<div class="right-word">{{100 - proportion}}%</div>
-			</div>
+			</div> -->
 			<div class="sub-view-result columns" v-if="layoutStruct.clickLike!=null">
 				<img class="img" :src="layoutStruct.clickLike?'https://dm.static.elab-plus.com/miniProgram/like.png':'https://dm.static.elab-plus.com/miniProgram/unlike.png'"></img>
-				<div class="text rows justify-center">感谢您的投票</div>
+				<!-- <div class="text rows justify-center">感谢您的投票</div> -->
 			</div>
-			<div class="sub-view rows justify-center" v-else>
+			<!-- <div class="sub-view rows justify-center" v-else>
 				<div class="left rows justify-center" @click="likeOrView(1)">喜欢</div>
 				<div class="right rows justify-center" @click="likeOrView(2)">不喜欢</div>
-			</div>
+			</div> -->
 			
 			<div class="info-head columns rows-between" v-if="total && headList && headList.length>0">
 				<div class="head-list rows justify-center">
@@ -92,34 +122,54 @@
 					已经有{{total}}人参与梦想家创建
 				</div>
 			</div>
+            <div class="rows justify-center" style="margin-top: 60px;">
+                <div class="bottom-btn btn-qw rows justify-center" @click="toCustomized">
+                    设计我的梦想家
+                </div>
+                <div class="bottom-btn btn-share rows justify-center" @click="toIndex">
+                    {{landDataId?'返回':'返回项目首页'}}
+                </div>
+            </div>
 		</div>
-		<div class="bottom-view rows rows-between" v-if="typeStatus">
-			<div class="bottom-btn btn-qw rows justify-center" @click="toIndex">
-			    设计我的梦想家
-			</div>
-			<div class="bottom-btn btn-share rows justify-center" @click="share">
-				分享我的设计
-			</div>
+		<!-- 底部悬浮按钮占位 -->
+        <div style="width: 100%;height: 100px;"></div>
+        <!-- 底部按钮 不是作者本人-->
+        <div class="bottom-view rows rows-between" v-if="layoutStruct && projectUserId!=userId">
+            <template v-if="layoutStruct.clickLike!=null">
+                <div class="left rows justify-center" style="color:#ccc">不喜欢</div>
+                <div class="right rows justify-center" style="background: rgba(255, 255, 255, 0.33);color:#ccc">喜欢</div>
+            </template>
+            <template v-else>
+                <div class="left rows justify-center" @click="likeOrView(2)">不喜欢</div>
+                <div class="right rows justify-center" @click="likeOrView(1)">喜欢</div>
+            </template>
 		</div>
-		<div class="bottom-view rows rows-between" v-else>
-			<div class="btn columns" @click="share">
+		<!-- 作者本人-未支付 -->
+        <div class="bottom-view rows justify-center" v-else-if="payed==0">
+			<!-- <div class="btn columns" @click="share">
 				<i class="iconfont icon-Shared rows"></i>
 				分享
 			</div>
 			<div class="btn columns" @click="conectUS">
 				<i class="iconfont icon-Comment rows"></i>
 				联系我们
-			</div>
-			<div class="btn1 btn-qw rows justify-center" style="margin-right: 0px;" @click="toIndex">
-				返回项目首页
-			</div>
-			<!-- <div class="bottom-btn btn-qw rows justify-center" @click="conectUS">
-			    联系我们了解更多
-			</div>
-			<div class="bottom-btn btn-share rows justify-center" @click="share">
-				分享我的设计
 			</div> -->
+			<div class="bottom-btn btn-qw rows justify-center" style="margin-right: 0px;width: 143px;color: #ed9e5b;background: #fff;margin-right: 30px;" @click="toIndex">
+				{{landDataId?'返回':'返回项目首页'}}
+			</div>
+            <div class="bottom-btn btn-share rows justify-center" style="width: 124px;" @click="payOrder">
+                下单
+            </div>
 		</div>
+        <!-- 作者本人-已经支付 -->
+        <!-- <div class="bottom-view rows justify-center" v-else-if="payed==1">
+        	<div class="bottom-btn btn-qw rows justify-center" style="margin-right: 0px;width: 143px;color: #ed9e5b;background: #fff;margin-right: 30px;" @click="toIndex">
+        		{{landDataId?'返回':'返回项目首页'}}
+        	</div>
+            <div class="bottom-btn btn-share rows justify-center" style="width: 124px;" @click="toCustomized">
+                设计我的梦想家
+            </div>
+        </div> -->
 		<!-- 高斯背景图 -->
 		<div class="swiper-img-gs-mh"  >
 			<img class="img" mode="aspectFill" src="https://dm.static.elab-plus.com/miniProgram/test-bg.jpg" />

src/pages/webgl_rxdz_text_customize/webgl_rxdz_text_customize.scss

@@ -168,7 +168,7 @@ page {
         margin-left: 40px;
         margin-right: 40px;
         margin-top: 60px;
-        margin-bottom: 160px;
+        margin-bottom: 60px;
         position: relative;
         // border: 2px solid rgba(255, 255, 255, 0.5);
 		// border-top:none;
@@ -284,7 +284,7 @@ page {
 	position: relative;
 	width: 100%;
 	padding: 0px 30px;
-	padding-bottom:300px;
+	padding-bottom:200px;
 	box-sizing: border-box;
 	z-index: 3;
 	.bottom-title{
@@ -342,7 +342,7 @@ page {
 		}
 	}
 	.sub-view-result{
-		margin-bottom: 180px;
+		margin-bottom: 50px;
 		.img{
 			width: 152px;
 			height: 60px;
@@ -394,61 +394,90 @@ page {
 	background-image: url('https://dm.static.elab-plus.com/miniProgram/rxdz_btn_bg.png');
 	background-repeat: no-repeat;
 	background-size: cover;
-    .bottom-btn{
-        width: 290px;
-        height: 80px;
-        border-radius: 40px;
-		font-family: "DIN Alternate Bold";
-		font-weight: 700;
-		font-size: 28px;
-        .bottom-subtitle{
-            font-family: "DIN Alternate Bold";
-            font-weight: bold;
-            font-size: 30px;
-            white-space: nowrap;
-        }
+    .text{
+        font-family: "Verdana";
+        font-weight: 400;
+        font-size: 28px;
+        color:rgba(255, 255, 255, 0.55)
     }
-	.btn{
-		height: 96px;
-		font-family: "Verdana";
-		font-weight: 400;
-		font-size: 24px;
-		line-height: 32px;
-		text-align: center;
-		color: #eeefef;
-		.iconfont{
-			height: 45px;
-			font-size: 40px;
-			color: #FFD37E;
-		}
-	}
-	.btn1{
-		width: 418px;
-		height: 96px;
-		border-radius: 48px;
-		background: linear-gradient(130.79deg, #a0ed84 0%, #e8f4b7 100%);
-		border: 2px solid #ffffff38;
-		font-family: "DengXian Bold";
-		font-weight: 700;
-		font-size: 34px;
-		line-height: 32px;
-		color: #365d39;
-	}
-	.btn-qw{
-		background: linear-gradient(130.79deg, #a0ed84 0%, #e8f4b7 100%);
-		color: #365d39;
-		margin-right:30px;
-	}
-    .btn-share{
-        background: #f6a553;
-        box-shadow: 0 6px 20px rgba(208, 193, 168, 0.31);
-		color: #fff;
+    .left{
+        font-family: "FontName";
+        font-weight: 400;
+        font-size: 40px;
+        color: #fff;
+    	width: 50%;
+    	height: 80px;
+    	background: rgba(255, 255, 255, 0.33);
+    	border-radius: 40px 0% 0% 40px;
+    	margin-right: -10px;
+    	clip-path: polygon(0 0%, 100% 0, calc(100% - 20px) 100%, 0 100%);
     }
-	.icon-Shared{
-		color: #ffffff;
-		font-size:24px;
-		// margin-right:10px;
-	}
+    .right{
+        font-family: "FontName";
+        font-weight: 400;
+        font-size: 40px;
+        color: #fff;
+    	width: 50%;
+    	height: 80px;
+        background: #e38330;
+    	border-radius: 0px 40px 40px 0px;
+    	clip-path: polygon(20px 0%, 100% 0, 100% 100%, 0 100%);
+    }
+}
+.bottom-btn{
+    width: 290px;
+    height: 80px;
+    border-radius: 40px;
+    font-family: "DIN Alternate Bold";
+    font-weight: 700;
+    font-size: 28px;
+    .bottom-subtitle{
+        font-family: "DIN Alternate Bold";
+        font-weight: bold;
+        font-size: 30px;
+        white-space: nowrap;
+    }
+}
+.btn{
+    height: 96px;
+    font-family: "Verdana";
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 32px;
+    text-align: center;
+    color: #eeefef;
+    .iconfont{
+        height: 45px;
+        font-size: 40px;
+        color: #FFD37E;
+    }
+}
+.btn1{
+    width: 418px;
+    height: 96px;
+    border-radius: 48px;
+    background: linear-gradient(130.79deg, #a0ed84 0%, #e8f4b7 100%);
+    border: 2px solid #ffffff38;
+    font-family: "DengXian Bold";
+    font-weight: 700;
+    font-size: 34px;
+    line-height: 32px;
+    color: #365d39;
+}
+.btn-qw{
+    background: linear-gradient(130.79deg, #a0ed84 0%, #e8f4b7 100%);
+    color: #365d39;
+    margin-right:30px;
+}
+.btn-share{
+    background: #f6a553;
+    box-shadow: 0 6px 20px rgba(208, 193, 168, 0.31);
+    color: #fff;
+}
+.icon-Shared{
+    color: #ffffff;
+    font-size:24px;
+    // margin-right:10px;
 }
 .info-head{
 	width: 100%;
@@ -475,7 +504,25 @@ page {
 		color: #fff;
 	}
 }
-
+.pay-view{
+    position: relative;
+    z-index: 2;
+    .t1{
+        font-family: "Verdana";
+        font-weight: 400;
+        font-size: 26px;
+        line-height: 48px;
+        color: #fff;
+        opacity: 0.7;
+    }
+    .t2{
+        font-family: "DIN Alternate Bold";
+        font-weight: 700;
+        font-size: 40px;
+        line-height: 52px;
+        color: #fff;
+    }
+}
 
 .swiper-img-gs-mh {
 	// width: 100vw;
@@ -498,16 +545,6 @@ page {
 		object-fit: cover;
 	}
 }
-.pop-shareImg{
-	position: fixed;
-	width: 100vw;
-	height: 100vh;
-	box-sizing: border-box;
-	left: 0px;
-	top: 0px;
-	background-color: rgba(112, 112, 112, 0.5);
-	z-index: 99;
-}
 .pop-view{
 	position: fixed;
 	width: 100vw;

src/pages/webgl_rxdz_text_customize/webgl_rxdz_text_customize.vue

@@ -45,6 +45,7 @@ export default {
             houseId: $config.houseIdHs,
 
             shareUserId: null, // 分享者ID
+            projectUserId: null, // 该作品的作品用户id
             id: '',//方案库id
 
             currImgIdx:0,
@@ -74,6 +75,8 @@ export default {
 			isSend:false,
 			showPopup:false,
 			isIOS:false,
+            payed:0,//当前柔性定制是否已经支付了  1：是，0：否，默认0
+            houseDZ:true,  //是否已经户型定制过，默认 有
 		}
     },
     /**
@@ -103,9 +106,19 @@ export default {
 		userId() {
 			return this.$store.state.userId;
 		},
+        landDataId() {
+        	return this.$store.state.landDataId;
+        },
+        cityCode() {
+        	return this.$store.state.cityCode;
+        },
 	},
 
     methods: {
+        onShow(){
+            console.warn("***页面显示***");
+            this.getIdData();
+        },
 		showPop() {
 			this.showUserInput = true;
 		},
@@ -257,11 +270,30 @@ export default {
 				}
 			}
 		},
+        //去定制
+        toCustomized(){
+        	if(window.__wxjs_environment === 'miniprogram'){
+        		this.pvCloseHandle();//小程序跳转会主动杀死关闭当前页面-不经过页面框架跳转关闭逻辑-所以需要主动触发关闭埋点
+                if(this.landDataId){//有土地id-前往地块定制入口页面
+                    wx.miniProgram.redirectTo({url: '/amapPackage/pages/depositList/depositList?bizId='+this.landDataId+'&pageStatus=2'})
+                }else{
+                    wx.miniProgram.redirectTo({url: '/pages/index/index?houseId='+this.houseId})
+                }
+        	}else{
+        		let url = $config.min_uri + "pages/index/index?houseId=" + this.houseId
+        		// window.location.href = shottingImg;
+        		window.open(url)
+        	}
+        },
 		//去往首页
 		toIndex(){
 			if(window.__wxjs_environment === 'miniprogram'){
 				this.pvCloseHandle();//小程序跳转会主动杀死关闭当前页面-不经过页面框架跳转关闭逻辑-所以需要主动触发关闭埋点
-				wx.miniProgram.redirectTo({url: '/pages/index/index?houseId='+this.houseId})
+                if(this.landDataId){//有土地id
+                    wx.miniProgram.redirectTo({url: '/amapPackage/pages/blockDetail/blockDetail?id='+this.landDataId})
+                }else{
+                    wx.miniProgram.redirectTo({url: '/pages/index/index?houseId='+this.houseId})
+                }
 			}else{
 				let url = $config.min_uri + "pages/index/index?houseId=" + this.houseId
 				// window.location.href = shottingImg;
@@ -278,6 +310,20 @@ export default {
 				this.showPop();
 			}
 		},
+        //支付订单
+        payOrder(){
+        	if(window.__wxjs_environment === 'miniprogram'){
+        		this.pvCloseHandle();//小程序跳转会主动杀死关闭当前页面-不经过vue跳转关闭逻辑-所以需要主动触发关闭埋点
+                if(this.landDataId){//有土地id
+                    wx.miniProgram.redirectTo({url: '/amapPackage/pages/transfer/transfer?goodId='+this.id+"&landDataId="+this.landDataId})
+                }else{
+                    wx.miniProgram.redirectTo({url: '/amapPackage/pages/transfer/transfer?goodId='+this.id+"&houseId="+this.houseId})
+                }
+        	}else{
+        		this.$message.warning("请在小程序中使用");
+        		// this.showPop();
+        	}
+        },
 		async share(){
 			if(window.__wxjs_environment === 'miniprogram'){
 				// Toast({
@@ -328,6 +374,7 @@ export default {
 				houseId:this.houseId,
 				userId,
 				type:1,
+                cityCode:this.cityCode || '',
 			};
 			if(type==1){//喜欢
 				params.likeed = 1
@@ -369,6 +416,10 @@ export default {
 			if(this.shareUserId){//分享时 不带用户id
 				delete params.userId
 			}
+            if(this.landDataId){
+                params.landDataId = this.landDataId;
+                delete params.houseId
+            }
 			// params.userId = this.userId;
 			const res = await requestConfig('getCustomizedRecord', params);
             if (res.success && res.list && res.list[0]) {
@@ -378,16 +429,29 @@ export default {
 				if(single.expand){
 					let list = JSON.parse(single.expand);
 					let ind = list.findIndex(it=>it.name == '户型偏好');
-					this.expand = list.slice(ind);
+                    if(ind>-1){
+                        this.expand = list.slice(ind);
+                    }else{
+                        this.expand = list;
+                    }
 				}
 				this.layoutStruct = JSON.parse(JSON.stringify(single));
-				
+				this.payed = single.payStatus || 0;//是否支付成功  1：是，0：否，默认0
 				this.likeCount = this.layoutStruct.liked;//喜欢的人数
 				this.unlikedCount = this.layoutStruct.unliked;//不喜欢人数
 				this.total = this.layoutStruct.total;//总人数
+                this.projectUserId = single.userId;//该作品的作品用户id
+                this.navbar.title = single.userName ? (single.userName + "定制") : "我的定制";//修改标题
 				if((this.likeCount + this.unlikedCount)>0){
 					this.proportion = parseInt((this.likeCount / (this.likeCount + this.unlikedCount))*100);
 				}
+                let landDataId = this.layoutStruct.landDataId ? this.layoutStruct.landDataId : '';//土地id
+                if (landDataId && !this.$store.state.landDataId) { //如果存在土地id并且进入时没有土地id
+                    this.$store.state.landDataId = landDataId;
+                }
+                if(!this.houseId && single && single.houseId){
+                    this.houseId = single.houseId;
+                }
                 // this.number = single.landCode
                 this.form = single.layoutStruct[0];
 				this.headList = this.layoutStruct.heads || [];
@@ -423,6 +487,12 @@ export default {
 					}
 					this.tabData.push(data);
 				})
+                //有户型id，说明已经进入过户型的柔性定制
+                if(this.form.houseJson && this.form.houseJson[0] && this.form.houseJson[0].spaceId){
+                    this.houseDZ = true;
+                }else{
+                    this.houseDZ = false;
+                }
 				this.gsImage = this.form.layoutImgCustomized;//获取高斯模糊的图片
             }else{
 				Toast({
@@ -444,8 +514,7 @@ export default {
                 clkName: 'roomretpic_clk', //点击前往的页面名称
                 clkParams: {
                     type: this.tabData[this.tabIndex].name,
-                    locusName: "房间名称",
-                    // locusValue: this.tabData[this.tabIndex].name,
+                    locusValue: this.tabData[this.tabIndex].name,
                 }
             };
             util.trackRequest(param);
@@ -454,7 +523,33 @@ export default {
         catchTouchMove: function() {
             return false;
         },
-        
+        // 点击跳转到h5柔性定制-继续
+        toUEDatail() {
+            console.warn("toUEDatail")
+            let data = {
+            	houseId:this.houseId,
+            	customizedRecordId:this.id,
+                ueId: this.form.layoutId,
+            }
+            router.push({
+            	name: "webgl_rxdz_test",
+            	query:data
+            });
+            // let expand = {
+            //     houseId: this.houseId,
+            //     customizedRecordId: this.id, //定制的作品id
+            //     ueId: this.form.layoutId,
+            // }
+            // let webUrl = config.rxdzUrl + "pages/webgl_rxdz_test";
+            // webUrl += util.converToUrl(expand);
+            // uni.navigateTo({
+            //     keep: true, //不处理
+            //     url: '/pages/webView/webView?view=' + encodeURIComponent(webUrl) + "&houseId=" + this.houseId,
+            //     fail: function(res) {
+            //         console.log(res)
+            //     },
+            // })
+        },
         toMode(){
 			let data = {
 				houseId:this.houseId,
@@ -469,7 +564,7 @@ export default {
 				clkId: 'clk_2cmina_23080420', //点击ID
 				clkName: 'checkroom_clk', //点击前往的页面名称
 				clkParams: {
-					locusName: "查看户型",
+					locusValue: "查看户型",
 				}
 			};
 			util.trackRequest(param);

src/router/index.js

@@ -25,6 +25,8 @@ import webgl_rxdz_test_roam from '@/pages/webgl_rxdz_test_roam/webgl_rxdz_test_r
 import webgl_rxdz_text_customize from '@/pages/webgl_rxdz_text_customize/webgl_rxdz_text_customize';//前测-结果查看
 import webgl_rxdz_test_look from '@/pages/webgl_rxdz_test_look/webgl_rxdz_test_look.vue';//前测查看具体户型
 
+import webgl_rxdz_test1_env from '@/pages/webgl_rxdz_test1_env/webgl_rxdz_test1_env';//前测-环境偏好
+
 Vue.use(Router)
 const router = new Router({
     mode: 'hash',
@@ -195,6 +197,14 @@ const router = new Router({
 				keepAlive:false
 			}
 		},
+        {
+        	path: '/pages/webgl_rxdz_test1_env',
+        	name: 'webgl_rxdz_test1_env',
+        	component: webgl_rxdz_test1_env,
+        	meta:{
+        		keepAlive:false
+        	}
+        },
     ],
 })
 // router.beforeRouteLeave = (to, from, next)=> {

src/services/requestConfig.js

@@ -18,6 +18,7 @@ const endpoints = {
 	
 	houseDetail: 'elab-marketing-user/house/detail',
 	findHouseTypeSpaceList: 'elab-marketing-file/space_generation_background/findHouseTypeSpaceList',
+	findHouseTypeSpaceListByIds: 'elab-marketing-file/space_generation_background/findHouseTypeSpaceListByIds',
 	layoutList: 'elab-marketing-content/aiDreamHouse/V3.0/layoutList',
 	labelList: 'elab-marketing-content/aiDreamHouse/V3.0/labelList',
 	findOverallArrangementList: 'elab-marketing-file/space_generation_background/findOverallArrangementList',

src/store/state.js

@@ -9,5 +9,10 @@ const state = {
 	wallList:null,	//墙体数据
 	aiData:null,	//AI生成的数据
 	curSpaceId:null,	//当前选中的空间id
+	landDataId:null,	//土地id
+	cityCode:null,	//城市编码
+	houseName:null,	//项目名称
+	customizedRecordId:null,	//项目名称
+	ueId:null,	//ueId
 }
 export default state