package.json

@@ -38,6 +38,7 @@
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "amfe-flexible": "^2.2.1",
     "cross-env": "^7.0.3",
     "eslint": "^7.32.0",
     "eslint-plugin-vue": "^8.0.3",

public/index.html

@@ -14,5 +14,6 @@
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->
+	<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
   </body>
 </html>

src/App.vue

@@ -1,33 +1,35 @@
 <template>
 	<div id="app">
 		<!-- IOS机器会跳转两次到其他路由，当from路由被缓存时，原因未知 -->
-		<keep-alive include="webgl_rxdz" v-if="!isIOS">
-			<router-view></router-view>
+		<keep-alive >
+			<!-- <transition name="fade"> -->
+			<router-view v-if="$route.meta.keepAlive"></router-view>
+			<!-- </transition> -->
 		</keep-alive>
-		<router-view v-else></router-view>
-		<!-- <router-view v-if="$route.meta.keepAlive==false"></router-view> -->
+		<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="" />
 				<div class="loadingMsg">{{loadingMsg}}</div>
 			</div>
 		</div>
-		
+
 	</div>
 </template>
 
 <script>
 	import {
+		setStorage,
 		getStorage,
-		removeItem
+		pxoveItem
 	} from '@/utils/localStorage';
 	export default {
 		name: "App",
-		provide() {
-			return {
-				reload: this.reload,
-			};
-		},
+		// provide() {
+		// 	return {
+		// 		reload: this.reload,
+		// 	};
+		// },
 		data() {
 			return {
 				themeColor: "rgba(0,97,232,1)",
@@ -36,24 +38,35 @@
 				showAccountView: false, //是否显示用户账号列表
 				acountList: [], //弹出层账号列表数据
 				selectAccount: null, //选中的账号
-				isIOS:false,
+				isIOS: false,
+				include: []
 			};
 		},
 		created() {
-			let userId = this.$route.query.leavePhoneCustomerId?this.$route.query.leavePhoneCustomerId:'129130';
-			if(userId){//如果存在用户id
+			let userId = this.$route.query.leavePhoneCustomerId ? this.$route.query.leavePhoneCustomerId : '129130';
+			let xcxHouseId = this.$route.query.xcxHouseId ? this.$route.query.xcxHouseId : $config.xcxHouseId;
+			let query = this.$route.query;
+			// let xcxHouseId = '100296';
+			if (userId) { //如果存在用户id
 				this.$store.dispatch('setUserId', userId);
 			}
+			if (xcxHouseId) { //如果存在houseid
+				this.$store.dispatch('setHouseId', xcxHouseId);
+			}
+			if (query) { //如果存在入参
+				setStorage('queryObj', query);
+			}
 			let isIOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
 			this.isIOS = isIOS;
 			window.addEventListener('error', (error) => {
-			    // 区分是否是js错误
-			    if (error.message) {
-			      alert("error"+message)
-			    } else {
-			      alert('监测到E1004错误');
-			    }
+				// 区分是否是js错误
+				if (error.message) {
+					alert("error" + message)
+				} else {
+					alert('监测到E1004错误' + error);
+				}
 			}, true)
+
 			// window.onerror = function(message,source,line,column,error) {
 			// };
 		},
@@ -64,7 +77,8 @@
 						this.$store.state.loadingMsg = ''
 					}
 				}
-			}
+			},
+			
 		},
 		computed: {
 			loading() {
@@ -87,83 +101,7 @@
 			});
 		},
 		methods: {
-			reload() {
-				this.isRouterAlive = false;
-				this.$nextTick(function() {
-					this.isRouterAlive = true;
-				});
-			},
-			//账号获取
-			accountHandle(type = false) {
-				var acountList = getStorage('acountList') ? JSON.parse(getStorage('acountList')) : null;
-				console.warn("***acountList***", acountList);
-				if (acountList) {
-					if (acountList.length > 1) {
-						this.selectAccount = null;
-						this.acountList = acountList;
-						this.showAccountView = true;
-					} else {
-						this.showAccountView = false;
-						this.selectAccount = acountList[0];
-						removeItem('acountList'); //移除待选择列表的账号数据
-						if (type) { //页面加载时触发
-							setTimeout(() => { //等待其他组件创建好对应的事件监听
-								window.$bus.$emit("projectUpdate", this.$route.query.projectId, this
-								.selectAccount);
-								window.$bus.$emit("setAccount", this.selectAccount);
-							}, 5000);
-						} else { //页面出现时触发-非初次加载
-							window.$bus.$emit("projectUpdate", this.$route.query.projectId, this.selectAccount);
-							window.$bus.$emit("setAccount", this.selectAccount);
-						}
 
-					}
-				} else {
-					this.showAccountView = false;
-				}
-			},
-			closeFun() {
-				this.showAccountView = false;
-			},
-			//账号选择
-			accountChange(item) {
-				if (!item) {
-					return false;
-				}
-				this.selectAccount = item;
-			},
-			//确认账号选择
-			async accountConfirm() {
-				if (!this.selectAccount) {
-					this.$message.warning("请选择关联账号！");
-					return false;
-				}
-				// let userInfo = window.userInfo;
-				// userInfo['userAccount'] = this.selectAccount;
-				removeItem('acountList'); //选择好后，移除待选择列表的账号数据
-				this.showAccountView = false;
-				let res = await requestConfig('bindAdvertiser', {
-					"advertiserId": this.selectAccount.advertiserId,
-					"companyId": window.userCompanyModel.companyId,
-					"name": this.selectAccount.name,
-					"platform": this.selectAccount.platform || '',
-					"oauthType": this.getAuthType(),
-				}, false, false)
-				if (res.success) {
-					// this.$store.dispatch('setAccount',this.selectAccount);
-					window.$bus.$emit("projectUpdate", this.$route.query.projectId, this.selectAccount);
-					window.$bus.$emit("setAccount", this.selectAccount);
-					removeItem("OAUTHTYPE");
-				}
-			},
-			getAuthType() {
-				const oauthType = JSON.parse(window.localStorage.getItem('OAUTHTYPE')) || '';
-				if (oauthType) {
-					return oauthType.accountType
-				} else {
-					return "2" //默认是2
-				}
-			},
 		},
 	};
 </script>
@@ -182,13 +120,6 @@
 		background: #181C28;
 	}
 
-	.el-tooltip__popper.is-light {
-		backdrop-filter: blur(10.36rem) !important;
-		background-color: rgba(255, 255, 255, 0.4) !important;
-		border: none !important;
-		color: #ffffff !important;
-	}
-
 
 	.el-tooltip__popper .popper__arrow,
 	.el-tooltip__popper .popper__arrow::after {
@@ -206,57 +137,6 @@
 	.el-picker-panel__body .el-picker-panel__content .el-date-table th {
 		color: #FFFFFF;
 	}
-
-	.dropdown-view-menu {
-		font-size: 14px;
-		color: var(--themeColor9);
-		/* width: 336rem; */
-		box-sizing: border-box;
-		padding: 15rem !important;
-		margin-top: 3rem;
-		backdrop-filter: blur(60px);
-		border: none !important;
-		background-color: rgba(255, 255, 255, 0.15) !important;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-
-	.dropdown-view-menu .active {
-		color: #CEF7D1;
-	}
-
-	.dropdown-view-text {
-		font-family: "Verdana Bold";
-		font-weight: 700;
-		text-decoration: underline;
-		font-size: 14px;
-		color: #fff;
-	}
-
-	.select-julangview {
-		display: none;
-	}
-
-	.popper-class-qr {
-		padding: 0px !important;
-	}
-
-	.BMap_cpyCtrl {
-		display: none;
-	}
-
-	.anchorBL {
-		display: none;
-	}
-
-	.amap-logo img {
-		display: none;
-	}
-
-	.amap-copyright {
-		opacity: 0;
-	}
 </style>
 <style lang="scss" scoped>
 	@import "./assets/common.scss";

src/assets/common.css

@@ -13,7 +13,10 @@ body {
 div {
     box-sizing: border-box;
 }
-
+@font-face {
+	font-family: 'DINCondensed-Bold';
+	src: url('https://dm.static.elab-plus.com/miniprogram/DINAlternateBold.ttf') format('truetype');
+}
 .rows {
     display: flex;
     flex-direction: row;
@@ -89,548 +92,6 @@ div {
     z-index: 1000!important;
     cursor: pointer;
 }
-
-.project-content {
-    position: relative;
-    /* float: left; */
-    /* width: auto; */
-    width: 300rem;
-    padding: 15rem 20rem;
-    box-sizing: border-box;
-    /* background: linear-gradient(90deg,#000000 1%, rgba(0,0,0,0.00));
-	backdrop-filter: blur(30.24rem); */
-    padding-bottom: 4rem;
-    cursor: pointer;
-}
-
-.filter-view {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    ;
-    left: 0rem;
-    top: 0rem;
-    filter: blur(30rem);
-    background: linear-gradient(90deg, #000000 1%, rgba(0, 0, 0, 0.00));
-    border-radius: 12px;
-    backdrop-filter: blur(10.02px);
-    z-index: -1;
-}
-
-.project-head {
-    width: 40rem;
-    height: 40rem;
-    line-height: 40rem;
-    background: rgba(0, 0, 0, 0.00);
-    border: 1rem solid rgba(255, 255, 255, 0.33);
-    border-radius: 50%;
-    margin-right: 8rem;
-    font-size: 18px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #ffffff;
-    object-fit: cover;
-}
-
-.project-name {
-    height: 28rem;
-    line-height: 28rem;
-    font-size: 20px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: left;
-    color: #ffffff;
-}
-
-.project-address {
-    height: 17rem;
-    line-height: 17rem;
-    opacity: 0.5;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff;
-}
-
-.project-tips {
-    width: 40rem;
-    height: 22rem;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 4rem;
-    font-size: 14px;
-    font-family: FontName, FontName-Regular;
-    font-weight: 400;
-    text-align: center;
-    color: #ffffff;
-    line-height: 22rem;
-    font-style: italic;
-    margin-left: 10rem;
-}
-
-.project-area {
-    margin-top: 6rem;
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: left;
-    color: #ffffff;
-    overflow: hidden;
-}
-
-.project-footer {
-    position: relative;
-    width: 100%;
-    height: 10rem;
-    margin-top: 10rem;
-    overflow: hidden;
-}
-
-.project-footer-top {
-    width: 100%;
-    height: 4rem;
-    background: linear-gradient(90deg, var(--themeColor4) 1%, transparent);
-}
-
-.project-footer-left {
-    position: absolute;
-    top: 0rem;
-    border-width: 10rem;
-    border-top-color: transparent;
-    border-right-color: transparent;
-    border-bottom-color: transparent;
-    border-left-color: var(--themeColor4);
-    border-style: solid;
-    border-left-width: 5rem;
-    border-top-width: 0rem;
-}
-
-.polyon-content {
-    float: left;
-    width: auto;
-    font-size: 14px;
-    white-space: nowrap;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: var(--themeColor1);
-    text-shadow: 0rem 0rem #000000;
-}
-
-.competitionProjectHide {
-    display: none !important;
-}
-
-.competitionProjectShow {
-    display: flex;
-}
-
-.infoWindowUnSelected .project-head {
-    display: none;
-}
-
-.infoWindowUnSelected .project-name {
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-}
-
-.infoWindowSelected .project-tips,
-.infoWindowUnSelected .project-tips {
-    display: none;
-}
-
-.infoWindowHtml.infoWindowSelected {
-    z-index: 1001!important;
-}
-
-.infoWindowUnSelected .project-address {
-    display: none;
-}
-
-.infoWindowUnSelected .project-area {
-    height: 17rem;
-    line-height: 17rem;
-    opacity: 0.6;
-    font-size: 12px;
-    margin-top: 0rem;
-}
-
-.infoWindowUnSelected .project-footer {
-    margin-top: 8rem;
-}
-
-.competitionUnSelected .project-name {
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-}
-
-.competitionUnSelected .project-area {
-    display: none;
-}
-
-
-/* 项目竞品状态 */
-
-.competitionProject .project-name {
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-}
-
-.competitionProject .project-head,
-.competitionProject .project-area,
-.competitionProject .project-address {
-    display: none;
-}
-
-
-/* 圆柱样式 */
-
-.cricleColumn-view {
-    position: relative;
-    width: 90rem;
-    height: 152rem;
-    cursor: pointer;
-}
-
-.cricleColumn-img {
-    width: 90rem;
-    height: 152rem;
-}
-
-.cricleColumn-text {
-    position: absolute;
-    bottom: 0rem;
-    left: 0rem;
-    width: 100%;
-    height: 37rem;
-    font-size: 14px;
-    font-family: DIN Alternate, DIN Alternate-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #ffdf80;
-    line-height: 14rem;
-}
-
-.cricleColumn1-view {
-    position: relative;
-    width: 82rem;
-    height: 152rem;
-    cursor: pointer;
-}
-
-.cricleColumn1-img {
-    width: 82rem;
-    height: 152rem;
-}
-
-.cricleColumn2-view {
-    width: 60px;
-    height: 60px;
-}
-
-.cricleColumn2-img {
-    width: 100%;
-    height: 100%;
-}
-
-.cricleColumn1-text {
-    position: absolute;
-    bottom: 14rem;
-    left: 0rem;
-    width: 100%;
-    font-size: 14px;
-    font-family: DIN Alternate, DIN Alternate-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #fff;
-    line-height: 20rem;
-}
-
-.project-plate2{
-    display: flex;
-    flex-direction: column;
-    width: 40px;
-    height: 58px;
-    align-items: center;
-}
-
-
-.plate-point-icon2{
-    width: 10rem;
-    height: 10rem;
-    min-height: 10rem;
-    background: #FFDB89;
-    border-radius: 50%;
-    margin-top: 15rem;
-}
-
-.plate-point-name-img2{
-    width: 35px;
-    height: 35px;
-    border-radius: 50%;
-    transform: rotate(45deg);
-}
-
-.plate-point-name2{
-    background: #FFDB89;
-    width: 40px;
-    min-width: 40px;
-    height: 40px;
-    min-height: 40px;
-    border-top-left-radius: 50%;
-    border-top-right-radius: 50%;
-    border-bottom-right-radius: 50%;
-    border-bottom-left-radius: 3px;
-    transform: rotate(-45deg);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-.plate-point-name-txt2 {
-    font-size: 18px;
-    font-family: Verdana, Verdana-Bold;
-    text-align: center;
-    color: #ffffff;
-    transform: rotate(45deg);
-    overflow: hidden;
-    white-space: nowrap;
-    width: 40px;
-}
-
-.el-picker-panel__content .el-date-table td.disabled div{
-    background: transparent;
-}
-
-.el-date-table td.current:not(.disabled) span{
-    background-color: var(--themeColor1);
-}
-.el-date-table td.today span{
-    color: var(--themeColor1);
-}
-.el-date-table td:hover{
-    color: var(--themeColor1);
-}
-
-.project-plate {
-    display: flex;
-    flex-direction: row;
-    width: 265px;
-    height: 58px;
-    align-items: center;
-}
-
-.plate-point-icon {
-    width: 10rem;
-    height: 10rem;
-    background: #fede7f;
-    border-radius: 50%;
-    margin-left: 20rem;
-}
-
-.plate-point-name {
-    font-size: 16px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: left;
-    color: #ffffff;
-    margin-left: 10rem;
-    background: #181C28;
-    border-radius: 6rem;
-    padding: 6rem 10rem;
-}
-
-.plate-point-name-img {
-    width: 35px;
-    height: 35px;
-    border-radius: 50%;
-    transform: rotate(45deg);
-}
-
-.plate-point-name-txt {
-    font-size: 18px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #ffffff;
-    transform: rotate(45deg);
-    overflow: hidden;
-    white-space: nowrap;
-    width: 40px;
-}
-
-.cricleColumn2-text {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    width: 100%;
-    font-size: 12px;
-    font-family: DIN Alternate, DIN Alternate-Bold;
-    text-align: center;
-    color: #fff;
-}
-
-.poi-view {
-    position: relative;
-    width: max-content;
-    height: 30rem;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 15rem;
-    backdrop-filter: blur(30rem);
-    cursor: pointer;
-}
-
-.poi-view-radius {
-    width: 24rem;
-    height: 24rem;
-    line-height: 22rem;
-    background: rgba(118, 188, 255, 0.50);
-    border: 1px solid #76bcff;
-    border-radius: 50%;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: center;
-    color: #ffffff;
-    margin-left: 4rem;
-}
-
-.poi-view-text {
-    font-size: 14px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff;
-    margin-left: 5rem;
-    margin-right: 10rem;
-}
-
-.poi-point {
-    border-radius: 50%;
-    width: 10rem;
-    height: 10rem;
-    background: #ffad5c;
-    border: 1rem solid #fff;
-}
-
-.poi-view-poi {
-    position: relative;
-    width: max-content;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 5rem;
-    backdrop-filter: blur(30rem);
-    cursor: pointer;
-    padding: 10rem;
-    display: flex;
-    align-items: center;
-}
-
-.poi-view-poi-num {
-    width: 24rem;
-    min-width: 24rem;
-    height: 24rem;
-    background: var(--themeColor2_2);
-    border: 1px solid var(--themeColor2);
-    font-size: 12px;
-    text-align: center;
-    color: #fff;
-    line-height: 24rem;
-    border-radius: 50%;
-    margin-right: 10rem;
-}
-
-.poi-view-info {
-    font-size: 14px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff;
-    margin-left: 5rem;
-    margin-right: 10rem;
-}
-
-.poi_sanjiao {
-    position: absolute;
-    bottom: -12rem;
-    width: 0rem;
-    height: 0;
-    border: 6rem solid;
-    border-color: rgba(255, 255, 255, 0.2) transparent transparent;
-    left: calc((100% - 12rem) / 2);
-
-}
-
-.poiUnSelected .poi-view {
-    background: unset;
-    backdrop-filter: unset;
-}
-
-.poiUnSelected .poi-view-text {
-    opacity: 0;
-}
-
-.trafficPoint-view {
-    width: 24rem;
-    height: 24rem;
-    background: rgba(255, 255, 255, 0.00);
-    border: 1px solid var(--themeColor2);
-    border-radius: 50%;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    color: var(--themeColor2);
-    text-align: center;
-    line-height: 24rem;
-}
-
-
-/* 预览视图里面的拖拽样式 */
-
-.custom-content-marker {
-    position: relative;
-    width: 206px;
-    height: 206px;
-    /*border-radius: 50%;*/
-    /*border: var(--themeColor3) solid 1px;*/
-    /*background: var(--themeColor3_2);*/
-    box-sizing: border-box;
-}
-
-.custom-content-img {
-    width: 32px;
-    height: 32px;
-}
-
-.project-view {
-    position: absolute;
-    right: 0rem;
-    top: 0rem;
-    width: 690rem;
-    height: calc(100% - 50rem);
-    padding: 20rem 20rem 20rem 0;
-    transition: 0.3s;
-    transform: translateX(0rem);
-    z-index: 11 !important;
-}
-
-.project-view-content {
-    min-height: 240rem;
-    position: relative;
-    width: 100%;
-    height: calc(100% - 100rem);
-    border-radius: 10rem;
-    padding: 20rem;
-    backdrop-filter: blur(10.36rem);
-    color: azure;
-    margin-top: 10rem;
-}
-
 .project-view-content-scroll {
     overflow: auto;
 }
@@ -704,129 +165,6 @@ div {
     border: none;
     color: #fff;
 }
-
-.time-select-item {
-    color: #fff;
-    text-align: center;
-}
-
-.time-select-item:hover {
-    background-color: rgba(255, 255, 255, 0.1) !important;
-}
-
-.time-select-item.selected {
-    color: var(--themeColor1) !important;
-    font-weight: 700;
-}
-.amap-ui-pointsimplifier-container .overlay-title{
-    width: max-content;
-    background-color: rgba(255, 255, 255, 0.2) !important;
-    border-radius: 5rem !important;
-    backdrop-filter: blur(30rem);
-    border:none !important;
-    font-size: 14px !important;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff !important;
-    padding: 10rem !important;
- }
-.amap-ui-pointsimplifier-container .overlay-title.top:after{
-    border-top-color:rgba(255, 255, 255, 0) !important;
-
-
-}
-.amap-ui-pointsimplifier-container .overlay-title.top:before{
-    border-top-color:rgba(255, 255, 255, 0.2) !important;
-
-}
-.amap-ui-pointsimplifier-container .overlay-title.top {
-    transform: translate(-50%,-115%) !important;
-}
-
-.popper-class-11{
-    /*background-color: rgb(121, 121, 121);*/
-    background-color:rgba(255,255,255,0.2);
-    border: none;
-    color:rgba(255,255,255,0.9);
-    backdrop-filter: blur(12px);
-    min-width: auto;
-}
-
-.popper-class-12{
-    /*background-color: rgb(121, 121, 121);*/
-    background-color:rgba(255,255,255,0.4);
-    border: none;
-    color:rgba(255,255,255,0.8);
-    backdrop-filter: blur(30px);
-
-}
-
-.popper-class-12.el-popper .popper__arrow,.popper-class-11.el-popper .popper__arrow {
-    display: block !important;
-    border-top-color: rgba(255,255,255,0.41)
-}
-
-.popper-class-12 .popper__arrow::after {
-    bottom: 1px;
-    margin-left: -6px;
-    border-top-color: rgba(87, 87, 87, 0.41) !important;
-    border-bottom-width: 0;
-}
-
-.popper-class-11 .popper__arrow::after {
-    bottom: 1px;
-    margin-left: -6px;
-    border-top-color: rgba(87, 87, 87, 0.41) !important;
-    border-bottom-width: 0;
-}
-
-.popper-class-12 .el-input__inner,.popper-class-12 .el-input__inner,
-.popper-class-11 .el-input__inner,.popper-class-11 .el-input__inner{
-    background-color: transparent;
-    border: 1px solid rgba(255,255,255,0.3);
-    color: rgba(255,255,255,0.8);
-    height: 32px;
-    line-height: 32px;
-    padding-left: 20px;
-    padding-right: 35px;
-}
-
-.popper-class-11 .el-input__prefix,.popper-class-11 .el-input__suffix{
-    top: 9px;
-}
-
-.theme1 .el-radio__input.is-checked .el-radio__inner {
-    border-color: var(--themeColor11);
-    background: transparent;
-}
-.theme1 .el-radio__inner::after {
-    width: 8px;
-    height: 8px;
-    background-color: var(--themeColor11);
-}
-.theme1 .el-radio__inner:hover {
-    border-color: var(--themeColor11);
-}
-.theme1 .el-radio__inner {
-    border: 1px solid #cbc0c0;
-    border-radius: 100%;
-    width: 14px;
-    height: 14px;
-    background-color: transparent;
-    cursor: pointer;
-    box-sizing: border-box;
-}
-.theme1 .el-radio__input.is-checked+.el-radio__label {
-    color: rgba(255,255,255,0.7);
-}
-.theme1 .el-radio{
-    font-family: "Verdana";
-    font-weight: 400;
-    font-size: 14px;
-    text-align: left;
-    color: rgba(255,255,255,0.7);
-}
 .el-input__inner:focus.el-focus{
     border-color: var(--themeColor11);
 }
@@ -885,3 +223,13 @@ div {
    font-size: 13px;
     padding: 0 15px;
 }
+.el-button:focus, .el-button:hover{
+	color: unset;
+	border-color: unset;
+	background-color: unset;
+	/* background-image: linear-gradient(124deg, rgba(245, 201, 82, 0.4) 0%, rgba(239, 149, 57, 0.4) 100%); */
+}
+.el-button--primary{
+	background-color: #FD9429;
+	border-color: #F5C952;
+}

src/assets/common.scss

@@ -8,8 +8,8 @@
 }
 
 .loadData{
-    min-width:110px;
-    height:110px;
+    min-width:200px;
+    height:150px;
     position: absolute;
     left: 50%;
     top:50%;
@@ -30,96 +30,9 @@
         color: rgba(255, 255, 255, 0.83);
         margin: 10px;
 		margin-top: 0px;
+		font-size: 18px;
     }
 }
-.account-view{
-	width: 500rem;
-	// height: 362rem;
-	padding:30rem 40rem;
-	box-sizing:border-box;
-	background-color: rgba(255, 255, 255, 0.9);
-	border-radius: 20rem;
-	// backdrop-filter: blur(30px);
-	.title-icon{
-		width:18rem;
-		margin-right:10rem;
-	}
-	.close{
-		.close-img{
-			font-size: 16rem;
-			font-weight: bold;
-			color:#000;
-			cursor: pointer;
-		}
-	}
-	.content{
-		width: 100%;
-		color: #0b0b0b;
-		font-size: 14rem;
-		.content-main-view{
-			height: 250rem;
-			border-radius: 6rem;
-			background: #fff;
-			box-sizing:border-box;
-			padding: 18rem;
-			overflow: auto;
-			.selcect-view{
-				position: relative;
-				width: 16rem;
-				height: 16rem;
-				border-radius: 100%;
-				background: transparent;
-				border: 1rem solid #ef863f;
-				box-sizing:border-box;
-			}
-			.selcect-view::after{
-				content: '';
-				position: absolute;
-				top: 50%;
-				left: 50%;
-				transform: translate(-50%,-50%);
-				width: 10rem;
-				height: 10rem;
-				border-radius: 100%;
-				background: #ef863f;
-				box-sizing:border-box;
-			}
-			.unselcect-view{
-				width: 16rem;
-				height: 16rem;
-				border-radius: 8rem;
-				background: rgba(249, 249, 249, 0.2);
-				border: 1rem solid rgba(0, 0, 0, 0.2);
-			}
-			.gougou-icon{
-				color: #EF863F;
-			}
-		}
-	}
-	.auth-btn-view{
-		.auth-btn{
-			width: 120rem;
-			height: 40rem;
-			border-radius: 10rem;
-			cursor: pointer;
-		}
-		.style1{
-			font-family: "Verdana Bold";
-			font-weight: 700;
-			font-size: 14rem;
-			color: #151515;
-			background: #d5d5d5;
-		}
-		.style2{
-			font-family: "Verdana Bold";
-			font-weight: 700;
-			font-size: 14rem;
-			color: #fff;
-			background: #ef863f;
-			box-shadow: 0 12px 24px rgba(239, 134, 63, 0.2);
-		}
-	}
-}
 .overflow{
     overflow: hidden;
     text-overflow:ellipsis;
@@ -145,7 +58,6 @@ body,html{
     padding: 0;
     position: relative;
     background-color: #f4f4f4;
-    // font-size: 13px;
 }
 #app{
     width:100%;

src/assets/css/common.css

@@ -67,245 +67,4 @@ body{
 	background: linear-gradient(90deg,#000000 1%, rgba(0,0,0,0.00));
 	z-index: -1;
 }
-.project-head{
-	width: 40rem;
-	height: 40rem;
-    line-height: 40rem;
-	background: rgba(0,0,0,0.00);
-	border: 1rem solid rgba(255,255,255,0.33);
-	border-radius: 50%;
-	margin-right: 8rem;
-    font-size: 18px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: #ffffff;
-    object-fit: cover;
-}
-.project-name{
-	height: 28rem;
-	line-height: 28rem;
-	font-size: 20px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: left;
-	color: #ffffff;
-}
-.project-address{
-	height: 17rem;
-	line-height: 17rem;
-	opacity: 0.5;
-	font-size: 12px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 400;
-	text-align: left;
-	color: #ffffff;
-}
-.project-tips{
-	width: 40rem;
-	height: 22rem;
-	background: rgba(255,255,255,0.2);
-	border-radius: 4rem;
-	font-size: 14px;
-	font-family: FontName, FontName-Regular;
-	font-weight: 400;
-	text-align: center;
-	color: #ffffff;
-	line-height: 22rem;
-	font-style: italic;
-	margin-left: 10rem;
-}
-.project-area{
-	margin-top: 6rem;
-	height: 20rem;
-	line-height: 20rem;
-	font-size: 14px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: left;
-	color: #ffffff;
-    overflow: hidden;
-}
-.project-footer{
-	position: relative;
-	width: 100%;
-	height: 10rem;
-	margin-top: 10rem;
-    overflow: hidden;
-}
-.project-footer-top{
-	width: 100%;
-	height: 4rem;
-	background: linear-gradient(90deg,var(--themeColor4) 1%, transparent);
-}
-.project-footer-left{
-	position: absolute;
-	top: 0rem;
-	border-width:10rem;
-	border-top-color: transparent;
-	border-right-color: transparent;
-	border-bottom-color: transparent;
-	border-left-color: var(--themeColor4);
-	border-style:solid;
-	border-left-width: 5rem;
-	border-top-width: 0rem;
-}
-.polyon-content{
-	float: left;
-	width: auto;
-	font-size: 14px;
-    white-space: nowrap;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: var(--themeColor1);
-	text-shadow: 0rem 0rem #000000;
-}
-.infoWindowUnSelected .project-head{
-	display: none;
-}
-.infoWindowUnSelected .project-name{
-    height: 20rem;
-	line-height: 20rem;
-    font-size: 14px;
-}
-.infoWindowSelected .project-tips,.infoWindowUnSelected .project-tips{
-	display: none;
-}
-.infoWindowHtml.infoWindowSelected{
-    z-index: 1001!important;
-}
-.infoWindowUnSelected .project-address{
-	display: none;
-}
-.infoWindowUnSelected .project-area{
-    height: 17rem;
-	line-height: 17rem;
-    opacity: 0.6;
-    font-size: 12px;
-	margin-top: 0rem;
-}
-.infoWindowUnSelected .project-footer{
-	margin-top: 8rem;
-}
-.competitionUnSelected .project-name{
-    height: 20rem;
-	line-height: 20rem;
-    font-size: 14px;
-}
-.competitionUnSelected .project-area{
-    display: none;
-}
-/* 项目竞品状态 */
-.competitionProject .project-name{
-    height: 20rem;
-	line-height: 20rem;
-    font-size: 14px;
-}
-.competitionProject .project-head,.competitionProject .project-area,.competitionProject .project-address{
-	display: none;
-}
-/* 圆柱样式 */
-.cricleColumn-view{
-	position: relative;
-	width: 90rem;
-	height: 152rem;
-    cursor: pointer;
-}
-.cricleColumn-img{
-	width: 90rem;
-	height: 152rem;
-}
-.cricleColumn-text{
-	position: absolute;
-	bottom: 0rem;
-	left: 0rem;
-	width: 100%;
-	height: 37rem;
-	font-size: 14px;
-	font-family: DIN Alternate, DIN Alternate-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: #ffdf80;
-	line-height: 14rem;
-}
-.cricleColumn1-view{
-	position: relative;
-	width: 82rem;
-	height: 152rem;
-    cursor: pointer;
-}
-.cricleColumn1-img{
-	width: 82rem;
-	height: 152rem;
-}
-.cricleColumn1-text{
-	position: absolute;
-	bottom: 14rem;
-	left: 0rem;
-	width: 100%;
-	font-size: 14px;
-	font-family: DIN Alternate, DIN Alternate-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: #fff;
-	line-height: 20rem;
-}
-
-.poi-view{
-	position: relative;
-	width: max-content;
-	height: 30rem;
-	background: rgba(255,255,255,0.2);
-	border-radius: 15rem;
-	backdrop-filter: blur(30rem);
-    cursor: pointer;
-}
-.poi-view-radius{
-	width: 24rem;
-	height: 24rem;
-	line-height: 22rem;
-	background: rgba(118,188,255,0.50);
-	border: 1px solid #76bcff;
-	border-radius: 50%;
-	font-size: 12px;
-	font-family: Verdana, Verdana-Regular;
-	font-weight: 400;
-	text-align: center;
-	color: #ffffff;
-	margin-left: 4rem;
-}
-.poi-view-text{
-	font-size: 14px;
-	font-family: Verdana, Verdana-Regular;
-	font-weight: 400;
-	text-align: left;
-	color: #ffffff;
-	margin-left: 5rem;
-	margin-right: 10rem;
-}
-.poiUnSelected .poi-view{
-	background:unset;
-	backdrop-filter:unset;
-}
-.poiUnSelected .poi-view-text{
-	opacity: 0;
-}
-.trafficPoint-view{
-    width: 24rem;
-    height: 24rem;
-    background: rgba(255,255,255,0.00);
-    border: 1px solid var(--themeColor2);
-    border-radius: 50%;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    color: var(--themeColor2);
-    text-align: center;
-    line-height: 24rem;
-}
-
-.auto-height{
-	height: auto;
-}
 

src/assets/css/style.css

@@ -1,135 +1,3 @@
 div{
 	box-sizing: border-box;
 }
-.project-view{
-	position: absolute;
-	right: 0rem;
-	top: 0rem;
-	width: 690rem;
-	height: calc(100% - 50rem);
-	padding: 20rem 20rem 20rem 0;
-    transition: 0.3s;
-    transform: translateX(0rem);
-    z-index: 11 !important;
-}
-.project-view-content{
-    min-height: 240rem;
-	position: relative;
-	width: 100%;
-    height: calc(100% - 100rem);
-	border-radius: 10rem;
-	padding: 20rem;
-	backdrop-filter: blur(10.36rem);
-	color: azure;
-    margin-top: 20rem;
-}
-.project-view-content-scroll{
-    overflow:auto;
-}
-.competition-top{
-	color: #cccccc;
-}
-.competition-top-btnlist{
-	border-radius: 8rem;
-	border: #7FFFD4 1rem solid;
-	height: 30rem;
-	line-height: 30rem;
-	overflow: hidden;
-}
-.btn-item{
-	font-size: 13px;
-	padding: 0rem 10rem;
-	background-color: transparent;
-}
-.btn-item.active{
-	background-color: rgb(188,223,139);
-	color: white;
-}
-.competition-info{
-	margin-top: 60rem;
-}
-.info-item-text{
-	font-size: 24px;
-	color: rgb(188,223,139);
-}
-.chart-view{
-	position: relative;
-	margin-top: 20rem;
-	width: 100%;
-	height: 300rem;
-}
-.chart{
-	/* width: 100%; */
-	/* height: 100%; */
-    width: 570rem;
-    height: 300rem;
-}
-.change-echarts{
-	position: absolute;
-	right: 0rem;
-	top: 0rem;
-	height: 20rem;
-	line-height: 20rem;
-}
-.echarts-item{
-	position: relative;
-	color: #F0FFFF;
-	font-size: 12px;
-	margin-right: 20rem;
-	cursor: pointer;
-}
-
-.foot-view{
-    position: absolute;
-	bottom: 0rem;
-	width: 1400rem;
-	height: 40rem;
-    margin: 10rem 20rem;
-}
-
-.view-bg{
-	border-radius: 20rem;
-	padding: 20rem;;
-	box-shadow: 0rem 4rem 16rem 0rem rgba(255,177,136,0.30);
-	backdrop-filter: blur(10.36rem);
-	color: azure;
-}
-
-.point-circle{
-    width: 240rem;
-    height: 240rem;
-    border-radius: 50%;
-    background-color: #ffaa5199;
-    border: 1rem solid #ff7151;
-    align-items: center;
-    justify-content: center;
-}
-
-.point-img{
-    width:60rem;
-    height: 60rem;
-}
-.menceng{
-    position: absolute;
-    top:0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-}
-
-.pointer{
-    cursor:pointer
-}
-.custom-content-marker{
-	position: relative;
-	width: 206px;
-	height: 206px;
-	/*border-radius: 50%;*/
-	/*border: var(--themeColor3) solid 1px;*/
-	/*background: var(--themeColor3_2);*/
-	box-sizing: border-box;
-}
-.custom-content-img{
-	width: 32px;
-	height: 32px;
-}

src/assets/font/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 2438458 */
-  src: url('iconfont.woff2?t=1678862353261') format('woff2'),
-       url('iconfont.woff?t=1678862353261') format('woff'),
-       url('iconfont.ttf?t=1678862353261') format('truetype');
+  src: url('iconfont.woff2?t=1697521332858') format('woff2'),
+       url('iconfont.woff?t=1697521332858') format('woff'),
+       url('iconfont.ttf?t=1697521332858') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,58 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-a-lujing35039:before {
+  content: "\e702";
+}
+
+.icon-huxingjianshang:before {
+  content: "\e701";
+}
+
+.icon-shouzhongfenxi:before {
+  content: "\e6fd";
+}
+
+.icon-xiansuofenxi:before {
+  content: "\e6fe";
+}
+
+.icon-ladiyefenxi:before {
+  content: "\e6ff";
+}
+
+.icon-toushoufenxi:before {
+  content: "\e700";
+}
+
+.icon-baocun:before {
+  content: "\e6fc";
+}
+
+.icon-xiansuo:before {
+  content: "\e6fb";
+}
+
+.icon-xia:before {
+  content: "\e6f8";
+}
+
+.icon-shang:before {
+  content: "\e6f9";
+}
+
+.icon-wu:before {
+  content: "\e6fa";
+}
+
+.icon-xiayibu:before {
+  content: "\e6f6";
+}
+
+.icon-shangyibu:before {
+  content: "\e6f7";
+}
+
 .icon-wenhao1:before {
   content: "\e6f5";
 }

src/components/mynavbar/mynavbar.scss

@@ -21,7 +21,7 @@
 .nav-title {
   position: absolute;
   text-align: center;
-  max-width: 400rem;
+  max-width: 400px;
   /* overflow: hidden; */
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -31,15 +31,15 @@
   bottom: 0;
   margin: auto;
   color: #fff;
-  font-size: 32rem;
+  font-size: 32px;
   font-weight: bold;
 }
 .nav-capsule {
   position: absolute;
   display: flex;
   align-items: center;
-  /*margin-left: 30rem;*/
-  width: 180rem;
+  /*margin-left: 30px;*/
+  width: 180px;
   justify-content: space-between;
   height: 100%;
   z-index: 4;
@@ -61,12 +61,12 @@
   /*background-color: #2ab4ff;*/
 }
 .back-pre {
-  width: 24rem;
-  height: 24rem;
-  border-top: 4rem solid #fff;
-  border-left: 4rem solid #fff;
+  width: 24px;
+  height: 24px;
+  border-top: 4px solid #fff;
+  border-left: 4px solid #fff;
   transform: rotate(-45deg);
-  margin-left: 30rem;
+  margin-left: 30px;
 }
 .nav-padding {
   width: 100%;
@@ -74,8 +74,8 @@
   position: relative;
 }
 .icon_xiala{
-  width: 16rem;
-  height: 10rem;
+  width: 16px;
+  height: 10px;
   position: absolute;
   right: 0px;
   top: 50%;
@@ -83,22 +83,22 @@
 }
 .icon-gengduo1{
     transform: rotate(90deg);
-    font-size: 20rem;
+    font-size: 20px;
     color: #fff;
     display: inline-block;
 }
 .icon-weizhibai1{
-    font-size: 26rem;
+    font-size: 26px;
 }
 .noticeBtnContainer{
   position: absolute;
-  left: 70rem;
+  left: 70px;
 }
 .noticeBtn{
-  width: 140rem;
-  height:60rem;
+  width: 140px;
+  height:60px;
   background:rgba(255,255,255,0.3);
-  border-radius:30rem;
+  border-radius:30px;
 }
 .justContentCenter{
   display:flex;
@@ -108,59 +108,59 @@
 }
 .adver-name{
 	font-weight: 400;
-	font-size: 30rem;
+	font-size: 30px;
 	text-align: center;
 	color: #212121;
 }
 .adver-head{
-	font-size: 0rem;
-	margin-right: 20rem;
+	font-size: 0px;
+	margin-right: 20px;
 	position: relative;
 }
 .head-img{
-	width: 50rem;
-	height: 50rem;
+	width: 50px;
+	height: 50px;
 	border-radius: 50%;
 }
 .adver-online{
 	position: absolute;
-	width: 32rem;
-	height: 32rem;
-	right: -5rem;
-	bottom: -2rem;
+	width: 32px;
+	height: 32px;
+	right: -5px;
+	bottom: -2px;
 	box-sizing: border-box;
 	background: #75cf4a;
-	border: 4rem solid #fff;
+	border: 4px solid #fff;
 	border-radius: 50%;
 }
 .adver-tag{
-	width: 120rem;
-	height: 36rem;
-	border-radius: 18rem;
+	width: 120px;
+	height: 36px;
+	border-radius: 18px;
 	background: #3e87f7;
 	font-weight: 600;
-	font-size: 22rem;
+	font-size: 22px;
 	color: #fff;
 	box-sizing: border-box;
-	margin-left: 20rem;
+	margin-left: 20px;
 	justify-content: center;
 }
 .adver-status{
 	font-weight: 400;
-	font-size: 28rem;
-	letter-spacing: 0.08rem;
+	font-size: 28px;
+	letter-spacing: 0.08px;
 	text-align: left;
 	color: rgba(0, 0, 0, 0.3);
-	line-height: 28rem;
+	line-height: 28px;
 }
 
 
 /* 朋友页面头部样式 */
 .friend-tab{
-  width: 750rem;
+  width: 750px;
   height: 100%;
   text-align: center;
-  border-bottom: 1rem solid #ededed;
+  border-bottom: 1px solid #ededed;
   box-sizing: border-box;
 }
 .tab-area{
@@ -168,14 +168,14 @@
   align-items: center;
   justify-content: space-between;
   background: transparent;
-  width: 300rem;
+  width: 300px;
   height: 100%;
   margin: auto;
 }
 .tab-item{
   position: relative;
   font-family: "Verdana";
-  font-size: 30rem;
+  font-size: 30px;
   color: rgba(22, 23, 34,0.5);
   height: 100%;
   display: flex;
@@ -192,7 +192,7 @@
   bottom: 0;
   content: ' ';
   width: 100%;
-  height: 4rem;
+  height: 4px;
   background-color: #161722;
   left: 0;
 }

src/components/newBottomCom/viewCareful/viewCareful.html

@@ -2,28 +2,28 @@
 <div class="careful-view">
 	<!-- 精细调整区域 -->
 	<div class="scroll-view">
-		<div class="careful-list">
-			<div class="careful-item rows rows-between" v-for="(carefulItem,index) in carefulList" :key="carefulItem.spaceId">
-				<div class="columns rows-between" style="width: 570rem;">
-					<div class="item-top rows rows-between">
+		<div class="careful-list grid">
+			<div class="careful-item" v-for="(carefulItem,index) in carefulList" :key="carefulItem.spaceId">
+				<div class="columns rows-between" >
+					<div class="item-top rows rows-between" :class="{active:selectIndex==index}">
 						<div class="rows">
 							<div class="index-view rows justify-center">{{carefulItem.index+1}}</div>
-							<div class="name-view">{{carefulItem.name}}</div>
+							<div class="name-view eslipe" >{{carefulItem.name}}</div>
+							<div class="percent-view">{{carefulItem.percent}}%</div>
 						</div>
 						<div class="rows">
 							<div class="area-view">{{carefulItem.area}}㎡</div>
-							<div class="percent-view">{{carefulItem.percent}}%</div>
 						</div>
 					</div>
-					<div class="item-slider">
-						<el-slider style="margin:20rem 16rem" :disabled="overChange" v-model="carefulItem.area"
+					<div class="item-slider" :class="{active:selectIndex==index}">
+						<el-slider class="slider-style" :disabled="overChange" v-model="carefulItem.area"
 							@change="sliderChange($event,index)" :step="0.1" :show-tooltip="false"
 							:min='carefulItem.minArea' :max='carefulItem.maxArea' ></el-slider>
 					</div>
 				</div>
-				<div class="ai-btn rows justify-center" @click="goRoam(carefulItem.spaceId)">
+				<!-- <div class="ai-btn rows justify-center" @click="goRoam()">
 					美家
-				</div>
+				</div> -->
 			</div>
 			
 		</div>

src/components/newBottomCom/viewCareful/viewCareful.scss

@@ -4,67 +4,91 @@
 	box-sizing: border-box;
 	z-index: 12;
 }
+.grid{
+	display: grid;
+	grid-template-columns: repeat(2, 1fr);;
+	grid-row-gap: 20px;
+	grid-column-gap:50px;
+}
 .careful-list{
 	width: 100%;
-	max-height:600rem;
-	margin-top:30rem;
+	max-height:584px;
 }
 .item-top{
 	width: 100%;
 }
 .scroll-view{
 	overflow-y: auto;
+	margin-top:30px;
 }
-.careful-item .item-top .index-view{
-	width: 40rem;
-	height: 40rem;
-	background: #f0f0f0;
-	border-radius:20rem;
-	margin-right:10rem;
-	font-family: "DIN Alternate Bold";
-	font-weight: 700;
-	font-size: 28rem;
-	color: #585858;
-}
-.item-slider{
-	width: 100%;
-}
-.name-view{
+.careful-item .item-top {
 	font-family: "Verdana Bold";
 	font-weight: 700;
-	font-size: 28rem;
+	font-size: 28px;
 	color: #585858;
+	.index-view{
+		// font-family: "DINCondensed-Bold";
+		font-family: "Verdana";
+		margin-right:10px;
+	}
+	.name-view{
+		max-width:150px;
+		margin-right:15px;
+	}
+	.percent-view{
+		font-family: "DINCondensed-Bold";
+		opacity: 0.3;
+		font-size:24px;
+	}
+	
+	.area-view{
+		font-family: "DINCondensed-Bold";
+		font-weight: 700;
+		color: #8D8D8D;
+		font-size:26px;
+	}
 }
-.area-view{
-	font-family: "DIN Alternate Bold";
-	font-weight: 700;
-	font-size: 28rem;
-	color: #e89848;
-	margin-right:50rem;
+.item-top.active {
+	color: #ff9f40;
+	.area-view{
+		color: #f5891c;
+	}
 }
-.percent-view{
-	font-family: "DIN Alternate Bold";
-	font-weight: 700;
-	font-size: 28rem;
-	color: #333;
+
+.item-slider{
+	width: 100%;
+	.slider-style{
+		margin:20px 16px
+	}
 }
 .ai-btn{
-	width: 80rem;
-	height: 84rem;
-	border-radius: 8rem;
+	width: 80px;
+	height: 84px;
+	border-radius: 8px;
 	background-image:linear-gradient(124deg, rgba(245, 201, 82, 0.2) 0%, rgba(239, 149, 57, 0.2) 100%);
 	font-weight: 400;
-	font-size: 24rem;
+	font-size: 24px;
 	color: #f59d40;
 }
+
 /deep/ .el-slider__runway{
 	.el-slider__bar{
-		background-color: #FFAD5C;
+		background-color: #A3A3A3;
 	}
 	.el-slider__button{
-		background: #FF9B0A;
-		border: 2px solid #fff;
+		background: #A5A5A5;
+		border: 4px solid #fff;
+	}
+}
+.active{
+	/deep/ .el-slider__runway{
+		.el-slider__bar{
+			background-color: #FFAD5C;
+		}
+		.el-slider__button{
+			background: #FF9B0A;
+			border: 4px solid #fff;
+		}
 	}
 }
-
       

src/components/newBottomCom/viewCareful/viewCareful.vue

@@ -16,6 +16,7 @@
 				selectItem:null,
 				carefulList:[],
 				lastCareList:[],//上一次的滑块值
+				selectIndex:0,
 			}
 		},
 		props:{
@@ -40,6 +41,7 @@
 						}
 					}
 				},
+				deep:true,
 			},
 		},
 		mixins: [],
@@ -118,13 +120,11 @@
 				let item = this.lastCareList[index];
 				console.log("滑块值：", value,item);
 				if(this.overChange){
-					uni.showToast({
-						title: '请慢一点!',
-						icon: 'none',
-						duration: 2000
-					})
+					this.$message.warning("请慢一点!");
 					return false;
 				}
+				this.selectIndex = index;
+				this.$parent.$parent.selectSpaceId = item.spaceId;
 				let _area = value - parseFloat(item.area);
 				if(_area==0){
 					return false;
@@ -161,12 +161,14 @@
 				this.$parent.$parent.callBackFun = this.callBack;//向父页面注册通知回调函数
 				this.$emit("curSpaceChange",data);//通知父组件-空间面积变化
 			},
-			goRoam(spaceId){
-				// var currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
-				this.$parent.$parent.goRoam1(spaceId);
+			//去往详情页面
+			goRoam(){
+				let item = this.lastCareList[this.selectIndex];
+				this.$parent.$parent.goRoam1(item.spaceId);
 			},
 			callBack(type){
 				console.warn("***callBack***",type)
+				this.initData();
 				this.$parent.$parent.callBackFun = null;//注销父页面的通知回调函数
 			}
 		}

src/components/newBottomCom/viewMask/viewMask.html

@@ -1,11 +1,18 @@
 <!-- 覆盖层操作视图 -->
-<div class="mask-view" @touchmove.stop.prevent="catchTapEvent" @click.stop="catchTapEvent">
+<div class="mask-view" @touchmove.stop="catchTapEvent" @click.stop="catchTapEvent">
 	<!-- AI图片-轮播图 -->
 	<el-carousel v-if="aiImagesList && aiImagesList.length>0" v-show="showAIImage" class="swiper" 
 	:autoplay="false" :loop="false" ref="carousel"
 	 @change="swiperChangeImg" :initial-index="currentIndex" :indicator-dots="false">
 		<el-carousel-item v-for="(item,index1) in aiImagesList" :key="index1">
-			<img @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend" style="width:100%;height:100%;" mode="aspectFill" :src="item.image"></image>
+			<!-- <img @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend" style="width:100%;height:100%;object-fit: cover;" mode="aspectFill" :src="item.image"></image> -->
+			<el-image 
+				@touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend"
+			    style="width:100%;height:100%;cursor:none;"
+			    :src="item.image"
+				fit='cover'
+			    :preview-src-list="item.list">
+			  </el-image>
 		</el-carousel-item>
 	</el-carousel>
 	<div class="indicator-view rows" v-if="aiImagesList && aiImagesList.length>1 && showAIImage">
@@ -15,58 +22,79 @@
 		<img class="loading_img"
 			src="https://dm.static2.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_Img.png"
 			mode="aspectFit"></image>
-		<!-- <img class="loading_text"
-			src="https://dm.static2.elab-plus.com/aiBeauty/aiBeauty3/icon_loading_text.png"
-			mode="heightFix"></image> -->
 			自动生成更多图片中{{random+'%'}}...
 	</div>
-	<!-- 切换视角 -->
-	<div class="change-angle columns" @click.stop="switchActor" v-if="aiImagesList && aiImagesList.length>0">
-		<img class="camera" src="https://dm.static.elab-plus.com/miniProgram/iconfont/camera.png" mode="widthFix"/>
-		视角切换
+	<div class="btn-view columns" v-if="showAIImage==false">
+		<!-- 切换视图-退出当前模式 -->
+		<div class="compareBtn btn1" @click.stop="showOrHideWebGl" v-if="aiImagesList && aiImagesList.length>0">
+			<img class="compareIcon" src="https://dm.static.elab-plus.com/miniProgram/space1/compareAI_btn.png" mode="widthFix" />
+		</div>
+		<!-- 切换视角 -->
+		<div class="change-angle columns" @click.stop="switchActor" >
+			<img class="camera" src="https://dm.static.elab-plus.com/miniProgram/iconfont/camera.png" mode="widthFix"/>
+			视角切换
+		</div>
 	</div>
-	<!-- 右侧按钮 -->
-	<div class="btn-view columns" v-if="aiImagesList && aiImagesList.length>0">
+	
+	<!-- 左侧按钮  -->
+	<div class="btn-view columns" v-else-if="aiImagesList && aiImagesList.length>0">
 		<!-- 下载 -->
 		<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="compareBtn" @click.stop="showOrHideWebGl">
+		<div class="compareBtn btn1" @click.stop="showOrHideWebGl">
 			<img class="compareIcon" src="https://dm.static.elab-plus.com/miniProgram/space1/compareAI_btn.png" mode="widthFix" />
 		</div>
+		<!-- 点赞喜欢 -->
+		<div class="likeBtn columns" @click.stop="changeAIImg" :class="{like:checked}">
+			<div class="iconfont icon-qeuren"></div>
+			喜欢
+		</div>
+	</div>
+	<!-- 微信客服 -->
+	<div class="connect-view columns"
+		@click.stop="mynavigateFuc" data-jumptype="50">
+		<img class="defaultHead" src="https://dm.static.elab-plus.com/miniProgram/conentUs.png" mode="widthFix"/>
 	</div>
-	
 	<!-- 风格层主操作视图 -->
-	<div class="layout-view" :style="{'height':disableAble?'248rpx':'448rpx'}">
+	<div class="layout-view">
 		<!-- 手势区域 -->
-		<div class="signscoll-block"></div>
+		<!-- <div class="signscoll-block"></div> -->
 		<!-- 精装修 -->
 		<div class="aiEdit">
-			<div class="aiStyleList" :style="{'height':disableAble?'20rpx':'240rpx'}">
-				<div class="scrollViewItem" v-for="(item, idx) in styleList" :key="idx" :id="'styleItem'+idx"
-					@click.stop="selectStyle(idx)">
-					<div class="styleItem" :class="{'styleItemSelected':curStyleIndex==idx}">
-						<img class="styleIcon" :src="item.imgUrl" mode="aspectFill"></image>
-						<span class="styleTitle">{{item.styleName}}</span>
-					</div>
+			<!-- tab视图 -->
+			<div class="tab-view rows">
+				<div class='left btn rows justify-center' :class="{active:modelType==2}" @click="changeModel(2)">精准设计</div>
+				<div class='right btn rows justify-center' :class="{active:modelType==1}" @click="changeModel(1)">创意设计</div>
+			</div>
+			<div class="aiStyleList rows">
+				<div class="styleItem" v-for="(item, idx) in styleList" :key="idx" :id="'styleItem'+idx"
+				@click.stop="selectStyle(idx)" :class="{'styleItemSelected':curStyleIndex==idx}">
+					<img class="styleIcon" :src="item.imgUrl+'?imageMogr2/auto-orient/thumbnail/200x200/blur/1x0/quality/75'" mode="aspectFill"></image>
+					<span class="styleTitle">{{item.styleName}}</span>
 				</div>
 			</div>
-			<div class="aiTool">
-				<div class="changeBtn" v-if="showAIFlag" @click.stop="changeAIImg">
-					<span v-if="checked==false" class="iconfont icon-xingzhuang-tuoyuanxing" style="margin-right:10rpx;font-size:36rpx;"></span>
-					<span v-else class="iconfont icon-ziyuan" style="margin-right:10rpx;font-size:36rpx;color:#FAB060"></span>
-					<!-- <img class="right-icon" src="https://dm.static.elab-plus.com/miniProgram/iconfont/right-icon.png" mode="widthFix"/> -->
-					{{checked?'已选定图片':'选定图片'}}
+			<!-- 主题 -->
+			<div class="section4">
+				<div class="items">
+					<div :class="['item', themeIndex==idx ? 'item_sel columns': 'columns']" v-for="(item, idx) in themeList"
+						:key="idx" @click="selectAction(item,'theme',idx)">
+						<div class="def-view" v-if="idx==0"></div>
+						<div class="color-view rows" v-else>
+							<div class="left" :style="{'background':item.leftColor}"></div>
+							<div class="right" :style="{'background':item.rightColor}"></div>
+						</div>
+						<div>{{item.text}}</div>
+					</div>
 				</div>
-				<div v-if="showAIFlag" class="submitBtn continue rows justify-center" @click.stop="aiSubmit(2)"
-				 :class="{disable:disableAble}">
-					继续生成
+			</div>
+			<div class="btn-list rows rows-between" >
+				<div class="btn houseType rows justify-center up1" @click.stop="goback">
+					<div class="iconfont icon-huxingjianshang style1"></div>返回户型
 				</div>
-				<div v-else class="submitBtn rows justify-center" @click.stop="aiSubmit(1)" 
-				:class="{disable:disableAble}" >
-					<img class="magic-icon" src="https://dm.static.elab-plus.com/miniProgram/iconfont/magic.png" mode="widthFix"/>
-					AI生成精软装风格
+				<div class="btn AiBtn rows justify-center up2" @click.stop="aiSubmit(1)">
+					<div class="iconfont icon-a-lujing35039 style1"></div>{{aiImagesList && aiImagesList.length>0?'继续设计':'开始设计'}}
 				</div>
 			</div>
 		</div>
@@ -75,4 +103,22 @@
 		<img src="https://skyforest.static.elaber.cn/detail/loading.gif" alt="" />
 		<div class="loadingMsg">{{loadingMsg}}</div>
 	</div>
+	<!-- <div class="dialog">
+		
+	</div> -->
+	<el-dialog
+		title="提醒"
+		:visible.sync="dialogVisible"
+		width="80%"
+		top="35vh"
+		:modal="false"
+		style="pointer-events: auto;"
+		:before-close="cancelHandle"
+		>
+		<span>当前AI使用火爆，请继续尝试</span>
+		<span slot="footer" class="dialog-footer">
+			<el-button @click.stop="cancelHandle();">取消等待</el-button>
+			<el-button type="primary" @click.stop="confirmHandle();">继续尝试</el-button>
+		</span>
+	</el-dialog>
 </div>

src/components/newBottomCom/viewMask/viewMask.scss

@@ -1,12 +1,12 @@
 .mask-view{
 	position: absolute;
-	bottom:0rem;
+	bottom:0px;
 	width:100vw; 
 	height:100vh;
 	box-sizing: border-box;
 	z-index: 12;
 	font-family: "Verdana Bold";
-	font-size: 0rem;
+	font-size: 0px;
 	background: transparent;
 	pointer-events: none;
 }
@@ -16,43 +16,44 @@
 .swiper{
 	position: relative;
 	width: 100%;
-	height:calc(100vh - 408rem);
+	height:calc(100vh - 408px);
 	z-index: 12;
 	pointer-events: auto;
+	/deep/.el-image__preview{
+		cursor: none;
+	}
 }
 /deep/.el-carousel__container{
-	height:calc(100vh - 408rem);
-}
-.change-angle{
-	position: absolute;
-	width: 72rem;
-	height: 160rem;
-	left:30rem;
-	bottom:478rem;
-	border-radius: 12rem;
-	padding:20rem 10rem;
-	background: rgba(0, 0, 0, 0.5);
-	box-sizing: border-box;
-	font-family: "Verdana Bold";
-	font-weight: 700;
-	font-size: 24rem;
-	color: #fff;
-	text-align: center;
-	justify-content:unset;
-	z-index: 13;
-	.camera{
-		width: 43.07rem;
-		height: 49.22rem;
-	}
-	pointer-events: auto;
+	height:calc(100vh - 408px);
 }
 .btn-view{
 	position: absolute;
-	bottom: 478rem;
-	right: 30rem;
-	width: 72rem;
+	bottom: 620px;
+	left: 30px;
+	width: 72px;
 	z-index: 13;
 	pointer-events: auto;
+	.change-angle{
+		position: relative;
+		width: 72px;
+		height: 160px;
+		border-radius: 36px;
+		padding:20px 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;
+		.camera{
+			width: 43.07px;
+			height: 49.22px;
+		}
+		pointer-events: auto;
+	}
 	.compareBtn {
 		position: relative;
 		background: rgba(0,0,0,0.2);
@@ -62,98 +63,136 @@
 		align-items: center;
 		pointer-events: auto;
 		z-index:11;
-		width: 72rem;
-		height: 72rem;
+		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:20rem;
+		margin-bottom:20px;
 	}
 	.compareIcon {
-		width: 42rem;
-		height: 44rem;
+		width: 42px;
+		height: 44px;
 	}
 	.down{
-		width: 40rem;
-		height: 39rem;
+		width: 40px;
+		height: 39px;
 	}
 }
 
 .layout-view{
 	position: absolute;
-	bottom:0rem;
-	left:0rem;
+	bottom:0px;
+	left:0px;
 	width: 100vw;
-	height: 448rem;
-	border-radius: 40rem 40rem 0 0;
+	height: 600px;
+	border-radius: 40px 40px 0 0;
 	background: #fff;
-	box-shadow: 0 -6rem 12rem rgba(0, 0, 0, 0.12);
+	box-shadow: 0 -6px 12px rgba(0, 0, 0, 0.12);
 	z-index: 15;
-	padding:0rem 30rem;
+	padding:0px 30px;
 	box-sizing: border-box;
 	pointer-events: auto;
 	.signscoll-block{
 		position: absolute;
-		width: 90rem;
-		height: 10rem;
-		border-radius: 5rem;
+		width: 90px;
+		height: 10px;
+		border-radius: 5px;
 		background: #707070;
 		opacity: 0.6;
-		top: 10rem;
-		left:330rem;
+		top: 10px;
+		left:330px;
 	}
 }
-
+.grid{
+	display: grid;
+	grid-template-columns: repeat(4, 1fr);;
+	grid-row-gap: 20px;
+	grid-column-gap:50px;
+}
 .aiEdit {
 	position: relative;
 	width: 100%;
 	display: flex;
 	flex-direction: column;
-	align-items: center;
-	margin-top:60rem;
-	.aiStyleList {
-		width: 100%;
-		height: 240rem;
-		/* background: #333; */
-		flex-shrink: 0;
-		white-space: nowrap;
-
-		.scrollViewItem {
-			width: 152rem;
-			height: 100%;
-			display: inline-block;
-			margin: 0rem 10rem;
+	// align-items: center;
+	margin-top:30px;
+	.tab-view{
+		margin-bottom: 30px;
+		.btn{
+			width: 148px;
+			height: 56px;
+			border-radius: 16px;
+			background: transparent;
+			font-family: "Verdana";
+			font-weight: 400;
+			font-size: 30px;
+			color: #4e4e4e;
+			margin-right:40px;
 		}
-
-		.scrollViewItem:first-child {
-			margin-left: 30rem;
+		.btn.active{
+			background: #343434;
+			color: #fff;
+		}
+	}
+	.aiStyleList {
+		width: 720px;
+		margin-bottom: 30px;
+		overflow-x: auto;
+		.styleItem:first-child {
+			// margin-left: 30px;
 		}
 
-		.scrollViewItem:last-child {
-			margin-right: 30rem;
+		.styleItem:last-child {
+			margin-right: 0px;
 		}
 
 		.styleItem {
-			position: absolute;
-			width: 144rem;
+			width: 120px;
+			height: 168px;
+			margin-right: 30px;
 			// height: 100%;
 			display: flex;
 			flex-direction: column;
 			align-items: center;
-
-			/* background: red; */
 			.styleIcon {
-				width: 144rem;
-				height: 144rem;
+				width: 120px;
+				height: 120px;
 				background: #5c5c5c;
-				border-radius: 12rem;
-				border: 2rem solid #fff;
+				border-radius: 12px;
+				border: 2px solid #fff;
+				box-sizing: border-box;
+				object-fit: cover;
 			}
 
 			.styleTitle {
-				margin-top: 20rem;
+				margin-top: 8px;
+				height:40px;
 				font-family: "Verdana";
 				font-weight: 400;
-				font-size: 28rem;
+				font-size: 28px;
 				text-align: center;
 				color: #4e4e4e;
 			}
@@ -161,7 +200,7 @@
 
 		.styleItemSelected {
 			.styleIcon {
-				border: 2rem solid #ff9c38;
+				border: 2px solid #ff9c38;
 			}
 
 			.styleTitle {
@@ -171,93 +210,142 @@
 			}
 		}
 	}
-
-	.aiStyleList ::-webkit-scrollbar {
+	::-webkit-scrollbar {
 		width: 0;
 		height: 0;
 		background-color: transparent;
 	}
-
-	.aiTool {
-		width: 100%;
-		height: 100rem;
+	.section4 {
+		width: 720px;
 		display: flex;
-		flex-direction: row;
 		align-items: center;
-		justify-content: center;
-		/* background: red; */
-		// margin: 0rem 30rem;
-		margin-top: 10rem;
-		padding: 0rem 30rem;
-		box-sizing: border-box;
-		.changeBtn {
-			width: 320rem;
-			height: 100rem;
-			border-radius: 50rem;
-			background: rgba(255, 156, 56, 0.15);
-			margin-right: 30rem;
-			line-height: 100rem;
-			text-align: center;
-			font-family: "DIN Alternate Bold";
-			font-weight: 700;
-			font-size: 32rem;
-			color: #ff9f36;
-		}
-
-		.submitBtn {
-			width: 460rem;
-			border-radius: 50rem;
-			background: rgba(255, 156, 56, 0.15);
-			text-align: center;
-			height: 100%;
-			line-height: 100rem;
-			font-family: "DIN Alternate Bold";
-			font-weight: 700;
-			font-size: 28rem;
-			color: #fff;
-			box-shadow: 0 6rem 20rem rgba(242, 152, 2, 0.2);
-			backdrop-filter: blur(40rem);
-			background-color: rgba(255, 255, 255, 0.15);
-			background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
-		}
-		.disable{
-			background-color: #ccc;
-			background-image: unset;
-		}
-		.continue{
-			width: 330rem;
-			background: #fab060;
-		}
-		.right-icon{
-			width: 34rem;
-			height: 34rem;
-			margin-right:10rem;
-		}
-		.magic-icon{
-			width: 40.6rem;
-			height: 40.56rem;
-			margin-right:10rem;
+		overflow-x: auto;
+		.items {
+			display: flex;
+			align-items: center;
+	
+			.item {
+				width: 140px;
+				height: 100px;
+				border-radius: 12px;
+				background: rgba(243, 243, 243, 1);
+				font-family: "Verdana";
+				font-weight: 400;
+				font-size: 24px;
+				text-align: center;
+				color: #4e4e4e;
+				// margin-right: 10px;
+				margin-right: 16px;
+	
+				padding: 10px 20px;
+				border: 2px solid transparent;
+				box-sizing: border-box;
+				white-space: nowrap;
+				.def-view{
+					width: 40px;
+					height: 40px;
+					border-radius: 50%;
+					background: conic-gradient(from 90.00deg at 50.00% 50.00%, #ea3333 0%, #ffc350 13.54%, #eded5e 29.06%, #8ad960 45.32%, #72b3a7 59.55%, #4f7aed 75%, #9f5bed 88.67%, #ef6d6d 100%);
+				}
+				.color-view{
+					margin-bottom: 6px;
+					.left{
+						width: 50px;
+						height: 40px;
+						border-radius: 8px 0 0 8px;
+					}
+					.right{
+						width: 50px;
+						height: 40px;
+						border-radius: 0 8px 8px 0;
+					}
+				}
+			}
+	
+			.item_sel {
+				background: rgba(247, 211, 116, 0.15);
+				border-color: #FDAD56;
+				color: #fcac56;
+			}
+			.item:last-child {
+				margin-right: 0px;
+			}
 		}
 	}
+	
+}
+.btn-list{
+	position: relative;
+	width: 100%;
+	box-sizing: border-box;
+	margin-top:30px;
+	.btn{
+		height: 88px;
+		border-radius: 50px;
+		backdrop-filter:blur(40px);
+		--webkit-backdrop-filter: blur(40px);
+		font-family: "Verdana Bold";
+		font-weight: 700;
+		font-size: 32px;
+		color: #272727;
+		box-sizing: border-box;
+	}
+	.up1{
+		color: rgba(245, 145, 39, 1);
+		background-image:linear-gradient(124deg, rgba(245, 201, 82, 0.4) 0%, rgba(239, 149, 57, 0.4) 100%);
+	}
+	.up2{
+		color: rgba(255, 255, 255, 1);
+		background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
+	}
+	
+	.houseType{
+		width: 320px;
+		margin-left: -14px;
+		box-shadow: 0 6px 20px #f2980233;
+	}
+	.style1{
+		margin-right:17px;
+	}
+	.AiBtn{
+		width: 320px;
+		margin-right: -14px;
+		box-shadow: 0 6px 20px #f2980233;
+	}
+}
+.connect-view{
+	position: absolute;
+	width: 139px;
+	height: 184px;
+	background: transparent;
+	bottom: 605px;
+	right:24px; 
+	box-sizing: border-box;
+	z-index: 13;
+	pointer-events: auto;
+	.defaultHead{
+		width: 139px;
+		height: 184px;
+	}
 }
 .indicator-view{
 	position: absolute;
 	z-index: 12;
-	bottom: 468rem;
+	bottom: 620px;
 	left:50%;
 	transform: translateX(-50%);
 	.indicator-item{
-		width: 12rem;
-		height: 12rem;
+		width: 12px;
+		height: 12px;
 		background: #fff;
 		opacity: 0.52;
-		margin-right:6rem;
+		margin-right:6px;
 		border-radius: 50%;
 		&.active{
 			opacity:1;
 		}
 		&:last-child{
-			margin-right:0rem;
+			margin-right:0px;
 		}
 	}
 }
@@ -265,17 +353,17 @@
 	position: absolute;
 	width: 100%;
 	z-index: 12;
-	bottom: 498rem;
+	bottom: 640px;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	z-index: 25;
 	color:#fff;
-	font-size:28rem;
+	font-size:28px;
 	.loading_img {
-		width: 40rem;
-		height: 40rem;
-		margin-right: 10rem;
+		width: 40px;
+		height: 40px;
+		margin-right: 10px;
 
 		-webkit-animation: rotation 1s linear infinite;
 		animation: rotation 1s linear infinite;
@@ -292,13 +380,13 @@
 	}
 
 	.loading_text {
-		height: 40rem;
+		height: 40px;
 	}
 
 }
 .loadData{
-    min-width:110px;
-    height:110px;
+    min-width:200px;
+    height:150px;
     position: absolute;
     left: 50%;
     top:50%;
@@ -311,7 +399,7 @@
     flex-direction: column;
     align-items: center;
     justify-content:center;
-	font-size:18rem;
+	font-size:18px;
     img{
         width:90px;
 		margin-top: 10px;
@@ -321,4 +409,24 @@
         margin: 10px;
 		margin-top: 0px;
     }
+}
+.dialog{
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	overflow: auto;
+	margin: 0;
+	.main{
+		margin-top: 35vh;
+		width: 80%;
+		position: relative;
+		margin: 0 auto 50px;
+		background: #FFF;
+		border-radius: 2px;
+		box-shadow: 0 1px 3px rgba(0,0,0,.3);
+		box-sizing: border-box;
+	}
+	    
 }

src/components/newBottomCom/viewMask/viewMask.vue

@@ -23,14 +23,15 @@
 				inputBase64Url: "",
 				taskId: "", // 图生图任务ID
 				img2imgTimer: null,
-				imageWidth: 320,
+				outTimer: null,
+				imageWidth: 750,
 				imageHeight: 448,
 				showAIFlag:false,//继续生成状态切换标志
 				checked:false,
 				shottingImg:'',
 				count:0,
 				random:1,
-				disableAble:false,
+				// disableAble:false,
 				spaceTypes: [{
 						icon: "",
 						title: "卧室",
@@ -106,6 +107,131 @@
 				],
 				myloading:false,
 				loadingMsg:'',
+				screenWidth:0,
+				screenHeight:0,
+				modelType:2,	//当前模型类型，1指创意设计 2指精准设计 默认2
+				themeIndex:0,
+				themeList:[
+					{
+						id:1,
+						text:'默认',
+						prot:'',
+					},
+					{
+						id:2,
+						leftColor:'#F4EBDE',
+						rightColor:'#C1C9B4',
+						text:'莫兰素雅',
+						prot:'Soft grays, warm earth tones, subtle blues, soft pinks,',
+					},
+					{
+						id:3,
+						leftColor:'#1F1F1F',
+						rightColor:'#FFFFFF',
+						text:'经典黑白',
+						prot:'Classic black and pure white,',
+					},
+					{
+						id:4,
+						leftColor:'#6FA5BE',
+						rightColor:'#E2CCC5',
+						text:'海岸珊瑚',
+						prot:'Deep ocean blue paired with vibrant coral red,',
+					},
+					{
+						id:5,
+						leftColor:'#849059',
+						rightColor:'#E6CEB4',
+						text:'森林璀璨',
+						prot:'Deep forest green paired with luxurious gold,'
+					},
+					{
+						id:6,
+						leftColor:'#A1BACB',
+						rightColor:'#E6DFD8',
+						text:'梦幻静谧',
+						prot:'Dreamy powder blue paired with neutral gray,'
+					},
+					{
+						id:7,
+						leftColor:'#303B2B',
+						rightColor:'#D8C8A6',
+						text:'自然和谐',
+						prot:'Natural olive green paired with warm beige,'
+					},
+					{
+						id:8,
+						leftColor:'#652C30',
+						rightColor:'#D5C3B0',
+						text:'醇酒乳香',
+						prot:'Rich burgundy paired with soft cream,'
+					},
+					{
+						id:9,
+						leftColor:'#E3C7C5',
+						rightColor:'#EDE4DB',
+						text:'雅致浪漫',
+						prot:'Understated taupe paired with romantic pink,'
+					},
+					{
+						id:10,
+						leftColor:'#2C3C6E',
+						rightColor:'#F0DBBD',
+						text:'夜空璀璨',
+						prot:'Elegant navy blue paired with glamorous gold,'
+					},
+					{
+						id:11,
+						leftColor:'#ACC9A1',
+						rightColor:'#E6DCC6',
+						text:'复古翠绿',
+						prot:'Vintage tan paired with vibrant green,'
+					},
+					{
+						id:12,
+						leftColor:'#AAA8A7',
+						rightColor:'#D8A176',
+						text:'暖阳灰影',
+						prot:'Warm orange paired with cool gray,'
+					},
+					{
+						id:13,
+						leftColor:'#413D41',
+						rightColor:'#D1B687',
+						text:'耀眼黑金',
+						prot:'black and gold,'
+					},
+				],
+				timeOut:20000,		//超时时间
+				subType:0,
+				currentImg:null,
+				reqList:[
+					{
+						model:'batouresearch/sdxl-controlnet-lora',
+						level:'5',
+						aiPicId:'',
+						resultImg:'',
+					},{
+						model:'lucataco/sdxl-controlnet',
+						level:'3',
+						aiPicId:'',
+						resultImg:'',
+					}
+				],
+				reqListReset:[
+					{
+						model:'deployments/elabgroup/elab-sdxl-controlnet-lora',
+						level:'5',
+						aiPicId:'',
+						resultImg:'',
+					},{
+						model:'batouresearch/sdxl-controlnet-lora',
+						level:'3',
+						aiPicId:'',
+						resultImg:'',
+					}
+				],
+				dialogVisible: false,
 			}
 		},
 		props:{
@@ -132,6 +258,14 @@
 			// if(this.seedItem){
 			// 	this.title = this.seedItem.seedText;
 			// }
+			this.screenWidth = window.screen.width;
+			this.screenHeight = window.screen.height;
+			if(window.innerWidth && window.screen.width){
+				this.screenWidth = Math.min(window.innerWidth,window.screen.width)
+			}
+			if(window.innerHeight && window.screen.height){
+				this.screenHeight = Math.min(window.innerHeight,window.screen.height)
+			}
 		},
 		// 页面被展示时执行
 		onPageShow: function() {  
@@ -160,7 +294,7 @@
 			},
 			//视角切换
 			switchActor(){
-				this.$parent.clearHandle()
+				// this.$parent.clearHandle()
 				this.$emit('switchActor');
 				this.showAIImage = false;//隐藏AI结果集合-执行切换视角
 				let index = this.$parent.currentActor.userIndex;//当前视角的序号
@@ -177,7 +311,7 @@
 				util.trackRequest(param);
 			},
 			showOrHideWebGl(){
-				this.$parent.clearHandle()
+				// this.$parent.clearHandle()
 				this.showAIImage = !this.showAIImage;
 				let param = {
 					type: 'CLK', //埋点类型
@@ -188,13 +322,29 @@
 					}
 				};
 				util.trackRequest(param);
-				setTimeout(()=> {
-					if(this.showAIImage==true){
-						this.$parent.clearHandle()
-					}else{
-						this.$parent.attendEvent()
+			},
+			//空间或者风格切换
+			selectAction(selItem,type,index) {
+				console.log('点击动作111：', selItem,type,index)
+				var self = this;
+				if(this.themeIndex == index){
+					return false
+				}
+				this.themeIndex = index;
+				let param = {
+					type: 'CLK', //埋点类型
+					clkId: 'clk_2cmina_23112701', //点击ID
+					clkName: 'AIstyle_theme_clk', //点击前往的页面名称
+					clkParams: {
+						locusName: "AI 主题",
+						type:this.themeList[this.themeIndex].text
 					}
-				}, 100);
+				};
+				util.trackRequest(param);
+			},
+			//切换模式
+			changeModel(){
+				this.modelType = (this.modelType + 1) >2 ? 1 : 2;
 			},
 			//保存到相册
 			save() {
@@ -258,7 +408,7 @@
 				this.downloadIamge(_resultImg);
 			},
 		
-			//选项变更
+			//点赞喜欢
 			changeAIImg() {
 				// let lastPage = getCurrentPages()[getCurrentPages().length - 2] ? getCurrentPages()[getCurrentPages().length - 2].$vm : null;
 				this.checked = !this.checked;//变更选项
@@ -303,6 +453,29 @@
 				console.log("***leftScroll***",this.currentIndex,this.aiImagesList.length)
 				this.aiSubmit(2);//继续生成下一张
 			},
+			//返回上一页
+			goback(){
+				this.$router.go(-1);
+			},
+			mynavigateFuc(e) {
+				if (e) {
+					// this.$parent.clearHandle();
+					let param = {
+						type: 'CLK', //埋点类型
+						clkId: 'clk_2cmina_23080408', //点击ID
+						clkName: 'WeCom_clk', //点击前往的页面名称
+						clkParams: {
+							locusName: "联系定制",
+						}
+					};
+					util.trackRequest(param);
+					if(window.__wxjs_environment === 'miniprogram'){
+						wx.miniProgram.navigateTo({url: '/pages/transfer/transfer?event=openCustomerServiceChat&houseId='+this.$store.state.houseId})
+					}else{
+						this.$message.warning("敬请期待");
+					}
+				}
+			},
 			catchTapEvent:function(){
 				return false;
 			},
@@ -312,6 +485,7 @@
 				let res = await requestConfig("getHardboundEffects", {
 					"houseId": this.$route.query.houseId,
 					"spaceType": this.spaceObj.spaceType,
+					"spaceName": this.spaceObj.spaceName,
 				});
 				this.styleList = [];
 				if (res.success) {
@@ -319,14 +493,14 @@
 					this.styleList = list;
 				}
 				if(!this.styleList || this.styleList.length==0){
-					this.disableAble = true;//不能点击-没有风格
-					let unit = app.globalData.systemInfo.screenWidth / 750;//单位rpx 对应 px 的值
-					this.$parent.canvasHeight = app.globalData.systemInfo.screenHeight - (208 * unit);
-					this.$parent.camera.aspect = app.globalData.systemInfo.screenWidth / this.$parent.canvasHeight;
+					// this.disableAble = true;//不能点击-没有风格
+					let unit = this.screenWidth / 750;//单位rpm 对应 px 的值
+					this.$parent.canvasHeight = this.screenHeight - (208 * unit);
+					this.$parent.camera.aspect = this.screenWidth / this.$parent.canvasHeight;
 					this.$parent.camera.updateProjectionMatrix();
-					this.$parent.renderer.setSize(app.globalData.systemInfo.screenWidth, this.$parent.canvasHeight);
+					this.$parent.renderer.setSize(this.screenWidth, this.$parent.canvasHeight);
 				}else{
-					this.disableAble = false;//可以点击
+					// this.disableAble = false;//可以点击
 				}
 			},
 			clearInterval() {
@@ -380,19 +554,16 @@
 				
 				// this.inputBase64Url = await this.shottingAction(2);//开始截图-返回的是base64的数据
 				// this.startServer();
-				this.$emit('hideOrShowActor','hide');//隐藏所有视角
 				// let base64 = await this.$parent.shottingAction(2);//开始截图-返回的是base64
 				let shottingImg = await this.$parent.shottingAction();//开始截图-返回的是图片地址
 				if(!shottingImg){
 					this.showToast("渲染失败，请重试");
-					this.$emit('hideOrShowActor','show');//显示选中的视角
 					return false;
 				}
 				// ?x-oss-process=image/auto-orient,1/quality,Q_46/format,jpg //阿里OSS
 				// "?imageMogr2/auto-orient/format/webp/blur/1x0/quality/75";//七牛云压缩图片
 				shottingImg += "?x-oss-process=image/auto-orient,1/quality,Q_46/format,jpg";//压缩图片
 				this.shottingImg = shottingImg;
-				this.$emit('hideOrShowActor','show');//显示选中的视角
 				this.changeImg2Base64(this.shottingImg, false);
 				console.warn("***shottingImg***",this.shottingImg)
 				if(type==1){
@@ -454,71 +625,57 @@
 				if(isRepeat && self.inputBase64Url){//重复使用
 					self.startServer();
 				}else{
-					// self.inputBase64Url = Base64Url;
-					// console.log("生成inputBase64Url");
-					this.image2Base64(url).then(base64 => {
-						self.inputBase64Url = base64;
-						self.startServer();
-					})
-					// uni.request({
-					// 	url: url,
-					// 	method: "GET",
-					// 	responseType: "arraybuffer",
-					// 	success: async (res) => {
-					// 		let base64 = wx.arrayBufferToBase64(res.data);
-					// 		let Base64Url = "data:image/jpeg;base64," + base64;
-					// 		// console.log('base64：', Base64Url);
-					// 		self.inputBase64Url = Base64Url;
-					// 		console.log("生成inputBase64Url");
-					// 		self.startServer();
-					// 	},
-					// });
+					self.startServer();
 				}
 			},
+			//前置逻辑
+			async prevHandle(parmas){
+				return '';//暂不需要开启
+				//不是首次请求，则无需前置判断 用户上传的也不需要前置处理
+				if(this.subType!=0 || this.userInput){
+					return '';
+				}
+				return new Promise(async (resolve, reject) => {
+					let imgRes = await requestConfig("generateTaskImgToImgForAliyun", parmas);
+					if (imgRes.success) {
+						let aiPicId = imgRes.single || '';
+						let res = await requestConfig('generateProcess', {
+							id: aiPicId
+						})
+						if (res.success && res.single) {
+							if(res.single.category == 'scheduler'){//命中了
+								let resultImg = res.single.urls[0];
+								resolve(resultImg);
+							}else{
+								resolve('');
+							}
+						}else{
+							resolve('');
+						}
+					}else{
+						resolve('');
+					}
+				})
+			},
 			//开始图生图流程
 			async startServer() {
-				let data = {
-					"configType": "ControlNet_Config",
-					"keyvalue": "mix混合风_controlnet_upload",
-					"server": "simple_and_quiet",
-					"model": "control_v11p_sd15_mlsd_fp16 [77b5ad24]",
-					"cpu": "mlsd",
-					"session_hash": Date.now(),
-					"weight": 0.8,
-					"number1": 0.2,
-					"number2": 1,
-					"number3": 0.1,
-					"number4": 1,
-					"imageBase64": this.inputBase64Url
-				}
-				let res1 = await requestConfig("AIuploadImgControlNet", data);
-				if(!res1 || !res1.single){
-					this.showToast("渲染失败，请重试");
-					this.aiFlag = false;
-					this.aiImage = "";
-					return false;
+				if(!this.styleList || this.curStyleIndex < 0 || !this.styleList[this.curStyleIndex].imgUrl){
+					return false
 				}
-				let session_hash = res1.single;
-				data.model = "control_v11p_sd15_seg_fp16 [ab613144]";
-				data.cpu =  "seg_ofade20k";
-				data.weight =  0.5;
-				data.number1 =  0.1;
-				data.number2 =  0.2;
-				data.number3 =  0;
-				data.number4 =  0.1;
-				data.session_hash = session_hash;
-				
-				let res2 = await requestConfig("AIuploadImgControlNet", data);
-				if(!res2 || !res2.success){
-					this.showToast("渲染失败，请重试");
-					this.aiFlag = false;
-					this.aiImage = "";
+				if(this.$parent.pvCurPageName!="room_show"){//说明用户切换页面了
+					console.warn("***用户已经退出页面***")
 					return false;
 				}
-				
-				const prompt = this.styleList[this.curStyleIndex].prompt;
-				const noPromot = this.styleList[this.curStyleIndex].negativePrompt;
-				
+				let imgUrl = this.styleList[this.curStyleIndex].imgUrl;
+				let subType = this.subType;
+				let session_hash = Date.now();
+				let theme = this.themeList[this.themeIndex];//主题数据
+				let prompt = this.styleList[this.curStyleIndex].prompt + theme.prot;
+				let noPromot = this.styleList[this.curStyleIndex].negativePrompt;
+				let unit = 768 / this.screenWidth;
+				this.imageWidth = parseInt((this.screenWidth * unit).toFixed());
+				this.imageHeight = parseInt((this.$parent.canvasHeight * unit).toFixed());
+				this.timeOut = this.modelType==1? 20000: 50000;
 				var parmas = {
 					negativePrompt: noPromot,
 					prompt: prompt,
@@ -526,133 +683,288 @@
 					brandId: $config.brandId,
 					height: this.imageHeight,
 					width: this.imageWidth,
-					"moduleType": "simple_and_quiet",
-					"keyword":"img_2_img",
-					"steps":50,
+					"moduleType": "AI_Biography",
+					"steps":20,
 					"sampler":"DDIM",
 					"controlNetSessionHash":session_hash,
 					"cfgScale":12,
-					"denoising":0.9
+					"denoising":0.9,
+					image:this.shottingImg,
+					styleImage:imgUrl,
+					keyword: "replicate",
+					model: this.modelType==1? "lucataco/ssd-1b" : 'catio-apps/controlnet-interior-design',
 				};
-				let res = await requestConfig("generateTaskImgToImgForAliyun", parmas);
-				console.log("图生图结果：", res);
-				if(this.$parent.pvCurPageName!="room_show"){//说明用户切换页面了
-					console.warn("***用户已经退出页面***")
-					return false;
+				if(this.modelType==2){//精准设计
+					if(subType == 0){//首次
+						parmas.model = this.reqList[0].model;
+					}else{//重试
+						parmas.model = this.reqListReset[0].model;
+					}
+				}else{//创意设计
+					if(subType == 0){//首次
+						parmas.model = "lucataco/ssd-1b";
+					}else{//重试
+						parmas.model = "deployments/elabgroup/elab-ssd-1b";
+					}
 				}
-				let that = this;
-				if (res.success && res.single) {
-					if(typeof(res.single)=="object"){
-						this.showToast(`${res.single.queueCount | 0}人排队中，预计等待${Math.round(Math.random() * 20)}秒`)
-						this.aiImage = "";
+				let result = await this.prevHandle(parmas);
+				console.warn("***prevHandle***",result)
+				if(result && result.length>0){
+					this.randomHandle(result)
+					return false;
+				}else{
+					if(this.modelType==2){//精准设计
+						this.otherHandle(parmas);//发送其他AI请求
+					}
+					let res = await requestConfig("generateTaskImgToImgForAliyun", parmas);
+					console.log("图生图结果：", res);
+					let that = this;
+					if (res.success && res.single) {
+						this.taskId = res.single;
+						if(this.modelType==2){//精准设计
+							if(subType == 0){//首次
+								this.reqList[0].aiPicId = this.taskId;
+							}else{//重试
+								this.reqListReset[0].aiPicId = this.taskId;
+							}
+						}
+						if (!this.img2imgTimer) {
+							this.count = 0;
+							this.random = 1;
+							this.currentImg = false;//当次生成图还没有结果
+							this.img2imgTimer = setInterval(() => {
+								this.count ++;
+								this.getResultForImgToImg();
+							}, 1000);
+							this.setOutTimer();
+						}
+					}else{
+						this.clearInterval()
 						this.aiFlag = false;
-						this.clearInterval();
-						return false;
+						this.aiImage = "";
+						this.showToast("渲染失败，请重试")
 					}
-					this.taskId = res.single;
-					if (!this.img2imgTimer) {
-						this.count = 0;
-						this.random = 1;
-						this.img2imgTimer = setInterval(() => {
-							this.count ++;
-							this.getResultForImgToImg();
-						}, 1000);
+				}
+			},
+			//随机处理
+			randomHandle(resultImg){
+				if(this.timer || !resultImg){
+					return false;
+				}
+				let self = this;
+				var count = 1;
+				var process = 0;//进度
+				var randomNum = Math.floor(Math.random() * 4 + 5);//5-8随机数
+				this.img2imgTimer = setInterval(function() {
+					process = parseInt(count * 100/(randomNum));
+					if(process>=100){
+						process = 99;
 					}
-				}else{
-					this.aiFlag = false;
-					this.aiImage = "";
-					this.showToast("渲染失败，请重试")
+					if (count < randomNum) {//没有到上限
+						if(!self.showAIImage){
+							// this.$store.state.loadingMsg='生成中…' + this.random + '%';
+							self.loadingMsg = '生成中…' + process + '%';
+						}
+					}else{
+						self.myloading = false;
+						self.resultHandle(resultImg);
+					}
+					count = count + 1;
+				}, 1000);
+			},
+			
+			otherHandle(parmas){
+				let reqList = [];
+				if(this.subType == 0){//首次
+					reqList = this.reqList;
+				}else{//重试
+					reqList = this.reqListReset;
+				}
+				reqList.forEach(async (it,index)=>{
+					let _data = JSON.parse(JSON.stringify(parmas));
+					if(index>0){
+						_data.model = it.model;
+						let res = await requestConfig("generateTaskImgToImgForAliyun", _data);
+						if (res.success) {
+							console.log('生成结果123：', res);
+							it.aiPicId = res.single || '';
+						}
+					}
+				})
+			},
+			//设置一个超时逻辑，到底指定时间后停止轮询，当前是90s
+			setOutTimer() {
+				if (this.outTimer) {
+					clearTimeout(this.outTimer)
+					this.outTimer = null
 				}
+				var self = this;
+				this.outTimer = setTimeout(function() {
+					if (self.img2imgTimer) {
+						let hasResult = false;
+						if(self.modelType==2){//精准设计
+							let reqList = [];
+							if(self.subType == 0){//首次
+								reqList = self.reqList;
+							}else{//重试
+								reqList = self.reqListReset;
+							}
+							reqList.some((item,index) => {
+								if(item.resultImg){
+									hasResult = true;
+									self.resultHandle(item.resultImg)
+								}
+							});
+						}
+						console.warn("***hasResult***",hasResult)
+						if(!hasResult){//没有结果
+							self.clearInterval();//停止轮询
+							// self.$message.warning("AI开了个小差，请稍后再试");
+							self.dialogVisible = true;//弹出超时提示
+							self.aiFlag = false;
+							self.aiImage = "";
+						}
+					}
+					clearTimeout(self.outTimer);
+					self.outTimer = null
+				}, this.timeOut);
+			},
+			confirmHandle(){
+				console.log('用户点击确定')
+				this.dialogVisible = false;
+				this.subType = 1;
+				this.startServer();
+			},
+			cancelHandle(){
+				console.log('用户点击取消')
+				this.dialogVisible = false;
+				this.subType = 0;
 			},
 			// 轮询获取图片结果
 			async getResultForImgToImg() {
+				if(this.modelType==2){//精准设计且当次新开始
+					let reqList = [];
+					if(this.subType == 0){//首次
+						reqList = this.reqList;
+					}else{//重试
+						reqList = this.reqListReset;
+					}
+					reqList.forEach((item,index) => {
+						this.singleHandle(item)
+					});
+				}
+				else{
+					this.singleHandle({aiPicId:this.taskId})
+				}
+			},
+			async singleHandle(model){
+				if(!model || !model.aiPicId){
+					return false;
+				}
 				var parmas = {
-					id: this.taskId,
+					id: model.aiPicId,
 				};
 				let res = await requestConfig("generateProcess", parmas);
-				// let lastPage = getCurrentPages()[getCurrentPages().length - 2] ? getCurrentPages()[getCurrentPages().length - 2].$vm : null;
-				// console.warn("图生图轮询结果：", res);
 				if (res.success && res.single) {
-					if (res.single.inQueue == false) {
-						if (res.single.urls) {
-							// uni.hideLoading();
-							this.aiFlag = false;
-							this.random = 100;
-							console.warn("图生图轮询结束: ", res);
-							this.aiImage = res.single.urls[0];
-							this.showAIFlag = true;
-							let newImage = this.aiImage;
-							let aiStyleName = this.styleList[this.curStyleIndex].styleName;
-							let _data = {
-								image:newImage,
-								checked:false,
+					if(this.currentImg){//当前已经有生成图了
+						console.warn("***当前已经有最高级生成图了***")
+						return false;
+					}
+					if (res.single.urls) {
+						console.warn("图生图轮询结束: ", res);
+						if(this.modelType==2){//精准设计
+							model.resultImg = res.single.urls[0];
+							if(model.level=='5'){//最高级了
+								this.currentImg = true;
+								this.resultHandle(res.single.urls[0])
 							}
-							this.aiImagesList.push(_data);
-							this.showAIImage = true;//显示AI结果集合-因为生成了AI图片
-							if(this.$parent && typeof(this.$parent.clearHandle)=="function" ){
-								this.$parent.clearHandle();
+						}else{
+							this.resultHandle(res.single.urls[0])
+						}
+						console.warn("***有生成图了***",model)
+						
+					} else {
+						if (!res.success) {
+							this.showToast("渲染失败，请重试")
+							this.aiFlag = false;
+							this.aiImage = "";
+							this.clearInterval();
+						}else {
+							// this.random = parseInt(this.count * 2);
+							this.random = parseInt(this.count * 100/(this.timeOut/1000));
+							if(this.random>=100){
+								this.random = 99;
 							}
-							let cpAiData = JSON.parse(JSON.stringify(this.aiData)) || []
-							if(cpAiData){//给上一个页面回传生成的数据
-								let space = cpAiData.find(it=>{
-									return it.houseFloor == this.curHouseObj.houseFloor && it.spaceId == this.spaceObj.spaceId
-								})
-								if(space){
-									let data ={
-										aiStyleName:aiStyleName,
-										image:newImage,
-										checked:false,
-									}
-									space.aiImagesList.push(data);
-								}else{//不存在则构建数据
-									let data = {
-										houseFloor:this.curHouseObj.houseFloor,//当前的楼层
-										spaceId:this.spaceObj.spaceId,
-										aiImagesList:[
-											{
-												aiStyleName:aiStyleName,
-												image:newImage,
-												checked:false,
-											}
-										]
-									}
-									cpAiData.push(data)
-								}
-								this.$store.dispatch('setAiData', cpAiData)
+							if(!this.showAIImage){
+								// this.$store.state.loadingMsg='生成中…' + this.random + '%';
+								this.loadingMsg = '生成中…' + this.random + '%';
+							}else{
 							}
-							this.clearInterval();
-						} else {
-							if (!res.success) {
-								this.showToast("渲染失败，请重试")
-								this.aiFlag = false;
-								this.aiImage = "";
-								this.clearInterval();
-							}else {
-								this.random = parseInt(this.count * 2);
-								if(this.random>=100){
-									this.random = 99;
-								}
-								if(!this.showAIImage){
-									// this.$store.state.loadingMsg='生成中…' + this.random + '%';
-									this.loadingMsg = '生成中…' + this.random + '%';
-								}else{
+						}
+					}
+				}
+			},
+			//返回结果处理
+			resultHandle(resultImg){
+				this.currentImg = true;
+				this.aiFlag = false;
+				this.random = 100;
+				this.aiImage = resultImg;
+				this.showAIFlag = true;
+				let newImage = this.aiImage;
+				let aiStyleName = this.styleList[this.curStyleIndex].styleName;
+				let _data = {
+					image:newImage,
+					checked:false,
+					list:[newImage],
+				}
+				this.aiImagesList.push(_data);
+				this.showAIImage = true;//显示AI结果集合-因为生成了AI图片
+				if(this.$parent && typeof(this.$parent.clearHandle)=="function" ){
+					this.$parent.clearHandle();
+				}
+				let cpAiData = JSON.parse(JSON.stringify(this.aiData)) || []
+				if(cpAiData && this.curHouseObj && this.curHouseObj.houseFloor){//给上一个页面回传生成的数据
+					let space = cpAiData.find(it=>{
+						return it.houseFloor == this.curHouseObj.houseFloor && it.spaceId == this.spaceObj.spaceId
+					})
+					if(space){
+						let data ={
+							aiStyleName:aiStyleName,
+							image:newImage,
+							checked:false,
+						}
+						space.aiImagesList.push(data);
+					}else{//不存在则构建数据
+						let data = {
+							houseFloor:this.curHouseObj.houseFloor,//当前的楼层
+							spaceId:this.spaceObj.spaceId,
+							aiImagesList:[
+								{
+									aiStyleName:aiStyleName,
+									image:newImage,
+									checked:false,
 								}
-							}
+							]
 						}
-					} else {
-						this.showToast(`${res.single.queueCount | 0}人排队中，预计等待${Math.round(Math.random() * 20)}秒`)
-						this.aiImage = "";
-						this.aiFlag = false;
-						this.clearInterval();
+						cpAiData.push(data)
 					}
+					this.$store.dispatch('setAiData', cpAiData)
+				}
+				this.clearInterval();
+				if(this.aiImagesList.length>1){
+					setTimeout(()=>{
+						// this.$refs.carousel.next();
+						this.$refs.carousel.setActiveItem(this.aiImagesList.length-1);//切换到最后一张
+					}, 1000);
 				}
 			},
-			showToast(title){
+			showToast(title,time=3000){
 				this.$store.state.loading = true;
 				this.$store.state.loadingMsg = title || "";
 				setTimeout(()=>{
 					this.$store.state.loading = false;
-				}, 3000);
+				}, time);
 			}
 		}
 	}

src/components/newBottomCom/viewShell/viewShell.css

@@ -1,117 +0,0 @@
-.plus_park {
-	position: relative;
-}
-.shell-view{
-	position: fixed;
-	left: 0rem;
-	bottom: 0rem;
-	width: 100vw;
-	height: 200rem;
-	border-radius: 40rem 40rem 0 0;
-	background: #fff;
-	box-shadow: 0 -6rem 12rem #0000001f;
-	box-sizing: border-box;
-	z-index: 15;
-	padding:0rem 40rem;
-	padding-top:30rem;
-	padding-bottom:60rem;
-	transition: height 1s;
-}
-.shell-view2{
-	height: 448rem;
-	padding-left:0rem;
-	padding-right:0rem;
-}
-.shell-signscoll{
-	position: absolute;
-	top:-50rem;
-	left:275rem;
-	width:200rem;
-	height: 100rem;
-	z-index: 120;
-	/* padding-top:50rem; */
-	box-sizing: border-box;
-}
-.signscoll-block{
-	position: absolute;
-	width: 90rem;
-	height: 10rem;
-	border-radius: 5rem;
-	background: #707070;
-	opacity: 0.6;
-	bottom: 30rem;
-}
-.floor-view{
-	position: absolute;
-	left:30rem;
-	width: 72rem;
-	border-radius: 12rem;
-	background: rgba(0, 0, 0, 0.4);
-	overflow: hidden;
-}
-.floor-item{
-	height: 60rem;
-	color: #fff;
-	font-size: 28rem;
-}
-.floor-item.active{
-	color: #faa040;
-	background: #fff;
-}
-.tips-view{
-	position: absolute;
-	left:50%;
-	transform:translateX(-50%);
-	top:-50rem;
-	font-family: "Verdana";
-	font-weight: 400;
-	font-size: 26rem;
-	line-height: 30rem;
-	text-align: center;
-	color: #2b2b2b;
-	opacity: 0.5;
-	pointer-events: none;
-}
-
-.zoom-view{
-	position: absolute;
-	top:-82rem;
-	right:30rem;
-	width: 52rem;
-	height: 52rem;
-}
-.zoom-view .icon {
-	width: 52rem;
-	height: 52rem;
-}
-.connect-view{
-	position: absolute;
-	width: 72rem;
-	height: 160rem;
-	border-radius: 36rem;
-	background: rgba(0, 0, 0, 0.4);
-	top:-190rem;
-	right:30rem; 
-	padding:2rem;
-	padding-bottom:18rem;
-	box-sizing: border-box;
-	font-family: "Verdana";
-	font-weight: 400;
-	font-size: 24rem;
-	line-height: 28rem;
-	color: #fff;
-	text-align: center;
-	justify-content:unset;
-}
-.connect-view .defaultHead{
-	width: 68rem;
-	height: 68rem;
-}
-button{
-	background-color: unset;
-	line-height: unset;
-	padding: unset;
-}
-button::after {
-    border: none;
-}

src/components/newBottomCom/viewShell/viewShell.html

@@ -1,30 +1,29 @@
 <!-- 弹出层的壳子 -->
-<div class="shell-view" :class="pageType==2?'shell-view2':''" :style="{'height':shellHeight}">
+<div class="shell-view" :class="styleType==2?'shell-view2':''">
 	<!-- 楼层 -->
-	<div class="floor-view" v-if="pageType==1 && floorList&&floorList.length>1" :style="{'top':'calc( -' + floorList.length*60 + 'rem - 30rem)'}">
+	<div class="floor-view" v-if="pageType==1 && floorList&&floorList.length>1">
 		<div class="floor-item rows justify-center" :class="floorId==floor.id?'active':''" 
 			v-for="(floor,index) in floorList" :key="index" @click="floorChange(floor)">
 			{{floor.houseFloor?floor.houseFloor+'F':''}}
 		</div>
 	</div>
 	<!-- 提示 -->
-	<div class="tips-view">
+	<!-- <div class="tips-view">
 		{{pageType==1?'点击进入空间':'单击圆点切换视角'}}
-	</div>
+	</div> -->
 	<!-- 放大缩小操作区域 -->
-	<div class="zoom-view" @click.stop="zoomInOut" v-if="pageType==1 && (styleType==2 || styleType==3)">
+	<div class="zoom-view" @click.stop="zoomInOut" v-if="styleType==2">
 		<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 class="connect-view columns" v-if="pageType==1 && styleType==1"
-	@click="mynavigateFuc" data-jumplink="客服链接" data-jumptype="50" data-jumpvalue="企业id">
-		<img class="defaultHead" src="https://dm.static.elab-plus.com/miniProgram/iconfont/defaultHead.png" mode="widthFix"/>
-		联系定制
+	<div class="connect-view columns"
+		@click="mynavigateFuc" data-jumptype="50">
+		<img class="defaultHead" src="https://dm.static.elab-plus.com/miniProgram/conentUs.png" mode="widthFix"/>
 	</div>
 	<!-- 手势操作区域 -->
-	<div v-if="showSignscoll" class="shell-signscoll rows justify-center" @click="upScrollOrDown" @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend">
+	<!-- <div v-if="showSignscoll" class="shell-signscoll rows justify-center" @click="upScrollOrDown" @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend">
 		<div class="signscoll-block"></div>
-	</div>
+	</div> -->
 	<!-- 精细化视图 -->
 	<viewCareful ref="viewCareful" v-show="styleType==2" @curSpaceChange="curSpaceChange" :overChange="overChange" :curHouseObj="houseObj"></viewCareful>
 	<!-- 种子户型视图 -->

src/components/newBottomCom/viewShell/viewShell.scss

@@ -0,0 +1,107 @@
+.plus_park {
+	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;
+}
+.tips-view{
+	position: absolute;
+	left:50%;
+	transform:translateX(-50%);
+	top:-50px;
+	font-family: "Verdana";
+	font-weight: 400;
+	font-size: 26px;
+	line-height: 30px;
+	text-align: center;
+	color: #2b2b2b;
+	opacity: 0.5;
+	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/viewShell/viewShell.vue

@@ -4,7 +4,7 @@
 <script>
 	const util = require('@/utils/util.js').default;
 	// import commonMethod from '@/common/commonMethod.js';
-	import touchHandle from '@/mixins/touchHandle.js';
+	// import touchHandle from '@/mixins/touchHandle.js';
 	// import requestConfig from '@/static/lib/requestConfig';
 	import viewlayout from'@/components/newBottomCom/viewlayout/viewlayout.vue';
 	import viewCareful from'@/components/newBottomCom/viewCareful/viewCareful.vue';
@@ -25,7 +25,7 @@
 					}
 				],
 				floorId:0,//楼层选中的id
-				shellHeight:'200rem',
+				shellHeight:'200px',
 				isShare: false,
 				shareVideoItem:null,
 				styleType:1,	//当前底部组件的状态
@@ -85,13 +85,13 @@
 							return false;
 						}
 						if(newVal==1){//变更为初始状态
-							this.shellHeight = '200rem';
+							this.shellHeight = '200px';
 							_endHeight = 200;
 						}else if(newVal==2){//变更为展开状态
-							this.shellHeight = '800rem';
+							this.shellHeight = '800px';
 							_endHeight = 800;
 						}else if(newVal==3){//变更为最小状态
-							this.shellHeight = '200rem';
+							this.shellHeight = '200px';
 							_endHeight = 200;
 						}
 						// let currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
@@ -116,12 +116,9 @@
 			viewCareful,
 			// viewStyle,
 		},
-		mixins: [touchHandle],
+		// mixins: [touchHandle],
 		async mounted() {
-			// await this.getCityHouseList();
-			if(this.pageType==2){
-				this.shellHeight = '448rem';
-			}			
+			// await this.getCityHouseList();		
 			console.warn("***viewShell***",this.houseList)
 		},
 		// 页面被展示时执行
@@ -137,7 +134,7 @@
 				let houseList = this.houseList;
 				// let currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
 				// let curHouseType = currPage.curHouseType?currPage.curHouseType:houseList[0].spaceStructure;//获取当前页面选中的户型类型
-				let curHouseType = houseList[0].spaceStructure;//获取当前页面选中的户型类型
+				let curHouseType = this.curHouseType || houseList[0].spaceStructure;//获取当前页面选中的户型类型
 				//获取当前选中的户型大类，从中提取楼层信息
 				let curData = houseList.find(item=>{
 					return item.spaceStructure == curHouseType;
@@ -171,6 +168,10 @@
 				if(this.floorId==item.id){
 					return false;
 				}
+				if(this.$parent.loadLayFlag){//加载家具模型中
+					this.$message("加载模型中,请稍后再试");
+					return false
+				}
 				this.floorId = item.id;
 				let param = {
 					type: 'CLK', //埋点类型
@@ -192,8 +193,8 @@
 			//放大缩小
 			zoomInOut(){
 				if(this.styleType == 2){
-					this.styleType = 3;//变更为最小状态
-				}else if(this.styleType == 3){
+					this.styleType = 1;//变更为最小状态
+				}else if(this.styleType == 1){
 					this.styleType = 2;//变更为最大状态
 				}
 			},
@@ -258,13 +259,17 @@
 						}
 					};
 					util.trackRequest(param);
-					this.$message.warning("敬请期待");
+					if(window.__wxjs_environment === 'miniprogram'){
+						wx.miniProgram.navigateTo({url: '/pages/transfer/transfer?event=openCustomerServiceChat&houseId='+this.$store.state.houseId})
+					}else{
+						this.$message.warning("敬请期待");
+					}
 				}
 			},
 		}
 	}
 </script>
-<style lang="css" scoped>
-    @import "./viewShell.css";
+<style lang="scss" scoped>
+    @import "./viewShell.scss";
 	/* @import "@/common/css/common.css"; */
 </style>

src/components/newBottomCom/viewStyle/viewStyle.html

@@ -13,8 +13,8 @@
 		</scroll-view>
 		<div class="aiTool">
 			<div class="changeBtn" v-if="showAIFlag" @click="changeAIImg">
-				<span v-if="checked==false" class="iconfont icon-xingzhuang-tuoyuanxing" style="margin-right:10rpx;font-size:36rpx;"></span>
-				<span v-else class="iconfont icon-ziyuan" style="margin-right:10rpx;font-size:36rpx;color:#FAB060"></span>
+				<span v-if="checked==false" class="iconfont icon-xingzhuang-tuoyuanxing" style="margin-right:10px;font-size:36px;"></span>
+				<span v-else class="iconfont icon-ziyuan" style="margin-right:10px;font-size:36px;color:#FAB060"></span>
 				<!-- <img class="right-icon" src="https://dm.static.elab-plus.com/miniProgram/iconfont/right-icon.png" mode="widthFix"/> -->
 				{{checked?'已选定图片':'选定图片'}}
 			</div>

src/components/newBottomCom/viewStyle/viewStyle.scss

@@ -1,5 +1,5 @@
 .layout-view{
-	margin-top:30rem;
+	margin-top:30px;
 }
 
 .aiEdit {
@@ -11,29 +11,29 @@
 
 	.aiStyleList {
 		width: 100%;
-		height: 240rem;
+		height: 240px;
 		/* background: #333; */
 		flex-shrink: 0;
 		white-space: nowrap;
 
 		.scrollViewItem {
-			width: 152rem;
+			width: 152px;
 			height: 100%;
 			display: inline-block;
-			margin: 0rem 10rem;
+			margin: 0px 10px;
 		}
 
 		.scrollViewItem:first-child {
-			margin-left: 30rem;
+			margin-left: 30px;
 		}
 
 		.scrollViewItem:last-child {
-			margin-right: 30rem;
+			margin-right: 30px;
 		}
 
 		.styleItem {
 			position: absolute;
-			width: 144rem;
+			width: 144px;
 			height: 100%;
 			display: flex;
 			flex-direction: column;
@@ -42,18 +42,18 @@
 
 			/* background: red; */
 			.styleIcon {
-				width: 144rem;
-				height: 144rem;
+				width: 144px;
+				height: 144px;
 				background: #5c5c5c;
-				border-radius: 12rem;
-				border: 2rem solid #fff;
+				border-radius: 12px;
+				border: 2px solid #fff;
 			}
 
 			.styleTitle {
-				margin-top: 20rem;
+				margin-top: 20px;
 				font-family: "Verdana";
 				font-weight: 400;
-				font-size: 28rem;
+				font-size: 28px;
 				text-align: center;
 				color: #4e4e4e;
 			}
@@ -61,7 +61,7 @@
 
 		.styleItemSelected {
 			.styleIcon {
-				border: 2rem solid #ff9c38;
+				border: 2px solid #ff9c38;
 			}
 
 			.styleTitle {
@@ -80,59 +80,59 @@
 
 	.aiTool {
 		width: 100%;
-		height: 100rem;
+		height: 100px;
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		justify-content: center;
 		/* background: red; */
-		// margin: 0rem 30rem;
-		margin-top: 10rem;
-		padding: 0rem 30rem;
+		// margin: 0px 30px;
+		margin-top: 10px;
+		padding: 0px 30px;
 		box-sizing: border-box;
 		.changeBtn {
-			width: 320rem;
-			height: 100rem;
-			border-radius: 50rem;
+			width: 320px;
+			height: 100px;
+			border-radius: 50px;
 			background: rgba(255, 156, 56, 0.15);
-			margin-right: 30rem;
-			line-height: 100rem;
+			margin-right: 30px;
+			line-height: 100px;
 			text-align: center;
 			font-family: "DIN Alternate Bold";
 			font-weight: 700;
-			font-size: 32rem;
+			font-size: 32px;
 			color: #ff9f36;
 		}
 
 		.submitBtn {
-			width: 460rem;
-			border-radius: 50rem;
+			width: 460px;
+			border-radius: 50px;
 			background: rgba(255, 156, 56, 0.15);
 			text-align: center;
 			height: 100%;
-			line-height: 100rem;
+			line-height: 100px;
 			font-family: "DIN Alternate Bold";
 			font-weight: 700;
-			font-size: 28rem;
+			font-size: 28px;
 			color: #fff;
-			box-shadow: 0 6rem 20rem rgba(242, 152, 2, 0.2);
-			backdrop-filter: blur(40rem);
+			box-shadow: 0 6px 20px rgba(242, 152, 2, 0.2);
+			backdrop-filter: blur(40px);
 			background-color: rgba(255, 255, 255, 0.15);
 			background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
 		}
 		.continue{
-			width: 330rem;
+			width: 330px;
 			background: #fab060;
 		}
 		.right-icon{
-			width: 34rem;
-			height: 34rem;
-			margin-right:10rem;
+			width: 34px;
+			height: 34px;
+			margin-right:10px;
 		}
 		.magic-icon{
-			width: 40.6rem;
-			height: 40.56rem;
-			margin-right:10rem;
+			width: 40.6px;
+			height: 40.56px;
+			margin-right:10px;
 		}
 	}
 }

src/components/newBottomCom/viewStyle/viewStyle.vue

@@ -308,7 +308,7 @@
 					negativePrompt: noPromot,
 					prompt: prompt,
 					"batchSize": 1,
-					brandId: config.brandId,
+					brandId: $config.brandId,
 					height: this.imageHeight,
 					width: this.imageWidth,
 					"moduleType": "simple_and_quiet",

src/components/newBottomCom/viewlayout/viewlayout.css

@@ -1,113 +0,0 @@
-.layout-view{
-	position: fixed;
-	left: 30rem;
-	bottom: 0rem;
-	padding-bottom: 60rem;
-	width: 690rem;
-	z-index: 15;
-	background-color: rgba(255, 255, 255, 1);
-}
-.layout-list{
-	position: relative;
-	width: auto;
-	box-sizing: border-box;
-	z-index: 12;
-}
-.seed-item{
-	margin-right:90rem;
-}
-.seed-item:last-child{
-	margin-right:0rem;
-}
-.item-text{
-	font-family: "Verdana Bold";
-	font-weight: 700;
-	font-size: 34rem;
-	text-align: center;
-	color: #1c1c1c;
-	width: 95rem;
-	/* height: 80rem; */
-	margin-bottom:10rem;
-}
-.item-select{
-	width: 50rem;
-	height: 12rem;
-	border-radius: 6rem;
-	background: #ffa040;
-}
-.item-set{
-	font-family: "Verdana";
-	font-weight: 400;
-	font-size: 24rem;
-	text-align: left;
-	color: #faa040;
-}
-.btn-list{
-	position: relative;
-	width: 100%;
-	box-sizing: border-box;
-	margin-top:26rem;
-}
-.btn{
-	height: 100rem;
-	border-radius: 50rem;
-	backdrop-filter:blur(40px);
-	--webkit-backdrop-filter: blur(40px);
-	font-family: "Verdana Bold";
-	font-weight: 700;
-	font-size: 32rem;
-	color: #272727;
-	box-sizing: border-box;
-}
-.up{
-	/* width: 546rem; */
-	width: 690rem;
-	box-shadow: 0 6rem 20rem #f2980233;
-}
-.up1{
-	color: rgba(245, 145, 39, 1);
-	background-image:linear-gradient(124deg, rgba(245, 201, 82, 0.4) 0%, rgba(239, 149, 57, 0.4) 100%);
-}
-.up2{
-	color: rgba(255, 255, 255, 1);
-	background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
-}
-.voice2{
-	background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
-}
-.voice3{
-	background-color: rgba(23, 23, 23, 0.04);
-	background-image:unset;
-}
-.voice{
-	width: 100rem;
-	background-color: rgba(23, 23, 23, 0.04);
-}
-.voice .icon{
-	width: 31.5rem;
-	height: 44rem;
-}
-.voice-view{
-	position: absolute;
-	left:0rem;
-	/* top:0rem; */
-	width: 100%;
-	font-family: "Verdana";
-	font-weight: 400;
-	z-index: 15;
-	pointer-events: none;
-}
-.voice-title{
-	font-size: 36rem;
-	color: #242424;
-}
-.voice-tips{
-	font-size: 28rem;
-	color: rgba(36, 36, 36, 0.51);
-	margin-top:10rem;
-	margin-bottom:28rem;
-}
-.voice-gif{
-	width: 100%;
-	margin-top:-20rem;
-}

src/components/newBottomCom/viewlayout/viewlayout.html

@@ -3,11 +3,20 @@
 <div class="layout-view">
 	<!-- 种子区域 -->
 	<div>
-		<div class="btn-list rows rows-between">
+		<div class="btn-list rows rows-between" v-if="styleType==1 || styleType==3">
 			<!-- <div class="btn voice rows justify-center" :class="recording?'voice2':'voice3'" @touchstart="streamRecord" @touchmove="mytouchmove">
 				<img class="icon" :src="recording?'https://dm.static.elab-plus.com/miniProgram/iconfont/source.png':'https://dm.static.elab-plus.com/miniProgram/iconfont/source1.png'" mode="widthFix"/>
 			</div> -->
-			<div class="btn rows up justify-center" @click="upCom" :class="styleType==1?'up1':'up2'">精细调整 · 空间大小随心布局</div>
+			<div class="btn rows up justify-center" @click="upCom" :class="styleType==1?'up1':'up2'">开始定制户型 ></div>
+			
+		</div>
+		<div class="btn-list rows rows-between" v-else-if="styleType==2">
+			<div class="btn houseType rows justify-center up2" >
+				<div class="iconfont icon-huxingjianshang style1"></div>户型空间
+			</div>
+			<div class="btn AiBtn rows justify-center up1" @click="goRoam">
+				<div class="iconfont icon-a-lujing35039 style1"></div>AI精软装
+			</div>
 		</div>
 	</div>
 </div>

src/components/newBottomCom/viewlayout/viewlayout.scss

@@ -0,0 +1,85 @@
+.layout-view{
+	position: fixed;
+	left: 30px;
+	bottom: 0px;
+	padding-bottom: 60px;
+	width: 690px;
+	z-index: 15;
+	background-color: rgba(255, 255, 255, 1);
+}
+.layout-list{
+	position: relative;
+	width: auto;
+	box-sizing: border-box;
+	z-index: 12;
+}
+.seed-item{
+	margin-right:90px;
+}
+.seed-item:last-child{
+	margin-right:0px;
+}
+.item-text{
+	font-family: "Verdana Bold";
+	font-weight: 700;
+	font-size: 34px;
+	text-align: center;
+	color: #1c1c1c;
+	width: 95px;
+	/* height: 80px; */
+	margin-bottom:10px;
+}
+.item-select{
+	width: 50px;
+	height: 12px;
+	border-radius: 6px;
+	background: #ffa040;
+}
+.item-set{
+	font-family: "Verdana";
+	font-weight: 400;
+	font-size: 24px;
+	text-align: left;
+	color: #faa040;
+}
+.btn-list{
+	position: relative;
+	width: 100%;
+	box-sizing: border-box;
+	margin-top:26px;
+}
+.btn{
+	height: 100px;
+	border-radius: 50px;
+	backdrop-filter:blur(40px);
+	--webkit-backdrop-filter: blur(40px);
+	font-family: "Verdana Bold";
+	font-weight: 700;
+	font-size: 32px;
+	color: #272727;
+	box-sizing: border-box;
+}
+.up{
+	width: 690px;
+	box-shadow: 0 6px 20px #f2980233;
+}
+.up1{
+	color: rgba(245, 145, 39, 1);
+	background-image:linear-gradient(124deg, rgba(245, 201, 82, 0.4) 0%, rgba(239, 149, 57, 0.4) 100%);
+}
+.up2{
+	color: rgba(255, 255, 255, 1);
+	background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
+}
+
+.houseType{
+	width: 320px;
+	box-shadow: 0 6px 20px #f2980233;
+}
+.style1{
+	margin-right:17px;
+}
+.AiBtn{
+	width: 320px;
+	box-shadow: 0 6px 20px #f2980233;
+}

src/components/newBottomCom/viewlayout/viewlayout.vue

@@ -150,8 +150,12 @@
 				// 	this.selectSeedId = this.seedLayoutList[this.defaultIndex].spaceStructure;
 				// }
 				this.selectSeedId = this.seedLayoutList[this.defaultIndex].spaceStructure;
-				if(this.$route.query.structureName){//如果存在结构特征，则定位到该模型大类下
-					this.selectSeedId = this.seedLayoutList.find(it=>it.spaceName==this.$route.query.structureName).spaceStructure;
+				let keyWord = this.$route.query.layer;
+				if(keyWord){//如果存在结构特征，则定位到该模型大类下
+					let item = this.seedLayoutList.find(it=>keyWord.includes(it.spaceName));
+					if(item){
+						this.selectSeedId = item.spaceStructure;
+					}
 				}
 				if(this.selectSeedId){
 					let item = this.seedLayoutList.find(it=>{
@@ -207,6 +211,9 @@
 				};
 				// util.trackRequest(param);
 			},
+			goRoam(){
+				this.$parent.$refs.viewCareful.goRoam();
+			},
 			//获取录音权限
 			getRecordAuth: function() {
 				uni.getSetting({
@@ -517,7 +524,7 @@
 		}
 	}
 </script>
-<style lang="css" scoped>
-	@import "./viewlayout.css";
+<style lang="scss" scoped>
+	@import "./viewlayout.scss";
 	/* @import "@/common/css/common.css"; */
 </style>

src/main.js

@@ -8,16 +8,17 @@ import 'element-ui/lib/theme-chalk/index.css'; //导入ele-ui 的样式
 import $ from 'jquery'; //引入JQuery
 import axios from '@/services/request.js'; //重新定义axios,向里面添加一些参数
 import '@/services/requestConfig.js'; //导入请求的拦截器
-import '@/utils/rem.js'; //rem单位的使用
+// import '@/utils/rem.js'; //rem单位的使用
 
 import '@/assets/common.css'; //公共样式
 import "@/assets/font/iconfont.css"; //引用公共icon库
 // import popUpComponent from "@/components/popUpComponent/popUpComponent.js"; // 公共弹框样式
 // import previewComponent from "@/components/previewComponent/previewComponent.js"; // 公共图片视频预览
-import "@/utils/command.js"; // 自定义指令
+// import "@/utils/command.js"; // 自定义指令
 import {message} from "@/utils/resetMessage";
 
 import mynavbar from '@/components/mynavbar/mynavbar.vue'
+import 'amfe-flexible';	//自动设置font-size的基准值
 // import checkPermission from "@/utils/permission";
 
 Vue.use(ElementUI); //导入ele-ui
@@ -27,6 +28,7 @@ Vue.component('mynavbar', mynavbar)
 window.$bus = new Vue(); //定义一个事件总线对象-方便组件通讯
 window.axios = axios;
 window.$ = $;
+Vue.prototype.$http = axios;
 Vue.prototype.axios = axios;
 // Vue.prototype.checkPermission = checkPermission; // 权限校验
 Vue.config.productionTip = false; //阻止启动生产消息
@@ -36,7 +38,7 @@ Vue.prototype.$message = message//重写提示
 import * as echarts from 'echarts'
 window.echarts = echarts
 
-console.log('***process.env***', process.env);
+console.log('***process.env***production', process.env);
 window.env = process.env.NODE_ENV;
 env = env == 'development' ? 'test2' : env;
 window.$config = api(env);

src/mixins/commonPageMethod.js

@@ -0,0 +1,120 @@
+const util = require('@/utils/util.js').default;
+// import requestConfig from '@/static/lib/requestConfig';
+export default {
+	data() {
+		return {
+		}
+	},
+	mounted() {
+		console.warn("---mounted---",this.pvId,this.$route.meta.keepAlive)
+		if(this.pvId && !this.$route.meta.keepAlive){
+			window.removeEventListener('beforeunload', this.pvCloseHandle);
+			window.removeEventListener('visibilitychange', this.visibilitychange);
+			window.currentPage = this;
+			if(this.starRender && typeof(this.starRender)==='function'){
+				this.starRender()
+			}
+			let param = {
+				type: 'PV',
+				pvId: this.pvId,
+				locusBehaviorName: this.locusBehaviorName,
+				pvCurPageName: this.pvCurPageName,
+			};
+			util.trackRequest(param);//发送统一PV埋点
+			window.addEventListener('beforeunload', this.pvCloseHandle);
+			window.addEventListener('visibilitychange', this.visibilitychange);
+		}
+	},
+	//页面销毁时，注销监听程序|返回上一页，去往下一页等
+	destroyed(){
+		window.removeEventListener('beforeunload', this.pvCloseHandle);
+		window.removeEventListener('visibilitychange', this.visibilitychange);
+	},
+	// beforeDestroy() {
+	// 	console.warn("---beforeDestroy---")
+	// 	this.pvCloseHandle()
+	// },
+	// /**
+	//  * 生命周期函数--监听页面隐藏
+	//  */
+	// onHide: function() {
+	// 	console.warn("---onhide---")
+	// 	this.pvCloseHandle()
+	// },
+	// beforeUpdate() {
+	// 	console.warn("beforeUpdate");
+	// 	// 移除visibilitychange事件监听器
+	// 	window.removeEventListener('visibilitychange', this.visibilitychange);
+	// },
+	beforeRouteLeave(to, from, next) {
+		console.warn("router:beforeRouteLeave:",from.name);
+		// 在离开当前路由前执行的方法
+		// 例如保存表单数据、清理定时器等操作
+		this.pvCloseHandle();
+		if(this.stopRender && typeof(this.stopRender)==='function'){
+			this.stopRender();//停止webgl的渲染
+		}
+		window.removeEventListener('beforeunload', this.pvCloseHandle);//注销监听刷新事件
+		window.removeEventListener('visibilitychange', this.visibilitychange);
+		next();
+	},
+	beforeRouteEnter(to, from, next) {
+		console.warn("router:beforeRouteEnter:",to.name,to);
+		next();
+	},
+	activated(){
+		console.warn("activated:",this.pvId); 
+		if(this.pvId && this.$route.meta.keepAlive){
+			window.removeEventListener('beforeunload', this.pvCloseHandle);
+			window.removeEventListener('visibilitychange', this.visibilitychange);
+			window.currentPage = this;
+			if(this.starRender && typeof(this.starRender)==='function'){
+				this.starRender()
+			}
+			let param = {
+				type: 'PV',
+				pvId: this.pvId,
+				locusBehaviorName: this.locusBehaviorName,
+				pvCurPageName: this.pvCurPageName,
+			};
+			util.trackRequest(param);//发送统一PV埋点
+			window.addEventListener('beforeunload', this.pvCloseHandle);
+			window.addEventListener('visibilitychange', this.visibilitychange);
+		}
+	},
+	methods: {
+		visibilitychange(){
+			console.warn("visibilitychange");
+			if (document.visibilityState !== 'visible') { // 离开页面
+				if(this.stopRender && typeof(this.stopRender)==='function'){
+					this.stopRender();//停止webgl的渲染
+				}
+				this.pvCloseHandle()
+			} else { // 进入页面
+				this.pvShowHandle()
+			}
+		},
+		pvShowHandle(){
+			if(this.pvId){
+				let param = {
+					type: 'PV',
+					pvId: this.pvId,
+					locusBehaviorName: this.locusBehaviorName,
+					pvCurPageName: this.pvCurPageName,
+				};
+				util.trackRequest(param);//发送统一PV埋点
+			}
+		},
+		pvCloseHandle(){
+			if(this.pvId){
+				let param = {
+					type: 'PV',
+					pvId: this.pvId + '_close',
+					pvCurPageName: this.pvCurPageName,
+					locusBehaviorName: this.locusBehaviorName,
+				};
+				util.trackRequest(param);
+			}
+		},
+	}
+}

src/mixins/floorMethod.js

@@ -30,12 +30,15 @@ export default {
 			let comlist = list.filter(it=>it.spaceType!=14);//过滤花园的空间
 			this.loaderCommonSpace(this.gltfSpaceUrl,comlist,1);
 			let arrlist = list.filter(it=>it.spaceType==14);//花园的空间
-			this.loaderCommonSpace(this.gltfSpace1Url,arrlist,2);
+			// this.loaderCommonSpace(this.gltfSpace1Url,arrlist,2);
+			if(arrlist && arrlist.length>0){
+				this.loaderGraseSpace(list);//加载草地的模型-所有地块都添加，填补房间里面的
+			}
 		},
 		loaderCommonSpace(gltfSpaceUrl,list,type=1){
 			var that = this;
 			this.loader.load(gltfSpaceUrl,  ( gltf ) => {
-				console.log("地板模型加载成功",list)
+				console.log("地板模型加载成功")
 				// gltf.scene.receiveShadow = true;//材质是否接收阴影
 				gltf.scene.traverse((child)=> {
 					if (child.isMesh && child.visible) {
@@ -110,55 +113,75 @@ export default {
 							const planeMesh = new THREE.Mesh(planeGeometry, planeMaterial)
 							planeMesh.rotation.x =  Math.PI / 2 ;  // 旋转 180 度
 							planeMesh.position.set(positionX, 2.8, -positionY);
-							planeMesh.userType = "mesh";
+							planeMesh.userType = "mesh"
+							const spaceObj = {
+								spaceId:obj.spaceId,
+								spaceWidth:obj.spaceWidth,
+								spaceHeight:obj.spaceHeight
+							}
+							planeMesh.userData = spaceObj;
 							that.scene.add(planeMesh);
+							that.gltfSpaceRoofs.push(planeMesh);
 						}
 					})
 				}
 			});
 		},
-		//修改当前空间的面积大小
-		changeSpacesAnimOld(curSpace){
-			// 寻找地板
-			const cube = this.gltfSpaces.find((item)=>{
-			    return item.spaceId == curSpace.spaceId;
-			})
-			console.log("空间移动目标",cube.spaceId, JSON.stringify(cube.position),JSON.stringify(cube.scale),curSpace.toScaleX, curSpace.toScaleZ, curSpace.toPx, curSpace.toPz);
-			//获取地板模型的geometry实例
-			cube.instancedMeshIndexList.forEach(instanced=>{
-				let _index = instanced.instancedMeshIndex;//第一个geometry实例 在 全局InstancedMesh实例的位置
-				let instancedMesh = this.instancedSpaceMeshList[_index];//获取具体的网格实例
-				let stratMatrix = new THREE.Matrix4();//定义一个四维矩阵
-				instancedMesh.getMatrixAt(instanced.instancedAtIndex,stratMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
+		//草地加载
+		loaderGraseSpace(list){
+			let glbWidth = 300;
+			let glbHeight = 300;
+			var that = this;
+			console.log("草地模型加载成功")
+			//将模型添加到场景中
+			let texture = new THREE.TextureLoader().load("https://dm.static.elab-plus.com/miniProgram/grass.jpg");
+			// let texture = new THREE.TextureLoader().load( "https://dm.static.elab-plus.com/miniProgram/Avatar_male.png" );
+			texture.wrapS = THREE.RepeatWrapping;
+			texture.wrapT = THREE.RepeatWrapping;
+			
+			list && list.forEach(obj=>{
+				// 暂时手动过滤 2楼 儿童房和次卫 不添加草地
+				if((obj.spaceId == 582 && obj.spaceName == "儿童房") || (obj.spaceId == 388 && obj.spaceName == "次卫")){
+					return
+				}
+
+				let positionX = obj.centerX / 100;
+				let positionY = obj.centerY / 100;
+				let scaleX = obj.spaceWidth / 100;
+				let scaleY = obj.spaceHeight / 100;
 				
-				let endMatrix = stratMatrix.clone();//复制一个四维矩阵 
-				let scaleMatrix = new THREE.Matrix4();//定义一个缩放变化矩阵
-				let panMatrix = new THREE.Matrix4();//定义一个平移变化矩阵
+				texture = texture.clone();
+				//使用纹理贴图材质
+				texture.repeat.set(scaleX, scaleY);
 				
-				scaleMatrix.makeScale(curSpace.toScaleX / cube.scale.x,1,curSpace.toScaleZ / cube.scale.z);		//获得缩放变化矩阵
-				panMatrix.makeTranslation(curSpace.toPx - cube.position.x,0,curSpace.toPz - cube.position.z);	//获得平移变化矩阵
-				endMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的矩阵
-				// console.warn("***drawModel-isAnimate-space***",JSON.stringify(endMatrix1),JSON.stringify(endMatrix),JSON.stringify(stratMatrix));
-				var tween = new TWEEN.Tween(stratMatrix.elements)
-				.to(endMatrix.elements, 2000)
-				.easing(TWEEN.Easing.Quadratic.InOut)
-				.onUpdate((matrixWorld)=> {
-					let m4 = new THREE.Matrix4();//定义一个四维矩阵
-					m4.set(...matrixWorld);//注意：四维矩阵的显示和实际计算的行列优先规则不同
-					instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
-					instancedMesh.setMatrixAt(instanced.instancedAtIndex,m4.transpose());//更新几何体的世界矩阵
-				}).onComplete(()=>{
-					instancedMesh.setMatrixAt(instanced.instancedAtIndex,endMatrix);//更新几何体的世界矩阵
-					this.tweenCameraAnmaChange(false)
-				});
-				// 开始动画
-				tween.start();
-				this.tweenCameraAnmaChange(true)
-				cube.position.x = curSpace.toPx;
-				cube.position.z = curSpace.toPz;
-				cube.scale.x = curSpace.toScaleX;
-				cube.scale.z = curSpace.toScaleZ;
-			});
+				// let geometry = new THREE.PlaneGeometry(obj.spaceWidth/100, obj.spaceHeight/100);
+				// let material = new THREE.MeshBasicMaterial({ map: texture });
+				// let cube = new THREE.Mesh(geometry, material);
+				let geometry = new THREE.BoxGeometry(obj.spaceWidth/100, 0.1, obj.spaceHeight/100);
+				let colorMaterial = new THREE.MeshBasicMaterial({color: 0x626F44}); // 创建纯色材质对象
+				let material = new THREE.MeshBasicMaterial({ map: texture });
+				let cube = new THREE.Mesh(geometry, [colorMaterial, colorMaterial, material, colorMaterial, colorMaterial, colorMaterial]); // 使用 BoxGeometry 和纯色材质创建 Mesh 对象
+				
+				cube.name = "地板";
+				cube.userType = "mesh";
+				cube.userData = obj;//位置数据
+				// 设置位置，旋转，缩放
+				cube.position.set(positionX, -0.11, -positionY);
+				// cube.rotation.x = -Math.PI / 2 ;  // 旋转 180 度 PlaneGeometry 生效
+				// cube.receiveShadow = true;//材质是否接收阴影
+				
+				//注释掉，不让草地进入空间列表中，不触发空间变化的动画过程，规避掉动画过程中的问题
+				// let md = {
+				// 	spaceId:obj.spaceId,//模型实例的唯一标识
+				// 	spaceName:obj.spaceName,//几何体的id
+				// 	spaceType:obj.spaceType,
+				// 	position:cube.position,
+				// 	scale:cube.scale,
+				// 	isSizeLock:obj.isSizeLock,
+				// };
+				// that.gltfSpaces.push(md);
+				that.scene.add(cube);
+			})
 		},
 		//修改当前空间的面积大小-动画方案2
 		changeSpacesAnim(curSpace){
@@ -178,76 +201,114 @@ export default {
 			let toPz = curSpace.toPz;
 			let toScaleX = curSpace.toScaleX;
 			let toScaleZ = curSpace.toScaleZ;
-			
-			let spaceInitMatrix = [];//空间动画时的初始变换矩阵
-			cube.instancedMeshIndexList.forEach(instanced=>{
-				let _index = instanced.instancedMeshIndex;//geometry实例 在 全局InstancedMesh实例的位置
-				let instancedMesh = this.instancedSpaceMeshList[_index];//获取具体的网格实例
-				let startMatrix = new THREE.Matrix4();//定义一个四维矩阵
-				instancedMesh.getMatrixAt(instanced.instancedAtIndex,startMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
-				spaceInitMatrix.push({
-					index:_index,
-					matrix:startMatrix.clone(),
-					color:instancedMesh.material.color.clone(),
-				})
-			});
-			// console.warn("***cube***",cube.spaceId,Date.now(),JSON.stringify(spaceInitMatrix[0].matrix))
-			var tween = new TWEEN.Tween({
-				x: cube.position.x,
-				z: cube.position.z,
-				sx:cube.scale.x,
-				sz:cube.scale.z
-			})
-			.to({
-				x: curSpace.toPx,
-				z: curSpace.toPz,
-				sx:curSpace.toScaleX,
-				sz:curSpace.toScaleZ
-			}, 2000)
-			.easing(TWEEN.Easing.Quadratic.InOut)
-			.onUpdate((object)=> {
-				//获取地板模型的geometry实例
+			if(cube.instancedMeshIndexList){
+				let spaceInitMatrix = [];//空间动画时的初始变换矩阵
 				cube.instancedMeshIndexList.forEach(instanced=>{
-					let _index = instanced.instancedMeshIndex;//第一个geometry实例 在 全局InstancedMesh实例的位置
+					let _index = instanced.instancedMeshIndex;//geometry实例 在 全局InstancedMesh实例的位置
 					let instancedMesh = this.instancedSpaceMeshList[_index];//获取具体的网格实例
-					//获取对象实例的初始变换矩阵
-					let tmp = spaceInitMatrix.find(it=>it.index==_index);
-					let stratMatrix = tmp.matrix.clone();	//获取初始变换矩阵
-					let scaleMatrix = new THREE.Matrix4();	//定义一个缩放变化矩阵
-					let panMatrix = new THREE.Matrix4();	//定义一个平移变化矩阵
-					
-					scaleMatrix.makeScale(object.sx / scaleX,1,object.sz / scaleZ);	//获得缩放变化矩阵
-					panMatrix.makeTranslation(object.x - x,0,object.z - z);	//获得平移变化矩阵
-					stratMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
-					instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
-					instancedMesh.setMatrixAt(instanced.instancedAtIndex,stratMatrix);//更新几何体的世界矩阵
-					if(this.curSpaceObj.spaceId==cube.spaceId){//当前选中的空间才变化颜色
-						instancedMesh.instanceColor.needsUpdate = true;//打开颜色修改开关,不开，颜色是不能修改额
-						let color = new THREE.Color(0xFF9F40); // 使用sRGB颜色值
-						// color.convertSRGBToLinear(); // 将颜色值转换为线性颜色值
-						instancedMesh.setColorAt(instanced.instancedAtIndex, color);//修改这个几何体的颜色
-					}
+					let startMatrix = new THREE.Matrix4();//定义一个四维矩阵
+					instancedMesh.getMatrixAt(instanced.instancedAtIndex,startMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
+					spaceInitMatrix.push({
+						index:_index,
+						matrix:startMatrix.clone(),
+						color:instancedMesh.material.color.clone(),
+					})
 				});
-			}).onComplete(()=>{//这个回调很可能会很慢
-				this.tweenCameraAnmaChange(false);
-				console.warn("***changeSpacesAnim-over***")
-				if(this.curSpaceObj.spaceId==cube.spaceId){//当前选中的空间才恢复颜色
+				// console.warn("***cube***",cube.spaceId,Date.now(),JSON.stringify(spaceInitMatrix[0].matrix))
+				var tween = new TWEEN.Tween({
+					x: cube.position.x,
+					z: cube.position.z,
+					sx:cube.scale.x,
+					sz:cube.scale.z
+				})
+				.to({
+					x: curSpace.toPx,
+					z: curSpace.toPz,
+					sx:curSpace.toScaleX,
+					sz:curSpace.toScaleZ
+				}, 2000)
+				.easing(TWEEN.Easing.Quadratic.InOut)
+				.onUpdate((object)=> {
+					//获取地板模型的geometry实例
 					cube.instancedMeshIndexList.forEach(instanced=>{
-						let _index = instanced.instancedMeshIndex;//第一个geometry实例 在 全局Instance
+						let _index = instanced.instancedMeshIndex;//第一个geometry实例 在 全局InstancedMesh实例的位置
 						let instancedMesh = this.instancedSpaceMeshList[_index];//获取具体的网格实例
+						//获取对象实例的初始变换矩阵
 						let tmp = spaceInitMatrix.find(it=>it.index==_index);
-						instancedMesh.instanceColor.needsUpdate = true;//打开颜色修改开关,不开，颜色是不能修改额
-						instancedMesh.setColorAt(instanced.instancedAtIndex, tmp.color);//修改这个几何体的颜色
+						let stratMatrix = tmp.matrix.clone();	//获取初始变换矩阵
+						let scaleMatrix = new THREE.Matrix4();	//定义一个缩放变化矩阵
+						let panMatrix = new THREE.Matrix4();	//定义一个平移变化矩阵
+						
+						scaleMatrix.makeScale(object.sx / scaleX,1,object.sz / scaleZ);	//获得缩放变化矩阵
+						panMatrix.makeTranslation(object.x - x,0,object.z - z);	//获得平移变化矩阵
+						stratMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
+						instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
+						instancedMesh.setMatrixAt(instanced.instancedAtIndex,stratMatrix);//更新几何体的世界矩阵
+						if(this.curSpaceObj.spaceId==cube.spaceId){//当前选中的空间才变化颜色
+							instancedMesh.instanceColor.needsUpdate = true;//打开颜色修改开关,不开，颜色是不能修改额
+							let color = new THREE.Color(0xFF9F40); // 使用sRGB颜色值
+							// color.convertSRGBToLinear(); // 将颜色值转换为线性颜色值
+							instancedMesh.setColorAt(instanced.instancedAtIndex, color);//修改这个几何体的颜色
+						}
 					});
-				}
-			});
-			// 开始动画
-			tween.start();
-			this.tweenCameraAnmaChange(true)
-			cube.position.x = curSpace.toPx;
-			cube.position.z = curSpace.toPz;
-			cube.scale.x = curSpace.toScaleX;
-			cube.scale.z = curSpace.toScaleZ;
+				}).onComplete(()=>{//这个回调很可能会很慢
+					this.tweenCameraAnmaChange(false);
+					console.warn("***changeSpacesAnim-over***")
+					if(this.curSpaceObj.spaceId==cube.spaceId){//当前选中的空间才恢复颜色
+						cube.instancedMeshIndexList.forEach(instanced=>{
+							let _index = instanced.instancedMeshIndex;//第一个geometry实例 在 全局Instance
+							let instancedMesh = this.instancedSpaceMeshList[_index];//获取具体的网格实例
+							let tmp = spaceInitMatrix.find(it=>it.index==_index);
+							instancedMesh.instanceColor.needsUpdate = true;//打开颜色修改开关,不开，颜色是不能修改额
+							instancedMesh.setColorAt(instanced.instancedAtIndex, tmp.color);//修改这个几何体的颜色
+						});
+					}
+				});
+				// 开始动画
+				tween.start();
+				this.tweenCameraAnmaChange(true)
+				cube.position.x = curSpace.toPx;
+				cube.position.z = curSpace.toPz;
+				cube.scale.x = curSpace.toScaleX;
+				cube.scale.z = curSpace.toScaleZ;
+			}else{//有点问题规避下
+				// 空间动画
+				var tween = new TWEEN.Tween({
+					x: scaleX, 
+					z: scaleZ, 
+					px:x,
+					pz:z,
+				})
+				.to({
+					x: toScaleX,
+					z: toScaleZ,
+					px:toPx,
+					pz:toPz,
+				}, 2000)
+				.easing(TWEEN.Easing.Quadratic.InOut)
+				.onUpdate((object)=> {
+					cube.scale.x = object.x;
+					cube.scale.z = object.z;
+					cube.position.x = object.px;
+					cube.position.z = object.pz;
+				});
+				// 开始动画
+				tween.start();
+			}
+
+			
+			// 屋顶尺寸调整
+			const cubeRoof = this.gltfSpaceRoofs.find((item)=>{
+			    return item.userData.spaceId == curSpace.spaceId;
+			})
+			if(cubeRoof){
+				let roofScaleX =  curSpace.spaceObj.spaceWidth / cubeRoof.userData.spaceWidth
+				let roofScaleY =  curSpace.spaceObj.spaceHeight / cubeRoof.userData.spaceHeight
+				// console.log("屋顶尺寸变化", curSpace.spaceObj, cubeRoof, roofScaleX, roofScaleY)
+				cubeRoof.scale.set(roofScaleX,roofScaleY,1);//缩小为原来0.5倍
+				cubeRoof.position.x = toPx;
+				cubeRoof.position.z = toPz;
+			}
 		},
 		//所有空间整体缩放-同时同步到数据里面
 		allSpaceScale(){

src/mixins/loadModel - 副本.js

@@ -2,7 +2,9 @@ var app = getApp(); //获取应用实例
 const util = require('@/static/utils/util.js');
 const config = require('@/static/config.js');
 import modelData from '@/webgl/static/layoutModelData.js';
-// import requestConfig from '@/services/requestConfig.js';
+import globlShowModel from '@/webgl/static/globlShowModel.js';
+import requestConfig from '@/static/lib/requestConfig';
+import { DRACOLoader } from '@/webgl/jsm/loaders/DRACOLoader.js';
 const THREE = requirePlugin('ThreeX');
 // import { TWEEN } from '@/webgl/jsm/libs/tween.module.min.js';
 export default {
@@ -12,17 +14,20 @@ export default {
 			instancedFurList:[],
 			arrFrunList:[],
 			promise_list:[],
-			loadFurPromise: new Promise((resolve) => {
-			    this.loadedCompleteFun = function() {
-			        console.log('家具模型接口结束');
-			        resolve()
-			    }
-			}),
+			dracoLoader:null,
+			type:1,
+			tmpList:[],
+			realList:[],
+			changeLayouts:[]
 		}
 	},
 	watch: {},
-	onReady() {
-
+	mounted() {
+		console.warn("***loadmodel-mounted****")
+		this.dracoLoader = new DRACOLoader();
+		this.dracoLoader.setDecoderPath('/webgl/draco/gltf/');
+		this.dracoLoader.setDecoderConfig( { type: 'js' } );
+		this.dracoLoader.preload();
 	},
 	methods: {
 		// 设置空间数组的墙体信息 
@@ -50,50 +55,57 @@ export default {
 				spaceWallInfo.wallS = wallSIndex == -1 ? false : true;
 				element.spaceWallInfo = spaceWallInfo;
 			}
-			await this.loadFurPromise;//等待解析分享者参数结束
-			this.$nextTick(() => {
-				this.calculateLayoutModelSize() // 计算模型的位置
-			})
 		},
 		// 批量获取空间模型信息
-		async getOverallArrangementDetailsList() {
+		async getOverallArrangementDetailsList(type=1) {
 			// 设置空间数组的墙体信息
 			// this.setSpaceListWallInfo();
+			this.type = type;//加载类型，1空间加载 2 全局精简加载
 			let arr = this.spaceList.map(it => it.layoutId).filter(it => it != 0);
 			let parmas = {
 				ids: arr,
 			};
-			this.loadFurPromise = new Promise((resolve, reject) => {
-				this.loadedCompleteFun = function() {
-				    console.log('家具模型接口结束');
-				    resolve()
-				}
-			})
+
+			// 默认的布局
 			let res = await requestConfig("getOverallArrangementDetailsList", parmas);
 			if (!res.success || !res.list || res.list.length == 0) {
 				return false;
 			}
 			this.promise_list = [];
 			this.arrFrunList = res.list;
-			this.furnHandle();
+
+			console.log("空间布局数据", this.arrFrunList)
+			// 通过默认布局
+			this.furnHandle(this.arrFrunList);
 		},
 		//拆分家具模型加载逻辑
-		furnHandle(){
+		furnHandle(arrFrunList){
+
+			if(!arrFrunList || arrFrunList.length == 0){
+				return
+			}
 			let startTime = new Date().getTime();
 			let tmpList = [];//临时数据
 			this.gltfLayouts = []; //模型列表，所有空间里面的每个模型(家具)对应一条记录
 			
 			let allowSpaceId = [this.curSpaceObj.spaceId];
-			if(this.curSpaceObj.spaceId==758){//二层主卧特殊处理
-				allowSpaceId.push(735);//休闲小客厅
-			}
-			//花园类型的添加到家具加载目录里面
-			// this.spaceList.forEach(it=>{
-			// 	if(it.spaceType==14){
-			// 		allowSpaceId.push(it.spaceId);
-			// 	}
-			// })
-			this.arrFrunList.forEach(signel => {
+			if(this.type == 2){//全局精简模型;需要的是所有空间的模型
+				allowSpaceId = this.spaceList.map(it=>it.spaceId)
+			}else{//空间模型模式
+				allowSpaceId = [this.curSpaceObj.spaceId];
+				if(this.curSpaceObj.spaceId==758){//二层主卧特殊处理
+					allowSpaceId.push(735);//休闲小客厅
+				}
+				//花园类型的添加到家具加载目录里面
+				// this.spaceList.forEach(it=>{
+				// 	if(it.spaceType==14){
+				// 		allowSpaceId.push(it.spaceId);
+				// 	}
+				// })
+			}
+			// allowSpaceId = [388];//模型有警告，需要看下
+			console.log("重新加载布局", arrFrunList,this.spaceList,this.gltfLayouts);
+			arrFrunList.forEach(signel => {
 				let spaceId = this.spaceList.find(it => it.layoutId == signel.id).spaceId;
 				if(allowSpaceId.includes(spaceId)){//只加载允许的空间的布局，其他不加载
 					let md = JSON.parse(signel.modelJson); //获取布局里面的模型信息
@@ -103,44 +115,84 @@ export default {
 						let item = md.modelData[i];
 						item.spaceId = spaceId;
 						item.layoutId = signel.id;
-						// tmpList.push(item);
-						this.promise_list.push(
-							new Promise((resolve, reject) => {
-								this.loadLayoutModelsOld(item , resolve);
-							})
-						)
+						item.h5Id = signel.id+""+item.id;//唯一标识
+						if(item.modelName=='BP_furnitureBase_C'){
+							continue;
+						}else{
+							tmpList.push(item);
+						}
 					}
 				}
-				
 			})
-			// let realFurArr = this.preFurnitureData(tmpList);//统一处理家具模型
-			// let arrLength = realFurArr.length;
-			// console.log("***realFurArr***", realFurArr);
-			// realFurArr && realFurArr.forEach((item,index) => {
-			// 	this.promise_list.push(
-			// 		new Promise((resolve, reject) => {
-			// 			this.loadLayoutModels(item, arrLength , resolve);
-			// 		})
-			// 	)
-			// });
+			this.tmpList = tmpList;
+			if(this.type==2){//全局精简模型;需要的是所有空间的模型
+				this.fliterList(tmpList);
+				console.warn("***fliterList***",this.realList.length ,this.realList);
+				tmpList = this.realList;
+			}
+			let realFurArr = this.preFurnitureData(tmpList);//统一处理家具模型
+			this.calculateLayoutModelSize() // 提前计算模型的位置
+			console.log("***realFurArr***", realFurArr,this.gltfLayouts);
+			
+			realFurArr && realFurArr.forEach((item,index) => {
+				this.promise_list.push(
+					new Promise((resolve, reject) => {
+						this.loadLayoutModels(item, resolve);
+					})
+				)
+			});
 			Promise.all(this.promise_list).then(() => {
 				let endTime = new Date().getTime();
-				console.log("家具模型全部加载完成，时间：", endTime - startTime);
-				this.loadedCompleteFun()
-				// this.$nextTick(() => {
-				// 	this.calculateLayoutModelSize() // 计算模型的位置
-				// })
+				console.log("家具模型全部加载完成，时间：", endTime - startTime, this.gltfLayouts);
+			})
+		},
+		//过滤掉不需要的家具
+		fliterList(list){
+			this.realList = [];
+			//找到直接的家具模型
+			list && list.forEach((mod)=>{
+				let name = mod.modelName.substring(0,mod.modelName.length-2);
+				if(globlShowModel.includes(name)){
+					this.realList.push(mod);
+				}
+			})
+			this.realList.forEach((ref)=>{
+				this.recursionFliter(ref)
 			})
 		},
+		//递归处理不需要的家具
+		recursionFliter(item){
+			let _list = [];//
+			if(parseInt(item.referenceModelBottom) > 0){
+				_list.push(item.referenceModelBottom)
+			}
+			if(parseInt(item.referenceModelLeft) > 0){
+				_list.push(item.referenceModelLeft)
+			}
+			if(parseInt(item.referenceModelRight) > 0){
+				_list.push(item.referenceModelRight)
+			}
+			if(parseInt(item.referenceModelTop) > 0){
+				_list.push(item.referenceModelTop)
+			}
+			if(_list.length==0){
+				return false;
+			}else{
+				this.tmpList.forEach(tmp=>{
+					if(_list.includes(tmp.id)){
+						if(!this.realList.find(it=>it.h5Id==tmp.h5Id)){
+							this.realList.push(tmp);
+							this.recursionFliter(tmp);
+						}
+					}
+				})
+			}
+			
+		},
 		//预处理需要加载墙体模型的数据-减少模型请求数
 		preFurnitureData(list){
 			let realFurnitureArr = [];//家具列表
-			let dataList = [];
-			dataList = list.map(item=>{
-				let curSpace = this.spaceList.find(space=>space.spaceId==item.spaceId);
-				return this.resetModelParameters(curSpace, item);
-			})
-			dataList && dataList.forEach((item, index) => {
+			list && list.forEach((item, index) => {
 				item.uniId = Date.now() + index;//唯一标识
 				//获取墙体对应的gltb模型的相关信息
 				let modelName = item.modelName;
@@ -159,77 +211,75 @@ export default {
 					}else{
 						object.list.push(item);
 					}
+					
+					let position = new THREE.Vector3();//当前几何体的位置参数
+					let scale = new THREE.Vector3();//当前几何体的缩放参数
+					let rotation = new THREE.Vector3();//当前几何体的缩放参数
+					let md = {
+						uniId:item.uniId,//家具模型实例的唯一标识
+						spaceId:item.spaceId,
+						id:item.id,
+						userData:item,
+						position:position,
+						scale:scale,
+						rotation:rotation,
+						loaded:false,
+					};
+					this.gltfLayouts.push(md);
 				}
 			});
 			return realFurnitureArr;
 		},
 		//加载家具模型-实例化方案
-		loadLayoutModels(realData, arrLength, resolve){
+		loadLayoutModels(realData, resolve){
 		    var that = this;
 			if(!realData.url){
 				console.warn("***家具模型不存在***",realData);
 				resolve();
 				return false;
 			}
-			that.loader.load(realData.url, ( gltf ) => {
-				// that.progress = parseInt(100/arrLength) + that.progress;
-				// if(that.progress>100){
-				// 	that.progress = 100;
-				// }
-				// that.$refs.myLoading.showLoading("加载中..." + that.progress+'%')
-				// console.log("家具加载成功",that.progress,realData,gltf);
-				gltf.scene.traverse((child)=> {
-					if (child.isMesh && child.visible) {
-						let instancedMesh = new THREE.InstancedMesh(child.geometry.clone(), child.material.clone(), realData.list.length);
-						this.instancedFurList.push(instancedMesh);
-						//realData 该模型被重复使用时的每一次的形变参数等
-						realData.list && realData.list.forEach((it,i)=>{
-							let rotationY = Math.PI / 2;
-							if (parseFloat(it.rotation) == 90) {
-								rotationY = 0;
-							}
-							if (parseFloat(it.rotation) == 180) {
-								rotationY = -Math.PI / 2;
-							}
-							if (parseFloat(it.rotation) == -90) {
-								rotationY = -Math.PI;
-							}
-							gltf.scene.rotation.y = rotationY;
-							gltf.scene.updateMatrixWorld();//更新世界坐标-这样，子模型也同步更新了
-							instancedMesh.setMatrixAt(i, child.matrixWorld);
-							instancedMesh.instanceMatrix.needsUpdate = true;
-							// instancedMesh.setColorAt(i, child.material.color);
-							// instancedMesh.instanceColor.needsUpdate = true;
-							let gltfFurn = that.gltfLayouts.find(itme=>itme.uniId==it.uniId);//判断是否已经添加过
-							if(!gltfFurn){
-								let position = new THREE.Vector3();//当前几何体的位置参数
-								let scale = new THREE.Vector3();//当前几何体的缩放参数
-								let rotation = new THREE.Vector3();//当前几何体的缩放参数
-								let md = {
-									uniId:it.uniId,//家具模型实例的唯一标识
-									spaceId:it.spaceId,
-									id:it.id,
-									instancedMeshIndexList:[//标识网格实例数组的序号 以及 当前几何体 在网格实例的序号
+			if(realData.name.includes('BP_XSPACE_deng_01')){//灯光
+				resolve();
+			}else{
+				that.loader.setDRACOLoader(this.dracoLoader);
+				that.loader.load(realData.url, ( gltf ) => {
+					gltf.scene.traverse((child)=> {
+						if (child.isMesh && child.visible) {
+							let instancedMesh = new THREE.InstancedMesh(child.geometry.clone(), child.material.clone(), realData.list.length);
+							this.instancedFurList.push(instancedMesh);
+							//realData 该模型被重复使用时的每一次的形变参数等
+							realData.list && realData.list.forEach((it,i)=>{
+								let gltfFurn = that.gltfLayouts.find(itme=>itme.uniId==it.uniId);//判断是否已经添加过
+								gltf.scene.rotation.y = gltfFurn.rotation.y;
+								gltf.scene.position.set(gltfFurn.position.x,0,gltfFurn.position.z);
+								gltf.scene.scale.set(gltfFurn.scale.x,1,gltfFurn.scale.z);
+								gltf.scene.updateMatrixWorld();//更新世界坐标-这样，子模型也同步更新了
+								instancedMesh.setMatrixAt(i, child.matrixWorld);
+								instancedMesh.instanceMatrix.needsUpdate = true;
+								gltfFurn.loaded = true;
+								if(!gltfFurn.instancedMeshIndexList){//标识网格实例数组的序号 以及 当前几何体 在网格实例的序号
+									gltfFurn.instancedMeshIndexList = [
 										{instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i},
-									],
-									userData:it,
-									position:position,
-									scale:scale,
-									rotation:rotation,
-									loaded:false,
-								};
-								that.gltfLayouts.push(md);
+									]
+								}else{
+									gltfFurn.instancedMeshIndexList.push({
+										instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i
+									})
+								}
+							})
+							instancedMesh.userType = "layoutMesh";
+							if(realData.name.includes("BP_L_carpet01")){//地毯接收阴影
+								instancedMesh.receiveShadow = true;//对象是否接收阴影
 							}else{
-								gltfFurn.instancedMeshIndexList.push({
-									instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i
-								})
+								instancedMesh.castShadow = true;//对象是否产生阴影
 							}
-						})
-						instancedMesh.userType = "layoutMesh";
-					}
+							this.scene.add(instancedMesh);//添加到场景中
+						}
+					});
+					resolve();
 				});
-				resolve();
-			});
+			}
+			
 		},
 		//加载模型
 		loadLayoutModelsOld(modelObj, resolve) {
@@ -256,6 +306,80 @@ export default {
 				resolve();
 			});
 		},
+		// 切换家具的显示隐藏
+		changeLayoutModelState(isShow=false){
+			console.log("移动过程中显示隐藏空间家具", this.gltfLayouts,isShow, this.leftSpaces, this.rightSpaces);
+			const changeSpaceList = this.leftSpaces.concat(this.rightSpaces); // 只改变空间尺寸变化的家具模型
+			for (let index = 0; index < changeSpaceList.length; index++) {
+				const element = changeSpaceList[index];
+				const gltfLayoutModels = this.gltfLayouts.filter(item => {
+					return element.layoutId == item.userData.layoutId && element.spaceId == item.userData.spaceId;
+				})
+				
+				if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
+					continue;
+				}
+				for (let j = 0; j < gltfLayoutModels.length; j++) {
+					const cube = gltfLayoutModels[j];
+					this.changeCubeState(cube, isShow);
+				}
+			}
+		},
+		// 显示隐藏指定cube的状态
+		changeCubeState(cube, isShow){
+			let lay = this.gltfLayouts.find(it=>it.uniId==cube.uniId);
+			if(cube.instancedMeshIndexList && cube.instancedMeshIndexList.length>0){
+				cube.instancedMeshIndexList.forEach(item=>{
+					let index = item.instancedMeshIndex;
+					let instancedMesh = this.instancedFurList[index];//网格实例对象
+					let curMeshIndex = item.instancedAtIndex;//当前家具模型在网格实例对象里面的序号
+					let stratMatrix = new THREE.Matrix4();//定义一个四维矩阵
+					instancedMesh.getMatrixAt(curMeshIndex,stratMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
+					
+					instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
+					instancedMesh.visible = isShow;
+					instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
+				})
+			}
+		},
+		deleteLayoutModel(spaceObj, layoutObj){
+			
+
+				// 删除布局数据
+				for (let index = 0; index < this.arrFrunList.length; index++) {
+					const element = this.arrFrunList[index];
+					
+				}
+				const oldLayoutIndex = this.arrFrunList.findIndex((item)=>{
+					return item.id == spaceObj.layoutId
+				})
+
+				if(oldLayoutIndex!=-1){
+					this.arrFrunList[oldLayoutIndex] = layoutObj;
+				}
+				
+				console.log("准备删除模型", spaceObj, this.gltfLayouts, this.arrFrunList);
+				const gltfLayoutModels = this.gltfLayouts.filter(item => {
+					return spaceObj.layoutId == item.userData.layoutId && spaceObj.spaceId == item.userData.spaceId;
+				})
+				
+				if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
+					return;
+				}
+				for (let j = 0; j < gltfLayoutModels.length; j++) {
+					const cube = gltfLayoutModels[j];
+
+					if(cube.instancedMeshIndexList && cube.instancedMeshIndexList.length>0){
+						cube.instancedMeshIndexList.forEach(item=>{
+							let index = item.instancedMeshIndex;
+							let instancedMesh = this.instancedFurList[index];//网格实例对象
+
+							this.scene.remove(instancedMesh);//添加到场景中
+						})
+					}
+					console.log("删除原有模型", spaceObj.layoutId, cube);
+				}
+		},
 		// 计算家具的位置
 		calculateLayoutModelSize() {
 			console.log("计算家具的位置", this.gltfLayouts);
@@ -293,6 +417,7 @@ export default {
 			let rotationY = Math.PI / 2;
 			let scaleX = 1;
 			let scaleY = 1;
+
 			// 空间尺寸
 			let spaceWidth = curSpace.spaceWidth;
 			let spaceHeight = curSpace.spaceHeight;
@@ -300,7 +425,7 @@ export default {
 			let modelWidth = cubeInfo.modelWidth;
 			let modelHeight = cubeInfo.modelHeight;
 
-			// // 判断旋转
+			// 判断旋转
 			if (parseFloat(cubeInfo.rotation) == 90) {
 				rotationY = 0;
 				// 交换尺寸
@@ -329,7 +454,7 @@ export default {
 				positionX += curSpace.spaceWallInfo.wallW ? 10 : 0;
 			}
 			if (cubeInfo.isStepAsideRight == 'true') {
-				positionX = centerX + (spaceWidth / 2 - modelHeight / 2);
+				positionX = centerX + (spaceWidth / 2 - modelWidth / 2);
 				if (parseFloat(cubeInfo.rotation) == 90 || parseFloat(cubeInfo.rotation) == -90) {
 					positionX = centerX + (spaceWidth / 2 - modelWidth / 2);
 				}
@@ -337,7 +462,7 @@ export default {
 				positionX -= curSpace.spaceWallInfo.wallE ? 10 : 0;
 			}
 			if (cubeInfo.isStepAsideTop == 'true') {
-				positionY = centerY - (spaceHeight / 2 - modelWidth / 2);
+				positionY = centerY - (spaceHeight / 2 - modelHeight / 2);
 				if (parseFloat(cubeInfo.rotation) == 90 || parseFloat(cubeInfo.rotation) == -90) {
 					positionY = centerY - (spaceHeight / 2 - modelHeight / 2);
 				}
@@ -361,6 +486,10 @@ export default {
 					return layoutModelData.id == parseInt(cubeInfo.referenceModelTop) && layoutModelData
 						.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
 				})
+				if(!referenceModel){
+					console.warn("***no-data***",cubeInfo.referenceModelTop,cubeInfo)
+					return false
+				}
 				positionY = referenceModel.position.z * 100 + (referenceModel.userData.modelHeight / 2 + cubeInfo
 					.modelHeight / 2);
 				positionY = positionY + parseFloat(cubeInfo.marginTop);
@@ -371,6 +500,10 @@ export default {
 					return layoutModelData.id == parseInt(cubeInfo.referenceModelBottom) && layoutModelData
 						.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
 				})
+				if(!referenceModel){
+					console.warn("***no-data***",cubeInfo.referenceModelBottom,cubeInfo)
+					return false
+				}
 				positionY = referenceModel.position.z * 100 - (referenceModel.userData.modelHeight / 2 + cubeInfo
 					.modelHeight / 2);
 				positionY = positionY - parseFloat(cubeInfo.marginBottom);
@@ -381,6 +514,10 @@ export default {
 					return layoutModelData.id == parseInt(cubeInfo.referenceModelLeft) && layoutModelData
 						.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
 				})
+				if(!referenceModel){
+					console.warn("***no-data***",cubeInfo.referenceModelLeft,cubeInfo)
+					return false
+				}
 				positionX = referenceModel.position.x * 100 + (referenceModel.userData.modelWidth / 2 + cubeInfo
 					.modelWidth / 2);
 				positionX = positionX + parseFloat(cubeInfo.marginLeft);
@@ -391,6 +528,10 @@ export default {
 					return layoutModelData.id == parseInt(cubeInfo.referenceModelRight) && layoutModelData
 						.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
 				})
+				if(!referenceModel){
+					console.warn("***no-data***",cubeInfo.referenceModelRight,cubeInfo)
+					return false
+				}
 				positionX = referenceModel.position.x * 100 - (referenceModel.userData.modelWidth / 2 + cubeInfo
 					.modelWidth / 2);
 				positionX = positionX - parseFloat(cubeInfo.marginRight);
@@ -548,50 +689,154 @@ export default {
 					// console.log("右边拉伸", Math.abs(parseFloat(cubeInfo.rotation)))
 				}
 
+				if(parseInt(cubeInfo.referenceModelBottom) > 0 && parseInt(cubeInfo.referenceModelTop) > 0){
+
+					// 上边惨遭物
+					const referenceModelTop = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelTop) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+					// 下边参照物
+					const referenceModelBottom = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelBottom) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+
+					const referenceModelTopPositionY = referenceModelTop.position.z * 100 + referenceModelTop.userData
+						.modelHeight / 2 + parseFloat(cubeInfo.marginTop);
+
+					const referenceModelBottomPositionY = referenceModelBottom.position.z * 100 - referenceModelBottom.userData
+						.modelHeight / 2 - parseFloat(cubeInfo.marginBottom);
+
+					const newModelHeight = Math.abs(referenceModelTopPositionY - referenceModelBottomPositionY);
+					if (Math.abs(parseFloat(cubeInfo.rotation)) == 90) {
+						scaleY = newModelHeight / modelHeight;
+					} else {
+						scaleX = newModelHeight / modelHeight;
+					}
+					positionY = referenceModelBottomPositionY - newModelHeight / 2;
+				}
+
+				if(parseInt(cubeInfo.referenceModelLeft) > 0 && parseInt(cubeInfo.referenceModelRight) > 0){
+
+					const referenceModelLeft = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelLeft) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+
+					const referenceModelRight = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelRight) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+					const referenceModelLeftPositionX = referenceModelLeft.position.x * 100 + referenceModelLeft.userData
+						.modelWidth / 2 + parseFloat(cubeInfo.marginLeft);
+					const referenceModelRightPositionX = referenceModelRight.position.x * 100 - referenceModelRight.userData
+						.modelWidth / 2 - parseFloat(cubeInfo.marginRight);
+
+					const newModelWidth = Math.abs(referenceModelLeftPositionX - referenceModelRightPositionX);
+
+					if (Math.abs(parseFloat(cubeInfo.rotation)) == 90) {
+						scaleX = newModelWidth / modelWidth;
+					} else {
+						scaleY = newModelWidth / modelWidth;
+					}
+
+					positionX = referenceModelRightPositionX - newModelWidth / 2;
+				}
+
 			}
 			// console.log("模型计算位置--", positionX, positionY)
-			// console.log("模型计算位置", cubeInfo, centerX, centerY, spaceWidth, spaceHeight, modelWidth, modelHeight, spaceId, scaleX, scaleY, rotationY)
+			console.log("模型计算位置", cubeInfo, centerX, centerY, spaceWidth, spaceHeight, modelWidth, modelHeight, spaceId, scaleX, scaleY, positionX, positionY)
 			let oldPosition = new THREE.Vector3();//当前几何体的位置参数
 			oldPosition.copy(cube.position);
 			cube.position.x = positionX / 100;
 			cube.position.z = positionY / 100;
 			cube.rotation.y = rotationY;
-			cube.scale.x = scaleX ;
+			cube.scale.x = scaleX;
 			cube.scale.z = scaleY;
-			if (!cube.parent) { //说明还没添加到场景中-旧版方法
-				this.scene.add(cube); //处理完毕后在加入场景中
-			}
-			if(scaleX>1 || scaleY>1){
-				console.warn("***scaleinfo***",cubeInfo.id,scaleX,scaleY,cubeInfo.modelName)
+			cube.scale.y = 1;
+			// if (!cube.parent) { //说明还没添加到场景中-旧版方法
+			// 	this.scene.add(cube); //处理完毕后在加入场景中
+			// }
+			// if(scaleX>1 || scaleY>1){
+			// 	console.warn("***scaleinfo***",cubeInfo.id,scaleX,scaleY,cubeInfo.modelName)
+			// }
+			if(this.type==2){//全局精简加载
+				let name = cubeInfo.modelName.substring(0, cubeInfo.modelName.length - 2);
+				if(globlShowModel.includes(name)){
+					if(cubeInfo.modelName=='BP_XSPACE_deng_01_C'){//灯光
+						this.lightHandle(cube)
+					}else{
+						this.updateInfo(cube,oldPosition,scaleX,scaleY);//实例化方法
+					}
+				}
+			}else{
+				if(cubeInfo.modelName=='BP_XSPACE_deng_01_C'){//灯光
+					this.lightHandle(cube)
+				}else{
+					this.updateInfo(cube,oldPosition,scaleX,scaleY);//实例化方法
+				}
 			}
-			// this.updateInfo(cube,oldPosition,scaleX,scaleY);//实例化方法
 		},
 		//更新家具模型到页面中
 		updateInfo(cube,oldPosition,scaleX,scaleY){
+			console.log("更新布局模型");
 			let lay = this.gltfLayouts.find(it=>it.uniId==cube.uniId);
-			cube.instancedMeshIndexList.forEach(item=>{
-				let index = item.instancedMeshIndex;
-				let instancedMesh = this.instancedFurList[index];//网格实例对象
-				let curMeshIndex = item.instancedAtIndex;//当前家具模型在网格实例对象里面的序号
-				let stratMatrix = new THREE.Matrix4();//定义一个四维矩阵
-				instancedMesh.getMatrixAt(curMeshIndex,stratMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
-				let scaleMatrix = new THREE.Matrix4();	//定义一个缩放变化矩阵
-				let panMatrix = new THREE.Matrix4();	//定义一个平移变化矩阵
-				if (!lay.loaded) { //说明还没添加到场景中
-					scaleMatrix.makeScale(scaleX,1,scaleY);	//获得缩放变化矩阵
-					panMatrix.makeTranslation(cube.position.x,0,cube.position.z);	//获得平移变化矩阵
-					stratMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
-					instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
-					instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
-					this.scene.add(instancedMesh);
-				}else{//更新形变矩阵
-					panMatrix.makeTranslation(cube.position.x - oldPosition.x,0,cube.position.z - oldPosition.z);	//获得平移变化矩阵
-					stratMatrix.premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
-					instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
-					instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
-				}
-			})
-			lay.loaded = true;
+			if(cube.instancedMeshIndexList && cube.instancedMeshIndexList.length>0){
+				cube.instancedMeshIndexList.forEach(item=>{
+					let index = item.instancedMeshIndex;
+					let instancedMesh = this.instancedFurList[index];//网格实例对象
+					let curMeshIndex = item.instancedAtIndex;//当前家具模型在网格实例对象里面的序号
+					let stratMatrix = new THREE.Matrix4();//定义一个四维矩阵
+					instancedMesh.getMatrixAt(curMeshIndex,stratMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
+					let scaleMatrix = new THREE.Matrix4();	//定义一个缩放变化矩阵
+					let panMatrix = new THREE.Matrix4();	//定义一个平移变化矩阵
+					if (!lay.loaded) { //说明还没添加到场景中
+						// scaleMatrix.makeScale(scaleX,1,scaleY);	//获得缩放变化矩阵
+						// panMatrix.makeTranslation(cube.position.x,0,cube.position.z);	//获得平移变化矩阵
+						// stratMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
+						// instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
+						// instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
+						// this.scene.add(instancedMesh);
+					}else{//更新形变矩阵
+						scaleMatrix.makeScale(scaleX, 1, scaleY);	//获得缩放变化矩阵
+						panMatrix.makeTranslation(cube.position.x - oldPosition.x,0,cube.position.z - oldPosition.z);	//获得平移变化矩阵
+						stratMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
+						instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
+						instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
+					}
+				})
+				lay.loaded = true;
+			}
+		},
+		// 空间处理光源
+		lightHandle(cube){
+			let light = this.gltfLayouts.find(it=>it.uniId==cube.uniId);
+			if(!light.loaded){
+				// 从一个点向各个方向发射的光源。一个常见的例子是模拟一个灯泡发出的光。
+				let pointLight = new THREE.PointLight(0xffd7b3, 1.5, 5, 1);
+				pointLight.position.set(cube.position.x, 1.5, cube.position.z); //default; light shining from top
+				this.scene.add(pointLight);
+				let sphereSize = 0.1;
+				let pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
+				this.scene.add( pointLightHelper);
+				
+				pointLight.castShadow = true; // default false
+				// 默认情况下光投影相机区域是一个长宽高为10x10x500的长方体区域，光源投射方向为通过坐标原点
+				pointLight.shadow.camera.left = -200; // default
+				pointLight.shadow.camera.right  = 200; // default
+				pointLight.shadow.camera.top  = 200; // default
+				pointLight.shadow.camera.bottom  = -200; // default
+				this.scene.add(pointLight);
+				
+				light.loaded = true;
+			}else{
+				
+			}
 		},
 		// 空间布局旋转镜像重置模型约束
 		resetModelParameters(curSpace, cubeInfo) {
@@ -692,5 +937,118 @@ export default {
 
 			return cubeInfo;
 		},
+		// 改变空间模型
+		changeLayoutModel(){
+
+			let changeSpaces = [];
+     
+			// 去重
+			for (let index = 0; index < this.changeSpaces.length; index++) {
+				const element = this.changeSpaces[index];
+				const findIndex = changeSpaces.findIndex((item)=>{
+					return item.spaceId == element.spaceId;
+				})
+				if(findIndex==-1){
+					const findListIndex = this.spaceList.findIndex((item)=>{
+						return item.spaceId == element.spaceId;
+					})
+					if(findListIndex !=-1){
+						changeSpaces.push(this.spaceList[findListIndex])
+					}
+					
+				}
+			}
+
+			console.log("所有变化的空间", changeSpaces)
+			this.changeLayouts = [];
+			let promise_list = [];
+
+			for (let index = 0; index < changeSpaces.length; index++) {
+				const element = changeSpaces[index];
+
+
+				const layoutObj = this.arrFrunList.find((item)=>{
+					return item.id == element.layoutId;
+				})
+				console.log("请求布局的对象", layoutObj, element);
+				if(layoutObj){
+					
+					promise_list.push(
+						new Promise((resolve, reject) => {
+							this.loadlayoutByID(layoutObj.groupType, element, resolve);
+						})
+					)
+				}
+				
+			}
+			Promise.all(promise_list).then(()=>{
+				this.$nextTick(()=>{
+					console.log("新布局替换完成");
+					this.furnHandle(this.changeLayouts);
+				})
+			})
+		},
+		async loadlayoutByID(groupType,spaceObj, resolve){
+			let param = {
+				"brandId": config.brandId,
+				"houseId": this.curHouseObj.houseId,
+				"groupType": groupType
+			}
+
+			// 默认的布局
+			let res = await requestConfig("findOverallArrangementList", param);
+			if (!res.success || !res.pageModel || res.pageModel.resultSet.length == 0) {
+				return resolve();
+			}
+
+			const groupLayouts = res.pageModel.resultSet;
+			console.log("查询指定分组的布局", groupType, groupLayouts, spaceObj.spaceWidth, spaceObj.spaceHeight)
+
+			// 根据空间的尺寸和布局的最小尺寸，筛选出合适的最大的布局
+			const layouts01 = groupLayouts.filter((item)=>{
+				return item.minWidth <= spaceObj.spaceWidth && item.minDepth <= spaceObj.spaceHeight
+			})
+			console.log("过滤适合的布局01", layouts01)
+			// 长度和宽度都满足空间尺寸
+			const layouts02 = layouts01.filter((item)=>{
+				return (item.minWidth * item.minDepth ) <= (spaceObj.spaceWidth * spaceObj.spaceHeight)
+			})
+			console.log("过滤适合的布局02", layouts02)
+
+
+			// 取布局面积最大的一个
+			let layoutObj = null
+			for (let index = 0; index < layouts02.length; index++) {
+				const element = layouts02[index];
+				if(!layoutObj){
+					layoutObj = element;
+				}else{
+					if((layoutObj.minWidth * layoutObj.minDepth) < (element.minWidth * element.minDepth)){
+						layoutObj = element;
+					}
+				}
+			}
+			console.log("找出最合适的布局", layoutObj)
+			console.log("更新空间的布局ID=", layoutObj.id)
+
+			// 合适的布局更现有布局相同
+			if(spaceObj.layoutId == layoutObj.id){
+				this.changeLayoutModelState(true); // 显示家具模型
+				return resolve()
+			}
+
+			// 更新空间的布局id
+			for (let index = 0; index < this.spaceList.length; index++) {
+				const element = this.spaceList[index];
+				if(element.spaceId == spaceObj.spaceId){
+					this.deleteLayoutModel(element, layoutObj)
+					element.layoutId = layoutObj.id
+					console.log("替换空间的布局ID", spaceObj.spaceId, layoutObj.id);
+				}
+			}
+			this.changeLayouts.push(layoutObj)
+
+			resolve()
+		}
 	}
 }

src/mixins/loadModel.js

@@ -4,6 +4,7 @@ import modelData from '@/static/layoutModelData.js';
 import globlShowModel from '@/static/globlShowModel.js';
 // import requestConfig from '@/services/requestConfig.js';
 import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js';
+import { MeshoptDecoder } from 'three/addons/libs/meshopt_decoder.module.js';
 import * as THREE from 'three';
 // import { TWEEN } from '@/webgl/jsm/libs/tween.module.min.js';
 export default {
@@ -11,27 +12,31 @@ export default {
 		return {
 			gltfLayouts: [],
 			instancedFurList:[],
+			
+			// graderGltfLayouts: [],//花园地块的模型对象
+			// graderInstancedFurList:[],//花园地块的模型
+			
 			arrFrunList:[],
 			promise_list:[],
-			// loadFurPromise: new Promise((resolve) => {
-			//     this.loadedCompleteFun = function() {
-			//         console.log('家具模型接口结束');
-			//         resolve()
-			//     }
-			// }),
 			dracoLoader:null,
 			type:1,
 			tmpList:[],
 			realList:[],
+			nextString:'_simple',//精简模型后缀
+			loadLayFlag:false,	//是否处在加载家具过程中
+			isIOS:false,
+			// lastFrunList:[],
 		}
 	},
 	watch: {},
 	mounted() {
 		console.warn("***loadmodel-mounted****")
 		this.dracoLoader = new DRACOLoader();
-		this.dracoLoader.setDecoderPath('/gltf/');
+		this.dracoLoader.setDecoderPath('./gltf/');
 		this.dracoLoader.setDecoderConfig( { type: 'js' } );
 		this.dracoLoader.preload();
+		let isIOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
+		this.isIOS = isIOS;
 	},
 	methods: {
 		// 设置空间数组的墙体信息 
@@ -59,7 +64,6 @@ export default {
 				spaceWallInfo.wallS = wallSIndex == -1 ? false : true;
 				element.spaceWallInfo = spaceWallInfo;
 			}
-			// this.loadedCompleteFun();
 		},
 		// 批量获取空间模型信息
 		async getOverallArrangementDetailsList(type=1) {
@@ -70,47 +74,76 @@ export default {
 			let parmas = {
 				ids: arr,
 			};
-			// this.loadFurPromise = new Promise((resolve, reject) => {
-			// 	this.loadedCompleteFun = function() {
-			// 		console.log('家具模型接口结束');
-			// 		resolve()
-			// 	}
-			// })
+			// 默认的布局
 			let res = await requestConfig("getOverallArrangementDetailsList", parmas);
 			if (!res.success || !res.list || res.list.length == 0) {
 				return false;
 			}
+			// let list1 = [];
+			// let list2 = [];
+			// res.list.forEach(singel=>{
+			// 	let spaceType = this.spaceList.find(it => it.layoutId == signel.id).spaceType;
+			// 	if(spaceType!=14){//花园地块
+			// 		list1.push(singel);
+			// 	}else{
+			// 		list2.push(singel);
+			// 	}
+			// });
+			
 			this.promise_list = [];
 			this.arrFrunList = res.list;
-			this.furnHandle();
+			this.gltfLayouts = []; //模型列表，所有空间里面的每个模型(家具)对应一条记录
+			// 通过默认布局
+			this.furnHandle(this.arrFrunList,[]);
+		},
+		//加载其他空间的家具模型
+		loadLastSpaceModel(){
+			if(!this.changeSpaces || this.changeSpaces.length==0){
+				return false;
+			}
+			let spaceIds = this.changeSpaces.map(it=>it.spaceId);
+			let layoutIds = this.spaceList.filter(item=>spaceIds.includes(item.spaceId)).map(it=>it.layoutId);
+			let list = this.arrFrunList.filter(item=>{
+				return !layoutIds.includes(item.id)
+			})
+			let spaceList = this.spaceList.filter(item=>{
+				return !spaceIds.includes(item.spaceId)
+			})
+			// console.warn("***layoutIds***",layoutIds,spaceIds,this.gltfLayouts)
+			this.furnHandle(list,spaceList)
+			this.changeSpaces = []
 		},
 		//拆分家具模型加载逻辑
-		furnHandle(){
+		furnHandle(arrFrunList, tmpSpaceList=[]){
+			if(!arrFrunList || arrFrunList.length == 0){
+				return
+			}
 			let startTime = new Date().getTime();
-			let tmpList = [];//临时数据
-			this.gltfLayouts = []; //模型列表，所有空间里面的每个模型(家具)对应一条记录
-			
+			let tmpList = [];//临时数据-精简模型数据
 			let allowSpaceId = [this.curSpaceObj.spaceId];
+			let curSpaceList = [];//当前空间的数据对象
 			if(this.type == 2){//全局精简模型;需要的是所有空间的模型
 				allowSpaceId = this.spaceList.map(it=>it.spaceId)
 			}else{//空间模型模式
-				allowSpaceId = [this.curSpaceObj.spaceId];
-				if(this.curSpaceObj.spaceId==758){//二层主卧特殊处理
-					allowSpaceId.push(735);//休闲小客厅
-				}
-				//花园类型的添加到家具加载目录里面
-				// this.spaceList.forEach(it=>{
-				// 	if(it.spaceType==14){
-				// 		allowSpaceId.push(it.spaceId);
-				// 	}
-				// })
-			}
-			// allowSpaceId = [388];//模型有警告，需要看下
-			this.arrFrunList.forEach(signel => {
+				if(this.isIOS){
+					allowSpaceId = [this.curSpaceObj.spaceId];
+					if(this.curSpaceObj.spaceName=='主卧'){//主卧
+						let list = this.spaceList.filter(it=>it.spaceName=='休闲小客厅')
+						allowSpaceId.push(...list.map(it=>it.spaceId));//休闲小客厅
+					}
+					if(this.curSpaceObj.spaceName=='休闲小客厅'){//休闲小客厅
+						let list = this.spaceList.filter(it=>it.spaceName=='主卧')
+						allowSpaceId.push(...list.map(it=>it.spaceId));//主卧
+					}
+				}else{
+					allowSpaceId = this.spaceList.map(it=>it.spaceId);//当前空间 精模加载，其他空间用 简模加载
+				}
+			}
+			console.warn("重新加载布局", arrFrunList,this.spaceList,this.gltfLayouts,allowSpaceId);
+			arrFrunList.forEach(signel => {
 				let spaceId = this.spaceList.find(it => it.layoutId == signel.id).spaceId;
 				if(allowSpaceId.includes(spaceId)){//只加载允许的空间的布局，其他不加载
 					let md = JSON.parse(signel.modelJson); //获取布局里面的模型信息
-					console.warn("***布局***", md, signel.id)
 					//遍历模型信息，获取模型列表
 					for (let i = 0; i < md.modelData.length; i++) {
 						let item = md.modelData[i];
@@ -120,22 +153,64 @@ export default {
 						if(item.modelName=='BP_furnitureBase_C'){
 							continue;
 						}else{
-							tmpList.push(item);
+							if(this.type==1){//详细空间
+								if(spaceId==this.curSpaceObj.spaceId){
+									curSpaceList.push(item);
+								}else{
+									tmpList.push(item);
+								}
+							}else{//首页
+								tmpList.push(item);
+							}
 						}
 					}
 				}
 			})
+			// 处理删除模型时，其他空间引用了该模型时的重新载入处理
+			// if(this.lastFrunList && this.lastFrunList.length>0){
+			// 	let spaceIds = tmpSpaceList.map(it=>it.spaceId);
+			// 	this.arrFrunList.forEach(signel => {
+			// 		let spaceId = this.spaceList.find(it => it.layoutId == signel.id).spaceId;
+			// 		let md = JSON.parse(signel.modelJson); //获取布局里面的模型信息
+			// 		//遍历模型信息，获取模型列表
+			// 		for (let i = 0; i < md.modelData.length; i++) {
+			// 			let item = md.modelData[i];
+			// 			if(this.lastFrunList.includes(item.modelName) && !spaceIds.includes(spaceId)){
+			// 				item.spaceId = spaceId;
+			// 				item.layoutId = signel.id;
+			// 				item.h5Id = signel.id+""+item.id;//唯一标识
+			// 				if(!tmpList.find(it=>it.h5Id==item.h5Id)){
+			// 					// tmpList.push(item);
+			// 					console.warn("***布局xxxx***", item, signel.id)
+			// 				}
+			// 			}
+			// 		}
+			// 	})
+			// 	this.lastFrunList = [];
+			// }
 			this.tmpList = tmpList;
 			if(this.type==2){//全局精简模型;需要的是所有空间的模型
-				this.fliterList(tmpList);
-				console.warn("***fliterList***",this.realList.length ,this.realList);
+				this.fliterList(tmpList);//精简模式下，只计算白名单里面的模型位置等信息
+				console.warn("***fliterList***",this.type,this.realList.length);
+				tmpList = this.realList;
+			}else{
+				this.fliterList(tmpList);//精简模式下，只计算白名单里面的模型位置等信息
+				console.warn("***fliterList***",this.type,this.realList.length);
 				tmpList = this.realList;
+				tmpList = tmpList.concat(curSpaceList);//合并详细空间的模型
+			}
+			let realFurArr = this.preFurnitureData(tmpList);//统一处理家具模型
+			if(tmpSpaceList && tmpSpaceList.length>0){
+				this.calculateLayoutModelSizeBySpace(tmpSpaceList) // 提前计算模型的位置
+			}else{
+				this.calculateLayoutModelSize() // 提前计算模型的位置
 			}
-			let realFurArr = [];
-			realFurArr = this.preFurnitureData(tmpList);//统一处理家具模型
-			this.calculateLayoutModelSize() // 提前计算模型的位置
+			tmpList = [];
+			this.realList = [];
+			this.tmpList = []
 			console.log("***realFurArr***", realFurArr,this.gltfLayouts);
 			realFurArr && realFurArr.forEach((item,index) => {
+				this.loadLayFlag = true;
 				this.promise_list.push(
 					new Promise((resolve, reject) => {
 						this.loadLayoutModels(item, resolve);
@@ -144,16 +219,23 @@ export default {
 			});
 			Promise.all(this.promise_list).then(() => {
 				let endTime = new Date().getTime();
-				console.log("家具模型全部加载完成，时间：", endTime - startTime);
+				this.loadLayFlag = false;
+				realFurArr = [];
+				console.log("家具模型全部加载完成，时间：", endTime - startTime, this.gltfLayouts);
+				this.loadLastSpaceModel();//加载剩余空间的家具模型
+				// alert("JavaScript 堆大小限制: "+performance
+				// +"\n已使用的 JavaScript 堆大小: "+performance
+				// +"\nJavaScript 堆的总大小: "+performance.memory);
 			})
 		},
 		//过滤掉不需要的家具
 		fliterList(list){
 			this.realList = [];
+			let tempList = globlShowModel.map(it=>it.replace(this.nextString,''));
 			//找到直接的家具模型
 			list && list.forEach((mod)=>{
 				let name = mod.modelName.substring(0,mod.modelName.length-2);
-				if(globlShowModel.includes(name)){
+				if(tempList.includes(name)){
 					this.realList.push(mod);
 				}
 			})
@@ -199,12 +281,37 @@ export default {
 				let modelName = item.modelName;
 				// console.log("布局模型名称", modelName);
 				let layoutModel = modelData.find(it => modelName.indexOf(it.modelName) == 0); //模型地址
+				// if(layoutModel.modelName=='BP_L_book01'){
+				// 	debugger
+				// }
+				// console.log("要加载的模型数据", item.modelName, layoutModel)
 				if (layoutModel && layoutModel.url) {//该数据存在模型地址
-					let object = realFurnitureArr.find(it=>it.url==layoutModel.url);
+					let url = layoutModel.url;
+					//说明当前模型存在精简模型对象，则应该使用精简模型数据
+					if(this.type ==2 || this.isIOS){
+						if(globlShowModel.includes(layoutModel.modelName + this.nextString)){
+							if(!url.includes(this.nextString)){
+								let idx = url.lastIndexOf('.');
+								url = url.substr(0,idx) + this.nextString + url.substr(idx);//修改为精简模型地址
+							}
+						}
+					} else {
+						//不是本空间的
+						if(item.spaceId != this.curSpaceObj.spaceId){
+							//匹配到白名单里面的精简模型
+							if(globlShowModel.includes(layoutModel.modelName + this.nextString)){
+								if(!url.includes(this.nextString)){
+									let idx = url.lastIndexOf('.');
+									url = url.substr(0,idx) + this.nextString + url.substr(idx);//修改为精简模型地址
+								}
+							}
+						}
+					}
+					let object = realFurnitureArr.find(it=>(it.url==url));
 					//列表中还没有这个数据
 					if(!object){
 						let it = {
-							url:layoutModel.url,
+							url:url,
 							name:layoutModel.modelName,
 							list:[item],
 						}
@@ -242,34 +349,54 @@ export default {
 			if(realData.name.includes('BP_XSPACE_deng_01')){//灯光
 				resolve();
 			}else{
+				//不在白名单里面的，不加载
+				if(this.type==2 || this.isIOS){
+					if(!globlShowModel.includes(realData.name) 
+					&& !globlShowModel.includes(realData.name + this.nextString)){
+						resolve();
+						return false;
+					}
+				}
 				that.loader.setDRACOLoader(this.dracoLoader);
+				that.loader.setMeshoptDecoder(MeshoptDecoder);
+				//关键代码，如果是ios手机，则请求图片时压缩尺寸，当前最高是256
+				that.loader.manager.resolveURL = (url)=>{
+					let redirectUrl = url;
+					if(that.isIOS && url.startsWith('http') &&
+					(url.endsWith('.jpg') || url.endsWith('.png') || url.endsWith('.gif'))){
+						// redirectUrl = url + "?imageMogr2/auto-orient/thumbnail/!256x256r/gravity/Center/crop/256x256/interlace/1/format/jpg/blur/1x0/quality/75|imageslim"
+						redirectUrl = url + "?imageMogr2/auto-orient/format/webp/blur/1x0/quality/75"
+					}
+					return redirectUrl;
+				}
 				that.loader.load(realData.url, ( gltf ) => {
 					gltf.scene.traverse((child)=> {
 						if (child.isMesh && child.visible) {
+							if(realData.name=='BP_B_verysmallbed'){
+								console.warn("***child.material***",child.material)
+							}
 							let instancedMesh = new THREE.InstancedMesh(child.geometry.clone(), child.material.clone(), realData.list.length);
 							this.instancedFurList.push(instancedMesh);
 							//realData 该模型被重复使用时的每一次的形变参数等
 							realData.list && realData.list.forEach((it,i)=>{
 								let gltfFurn = that.gltfLayouts.find(itme=>itme.uniId==it.uniId);//判断是否已经添加过
-								if(!gltfFurn){
-									return false;
-									// debugger
-								}
-								gltf.scene.rotation.y = gltfFurn.rotation.y;
-								gltf.scene.position.set(gltfFurn.position.x,0,gltfFurn.position.z);
-								gltf.scene.scale.set(gltfFurn.scale.x,1,gltfFurn.scale.z);
-								gltf.scene.updateMatrixWorld();//更新世界坐标-这样，子模型也同步更新了
-								instancedMesh.setMatrixAt(i, child.matrixWorld);
-								instancedMesh.instanceMatrix.needsUpdate = true;
-								gltfFurn.loaded = true;
-								if(!gltfFurn.instancedMeshIndexList){//标识网格实例数组的序号 以及 当前几何体 在网格实例的序号
-									gltfFurn.instancedMeshIndexList = [
-										{instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i},
-									]
-								}else{
-									gltfFurn.instancedMeshIndexList.push({
-										instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i
-									})
+								if(gltfFurn){
+									gltf.scene.rotation.y = gltfFurn.rotation.y;
+									gltf.scene.position.set(gltfFurn.position.x,0,gltfFurn.position.z);
+									gltf.scene.scale.set(gltfFurn.scale.x,1,gltfFurn.scale.z);
+									gltf.scene.updateMatrixWorld();//更新世界坐标-这样，子模型也同步更新了
+									instancedMesh.setMatrixAt(i, child.matrixWorld);
+									instancedMesh.instanceMatrix.needsUpdate = true;
+									gltfFurn.loaded = true;
+									if(!gltfFurn.instancedMeshIndexList){//标识网格实例数组的序号 以及 当前几何体 在网格实例的序号
+										gltfFurn.instancedMeshIndexList = [
+											{instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i},
+										]
+									}else{
+										gltfFurn.instancedMeshIndexList.push({
+											instancedMeshIndex:this.instancedFurList.length-1,instancedAtIndex:i
+										})
+									}
 								}
 							})
 							instancedMesh.userType = "layoutMesh";
@@ -311,14 +438,151 @@ export default {
 				resolve();
 			});
 		},
+		//清除当前楼层下的所有家具模型
+		clearAllLayoutData(){
+			let deleList = this.scene && this.scene.children.filter(object=>{
+				if(object.userType=="layoutMesh"){
+					return object
+				}
+			})
+			// console.warn("***deleList***",deleList)
+			if(deleList && deleList.length>0){
+				this.scene.remove(...deleList);
+			}
+			this.gltfLayouts = [];
+			this.instancedFurList = [];
+		},
+		// 切换家具的显示隐藏
+		changeLayoutModelState(isShow=false){
+			if(isShow){
+				this.instancedFurList.forEach(it=>{
+					if(it){
+						it.visible = isShow;
+					}
+				})
+				console.log("移动过程中显示隐藏空间家具", this.gltfLayouts,isShow,this.changeSpaces)
+				return false;
+			}
+			
+			const changeSpaceList = this.leftSpaces.concat(this.rightSpaces); // 只改变空间尺寸变化的家具模型
+			console.log("移动过程中显示隐藏空间家具", this.gltfLayouts,isShow, this.leftSpaces, this.rightSpaces,this.changeSpaces);
+			for (let index = 0; index < changeSpaceList.length; index++) {
+				let element = changeSpaceList[index];
+				let gltfLayoutModels = this.gltfLayouts.filter(item => {
+					return element.layoutId == item.userData.layoutId && element.spaceId == item.userData.spaceId;
+				})
+				
+				if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
+					continue;
+				}
+				console.warn("***隐藏空间家具***",element,gltfLayoutModels)
+				for (let j = 0; j < gltfLayoutModels.length; j++) {
+					let cube = gltfLayoutModels[j];
+					this.changeCubeState(cube, isShow);
+				}
+			}
+		},
+		// 显示隐藏指定cube的状态
+		changeCubeState(cube, isShow){
+			let lay = this.gltfLayouts.find(it=>it.uniId==cube.uniId);
+			if(cube.instancedMeshIndexList && cube.instancedMeshIndexList.length>0){
+				cube.instancedMeshIndexList.forEach(item=>{
+					let index = item.instancedMeshIndex;
+					let instancedMesh = this.instancedFurList[index];//网格实例对象
+					// let curMeshIndex = item.instancedAtIndex;//当前家具模型在网格实例对象里面的序号
+					// let stratMatrix = new THREE.Matrix4();//定义一个四维矩阵
+					// instancedMesh.getMatrixAt(curMeshIndex,stratMatrix);//获取当前几何体的四维矩阵到stratMatrix里面
+					
+					// instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
+					instancedMesh.visible = isShow;
+					// instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
+				})
+			}
+		},
+		// 删除对应空间家具模型
+		deleteLayoutModel(spaceObj, layoutObj){
+			const oldLayoutIndex = this.arrFrunList.findIndex((item)=>{
+				return item.id == spaceObj.layoutId
+			})
+			//对应空间的布局替换为新的布局数据
+			if(oldLayoutIndex!=-1 && layoutObj){
+				this.arrFrunList[oldLayoutIndex] = layoutObj
+				// this.arrFrunList.splice(oldLayoutIndex,1)
+			}
+			if(!layoutObj){//当前空间不存在布局了
+				this.arrFrunList.splice(oldLayoutIndex,1)
+				spaceObj.layoutId = null;//为了确保传递到下一页的空间里面也没有布局信息，确保布局一致
+			}
+			console.log("准备删除模型", spaceObj,oldLayoutIndex, this.gltfLayouts);
+			//寻找当前空间下的所有家具模型对象
+			const gltfLayoutModels = this.gltfLayouts.filter(item => {
+				return spaceObj.layoutId == item.userData.layoutId && spaceObj.spaceId == item.userData.spaceId;
+			})
+			//不存在则不处理
+			if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
+				return;
+			}
+			let deleList = []
+			for (let j = 0; j < gltfLayoutModels.length; j++) {
+				const cube = gltfLayoutModels[j];
+				this.gltfLayouts.splice(this.gltfLayouts.findIndex(it=>it.uniId==cube.uniId),1);//删除gltfLayouts里面的数据
+				if(cube.instancedMeshIndexList && cube.instancedMeshIndexList.length>0){
+					cube.instancedMeshIndexList.forEach(item=>{
+						let index = item.instancedMeshIndex;
+						let instancedMesh = this.instancedFurList[index];//网格实例对象
+						if(instancedMesh){
+							instancedMesh.dispose();
+							deleList.push(instancedMesh);//等待释放资源
+							this.instancedFurList[index] = null;
+							// if(instancedMesh.count>1){//表示其他空间还存在这个模型，应该重新加入计算中
+							// 	if(!this.lastFrunList.includes(cube.userData.modelName)){
+							// 		this.lastFrunList.push(cube.userData.modelName);
+							// 	}
+							// }
+						}
+					})
+				}
+			}
+			this.scene.remove(...deleList);//释放家具的资源,this.instancedFurList
+			console.log("删除模型了", spaceObj, this.gltfLayouts);
+		},
 		// 计算家具的位置
 		calculateLayoutModelSize() {
-			console.log("计算家具的位置", this.gltfLayouts);
-			for (let index = 0; index < this.spaceList.length; index++) {
-				const element = this.spaceList[index];
+			console.log("计算家具的位置", this.gltfLayouts,this.changeSpaces);
+			// 有改变空间，只刷新改变空间的模型数据
+			const spaceList = (!this.changeSpaces || this.changeSpaces.length ==0) ? this.spaceList : this.changeSpaces; 
+			for (let index = 0; index < spaceList.length; index++) {
+				const element = spaceList[index];
+				
+				const gltfLayoutModels = this.gltfLayouts.filter(item => {
+					return element.layoutId == item.userData.layoutId && element.spaceId == item.userData.spaceId;
+				})
+				//空间下不存在家具模型，则该空间不需要进行下一步处理
+				if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
+					continue;
+				}
+				gltfLayoutModels.sort(function(a, b) {
+					return a.userData.level - b.userData.level
+				});
+
+				let newSpace = this.spaceList.find(item => {
+					return element.spaceId == item.spaceId;
+				})
+				// console.log("对应空间ID的模型数组", this.gltfLayouts, element.spaceId, gltfLayoutModels)
+				for (let j = 0; j < gltfLayoutModels.length; j++) {
+					const cube = gltfLayoutModels[j];
+					this.drawLayoutModel(newSpace, cube);
+				}
+			}
+		},
+		// 计算家具的位置
+		calculateLayoutModelSizeBySpace(spaceList) {
+			for (let index = 0; index < spaceList.length; index++) {
+				const element = spaceList[index];
 				const gltfLayoutModels = this.gltfLayouts.filter(item => {
 					return element.layoutId == item.userData.layoutId && element.spaceId == item.userData.spaceId;
 				})
+				// console.log("计算指定空间的家具的位置", element, element.layoutId, gltfLayoutModels);
 				//空间下不存在家具模型，则该空间不需要进行下一步处理
 				if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
 					continue;
@@ -477,13 +741,17 @@ export default {
 	
 					if (curSpace.spaceWallInfo.wallN && curSpace.spaceWallInfo.wallS) {
 						spaceHeight -= 20 + parseFloat(cubeInfo.marginTop) + parseFloat(cubeInfo.marginBottom);
+						positionY += parseFloat(cubeInfo.marginTop) / 2 ;
+						positionY -= parseFloat(cubeInfo.marginBottom) / 2;
 					} else if (curSpace.spaceWallInfo.wallN) {
-						spaceHeight -= 10 + parseFloat(cubeInfo.marginTop);
+						spaceHeight -= 10 + parseFloat(cubeInfo.marginTop) + parseFloat(cubeInfo.marginBottom);
 						positionY += 10 / 2;
 						positionY += parseFloat(cubeInfo.marginTop) / 2;
+						positionY -= parseFloat(cubeInfo.marginBottom) / 2;
 					} else if (curSpace.spaceWallInfo.wallS) {
-						spaceHeight -= 10 + parseFloat(cubeInfo.marginBottom);
+						spaceHeight -= 10 + parseFloat(cubeInfo.marginTop) + parseFloat(cubeInfo.marginBottom);
 						positionY -= 10 / 2;
+						positionY += parseFloat(cubeInfo.marginTop) / 2 ;
 						positionY -= parseFloat(cubeInfo.marginBottom) / 2;
 					}else {
 						spaceHeight -= parseFloat(cubeInfo.marginTop) + parseFloat(cubeInfo.marginBottom);
@@ -499,33 +767,43 @@ export default {
 					}
 	
 				}
-	
+
+				// console.log("模型计算位置x--", cubeInfo.isStepAsideLeft, cubeInfo.isStepAsideRight)
+
 				if (cubeInfo.isStepAsideLeft == 'true' && cubeInfo.isStepAsideRight == 'true') {
 					// console.log("宽度拉伸11111", spaceWidth / modelWidth)
 					positionX = centerX;
 	
 					if (curSpace.spaceWallInfo.wallW && curSpace.spaceWallInfo.wallE) {
-						spaceWidth -= 20 + parseFloat(cubeInfo.marginLeft) + parseFloat(cubeInfo.marginRight);;
+						spaceWidth -= 20 + parseFloat(cubeInfo.marginLeft) + parseFloat(cubeInfo.marginRight);
+						positionX += parseFloat(cubeInfo.marginLeft) / 2;
+						positionX -= parseFloat(cubeInfo.marginRight) / 2;
 					} else if (curSpace.spaceWallInfo.wallW) {
-						spaceWidth -= 10 + parseFloat(cubeInfo.marginLeft);
+						spaceWidth -= 10 + parseFloat(cubeInfo.marginLeft) + parseFloat(cubeInfo.marginRight);
 						positionX += 10 / 2;
 						positionX += parseFloat(cubeInfo.marginLeft) / 2;
+						positionX -= parseFloat(cubeInfo.marginRight) / 2;
 					} else if (curSpace.spaceWallInfo.wallE) {
-						spaceWidth -= 10 + parseFloat(cubeInfo.marginRight);
+						spaceWidth -= 10 + parseFloat(cubeInfo.marginLeft) + parseFloat(cubeInfo.marginRight);
 						positionX -= 10 / 2;
+						positionX += parseFloat(cubeInfo.marginLeft) / 2;
 						positionX -= parseFloat(cubeInfo.marginRight) / 2;
 					}else {
 						spaceWidth -= parseFloat(cubeInfo.marginLeft) + parseFloat(cubeInfo.marginRight);
 						positionX += parseFloat(cubeInfo.marginLeft) / 2;
 						positionX -= parseFloat(cubeInfo.marginRight) / 2;
 					}
-					// console.log("模型计算位置" , parseFloat(cubeInfo.rotation))
+					
+					// console.log("模型计算位置--", spaceWidth, modelWidth, scaleX, cubeInfo)
 					// 计算缩放
 					if (parseFloat(cubeInfo.rotation) == 90 || parseFloat(cubeInfo.rotation) == -90) {
 						scaleX = spaceWidth / modelWidth;
 					} else {
 						scaleY = spaceWidth / modelWidth;
 					}
+
+					
+					// console.log("模型计算位置--", spaceWidth, modelWidth, scaleX, cubeInfo)
 	
 				}
 	
@@ -549,6 +827,7 @@ export default {
 						scaleX = newModelHeight / modelHeight;
 					}
 					positionY = wallPositionY + newModelHeight / 2;
+					
 				}
 	
 				if (cubeInfo.isStepAsideBottom == 'true' && parseInt(cubeInfo.referenceModelTop) > 0) {
@@ -576,15 +855,18 @@ export default {
 				if (cubeInfo.isStepAsideLeft == 'true' && parseInt(cubeInfo.referenceModelRight) > 0) {
 					// console.log("左边拉伸")
 	
+					// 墙的位置
+					const wallPositionX = centerX - spaceWidth / 2 + (curSpace.spaceWallInfo.wallW ? 10 : 0) +
+						parseFloat(cubeInfo.marginLeft);
+					// 右边参照模型位置
 					const referenceModel = this.gltfLayouts.find(item => {
 						const layoutModelData = item.userData;
 						return layoutModelData.id == parseInt(cubeInfo.referenceModelRight) && layoutModelData
 							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
 					})
 					const referenceModelPositionX = referenceModel.position.x * 100 - referenceModel.userData
-						.modelWidth / 2 - parseFloat(cubeInfo.marginLeft);
-					const wallPositionX = centerX - spaceWidth / 2 + (curSpace.spaceWallInfo.wallE ? 10 : 0) +
-						parseFloat(cubeInfo.marginRight);
+						.modelWidth / 2 - parseFloat(cubeInfo.marginRight);
+					
 	
 					const newModelWidth = Math.abs(referenceModelPositionX - wallPositionX);
 					if (Math.abs(parseFloat(cubeInfo.rotation)) == 90) {
@@ -593,7 +875,7 @@ export default {
 						scaleY = newModelWidth / modelWidth;
 					}
 					positionX = wallPositionX + newModelWidth / 2;
-	
+					
 				}
 	
 				if (cubeInfo.isStepAsideRight == 'true' && parseInt(cubeInfo.referenceModelLeft) > 0) {
@@ -619,17 +901,81 @@ export default {
 	
 					// console.log("右边拉伸", Math.abs(parseFloat(cubeInfo.rotation)))
 				}
-	
+				if(parseInt(cubeInfo.referenceModelBottom) > 0 && parseInt(cubeInfo.referenceModelTop) > 0){
+			
+					// 上边惨遭物
+					const referenceModelTop = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelTop) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+					// 下边参照物
+					const referenceModelBottom = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelBottom) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+			
+					const referenceModelTopPositionY = referenceModelTop.position.z * 100 + referenceModelTop.userData
+						.modelHeight / 2 + parseFloat(cubeInfo.marginTop);
+			
+					const referenceModelBottomPositionY = referenceModelBottom.position.z * 100 - referenceModelBottom.userData
+						.modelHeight / 2 - parseFloat(cubeInfo.marginBottom);
+			
+					const newModelHeight = Math.abs(referenceModelTopPositionY - referenceModelBottomPositionY);
+					if (Math.abs(parseFloat(cubeInfo.rotation)) == 90) {
+						scaleY = newModelHeight / modelHeight;
+					} else {
+						scaleX = newModelHeight / modelHeight;
+					}
+					positionY = referenceModelBottomPositionY - newModelHeight / 2;
+				}
+				if(parseInt(cubeInfo.referenceModelLeft) > 0 && parseInt(cubeInfo.referenceModelRight) > 0){
+			
+					const referenceModelLeft = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelLeft) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+			
+					const referenceModelRight = this.gltfLayouts.find(item => {
+						const layoutModelData = item.userData;
+						return layoutModelData.id == parseInt(cubeInfo.referenceModelRight) && layoutModelData
+							.spaceId == cubeInfo.spaceId && layoutModelData.layoutId == cubeInfo.layoutId;
+					})
+					const referenceModelLeftPositionX = referenceModelLeft.position.x * 100 + referenceModelLeft.userData
+						.modelWidth / 2 + parseFloat(cubeInfo.marginLeft);
+					const referenceModelRightPositionX = referenceModelRight.position.x * 100 - referenceModelRight.userData
+						.modelWidth / 2 - parseFloat(cubeInfo.marginRight);
+			
+					const newModelWidth = Math.abs(referenceModelLeftPositionX - referenceModelRightPositionX);
+			
+					if (Math.abs(parseFloat(cubeInfo.rotation)) == 90) {
+						scaleX = newModelWidth / modelWidth;
+					} else {
+						scaleY = newModelWidth / modelWidth;
+					}
+			
+					positionX = referenceModelRightPositionX - newModelWidth / 2;
+
+				}
+			
 			}
-			// console.log("模型计算位置", cubeInfo, centerX, centerY, spaceWidth, spaceHeight, modelWidth, modelHeight, spaceId, scaleX, scaleY, positionX, positionY)
+			// console.log("模型计算位置--", positionX, positionY)
+			console.log("模型计算位置", cubeInfo, centerX, centerY, spaceWidth, spaceHeight, modelWidth, modelHeight, spaceId, scaleX, scaleY, positionX, positionY, cubeInfo.modelName)
 			let oldPosition = new THREE.Vector3();//当前几何体的位置参数
 			oldPosition.copy(cube.position);
+			let oldScale = new THREE.Vector3();//当前几何体的位置参数
+			oldScale.copy(cube.scale);
 			cube.position.x = positionX / 100;
 			cube.position.z = positionY / 100;
 			cube.rotation.y = rotationY;
 			cube.scale.x = scaleX;
 			cube.scale.z = scaleY;
 			cube.scale.y = 1;
+			cube.userData.modelWidth = modelWidth;
+			cube.userData.modelHeight = modelHeight;
+
 			// if (!cube.parent) { //说明还没添加到场景中-旧版方法
 			// 	this.scene.add(cube); //处理完毕后在加入场景中
 			// }
@@ -642,19 +988,21 @@ export default {
 					if(cubeInfo.modelName=='BP_XSPACE_deng_01_C'){//灯光
 						this.lightHandle(cube)
 					}else{
-						this.updateInfo(cube,oldPosition,scaleX,scaleY);//实例化方法
+						this.updateInfo(cube,oldPosition,oldScale);//实例化方法
 					}
 				}
 			}else{
 				if(cubeInfo.modelName=='BP_XSPACE_deng_01_C'){//灯光
 					this.lightHandle(cube)
 				}else{
-					this.updateInfo(cube,oldPosition,scaleX,scaleY);//实例化方法
+					this.updateInfo(cube,oldPosition,oldScale);//实例化方法
 				}
 			}
 		},
 		//更新家具模型到页面中
-		updateInfo(cube,oldPosition,scaleX,scaleY){
+		updateInfo(cube,oldPosition,oldScale){
+			const ssss = cube.scale.x / oldScale.x
+			// console.log("XXXXXXXXXXXXXXXXX", cube, oldPosition,oldScale, ssss)
 			let lay = this.gltfLayouts.find(it=>it.uniId==cube.uniId);
 			if(cube.instancedMeshIndexList && cube.instancedMeshIndexList.length>0){
 				cube.instancedMeshIndexList.forEach(item=>{
@@ -672,14 +1020,17 @@ export default {
 						// instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
 						// instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
 						// this.scene.add(instancedMesh);
+						
 					}else{//更新形变矩阵
+						scaleMatrix.makeScale(cube.scale.x / oldScale.x, 1, cube.scale.z/oldScale.z);	//获得缩放变化矩阵
 						panMatrix.makeTranslation(cube.position.x - oldPosition.x,0,cube.position.z - oldPosition.z);	//获得平移变化矩阵
-						stratMatrix.premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
+						stratMatrix.multiply(scaleMatrix).premultiply(panMatrix);//通过矩阵计算获得最终的形变矩阵
 						instancedMesh.instanceMatrix.needsUpdate = true;//更新之前，必须开启开关
 						instancedMesh.setMatrixAt(curMeshIndex,stratMatrix);//更新几何体的世界矩阵
 					}
 				})
 				lay.loaded = true;
+				lay.userData = cube.userData;
 			}
 		},
 		// 空间处理光源
@@ -690,9 +1041,9 @@ export default {
 				let pointLight = new THREE.PointLight(0xffd7b3, 1, 5, 1);
 				pointLight.position.set(cube.position.x, 1.5, cube.position.z); //default; light shining from top
 				this.scene.add(pointLight);
-				let sphereSize = 0.1;
-				let pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
-				this.scene.add( pointLightHelper);
+				// let sphereSize = 0.1;
+				// let pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
+				// this.scene.add( pointLightHelper);
 				
 				// pointLight.castShadow = true; // default false
 				// // 默认情况下光投影相机区域是一个长宽高为10x10x500的长方体区域，光源投射方向为通过坐标原点
@@ -779,10 +1130,10 @@ export default {
 				}
 	
 				// 边距
-				oldCubeInfo.marginLeft = cubeInfo.marginTop;
-				oldCubeInfo.marginTop = cubeInfo.marginRight;
-				oldCubeInfo.marginRight = cubeInfo.marginBottom;
-				oldCubeInfo.marginBottom = cubeInfo.marginLeft;
+				oldCubeInfo.marginLeft = cubeInfo.marginBottom;
+                oldCubeInfo.marginTop = cubeInfo.marginLeft;
+                oldCubeInfo.marginRight = cubeInfo.marginTop;
+                oldCubeInfo.marginBottom = cubeInfo.marginRight;
 				oldCubeInfo.modelWidth = cubeInfo.modelHeight;
 				oldCubeInfo.modelHeight = cubeInfo.modelWidth;
 	
@@ -806,5 +1157,129 @@ export default {
 	
 			return cubeInfo;
 		},
+		// 改变空间模型
+		changeLayoutModel(){
+			let changeSpaces = [];
+			// 去重
+			for (let index = 0; index < this.changeSpaces.length; index++) {
+				const element = this.changeSpaces[index];
+				const findIndex = changeSpaces.findIndex((item)=>{
+					return item.spaceId == element.spaceId;
+				})
+				if(findIndex==-1){
+					const findListIndex = this.spaceList.findIndex((item)=>{
+						return item.spaceId == element.spaceId;
+					})
+					if(findListIndex !=-1 && this.spaceList[findListIndex].spaceType!=14){
+						changeSpaces.push(this.spaceList[findListIndex])
+					}
+				}
+			}
+			console.log("所有变化的空间", changeSpaces)
+			this.changeLayouts = [];
+			let promise_list = [];
+			if(!changeSpaces || changeSpaces.length==0){
+				// this.changeLayoutModelState(true); // 显示家具模型
+				return false;
+			}
+			this.clearAllLayoutData();//清除所有空间的家具模型
+			for (let index = 0; index < changeSpaces.length; index++) {
+				let element = changeSpaces[index];
+
+				let layoutObj = this.arrFrunList.find((item)=>{
+					return item.id == element.layoutId;
+				})
+				console.log("请求布局的对象", layoutObj, element);
+				if(layoutObj){
+					promise_list.push(
+						new Promise((resolve, reject) => {
+							this.loadlayoutByID(layoutObj.groupType, element, resolve);
+						})
+					)
+				}else{//空间不存在布局，需要请求布局信息
+					promise_list.push(
+						new Promise((resolve, reject) => {
+							this.loadlayoutByID(element.groupType, element, resolve);
+						})
+					)
+				}
+			}
+			Promise.all(promise_list).then(()=>{
+				this.$nextTick(()=>{
+					console.log("新布局替换完成",this.changeLayouts, changeSpaces,this.arrFrunList.map(it=>it.id));
+					this.furnHandle(this.changeLayouts, changeSpaces);//先加载变化的空间的布局
+					this.updataPageData();//更新数据
+				})
+			})
+		},
+		async loadlayoutByID(groupType,spaceObj, resolve){
+
+			if(!groupType){
+				console.log("无法通过groupType请求布局", spaceObj.spaceId);
+				return resolve();
+			}
+			let param = {
+				"brandId": $config.brandId,
+				"houseId": this.curHouseObj.houseId,
+				"groupType": groupType
+			}
+		
+			// 默认的布局
+			let res = await requestConfig("findOverallArrangementList", param);
+			if (!res.success || !res.pageModel || res.pageModel.resultSet.length == 0) {
+				return resolve();
+			}
+		
+			const groupLayouts = res.pageModel.resultSet;
+			console.log("查询指定分组的布局", groupType, groupLayouts, spaceObj.spaceWidth, spaceObj.spaceHeight)
+		
+			// 根据空间的尺寸和布局的最小尺寸，筛选出合适的最大的布局
+			const layouts01 = groupLayouts.filter((item)=>{
+				return item.minWidth <= spaceObj.spaceWidth && item.minDepth <= spaceObj.spaceHeight
+			})
+			console.log("过滤适合的布局01", layouts01)
+			// 长度和宽度都满足空间尺寸
+			const layouts02 = layouts01.filter((item)=>{
+				return (item.minWidth * item.minDepth ) <= (spaceObj.spaceWidth * spaceObj.spaceHeight)
+			})
+			console.log("过滤适合的布局02", layouts02)
+			// 取布局面积最大的一个
+			let layoutObj = null
+			for (let index = 0; index < layouts02.length; index++) {
+				const element = layouts02[index];
+				if(!layoutObj){
+					layoutObj = element;
+				}else{
+					if((layoutObj.minWidth * layoutObj.minDepth) < (element.minWidth * element.minDepth)){
+						layoutObj = element;
+					}
+				}
+			}
+			if(layoutObj==null){
+				console.warn("没有合适的布局", layoutObj,spaceObj.layoutId);
+				spaceObj.groupType = groupType;
+				this.deleteLayoutModel(spaceObj, layoutObj);//删除当前的布局
+				return resolve()
+			}
+			console.log("找出最合适的布局", layoutObj)
+			console.log("更新空间的布局ID=", spaceObj.layoutId,'=>',layoutObj.id)
+		
+			// 合适的布局更现有布局相同-不在需要了，因为这此之前已经把所有的家具都删除了
+			// if(spaceObj.layoutId == layoutObj.id && !spaceObj.delateLayoutId){
+			// 	// this.calculateLayoutModelSizeBySpace(spaceObj) // 提前计算模型的位置
+			// 	// this.changeLayoutModelState(true); // 显示家具模型
+			// 	return resolve()
+			// }
+		
+			// 更新空间的布局id
+			const element = this.spaceList.find(it=>it.spaceId == spaceObj.spaceId);
+			if(element){
+				this.deleteLayoutModel(element, layoutObj)
+				element.layoutId = layoutObj.id
+				console.log("替换空间的布局ID", spaceObj.spaceId, layoutObj.id);
+			}
+			this.changeLayouts.push(layoutObj)
+			resolve()
+		}
 	}
 }

src/mixins/screenshot.js

@@ -7,8 +7,6 @@ export default {
 		}
 	},
 	watch: {},
-	onReady() {
-	},
 	methods: {
 		//触发主页面的截屏动作
 		screenPromiseShot() {

src/pages/loginView/loginView.scss

@@ -22,22 +22,22 @@
   margin-top: 7%;
 }
 .img_logo_rihgt{
-    width: 190rem;
-height: 87rem;
-margin-left: 25rem;
+    width: 190px;
+	height: 87px;
+	margin-left: 25px;
 }
 .img_logo {
-  width: 66rem;
-  height: 74rem;
+  width: 66px;
+  height: 74px;
 }
 .txt_logo {
-  font-size: 46rem;
+  font-size: 46px;
   font-family: FontName, FontName-Regular;
   font-weight: 400;
   text-align: left;
   color: #ffffff;
-  line-height: 50rem;
-  margin-left: 30rem;
+  line-height: 50px;
+  margin-left: 30px;
   font-style: italic;
 }
 .logo_desc {
@@ -47,45 +47,45 @@ margin-left: 25rem;
   font-weight: 700;
   text-align: center;
   color: #ffffff;
-  margin-top: 31rem;
+  margin-top: 31px;
 }
 .logo_info {
-  width: 300rem;
-  height: 96rem;
+  width: 300px;
+  height: 96px;
   background: #ffffff;
-  border-radius: 10rem;
-  margin-top: 37rem;
+  border-radius: 10px;
+  margin-top: 37px;
 }
 .login_name {
   width: 100%;
-  height: 45rem;
+  height: 45px;
   font-size: 15px;
-  padding-left: 20rem;
+  padding-left: 20px;
   box-sizing: border-box;
-  border-radius: 10rem;
+  border-radius: 10px;
   border: transparent;
    outline: transparent;
 }
 .line {
-  width: 265rem;
-  height: 1rem;
+  width: 265px;
+  height: 1px;
   opacity: 0.1;
   background: #707070;
 }
 .verification_info {
   width: 100%;
-  height: 45rem;
+  height: 45px;
   font-size: 15px;
-  padding-left: 20rem;
+  padding-left: 20px;
   box-sizing: border-box;
   display: flex;
   align-items: center;
 }
 .verification {
   box-sizing: border-box;
-  border-radius: 10rem;
+  border-radius: 10px;
   border: transparent;
-  height: 45rem;
+  height: 45px;
   outline: transparent;
   width: 40%;
   padding: unset;
@@ -101,17 +101,17 @@ margin-left: 25rem;
     display: block;
 }
 .btn_login {
-  width: 300rem;
-  height: 46rem;
-  line-height: 46rem;
+  width: 300px;
+  height: 46px;
+  line-height: 46px;
   background: #ef863f;
-  border-radius: 10rem;
+  border-radius: 10px;
   font-size: 15px;
   font-family: Verdana, Verdana-Bold;
   font-weight: 700;
   text-align: center;
   color: #ffffff;
-  margin-top: 10rem;
+  margin-top: 10px;
   cursor: pointer;
 }
 .login_fill {
@@ -119,7 +119,7 @@ margin-left: 25rem;
 }
 .login_notice {
   width: 40%;
-  margin-bottom: 40rem;
+  margin-bottom: 40px;
 }
 .login_private {
   font-size: 12px;
@@ -127,7 +127,7 @@ margin-left: 25rem;
   font-weight: 400;
   text-align: center;
   color: #ffffff;
-  margin-bottom: 40rem;
+  margin-bottom: 40px;
 }
 .login_item_notice {
   display: flex;
@@ -135,7 +135,7 @@ margin-left: 25rem;
   align-items: center;
 }
 .img_notice {
-  width: 33rem;
+  width: 33px;
 }
 
 .txt_notice {
@@ -144,11 +144,11 @@ margin-left: 25rem;
   font-weight: 400;
   text-align: left;
   color: #ffffff;
-  margin-left: 10rem;
+  margin-left: 10px;
 }
 .img_elab {
-  width: 52rem;
-  height: 20rem;
+  width: 52px;
+  height: 20px;
 }
 .image--not-loaded{
     /* fix ios 缺少重绘的问题，添加无意义的transform强制触发重绘 */

src/pages/mainView/mainView.html

@@ -1,22 +0,0 @@
-
-<div class="map" style="position: absolute;width: 100%;height: 100vh;z-index: 1;">
-	<!-- 提交按钮 -->
-	<div class="submit-btn" @click="submitHouse">提交</div>
-	
-    <div id="mapDiv" ref="webgl"></div>
-	<canvas id="glcanvas" width="100vw" height="100vh" ref="glcanvas"
-	 :style="{'height':canvasHeight+'px'}">
-		你的浏览器似乎不支持或者禁用了 HTML5 <code>&lt;canvas&gt;</code> 元素。
-	</canvas>
-	<!-- 主要操作视图 -->
-	<viewShell pageType="1" :overChange="overChange" :houseList="houseList" :houseObj="curHouseObj" :curHouseType="curHouseType" @curSpaceChange="curSpaceChange" @curHouseTypeChange="curHouseTypeChange" @curHouseFloorChange="curHouseFloorChange"></viewShell>
-	
-	<div v-show="showLables && gltf.text.length>0" v-for="(gltf,index) in lableItem" :key="index" class="word-view"
-	:style="{'transform':gltf.transform}" @click="goRoam(gltf)">
-		<div v-if="styleType==2" user-select="false" :class="['number-view ',(index+1)>9?'number-more':'',currentChangeSpaceId==gltf.spaceId?' active':'']">{{gltf.spaceIndex+1}}</div>
-		<div v-else user-select="false" class="word" :class="currentChangeSpaceId==gltf.spaceId?'active':''">{{gltf.text}}></div>
-	</div>
-	<!-- <div id="labels"></div> -->
-	<!-- 左侧操作区域 -->
-	<!-- <left-operate-comp @operateHandle="operateHandle"></left-operate-comp> -->
-</div>

src/pages/mainView/mainView.scss

@@ -1,191 +0,0 @@
-#mapDiv{
-    width: 100%;
-    height: 100vh;
-    background-color: #fff;
-}
-.map {
-  position: relative;  /* 作为子元素的相对定位元素 */
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-#labels {
-  position: absolute;  /* 把Label定位在容器内 */
-  left: 0;             /* 默认定位在左上角 */
-  top: 0;
-  color: white;
-}
-#labels>div {
-  position: absolute;  /* 让我们的容器决定尺寸 */
-  left: 0;             /* 默认定位在左上角 */
-  top: 0;
-  cursor: pointer;     /* 当悬浮时，变为一个小手 */
-  font-size:12px;
-  user-select: none;   /* 不允许文字被选中 */
-  white-space: nowrap;
-  text-shadow:         
-    -1px -1px 0 #000,
-    0   -1px 0 #000,
-    1px -1px 0 #000,
-    1px  0   0 #000,
-    1px  1px 0 #000,
-    0    1px 0 #000,
-    -1px  1px 0 #000,
-    -1px  0   0 #000;
-}
-#labels>div:hover {
-  color: red;
-}
-canvas:focus {
-  outline:none;
-}
-canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
-
-#canvas_webgl{
-	/* background: url(resources/images/daikanyama.jpg) no-repeat center center; */
-	/* background:#6d0909;
-	background-size: cover; */
-	/* transition: height 1s; */
-}
-/* 生成截屏的画布对象 */
-#canvas {
-	width: 100vw;
-	z-index: -1;
-	position: absolute;
-	left:0rem;
-}
-.tran{
-	transition-timing-function: linear;
-	transition: height 1s;
-}
-.voice-mask{
-	position: fixed;
-	left:0rem;
-	top:0rem;
-	width: 100vw;
-	height:100vh;
-	z-index: 11;
-	background: rgba(0, 0, 0, 0.5);
-}
-// .btn{
-// 	position:absolute;
-// 	width:300rem;
-// 	height:132rem;
-// 	bottom:60rem;
-// 	right:30rem;
-// 	border-radius: 10rem;
-// 	opacity:1;
-// 	z-index:10000;
-// 	color:red;
-// 	display: flex;
-// 	flex-direction:row;
-// 	align-items:center;
-// 	justify-content:center;
-// 	background-color: rgba(155, 155, 155, 0.6);
-// }
-
-// .changeSizebtn {
-// 	position:absolute;
-// 	width:300rem;
-// 	height:132rem;
-// 	bottom:60rem;
-// 	left:30rem;
-// 	border-radius: 10rem;
-// 	opacity:1;
-// 	z-index:10000;
-// 	color:red;
-// 	display: flex;
-// 	flex-direction:row;
-// 	align-items:center;
-// 	justify-content:center;
-// 	background-color: rgba(155, 155, 155, 0.6);
-// }
-.canvas-view{
-	position:relative;
-}
-.lable-view{
-	position:absolute;
-	width:100vw;
-}
-.word-view{
-	position: absolute; 
-	left: 0;            
-	top: 0;
-	user-select: none;  
-	z-index: 12;
-	text-align: center;
-	border-radius: 5rem;
-}
-.word{
-	font-family: "Verdana";
-	font-weight: 400;
-	height: 40rem;
-	line-height: 40rem;
-	padding:0rem 10rem;
-	border-radius: 20rem;
-	background: #fff;
-	font-size:26rem;
-	color: #1d1d1d;
-}
-.number-view{
-	width: 30rem;
-	height: 30rem;
-	line-height: 30rem;
-	background: #fff;
-	color: #121212;
-	font-weight: 700;
-	font-size: 28rem;
-	font-family: "DIN Alternate Bold";
-	border-radius: 30rem;
-}
-.number-more{
-	width: 40rem;
-	height: 40rem;
-	line-height: 40rem;
-	border-radius: 30rem;
-}
-.active{
-	background: #faad5c;
-	color: #fff;
-}
-.submit-btn{
-	position: absolute;
-	top:190rem;
-	right:20rem;
-	width: 140rem;
-	height: 64rem;
-	border-radius: 32rem;
-	backdrop-filter: blur(40rem);
-	background-color: rgba(255, 156, 56, 1);
-	font-family: "Verdana Bold";
-	font-weight: 700;
-	font-size: 28rem;
-	color: #fff;
-	text-align:center;
-	line-height:64rem;
-	z-index: 11;
-}
-.submit-btn1{
-	left:20rem;
-}
-.voice-view{
-	width: 614rem;
-	height: 312rem;
-	border-radius: 40rem;
-	background: #fff;
-	box-shadow: 0 -6rem 12rem #0000001f;
-	position: absolute;
-	left:50%;
-	top:50%;
-	transform: translate(-50%,-50%);
-	text-align:center;
-}
-.voice-tips{
-	font-size: 28rem;
-	color: rgba(36, 36, 36, 0.51);
-	margin-top:12rem;
-}
-.voice-gif{
-	width: 100%;
-	margin-top:56rem;
-}

src/pages/mapComponent/mapComponent.css

@@ -0,0 +1,58 @@
+#mapDiv{
+    width: 100%;
+    height: 100vh;
+    background: #181C28;
+}
+.map {
+  position: relative;  /* 作为子元素的相对定位元素 */
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+#labels {
+  position: absolute;  /* 把Label定位在容器内 */
+  left: 0;             /* 默认定位在左上角 */
+  top: 0;
+  color: white;
+}
+#labels>div {
+  position: absolute;  /* 让我们的容器决定尺寸 */
+  left: 0;             /* 默认定位在左上角 */
+  top: 0;
+  cursor: pointer;     /* 当悬浮时，变为一个小手 */
+  font-size:12px;
+  user-select: none;   /* 不允许文字被选中 */
+  white-space: nowrap;
+  text-shadow:         
+    -1px -1px 0 #000,
+    0   -1px 0 #000,
+    1px -1px 0 #000,
+    1px  0   0 #000,
+    1px  1px 0 #000,
+    0    1px 0 #000,
+    -1px  1px 0 #000,
+    -1px  0   0 #000;
+}
+#labels>div:hover {
+  color: red;
+}
+canvas:focus {
+  outline:none;
+}
+.submit-btn{
+	position: absolute;
+	top:120rem;
+	right:20rem;
+	width: 140rem;
+	height: 64rem;
+	border-radius: 32rem;
+	backdrop-filter: blur(40rem);
+	background-color: rgba(255, 156, 56, 1);
+	font-family: "Verdana Bold";
+	font-weight: 700;
+	font-size: 28rem;
+	color: #fff;
+	text-align:center;
+	line-height:64rem;
+	z-index: 11;
+}

src/pages/mapComponent/mapComponent.html

@@ -0,0 +1,13 @@
+<div class="map" style="position: absolute;width: 100%;height: 100vh;z-index: 1;">
+	<!-- 主要操作视图 -->
+	<!-- 提交按钮 -->
+	<div class="submit-btn" @click="changCarmer">提交</div>
+	
+    <div id="mapDiv" ref="webgl"></div>
+	<canvas id="glcanvas" width="100vw" height="100vh" ref="glcanvas">
+		你的浏览器似乎不支持或者禁用了 HTML5 <code>&lt;canvas&gt;</code> 元素。
+	</canvas>
+	<!-- <div id="labels"></div> -->
+	<!-- 左侧操作区域 -->
+	<!-- <left-operate-comp @operateHandle="operateHandle"></left-operate-comp> -->
+</div>

src/pages/mapComponent/mapComponent.vue

@@ -0,0 +1,318 @@
+<template src="./mapComponent.html"></template>
+<script>
+	import * as THREE from 'three';
+	import Stats from 'three/addons/libs/stats.module.js';
+	import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+	import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
+
+    import TWEEN from 'three/addons/libs/tween.module.js';
+
+	var requestId = "";
+	// const util = require('@/static/utils/util.js');
+	const config = require('@/services/urlConfig.js');
+	export default {
+		/**
+		 * 页面的初始数据
+		 */
+		data() {
+			return {
+				pvCurPageName: "home_show",
+				locusBehaviorName: "主界面",
+				pvCurPageParams: null,
+				houseId: "100296",
+				pvId: 'p_2cmina_23080401',
+				canvas:null,
+				navbar: {
+					showCapsule: 1,
+					title: '',
+					titleColor: '#000',
+					navPadding: 0,
+					navPaddingBg:'transparent',
+					navBarColor: 'transparent',
+					navBackColor: 'transparent',
+					haveCallback: false,
+					fromShare: false,
+					fromProject: 0,
+					shareToken: "",
+					pageName: this.pvCurPageName,
+				},
+				loader:null,
+				scene:null,
+				sky:null,
+				camera:null,
+				houseList:[],	//当前户型所有的户型详情，可以切换
+				curHouseType: null,	//当前选中的户型类型
+				curHouseName:'',//当前选中的户型类型名称
+				curHouseFloor: null,	//当前选中的户型楼层
+				curHouseObj: null,
+				controlStarPosition : { x:0, y:0, z:0},	//控制器初始位置
+				cameraStarPosition : { x:0, y:20, z:0}	,//摄像头初始位置
+				// cameraLastPosition: null,		//摄像头上一次移动到的位置
+				// controlLastPosition: null,		//观察点上一次移动到的位置
+				// canvasHeight:200,	//canvas视图的高度-计算得出
+				chooseMesh:null,//标记鼠标拾取到的mesh
+				// chooseMeshColor:'',	//拾取到的mesh的原始颜色；
+				chooseWallMeshColor:'', // 拾取墙体原始颜色
+				curWallArr:[], // 当前空间选中墙面的墙体模型
+				isManyou: false,	//当前是否处在漫游状态
+				pageShowIndex: 2, // 默认户型列表页面
+				aleadyLoaderModel:[],	//已经加载的墙体元数据模型列表
+				// fontLabelGroup: [],
+				shottingImg: [],
+				progress:1,	//进度条
+				myLoadingStatus:false,
+				// textGeoList:[],
+				repeatFlag:false,	//重复点击
+				skyPlan: null, // 天空盒子
+
+				gltfLayouts:[], // 场景中墙体模型数组
+			}
+		},
+		onUnload() {
+			cancelAnimationFrame(requestId, this.canvas)
+			this.worker && this.worker.terminate()
+			setTimeout(() => {
+				if (this.renderer instanceof THREE.WebGLRenderer) {
+					this.renderer.dispose()
+					this.renderer.forceContextLoss()
+					this.renderer.context = null
+					this.renderer.domElement = null
+					this.renderer = null;
+					this.clearEvent()
+				}
+				this.gltfWalls = [];
+				this.gltfSpaces = [];
+				this.instancedMeshList = [];
+				this.instancedSpaceMeshList = [];
+				this.lableItem = [];
+				this.gltfLayouts = [];
+				this.instancedFurList = [];
+				this.wallList = [];
+				TWEEN && TWEEN.removeAll();//清除所有的tween;
+			}, 0)
+		},
+        mounted() {
+			
+			
+			var that = this;
+			const container = this.$refs.webgl;
+            const canvas3d = this.canvas = this.$refs.glcanvas;
+
+			let camera = null, renderer = null, controls=null;
+			// let trackballControls = null;
+			console.warn("***loader0***",this.loader)
+			let loader = null;
+			loader = this.loader = new GLTFLoader();
+			// if(this.childLayout){
+				// this.getInitData();//请求获取页面模型数据等
+			// }
+            let scene = this.scene = new THREE.Scene();
+			let isUserContorl = false;
+			let tweenCameraAnma = false;	//表示当前是否处在动画过程中
+			let needRender = false;	//是否需要渲染 false表示不需要渲染；true 表示需要渲染
+			let frustumSize = 30;//正交相机的视窗宽度距离
+			let stats;
+			let gltfLists = [];
+			let objects = [];
+			var mouse = new THREE.Vector2();
+			init();
+			// render();
+			// this.$refs.myLoading.showLoading("加载中..." + this.progress+"%")
+			// this.myLoadingStatus = true;
+			
+			function init() {
+
+                scene.background = new THREE.Color("#FFFFFF");
+                // scene.environment = new THREE.Color("#F2F2F2");
+
+				// 创建相机位置-投影相机
+				camera = new THREE.PerspectiveCamera( 80, window.innerWidth / window.innerHeight, 0.1, 10000 );
+				// let aspect = window.innerWidth /  window.innerHeight;
+				// camera = new THREE.OrthographicCamera( frustumSize * aspect / - 2, frustumSize * aspect / 2, frustumSize / 2, frustumSize / - 2, 0.1,1000);
+				camera.up.set(0, 1, 0);//俯视状态，将相机的up向量设置为z轴负方向
+				// camera.position.set(that.cameraStarPosition.x, that.cameraStarPosition.y, that.cameraStarPosition.z);
+				camera.position.set(0.1,15,0);
+				scene.add(camera);
+                that.camera = camera;
+				// 辅助方格
+				// const axesHelper = new THREE.AxesHelper( 50 );
+				// scene.add( axesHelper );
+				// const gridHelper = new THREE.GridHelper(50, 10, 0xcccccc, 0xcccccc);
+				// gridHelper.position.y = 0;
+				// gridHelper.position.x = 0;
+				// scene.add(gridHelper);
+
+                // 环境光会均匀的照亮场景中的所有物体
+                const ambientLight = new THREE.AmbientLight(0xFFEFE0, 2);
+                scene.add(ambientLight);
+                //平行光
+                const light = new THREE.DirectionalLight(0xFFF8E5, 2.2);
+                light.position.set(-14.8, 9.188, -7.448); //default; light shining from top
+                scene.add(light);
+                // 从一个点向各个方向发射的光源。一个常见的例子是模拟一个灯泡发出的光。
+                // const pointLight = new THREE.PointLight( 0xffffff, 0.3 );
+                // camera.add( pointLight );
+
+				
+				//antialias 这个值得设置为false，不然IOS上截图会失效
+                renderer = that.renderer = new THREE.WebGLRenderer( { canvas:canvas3d, alpha: true, antialias:false,
+					// 如果想保存three.js canvas画布上的信息，注意设置preserveDrawingBuffer
+					preserveDrawingBuffer: true, } );
+				renderer.shadowMap.enabled = true;//产生阴影
+				renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
+				renderer.outputEncoding = THREE.sRGBEncoding;
+				renderer.outputColorSpace = THREE.SRGBColorSpace;
+				// renderer.toneMappingExposure = 0.1;//色调映射的曝光级别。默认是1
+				renderer.toneMapping = THREE.NoToneMapping;//色调映射
+				renderer.physicallyCorrectLights = true;//关键参数，模拟物理光照影响，必须设置为true
+				
+                renderer.setPixelRatio( window.devicePixelRatio );
+                renderer.setSize( window.innerWidth,  window.innerHeight );
+                container.appendChild( renderer.domElement );
+				
+				controls = new OrbitControls(camera, renderer.domElement);
+				controls.screenSpacePanning = true;
+				controls.enableDamping = true;
+				controls.minDistance = 1;
+				controls.maxDistance = 400;
+				controls.minPolarAngle = 0;// 默认0
+				controls.maxPolarAngle = Math.PI / 2; // 默认Math.PI，即可以向下旋转到的视角。
+				controls.target.set(that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
+				controls.enableZoom = true;//启用摄像机的缩放
+				
+				// that.controls = controls;
+				// controls.target = new THREE.Vector3( that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z );;
+				camera.lookAt(0,0,0);
+                // 监听
+                // renderer.domElement.addEventListener('resize', onWindowResize );
+				stats = new Stats();
+				container.appendChild( stats.dom );
+				// attendEvent();	//注册监听事件
+				starRender();	//启动渲染
+				// 监听
+				// window.addEventListener( 'resize', onWindowResize );
+				let arr = [
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E5%B7%A5%E4%BD%9C%E5%AD%A6%E4%B9%A0-%E7%9B%B4%E6%8E%A5.glb', name: '工作学习模块', positionX: 3, positionY: 0, positionZ:-1.5, rotation: (270 * ( Math.PI / 180 )),},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E7%9D%A1%E7%9C%A0-%E9%97%B4%E6%8E%A5.glb', name: '睡眠模块', positionX: 6, positionY: 0, positionZ:1.5, rotation: (180 * ( Math.PI / 180 )),},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E5%AE%A0%E7%89%A9-%E6%A0%B8%E5%BF%83.glb', name: '宠物模块', positionX: -3, positionY: 0, positionZ:1.5, rotation:0,},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E4%BC%91%E9%97%B2-%E7%9B%B4%E6%8E%A5.glb', name: '休闲模块', positionX: 3, positionY: 0, positionZ:1.5, rotation: (180 * ( Math.PI / 180 )),},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E5%BD%B1%E9%9F%B3-%E7%9B%B4%E6%8E%A5.glb', name: '影音模块', positionX: 0, positionY: 0, positionZ:1.5, rotation: (180 * ( Math.PI / 180 )),},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E6%B4%97%E6%B5%B4-%E9%97%B4%E6%8E%A5.glb', name: '洗浴模块', positionX: -3, positionY: 0, positionZ:3.5, rotation: (90 * ( Math.PI / 180 )),},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E6%94%B6%E7%BA%B3-%E9%97%B4%E6%8E%A5.glb', name: '收纳模块', positionX: -3, positionY: 0, positionZ:1.5, rotation: (90 * ( Math.PI / 180 )),},
+					{url: 'https://dm.static.elab-plus.com/3d/model/11-28/%E5%AE%B6%E6%94%BF-%E9%97%B4%E6%8E%A5.glb', name: '家政模块', positionX: -6, positionY: 0, positionZ:-1.5, rotation: 0,},
+				];
+				arr.forEach((item,index) =>{
+					loaderArr(item,index)
+				})
+            }
+			function loaderArr(item,index){
+				loader.load( item.url,  ( gltf ) => {
+					//将模型添加到场景中
+					var cube =  gltf.scene;
+					var mesh = cube.children[0];
+					cube.name= item.name;
+					scene.add(cube);
+					cube.rotation.y = item.rotation;
+					cube.position.set(item.positionX,item.positionY,item.positionZ);
+					
+					// cube.userData.obb = new OBB();
+					// cube.userData.obb = new OBB();
+					// cube.userData.obb.halfSize.copy( size ).multiplyScalar( 0.5 );
+					console.warn("***gltf-geometry" + index + "***",gltf)
+					gltfLists.push(cube);
+					
+					// let obb = new OBB();
+					// obb.halfSize.copy( size ).multiplyScalar( 0.5 );
+					
+					let box = new THREE.BoxHelper(cube,'rgba(0,0,0,0)');
+					box.name = item.name;
+					console.warn("***WireframeGeometry-geometry***",box)
+					scene.add(box);
+					var material = new THREE.MeshBasicMaterial({
+						transparent:true,
+						opacity:0.6
+
+					});
+					// material.wireframe = true;
+					var mesh = new THREE.Mesh(box.geometry,material);
+					scene.add(mesh);
+					objects.push(box);
+				} );
+			}
+			function onWindowResize() {
+			    camera.aspect = window.innerWidth / window.innerHeight;
+			    camera.updateProjectionMatrix();
+			    renderer.setSize( window.innerWidth, window.innerHeight );
+				console.warn("****onWindowResize**")
+			}
+			function attendEvent () {
+				document.addEventListener('touchstart', onPointerStart, false);
+				document.addEventListener('touchmove', onPointerMove, false);
+				document.addEventListener('touchend', onPointerUp, false);
+			}
+			function tweenCameraAnmaChange (value) {
+				tweenCameraAnma = value
+			}
+			//开启渲染-帧率优化，不触发时停止渲染
+			function enableRender() {
+			}
+			//取消事件监听-避免二次进入时触发多次事件
+			function clearEvent(){
+				console.warn("**clearEvent****")
+				document.removeEventListener('touchstart', onPointerStart);
+				document.removeEventListener('touchmove', onPointerMove );
+				document.removeEventListener('touchend', onPointerUp );
+			}
+			function stopRender () {
+				needRender = false;
+			}
+			function starRender () {
+				if(needRender==true){//如果已经在渲染中了，则不能再次开启，避免渲染过多
+					false;
+				}
+				needRender = true;
+				render();//开始渲染
+			}
+            function render() {
+				if(needRender==false){
+					return false;
+				}
+                TWEEN && TWEEN.update();
+				stats.update();
+				//不处在动画过程中，则可以处理移动等动作
+				if(tweenCameraAnma==false){
+					controls.update();
+				}
+				requestId = requestAnimationFrame(render, canvas3d);
+				renderer.render(scene, camera);//单次渲染
+            }
+		},
+		onShow(){
+			if(this.attendEvent){
+				this.attendEvent()
+			}
+		},
+		onHide(){
+			this.clearEvent();
+		},
+		methods: {
+			onMouseMove(e){
+				return false;
+			},
+            webgl_touch(e) {
+                const web_e = Event.fix(e)
+                window.dispatchEvent(web_e)
+				let web_e2 = Object.assign(e,web_e)
+                document.dispatchEvent(web_e2)
+                this.canvas.dispatchEvent(web_e)
+            },
+			changCarmer(){
+				this.camera.position.set(-0.1,15,0);
+			}
+			
+        }
+    }
+</script>
+<style lang="css" scoped>
+	@import "./mapComponent.css";
+</style>

src/pages/mainView/mainView.vue

@@ -1,28 +1,45 @@
-<template src="./mainView.html"></template>
+<template src="./webgl_rxdz.html">
+
+</template>
 <script>
-	import * as THREE from 'three';
-	import Stats from 'three/addons/libs/stats.module.js';
-	import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
-	import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
+	import {
+		document,
+		window,
+		requestAnimationFrame,
+		cancelAnimationFrame,
+		performance,
+		Event,
+		core
+	} from '@/webgl/dhtml-weixin/index.js';
+	const THREE = requirePlugin('ThreeX');
+	import { RGBELoader } from '@/webgl/jsm/loaders/RGBELoader.js';
+	import Stats from '@/webgl/jsm/libs/stats.module.js';
+	// import { TrackballControls } from '@/webgl/jsm/controls/TrackballControls.js';
+	import { OrbitControls } from '@/webgl/jsm/controls/OrbitControls.js';
+	import { GLTFLoader } from '@/webgl/jsm/loaders/GLTFLoader.js';
+    // import { Sky  } from '@/webgl/jsm/objects/Sky.js';
+    import { TWEEN } from '@/webgl/jsm/libs/tween.module.min.js';
+    // import { FontLoader } from '@/webgl/jsm/loaders/FontLoader.js';
+	// import { CSS2DRenderer, CSS2DObject } from '@/webgl/jsm/renderers/CSS2DRenderer.js';
+	// import { TextGeometry } from '@/webgl/jsm/geometries/TextGeometry.js';
 
-    import TWEEN from 'three/addons/libs/tween.module.js';
-	import router from "@/router";
 	var requestId = "";
-	// const util = require('@/static/utils/util.js');
-	const config = require('@/services/urlConfig.js');
-	import wallType from '@/static/wallData.js';
+	const util = require('@/static/utils/util.js');
+	const config = require('@/static/config.js');
+	import wallType from '@/webgl/static/wallData.js';
 	// import modelData from '@/webgl/static/layoutModelData.js';
-	// import requestConfig from '@/services/requestConfig.js';
-	// import viewShell from'@/webgl/components/newBottomCom/viewShell/viewShell.vue';
+	import requestConfig from '@/static/lib/requestConfig.js';
+	import viewShell from'@/webgl/components/newBottomCom/viewShell/viewShell.vue';
+	import commonPageMethod from '@/common/commonPageMethod.js';
 	// import * as BufferGeometryUtils from '@/webgl/jsm/utils/BufferGeometryUtils.js';
-	import screenshot from '@/mixins/screenshot.js';
-	import floorMethod from '@/mixins/floorMethod.js';
-	import wallMethod from '@/mixins/wallMethod.js';
-	import loadModel from '@/mixins/loadModel.js';
-	import viewShell from'@/components/newBottomCom/viewShell/viewShell.vue';
+	import screenshot from '@/webgl/mixins/screenshot.js';
+	import floorMethod from '@/webgl/mixins/floorMethod.js';
+	import wallMethod from '@/webgl/mixins/wallMethod.js';
+	import loadModel from '@/webgl/mixins/loadModel.js';
+	const app = getApp(); //获取应用实例
 	export default {
 		components:{viewShell},
-		mixins:[screenshot,floorMethod,wallMethod,loadModel],
+		mixins:[commonPageMethod,screenshot,floorMethod,wallMethod,loadModel],
 		/**
 		 * 页面的初始数据
 		 */
@@ -31,7 +48,7 @@
 				pvCurPageName: "home_show",
 				locusBehaviorName: "主界面",
 				pvCurPageParams: null,
-				houseId: "100296",
+				houseId: "",
 				pvId: 'p_2cmina_23080401',
 				canvas:null,
 				navbar: {
@@ -50,6 +67,7 @@
 				},
 				id:'232',// 户型编号
 				spaceList:[], // 空间列表
+				spaceListBackup:[], // 空间列表原始尺寸备份，用于墙体比例计算
 				gltfSpaces:[], // 场景中地板模型数组
 				curSpaceObj:null, // 当前选中的空间
 				// curSpaceIndex:-1, // 当前选中的空间索引
@@ -62,9 +80,10 @@
 				gltfWalls:[], // 场景中墙体模型数组
 				gltfAutoWalls:[],// 空间自动补墙模型数组
 				// lastWallPosition:0, // 当面墙中墙体模型的开始位置
-				tempSpaceList:[],// 全部空间临时数组
+				tempSpaceList:[],// 全部空间临时数组,寻找关联空间，递归使用
 				leftSpaces:[], // 移动空间左边数组
 				rightSpaces:[],// 移动空间右边数组
+				changeSpaces:[],// 尺寸变化涉及到的全部空间
 				loader:null,
 				scene:null,
 				sky:null,
@@ -119,28 +138,9 @@
 				isIos:false,	//是否ios手机。默认不是
 				currentChangeSpaceId:null,	//当前变化的空间id
 				styleType:1,
-				controls:null,
 			}
 		},
-		watch:{
-			curSpaceObj(newVal, oldVal){
-				if(!newVal || newVal==oldVal){
-					return
-				}
-				console.log("切换空间",newVal, oldVal);
-				// this.curSpaceIndex = this.spaceList.findIndex((item)=>{
-				// 	return item.spaceId == newVal.spaceId
-				// })
-				// TODO 切换空间埋点...
-			},
-			curWallValue(newVal, oldVal){
-				if(!newVal || newVal==oldVal){
-					return
-				}
-				console.log("当前墙体值变化", newVal, oldVal);
-			}
-		},
-		destroyed() {
+		onUnload() {
 			cancelAnimationFrame(requestId, this.canvas)
 			this.worker && this.worker.terminate()
 			setTimeout(() => {
@@ -163,24 +163,38 @@
 				TWEEN && TWEEN.removeAll();//清除所有的tween;
 			}, 0)
 		},
-        mounted() {
-			var that = this;
-			this.houseId = '100296';//
-			this.childLayout = '0'
-			let unit = window.screen.width / 750;//单位rpm 对应 px 的值
-			that.canvasHeight = window.screen.height - (200 * unit) + (20 * unit);
-			
-			const container = this.$refs.webgl;
-            const canvas3d = this.canvas = this.$refs.glcanvas;
+        async onLoad(options) {
+			uni.hideShareMenu && uni.hideShareMenu();
+			this.houseId = options.houseId || '';//
+			this.childLayout = options.childLayout || ''
 			
+			var that = this;
+			let unit = app.globalData.systemInfo.screenWidth / 750;//单位rpx 对应 px 的值
+			that.canvasHeight = app.globalData.systemInfo.screenHeight - (200 * unit) + (20 * unit);
+			if (app.globalData.systemInfo.model.indexOf('iPhone') >= 0 && app.globalData.systemInfo.platform!="devtools") {
+				this.isIos = true;
+			}
+			this.$nextTick(()=>{
+				that.loadOver = true;
+			})
+            const canvas3d = this.canvas = await document.createElementAsync("canvas","webgl")
+			//uniapp 兼容写法，因为uni的页面对象的Vue 实例是$vm
+			let curent = getCurrentPages()[getCurrentPages().length - 1];
+			let currUniPage = getCurrentPages()[getCurrentPages().length - 1].$vm;
+			curent = Object.assign(curent,currUniPage);
+			let container = null;
 			let camera = null, renderer = null, controls=null;
 			// let trackballControls = null;
 			console.warn("***loader0***",this.loader)
 			let loader = null;
-			loader = this.loader = new GLTFLoader();
-			// if(this.childLayout){
+			if(this.loader){
+				loader = this.loader;
+			}else{
+				loader = this.loader = new GLTFLoader();
+			}
+			if(this.childLayout){
 				this.getInitData();//请求获取页面模型数据等
-			// }
+			}
             let scene = this.scene = new THREE.Scene();
             let chooseMesh = this.chooseMesh;//标记鼠标拾取到的mesh
 			let isUserContorl = false;
@@ -190,29 +204,29 @@
 			let stats;
 			init();
 			// render();
-			// this.$refs.myLoading.showLoading("加载中..." + this.progress+"%")
-			// this.myLoadingStatus = true;
+			this.$refs.myLoading.showLoading("加载中..." + this.progress+"%")
+			this.myLoadingStatus = true;
 			this.progress = 1;
 			this.clearEvent = clearEvent;
 			this.attendEvent = attendEvent;
-			this.updateLables = updateLables;
 			this.enableRenderHandle = enableRender;
 			this.tweenCameraAnmaChange = tweenCameraAnmaChange;
+			this.updateLables = updateLables;
 			this.gradientResize = gradientResize;
 			this.moveMeshCenterHandle = moveMeshCenterHandle;
 			this.starRender = starRender;//对外暴露启动渲染的方法
-			this.cameraInit = cameraInit;
-			this.resetControl = resetControl;
 			function init() {
+				container = document.getElementById( 'container' );
 
                 scene.background = new THREE.Color("#FFFFFF");
                 // scene.environment = new THREE.Color("#F2F2F2");
 
 				// 创建相机位置-投影相机
 				camera = new THREE.PerspectiveCamera( 80, window.innerWidth / that.canvasHeight, 0.1, 10000 );
-				// let aspect = window.innerWidth /  that.canvasHeight;
+				// let aspect = window.innerWidth / that.canvasHeight;
 				// camera = new THREE.OrthographicCamera( frustumSize * aspect / - 2, frustumSize * aspect / 2, frustumSize / 2, frustumSize / - 2, 0.1,1000);
-				camera.up.set(0, 1, 0);//俯视状态，将相机的up向量设置为z轴负方向
+				camera.up.set(0, 1, -0);//俯视状态，将相机的up向量设置为z轴负方向
+				camera.position.set(that.cameraStarPosition.x, that.cameraStarPosition.y, that.cameraStarPosition.z);
 				scene.add(camera);
                 that.camera = camera;
 				// 辅助方格
@@ -222,14 +236,22 @@
 				// gridHelper.position.y = 0;
 				// gridHelper.position.x = 0;
 				// scene.add(gridHelper);
-
+				// const rgbeloader = new RGBELoader();
+				// // 加载HDR贴图
+				// rgbeloader.load('https://dm.static.elab-plus.com/miniProgram/environment.hdr', (texture) => {
+				// 	// 将HDR贴图设置为场景的环境贴图
+				// 	texture.mapping = THREE.EquirectangularReflectionMapping;
+				// 	scene.environment = texture;
+				// 	console.warn("***rgbeloader-load***")
+				// })
                 // 环境光会均匀的照亮场景中的所有物体
-                const ambientLight = new THREE.AmbientLight(0xFFEFE0, 2);
-                scene.add(ambientLight);
-                //平行光
-                const light = new THREE.DirectionalLight(0xFFF8E5, 2.2);
-                light.position.set(-14.8, 9.188, -7.448); //default; light shining from top
-                scene.add(light);
+				const ambientLight = new THREE.AmbientLight(0xFEFBF6, 1.62);
+				scene.add( ambientLight );
+
+				//平行光
+				const light = new THREE.DirectionalLight(0xFFFFFF, 1.98);
+				light.position.set(-14.8, 9.188, -7.448); //default; light shining from top
+				scene.add(light);
                 // 从一个点向各个方向发射的光源。一个常见的例子是模拟一个灯泡发出的光。
                 // const pointLight = new THREE.PointLight( 0xffffff, 0.3 );
                 // camera.add( pointLight );
@@ -239,16 +261,16 @@
                 renderer = that.renderer = new THREE.WebGLRenderer( { canvas:canvas3d, alpha: true, antialias:false,
 					// 如果想保存three.js canvas画布上的信息，注意设置preserveDrawingBuffer
 					preserveDrawingBuffer: true, } );
-				renderer.shadowMap.enabled = true;//产生阴影
-				renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
-				renderer.outputEncoding = THREE.sRGBEncoding;
+				// renderer.shadowMap.enabled = true;//产生阴影
+				// renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
+                renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.outputColorSpace = THREE.SRGBColorSpace;
-				// renderer.toneMappingExposure = 0.1;//色调映射的曝光级别。默认是1
+                // renderer.toneMappingExposure = 0.3;//色调映射的曝光级别。默认是1
 				renderer.toneMapping = THREE.NoToneMapping;//色调映射
-				renderer.physicallyCorrectLights = true;//关键参数，模拟物理光照影响，必须设置为true
-				
+                renderer.physicallyCorrectLights = true;//关键参数，模拟物理光照影响，必须设置为true
+
                 renderer.setPixelRatio( window.devicePixelRatio );
-                renderer.setSize( window.innerWidth,  that.canvasHeight );
+                renderer.setSize( window.innerWidth, that.canvasHeight );
                 container.appendChild( renderer.domElement );
 				
 				controls = new OrbitControls(camera, renderer.domElement);
@@ -261,37 +283,19 @@
 				controls.target.set(that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
 				controls.enableZoom = true;//启用摄像机的缩放
 				
-				// that.controls = controls;
 				// controls.target = new THREE.Vector3( that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z );;
+				camera.lookAt(that.controlStarPosition.x,that.controlStarPosition.y,that.controlStarPosition.z);
                 // 监听
                 // renderer.domElement.addEventListener('resize', onWindowResize );
 				stats = new Stats();
 				container.appendChild( stats.dom );
 				attendEvent();	//注册监听事件
 				starRender();	//启动渲染
-				cameraInit();	//初始化摄像头
-            	controls.saveState();//保存当前控制器的状态
-            }
-            //初始化相机位置
-            function cameraInit(){
-            	camera.position.set(that.cameraStarPosition.x, that.cameraStarPosition.y, that.cameraStarPosition.z);
-            	camera.lookAt(that.controlStarPosition.x,that.controlStarPosition.y,that.controlStarPosition.z);
             }
-            //初始状态
-            function resetControl(){
-            	controls.reset();
-            }
-			function onWindowResize() {
-			    camera.aspect = window.innerWidth / that.canvasHeight;
-			    camera.updateProjectionMatrix();
-			    renderer.setSize( window.innerWidth, that.canvasHeight );
-				console.warn("****onWindowResize**")
-			}
 			function attendEvent () {
-				window.addEventListener('resize', onWindowResize);
-				renderer.domElement.addEventListener('touchstart', onPointerStart, false);
-				renderer.domElement.addEventListener('touchmove', onPointerMove, false);
-				renderer.domElement.addEventListener('touchend', onPointerUp, false);
+				document.addEventListener('touchstart', onPointerStart, false);
+				document.addEventListener('touchmove', onPointerMove, false);
+				document.addEventListener('touchend', onPointerUp, false);
 			}
 			function tweenCameraAnmaChange (value) {
 				tweenCameraAnma = value
@@ -302,9 +306,9 @@
 			//取消事件监听-避免二次进入时触发多次事件
 			function clearEvent(){
 				console.warn("**clearEvent****")
-				renderer.domElement && renderer.domElement.removeEventListener('touchstart', onPointerStart);
-				renderer.domElement && renderer.domElement.removeEventListener('touchmove', onPointerMove );
-				renderer.domElement && renderer.domElement.removeEventListener('touchend', onPointerUp );
+				document.removeEventListener('touchstart', onPointerStart);
+				document.removeEventListener('touchmove', onPointerMove );
+				document.removeEventListener('touchend', onPointerUp );
 			}
 			// 手指移动开始
 			function onPointerStart(event){
@@ -318,6 +322,7 @@
 				if(that.overChange){//形变中，不能相应用户操作
 					return false;
 				}
+				// enableRender();
 				that.showLables = false;
 			}
 			//触摸结束
@@ -346,7 +351,7 @@
 					return false;
 				}
 				that.showLables = false;//隐藏
-				// controls.enable = false;//控制器不响应用户的操作
+				controls.enable = false;//控制器不响应用户的操作
 			
 				let spaceObj = chooseMesh;//获取空间模型的相关数据
 				let cameraNewPosition ={};
@@ -376,6 +381,7 @@
 				setTimeout(()=>{
 					that.showLables = true;
 					updateLables();
+					controls.enable = true;//控制器不响应用户的操作
 				},601);//动画结束后回复原始状态
 			}
 			
@@ -442,10 +448,7 @@
 			//高度持续变化处理 time 动画持续时间 单位秒
 			function gradientResize (time,startHeight,endHeight) {
 				let _timeStep = 20;//单位 毫秒
-				// let unit = window.screen.width / 750;//单位rpm 对应 px 的值
-				// that.canvasHeight = window.screen.height - (200 * unit) + (20 * unit);
-				
-				let unit = window.screen.width / 750;//单位rpx 对应 px 的值
+				let unit = app.globalData.systemInfo.screenWidth / 750;//单位rpx 对应 px 的值
 				let _height = startHeight - endHeight;//高度变化-单位rpx
 				let _jisua = that.canvasHeight;
 				let lastHeight = _jisua + (_height * unit);//动画结束时的高度值； 单位 px
@@ -482,9 +485,10 @@
 					camera.aspect = window.innerWidth / that.canvasHeight;
 					camera.updateProjectionMatrix();
 					renderer.setSize( window.innerWidth, that.canvasHeight );
-					tweenCameraAnma = false;
 					that.showLables = true;
 					updateLables();//更新lable
+					tweenCameraAnma = false;
+
 				});
 				// 开始动画
 				tween.start();
@@ -532,16 +536,15 @@
 				//不处在动画过程中，则可以处理移动等动作
 				if(tweenCameraAnma==false){
 					controls.update();
-					// updateLables();//更新lable
 				}
 				requestId = requestAnimationFrame(render, canvas3d);
 				renderer.render(scene, camera);//单次渲染
 				if (that.screenshotResolve) {
-					if(that.isIos){//IOS手机
-						stopRender();
-						that.screenshotResolve()
-						that.screenshotResolve = null;//释放Promise
-					}else{//安卓手机
+					// if(that.isIos){//IOS手机
+					// 	stopRender();
+					// 	that.screenshotResolve()
+					// 	that.screenshotResolve = null;//释放Promise
+					// }else{//安卓手机
 						let gl = renderer.getContext();
 						let frameBuffer = new THREE.Vector2();
 						renderer.getDrawingBufferSize(frameBuffer);
@@ -559,16 +562,16 @@
 								pixelData = null;//清空内存中的数据
 							}
 						}
-					}
+					// }
 				}
             }
 			
-			// const eventChannel = this.getOpenerEventChannel();
-			// // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
-			// eventChannel && eventChannel.hasOwnProperty('on') && eventChannel.on('acceptDataFromOpenerPage', (dataList) => {
-			// 	console.log('监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据',dataList)
-			// 	this.setHouseDetail(dataList)
-			// })
+			const eventChannel = this.getOpenerEventChannel();
+			// 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
+			eventChannel && eventChannel.hasOwnProperty('on') && eventChannel.on('acceptDataFromOpenerPage', (dataList) => {
+				console.log('监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据',dataList)
+				this.setHouseDetail(dataList)
+			})
 			
 		},
 		onShow(){
@@ -591,12 +594,12 @@
 					    duration: 3000
 					});
 				}
-				// this.$refs.myLoading.showLoading("提交中...")
+				this.$refs.myLoading.showLoading("提交中...")
 				let shottingImg = await this.shottingAction() + "?imageMogr2/auto-orient/format/webp/blur/1x0/quality/75";//开始截图
 				console.warn("***shottingImg***",shottingImg);
 				let userId = (app.globalData.single && app.globalData.single.id) ? app.globalData.single.id : '';
 				let param = {
-					"brandId": 94,
+					"brandId": config.brandId,
 					"houseId": this.curHouseObj.houseId,
 					"userId": userId,
 					"floot": this.curHouseObj.houseFloor,
@@ -668,16 +671,16 @@
 				};
 				util.trackRequest(trackparam);
 				let res = await requestConfig("saveCustomizedRecord", param);
-				// this.$refs.myLoading.hideLoading();
+				this.$refs.myLoading.hideLoading();
 				if(res && res.success && res.single){//提交成功
-					// uni.redirectTo({
-					//     url: '/webgl/pages/webgl_rxdz_customize/webgl_rxdz_customize?houseId='+this.houseId + "&id=" + res.single,
-					// 	success: function(res) {
-					// 	},
-					//     fail: function(res) {
-					//         console.log(res)
-					//     },
-					// });
+					uni.redirectTo({
+					    url: '/webgl/pages/webgl_rxdz_customize/webgl_rxdz_customize?houseId='+this.houseId + "&id=" + res.single,
+						success: function(res) {
+						},
+					    fail: function(res) {
+					        console.log(res)
+					    },
+					});
 				}
 			},
 			enableRender(){
@@ -906,7 +909,7 @@
 				let changeHeight = Math.abs(newHeight - curSpace.spaceHeight)
 
 				console.log("变化的尺寸", changeWidth, changeHeight, data, curSpace.spaceWidth, curSpace.spaceHeight);
-				
+
 				if(curSpace.quadrant == 1){
 					// 默认往南 往西移动
 					this.moveSpace(curSpace, 1, 3, isZoomIn, newArea, newWidth, newHeight, changeWidth, changeHeight)
@@ -926,13 +929,14 @@
 					// 默认往南 往西移动
 					this.moveSpace(curSpace, 2, 3, isZoomIn, newArea, newWidth, newHeight, changeWidth, changeHeight)
 				}
-
+				
 				setTimeout(() => {
 					that.updataPageData();
 					that.overChange = false;
 					that.callBackFun && that.callBackFun(true);
-					that.calculateLayoutModelSize();//重新计算家具位置
+					that.calculateLayoutModelSize(); //重新计算家具位置
 					that.updateWallModels(); // 替换墙体模型
+					that.changeLayoutModel(); // 改变空间模型
 				}, 4200);
 			}, 
 			moveSpace(curSpace, directionIndex, directionIndex01, isZoomIn, newArea, newWidth, newHeight, changeWidth, changeHeight){
@@ -1044,6 +1048,8 @@
 
 					if(changeHeight > 0){
 						that.selectWall(directionIndex);
+						// 隐藏变化空间的家具模型，空间动画结束后显示
+						that.changeLayoutModelState(); 
 						that.moveSpaceWall(that.curWallDirection, isZoomIn, changeHeight);
 						// 自动补墙逻辑
 						that.autoCreateWall(directionIndex, curSpace)
@@ -1060,6 +1066,8 @@
 						setTimeout(() => {
 							// // 选中墙面
 							that.selectWall(directionIndex01);
+							// 隐藏变化空间的家具模型，空间动画结束后显示
+							that.changeLayoutModelState(); 
 							// // 移动墙面
 							that.moveSpaceWall(that.curWallDirection, isZoomIn, changeWidth);
 							// 自动补墙逻辑
@@ -1543,8 +1551,10 @@
 				this.instancedFurList = [];
 				this.wallList = [];
 				//恢复初始视角
-				this.cameraInit();
-				this.resetControl();
+				this.camera.position.set(that.cameraStarPosition.x, that.cameraStarPosition.y, that.cameraStarPosition.z);
+				// this.controls.target = new THREE.Vector3( that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z );;
+				this.camera.lookAt(that.controlStarPosition.x,that.controlStarPosition.y,that.controlStarPosition.z);
+				
 				setTimeout(()=>{
 					that.loadSpace();
 				}, 100);
@@ -1577,9 +1587,25 @@
 					})
 					console.log("户型详情列表: ", list);
 					this.houseList = list;//数据会同步到组件中-进而反馈更新页面数据
-					this.curHouseObj = this.houseList[0].layoutStruct[0];
-					// 加载户型
-					// this.loadSpace();
+				}
+			},
+			/**
+			 * 设置户型详情信息
+			 * @param {Object} dataList 户型详情列表
+			 */
+			setHouseDetail(dataList){
+				if(dataList && dataList.data){
+					if(dataList.data instanceof Array){
+						this.houseList = dataList.data;//所有户型列表
+					}else{
+						this.curHouseObj = dataList.data;
+						this.id = this.curHouseObj.id;
+						// 加载户型
+						this.loadSpace();
+					}
+					// console.warn("***curHouseObj***",dataList,this.id)
+				}else{
+					this.curHouseObj = {}
 				}
 			},
 			
@@ -1609,34 +1635,28 @@
 				let spaceId = gltf.spaceId;//具体的空间Id
 				let data = {
 					spaceId:spaceId,
-					// curHouseObj:this.curHouseObj,
-					houseId:this.houseId,
+					curHouseObj:this.curHouseObj,
 				}
-				this.$store.dispatch('setCurHouseObj', this.curHouseObj)
-				// if(this.repeatFlag){
-				// 	return false;
-				// }
-				// this.repeatFlag = true;
-				router.push({
-					name: "webgl_rxdz_roam",
-					query:data
+				if(this.repeatFlag){
+					return false;
+				}
+				this.repeatFlag = true;
+				uni.navigateTo({
+				    url: '/webgl/pages/webgl_rxdz_roam/webgl_rxdz_roam?houseId='+this.houseId,
+					success: (res)=> {
+						// 通过eventChannel向被打开页面传送数据
+						res.eventChannel.emit('acceptDataFromOpenerPage', {
+							data: data
+						})
+						this.showLables = true;
+					},
+				    fail: (res) =>{
+				        console.log(res)
+				    },
+					complete: (res) => {
+						this.repeatFlag = false;
+					}
 				});
-				// uni.navigateTo({
-				//     url: '/webgl/pages/webgl_rxdz_roam/webgl_rxdz_roam?houseId='+this.houseId,
-				// 	success: (res)=> {
-				// 		// 通过eventChannel向被打开页面传送数据
-				// 		res.eventChannel.emit('acceptDataFromOpenerPage', {
-				// 			data: data
-				// 		})
-				// 		this.showLables = true;
-				// 	},
-				//     fail: (res) =>{
-				//         console.log(res)
-				//     },
-				// 	complete: (res) => {
-				// 		this.repeatFlag = false;
-				// 	}
-				// });
 			},
 			//obj 物体对象，type 是否改变颜色
 			moveMeshCenter(obj,type){
@@ -1681,6 +1701,7 @@
                 }
                 console.log("该户型空间数据:", this.spaceList, this.layoutIds,type);
                 console.log("当前选中的空间:", this.curSpaceObj,this.curHouseObj);
+				this.spaceListBackup = JSON.parse(JSON.stringify(this.spaceList));
 				this.loaderSpaceArr(this.spaceList);
                 // 绘制墙体
                 this.getHouseTypeSpaceWalls();
@@ -1736,7 +1757,7 @@
                     }
                 }
                 this.loadSpaceObjWalls(wallArr, wallList);
-				this.getOverallArrangementDetailsList(2);
+				this.getOverallArrangementDetailsList(1);
             },
 			// 加载单个空间墙体资源
             async loadSpaceObjWalls(wallArr, wallList){
@@ -1757,19 +1778,17 @@
 					let endTime = new Date().getTime();
 					console.log("模型全部加载完成，时间：",endTime - startTime);
 					this.progress = 100;
-					// this.$refs.myLoading.showLoading("加载中..." + this.progress + '%')
+					this.$refs.myLoading.showLoading("加载中..." + this.progress + '%')
 					// 设置空间数组的墙体信息
 					// this.setSpaceListWallInfo();
 					this.$nextTick(()=>{
 						this.moveMeshCenter(this.curSpaceObj);
-						// this.myLoadingStatus = false;
-						// this.$refs.myLoading.hideLoading();
+						this.myLoadingStatus = false;
+						this.$refs.myLoading.hideLoading();
 						setTimeout(()=>{
 							this.addWordLabel(); // 添加文字标签
 						}, 610);
 						// 设置空间数组的墙体信息 
-						// 绘制布局
-						// this.getOverallArrangementDetailsList();
 					})
 				})
             },
@@ -1895,6 +1914,9 @@
 
 
 				console.log(`当前墙面的最大值：${this.curWallMaxValue}, 最小值：${this.curWallValue}`)
+				// 统计变化的空间
+				this.changeSpaces.push(...this.leftSpaces)
+				this.changeSpaces.push(...this.rightSpaces)
             },
             // 递归寻找左边->右边关联空间
             findLeftRelateSpace(spaceObj, direction){
@@ -2104,10 +2126,14 @@
 					return item.id == spaceObj.wallId;
 				})
 
+				const initSpaceObj = this.spaceListBackup.find((item)=>{
+					return item.spaceId == spaceObj.spaceId;
+				})
+
 				if(wallObj){
 					let element = JSON.parse(wallObj.wallJson);
 					console.warn("****wallObj**",element)
-					this.computeWallHandle(oldSpaceObj, spaceObj, element, moveOut, direction); // 重新计算-并把空间的计算结果同步到gltfWalls中
+					this.computeWallHandle(initSpaceObj, spaceObj, element, moveOut, direction); // 重新计算-并把空间的计算结果同步到gltfWalls中
 				}
 				
                 // 移动墙体
@@ -2454,9 +2480,8 @@
 			// 墙体缩放逻辑
 			wallTransform(spaceObj, direction, moveOut, moveValue){
                 console.log(`移动的空间的id：${spaceObj.spaceId};移动方向：${direction};是否外移：${moveOut};移动距离：${moveValue}`)
-
 			},
-			 updateWallModels(){
+			updateWallModels(){
 				let that = this;
 				console.log("开始替换墙体模型", this.leftSpaces, this.rightSpaces, this.gltfWalls);
 				let promise_list = [];
@@ -2470,18 +2495,13 @@
 					)
 				});
 
-				
 				Promise.all(promise_list).then(()=>{
 					this.$nextTick(()=>{
 						let newArr = [];
-
-
 						const newWalls = that.gltfWalls.filter(it=>{
 							return !it.isDidWall
 						})
-
 						that.gltfWalls = newWalls;
-
 						console.log("加载完成2",newWalls, newArr, that.gltfWalls, that.wallList);
 					})
 				})
@@ -2490,6 +2510,6 @@
         }
     }
 </script>
-<style lang="scss" scoped>
-	@import "./mainView.scss";
-</style>
+<style lang="css" scoped>
+    @import "./webgl_rxdz.css";
+</style>

src/pages/webgl_rxdz/webgl_rxdz.html

@@ -1,8 +1,20 @@
 <div class="map" style="position: absolute;width: 100%;height: 100vh;z-index: 1;">
 	<mynavbar :barData='navbar'/>
 	<!-- 提交按钮 -->
-	<div class="submit-btn" @click="submitHouse">提交</div>
-	
+	<div class="submit-btn" @click="submitHouse" v-if="styleType==1">提交</div>
+	<div class="area-view">
+		<div>总面积：{{layoutArea}}<span style="font-weight: 700;">㎡</span></div>
+		<div class="rows style1">
+			<div v-if="changeArea" class="reduce">
+				<div>{{changeArea < 0 ? '减少':'增加'}}</div>
+				<div class="style2" >{{Math.abs(changeArea)}}<span class="style3">㎡</span></div>
+			</div>
+			<div>
+				<div>初始面积：{{fixedArea}}<span style="font-weight: 700;">㎡</span></div>
+				<div>当前面积：{{sumArea}}<span style="font-weight: 700;">㎡</span></div>
+			</div>
+		</div>
+	</div>
     <div id="mapDiv" ref="webgl"></div>
 	<canvas id="glcanvas" width="100vw" height="100vh" ref="glcanvas"
 	 :style="{'height':canvasHeight+'px'}">
@@ -11,7 +23,7 @@
 	<!-- 主要操作视图 -->
 	<viewShell pageType="1" :overChange="overChange" :houseList="houseList" :houseObj="curHouseObj" :curHouseType="curHouseType" @curSpaceChange="curSpaceChange" @curHouseTypeChange="curHouseTypeChange" @curHouseFloorChange="curHouseFloorChange"></viewShell>
 	
-	<div v-show="showLables && gltf.text.length>0" v-for="(gltf,index) in lableItem" :key="index" class="word-view"
+	<div v-show="showLables && gltf.text.length>0 && gltf.transform" v-for="(gltf,index) in lableItem" :key="index" class="word-view"
 	:style="{'transform':gltf.transform}" @click="goRoam(gltf)">
 		<div v-if="styleType==2" user-select="false" :class="['number-view ',(index+1)>9?'number-more':'',currentChangeSpaceId==gltf.spaceId?' active':'']">{{gltf.spaceIndex+1}}</div>
 		<div v-else user-select="false" class="word" :class="currentChangeSpaceId==gltf.spaceId?'active':''">{{gltf.text}}></div>

src/pages/webgl_rxdz/webgl_rxdz.scss

@@ -39,7 +39,7 @@
 canvas:focus {
   outline:none;
 }
-canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
+canvas { width:100vw; height:calc(100vh - 200px);z-index: 10; }
 
 #canvas_webgl{
 	/* background: url(resources/images/daikanyama.jpg) no-repeat center center; */
@@ -52,7 +52,40 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 	width: 100vw;
 	z-index: -1;
 	position: absolute;
-	left:0rem;
+	left:0px;
+}
+.area-view{
+	position: absolute;
+	top:10px;
+	left:30px;
+	width:100%;
+	font-size: 24px;
+	font-family: "Verdana";
+	font-weight: 400;
+	z-index: 301;
+	.style1{
+		margin-top:10px;
+	}
+	.style2{
+		font-weight: 700;
+		font-size: 28px;
+	}
+	.style3{
+		font-size: 24px;
+	}
+	span{
+		font-size: 28px;
+	}
+	.reduce{
+		// width: 92px;
+		height: 72px;
+		border-radius: 12px;
+		color: #fa9f40;
+		background: rgba(250, 159, 64, 0.12);
+		font-size: 24px;
+		margin-right:10px;
+		padding:4px 10px;
+	}
 }
 .tran{
 	transition-timing-function: linear;
@@ -60,8 +93,8 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 }
 .voice-mask{
 	position: fixed;
-	left:0rem;
-	top:0rem;
+	left:0px;
+	top:0px;
 	width: 100vw;
 	height:100vh;
 	z-index: 11;
@@ -69,11 +102,11 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 }
 // .btn{
 // 	position:absolute;
-// 	width:300rem;
-// 	height:132rem;
-// 	bottom:60rem;
-// 	right:30rem;
-// 	border-radius: 10rem;
+// 	width:300px;
+// 	height:132px;
+// 	bottom:60px;
+// 	right:30px;
+// 	border-radius: 10px;
 // 	opacity:1;
 // 	z-index:10000;
 // 	color:red;
@@ -86,11 +119,11 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 
 // .changeSizebtn {
 // 	position:absolute;
-// 	width:300rem;
-// 	height:132rem;
-// 	bottom:60rem;
-// 	left:30rem;
-// 	border-radius: 10rem;
+// 	width:300px;
+// 	height:132px;
+// 	bottom:60px;
+// 	left:30px;
+// 	border-radius: 10px;
 // 	opacity:1;
 // 	z-index:10000;
 // 	color:red;
@@ -114,35 +147,35 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 	user-select: none;  
 	z-index: 12;
 	text-align: center;
-	border-radius: 5rem;
+	border-radius: 5px;
 }
 .word{
 	font-family: "Verdana";
 	font-weight: 400;
-	height: 40rem;
-	line-height: 40rem;
-	padding:0rem 10rem;
-	border-radius: 20rem;
+	height: 40px;
+	line-height: 40px;
+	padding:0px 10px;
+	border-radius: 20px;
 	background: #fff;
-	font-size:26rem;
+	font-size:26px;
 	color: #1d1d1d;
 }
 .number-view{
-	width: 30rem;
-	height: 30rem;
-	line-height: 30rem;
+	width: 30px;
+	height: 30px;
+	line-height: 30px;
 	background: #fff;
 	color: #121212;
 	font-weight: 700;
-	font-size: 28rem;
+	font-size: 28px;
 	font-family: "DIN Alternate Bold";
-	border-radius: 30rem;
+	border-radius: 30px;
 }
 .number-more{
-	width: 40rem;
-	height: 40rem;
-	line-height: 40rem;
-	border-radius: 30rem;
+	width: 40px;
+	height: 40px;
+	line-height: 40px;
+	border-radius: 30px;
 }
 .active{
 	background: #faad5c;
@@ -150,30 +183,30 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 }
 .submit-btn{
 	position: absolute;
-	top:120rem;
-	right:20rem;
-	width: 140rem;
-	height: 64rem;
-	border-radius: 32rem;
-	backdrop-filter: blur(40rem);
+	top:42px;
+	right:20px;
+	width: 140px;
+	height: 64px;
+	border-radius: 32px;
+	backdrop-filter: blur(40px);
 	background-color: rgba(255, 156, 56, 1);
 	font-family: "Verdana Bold";
 	font-weight: 700;
-	font-size: 28rem;
+	font-size: 28px;
 	color: #fff;
 	text-align:center;
-	line-height:64rem;
-	z-index: 11;
+	line-height:64px;
+	z-index: 302;
 }
 .submit-btn1{
-	left:20rem;
+	left:20px;
 }
 .voice-view{
-	width: 614rem;
-	height: 312rem;
-	border-radius: 40rem;
+	width: 614px;
+	height: 312px;
+	border-radius: 40px;
 	background: #fff;
-	box-shadow: 0 -6rem 12rem #0000001f;
+	box-shadow: 0 -6px 12px #0000001f;
 	position: absolute;
 	left:50%;
 	top:50%;
@@ -181,11 +214,11 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 	text-align:center;
 }
 .voice-tips{
-	font-size: 28rem;
+	font-size: 28px;
 	color: rgba(36, 36, 36, 0.51);
-	margin-top:12rem;
+	margin-top:12px;
 }
 .voice-gif{
 	width: 100%;
-	margin-top:56rem;
+	margin-top:56px;
 }

src/pages/webgl_rxdz_customize/webgl_rxdz_customize.html

@@ -11,7 +11,7 @@
 					:current="currImgIdx" ref="carousel">
                     <el-carousel-item v-for="(img,s) in tabData[tabIndex].hardboundEffect" :key="s" :item-id="s" class="master-pic-img">
                         <img @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend" class="master-pic-img" :src="img" mode="aspectFill" />
-						<div class="lookHouseView rows justify-center" v-if="tabIndex==0 && (!shareUserId || shareUserId==userId)" @click="toMode">
+						<div class="lookHouseView rows justify-center" v-if="tabIndex==2 && (!shareUserId || shareUserId==userId)" @click="toMode">
 							<img class="icon-ai" src="https://dm.static.elab-plus.com/miniProgram/iconfont/icon-ai.png" mode="widthFix"/>
 							查看户型
 						</div>
@@ -35,7 +35,7 @@
             </div>
         </div>
         <!-- 提交信息区域 -->
-        <div class="booking-info" :style="{'color':tabIndex==0?'#000':'#fff'}" v-if="layoutStruct">
+        <div class="booking-info" :style="{'color':tabIndex==0?'#000':'#000'}" v-if="layoutStruct">
 			<div class="left-line line"></div>
 			<div class="right-line line"></div>
             <div class="writingBox rows">
@@ -103,10 +103,10 @@
         </div>
 		<!-- 底部按钮 -->
 		<div class="bottom-view columns justify-center">
-			<div class="bottom-title" :style="{'color':tabIndex==0?'#1A1A1A':'#fff'}">
+			<div class="bottom-title" :style="{'color':tabIndex==0?'#1A1A1A':'#000'}">
 				- 分享我的梦想家 -
 			</div>
-			<div class="bottom-tips" :style="{'color':tabIndex==0?'#1A1A1A':'#fff'}">
+			<div class="bottom-tips" :style="{'color':tabIndex==0?'#1A1A1A':'#000'}">
 				分享好友可获得私定高额优惠
 			</div>
 			<div class="rows rows-between">
@@ -114,15 +114,16 @@
 				    加企微 · 定制服务
 				</div>
 				<div class="bottom-btn btn-share rows justify-center" @click="optionChange(true)">
-					<i class="iconfont icon-Shared" style="color: #ffffff;font-size:32rem;margin-right:20rem;"></i>
-				    立即分享
+					<i class="iconfont icon-Shared"></i>
+				    <!-- 立即分享 -->
+					去首页
 				</div>
 			</div>
 		    
 		</div>
 		<!-- 高斯背景图 -->
-		<div class="swiper-img-gs-mh" v-if="gsImage" >
-			<img class="img" mode="aspectFill" :src="gsImage" />
+		<div class="swiper-img-gs-mh"  >
+			<img class="img" mode="aspectFill" src="https://dm.static.elab-plus.com/miniProgram/cusbg.png" />
 		</div>
 		
     </div>

src/pages/webgl_rxdz_customize/webgl_rxdz_customize.scss

@@ -4,11 +4,11 @@ page {
 }
 
 .font40{
-    font-size: 40rem;
+    font-size: 40px;
     // color: #fff;
 }
 .font52{
-    font-size: 52rem;
+    font-size: 52px;
 	font-weight: 700;
 }
 .pointerEvents{
@@ -26,12 +26,12 @@ page {
     .picArea{
         position: relative;
 		width: 100%;
-		height:1100rem;
+		height:1100px;
         .master-pic{
             position: relative;
 			width: 100%;
-			height:930rem;
-            // padding: 10rem;
+			height:930px;
+            // padding: 10px;
             box-sizing: border-box;
             // background-color: #171717;
 			.master-pic-swiper{
@@ -46,41 +46,41 @@ page {
             }
 			.lookHouseView{
 				position: absolute;
-				left:276rem;
-				bottom:138rem;
-				width: 200rem;
-				height: 76rem;
-				border-radius: 38rem;
+				left:276px;
+				bottom:138px;
+				width: 200px;
+				height: 76px;
+				border-radius: 38px;
 				background: rgba(0, 0, 0, 0.4);
 				font-family: "Verdana";
 				font-weight: 400;
-				font-size: 28rem;
+				font-size: 28px;
 				color: #fff;
 				.icon-ai{
-					width:46rem;
-					height:46rem;
-					margin-right:10rem;
+					width:46px;
+					height:46px;
+					margin-right:10px;
 				}
 			}
 
 			.indicator-view{
 				position: absolute;
 				z-index: 12;
-				bottom: 100rem;
+				bottom: 100px;
 				left:50%;
 				transform: translateX(-50%);
 				.indicator-item{
-					width: 12rem;
-					height: 12rem;
+					width: 12px;
+					height: 12px;
 					background: #fff;
 					opacity: 0.52;
-					margin-right:6rem;
+					margin-right:6px;
 					border-radius: 50%;
 					&.active{
 						opacity:1;
 					}
 					&:last-child{
-						margin-right:0rem;
+						margin-right:0px;
 					}
 				}
 			}
@@ -89,47 +89,47 @@ page {
     .tabList{
 		position: absolute;
 		width: 100%;
-		height:246rem;
-		bottom:0rem;
+		height:246px;
+		bottom:0px;
 		overflow-x: auto;
 		overflow-y: hidden;
 		z-index: 2;
         .tab-item{
-			width:196rem;
-            margin-right: 20rem;
+			width:196px;
+            margin-right: 20px;
             font-family: "Verdana";
             font-weight: 400;
-            font-size: 24rem;
+            font-size: 24px;
             color: #1d1d1d;
 			text-align:center;
-			padding:2rem;
-			// border:solid 2rem #65574933;
-			// box-shadow: 0 4rem 40rem #65574933;
+			padding:2px;
+			// border:solid 2px #65574933;
+			// box-shadow: 0 4px 40px #65574933;
 			background: #ededed;
-			filter: drop-shadow(0 4rem 40rem #65574933);
+			filter: drop-shadow(0 4px 40px #65574933);
 			box-sizing: border-box;
             &.tabActive{
                 position: relative;
                 font-weight: 700;
                 color: #4d463f;
-				// border:solid 2rem #65574933;
+				// border:solid 2px #65574933;
 				background: rgba(254, 176, 102, 0.5);
-				filter: drop-shadow(0 4rem 40rem #65574933);
+				filter: drop-shadow(0 4px 40px #65574933);
             }
 			&:first-child{
-			    margin-left: 30rem;;
+			    margin-left: 30px;;
 			}
             &:last-child{
-                margin-right: 30rem;
+                margin-right: 30px;
             }
 			.tab-img{
-				width: 192rem;
-				height: 200rem;
+				width: 192px;
+				height: 200px;
 				object-fit: cover;
 			}
 			.tab-info{
 				width:100%;
-				padding:6rem 10rem;
+				padding:6px 10px;
 				box-sizing: border-box;
 			}
         }
@@ -137,35 +137,35 @@ page {
     .textAbout{
         font-family: "DIN Alternate Bold";
         font-weight: 700;
-        font-size: 20rem;
+        font-size: 20px;
         // color: rgba(255, 255, 255, 0.3);
 		opacity: 0.3;
-		margin-left:10rem;
+		margin-left:10px;
     }
     .booking-info{
-        margin-left: 30rem;
-        margin-right: 30rem;
-        margin-top: 130rem;
-        margin-bottom: 15rem;
+        margin-left: 30px;
+        margin-right: 30px;
+        margin-top: 130px;
+        margin-bottom: 15px;
         position: relative;
-        border: 2rem solid rgba(255, 255, 255, 0.5);
+        border: 2px solid rgba(255, 255, 255, 0.5);
 		border-top:none;
-        padding: 90rem 30rem 20rem;
+        padding: 90px 30px 20px;
 		box-sizing: border-box;
 		color: #fff;
 		z-index: 3;
 		.line{
 			position: absolute;
-			top:0rem;
-			width: 100rem;
-			height:2rem;
+			top:0px;
+			width: 100px;
+			height:2px;
 			background-color: rgba(255, 255, 255, 0.5);
 		}
 		.left-line{
-			left:0rem;
+			left:0px;
 		}
 		.right-line{
-			right:0rem;
+			right:0px;
 		}
         // .booking-info-bg{
         //     position: absolute;
@@ -175,17 +175,17 @@ page {
         //     height: unset;
         // }
         .writingBox{
-			padding:0rem 10rem;
-            // width: 440rem;
+			padding:0px 10px;
+            // width: 440px;
             width: max-content;
-            height: 120rem;
+            height: 120px;
             position: absolute;
-            // margin-top: -45rem;
+            // margin-top: -45px;
             // font-family: "STFangsong";
             font-weight: 400;
             
             // color: #fff;
-            top: -60rem;
+            top: -60px;
             box-sizing: border-box;
             left: 50%;
             transform: translate(-50%,0);
@@ -194,26 +194,26 @@ page {
 			// backdrop-filter: blur(20px);
             
             .writing-img{
-                width: 120rem;
-                height: 120rem;
-                min-width: 120rem;
-                filter: drop-shadow(0 3rem 4rem #00000029); 
+                width: 120px;
+                height: 120px;
+                min-width: 120px;
+                filter: drop-shadow(0 3px 4px #00000029); 
                 box-sizing: border-box;
                 border-radius: 50%;
-                border: 6rem solid #F5F5F5;
-				margin-right:30rem;
+                border: 6px solid #F5F5F5;
+				margin-right:30px;
             }
             .wiriting-right{
                 // text-align: right;
-                padding-right: 20rem;
+                padding-right: 20px;
                 .wiriting-text{
-                    // height: 60rem;
+                    // height: 60px;
                 }
             }
             
         }
         .info-bar{
-            // padding: 80rem 50rem 140rem;
+            // padding: 80px 50px 140px;
             display: flex;
             flex-wrap: wrap;
             
@@ -221,8 +221,8 @@ page {
                 // color: #fff;
                 width: 33.33%;
                 
-                margin-bottom: 40rem;
-                padding-left: 10rem;
+                margin-bottom: 40px;
+                padding-left: 10px;
                 box-sizing: border-box;
                 // &:nth-child(3n-1){
                 //     width: 39.66%;
@@ -238,26 +238,27 @@ page {
             .info-item-label{
                 font-family: "Verdana";
                 font-weight: 400;
-                font-size: 28rem;
-                margin-bottom: 8rem;
+                font-size: 28px;
+                margin-bottom: 8px;
             }
             .info-item-value{
                 font-family: "DIN Alternate Bold";
                 font-weight: bold;
-                font-size: 34rem;
+                font-size: 34px;
                 // white-space: nowrap;
             }
         }
     }
 }
 .swiper-img-gs-mh {
-	width: 100vw;
-	// height: 1102rem;
-	height: 1327rem;
+	// width: 100vw;
+	// top:0px;
+	height: calc(100% - 930px);
+	top:930px;
+	width: 100%;
 	opacity: 0.85;
 	position: absolute;
 	left: 0;
-	top:930rem;
 	
 	z-index: 1;
 	overflow: hidden;
@@ -267,55 +268,61 @@ page {
 		height: 100%;
 		filter: blur(20px);
 		transform: scale(1.2);
+		object-fit: cover;
 	}
 }
 .bottom-view{
     position: relative;
     width: 100%;
-	padding-top:128rem;
-	padding-bottom:300rem;
+	padding-top:128px;
+	padding-bottom:300px;
     box-sizing: border-box;
 	z-index: 3;
     .bottom-title{
 		font-family: "DIN Alternate Bold";
 		font-weight: 700;
-		font-size: 28rem;
+		font-size: 28px;
 		text-align: center;
 		color: #fff;
-		text-shadow: 0 0 8rem rgba(0, 0, 0, 0.17);
+		text-shadow: 0 0 8px rgba(0, 0, 0, 0.17);
 	}
 	.bottom-tips{
 		font-family: "Verdana";
 		font-weight: 400;
-		font-size: 28rem;
-		line-height: 48rem;
+		font-size: 28px;
+		line-height: 48px;
 		text-align: center;
-		margin-top:8rem;
-		margin-bottom:40rem;
+		margin-top:8px;
+		margin-bottom:40px;
 		opacity: 0.6;
 	}
     .bottom-btn{
-        width: 290rem;
-        height: 80rem;
-        border-radius: 40rem;
+        width: 290px;
+        height: 80px;
+        border-radius: 40px;
 		font-family: "DIN Alternate Bold";
 		font-weight: 700;
-		font-size: 28rem;
+		font-size: 28px;
         .bottom-subtitle{
             font-family: "DIN Alternate Bold";
             font-weight: bold;
-            font-size: 30rem;
+            font-size: 30px;
             white-space: nowrap;
         }
     }
 	.btn-qw{
 		background: rgba(246, 165, 83, 0.2);
 		color: #f6a553;
-		margin-right:30rem;
+		margin-right:30px;
 	}
     .btn-share{
         background: #f6a553;
-        box-shadow: 0 6rem 20rem rgba(208, 193, 168, 0.31);
+        box-shadow: 0 6px 20px rgba(208, 193, 168, 0.31);
 		color: #fff;
     }
+	.icon-Shared{
+		color: #ffffff;
+		font-size:32px;
+		margin-right:20px;
+	}
 }

src/pages/webgl_rxdz_customize/webgl_rxdz_customize.vue

@@ -6,12 +6,13 @@
 	const config = require('@/services/urlConfig.js');
 	import router from "@/router";
 	import touchHandle from '@/mixins/touchHandle.js';
+	import commonPageMethod from '@/mixins/commonPageMethod.js';
 // const app = getApp(); //获取应用实例
 // import requestConfig from '@/static/lib/requestConfig.js';
 // import commonPageMethod from '@/common/commonPageMethod.js';
 // import commonMethod from '@/common/commonMethod.js';
 export default {
-    mixins: [touchHandle],
+    mixins: [touchHandle,commonPageMethod],
     /**
      * 页面的初始数据
      */
@@ -37,7 +38,7 @@ export default {
                 shareToken: "",
                 pageName: this.pvCurPageName,
             },
-            houseId: config.houseIdHs,
+            houseId: $config.houseIdHs,
 
             shareUserId: null, // 分享者ID
             id: '6523d91af65c626211ee21c8',//方案库id
@@ -96,15 +97,24 @@ export default {
 			}
 		},
         navigateFuc(){
-			// this.showToast("敬请期待!");
-			this.$message.warning("敬请期待");
+			if(window.__wxjs_environment === 'miniprogram'){
+				wx.miniProgram.navigateTo({url: '/pages/transfer/transfer?event=openCustomerServiceChat&houseId='+this.houseId})
+			}else{
+				this.$message.warning("敬请期待");
+			}
 		},
 		optionChange(){
-			// this.showToast("敬请期待!");
-			this.$message.warning("敬请期待");
+			if(window.__wxjs_environment === 'miniprogram'){
+				wx.miniProgram.redirectTo({url: '/pages/index/index?houseId='+$config.xcxHouseId})
+			}else{
+				this.$message.warning("敬请期待");
+			}
 		},
 		tabDataHandle(expand){
 			let tmp = expand;
+			if(!tmp || !tmp.landImg || !tmp.baseImg){
+				return false
+			}
 			let data = {
 				name : "我的地块",
 				imgUrl : tmp.landImg,
@@ -126,7 +136,7 @@ export default {
 			let userId = this.userId || '';
             let params = {
                 id: this.id,
-                brandId: config.brandId,
+                brandId: $config.brandId,
 				houseId:this.houseId,
 				userId,
             };

src/pages/webgl_rxdz_look/webgl_rxdz_look.scss

@@ -29,28 +29,29 @@ canvas {
 	color: #1d1d1d;
 	user-select: none;   /* don't let the text get selected */
 	z-index: 12;
-	font-size:26rem;
+	font-size:26px;
 	/* pointer-events:none; */
-	line-height: 40rem;
-	/* width: 90rem; */
-	height: 40rem;
-	padding:0rem 10rem;
-	border-radius: 20rem;
+	line-height: 40px;
+	/* width: 90px; */
+	height: 40px;
+	padding:0px 10px;
+	border-radius: 20px;
 	background: #fff;
 	text-align: center;
 }
 .floor-view{
 	position: absolute;
-	left:30rem;
-	bottom:60rem;
-	width: 72rem;
-	border-radius: 12rem;
+	left:30px;
+	bottom:60px;
+	width: 72px;
+	border-radius: 12px;
 	background: rgba(0, 0, 0, 0.4);
 	overflow: hidden;
 	z-index: 11;
+	font-size: 28px;
 }
 .floor-item{
-	height: 60rem;
+	height: 60px;
 	color: #fff;
 }
 .floor-item.active{

src/pages/webgl_rxdz_look/webgl_rxdz_look.vue

@@ -15,10 +15,10 @@
 	import loadModel from '@/mixins/loadModel.js';
 	import wallMethod from '@/mixins/wallMethod.js';
 	import floorMethod from '@/mixins/floorMethod.js';
-	// import commonPageMethod from '@/common/commonPageMethod.js';
+	import commonPageMethod from '@/mixins/commonPageMethod.js';
     // const app = getApp(); //获取应用实例
     export default {
-		mixins:[loadModel,floorMethod,wallMethod],
+		mixins:[loadModel,floorMethod,wallMethod,commonPageMethod],
         /**
          * 页面的初始数据
          */
@@ -26,8 +26,9 @@
             return {
 				pvCurPageName: "webgl_rxdz_look",
 				pvCurPageParams: null,
+				locusBehaviorName: "查看页面",
                 houseId: "",
-				pvId: 'p_2cmina_01043',
+				pvId: 'p_2cmina_23080404',
 				navbar: {
 				    showCapsule: 1,
 				    title: '查看户型',
@@ -69,10 +70,12 @@
 				instancedMeshList: [],
 				lableItem:[],
 				showLables:false,
+				gltfSpaceRoofs:[], // 屋顶模型数组
 				floorList:[],
 				floorId:null,
 				curData:null,	//上一个页面传来的数据
 				curSpaceObj:null,	//当前应该定位到的空间
+				isIOS:false,
             }
         },
 		computed: {
@@ -88,15 +91,40 @@
 			this.worker && this.worker.terminate()
 			setTimeout(() => {
 				if (this.renderer instanceof THREE.WebGLRenderer) {
-					this.renderer.dispose()
-					this.renderer.forceContextLoss()
-					this.renderer.context = null
-					this.renderer.domElement = null
-					this.renderer = null;
+					// 遍历场景中的所有子对象，找到类型为Mesh的对象并移除
+					let deleList = this.scene.children.filter(object=>{
+						if (object instanceof THREE.Mesh) {
+							return object
+						}
+					})
+					if(deleList && deleList.length>0){
+						this.scene.remove(...deleList);
+					}
+					this.scene.traverse(function(object) {
+						if (object instanceof THREE.Mesh) {
+							if(object.geometry && typeof(object.geometry.dispose)=='function'){
+								object.geometry.dispose();
+							}
+							if(object.material && typeof(object.material.dispose)=='function'){
+								object.material.dispose();
+							}
+							if(object.texture && typeof(object.texture.dispose)=='function'){
+								object.texture.dispose();
+							}
+						}
+					});
+					this.renderer.clear();
+					this.renderer.dispose();
+					this.renderer.forceContextLoss();
+					this.renderer.context = null;
+					this.renderer.domElement = null;
+					this.renderer = null;;
 					this.clearHandle()
 				}
 			}, 0)
 			this.gltfWalls = [];
+			this.gltfSpaces = [];
+			this.gltfSpaceRoofs = [];
 			this.instancedMeshList = [];
 			this.instancedSpaceMeshList = [];
 			this.lableItem = [];
@@ -112,11 +140,20 @@
             this.spaceId = this.$route.query.spaceId?this.$route.query.spaceId:'';
             this.id = this.$route.query.id?this.$route.query.id:'';
 			console.warn("***mounted-webgl_rxdz_look****",this.id,this.$route.query)
+			this.isIOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
 			if(this.id){
 				this.getIdData()
 			}else{
 				this.$store.state.loadingMsg = "没有数据~";
 			}
+			let screenWidth = window.screen.width;
+			let screenHeight = window.screen.height;
+			if(window.innerWidth && window.screen.width){
+				screenWidth = Math.min(window.innerWidth,window.screen.width)
+			}
+			if(window.innerHeight && window.screen.height){
+				screenHeight = Math.min(window.innerHeight,window.screen.height)
+			}
             let container = this.$refs.webgl;
             let canvas3d = this.canvas = this.$refs.glcanvas;
 
@@ -145,29 +182,45 @@
 			this.resetControl = resetControl;
 			function init() {
 
-                scene.background = new THREE.Color("#F2F2F2");
-                scene.environment = new THREE.Color("#F2F2F2");
+                scene.background = new THREE.Color("#FFFFFF");
 
 				// 创建相机位置
-				camera = new THREE.PerspectiveCamera( 80, window.screen.width / window.screen.height, 0.1, 10000 );
+				camera = new THREE.PerspectiveCamera( 80, screenWidth / screenHeight, 0.1, 10000 );
 				camera.up.set(0, 1, 0);//俯视状态，将相机的up向量设置为z轴负方向
 				scene.add(camera);
                 that.camera = camera;
 
                 // 环境光会均匀的照亮场景中的所有物体
-                const ambientLight = new THREE.AmbientLight(0xFFEFE0, 1.48 );
-                scene.add( ambientLight );
+                const ambientLight = new THREE.AmbientLight(0xFFEFE0, 3);
+                scene.add(ambientLight);
                 //平行光
-                const light = new THREE.DirectionalLight(0xFFF8E5, 1.96 );
-                light.position.set(-14.8, 9.188, -7.448); //default; light shining from top
+                const light = new THREE.DirectionalLight(0xFFF8E5, 3);
+                light.position.set(-3, 9, 3); //default; light shining from top
+                light.castShadow = true; // default false
+                // 默认情况下光投影相机区域是一个长宽高为10x10x500的长方体区域，光源投射方向为通过坐标原点
+                light.shadow.camera.left = -100; // default
+                light.shadow.camera.right  = 100; // default
+                light.shadow.camera.top  = 100; // default
+                light.shadow.camera.bottom  = -100; // default
+                
+                light.shadow.mapSize.width = 1024; // default
+                light.shadow.mapSize.height = 1024; // default
+                // light.shadow.camera.near = 0.1; // default
+                // light.shadow.camera.far = 500; // default
+                
+                // light.shadow.bias = -0.01;
+                // light.shadow.radius = 1;
+                // light.shadow.darkness = 1; // 设置阴影强度为0.5
                 scene.add(light);
 				//antialias 这个值得设置为false，不然IOS上截图会失效
                 renderer = that.renderer = new THREE.WebGLRenderer({
 					canvas:canvas3d, 
 					alpha: true,
-					// 如果想保存three.js canvas画布上的信息，注意设置preserveDrawingBuffer
-					preserveDrawingBuffer: true,
 				});
+				if(!that.isIOS){
+					renderer.shadowMap.enabled = true;//产生阴影
+					renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
+				}
                 renderer.outputEncoding = THREE.sRGBEncoding;
                 renderer.outputColorSpace = THREE.SRGBColorSpace;
                 // renderer.toneMappingExposure = 0.1;//色调映射的曝光级别。默认是1
@@ -175,7 +228,7 @@
                 renderer.physicallyCorrectLights = true;//关键参数，模拟物理光照影响，必须设置为true
 
                 renderer.setPixelRatio( window.devicePixelRatio );
-                renderer.setSize( window.screen.width, window.screen.height );
+                renderer.setSize( screenWidth, screenHeight );
                 container.appendChild( renderer.domElement );
 				
 
@@ -191,9 +244,9 @@
 				controls.target.set(that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
 				controls.enableZoom = true;//启用摄像机的缩放
 				
-				stats = new Stats();
-				container.appendChild(stats.dom);
-				stats.domElement.style.top = '100px';
+				// stats = new Stats();
+				// container.appendChild(stats.dom);
+				// stats.domElement.style.top = '100px';
 				// 监听
                 window.addEventListener( 'resize', onWindowResize );
                 // raycaster = new THREE.Raycaster();
@@ -360,9 +413,9 @@
 				tween.start();
 			}
 			function onWindowResize() {
-                camera.aspect = window.screen.width / window.screen.height;
+                camera.aspect = screenWidth / screenHeight;
                 camera.updateProjectionMatrix();
-                renderer.setSize( window.screen.width, window.screen.height );
+                renderer.setSize( screenWidth, screenHeight );
             }
 			//计算漫游时当前选中空间的观察点和摄像机的放置点位
 			//distance 表示要沿着视角移动的距离
@@ -380,14 +433,14 @@
 					position.setFromMatrixPosition(stratMatrix);//从四维向量中提取位置信息
 					// console.warn("***updateLables***",item.instancedAtIndex,JSON.stringify(position));
 					position.project(camera);
-					const x = (position.x *  .5 + .5) * window.screen.width;
-					const y = (position.y * -.5 + .5) * window.screen.height;
+					const x = (position.x *  .5 + .5) * screenWidth;
+					const y = (position.y * -.5 + .5) * screenHeight;
 					lable.transform = `translate(-50%, -50%) translate(${x}px,${y}px)`;
 				})
 			}
             function render() {
                 TWEEN && TWEEN.update();
-                stats.update();
+                // stats.update();
 				//不处在动画过程中，则可以处理移动等动作
 				if(tweenCameraAnma==false){
 					controls.update();
@@ -440,7 +493,7 @@
 				let userId = this.userId || '';
 			    let params = {
 			        id: this.id,
-			        brandId: config.brandId,
+			        brandId: $config.brandId,
 					houseId:this.houseId,
 					userId,
 			    };
@@ -518,7 +571,7 @@
 				}
                 if(this.curHouseObj){
                     const spaceDetail = this.curHouseObj;
-                    const spaceList =spaceDetail.houseJson;
+                    const spaceList = spaceDetail.houseJson;
                     // 交换centerX， centerY;上一页面已经处理过了，这里不在需要处理
                     for (let index = 0; index < spaceList.length; index++) {
                         var element = spaceList[index];
@@ -536,6 +589,9 @@
 						element.wallMoveValue = "[0,0,0,0]"
                         this.spaceList.push(element);
                         this.wallIds.push(element.wallId);
+						if(element.wallList){
+							this.wallList.push(JSON.parse(element.wallList));
+						}
 						if(element.isSelected){ // 默认选中空间
 						    this.curSpaceObj = element;
 						}
@@ -552,13 +608,24 @@
             },
             // 获取墙体数据
             async getHouseTypeSpaceWalls(){
-                let data = {id:this.wallIds}
-                const res = await requestConfig('getHouseTypeSpaceWalls', data, true);
-                console.log("墙体数据:", res.list)
-                let wallList = [];
-                if(res.success){
-                    wallList = this.wallList = res.list;
-                }
+                // let data = {id:this.wallIds}
+                // const res = await requestConfig('getHouseTypeSpaceWalls', data, true);
+                // console.log("墙体数据:", res.list)
+                // let wallList = [];
+                // if(res.success){
+                //     wallList = this.wallList = res.list;
+                // }
+				let wallList = [];
+				if(this.wallList && this.wallList.length>0){
+					wallList = this.wallList;
+				}else{
+					let data = {id:this.wallIds}
+					const res = await requestConfig('getHouseTypeSpaceWalls', data, true);
+					console.log("墙体数据:", res.list)
+					if(res.success){
+					    wallList = this.wallList = res.list;
+					}
+				}
                 let wallArr = []
                 for (let index = 0; index < wallList.length; index++) {//每个空间对应一个数据
                     let element = JSON.parse(wallList[index].wallJson);

src/pages/webgl_rxdz_roam/webgl_rxdz_roam - 副本.vue

@@ -0,0 +1,932 @@
+<template src="./webgl_rxdz_roam.html">
+
+</template>
+<script>
+	import * as THREE from 'three';
+	import Stats from 'three/addons/libs/stats.module.js';
+	import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+	import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
+	
+	import TWEEN from 'three/addons/libs/tween.module.js';
+
+	var requestId = "";
+    const util = require('@/utils/util.js').default;
+	// import util from '@/utils/util.js';
+    // const config = require('@/services/urlConfig.js');
+    // import requestConfig from '@/static/lib/requestConfig.js';
+	import viewShell from'@/components/newBottomCom/viewShell/viewShell.vue';
+	import viewMask from'@/components/newBottomCom/viewMask/viewMask.vue';
+
+	// import { RGBELoader } from '@/webgl/jsm/loaders/RGBELoader.js';
+	import screenshot from '@/mixins/screenshot.js';
+	import floorMethod from '@/mixins/floorMethod.js';
+	import loadModel from '@/mixins/loadModel.js';
+	import wallMethod from '@/mixins/wallMethod.js';
+	// import commonPageMethod from '@/common/commonPageMethod.js';
+    // const app = getApp(); //获取应用实例
+    export default {
+		components:{viewShell,viewMask},
+		mixins:[screenshot,loadModel,floorMethod,wallMethod],
+        /**
+         * 页面的初始数据
+         */
+        data() {
+            return {
+				pvCurPageName: "room_show",
+				locusBehaviorName: "房间展示",
+				pvCurPageParams: null,
+                houseId: "",
+				pvId: 'p_2cmina_23080402',
+				canvas:null,
+				navbar: {
+				    showCapsule: 1,
+				    title: '客厅',
+				    titleColor: '#000',
+				    navPadding: 0,
+				    navPaddingBg:'transparent',
+				    navBarColor: 'transparent',
+				    navBackColor: 'transparent',
+				    haveCallback: false, // 如果是 true 会接手 navbarBackClk
+				    fromShare: false,
+				    fromProject: 0,
+				    shareToken: "",
+				    pageName: this.pvCurPageName,
+				},
+                id:'',// 户型编号
+                spaceList:[], // 空间列表
+                gltfSpaces:[], // 场景中地板模型数组
+                curSpaceObj:null, // 当前选中的空间
+                // curSpaceIndex:-1, // 当前选中的空间索引
+				spaceId:null,
+                wallIds:[], // 空间墙体id
+				// wallList:[], // 墙体数据
+                gltfWalls:[], // 场景中墙体模型数组
+                loader:null,
+                scene:null,
+                // sky:null,
+                camera:null,
+				controlStarPosition : { x:0, y:0, z:0},	//控制器初始位置
+				cameraStarPosition : { x:0, y:20, z:0}	,//摄像头初始位置
+				cameraLastPosition: null,		//摄像头上一次移动到的位置
+				controlLastPosition: null,		//观察点上一次移动到的位置
+				canvasHeight:408,	//canvas视图的高度-计算得出
+				chooseMesh:null,//标记鼠标拾取到的mesh
+				isManyou: false,	//当前是否处在漫游状态
+				shottingImg: [],
+				progress:1,	//进度条
+				myLoadingStatus:false,
+				// textGeoList:[],
+				repeatFlag:false,	//重复点击
+				// skyPlan: null, // 天空盒子
+				instancedMeshList: [],
+				screenshotResolve:null,
+				actors:[],
+				showDownView:true,//默认显示下载按钮
+				currentActor:null,
+				isIos:false,	//是否ios手机。默认不是
+				circleGroup:null,
+				// aiImagesList:[
+				// 	// "https://dm.static.elab-plus.com/miniProgram/plus_IM01.png",
+				// 	// "https://dm.static.elab-plus.com/miniProgram/plus_IM02.png",
+				// 	// "https://dm.static.elab-plus.com/miniProgram/plus_IM03.png",
+				// 	// "https://dm.static.elab-plus.com/miniProgram/plus_IM04.png",
+				// ]
+            }
+        },
+		beforeDestroy() {
+			cancelAnimationFrame(requestId, this.canvas)
+			this.worker && this.worker.terminate()
+			if (this.renderer instanceof THREE.WebGLRenderer) {
+				this.renderer.dispose()
+				this.renderer.forceContextLoss()
+				this.renderer.context = null
+				this.renderer.domElement = null
+				this.renderer = null;
+				this.clearHandle()
+			}
+			TWEEN && TWEEN.removeAll();//清除所有的tween;
+			console.warn("***beforeDestroy-webgl_rxdz_roam***");
+		},
+        mounted(options) {
+			var that = this;
+			console.warn("***webgl_rxdz_roam-options***",this.$route.query)
+			// alert("***mounted-webgl_rxdz_roam***"+this.curHouseObj)
+			let unit = window.screen.width / 750;//单位rpm 对应 px 的值
+			this.canvasHeight = window.screen.height - (600 * unit) + (40 * unit);
+			this.houseId = this.$route.query.houseId?this.$route.query.houseId:'';
+			this.spaceId = this.$route.query.spaceId?this.$route.query.spaceId:'';
+			let container = this.$refs.webgl;
+            let canvas3d = this.canvas = this.$refs.glcanvas;
+			//uniapp 兼容写法，因为uni的页面对象的Vue 实例是$vm
+			
+			let camera = null, renderer = null;
+			let needRender = false;	//是否需要渲染 false表示不需要渲染；true 表示需要渲染
+            let loader = this.loader = new GLTFLoader();
+            let scene = this.scene = new THREE.Scene();
+            let raycaster = null;
+            let mouse = new THREE.Vector2();
+            let chooseMesh = this.chooseMesh;//标记鼠标拾取到的mesh
+			let isUserContorl = true;//是否进入漫游状态-默认是
+			//漫游时变量
+			let onPointerDownMouseX = 0, onPointerDownMouseY = 0,
+			lon = 0;
+			let fingerCount = 0;	//触摸时的手指数目
+			let startTime = 0;	//非漫游时的移动变量
+			let tweenCameraAnma = false;	//表示当前是否处在动画过程中
+			let controls = null,boundary=null;
+			let stats;
+			init();
+			// this.$refs.myLoading.showLoading("加载中...1%")
+			this.$store.state.loadingMsg="加载中...1%";
+			// this.myLoadingStatus = true;
+			this.progress = 1;
+			this.clearEvent = clearEvent;
+			this.attendEvent = attendEvent;
+			// this.meshRoam = meshRoam;
+			this.tweenCameraAnmaChange = tweenCameraAnmaChange;
+			this.switchActor = switchActor;
+			this.hideOrShowActor = hideOrShowActor;
+			this.starRender = starRender;//对外暴露启动渲染的方法
+			this.positionCamer = positionCamer;
+			if(this.curHouseObj && this.curHouseObj.id){
+				this.setHouseDetail(this.curHouseObj);
+			}
+			function init() {
+
+                scene.background = new THREE.Color("#FFFFFF");
+				// scene.environment = new THREE.Color("#F2F2F2");
+				// 创建一个HDR贴图加载器
+				// const rgbeloader = new RGBELoader();
+				// // 加载HDR贴图
+				// rgbeloader.load('https://dm.static.elab-plus.com/miniProgram/environment.hdr', (texture) => {
+				// 	// 将HDR贴图设置为场景的环境贴图
+				// 	texture.mapping = THREE.EquirectangularReflectionMapping;
+				// 	scene.environment = texture;
+				// })
+
+				// 创建相机位置
+				camera = new THREE.PerspectiveCamera(95, window.screen.width / that.canvasHeight, 0.1, 10000 );
+				// camera.up.set(0, 1, 0);//俯视状态，将相机的up向量设置为z轴负方向 {x:0,y:1,z:0}
+				// camera.position.set(that.cameraStarPosition.x, that.cameraStarPosition.y, that.cameraStarPosition.z);
+				scene.add(camera);
+                that.camera = camera;
+
+                // 环境光会均匀的照亮场景中的所有物体
+				const ambientLight = new THREE.AmbientLight(0xFFEFE0, 3.5);
+				scene.add(ambientLight);
+				//平行光
+				const light = new THREE.DirectionalLight(0xFFF8E5, 2.5);
+				light.position.set(5, 7, 3); //default; light shining from top
+				light.castShadow = true; // default false
+				// 默认情况下光投影相机区域是一个长宽高为10x10x500的长方体区域，光源投射方向为通过坐标原点
+				light.shadow.camera.left = -100; // 这个区域内产生阴影
+				light.shadow.camera.right  = 100; // 这个区域内产生阴影
+				light.shadow.camera.top  = 100; // 这个区域内产生阴影
+				light.shadow.camera.bottom  = -100; // 这个区域内产生阴影
+				
+				light.shadow.mapSize.width = 8192; 	// 影响阴影的清晰度
+				light.shadow.mapSize.height = 8192; // 影响阴影的清晰度
+
+				scene.add(light);
+				
+				//antialias 这个值得设置为false，不然IOS上截图会失效
+                renderer = that.renderer = new THREE.WebGLRenderer( { 
+					canvas:canvas3d, 
+					alpha: true,
+					antialias:true,
+					preserveDrawingBuffer: true,
+				});
+				// renderer.shadowMap.enabled = true;//产生阴影  IOS 下有阴影会导致渲染下重新执行挂载方法-页面会二次载入，不知原因
+				// renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
+				renderer.outputEncoding = THREE.sRGBEncoding;
+				renderer.outputColorSpace = THREE.SRGBColorSpace;
+				// renderer.toneMappingExposure = 0.1;//色调映射的曝光级别。默认是1
+				renderer.toneMapping = THREE.NoToneMapping;//色调映射
+				renderer.physicallyCorrectLights = true;//关键参数，模拟物理光照影响，必须设置为true
+
+                renderer.setPixelRatio(window.devicePixelRatio);
+                renderer.setSize(window.screen.width, that.canvasHeight);
+                container.appendChild( renderer.domElement );
+				
+				controls = new OrbitControls( camera, renderer.domElement );
+				controls.screenSpacePanning = true;
+				controls.enableDamping = true;
+				controls.minDistance = 0.5;
+				controls.maxDistance = 10;
+				controls.minPolarAngle = 0;// 默认0
+				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;//禁用摄像机平移
+				controls.enableRotate = true;//启用摄像机水平或垂直旋转
+				controls.zoomToCursor = true;
+				// controls.update();
+				// 监听相机移动事件-限制只能在当前空间范围内移动
+				controls.addEventListener('change', () => {
+					// 检查相机位置是否超出边界框
+					if (boundary && !boundary.containsPoint(camera.position)) {
+						let clampedPosition = new THREE.Vector3( );
+						boundary.clampPoint(camera.position,clampedPosition);
+						if(clampedPosition){
+							camera.position.copy(clampedPosition);
+							// controls.target.copy(clampedPosition);
+						}
+					}
+				});
+				// controls.target = new THREE.Vector3( );;
+				// camera.lookAt(that.controlStarPosition.x,that.controlStarPosition.y,that.controlStarPosition.z);
+                raycaster = new THREE.Raycaster();
+				stats = new Stats();
+				container.appendChild(stats.dom);
+				stats.domElement.style.top = '100px';
+				attendEvent();//注册监听事件
+				starRender();	//启动渲染
+            }
+			function tweenCameraAnmaChange (value) {
+				tweenCameraAnma = value
+			}
+			function attendEvent () {
+				renderer.domElement.addEventListener('touchstart', onPointerStart, false);
+				renderer.domElement.addEventListener('touchmove', onPointerMove, false);
+				renderer.domElement.addEventListener('touchend', onPointerUp, false);
+			}
+			//取消事件监听-避免二次进入时触发多次事件
+			function clearEvent(){
+				console.warn("**clearEvent****")
+				renderer && renderer.domElement && renderer.domElement.removeEventListener('touchstart', onPointerStart);
+				renderer && renderer.domElement && renderer.domElement.removeEventListener('touchmove', onPointerMove );
+				renderer && renderer.domElement && renderer.domElement.removeEventListener('touchend', onPointerUp );
+			}
+			// 手指移动开始
+			function onPointerStart(event){
+				startTime = (new Date()).getTime();
+				fingerCount = event.touches.length;//手指个数
+				console.log('开始触摸事件：',lon,fingerCount,camera.position.y)
+				if (fingerCount === 1) {
+					// 只有一个手指时记录当前点的坐标作为平移起始点
+					onPointerDownMouseX = event.changedTouches[0].clientX;
+					onPointerDownMouseY = event.changedTouches[0].clientY;
+				}
+			}
+			//持续触摸中
+			function onPointerMove( event ) {
+				fingerCount = event.touches.length;//手指个数
+			}
+			//触摸结束
+			function onPointerUp(event) {
+				fingerCount = event.touches.length;//手指个数
+				console.warn("***触摸结束***",fingerCount,startTime)
+				if(fingerCount==0){
+					let now = new Date().getTime()
+					if (Math.abs(event.changedTouches[0].clientX - onPointerDownMouseX) < 10 
+					&& Math.abs(event.changedTouches[0].clientY - onPointerDownMouseY) < 10 
+					&& (now - startTime) < 300 ){
+						checkIntersection(event);
+					}
+				}
+			}
+			//射线检测handle
+			function checkIntersection(event) {
+			    let x = (event.changedTouches[0].clientX / window.screen.width) * 2 - 1;
+			    let y = -(event.changedTouches[0].clientY / that.canvasHeight) * 2 + 1;
+			    mouse.x = x;
+			    mouse.y = y;
+			    //更新射线
+			    raycaster.setFromCamera(mouse, camera);
+			    let intersects = raycaster.intersectObjects(scene.children,true);
+				console.warn("***checkIntersection***",intersects.length)
+			    if (intersects.length > 0) {
+					//找到最近的那个网格模型物体
+					let mesh = intersects.find((it) => {
+						if(it.object && it.object.isMesh == true  
+							&& it.object.parent && it.object.parent.name == 'actor'
+							&& it.object.parent.visible == true){
+							return true;
+						}
+					});
+					
+					//拾取到了视角，就不继续拾取了
+					if(mesh){
+						moveActor(mesh.object.parent);
+						return false;
+					}
+					mesh = intersects.find((it) => {
+						if(it.object && it.object.isInstancedMesh
+							&& (it.object.name == '地板' || it.object.name == '花园') && it.object.visible == true){
+							return true;
+						}
+					});
+					//拾取到了地板
+					if(mesh){
+						let floor = mesh.object;
+						let index = mesh.instanceId;//射线相交是的实例序号
+						let spaceId = that.gltfSpaces[index].spaceId;//获取选中实例的空间id
+						if(floor.name == "花园"){//花园
+							let selectMesh = that.gltfSpaces.find(it=>{return it.spaceType==14 && it.instancedMeshIndexList[0].instancedAtIndex==index})
+							spaceId = selectMesh.spaceId;
+						}else{//室内
+							// floor.name = "地板";
+							let selectMesh = that.gltfSpaces.find(it=>{return it.spaceType!=14 && it.instancedMeshIndexList[0].instancedAtIndex==index})
+							spaceId = selectMesh.spaceId;
+						}
+						// let spaceId = that.gltfSpaces[index].spaceId;//获取选中实例的空间id
+						console.warn("***checkIntersection-地板***",mesh,floor,index,spaceId,that.spaceId)
+						//当前拾取到的是本空间的底部-意味着用户点击了地板
+						if(floor && spaceId == that.spaceId){
+							// console.warn("***checkIntersection-地板***",mesh,floor)
+							moveCarmer(mesh.point);
+							return false;
+						}
+					}
+			    }
+			}
+			//显示当前选中的视角或者隐藏所有视角-因为截图时不能保留视角
+			function hideOrShowActor (type) {
+				console.warn("***hideOrShowActor***",type)
+				if(type=='hide'){
+					that.actors.forEach(it=>{
+						it.visible = false;//隐藏所有的视角的mesh模型
+					})
+				}else{
+					if(!that.currentActor){
+						uni.showToast({
+							icon: "none",
+							title: "没有视角!",
+						});
+						return false;
+					}
+					that.actors.forEach(it=>{
+						if(that.currentActor.userIndex==it.userIndex){
+							it.visible = false;//隐藏即将切换到的视角的mesh模型
+						}else{
+							it.visible = true;//显示其他视角的模型
+						}
+					})
+				}
+			}
+			//自动切换视角
+			function switchActor () {
+				if(!that.currentActor){
+					uni.showToast({
+						icon: "none",
+						title: "没有当前视角!",
+					});
+					return false;
+				}
+				if(!that.actors || that.actors.length==0){
+					uni.showToast({
+						icon: "none",
+						title: "没有视角!",
+					});
+					return false;
+				}
+				let index = that.currentActor.userIndex;//当前视角的序号
+				let nextIndex = (index + 1) % that.actors.length;
+				//移动到对应的视角去
+				moveActor(that.actors[nextIndex]);
+			}
+			//移动到选中的位置-地板
+			function moveCarmer (point) {
+				//还在动画中，不能点击切换
+				if(tweenCameraAnma == true){
+					return false;
+				}
+				let _x =  point.x - camera.position.x;//x轴移动的距离
+				let _z =  point.z - camera.position.z;//z轴移动的距离
+				// console.warn("***moveCarmer***",_x,_z)
+				let cameraNewPosition = {x:camera.position.x + _x,y:1.2,z:camera.position.z + _z};
+				let targetNewPosition = {x:controls.target.x + _x,y:1.2,z:controls.target.z + _z};
+				let oldUp = {x:0,y:1,z:0};	
+				let newUp = {x:0,y:1,z:0};
+				moveTip(cameraNewPosition)
+				// console.warn("**moveCarmer***",lon,JSON.stringify(cameraNewPosition),JSON.stringify(targetNewPosition))
+				tweenCamera(camera.position,controls.target,cameraNewPosition,targetNewPosition,oldUp,newUp,2000);
+			}
+			//创建地标
+			function creatMoveTip(position){
+				if(!that.circleGroup){
+					that.circleGroup = new THREE.Group();
+					let geometry = new THREE.CircleGeometry( 0.2, 32 );
+					let material = new THREE.MeshBasicMaterial( { transparent: true } );
+					let circle = new THREE.Mesh( geometry, material );
+					circle.position.set(position.x,0.01,position.z);
+					circle.rotation.x = -Math.PI / 2;
+					// let geometry1 = new THREE.CircleGeometry( 0.4, 32 );
+					// let circle2 = new THREE.Mesh( geometry1, material );
+					// circle2.position.set(position.x,0.01,position.z);
+					// 使用贴图
+					const textureLoader = new THREE.TextureLoader();
+					textureLoader.load('https://dm.static.elab-plus.com/miniProgram/circlemap1.png', function(texture) {
+						material.map = texture; // 将贴图应用于材质的map属性
+						material.needsUpdate = true; // 更新材质
+					});
+					that.circleGroup.add(circle);
+					scene.add(that.circleGroup);
+				}
+			}
+			//移动地标
+			function moveTip(position){
+				if(!that.circleGroup){
+					that.circleGroup = new THREE.Group();
+					let geometry = new THREE.CircleGeometry( 0.2, 32 );
+					let material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
+					let circle = new THREE.Mesh( geometry, material );
+					circle.position.set(position.x,0.01,position.z);
+					circle.rotation.x = -Math.PI / 2;
+					// let geometry1 = new THREE.CircleGeometry( 0.4, 32 );
+					// let circle2 = new THREE.Mesh( geometry1, material );
+					// circle2.position.set(position.x,0.01,position.z);
+					that.circleGroup.add(circle);
+					scene.add(that.circleGroup);
+				}else{
+					that.circleGroup.children[0].position.set(position.x,0.01,position.z);
+				}
+			}
+			//移动视角点位
+			function moveActor (obj) {
+				clearEvent();//注销事件监听
+				that.actors.forEach(it=>{
+					if(obj.userIndex==it.userIndex){
+						it.visible = false;//隐藏
+					}else{
+						it.visible = true;//显示其他
+					}
+				})
+				// console.warn("***moveActor***",obj)
+				that.currentActor = obj;//记录下当前的视角对象 mesh网格模型
+				let cameraNewPosition = obj.position;
+				let targetNewPosition = obj.targetNewPosition;
+				let oldUp = {x:0,y:1,z:0};	//俯视
+				let newUp = {x:0,y:1,z:0};	//正视
+				console.warn("**moveActor***",JSON.stringify(cameraNewPosition),JSON.stringify(targetNewPosition))
+				tweenCamera(camera.position,controls.target,cameraNewPosition,targetNewPosition,oldUp,newUp,2000);
+				lon = 0;
+				setTimeout(()=> {
+					attendEvent()
+				}, 2000);
+			}
+			//初始化点位视角
+			function initActor(){
+				if(!chooseMesh){
+					console.error("[drawActor],没有选中的空间数据")
+					return false;
+				}
+				let spaceObj = chooseMesh;//获取选中的空间模型的相关数据
+				if(!spaceObj.actors){
+					return false;
+				}
+				let defaulIndex = spaceObj.actors.findIndex(it=>it.isSelected==true);
+				if(defaulIndex == -1){
+					defaulIndex = 0;
+				}
+				that.actors = [];
+				that.loader.load("https://dm.static.elab-plus.com/miniProgram/hs/gltf/sxtgltf.gltf",  ( gltf ) => {
+					spaceObj.actors.forEach((actor,index)=>{
+						let model = gltf.scene; // 获取模型
+						let cloneModel = model.clone(true);//赋值模型，准备复用
+						cloneModel.children.map((v,i)=>{
+							if(v.material){
+								v.material = model.children[i].material.clone()
+							}
+						})
+						let cube = cloneModel;
+						cube.name = "actor";
+						cube.userType = "mesh";
+						//新的摄像机的位置-新的摄像机角度是倾斜角度，所以z值需要计算，高度设置为模型高度的2倍
+						let _actorLoaction = actor.actorLocation.split(',');//x y z
+						let _actorTransform = actor.actorTransform.split(',');//旋转角度，取第三个值
+						let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]));//将度转化为弧度。
+						let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
+						if(parseInt(_actorLoaction[1])==0){//X轴
+							_actorLoaction[1] = spaceObj.centerX;
+						}
+						if(parseInt(_actorLoaction[0])==0){//Y轴
+							_actorLoaction[0] = spaceObj.centerY;
+						}
+						let X_C = _actorLoaction[0] - spaceObj.centerY;//X轴偏移量
+						let Y_C = _actorLoaction[1] - spaceObj.centerX;//Y轴偏移量
+						let px = spaceObj.centerX + X_C;
+						let py = spaceObj.centerY + Y_C;
+						let position = {
+							x:(parseInt(px))/100,
+							y:1.2, 
+							z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
+						}
+						//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为1.2
+						let targetNewPosition = {
+							x:position.x + Math.sin(_hd),
+							y:1.2 + Math.tan(_hdY),
+							z:(position.z - Math.cos(_hd)),
+						}
+						cube.position.set(position.x,position.y,position.z)
+						cube.scale.set(2, 2, 2);
+						cube.userIndex = index;
+						cube.actorEum = index;
+						cube.targetNewPosition = targetNewPosition;
+						console.warn("*actors*",cube)
+						scene.add(cube);
+						that.actors.push(cube);//添加视角
+						if(index == defaulIndex){//隐藏当前视角
+							cube.visible = false;
+							that.currentActor = cube;//记录下当前的视角对象 mesh网格模型
+							let param = {
+								type: 'CLK', //埋点类型
+								clkId: 'clk_2cmina_23080411', //点击ID
+								clkName: 'visualangle_clk', //点击前往的页面名称
+								clkParams: {
+									locusName: "预制视角",
+									type:that.actors[index].actorEum
+								}
+							};
+							util.trackRequest(param);
+						}
+					})
+				})
+			}
+			//计算当前选中空间的平视时的观察点和摄像机的放置点位
+			function roamPositionHandle(lon=''){
+				if(!chooseMesh){
+					console.error("[roamPositionHandle],没有选中的空间数据")
+					return false;
+				}
+				let spaceObj = chooseMesh;//获取选中的空间模型的相关数据
+				//获取视角
+				let defaultActor = null;
+				if(spaceObj.actors && spaceObj.actors.length>0){
+					defaultActor = spaceObj.actors.find(it=>it.isSelected==true);
+					if(!defaultActor){
+						defaultActor = spaceObj.actors[0];
+					}
+				}
+				let _actorLoaction = defaultActor.actorLocation.split(',');//x y z
+				let _actorTransform = defaultActor.actorTransform.split(',');//旋转角度，取第三个值
+				let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]) + lon);//将度转化为弧度。
+				let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
+				if(parseInt(_actorLoaction[1])==0){//X轴
+					_actorLoaction[1] = spaceObj.centerX;
+				}
+				if(parseInt(_actorLoaction[0])==0){//Y轴
+					_actorLoaction[0] = spaceObj.centerY;
+				}
+				let X_C = _actorLoaction[0] - spaceObj.centerY;//X轴偏移量
+				let Y_C = _actorLoaction[1] - spaceObj.centerX;//Y轴偏移量
+				let px = spaceObj.centerX + X_C;
+				let py = spaceObj.centerY + Y_C;
+				//新的摄像机的位置-新的摄像机角度是倾斜角度，所以z值需要计算，高度设置为模型高度的2倍
+				let cameraNewPosition = {
+					x:(parseInt(px))/100,
+					y:1.2, 
+					z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
+				}
+				if(cameraNewPosition){
+					let minX = 0,maxX = 0,minY = 0,maxY = 0;//0.1 是模型墙壁厚度
+					minX = (spaceObj.centerX - (spaceObj.spaceWidth/2))/100 + 0.1;
+					maxX = (spaceObj.centerX + (spaceObj.spaceWidth/2))/100 - 0.1;
+					maxY = -((spaceObj.centerY - (spaceObj.spaceHeight/2))/100 + 0.1);
+					minY = -((spaceObj.centerY + (spaceObj.spaceHeight/2))/100 - 0.1);
+					//新的坐标轴不在房间范围内，则不能移动
+					// console.warn("**roamPositionHandle-观察点不在范围中****",JSON.stringify(cameraNewPosition),minX,maxX,minY,maxY)
+					if(cameraNewPosition.x<minX || cameraNewPosition.x>maxX
+					||cameraNewPosition.z<minY || cameraNewPosition.z>maxY){//不在房间范围
+						let _x = ((spaceObj.spaceWidth/2) - 15)*defaultActor.presentX + spaceObj.centerX;
+						let _z = ((spaceObj.spaceHeight/2) - 15)*defaultActor.presentY + spaceObj.centerY;
+						cameraNewPosition.x = _x/100;
+						cameraNewPosition.z = - _z/100;
+						console.warn("**roamPositionHandle-观察点不在空间范围-强制修正观察点位置****",JSON.stringify(cameraNewPosition))
+					}
+				}
+				//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为1.2
+				let targetNewPosition = {
+					x:cameraNewPosition.x + Math.sin(_hd),
+					y:1.2 + Math.tan(_hdY),
+					z:(cameraNewPosition.z - Math.cos(_hd)),
+				}
+				return {cameraNewPosition,targetNewPosition}
+			}
+			//直接定位到摄像头位置
+			function positionCamer(mesh=null){
+				if(mesh){//如果传入了模型，则取模型
+					chooseMesh = mesh;
+				}
+				if(!chooseMesh){
+					console.error("[positionCamer],没有选中的空间数据")
+					return false;
+				}
+				if(!chooseMesh.actors || chooseMesh.actors.length==0){
+					chooseMesh.actors = [{
+						actorLocation:chooseMesh.actorLocation,
+						actorTransform:chooseMesh.actorTransform,
+						isSelected:true,
+						presentX:chooseMesh.presentX,
+						presentY:chooseMesh.presentY,
+					}]
+				}
+				// try{
+				boundary = new THREE.Box3(
+					new THREE.Vector3(chooseMesh.centerX/100 - chooseMesh.spaceWidth/100/2 + 0.1, 0, -chooseMesh.centerY/100 - chooseMesh.spaceHeight/100/2 + 0.1), // 边界框的最小点
+					new THREE.Vector3(chooseMesh.centerX/100 + chooseMesh.spaceWidth/100/2 - 0.1, 2.7, -chooseMesh.centerY/100 + chooseMesh.spaceHeight/100/2 - 0.1) // 边界框的最大点
+				);
+				initActor();//初始化视角
+				let data = roamPositionHandle();
+				let cameraNewPosition = data.cameraNewPosition;
+				let targetNewPosition = data.targetNewPosition;
+				creatMoveTip(cameraNewPosition);//创建移动的地标
+				camera.position.set(cameraNewPosition.x, cameraNewPosition.y, cameraNewPosition.z);
+				camera.lookAt(targetNewPosition.x,targetNewPosition.y,targetNewPosition.z);
+				controls.target.set(targetNewPosition.x,targetNewPosition.y,targetNewPosition.z);
+				// }catch(e){
+				// 	alert("***positionCamer-error***"+e)
+				// }
+			}
+			// oldP  相机原来的位置
+            // oldT  target原来的位置
+            // newP  相机新的位置
+            // newT  target新的位置
+            function tweenCamera(oldP, oldT, newP, newT, oldUp, newUp, time=1000) {
+				if(JSON.stringify(oldP) == JSON.stringify(newP) && JSON.stringify(oldT) == JSON.stringify(newT)){
+					that.repeatFlag = false;//放开限制，可以再次点击
+					return false;
+				}
+				if (!chooseMesh) {
+					that.repeatFlag = false;//放开限制，可以再次点击
+					return false;
+				}
+				tweenCameraAnma = true;
+				var tween = new TWEEN.Tween({
+					x1: oldP.x, // 相机x
+					y1: oldP.y, // 相机y
+					z1: oldP.z, // 相机z
+					x2: oldT.x, // 控制点的中心点x
+					y2: oldT.y, // 控制点的中心点y
+					z2: oldT.z,	// 控制点的中心点z
+					x3: oldUp.x, // 控制点的中心点x
+					y3: oldUp.y, // 控制点的中心点y
+					z3: oldUp.z  // 控制点的中心点z
+				})
+				.to({
+			        x1: newP.x,
+					y1: newP.y,
+					z1: newP.z,
+					x2: newT.x,
+					y2: newT.y,
+					z2: newT.z,
+					x3: newUp.x, // up向量
+					y3: newUp.y, // 控制点的中心点y
+					z3: newUp.z  // 控制点的中心点z
+			    }, time)
+				.easing(TWEEN.Easing.Quadratic.InOut)
+				.onUpdate((object)=> {
+					camera.position.x = object.x1;
+					camera.position.y = object.y1;
+					camera.position.z = object.z1;
+					let newTarget = new THREE.Vector3(object.x3,object.y3,object.z3);
+					camera.up.copy(newTarget);
+					camera.lookAt(object.x2,object.y2,object.z2);
+					// controls.target.x = object.x2;
+					// controls.target.y = object.y2;
+					// controls.target.z = object.z2;
+					// controls.update();
+					// console.warn("****onUpdate**",object.x1,object.y1,object.z1,object.x2,object.y2,object.z2)
+				}).onComplete(()=>{
+					controls.target.x = newT.x;
+					controls.target.y = newT.y;
+					controls.target.z = newT.z;
+					//修正最后的视角
+					let up = new THREE.Vector3(newUp.x,newUp.y,newUp.z);
+					camera.up.copy(up);
+					camera.lookAt(controls.target.x,controls.target.y,controls.target.z);
+					tweenCameraAnma = false;
+					that.repeatFlag = false;//放开限制，可以再次点击
+				})
+				// 开始动画
+				tween.start();
+			}
+
+			function stopRender () {
+				needRender = false;
+			}
+			function starRender () {
+				if(needRender==true){//如果已经在渲染中了，则不能再次开启，避免渲染过多
+					false;
+				}
+				needRender = true;
+				render();//开始渲染
+			}
+            function render() {
+				if(needRender==false){
+					return false;
+				}
+                TWEEN && TWEEN.update();
+				stats.update();
+				//不处在动画过程中，则可以处理移动等动作
+				if(tweenCameraAnma==false){
+					
+				}
+				renderer.render(scene, camera);//单次渲染
+				requestId = requestAnimationFrame(render, canvas3d);
+				if (that.screenshotResolve) {
+					// if(that.isIos){//IOS手机
+						stopRender();
+						that.screenshotResolve()
+						that.screenshotResolve = null;//释放Promise
+					// }else{//安卓手机
+					// 	let gl = renderer.getContext();
+					// 	let frameBuffer = new THREE.Vector2();
+					// 	renderer.getDrawingBufferSize(frameBuffer);
+					// 	let pixelData = new Uint8Array(frameBuffer.x * frameBuffer.y * 4);
+					// 	//参考 Threejs WebGLRenderer.readRenderTargetPixels
+					// 	if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) === gl.FRAMEBUFFER_COMPLETE) {
+					// 		gl.readPixels(0, 0, frameBuffer.x, frameBuffer.y, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
+					// 		// 确保有像素，微信小程序安卓在进入子页面返回本页面后，再一次readPixels稳定无像素
+					// 		if (pixelData.some(i => i !== 0)) {
+					// 			stopRender();
+					// 			console.warn("***screenshotResolve-pixelData***");
+					// 			that.screenshotResolve([pixelData, frameBuffer.x, frameBuffer.y])
+					// 			that.screenshotResolve = null;//释放Promise
+					// 			frameBuffer = null;//清空内存中的数据
+					// 			pixelData = null;//清空内存中的数据
+					// 		}
+					// 	}
+					// }
+				}
+            }
+
+		},
+		computed: {
+			curHouseObj() {
+				return this.$store.state.curHouseObj;
+			},
+			wallList() {
+				return this.$store.state.wallList;
+			},
+		},
+		watch: {
+			curHouseObj: {
+				handler(val) {
+					if (val) {
+						// setTimeout(()=> {
+						if(this.renderer){
+							this.setHouseDetail(val);
+						}
+						// }, 1000);
+					}
+				},
+				immediate: true,
+			}
+		},
+		methods: {
+			hideOrShowActor(){
+				
+			},
+			switchActor(){
+				
+			},
+			positionCamer(){},
+			clearHandle(){
+				this.clearEvent();
+			},
+			showOrHideWebGl(){
+				this.$refs.viewMask.showOrHideWebGl();//显示或者隐藏AI
+			},
+			save(){
+				this.$refs.viewMask.save();//下载
+			},
+			/**
+			 * 设置户型详情信息
+			 * @param {Object} data 户型详情
+			 */
+			setHouseDetail(data){
+				if(data){
+					this.id = this.curHouseObj.id;
+					this.spaceId = this.$route.query.spaceId?this.$route.query.spaceId:'';
+					console.warn("***curHouseObj***",this.curHouseObj)
+					// 加载户型
+					this.loadSpace();
+				}else{
+					this.curHouseObj = {}
+				}
+			},
+            // 绘制空间-即地板
+            async loadSpace(){
+				this.spaceList = [];
+				this.wallIds = [];
+				if(!this.curHouseObj || !this.spaceId){//减少重复请求
+					alert("数据错误")
+					console.warn("***数据错误***")
+					return false
+				}
+                if(this.curHouseObj){
+                    const spaceDetail = this.curHouseObj;
+                    const spaceList = JSON.parse(spaceDetail.houseJson);
+                    // 交换centerX， centerY;上一页面已经处理过了，这里不在需要处理
+                    for (let index = 0; index < spaceList.length; index++) {
+                        var element = spaceList[index];
+                        // const centerX = JSON.parse(JSON.stringify(element.centerX))
+						element.actors.forEach(actor=>{
+							let _actorLoaction = actor.actorLocation.split(',');//x y z
+							let X_C = (parseInt(_actorLoaction[0]) || element.centerY) - element.centerY;//X轴偏移量-UE原因
+							let Y_C = (parseInt(_actorLoaction[1]) || element.centerX) - element.centerX;//Y轴偏移量-向量
+							let _x = element.centerX + X_C;
+							let _z = element.centerY + Y_C;
+							
+							// let _x = parseInt(_actorLoaction[1]) || element.centerX;//观察点 X轴坐标 
+							// let _z = parseInt(_actorLoaction[0]) || element.centerY;//观察点 Z轴坐标
+							let _presentX = (_x - element.centerX)/((element.spaceWidth/2) - 10);//10是墙壁厚度-单位cm
+							let _presentY = (_z - element.centerY)/((element.spaceHeight/2) - 10);
+							//注意如果一开始就设置大超过空间大小，则处理成贴近空间边界
+							actor.presentX = Math.abs(_presentX)>1 ? (_presentX>1?1:-1) : _presentX;//观察点跟空间中心原点的距离比例
+							actor.presentY = Math.abs(_presentY)>1 ? (_presentY>1?1:-1) : _presentY;
+						})
+						
+						element.wallMoveValue = "[0,0,0,0]"
+                        this.spaceList.push(element);
+                        this.wallIds.push(element.wallId);
+
+                        if(element.spaceId == this.spaceId){ // 默认选中空间
+                            this.curSpaceObj = element;
+                        }
+                    }
+                    if(!this.curSpaceObj && this.spaceList.length > 0){
+                        this.curSpaceObj = this.spaceList[0];
+                    }
+                }
+				let curSpaceArea = parseFloat((this.curSpaceObj.spaceWidth * this.curSpaceObj.spaceHeight) / 10000).toFixed(1);
+				this.navbar.title = this.curSpaceObj.spaceName + "  " + curSpaceArea + "㎡"
+                console.log("该户型空间数据:", this.spaceList);curSpaceArea
+                console.log("当前选中的空间:", this.curSpaceObj);
+				this.positionCamer(this.curSpaceObj);
+				this.loaderSpaceArr(this.spaceList);//绘制地板
+                // 获取墙体数据并且绘制墙体
+                this.getHouseTypeSpaceWalls();
+            },
+			// 获取墙体数据
+            async getHouseTypeSpaceWalls(){
+				let wallList = [];
+				if(this.wallList){
+					wallList = this.wallList;
+				}else{
+					let data = {id:this.wallIds}
+					const res = await requestConfig('getHouseTypeSpaceWalls', data, true);
+					console.log("墙体数据:", res.list)
+					if(res.success){
+					    wallList = this.wallList = res.list;
+					}
+				}
+                let wallArr = []
+                for (let index = 0; index < wallList.length; index++) {//每个空间对应一个数据
+                    let element = JSON.parse(wallList[index].wallJson);
+					let space = this.spaceList.find(space=>space.spaceId==element.spaceId);
+					this.computeWallHandleOld(space,element);//提前计算
+                    for (let i = 0; i < element.wallData.length; i ++) {//对应空间里面的4个方向的墙壁数据
+                        let wallData = element.wallData[i];
+						//对应方向的墙壁的墙体模型数据列表，每一面墙可能有多个模型
+                        for (let j = 0; j < wallData.wallModelData.length; j ++) {
+                            let wallModelData = wallData.wallModelData[j];
+                            wallArr.push({spaceId:element.spaceId, wallModelData:wallModelData, wallDirection:wallData.wallDirection})
+                            // console.log("wallModelData", element,wallData.wallDirection, wallModelData.wallType );
+                        }
+                    }
+                }
+                this.loadSpaceObjWalls(wallArr, wallList);
+				this.getOverallArrangementDetailsList();//
+            },
+            // 加载单个空间墙体资源
+            async loadSpaceObjWalls(wallArr, wallList){
+                // 加载远程墙体模型资源
+				let startTime = new Date().getTime();
+                // console.log("wallArr:", wallArr)
+				let promise_list = [];
+				let realWallArr = this.preWallData(wallArr);
+				let arrLength = realWallArr.length;
+				realWallArr && realWallArr.forEach((item,index) => {
+					promise_list.push(
+						new Promise((resolve, reject) => {
+							this.loadWallModels(item, wallList, arrLength , resolve);
+						})
+					)
+				});
+				Promise.all(promise_list).then(()=>{
+					let endTime = new Date().getTime();
+					console.log("墙体模型全部加载完成，时间：",endTime - startTime);
+					// 设置空间数组的墙体信息
+					// this.setSpaceListWallInfo();
+					this.$nextTick(()=>{
+						// this.moveMeshCenter(this.curSpaceObj);
+						this.progress = 100;
+						// this.$refs.myLoading.showLoading("加载中..." + this.progress + '%')
+						this.$nextTick(()=>{
+							this.myLoadingStatus = false;
+							// this.$refs.myLoading.hideLoading();
+							// this.meshRoam(this.curSpaceObj);//开始漫游，必须先选中模型
+						})
+					})
+				})
+            },
+        }
+    }
+</script>
+<style lang="scss" scoped>
+    @import "./webgl_rxdz_roam.scss";
+	/* @import "@/common/css/common.css"; */
+</style>

src/pages/webgl_rxdz_roam/webgl_rxdz_roam.html

@@ -7,7 +7,7 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <div class="main-view">
-	<mynavbar :barData='navbar'/>
+	<mynavbar :barData='navbar' @navbarBackCallback="navbarBackClk" />
 	<!-- 主要操作视图 -->
 	<!-- <viewShell pageType="2" :spaceObj="curSpaceObj" @hideOrShowActor="hideOrShowActor"></viewShell> -->
 	<!-- <my-loading ref="myLoading" :myLoadingStatus="myLoadingStatus"></my-loading>
@@ -22,7 +22,7 @@
 	</canvas>
 	<!-- AI结果覆盖层 -->
 	<viewMask ref="viewMask" @switchActor="switchActor" style="z-index: 13;"
-	  :spaceObj="curSpaceObj" @hideOrShowActor="hideOrShowActor" ></viewMask>
+	  :spaceObj="curSpaceObj" ></viewMask>
 	<!-- 生成截屏的画布对象 -->
 	<canvas id="canvas" type="2d" :style="{'height':canvasHeight+'px','top':'100vh'}"></canvas>
 </div>

src/pages/webgl_rxdz_roam/webgl_rxdz_roam.scss

@@ -1,9 +1,9 @@
-// .main-view{
-// 	width:100vw;
-// 	height:100vh;
-// 	overflow: hidden;
-// }
-canvas { width:100vw; height:calc(100vh - 408rem);z-index: 10;}
+.main-view{
+	width:100vw;
+	height:100vh;
+	overflow: hidden;
+}
+canvas { width:100vw; height:calc(100vh - 408px);z-index: 10;}
 #mapDiv{
 	background-color: #fff;
 }
@@ -15,51 +15,13 @@ page {
     overflow-x: hidden;
     overflow-y: hidden;
 }
-#canvas_webgl{
-	/* background: url(resources/images/daikanyama.jpg) no-repeat center center; */
-	/* background:#6d0909;
-	background-size: cover; */
-}
 /* 生成截屏的画布对象 */
 #canvas {
 	width: 100vw;
 	z-index: -1;
-	position: absolute;
-	left:0rem;
+	// position: absolute;
+	left:0px;
 }
-/* .btn{
-	position:absolute;
-	width:300rem;
-	height:132rem;
-	bottom:60rem;
-	right:30rem;
-	border-radius: 10rem;
-	opacity:1;
-	z-index:10000;
-	color:red;
-	display: flex;
-	flex-direction:row;
-	align-items:center;
-	justify-content:center;
-	background-color: rgba(155, 155, 155, 0.6);
-}
-
-.changeSizebtn {
-	position:absolute;
-	width:300rem;
-	height:132rem;
-	bottom:60rem;
-	left:30rem;
-	border-radius: 10rem;
-	opacity:1;
-	z-index:10000;
-	color:red;
-	display: flex;
-	flex-direction:row;
-	align-items:center;
-	justify-content:center;
-	background-color: rgba(155, 155, 155, 0.6);
-} */
 .canvas-view{
 	position:relative;
 }

src/pages/webgl_rxdz_roam/webgl_rxdz_roam.vue

@@ -8,7 +8,7 @@
 	import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
 	
 	import TWEEN from 'three/addons/libs/tween.module.js';
-
+	import {getStorage} from '@/utils/localStorage';
 	var requestId = "";
     const util = require('@/utils/util.js').default;
 	// import util from '@/utils/util.js';
@@ -22,11 +22,12 @@
 	import floorMethod from '@/mixins/floorMethod.js';
 	import loadModel from '@/mixins/loadModel.js';
 	import wallMethod from '@/mixins/wallMethod.js';
+	import commonPageMethod from '@/mixins/commonPageMethod.js';
 	// import commonPageMethod from '@/common/commonPageMethod.js';
     // const app = getApp(); //获取应用实例
     export default {
 		components:{viewShell,viewMask},
-		mixins:[screenshot,loadModel,floorMethod,wallMethod],
+		mixins:[screenshot,loadModel,floorMethod,wallMethod,commonPageMethod],
         /**
          * 页面的初始数据
          */
@@ -46,7 +47,7 @@
 				    navPaddingBg:'transparent',
 				    navBarColor: 'transparent',
 				    navBackColor: 'transparent',
-				    haveCallback: false, // 如果是 true 会接手 navbarBackClk
+				    haveCallback: true, // 如果是 true 会接手 navbarBackClk
 				    fromShare: false,
 				    fromProject: 0,
 				    shareToken: "",
@@ -55,11 +56,12 @@
                 id:'',// 户型编号
                 spaceList:[], // 空间列表
                 gltfSpaces:[], // 场景中地板模型数组
+				gltfSpaceRoofs:[],
                 curSpaceObj:null, // 当前选中的空间
                 // curSpaceIndex:-1, // 当前选中的空间索引
 				spaceId:null,
                 wallIds:[], // 空间墙体id
-				wallList:[], // 墙体数据
+				// wallList:[], // 墙体数据
                 gltfWalls:[], // 场景中墙体模型数组
                 loader:null,
                 scene:null,
@@ -71,7 +73,6 @@
 				controlLastPosition: null,		//观察点上一次移动到的位置
 				canvasHeight:408,	//canvas视图的高度-计算得出
 				chooseMesh:null,//标记鼠标拾取到的mesh
-				isManyou: false,	//当前是否处在漫游状态
 				shottingImg: [],
 				progress:1,	//进度条
 				myLoadingStatus:false,
@@ -83,8 +84,9 @@
 				actors:[],
 				showDownView:true,//默认显示下载按钮
 				currentActor:null,
-				isIos:false,	//是否ios手机。默认不是
-				circleGroup:null,
+				circleGroup:null,//圆形地标
+				isIOS:false,
+				defaulIndex:null,	//默认视角的序号
 				// aiImagesList:[
 				// 	// "https://dm.static.elab-plus.com/miniProgram/plus_IM01.png",
 				// 	// "https://dm.static.elab-plus.com/miniProgram/plus_IM02.png",
@@ -97,11 +99,34 @@
 			cancelAnimationFrame(requestId, this.canvas)
 			this.worker && this.worker.terminate()
 			if (this.renderer instanceof THREE.WebGLRenderer) {
-				this.renderer.dispose()
-				this.renderer.forceContextLoss()
-				this.renderer.context = null
-				this.renderer.domElement = null
-				this.renderer = null;
+				// 遍历场景中的所有子对象，找到类型为Mesh的对象并移除
+				let deleList = this.scene.children.filter(object=>{
+					if (object instanceof THREE.Mesh) {
+						return object
+					}
+				})
+				if(deleList && deleList.length>0){
+					this.scene.remove(...deleList);
+				}
+				this.scene.traverse(function(object) {
+					if (object instanceof THREE.Mesh) {
+						if(object.geometry && typeof(object.geometry.dispose)=='function'){
+							object.geometry.dispose();
+						}
+						if(object.material && typeof(object.material.dispose)=='function'){
+							object.material.dispose();
+						}
+						if(object.texture && typeof(object.texture.dispose)=='function'){
+							object.texture.dispose();
+						}
+					}
+				});
+				this.renderer.clear();
+				this.renderer.dispose();
+				this.renderer.forceContextLoss();
+				this.renderer.context = null;
+				this.renderer.domElement = null;
+				this.renderer = null;;
 				this.clearHandle()
 			}
 			TWEEN && TWEEN.removeAll();//清除所有的tween;
@@ -109,10 +134,29 @@
 		},
         mounted(options) {
 			var that = this;
+			// alert("JavaScript 堆大小限制: "+performance.memory.jsHeapSizeLimit
+			// +"\n已使用的 JavaScript 堆大小: "+performance.memory.usedJSHeapSize
+			// +"\nJavaScript 堆的总大小: "+performance.memory.totalJSHeapSize);
 			console.warn("***webgl_rxdz_roam-options***",this.$route.query)
-			// alert("***mounted-webgl_rxdz_roam***"+this.curHouseObj)
-			let unit = window.screen.width / 750;//单位rpm 对应 px 的值
-			this.canvasHeight = window.screen.height - (408 * unit) + (20 * unit);
+			this.isIOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
+			if(this.isIOS){
+				this.curHouseObj = JSON.parse(getStorage('curHouseObj'));
+				this.wallList = JSON.parse(getStorage('wallList'));
+			}else{
+				this.curHouseObj = 	this.$store.state.curHouseObj;
+				this.wallList = 	this.$store.state.wallList;
+			}
+			// alert("***mounted-webgl_rxdz_roam***"+this.isIOS + this.curHouseObj)
+			let screenWidth = window.screen.width;
+			let screenHeight = window.screen.height;
+			if(window.innerWidth && window.screen.width){
+				screenWidth = Math.min(window.innerWidth,window.screen.width)
+			}
+			if(window.innerHeight && window.screen.height){
+				screenHeight = Math.min(window.innerHeight,window.screen.height)
+			}
+			let unit = screenWidth / 750;//单位rpm 对应 px 的值
+			this.canvasHeight = screenHeight - (600 * unit) + (40 * unit);
 			this.houseId = this.$route.query.houseId?this.$route.query.houseId:'';
 			this.spaceId = this.$route.query.spaceId?this.$route.query.spaceId:'';
 			let container = this.$refs.webgl;
@@ -145,8 +189,8 @@
 			// this.meshRoam = meshRoam;
 			this.tweenCameraAnmaChange = tweenCameraAnmaChange;
 			this.switchActor = switchActor;
-			this.hideOrShowActor = hideOrShowActor;
 			this.starRender = starRender;//对外暴露启动渲染的方法
+			this.stopRender = stopRender;//对外暴露停止渲染的方法
 			this.positionCamer = positionCamer;
 			if(this.curHouseObj && this.curHouseObj.id){
 				this.setHouseDetail(this.curHouseObj);
@@ -165,7 +209,7 @@
 				// })
 
 				// 创建相机位置
-				camera = new THREE.PerspectiveCamera(95, window.screen.width / that.canvasHeight, 0.1, 10000 );
+				camera = new THREE.PerspectiveCamera(90, screenWidth / that.canvasHeight, 0.1, 10000 );
 				// camera.up.set(0, 1, 0);//俯视状态，将相机的up向量设置为z轴负方向 {x:0,y:1,z:0}
 				// camera.position.set(that.cameraStarPosition.x, that.cameraStarPosition.y, that.cameraStarPosition.z);
 				scene.add(camera);
@@ -177,16 +221,18 @@
 				//平行光
 				const light = new THREE.DirectionalLight(0xFFF8E5, 2.5);
 				light.position.set(5, 7, 3); //default; light shining from top
-				light.castShadow = true; // default false
-				// 默认情况下光投影相机区域是一个长宽高为10x10x500的长方体区域，光源投射方向为通过坐标原点
-				light.shadow.camera.left = -100; // 这个区域内产生阴影
-				light.shadow.camera.right  = 100; // 这个区域内产生阴影
-				light.shadow.camera.top  = 100; // 这个区域内产生阴影
-				light.shadow.camera.bottom  = -100; // 这个区域内产生阴影
+				if(!that.isIOS){
+					light.castShadow = true; // default false
+					// 默认情况下光投影相机区域是一个长宽高为10x10x500的长方体区域，光源投射方向为通过坐标原点
+					light.shadow.camera.left = -100; // 这个区域内产生阴影
+					light.shadow.camera.right  = 100; // 这个区域内产生阴影
+					light.shadow.camera.top  = 100; // 这个区域内产生阴影
+					light.shadow.camera.bottom  = -100; // 这个区域内产生阴影
+					
+					light.shadow.mapSize.width = 1024; 	// 影响阴影的清晰度
+					light.shadow.mapSize.height = 1024; // 影响阴影的清晰度
+				}
 				
-				light.shadow.mapSize.width = 8192; 	// 影响阴影的清晰度
-				light.shadow.mapSize.height = 8192; // 影响阴影的清晰度
-
 				scene.add(light);
 				
 				//antialias 这个值得设置为false，不然IOS上截图会失效
@@ -196,8 +242,10 @@
 					antialias:true,
 					preserveDrawingBuffer: true,
 				});
-				renderer.shadowMap.enabled = true;//产生阴影
-				renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
+				if(!that.isIOS){
+					renderer.shadowMap.enabled = true;//产生阴影
+					renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 阴影属性
+				}
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.outputColorSpace = THREE.SRGBColorSpace;
 				// renderer.toneMappingExposure = 0.1;//色调映射的曝光级别。默认是1
@@ -205,22 +253,22 @@
 				renderer.physicallyCorrectLights = true;//关键参数，模拟物理光照影响，必须设置为true
 
                 renderer.setPixelRatio(window.devicePixelRatio);
-                renderer.setSize(window.screen.width, that.canvasHeight);
+                renderer.setSize(screenWidth, that.canvasHeight);
                 container.appendChild( renderer.domElement );
 				
 				controls = new OrbitControls( camera, renderer.domElement );
-				controls.screenSpacePanning = true;
-				controls.enableDamping = true;
-				controls.minDistance = 0.5;
+				controls.enableDamping = true;//启动缓动
+				controls.minDistance = 0.0001;
 				controls.maxDistance = 10;
 				controls.minPolarAngle = 0;// 默认0
 				controls.maxPolarAngle = Math.PI / 2; // 默认Math.PI，即可以向下旋转到的视角。
-				controls.target.set(  that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
-				
+				// controls.target.set(  that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
 				controls.enableZoom = true;//启用摄像机的缩放
-				controls.enablePan = false;//禁用摄像机平移
+				controls.enablePan = true;//禁用摄像机平移
 				controls.enableRotate = true;//启用摄像机水平或垂直旋转
-				controls.zoomToCursor = true;
+				// controls.zoomToCursor = true;
+				
+				// controls.target.copy(camera.position);
 				// controls.update();
 				// 监听相机移动事件-限制只能在当前空间范围内移动
 				controls.addEventListener('change', () => {
@@ -237,9 +285,9 @@
 				// controls.target = new THREE.Vector3( );;
 				// camera.lookAt(that.controlStarPosition.x,that.controlStarPosition.y,that.controlStarPosition.z);
                 raycaster = new THREE.Raycaster();
-				stats = new Stats();
-				container.appendChild(stats.dom);
-				stats.domElement.style.top = '100px';
+				// stats = new Stats();
+				// container.appendChild(stats.dom);
+				// stats.domElement.style.top = '100px';
 				attendEvent();//注册监听事件
 				starRender();	//启动渲染
             }
@@ -288,7 +336,7 @@
 			}
 			//射线检测handle
 			function checkIntersection(event) {
-			    let x = (event.changedTouches[0].clientX / window.screen.width) * 2 - 1;
+			    let x = (event.changedTouches[0].clientX / screenWidth) * 2 - 1;
 			    let y = -(event.changedTouches[0].clientY / that.canvasHeight) * 2 + 1;
 			    mouse.x = x;
 			    mouse.y = y;
@@ -323,6 +371,7 @@
 						let index = mesh.instanceId;//射线相交是的实例序号
 						let spaceId = that.gltfSpaces[index].spaceId;//获取选中实例的空间id
 						if(floor.name == "花园"){//花园
+							return false;
 							let selectMesh = that.gltfSpaces.find(it=>{return it.spaceType==14 && it.instancedMeshIndexList[0].instancedAtIndex==index})
 							spaceId = selectMesh.spaceId;
 						}else{//室内
@@ -331,60 +380,34 @@
 							spaceId = selectMesh.spaceId;
 						}
 						// let spaceId = that.gltfSpaces[index].spaceId;//获取选中实例的空间id
-						console.warn("***checkIntersection-地板***",mesh,floor,index,spaceId,that.spaceId)
+						console.warn("***checkIntersection-地板***",floor,index,spaceId,that.spaceId)
 						//当前拾取到的是本空间的底部-意味着用户点击了地板
 						if(floor && spaceId == that.spaceId){
-							// console.warn("***checkIntersection-地板***",mesh,floor)
 							moveCarmer(mesh.point);
 							return false;
 						}
 					}
 			    }
 			}
-			//显示当前选中的视角或者隐藏所有视角-因为截图时不能保留视角
-			function hideOrShowActor (type) {
-				console.warn("***hideOrShowActor***",type)
-				if(type=='hide'){
-					that.actors.forEach(it=>{
-						it.visible = false;//隐藏所有的视角的mesh模型
-					})
-				}else{
-					if(!that.currentActor){
-						uni.showToast({
-							icon: "none",
-							title: "没有视角!",
-						});
-						return false;
-					}
-					that.actors.forEach(it=>{
-						if(that.currentActor.userIndex==it.userIndex){
-							it.visible = false;//隐藏即将切换到的视角的mesh模型
-						}else{
-							it.visible = true;//显示其他视角的模型
-						}
-					})
-				}
-			}
 			//自动切换视角
-			function switchActor () {
+			function switchActor (toIndex=null) {
 				if(!that.currentActor){
-					uni.showToast({
-						icon: "none",
-						title: "没有当前视角!",
-					});
+					this.$message.warning("没有当前视角!");
 					return false;
 				}
 				if(!that.actors || that.actors.length==0){
-					uni.showToast({
-						icon: "none",
-						title: "没有视角!",
-					});
+					this.$message.warning("没有视角!");
 					return false;
 				}
-				let index = that.currentActor.userIndex;//当前视角的序号
-				let nextIndex = (index + 1) % that.actors.length;
-				//移动到对应的视角去
-				moveActor(that.actors[nextIndex]);
+				if(toIndex!=null){//存在要去往的视角
+					moveActor(that.actors[toIndex]);
+				}else{
+					let index = that.currentActor.userIndex;//当前视角的序号
+					let nextIndex = (index + 1) % that.actors.length;
+					//移动到对应的视角去
+					moveActor(that.actors[nextIndex]);
+					that.defaulIndex = nextIndex;//更新下默认视角
+				}
 			}
 			//移动到选中的位置-地板
 			function moveCarmer (point) {
@@ -394,14 +417,16 @@
 				}
 				let _x =  point.x - camera.position.x;//x轴移动的距离
 				let _z =  point.z - camera.position.z;//z轴移动的距离
-				// console.warn("***moveCarmer***",_x,_z)
-				let cameraNewPosition = {x:camera.position.x + _x,y:1.2,z:camera.position.z + _z};
-				let targetNewPosition = {x:controls.target.x + _x,y:1.2,z:controls.target.z + _z};
+				let cameraNewPosition = {x:camera.position.x + _x,y:1.5,z:camera.position.z + _z};
+				let targetNewPosition = {x:controls.target.x + _x,y:1.5,z:controls.target.z + _z};
 				let oldUp = {x:0,y:1,z:0};	
 				let newUp = {x:0,y:1,z:0};
 				moveTip(cameraNewPosition)
 				// console.warn("**moveCarmer***",lon,JSON.stringify(cameraNewPosition),JSON.stringify(targetNewPosition))
 				tweenCamera(camera.position,controls.target,cameraNewPosition,targetNewPosition,oldUp,newUp,2000);
+				setTimeout(()=> {
+					that.circleGroup.visible = false;
+				}, 2000);
 			}
 			//创建地标
 			function creatMoveTip(position){
@@ -423,6 +448,7 @@
 					});
 					that.circleGroup.add(circle);
 					scene.add(that.circleGroup);
+					that.circleGroup.visible = false;
 				}
 			}
 			//移动地标
@@ -440,30 +466,26 @@
 					that.circleGroup.add(circle);
 					scene.add(that.circleGroup);
 				}else{
+					that.circleGroup.visible = true;
 					that.circleGroup.children[0].position.set(position.x,0.01,position.z);
 				}
 			}
 			//移动视角点位
 			function moveActor (obj) {
 				clearEvent();//注销事件监听
-				that.actors.forEach(it=>{
-					if(obj.userIndex==it.userIndex){
-						it.visible = false;//隐藏
-					}else{
-						it.visible = true;//显示其他
-					}
-				})
 				// console.warn("***moveActor***",obj)
 				that.currentActor = obj;//记录下当前的视角对象 mesh网格模型
 				let cameraNewPosition = obj.position;
 				let targetNewPosition = obj.targetNewPosition;
 				let oldUp = {x:0,y:1,z:0};	//俯视
 				let newUp = {x:0,y:1,z:0};	//正视
-				console.warn("**moveActor***",JSON.stringify(cameraNewPosition),JSON.stringify(targetNewPosition))
+				// moveTip(cameraNewPosition);
+				// console.warn("**moveActor***",JSON.stringify(cameraNewPosition),JSON.stringify(targetNewPosition))
 				tweenCamera(camera.position,controls.target,cameraNewPosition,targetNewPosition,oldUp,newUp,2000);
 				lon = 0;
 				setTimeout(()=> {
 					attendEvent()
+					// that.circleGroup.visible = false;
 				}, 2000);
 			}
 			//初始化点位视角
@@ -480,68 +502,65 @@
 				if(defaulIndex == -1){
 					defaulIndex = 0;
 				}
+				that.defaulIndex = defaulIndex;//记录下默认视角
 				that.actors = [];
-				that.loader.load("https://dm.static.elab-plus.com/miniProgram/hs/gltf/sxtgltf.gltf",  ( gltf ) => {
-					spaceObj.actors.forEach((actor,index)=>{
-						let model = gltf.scene; // 获取模型
-						let cloneModel = model.clone(true);//赋值模型，准备复用
-						cloneModel.children.map((v,i)=>{
-							if(v.material){
-								v.material = model.children[i].material.clone()
+				spaceObj.actors.forEach((actor,index)=>{
+					// let model = gltf.scene; // 获取模型
+					// let cloneModel = model.clone(true);//赋值模型，准备复用
+					// cloneModel.children.map((v,i)=>{
+					// 	if(v.material){
+					// 		v.material = model.children[i].material.clone()
+					// 	}
+					// })
+					// let cube = cloneModel;
+					let cube = {};
+					cube.name = "actor";
+					cube.userType = "mesh";
+					//新的摄像机的位置-新的摄像机角度是倾斜角度，所以z值需要计算，高度设置为模型高度的2倍
+					let _actorLoaction = actor.actorLocation.split(',');//x y z
+					let _actorTransform = actor.actorTransform.split(',');//旋转角度，取第三个值
+					let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]));//将度转化为弧度。
+					let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
+					// if(parseInt(_actorLoaction[1])==0){//X轴
+					// 	_actorLoaction[1] = spaceObj.centerX;
+					// }
+					// if(parseInt(_actorLoaction[0])==0){//Y轴
+					// 	_actorLoaction[0] = spaceObj.centerY;
+					// }
+					let X_C = parseInt(_actorLoaction[0]);//X轴偏移量
+					let Y_C = -parseInt(_actorLoaction[1]);//Y轴偏移量-取反，UE里面的Y轴方向跟Three.js相反
+					let px = spaceObj.centerX + X_C;
+					let py = -spaceObj.centerY + Y_C;//UE里面的centerY值跟Three.js Y轴相反；获得真实的坐标值
+					let position = {
+						x:(parseInt(px))/100,
+						y:1.5, 
+						z:(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
+					}
+					//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为1.5
+					let targetNewPosition = {
+						x:position.x + Math.sin(_hd),
+						y:1.5 + Math.tan(_hdY),
+						z:(position.z - Math.cos(_hd)),
+					}
+					cube.position = position;
+					cube.userIndex = index;
+					cube.actorEum = index;
+					cube.targetNewPosition = targetNewPosition;
+					// console.warn("*actors*",cube,defaulIndex)
+					that.actors.push(cube);//添加视角
+					if(index == defaulIndex){//隐藏当前视角
+						that.currentActor = cube;//记录下当前的视角对象 mesh网格模型
+						let param = {
+							type: 'CLK', //埋点类型
+							clkId: 'clk_2cmina_23080411', //点击ID
+							clkName: 'visualangle_clk', //点击前往的页面名称
+							clkParams: {
+								locusName: "预制视角",
+								type:that.actors[index].actorEum
 							}
-						})
-						let cube = cloneModel;
-						cube.name = "actor";
-						cube.userType = "mesh";
-						//新的摄像机的位置-新的摄像机角度是倾斜角度，所以z值需要计算，高度设置为模型高度的2倍
-						let _actorLoaction = actor.actorLocation.split(',');//x y z
-						let _actorTransform = actor.actorTransform.split(',');//旋转角度，取第三个值
-						let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]));//将度转化为弧度。
-						let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
-						if(parseInt(_actorLoaction[1])==0){//X轴
-							_actorLoaction[1] = spaceObj.centerX;
-						}
-						if(parseInt(_actorLoaction[0])==0){//Y轴
-							_actorLoaction[0] = spaceObj.centerY;
-						}
-						let X_C = _actorLoaction[0] - spaceObj.centerY;//X轴偏移量
-						let Y_C = _actorLoaction[1] - spaceObj.centerX;//Y轴偏移量
-						let px = spaceObj.centerX + X_C;
-						let py = spaceObj.centerY + Y_C;
-						let position = {
-							x:(parseInt(px))/100,
-							y:1.2, 
-							z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
-						}
-						//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为1.2
-						let targetNewPosition = {
-							x:position.x + Math.sin(_hd),
-							y:1.2 + Math.tan(_hdY),
-							z:(position.z - Math.cos(_hd)),
-						}
-						cube.position.set(position.x,position.y,position.z)
-						cube.scale.set(2, 2, 2);
-						cube.userIndex = index;
-						cube.actorEum = index;
-						cube.targetNewPosition = targetNewPosition;
-						console.warn("*actors*",cube)
-						scene.add(cube);
-						that.actors.push(cube);//添加视角
-						if(index == defaulIndex){//隐藏当前视角
-							cube.visible = false;
-							that.currentActor = cube;//记录下当前的视角对象 mesh网格模型
-							let param = {
-								type: 'CLK', //埋点类型
-								clkId: 'clk_2cmina_23080411', //点击ID
-								clkName: 'visualangle_clk', //点击前往的页面名称
-								clkParams: {
-									locusName: "预制视角",
-									type:that.actors[index].actorEum
-								}
-							};
-							util.trackRequest(param);
-						}
-					})
+						};
+						util.trackRequest(param);
+					}
 				})
 			}
 			//计算当前选中空间的平视时的观察点和摄像机的放置点位
@@ -563,46 +582,50 @@
 				let _actorTransform = defaultActor.actorTransform.split(',');//旋转角度，取第三个值
 				let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]) + lon);//将度转化为弧度。
 				let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
-				if(parseInt(_actorLoaction[1])==0){//X轴
-					_actorLoaction[1] = spaceObj.centerX;
-				}
-				if(parseInt(_actorLoaction[0])==0){//Y轴
-					_actorLoaction[0] = spaceObj.centerY;
-				}
-				let X_C = _actorLoaction[0] - spaceObj.centerY;//X轴偏移量
-				let Y_C = _actorLoaction[1] - spaceObj.centerX;//Y轴偏移量
+				// if(parseInt(_actorLoaction[1])==0){//X轴
+				// 	_actorLoaction[1] = spaceObj.centerX;
+				// }
+				// if(parseInt(_actorLoaction[0])==0){//Y轴
+				// 	_actorLoaction[0] = spaceObj.centerY;
+				// }
+				let X_C = parseInt(_actorLoaction[0]);//X轴偏移量-UE原因
+				let Y_C = -parseInt(_actorLoaction[1]);//Y轴偏移量-取反，UE里面的Y轴方向跟Three.js相反
 				let px = spaceObj.centerX + X_C;
-				let py = spaceObj.centerY + Y_C;
+				let py = -spaceObj.centerY + Y_C;
 				//新的摄像机的位置-新的摄像机角度是倾斜角度，所以z值需要计算，高度设置为模型高度的2倍
 				let cameraNewPosition = {
 					x:(parseInt(px))/100,
-					y:1.2, 
-					z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
+					y:1.5, 
+					z:(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
 				}
 				if(cameraNewPosition){
 					let minX = 0,maxX = 0,minY = 0,maxY = 0;//0.1 是模型墙壁厚度
 					minX = (spaceObj.centerX - (spaceObj.spaceWidth/2))/100 + 0.1;
 					maxX = (spaceObj.centerX + (spaceObj.spaceWidth/2))/100 - 0.1;
-					maxY = -((spaceObj.centerY - (spaceObj.spaceHeight/2))/100 + 0.1);
-					minY = -((spaceObj.centerY + (spaceObj.spaceHeight/2))/100 - 0.1);
+					maxY = ((-spaceObj.centerY + (spaceObj.spaceHeight/2))/100 - 0.1);
+					minY = ((-spaceObj.centerY - (spaceObj.spaceHeight/2))/100 + 0.1);
 					//新的坐标轴不在房间范围内，则不能移动
-					// console.warn("**roamPositionHandle-观察点不在范围中****",JSON.stringify(cameraNewPosition),minX,maxX,minY,maxY)
 					if(cameraNewPosition.x<minX || cameraNewPosition.x>maxX
 					||cameraNewPosition.z<minY || cameraNewPosition.z>maxY){//不在房间范围
 						let _x = ((spaceObj.spaceWidth/2) - 15)*defaultActor.presentX + spaceObj.centerX;
-						let _z = ((spaceObj.spaceHeight/2) - 15)*defaultActor.presentY + spaceObj.centerY;
+						let _z = ((spaceObj.spaceHeight/2) - 15)*defaultActor.presentY + (-spaceObj.centerY);
 						cameraNewPosition.x = _x/100;
-						cameraNewPosition.z = - _z/100;
+						cameraNewPosition.z = _z/100;
 						console.warn("**roamPositionHandle-观察点不在空间范围-强制修正观察点位置****",JSON.stringify(cameraNewPosition))
 					}
 				}
-				//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为1.2
+				//新的观察点的位置-取模型的中心点坐标，加上高度，由于模型都是贴地的，所以高度设置为1.5
 				let targetNewPosition = {
 					x:cameraNewPosition.x + Math.sin(_hd),
-					y:1.2 + Math.tan(_hdY),
+					y:1.5 + Math.tan(_hdY),
 					z:(cameraNewPosition.z - Math.cos(_hd)),
 				}
-				return {cameraNewPosition,targetNewPosition}
+				let lookPosition = {
+					x:cameraNewPosition.x + (Math.sin(_hd)*0.01),
+					y:1.5 + Math.tan(_hdY),
+					z:(cameraNewPosition.z - (Math.cos(_hd))*0.01),
+				}
+				return {cameraNewPosition,targetNewPosition,lookPosition}
 			}
 			//直接定位到摄像头位置
 			function positionCamer(mesh=null){
@@ -622,23 +645,21 @@
 						presentY:chooseMesh.presentY,
 					}]
 				}
-				try{
-					boundary = new THREE.Box3(
-						new THREE.Vector3(chooseMesh.centerX/100 - chooseMesh.spaceWidth/100/2 + 0.1, 0, -chooseMesh.centerY/100 - chooseMesh.spaceHeight/100/2 + 0.1), // 边界框的最小点
-						new THREE.Vector3(chooseMesh.centerX/100 + chooseMesh.spaceWidth/100/2 - 0.1, 2.7, -chooseMesh.centerY/100 + chooseMesh.spaceHeight/100/2 - 0.1) // 边界框的最大点
-					);
-					initActor();//初始化视角
-					let data = roamPositionHandle();
-					let cameraNewPosition = data.cameraNewPosition;
-					let targetNewPosition = data.targetNewPosition;
-					creatMoveTip(cameraNewPosition);//创建移动的地标
-					camera.position.set(cameraNewPosition.x, cameraNewPosition.y, cameraNewPosition.z);
-					camera.lookAt(targetNewPosition.x,targetNewPosition.y,targetNewPosition.z);
-					controls.target.set(targetNewPosition.x,targetNewPosition.y,targetNewPosition.z);
-				}catch(e){
-					alert("***positionCamer-error***"+e)
-				}
-				
+				boundary = new THREE.Box3(
+					new THREE.Vector3(chooseMesh.centerX/100 - chooseMesh.spaceWidth/100/2 + 0.1, 0, -chooseMesh.centerY/100 - chooseMesh.spaceHeight/100/2 + 0.1), // 边界框的最小点
+					new THREE.Vector3(chooseMesh.centerX/100 + chooseMesh.spaceWidth/100/2 - 0.1, 2.7, -chooseMesh.centerY/100 + chooseMesh.spaceHeight/100/2 - 0.1) // 边界框的最大点
+				);
+				initActor();//初始化视角
+				let data = roamPositionHandle();
+				let cameraNewPosition = data.cameraNewPosition;
+				let targetNewPosition = data.targetNewPosition;
+				let lookPosition = data.lookPosition;
+				creatMoveTip(cameraNewPosition);//创建移动的地标
+				camera.position.set(cameraNewPosition.x, cameraNewPosition.y, cameraNewPosition.z);
+				controls.target.set(lookPosition.x,lookPosition.y,lookPosition.z);
+				// controls.target.set(cameraNewPosition.x,cameraNewPosition.y,cameraNewPosition.z);
+				// controls.target.copy(camera.position);
+				camera.lookAt(targetNewPosition.x,targetNewPosition.y,targetNewPosition.z);
 			}
 			// oldP  相机原来的位置
             // oldT  target原来的位置
@@ -681,22 +702,21 @@
 					camera.position.x = object.x1;
 					camera.position.y = object.y1;
 					camera.position.z = object.z1;
-					let newTarget = new THREE.Vector3(object.x3,object.y3,object.z3);
-					camera.up.copy(newTarget);
+					// let newTarget = new THREE.Vector3(object.x3,object.y3,object.z3);
+					// camera.up.copy(newTarget);
 					camera.lookAt(object.x2,object.y2,object.z2);
 					// controls.target.x = object.x2;
 					// controls.target.y = object.y2;
 					// controls.target.z = object.z2;
 					// controls.update();
-					// console.warn("****onUpdate**",object.x1,object.y1,object.z1,object.x2,object.y2,object.z2)
 				}).onComplete(()=>{
 					controls.target.x = newT.x;
 					controls.target.y = newT.y;
 					controls.target.z = newT.z;
 					//修正最后的视角
-					let up = new THREE.Vector3(newUp.x,newUp.y,newUp.z);
-					camera.up.copy(up);
-					camera.lookAt(controls.target.x,controls.target.y,controls.target.z);
+					// let up = new THREE.Vector3(newUp.x,newUp.y,newUp.z);
+					// camera.up.copy(up);
+					camera.lookAt(newT.x,newT.y,newT.z);
 					tweenCameraAnma = false;
 					that.repeatFlag = false;//放开限制，可以再次点击
 				})
@@ -719,74 +739,45 @@
 					return false;
 				}
                 TWEEN && TWEEN.update();
-				stats.update();
-				//不处在动画过程中，则可以处理移动等动作
-				if(tweenCameraAnma==false){
-					
-				}
+				// stats.update();
 				renderer.render(scene, camera);//单次渲染
 				requestId = requestAnimationFrame(render, canvas3d);
 				if (that.screenshotResolve) {
-					// if(that.isIos){//IOS手机
-						stopRender();
-						that.screenshotResolve()
-						that.screenshotResolve = null;//释放Promise
-					// }else{//安卓手机
-					// 	let gl = renderer.getContext();
-					// 	let frameBuffer = new THREE.Vector2();
-					// 	renderer.getDrawingBufferSize(frameBuffer);
-					// 	let pixelData = new Uint8Array(frameBuffer.x * frameBuffer.y * 4);
-					// 	//参考 Threejs WebGLRenderer.readRenderTargetPixels
-					// 	if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) === gl.FRAMEBUFFER_COMPLETE) {
-					// 		gl.readPixels(0, 0, frameBuffer.x, frameBuffer.y, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
-					// 		// 确保有像素，微信小程序安卓在进入子页面返回本页面后，再一次readPixels稳定无像素
-					// 		if (pixelData.some(i => i !== 0)) {
-					// 			stopRender();
-					// 			console.warn("***screenshotResolve-pixelData***");
-					// 			that.screenshotResolve([pixelData, frameBuffer.x, frameBuffer.y])
-					// 			that.screenshotResolve = null;//释放Promise
-					// 			frameBuffer = null;//清空内存中的数据
-					// 			pixelData = null;//清空内存中的数据
-					// 		}
-					// 	}
-					// }
+					stopRender();
+					that.screenshotResolve()
+					that.screenshotResolve = null;//释放Promise
 				}
             }
 
 		},
-		computed: {
-			curHouseObj() {
-				return this.$store.state.curHouseObj;
-			},
-		},
-		watch: {
-			curHouseObj: {
-				handler(val) {
-					if (val) {
-						// setTimeout(()=> {
-						if(this.renderer){
-							this.setHouseDetail(val);
-						}
-						// }, 1000);
-					}
-				},
-				immediate: true,
-			}
-		},
+		// computed: {
+		// 	curHouseObj() {
+		// 		return this.$store.state.curHouseObj;
+		// 	},
+		// 	wallList() {
+		// 		return this.$store.state.wallList;
+		// 	},
+		// },
 		methods: {
-			hideOrShowActor(){
-				
-			},
-			switchActor(){
-				
+			navbarBackClk() {
+				if(!this.$refs.viewMask){
+					this.$router.go(-1);
+					return false
+				}
+				if (this.$refs.viewMask.showAIImage) {
+					this.$refs.viewMask.showOrHideWebGl();//隐藏显示的AI生图
+					// if(this.currentActor.userIndex!=this.defaulIndex){//当前不是默认视角了
+						this.switchActor(this.defaulIndex);//切换到默认视角
+					// }
+				} else {
+					this.$router.go(-1);
+				}
 			},
+			switchActor(){},
 			positionCamer(){},
 			clearHandle(){
 				this.clearEvent();
 			},
-			showOrHideWebGl(){
-				this.$refs.viewMask.showOrHideWebGl();//显示或者隐藏AI
-			},
 			save(){
 				this.$refs.viewMask.save();//下载
 			},
@@ -796,9 +787,9 @@
 			 */
 			setHouseDetail(data){
 				if(data){
-					this.id = this.curHouseObj.id;
+					this.id = data.id;
 					this.spaceId = this.$route.query.spaceId?this.$route.query.spaceId:'';
-					console.warn("***curHouseObj***",this.curHouseObj)
+					console.warn("***curHouseObj***",data)
 					// 加载户型
 					this.loadSpace();
 				}else{
@@ -821,22 +812,28 @@
                     for (let index = 0; index < spaceList.length; index++) {
                         var element = spaceList[index];
                         // const centerX = JSON.parse(JSON.stringify(element.centerX))
+						if(!element.actors || element.actors.length==0){
+							element.actors = [{
+								actorLocation:element.actorLocation,
+								actorTransform:element.actorTransform,
+								isSelected:true,
+							}]
+						}
 						element.actors.forEach(actor=>{
 							let _actorLoaction = actor.actorLocation.split(',');//x y z
-							let X_C = (parseInt(_actorLoaction[0]) || element.centerY) - element.centerY;//X轴偏移量-UE原因
-							let Y_C = (parseInt(_actorLoaction[1]) || element.centerX) - element.centerX;//Y轴偏移量-向量
+							let X_C = parseInt(_actorLoaction[0]);//X轴偏移量-UE原因
+							let Y_C = -parseInt(_actorLoaction[1]);//Y轴偏移量-取反，UE里面的Y轴方向跟Three.js相反
 							let _x = element.centerX + X_C;
-							let _z = element.centerY + Y_C;
+							let _z = -element.centerY + Y_C;//centerY 要取反，因为UE里面是反向的
 							
 							// let _x = parseInt(_actorLoaction[1]) || element.centerX;//观察点 X轴坐标 
 							// let _z = parseInt(_actorLoaction[0]) || element.centerY;//观察点 Z轴坐标
 							let _presentX = (_x - element.centerX)/((element.spaceWidth/2) - 10);//10是墙壁厚度-单位cm
-							let _presentY = (_z - element.centerY)/((element.spaceHeight/2) - 10);
+							let _presentY = (_z + element.centerY)/((element.spaceHeight/2) - 10);
 							//注意如果一开始就设置大超过空间大小，则处理成贴近空间边界
 							actor.presentX = Math.abs(_presentX)>1 ? (_presentX>1?1:-1) : _presentX;//观察点跟空间中心原点的距离比例
 							actor.presentY = Math.abs(_presentY)>1 ? (_presentY>1?1:-1) : _presentY;
 						})
-						
 						element.wallMoveValue = "[0,0,0,0]"
                         this.spaceList.push(element);
                         this.wallIds.push(element.wallId);
@@ -851,7 +848,7 @@
                 }
 				let curSpaceArea = parseFloat((this.curSpaceObj.spaceWidth * this.curSpaceObj.spaceHeight) / 10000).toFixed(1);
 				this.navbar.title = this.curSpaceObj.spaceName + "  " + curSpaceArea + "㎡"
-                console.log("该户型空间数据:", this.spaceList);curSpaceArea
+                console.log("该户型空间数据:", this.spaceList);
                 console.log("当前选中的空间:", this.curSpaceObj);
 				this.positionCamer(this.curSpaceObj);
 				this.loaderSpaceArr(this.spaceList);//绘制地板
@@ -860,13 +857,17 @@
             },
 			// 获取墙体数据
             async getHouseTypeSpaceWalls(){
-                let data = {id:this.wallIds}
-                const res = await requestConfig('getHouseTypeSpaceWalls', data, true);
-                console.log("墙体数据:", res.list)
-                let wallList = [];
-                if(res.success){
-                    wallList = this.wallList = res.list;
-                }
+				let wallList = [];
+				if(this.wallList){
+					wallList = this.wallList;
+				}else{
+					let data = {id:this.wallIds}
+					const res = await requestConfig('getHouseTypeSpaceWalls', data, true);
+					// console.log("墙体数据:", res.list)
+					if(res.success){
+					    wallList = this.wallList = res.list;
+					}
+				}
                 let wallArr = []
                 for (let index = 0; index < wallList.length; index++) {//每个空间对应一个数据
                     let element = JSON.parse(wallList[index].wallJson);

src/router/index.js

@@ -2,7 +2,8 @@ import Vue from 'vue'
 import Router from 'vue-router'
 
 // import Login from '@/pages/loginView/loginView.vue'
-import mainView from '@/pages/mainView/mainView.vue'
+// import mainView from '@/pages/mainView/mainView.vue'
+import mapComponent from '@/pages/mapComponent/mapComponent.vue'
 import webgl_rxdz from '@/pages/webgl_rxdz/webgl_rxdz.vue'
 import webgl_rxdz_roam from '@/pages/webgl_rxdz_roam/webgl_rxdz_roam.vue'
 import webgl_rxdz_look from '@/pages/webgl_rxdz_look/webgl_rxdz_look.vue'
@@ -10,6 +11,7 @@ import webgl_rxdz_customize from '@/pages/webgl_rxdz_customize/webgl_rxdz_custom
 
 Vue.use(Router)
 const router = new Router({
+    mode: 'hash',
     // mode: 'history',
     routes: [
         // 页面初始化
@@ -48,21 +50,31 @@ const router = new Router({
 			meta:{
 				keepAlive:false
 			}
-        }
+        },
+		{
+		    path: '/pages/mapComponent',
+		    name: 'mapComponent',
+		    component: mapComponent,
+			meta:{
+				keepAlive:false
+			}
+		}
 		
     ],
 })
-
-router.beforeEach((to, from, next) => {
-	console.warn("router:start-1", from,to);
-	//如果存在用户账号信息|| to.query.uid
-	next();
-	return 
-})
-//同一个路由跳转报错解决，NavigationDuplicated: Avoided redundant navigation to current location:
-const originalPush = Router.prototype.push
-Router.prototype.push = function push(location) {
-    return  originalPush.call(this,location).catch(err=>err)
-}
+// router.beforeRouteLeave = (to, from, next)=> {
+//     console.warn("router:start-2", from,to);
+//     next()
+// }
+// router.beforeEach((to, from, next) => {
+// 	console.warn("router:start-1", from,to);
+// 	//如果存在用户账号信息|| to.query.uid
+// 	next();
+// })
+// //同一个路由跳转报错解决，NavigationDuplicated: Avoided redundant navigation to current location:
+// const originalPush = Router.prototype.push
+// Router.prototype.push = function push(location) {
+//     return  originalPush.call(this,location).catch(err=>err)
+// }
 
 export default router;

src/services/request.js

@@ -1,13 +1,13 @@
 import store from "@/store";
 import axios from 'axios';
 import {getStorage, removeItem} from '@/utils/localStorage'
-import router from '@/router'
 var requestCount = 0; //记录下同时的请求数
 // import ElementUI from 'element-ui';
 var showToast = true;
 
 axios.defaults.headers.post['elabEnvironment'] = '4'; //axios默认的请求方式,可以自己设置
 axios.defaults.headers.post['userType'] = '1000'; //axios默认的请求方式,可以自己设置
+// axios.defaults.headers.post['Authorization'] = 'Token 9837b7480a99ab4df7e3a06ad0d990fbc7b941e4'; //axios默认的请求方式,可以自己设置
 axios.interceptors.request.use(function(config) {
 	if(config.noLoading){
 		store.dispatch('setLoading',false);//不显示loading态
@@ -17,7 +17,9 @@ axios.interceptors.request.use(function(config) {
 	!config.url.includes('aiGenerateImg/img2Img')){
 		requestCount++;//请求数+1
 	}
-	if (config.url.includes('http')) {
+	if (config.url.endsWith('.jpg') || config.url.endsWith('.png') || config.url.endsWith('.gif')) {
+	    // 给图片get请求附加header
+		console.warn("***图片get请求***",config.url)
 		return config;
 	} else {
 		config.url = window.$config.api_url + config.url;
@@ -60,45 +62,6 @@ axios.interceptors.response.use(function(response) {
 	if (requestCount < 1) {
 		store.state.loading = false;//不显示loading状态
 	}
-	//如果返回的状态码是401则需要返回到登录
-	if(error.response && error.response.status && error.response.status==401){
-		window.$bus.$off();//取消所有的订阅事件
-		removeItem('userInfoThing');
-		removeItem('currentConponent');
-		removeItem('setProgramComponetData');
-		for (let i = 0; i < window.localStorage.length; i++) {
-			let key = window.localStorage.key(i);
-			if (key.includes("currentProject")) {
-				removeItem(key);
-			}
-			if (key.includes("planItem")) {
-				removeItem(key);
-			}
-		}
-		window.$clearPermissionRole();//登出时重置权限里面记录的权限单元
-		store.dispatch('setCurrentProject',null);
-		router.push({
-			name: "Login"
-		});
-		if (showToast){
-			showToast = false;
-			// ElementUI.Message({
-			// 	message:"账号已失效",
-			// 	type:"error"
-			// });
-		}
-		error.response.message = "账号已失效";
-		error.response.data.message = "账号已失效";
-		// MessageBox.alert('账号已失效,无法登录', '提示', {
-		//           confirmButtonText: '确定',
-		//           callback: action => {
-		//               router.replace({
-		//                   name: 'Login',
-		//                   query: {redirect: router.currentRoute.fullPath} //登录后再跳回此页面时要做的配置
-		//               })
-		//           }
-		//       });
-	}
 	let result = error.response;
 	return result;
 });

src/services/requestConfig.js

@@ -35,6 +35,7 @@ const endpoints = {
 	generateTaskWordToImgForAliyun: 'elab-marketing-content/aiGenerateImg/addTaskWithWord2Img', // 生成识别任务-阿里云(文生图)
 	generateProcess: 'elab-marketing-content/aiGenerateImg/getResult', // 获取任务进度-阿里云
 	shareDetail: '/elab-marketing-content/aiDreamHouse/V3.0/shareDetail', // 分享查看
+	// predictions: "https://api.replicate.com/v1/deployments/feathers-wing/spacely-realistic-style-softedge-a100/predictions", // 分享查看
 };
 window.requestConfig = async(endpoint, options, isHideLoading = false, preventDoubleClick = false, method = 'post') => {
 	if (!endpoints.hasOwnProperty(endpoint)) {

src/services/urlConfig.js

@@ -3,6 +3,7 @@ var config = function(env) {
     if (env === 'test') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '100296',
             miniAppUrl: 'https://h5test.elab-plus.com/',
             zipUrl: 'http://139.196.5.59:5307',
             uploadUrl: 'http://101.132.138.87:5555', //文件上传
@@ -27,6 +28,7 @@ var config = function(env) {
     } else if (env === 'test2') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '100296',
             miniAppUrl: 'https://h5test.elab-plus.com/',
             zipUrl: 'http://139.196.5.59:5307',
             uploadUrl: 'http://106.14.187.241:5555', //文件上传
@@ -51,6 +53,7 @@ var config = function(env) {
     } else if (env === 'test3') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '100296',
             miniAppUrl: 'https://h5test.elab-plus.com/',
             zipUrl: 'http://139.196.5.59:5307',
             uploadUrl: 'http://106.14.187.241:5555', //文件上传
@@ -75,6 +78,7 @@ var config = function(env) {
     } else if (env === 'test4') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '100296',
             miniAppUrl: 'https://h5test.elab-plus.com/',
             zipUrl: 'http://139.196.5.59:5307',
             uploadUrl: 'http://106.14.187.241:5555', //文件上传
@@ -99,6 +103,7 @@ var config = function(env) {
     } else if (env === 'dev') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '100296',
             miniAppUrl: 'http://h5test.elab-plus.com/',
             zipUrl: 'http://139.196.5.59:5307',
             uploadUrl: 'http://192.168.50.104:5555', //文件上传
@@ -123,6 +128,7 @@ var config = function(env) {
     } else if (env === 'uat') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '11121',
             miniAppUrl: 'https://mng-uat.elaber.cn/',
             uploadUrl: 'https://api-uat.elaber.cn', //文件上传地址
             api_url: 'https://api-uat.elaber.cn/', //堡垒 接口地址https://dm.static.elab-plus.com/Kq3t1c3IDV.txt
@@ -146,6 +152,7 @@ var config = function(env) {
     } else if (env === 'uat3') {
         WEB_CONF = {
 			brandId: 94,
+			xcxHouseId: '11121',
             miniAppUrl: 'https://mng-uat3.elaber.cn/',
             uploadUrl: 'https://api-uat3.elaber.cn', //文件上传地址
             api_url: 'https://api-uat3.elaber.cn/', //堡垒 接口地址https://dm.static.elab-plus.com/Kq3t1c3IDV.txt
@@ -168,21 +175,22 @@ var config = function(env) {
         }
     } else if (env === 'production') {
         WEB_CONF = {
-			brandId: 110,
+			brandId: 109,
             miniAppUrl: 'https://dm-mng.elab-plus.com.cn/',
             uploadUrl: 'https://dm-api.elab-plus.cn', //文件上传
             api_url: 'https://dm-api.elab-plus.cn/', //接口地址
             redirect_uri: 'http://city.1949plus.com', // 授权回调地址
-            themeColor1: '#FFD09F',
-            themeColor2: '#FFAD5C',
-            themeColor3: '#EF863F',
-            themeColor4: '#FFDF80',
-            themeColor5: '#848EFF',
-            themeColor6: '#76BCFF',
-            themeColor7: '#85FDF0',
-            themeColor8: '#FFEDB9',
-            themeColor9: '#FFFFFF',
-            themeColor10: '#000000',
+			xcxHouseId: '11121',
+            themeColor1: '#7AB47C',
+            themeColor2: '#A7CE80',
+            themeColor3: '#EEFFE6',
+            themeColor4: '#F8F8F8',
+            themeColor5: 'rgba(122, 180, 124, 0.5)',
+            themeColor6: 'rgba(122, 180, 124, 0.2)',
+            themeColor7: 'rgba(220, 252, 168, 0.5)',
+            themeColor8: 'rgba(220, 252, 168, 0.2)',
+            themeColor9: '#292D33',
+            themeColor10: '#FFFFFF',
             themeColor11: '#B4FACB',
             themeColor12: '#4D7B5C',
             clientId:'1112009742',

src/static/globlModel.js

@@ -0,0 +1,91 @@
+/*
+ * @Author: caodongdong caodongdoong@gmail.com
+ * @Date: 2023-10-26 13:18:07
+ * @LastEditors: caodongdong caodongdoong@gmail.com
+ * @LastEditTime: 2023-10-26 19:45:43
+ * @FilePath: \h5-webgl-program\src\static\globlShowModel.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+//需要精简加载的模型名称
+var globlShowModel = [
+	'BP_T_2PeopleBasin01',
+	'BP_T_bathtub01',
+	'BP_B_wardrobe01',
+	'BP_B_bigbed01',
+	'BP_B_smallcabinet01',
+	'BP_O_LightIndoorWall',
+	'BP_B_wardrobe03',
+	'BP_B_painting01',
+	'BP_T_2PeopleBasin02',
+	'BP_X_RelaxChair01_One',
+	'BP_B_dresser01',
+	'BP_B_Mbed01',
+	'BP_B_table01',
+	'BP_B_wardrobe02',
+	'BP_X_RelaxArea01',
+	'BP_B_smallbed01',
+	'BP_AutoWallr_08M',
+	'BP_B_verysmallbed',
+	'BP_AutoWall_195M',
+	'BP_XSPACE_painting_05',
+	'BP_Lhildren07',
+	'BP_L_backsofa01',
+	'BP_DLBT_painting01',
+	'BP_L_Exhibition02_simple',
+	'BP_D_LongDiningTable_240CM',
+	'BP_D_DiningDecoration01',
+	'BP_D_DinnerChair01',
+	'BP_L_1Sofa03',
+	'BP_L_TeaTable04',
+	'BP_Larpet01',
+	'BP_L_TeaTable05',
+	'BP_L_31TV01',
+	'BP_L_book01_simple',
+	'BP_B_penzai02',
+	'BP_furnitureBase',
+	'BP_L_1Sofa02',
+	'BP_L_2Sofa02',
+	'BP_L_Teatable03',
+	'BP_L_FloorLamp01',
+	'BP_LeilingLamp_01',
+	'BP_D_xiaobazhauo',
+	'BP_L_TeaTable02',
+	'BP_T_flue001',
+	'BP_T_1PeopleBasin01',
+	'BP_T_matong',
+	'BP_T_OpenShower02',
+	'BP_T_OpenShower03',
+	'BP_K_icebox_2door002',
+	'BP_K_flue002',
+	'BP_K_shuipen01',
+	'BP_K_cookerhood3',
+	'BP_K_shuipen02',
+	'BP_K_cookerhood02',
+	'BP_K_Kitchentable002',
+	'BP_AutoWall_39M',
+	'BP_T_Locker01',
+	'BP_G_tree01',
+	'BP_G_tree00',
+	'BP_T_stairs01',
+	'BP_K_caozuotai001',
+	'BP_K_caozuotai002',
+	'BP_K_caozuotai03',
+	'BP_L_carpet01',
+	'BP_K_cookerhood02',
+	'BP_K_cookerhood3',
+	'BP_BR_linyu_ce',
+	'BP_T_OpenShower01',
+	'BP_XSPACE_painting_08',
+	'BP_L_children07',
+	'BP_B_wardrobe04',
+	'BP_L_2Sofa03',
+	'BP_XSPACE_painting_05',
+	'BP_T_1PeopleBasin03',
+	'BP_AutoWall_51M',
+	'BP_G_grass01',
+	'BP_G_tree03',
+	'BP_sofa_with_toy_A',
+	'BP_sofa_with_toy_B',
+];
+
+module.exports = globlShowModel;

src/static/globlShowModel.js

@@ -1,35 +1,91 @@
+/*
+ * @Author: caodongdong caodongdoong@gmail.com
+ * @Date: 2023-10-26 13:18:07
+ * @LastEditors: caodongdong caodongdoong@gmail.com
+ * @LastEditTime: 2023-10-26 19:45:43
+ * @FilePath: \h5-webgl-program\src\static\globlShowModel.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 //需要精简加载的模型名称
 var globlShowModel = [
-	'BP_XSPACE_deng_01',
+	'BP_T_2PeopleBasin01',
+	'BP_T_bathtub01',
+	'BP_B_wardrobe01',
+	'BP_B_bigbed01',
+	'BP_B_smallcabinet01',
+	'BP_O_LightIndoorWall',
+	'BP_B_wardrobe03',
+	'BP_B_painting01',
+	'BP_T_2PeopleBasin02',
+	'BP_X_RelaxChair01_One',
+	'BP_B_dresser01',
+	'BP_B_Mbed01',
+	'BP_B_table01',
+	'BP_B_wardrobe02',
+	'BP_X_RelaxArea01',
+	'BP_B_smallbed01',
+	'BP_AutoWallr_08M',
+	'BP_B_verysmallbed',
+	'BP_AutoWall_195M',
+	'BP_XSPACE_painting_05',
+	'BP_Lhildren07',
+	'BP_L_backsofa01',
+	'BP_DLBT_painting01',
+	'BP_L_Exhibition02_simple',
+	'BP_D_LongDiningTable_240CM',
+	'BP_D_DiningDecoration01',
+	'BP_D_DinnerChair01',
+	'BP_L_1Sofa03_simple',
+	'BP_L_TeaTable04',
+	'BP_Larpet01',
+	'BP_L_TeaTable05',
+	'BP_L_31TV01',
+	'BP_L_book01_simple',
+	'BP_B_penzai02',
+	'BP_furnitureBase',
+	'BP_L_1Sofa02',
+	'BP_L_2Sofa02',
+	'BP_L_Teatable03_simple',
+	'BP_L_FloorLamp01',
+	'BP_LeilingLamp_01',
+	'BP_D_xiaobazhauo',
+	'BP_L_TeaTable02',
+	'BP_T_flue001',
+	'BP_T_1PeopleBasin01',
+	'BP_T_matong',
+	'BP_T_OpenShower02',
+	'BP_T_OpenShower03',
+	'BP_K_icebox_2door002',
+	'BP_K_flue002',
+	'BP_K_shuipen01',
+	'BP_K_cookerhood3',
+	'BP_K_shuipen02',
+	'BP_K_cookerhood02',
+	'BP_K_Kitchentable002',
+	'BP_AutoWall_39M',
+	'BP_T_Locker01',
+	'BP_G_tree01',
+	'BP_G_tree00',
+	'BP_T_stairs01',
+	'BP_K_caozuotai001',
+	'BP_K_caozuotai002',
+	'BP_K_caozuotai03',
 	'BP_L_carpet01',
-	"BP_D_LongDiningTable_240CM",
-	"BP_D_DinnerChair01",
-	"BP_L_2Sofa01",
-	"BP_L_1Sofa01",
-	"BP_L_book01",
-	"BP_L_31TV01",
-	"BP_L_TeaRTable",
-	"BP_B_verysmallbed",
-	"BP_B_wardrobe01",
-	"BP_K_Kitchentable002",
-	"BP_K_cookerhood2",
-	"BP_K_icebox_2door002",
-	"BP_K_flue002",
-	"BP_K_caozuotai03",
-	"BP_K_caozuotai001",
-	"BP_K_cookerhood02",
-	"BP_K_shuipen01",
-	"BP_K_shuipen02",
-	"BP_T_matong",
-	"BP_T_1PeopleBasin01",
-	"BP_T_OpenShower01",
-	"BP_L_TeaTable02",
-	"BP_B_bigbed01",
-	"BP_T_bathtub01",
-	"BP_G_tree00",
-	"BP_G_tree01",
-	"BP_G_tree02",
-	"BP_G_tree03",
+	'BP_K_cookerhood02',
+	'BP_K_cookerhood3',
+	'BP_BR_linyu_ce',
+	'BP_T_OpenShower01',
+	'BP_XSPACE_painting_08',
+	'BP_L_children07',
+	'BP_B_wardrobe04',
+	'BP_L_2Sofa03_simple',
+	'BP_XSPACE_painting_05',
+	'BP_T_1PeopleBasin03',
+	'BP_AutoWall_51M',
+	'BP_G_grass01',
+	'BP_G_tree03',
+	'BP_sofa_with_toy_A',
+	'BP_sofa_with_toy_B',
 ];
 
-module.exports = globlShowModel;
+module.exports = globlShowModel;

src/static/layoutModelData - 副本.js

@@ -0,0 +1,170 @@
+var layoutModel = [
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_Mbed.glb', name: '1.5m床',modelName: 'BP_B_Mbed01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_smallcabinet.glb', name: '床头柜',modelName: 'BP_B_smallcabinet01', type:1},
+	// {url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_195M_C.gltf', name: '1.95m',modelName: 'BP_AutoWall_195M_C', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_bigbed.glb', name: '1.8m床',modelName: 'BP_B_bigbed01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_smallbed.glb', name: '1.2m床',modelName: 'BP_B_smallbed01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_verysmallbed.glb', name: '0.9m床',modelName: 'BP_B_verysmallbed', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_31sofa.gltf', name: '4人沙发',modelName: 'BP_L_31sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_31TV.glb', name: '电视墙',modelName: 'BP_L_31TV01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_4people_square.glb', name: '4人方桌',modelName: 'BP_D_4people_square', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_yigui.glb', name: '衣柜',modelName: 'BP_B_yigui01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_311sofa01.gltf', name: '5人沙发',modelName: 'BP_L_311sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_321sofa.gltf', name: '6人沙发',modelName: 'BP_L_321sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_2people_square.gltf', name: '2人方桌',modelName: 'BP_D_2people_square', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_6people_long.gltf', name: '6人长桌',modelName: 'BP_D_6people_long01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_6people_long.gltf', name: '6人长桌',modelName: 'BP_D_6people_long01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_8people_long.gltf', name: '8人长桌',modelName: 'BP_D_8people_long', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_RoundTable01.glb', name: '12人圆桌',modelName: 'BP_D_12people_round', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_penzai01.glb', name: '盆栽',modelName: 'BP_B_penzai02', type:1},
+
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_facesofa01.gltf', name: '对坐沙发01',modelName: 'BP_D_facesofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_O_painting01.gltf', name: '挂画装饰',modelName: 'BP_DLBT_painting01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_painting01.glb', name: '挂画01',modelName: 'BP_B_painting01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_painting02.glb', name: '挂画02',modelName: 'BP_B_painting02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_XSPACE_painting_05.glb', name: '挂画5',modelName: 'BP_XSPACE_painting_05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_bookshelf01.glb', name: '大书架01',modelName: 'BP_L_bookshelf01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_bookshelf02.glb', name: '大书架02',modelName: 'BP_L_bookshelf02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_book01.glb', name: '小书架',modelName: 'BP_L_book01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_dinetable01.gltf', name: '大展架01',modelName: 'BP_L_exhibition01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_Exhibition02.glb', name: '大展架02',modelName: 'BP_L_exhibition02', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition04.gltf', name: '4m展架',modelName: 'BP_L_exhibition04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition05.gltf', name: '5m展架',modelName: 'BP_L_exhibition05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition06.gltf', name: '6m展架',modelName: 'BP_L_exhibition06', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition07.gltf', name: '7m展架',modelName: 'BP_L_exhibition07', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_21sofa.glb', name: '3人沙发',modelName: 'BP_L_21sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_facesofa02.gltf', name: '对坐沙发02',modelName: 'BP_D_facesofa02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe01.glb', name: '1m衣柜',modelName: 'BP_B_wardrobe01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe02.glb', name: '2m衣柜',modelName: 'BP_B_wardrobe02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe03.glb', name: '3m衣柜',modelName: 'BP_B_wardrobe03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe04.glb', name: '4m衣柜',modelName: 'BP_B_wardrobe04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_dresser01.glb', name: '梳妆台01',modelName: 'BP_B_dresser01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_bathtub01.glb', name: '浴缸01',modelName: 'BP_T_bathtub01', type:1},
+	
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_table01.glb', name: '1m写字台',modelName: 'BP_B_table01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_stairs01.glb', name: '楼梯01',modelName: 'BP_T_stairs01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children01.gltf', name: '儿童家具01',modelName: 'BP_L_children01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children02.gltf', name: '儿童家具02',modelName: 'BP_L_children02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children03.gltf', name: '儿童家具03',modelName: 'BP_L_children03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_2PeopleBasin01.glb', name: '2人台盆01',modelName: 'BP_T_2PeopleBasin01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_2PeopleBasin02.glb', name: '2人台盆02',modelName: 'BP_T_2PeopleBasin02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_flue001.glb', name: '烟道',modelName: 'BP_K_flue002', type:1},
+
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_cookerhood2.glb', name: '灶台2',modelName: 'BP_K_cookerhood02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_cookerhood3.glb', name: '灶台3',modelName: 'BP_K_cookerhood3', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_icebox_2door001.glb', name: '冰箱',modelName: 'BP_K_icebox_2door002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_shuipen01.glb', name: '水盆01',modelName: 'BP_K_shuipen01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_shuipen02.glb', name: '水盆02',modelName: 'BP_K_shuipen02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_Kitchentable001.glb', name: '台面',modelName: 'BP_K_Kitchentable002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_2sofa.glb', name: '2人沙发',modelName: 'BP_L_2sofa', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_2Sofa03.glb', name: '2人沙发03',modelName: 'BP_L_2Sofa03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_caozuotai001.glb', name: '操作台01',modelName: 'BP_K_caozuotai001', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_caozuotai002.glb', name: '操作台02',modelName: 'BP_K_caozuotai002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_caozuotai03.glb', name: '操作台03',modelName: 'BP_K_caozuotai03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_O_LightIndoorWall.glb', name: '隔墙',modelName: 'BP_O_LightIndoorWall', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable01.glb', name: '茶几01',modelName: 'BP_L_TeaRTable', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children04.gltf', name: '儿童家具04',modelName: 'BP_L_children04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children05.glb', name: '儿童家具05',modelName: 'BP_L_children05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children06.glb', name: '儿童家具06',modelName: 'BP_L_children06', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children07.glb', name: '儿童家具07',modelName: 'BP_L_children07', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_ReadingArea01.gltf', name: '阅读角01',modelName: 'BP_X_ReadingArea01', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_OpenShower01.gltf', name: '开敞侧淋浴间',modelName: 'BP_T_OpenShower01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_OpenShower02.glb', name: '开敞侧淋浴间02',modelName: 'BP_T_OpenShower02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_OpenShower03.glb', name: '开敞侧淋浴间03',modelName: 'BP_T_OpenShower03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_matong.gltf', name: '马桶',modelName: 'BP_T_matong', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_1PeopleBasin01.glb', name: '1人台盆01',modelName: 'BP_T_1PeopleBasin01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_1PeopleBasin03.glb', name: '1人台盆03',modelName: 'BP_T_1PeopleBasin03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_flue001.glb', name: '水井管道01',modelName: 'BP_T_flue001', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_Locker01.glb', name: '储物柜01',modelName: 'BP_T_Locker01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxArea01.gltf', name: '休闲角01',modelName: 'BP_X_RelaxArea01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxArea02.gltf', name: '休闲角02',modelName: 'BP_X_RelaxArea02', type:1},
+
+
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_FlowerTerrace01_LongSide_0.3M.gltf', name: '长边花坛0.3M-长边位',modelName: 'BP_G_LongSide03M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_FlowerTerrace_Corner_0.3M.gltf', name: '长边花坛0.3M-转角位',modelName: 'BP_G_Corner03M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_FlowerTerrace_1.5M1.2M.gltf', name: '矩形花坛1.5M*1.2M',modelName: 'BP_G_1512M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_FitnessArea01.gltf', name: '健身区',modelName: 'BP_G_FitnessArea01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_SunChairs01.gltf', name: '太阳椅',modelName: 'BP_G_SunChairs01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_3.9M.glb', name: '关闭落地窗-3.9M',modelName: 'BP_AutoWall_39M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_5.1M.glb', name: '关闭落地窗-5.1M',modelName: 'BP_AutoWall_51M', type:1},
+
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_6.3M.glb', name: '关闭落地窗-6.3M',modelName: 'BP_AutoWall_63M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_FoldingInternalDoor_1.95M.glb', name: '户内折叠门',modelName: 'BP_AutoWall_195M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_OpenInternalDoor_0.8M.glb', name: '关闭户内门-0.8M',modelName: 'BP_AutoWallr_08M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree00.glb', name: '大树',modelName: 'BP_G_tree00', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree01.glb', name: '中树',modelName: 'BP_G_tree01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree02.glb', name: '小树',modelName: 'BP_G_tree02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree03.glb', name: '最小树',modelName: 'BP_G_tree03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre01.gltf', name: '9格花坛',modelName: 'BP_G_parterre01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre03.gltf', name: '三角花坛',modelName: 'BP_G_parterre03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre04.gltf', name: '矩形花坛',modelName: 'BP_G_parterre04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre02.gltf', name: '内凹花坛',modelName: 'BP_G_parterre02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre07.gltf', name: '双条花坛',modelName: 'BP_G_parterre07', type:1},
+
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_PartyTable01.gltf', name: '聚会长桌',modelName: 'BP_X_PartyTable01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_PoolTable01.gltf', name: '台球桌01',modelName: 'BP_X_PoolTable01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_weiqi01.gltf', name: '带伞棋坛',modelName: 'BP_G_weiqi01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair01_One.glb', name: '单独休闲椅01',modelName: 'BP_X_RelaxChair01_One', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair02_One.gltf', name: '单独休闲椅02',modelName: 'BP_X_RelaxChair02_One', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair03_One.gltf', name: '单独休闲椅03',modelName: 'BP_X_RelaxChair03_One', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_swimmingpool01.gltf', name: '泳池01',modelName: 'BP_X_swimmingpool01', type:1},
+
+	
+	// {url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles01.gltf', name: '地砖01',modelName: 'BP_G_tiles01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles02.gltf', name: '地砖02',modelName: 'BP_G_tiles02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles03.gltf', name: '地砖03',modelName: 'BP_G_tiles03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles04.gltf', name: '地砖04',modelName: 'BP_G_tiles04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles05.gltf', name: '地砖05',modelName: 'BP_G_tiles05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles06.gltf', name: '地砖06',modelName: 'BP_G_tiles06', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles07.gltf', name: '地砖07',modelName: 'BP_G_tiles07', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles08.gltf', name: '地砖08',modelName: 'BP_G_tiles08', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles09.gltf', name: '地砖09',modelName: 'BP_G_tiles09', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles10.gltf', name: '地砖10',modelName: 'BP_G_tiles10', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles11.gltf', name: '地砖11',modelName: 'BP_G_tiles11', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles12.gltf', name: '地砖12',modelName: 'BP_G_tiles12', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tiles13.gltf', name: '地砖13',modelName: 'BP_G_tiles13', type:1},
+
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_OutdoorBar01.gltf', name: '户外酒吧台',modelName: 'BP_X_OutdoorBar01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinnerChair_red.glb', name: '单人餐椅01',modelName: 'BP_D_DinnerChair01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningChiar01_90Degree.glb', name: '餐椅01_90度',modelName: 'BP_D_DinningChiar01_90Degree', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningChiar01_60Degree.glb', name: '餐椅01_60度',modelName: 'BP_D_DinningChiar01_60Degree', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningChiar01_30Degree.glb', name: '餐椅01_30度',modelName: 'BP_D_DinningChiar01_30Degree', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_LongDiningTable_240CM.glb', name: '2.4M长餐桌',modelName: 'BP_D_LongDiningTable_240CM', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DiningDecoration01.glb', name: '桌面饰品01',modelName: 'BP_D_DiningDecoration01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration03.glb', name: '餐桌装饰03',modelName: 'BP_D_DinningDecration03', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration02_30D.glb', name: '餐桌饰品02_30度',modelName: 'BP_D_DinningDecration02_30D', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration02_60D.glb', name: '餐桌饰品02_60度',modelName: 'BP_D_DinningDecration02_60D', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration02_90D.glb', name: '餐桌饰品02_90度',modelName: 'BP_D_DinningDecration02_90D', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable02.glb', name: '茶几02',modelName: 'BP_L_TeaTable02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable03.glb', name: '茶几03',modelName: 'BP_L_Teatable03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable04.glb', name: '茶几04',modelName: 'BP_L_TeaTable04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable05.glb', name: '茶几05',modelName: 'BP_L_TeaTable05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_xiaobazhauo.glb', name: '小吧桌',modelName: 'BP_D_xiaobazhauo', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_carpet01.glb', name: '地毯01',modelName: 'BP_L_carpet01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_2Sofa01.glb', name: '双人沙发01',modelName: 'BP_L_2Sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_2Sofa02.glb', name: '双人沙发02',modelName: 'BP_L_2Sofa02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_1Sofa01.glb', name: '单人沙发01',modelName: 'BP_L_1Sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_1Sofa02.glb', name: '单人沙发02',modelName: 'BP_L_1Sofa02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_1Sofa03.glb', name: '单人沙发03',modelName: 'BP_L_1Sofa03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_backsofa01.glb', name: '单人沙发03',modelName: 'BP_L_backsofa01', type:1},
+	
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxTable01.gltf', name: '单独休闲桌01',modelName: 'BP_X_RelaxTable01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_pillow01.glb', name: '枕头',modelName: 'BP_B_pillow01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_sofa_with_toy_A.glb', name: 'xxx',modelName: 'BP_sofa_with_toy_A', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_sofa_with_toy_B.glb', name: 'xxx',modelName: 'BP_sofa_with_toy_B', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_XSPACE_deng_01.glb', name: '吊顶灯',modelName: 'BP_XSPACE_deng_01', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_CeilingLamp_01.glb', name: '吊灯01',modelName: 'BP_L_CeilingLamp_01', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_FloorLamp01.glb', name: '地灯05',modelName: 'BP_L_FloorLamp01', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_CeilingLamp_02.glb', name: '吊灯02',modelName: 'BP_L_CeilingLamp_02', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_grass01.glb', name: '草地',modelName: 'BP_G_grass01', type:1},
+];
+
+module.exports = layoutModel;

src/static/layoutModelData.js

@@ -1,79 +1,84 @@
 var layoutModel = [
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_Mbed.glb', name: '1.5m床',modelName: 'BP_B_Mbed01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_smallcabinet.glb', name: '床头柜',modelName: 'BP_B_smallcabinet01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_Mbed.glb', name: '1.5m床',modelName: 'BP_B_Mbed01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_smallcabinet.glb', name: '床头柜',modelName: 'BP_B_smallcabinet01', type:1},
 	// {url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_195M_C.gltf', name: '1.95m',modelName: 'BP_AutoWall_195M_C', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_bigbed.glb', name: '1.8m床',modelName: 'BP_B_bigbed01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_smallbed.glb', name: '1.2m床',modelName: 'BP_B_smallbed01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_verysmallbed.glb', name: '0.9m床',modelName: 'BP_B_verysmallbed', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_bigbed.glb', name: '1.8m床',modelName: 'BP_B_bigbed01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_smallbed.glb', name: '1.2m床',modelName: 'BP_B_smallbed01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_verysmallbed.glb', name: '0.9m床',modelName: 'BP_B_verysmallbed', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_31sofa.gltf', name: '4人沙发',modelName: 'BP_L_31sofa01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_31TV.glb', name: '电视墙',modelName: 'BP_L_31TV01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_4people_square.glb', name: '4人方桌',modelName: 'BP_D_4people_square', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_yigui.glb', name: '衣柜',modelName: 'BP_B_yigui01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_31TV.glb', name: '电视墙',modelName: 'BP_L_31TV01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_4people_square.glb', name: '4人方桌',modelName: 'BP_D_4people_square', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_yigui.glb', name: '衣柜',modelName: 'BP_B_yigui01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_311sofa01.gltf', name: '5人沙发',modelName: 'BP_L_311sofa01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_321sofa.gltf', name: '6人沙发',modelName: 'BP_L_321sofa01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_2people_square.gltf', name: '2人方桌',modelName: 'BP_D_2people_square', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_6people_long.gltf', name: '6人长桌',modelName: 'BP_D_6people_long01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_6people_long.gltf', name: '6人长桌',modelName: 'BP_D_6people_long01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_8people_long.gltf', name: '8人长桌',modelName: 'BP_D_8people_long', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_12people_round1.gltf', name: '12人圆桌',modelName: 'BP_D_12people_round', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_penzai01.glb', name: '盆栽',modelName: 'BP_B_penzai02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_RoundTable01.glb', name: '12人圆桌',modelName: 'BP_D_12people_round', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_penzai01.glb', name: '盆栽',modelName: 'BP_B_penzai02', type:1},
 
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_backsofa01.gltf', name: '靠背沙发01',modelName: 'BP_D_backsofa01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_facesofa01.gltf', name: '对坐沙发01',modelName: 'BP_D_facesofa01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_O_painting01.gltf', name: '挂画装饰',modelName: 'BP_DLBT_painting01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_painting01.glb', name: '挂画01',modelName: 'BP_B_painting01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_painting02.glb', name: '挂画02',modelName: 'BP_B_painting02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_bookshelf01.glb', name: '大书架01',modelName: 'BP_L_bookshelf01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_bookshelf02.glb', name: '大书架02',modelName: 'BP_L_bookshelf02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_book01.glb', name: '小书架',modelName: 'BP_L_book01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_dinetable01.gltf', name: '大展架01',modelName: 'BP_L_exhibition01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_Exhibition02.glb', name: '大展架02',modelName: 'BP_L_exhibition02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_painting01.glb', name: '挂画01',modelName: 'BP_B_painting01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_painting02.glb', name: '挂画02',modelName: 'BP_B_painting02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_XSPACE_painting_05.glb', name: '挂画5',modelName: 'BP_XSPACE_painting_05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_bookshelf01.glb', name: '大书架01',modelName: 'BP_L_bookshelf01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_bookshelf02.glb', name: '大书架02',modelName: 'BP_L_bookshelf02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_book01.glb', name: '小书架',modelName: 'BP_L_book01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_dinetable01.gltf', name: '大展架01',modelName: 'BP_L_exhibition01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_Exhibition02.glb', name: '大展架02',modelName: 'BP_L_exhibition02', type:1},
 	
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition04.gltf', name: '4m展架',modelName: 'BP_L_exhibition04', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition05.gltf', name: '5m展架',modelName: 'BP_L_exhibition05', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition06.gltf', name: '6m展架',modelName: 'BP_L_exhibition06', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_exhibition07.gltf', name: '7m展架',modelName: 'BP_L_exhibition07', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_21sofa.glb', name: '3人沙发',modelName: 'BP_L_21sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_21sofa.glb', name: '3人沙发',modelName: 'BP_L_21sofa01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_facesofa02.gltf', name: '对坐沙发02',modelName: 'BP_D_facesofa02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe01.glb', name: '1m衣柜',modelName: 'BP_B_wardrobe01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe02.glb', name: '2m衣柜',modelName: 'BP_B_wardrobe02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe03.glb', name: '3m衣柜',modelName: 'BP_B_wardrobe03', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_wardrobe04.glb', name: '4m衣柜',modelName: 'BP_B_wardrobe04', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_dresser01.glb', name: '梳妆台01',modelName: 'BP_B_dresser01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_bathtub01.glb', name: '浴缸01',modelName: 'BP_T_bathtub01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_wardrobe01.glb', name: '1m衣柜',modelName: 'BP_B_wardrobe01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_wardrobe02.glb', name: '2m衣柜',modelName: 'BP_B_wardrobe02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_wardrobe03.glb', name: '3m衣柜',modelName: 'BP_B_wardrobe03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_wardrobe04.glb', name: '4m衣柜',modelName: 'BP_B_wardrobe04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_dresser01.glb', name: '梳妆台01',modelName: 'BP_B_dresser01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_bathtub01.glb', name: '浴缸01',modelName: 'BP_T_bathtub01', type:1},
 	
 	
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_table01.glb', name: '1m写字台',modelName: 'BP_B_table01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_stairs01.gltf', name: '楼梯01',modelName: 'BP_T_stairs01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_table01.glb', name: '1m写字台',modelName: 'BP_B_table01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_stairs01.glb', name: '楼梯01',modelName: 'BP_T_stairs01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children01.gltf', name: '儿童家具01',modelName: 'BP_L_children01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children02.gltf', name: '儿童家具02',modelName: 'BP_L_children02', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children03.gltf', name: '儿童家具03',modelName: 'BP_L_children03', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_2PeopleBasin01.glb', name: '2人台盆01',modelName: 'BP_T_2PeopleBasin01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_2PeopleBasin02.glb', name: '2人台盆02',modelName: 'BP_T_2PeopleBasin02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_flue001.glb', name: '烟道',modelName: 'BP_K_flue002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_2PeopleBasin01.glb', name: '2人台盆01',modelName: 'BP_T_2PeopleBasin01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_2PeopleBasin02.glb', name: '2人台盆02',modelName: 'BP_T_2PeopleBasin02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_flue001.glb', name: '烟道',modelName: 'BP_K_flue002', type:1},
 
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_cookerhood2.glb', name: '灶台',modelName: 'BP_K_cookerhood02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_icebox_2door001.glb', name: '冰箱',modelName: 'BP_K_icebox_2door002', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_shuipen01.glb', name: '水盆01',modelName: 'BP_K_shuipen01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_shuipen02.glb', name: '水盆02',modelName: 'BP_K_shuipen02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_Kitchentable001.glb', name: '台面',modelName: 'BP_K_Kitchentable002', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_2sofa.glb', name: '2人沙发',modelName: 'BP_L_2sofa', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_caozuotai01.glb', name: '操作台01',modelName: 'BP_K_caozuotai001', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_caozuotai02.glb', name: '操作台02',modelName: 'BP_K_caozuotai002', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_K_caozuotai03.glb', name: '操作台03',modelName: 'BP_K_caozuotai03', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_O_LightIndoorWall.gltf', name: '隔墙',modelName: 'BP_O_LightIndoorWall', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable01.glb', name: '茶几01',modelName: 'BP_L_TeaRTable', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_cookerhood2.glb', name: '灶台2',modelName: 'BP_K_cookerhood02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_cookerhood3.glb', name: '灶台3',modelName: 'BP_K_cookerhood3', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_icebox_2door001.glb', name: '冰箱',modelName: 'BP_K_icebox_2door002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_shuipen01.glb', name: '水盆01',modelName: 'BP_K_shuipen01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_shuipen02.glb', name: '水盆02',modelName: 'BP_K_shuipen02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_Kitchentable001.glb', name: '台面',modelName: 'BP_K_Kitchentable002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_2sofa.glb', name: '2人沙发',modelName: 'BP_L_2sofa', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_2Sofa03.glb', name: '2人沙发03',modelName: 'BP_L_2Sofa03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_caozuotai001.glb', name: '操作台01',modelName: 'BP_K_caozuotai001', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_caozuotai002.glb', name: '操作台02',modelName: 'BP_K_caozuotai002', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_K_caozuotai03.glb', name: '操作台03',modelName: 'BP_K_caozuotai03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_O_LightIndoorWall.glb', name: '隔墙',modelName: 'BP_O_LightIndoorWall', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_TeaTable01.glb', name: '茶几01',modelName: 'BP_L_TeaRTable', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_children04.gltf', name: '儿童家具04',modelName: 'BP_L_children04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_children05.glb', name: '儿童家具05',modelName: 'BP_L_children05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_children06.glb', name: '儿童家具06',modelName: 'BP_L_children06', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_children07.glb', name: '儿童家具07',modelName: 'BP_L_children07', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_ReadingArea01.gltf', name: '阅读角01',modelName: 'BP_X_ReadingArea01', type:1},
-
-
-
 	
-	// {url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_OpenShower01.glb', name: '开敞侧淋浴间',modelName: 'BP_T_OpenShower01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_OpenShower01.gltf', name: '开敞侧淋浴间',modelName: 'BP_T_OpenShower01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_OpenShower02.glb', name: '开敞侧淋浴间02',modelName: 'BP_T_OpenShower02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_OpenShower03.glb', name: '开敞侧淋浴间03',modelName: 'BP_T_OpenShower03', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_matong.gltf', name: '马桶',modelName: 'BP_T_matong', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_1PeopleBasin01.glb', name: '1人台盆01',modelName: 'BP_T_1PeopleBasin01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_flue001.glb', name: '水井管道01',modelName: 'BP_T_flue001', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_T_Locker01.glb', name: '储物柜01',modelName: 'BP_T_Locker01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_1PeopleBasin01.glb', name: '1人台盆01',modelName: 'BP_T_1PeopleBasin01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_1PeopleBasin03.glb', name: '1人台盆03',modelName: 'BP_T_1PeopleBasin03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_flue001.glb', name: '水井管道01',modelName: 'BP_T_flue001', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_T_Locker01.glb', name: '储物柜01',modelName: 'BP_T_Locker01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxArea01.gltf', name: '休闲角01',modelName: 'BP_X_RelaxArea01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxArea02.gltf', name: '休闲角02',modelName: 'BP_X_RelaxArea02', type:1},
 
@@ -83,17 +88,16 @@ var layoutModel = [
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_FlowerTerrace_1.5M1.2M.gltf', name: '矩形花坛1.5M*1.2M',modelName: 'BP_G_1512M', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_FitnessArea01.gltf', name: '健身区',modelName: 'BP_G_FitnessArea01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_SunChairs01.gltf', name: '太阳椅',modelName: 'BP_G_SunChairs01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_3.9M.gltf', name: '关闭落地窗-3.9M',modelName: 'BP_AutoWall_39M', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_5.1M.gltf', name: '关闭落地窗-5.1M',modelName: 'BP_AutoWall_51M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_AutoWall_CLosedFrenchWindow_3.9M.glb', name: '关闭落地窗-3.9M',modelName: 'BP_AutoWall_39M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_AutoWall_CLosedFrenchWindow_5.1M.glb', name: '关闭落地窗-5.1M',modelName: 'BP_AutoWall_51M', type:1},
 
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_6.3M.gltf', name: '关闭落地窗-6.3M',modelName: 'BP_AutoWall_63M', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFrenchWindow_6.9M.gltf', name: '关闭落地窗-6.9M',modelName: 'BP_AutoWall_69M', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_FoldingInternalDoor_1.95M.gltf', name: '户内折叠门',modelName: 'BP_AutoWall_195M', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_OpenInternalDoor_0.8M.glt', name: '关闭户内门-0.8M',modelName: 'BP_AutoWallr_08M', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree00.glb', name: '大树',modelName: 'BP_G_tree00', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree01.glb', name: '中树',modelName: 'BP_G_tree01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree02.glb', name: '小树',modelName: 'BP_G_tree02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_tree02.glb', name: '最小树',modelName: 'BP_G_tree03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_AutoWall_CLosedFrenchWindow_6.3M.glb', name: '关闭落地窗-6.3M',modelName: 'BP_AutoWall_63M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_AutoWall_FoldingInternalDoor_1.95M.glb', name: '户内折叠门',modelName: 'BP_AutoWall_195M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_AutoWall_OpenInternalDoor_0.8M.glb', name: '关闭户内门-0.8M',modelName: 'BP_AutoWallr_08M', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_G_tree00.glb', name: '大树',modelName: 'BP_G_tree00', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_G_tree01.glb', name: '中树',modelName: 'BP_G_tree01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_G_tree02.glb', name: '小树',modelName: 'BP_G_tree02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_G_tree03.glb', name: '最小树',modelName: 'BP_G_tree03', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre01.gltf', name: '9格花坛',modelName: 'BP_G_parterre01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre03.gltf', name: '三角花坛',modelName: 'BP_G_parterre03', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_parterre04.gltf', name: '矩形花坛',modelName: 'BP_G_parterre04', type:1},
@@ -103,7 +107,7 @@ var layoutModel = [
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_PartyTable01.gltf', name: '聚会长桌',modelName: 'BP_X_PartyTable01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_PoolTable01.gltf', name: '台球桌01',modelName: 'BP_X_PoolTable01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_weiqi01.gltf', name: '带伞棋坛',modelName: 'BP_G_weiqi01', type:1},
-	// {url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair01_One.glb', name: '单独休闲椅01',modelName: 'BP_X_RelaxChair01_One', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair01_One.glb', name: '单独休闲椅01',modelName: 'BP_X_RelaxChair01_One', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair02_One.gltf', name: '单独休闲椅02',modelName: 'BP_X_RelaxChair02_One', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxChair03_One.gltf', name: '单独休闲椅03',modelName: 'BP_X_RelaxChair03_One', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_swimmingpool01.gltf', name: '泳池01',modelName: 'BP_X_swimmingpool01', type:1},
@@ -125,19 +129,42 @@ var layoutModel = [
 
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_OutdoorBar01.gltf', name: '户外酒吧台',modelName: 'BP_X_OutdoorBar01', type:1},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinnerChair_red.glb', name: '单人餐椅01',modelName: 'BP_D_DinnerChair01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_LongDiningTable_240CM.glb', name: '2.4M长餐桌',modelName: 'BP_D_LongDiningTable_240CM', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DiningDecration01.glb', name: '桌面饰品01',modelName: 'BP_D_DiningDecoration01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable02.glb', name: '茶几02',modelName: 'BP_L_TeaTable02', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_TeaTable03.glb', name: '茶几03',modelName: 'BP_L_Teatable03', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_carpet01.glb', name: '地毯01',modelName: 'BP_L_carpet01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_2Sofa01.glb', name: '双人沙发',modelName: 'BP_L_2Sofa01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_L_1Sofa01.glb', name: '单人沙发',modelName: 'BP_L_1Sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_DinningChiar01_90Degree.glb', name: '餐椅01_90度',modelName: 'BP_D_DinningChiar01_90Degree', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_DinningChiar01_60Degree.glb', name: '餐椅01_60度',modelName: 'BP_D_DinningChiar01_60Degree', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_DinningChiar01_30Degree.glb', name: '餐椅01_30度',modelName: 'BP_D_DinningChiar01_30Degree', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_LongDiningTable_240CM.glb', name: '2.4M长餐桌',modelName: 'BP_D_LongDiningTable_240CM', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_DiningDecoration01.glb', name: '桌面饰品01',modelName: 'BP_D_DiningDecoration01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_DinningDecration03.glb', name: '餐桌装饰03',modelName: 'BP_D_DinningDecration03', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration02_30D.glb', name: '餐桌饰品02_30度',modelName: 'BP_D_DinningDecration02_30D', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration02_60D.glb', name: '餐桌饰品02_60度',modelName: 'BP_D_DinningDecration02_60D', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_D_DinningDecration02_90D.glb', name: '餐桌饰品02_90度',modelName: 'BP_D_DinningDecration02_90D', type:1},
+	
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_TeaTable02.glb', name: '茶几02',modelName: 'BP_L_TeaTable02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_TeaTable03.glb', name: '茶几03',modelName: 'BP_L_Teatable03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_TeaTable04.glb', name: '茶几04',modelName: 'BP_L_TeaTable04', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_TeaTable05.glb', name: '茶几05',modelName: 'BP_L_TeaTable05', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_D_xiaobazhauo.glb', name: '小吧桌',modelName: 'BP_D_xiaobazhauo', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_carpet01.glb', name: '地毯01',modelName: 'BP_L_carpet01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_2Sofa01.glb', name: '双人沙发01',modelName: 'BP_L_2Sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_2Sofa02.glb', name: '双人沙发02',modelName: 'BP_L_2Sofa02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_1Sofa01.glb', name: '单人沙发01',modelName: 'BP_L_1Sofa01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_1Sofa02.glb', name: '单人沙发02',modelName: 'BP_L_1Sofa02', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_1Sofa03.glb', name: '单人沙发03',modelName: 'BP_L_1Sofa03', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_backsofa01.glb', name: '单人沙发03',modelName: 'BP_L_backsofa01', type:1},
 	
 	
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_X_RelaxTable01.gltf', name: '单独休闲桌01',modelName: 'BP_X_RelaxTable01', type:1},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_B_pillow01.glb', name: '枕头',modelName: 'BP_B_pillow01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_B_pillow01.glb', name: '枕头',modelName: 'BP_B_pillow01', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_sofa_with_toy_A.glb', name: 'xxx',modelName: 'BP_sofa_with_toy_A', type:1},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_sofa_with_toy_B.glb', name: 'xxx',modelName: 'BP_sofa_with_toy_B', type:1},
 	
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_XSPACE_deng_01.glb', name: '吊顶灯',modelName: 'BP_XSPACE_deng_01', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_CeilingLamp_01.glb', name: '吊灯01',modelName: 'BP_L_CeilingLamp_01', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_FloorLamp01.glb', name: '地灯05',modelName: 'BP_L_FloorLamp01', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/dracomodel/BP_L_CeilingLamp_02.glb', name: '吊灯02',modelName: 'BP_L_CeilingLamp_02', type:2},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_G_grass01.glb', name: '草地',modelName: 'BP_G_grass01', type:1},
 ];
 
 module.exports = layoutModel;

src/static/wallData.js

@@ -10,7 +10,7 @@ var wallType = [
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedEntranceDoor_0.9M.glb', name: '关闭入户门-0.9M',type:4, width:90, group:2, level:0, total:1},
 	
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFoldingWindow_0.6M.glb', name: '关闭折叠窗-0.6M',type:2, width:60, group:3, level:0, total:5},
-	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFoldingWindow_1.2M__1_.glb', name: '关闭折叠窗-1.2M',type:5, width:120, group:3, level:1, total:5},
+	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFoldingWindow_1.2M.glb', name: '关闭折叠窗-1.2M',type:5, width:120, group:3, level:1, total:5},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFoldingWindow_2.4M.glb', name: '关闭折叠窗-2.4M',type:8, width:240, group:3, level:2, total:5},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFoldingWindow_2.7M.glb', name: '关闭折叠窗-2.7M',type:9, width:270, group:3, level:3, total:5},
 	{url: 'https://dm.static.elab-plus.com/miniProgram/model/BP_AutoWall_CLosedFoldingWindow_3.6M.glb', name: '关闭折叠窗-3.6M',type:10, width:360, group:3, level:4, total:5},

src/store/actions.js

@@ -29,6 +29,16 @@ const actions = {
 	}, aiData) {
 		commit('SET_AIDATA', aiData)
 	},
+	setWallList({
+		commit
+	}, wallList) {
+		commit('SET_WALLLIST', wallList)
+	},
+	setHouseId({
+		commit
+	}, houseId) {
+		commit('SET_HOUSEID', houseId)
+	},
 	// setCityListData({
 	// 	commit
 	// }, cityListData) {

src/store/mutations.js

@@ -14,8 +14,14 @@ const mutations = {
 	SET_USERID(state, userId) {
 		state.userId = userId
 	},
+	SET_HOUSEID(state, houseId) {
+		state.houseId = houseId
+	},
 	SET_AIDATA(state, aiData) {
 		state.aiData = aiData
 	},
+	SET_WALLLIST(state, wallList) {
+		state.wallList = wallList
+	},
 }
 export default mutations;

src/store/state.js

@@ -4,7 +4,9 @@ const state = {
 	loadingMsg:"",
 	account:null,	//账号
 	userId:'',	//用户id-小程序当中提供的
+	houseId:'',	//项目id-小程序当中提供的
 	curHouseObj:null,
+	wallList:null,	//墙体数据
 	aiData:null,	//AI生成的数据
 }
 export default state

src/utils/command.js

@@ -1,165 +0,0 @@
-import Vue from 'vue';
-//
-// /**
-//  *  自定义指令
-//  */
-Vue.directive('title2',function (el, binding, vcode) {
-    el.title = el.innerText;
-})
-
-Vue.directive('title', {
-    // 钩子函数，被绑定元素插入父节点时调用 (父节点存在即可调用，不必存在于 document 中)。
-    inserted(el,binding,vcode){
-        el.focus()
-        el.title = el.innerText;
-        // console.log( 'inserted',el,binding,vcode );
-    },
-    // 只调用一次，指令第一次绑定到元素时调用，用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。
-    bind(el,binding,vcode){
-        // el.title = el.innerText;
-        // console.log(el,binding,vcode);
-        // console.log( 'bind',el,binding,vcode );
-    },
-    // 所在组件的 VNode 更新时调用，但是可能发生在其孩子的 VNode 更新之前。
-    // 指令的值可能发生了改变也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新
-    update(el,binding,vcode){
-        // el.title = window.$(el).get(0).innerText;
-        // console.log( 'update',window.$(el), el,binding,vcode );
-    },
-    // 所在组件的 VNode 及其孩子的 VNode 全部更新时调用。
-    componentUpdated( el,binding,vcode ){
-        el.title = el.innerText;
-        // console.log( 'componentUpdated',el,binding,vcode  );
-    },
-    // 只调用一次，指令与元素解绑时调用。
-    unbind(){
-        console.log( 'unbind' );
-    }
-})
-
-/**
- * 当输入框获取到焦点时，
- * 为 show-focus 类 所在dom ，添加边框颜色类 el-focus
- * v-focus 指令必须和show-focus配合使用  否则无效
- */
-Vue.directive('focus',function (el, binding, vcode) {
-    let mtinputList = el.querySelectorAll('input')
-    if(!mtinputList){
-        mtinputList = el.querySelectorAll('textarea')
-    }
-    let mtinput = null;
-    if(!binding.value){
-        mtinput = mtinputList[0]
-
-        mtinput.onfocus = function () {
-            let dom = window.$(el).parents('.show-focus');
-            if(dom.length < 1){
-                window.$(mtinput).addClass('el-focus')
-            }else{
-                dom.addClass('el-focus');
-            }
-        }
-        mtinput.onblur = function () {
-            let dom = window.$(el).parents('.show-focus');
-            if(dom.length < 1){
-                window.$(mtinput).removeClass('el-focus')
-            }else{
-                dom.removeClass('el-focus');
-            }
-        }
-
-    }else{
-        for (let i=0; i < Number(binding.value) ; i++){
-            mtinput = mtinputList[i]
-            mtinput.onfocus = function () {
-                let dom = window.$(el).parents('.show-focus');
-                dom.addClass('el-focus');
-            }
-            mtinput.onblur = function () {
-                let dom = window.$(el).parents('.show-focus');
-                dom.removeClass('el-focus');
-            }
-        }
-    }
-
-})
-
-/**
- * 输入汉字为两个字符，英文为1个字符
- */
-Vue.directive('limitChineseMaxlength',{
-    // 钩子函数，被绑定元素插入父节点时调用 (父节点存在即可调用，不必存在于 document 中)。
-    inserted(el,binding,vcode){
-        limitCharsFun(el,binding,vcode);
-    },
-    // 只调用一次，指令第一次绑定到元素时调用，用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。
-    bind(el,binding,vcode){
-        limitCharsFun(el,binding,vcode);
-    },
-    // 所在组件的 VNode 更新时调用，但是可能发生在其孩子的 VNode 更新之前。
-    // 指令的值可能发生了改变也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新
-    update(el,binding,vcode){
-    },
-    // 所在组件的 VNode 及其孩子的 VNode 全部更新时调用。
-    componentUpdated( el,binding,vcode ){
-        limitCharsFun(el,binding,vcode);
-    },
-    // 只调用一次，指令与元素解绑时调用。
-    unbind(){
-    }
-})
-const limitCharsFun = function (el,binding,vcode){
-    window.$(el).removeClass('is-exceed')
-    let element = el.querySelector('.el-input__count-inner');
-    let mtinputList = el.querySelectorAll('input')
-    if(!mtinputList){
-        mtinputList = el.querySelectorAll('textarea')
-    }
-    let mtinput = null;
-    mtinput = mtinputList[0]
-    let maxLength = vcode.data.attrs.maxlength;
-    if (!maxLength){
-        maxLength = 60;
-    }
-    mtinput.setAttribute('maxlength',maxLength*2)
-    // mtinput.setAttribute("style","border-color:var(--themeColor9_5)")
-    if (element){
-        element.setAttribute('style',"color:#909399")
-    }
-    let inputValue = mtinput.value || vcode.data.model.value;
-    if (common.wordLengthFilter(inputValue)> maxLength){
-        if (common.byteLengthFilter(inputValue)>maxLength * 2){
-            mtinput.value =  common.subinput(inputValue,maxLength*2);
-        }else{
-            mtinput.value =  common.subinput(inputValue,common.byteLengthFilter(inputValue));
-        }
-        mtinput.dispatchEvent(new Event("input"));//调用input事件使vue v-model绑定更新,下面相同
-    }
-    let innerText = inputValue;
-    if (element){
-        element.innerHTML = common.wordLengthFilter(innerText)+'/'+maxLength
-    }
-
-};
-
-/**
- *图片高度根据宽高比例自适应
- */
-Vue.directive('proportion', {
-    inserted: function (el, binding) {
-        var w = el.offsetWidth;
-        var h = w * binding.value;
-        el.style.height = h + 'px';
-        el.__resize = function () { update(el, binding); }
-        window.addEventListener('resize', el.__resize);
-    },
-
-    componentUpdated: function (el, binding) {
-        update(el, binding);
-    },
-
-    unbind: function (el) {
-        window.removeEventListener('resize', el.__resize);
-    }
-});
-

src/utils/common.js

@@ -1,6 +1,5 @@
 import store from "@/store";
 import axios from 'axios';
-import router from "@/router";
 import {getStorage,setStorage} from "@/utils/localStorage";
 import '@/services/requestConfig.js'; //导入请求的拦截器
 // import emojiConfig from '@/components/emojiComponent/lib/js/config'
@@ -80,42 +79,6 @@ const common = {
 		console.warn("***account-userAccountChange0***",_account,project,uid);
 		this.userAccountChange(project,_account)
 	},
-	//切换账号，同时更新到全局变量中
-	userAccountChange(project,account){
-		if(!account){
-			console.warn("***account-userAccountChange2***",account,project);
-			window.userInfo['userAccount'] = null;//修改当前页面的
-			return false;
-		}
-		switch(account.platform){
-			case 1:
-				account['type'] = 'tencent';
-				account['typeName'] = '腾讯';
-				break;
-			case 2:
-				account['type'] = 'huge';
-				account['typeName'] = '巨量';
-				break;
-			case 3:
-				account['type'] = 'baidu';
-				account['typeName'] = '百度';
-				break;
-			default:
-				break;
-		}
-		// if((_account && account && _account.advertiserId == account.advertiserId) || (account==null && (!_account || !_account.advertiserId))){ //账号相同，则不需要更新
-		// 	console.warn("***账号相同，则不需更新***", _account,account);
-		// }
-		// else{//执行账号切换
-
-		// }
-		account.landId = project.id;//记录下当前选中账号 所属地块-因为不同地块可能有相同账号的情况
-		userInfo['userAccount'] = account;//修改当前页面的当前账号信息
-		// setStorage("userAccount", account);//更新到缓存里面-页面跳转时使用，window对象 不能跨页使用
-		console.warn("***account-userAccountChange1***",account,project);
-		//切换账号则切换路由中的uid
-		// window.mapVue.$router.push({ path: window.mapVue.$route.path, query: { uid: account.advertiserId || '' }})
-	},
 	async getLocationPOI(param) {
 		const res = await requestConfig("locationPOI", param);
 		if (res.success) {

src/utils/interface.js

@@ -1,317 +0,0 @@
-
-/**
- * 打印错误信息
- * @param error: 错误内容
- */
-iError = function (error) {
-    Error.print(error);
-};
-
-/**
- * 注册点击事件
- * @param dom: Dom对象
- * @param handle: 处理函数
- * @param useCapture:冒泡顺序
- */
-iTapEvent = function (dom, handle, useCapture) {
-    dom && dom.addEventListener.call(dom, 'click', handle, useCapture);
-};
-
-/**
- * 取消事件冒泡
- * @param e: 事件对象
- */
-iCancelEvent = function (e) {
-    if (e && e.stopPropagation) {
-        e.stopPropagation();
-    } else {
-        window.event.cancelBubble = true;
-    }
-};
-
-/**
- * 动态创建CSS
- * @param text: CSS内容
- */
-iCreateCss = function (text) {
-    var domStyle = document.querySelector('style');
-    var domText = document.createTextNode(text);
-
-    if (domStyle) {
-        domStyle.appendChild(domText);
-    } else {
-        var domHead = document.head || document.getElementsByTagName('head')[0];
-
-        domStyle = document.createElement('style');
-        domStyle.type = 'text/css';
-
-        domStyle.appendChild(domText);
-        domHead.appendChild(domStyle);
-    }
-};
-
-/**
- * 判断是否为空
- * @param str: 字符串/对象
- * @return 是/否
- */
-iIsEmpty = function (obj) {
-    if (obj instanceof Object) {
-        for (var k in obj) {
-            return false;
-        }
-
-        return true;
-    } else {
-        return (obj == null || obj === '');
-    }
-};
-/**
- * 将JSON对象转换为JSON字符串
- * @param json: JSON对象
- * @return: JSON字符串
- */
-iJson2Str = function (json) {
-    return JSON.stringify(json);
-};
-
-/**
- * 将JSON字符串转换为JSON对象
- * @param str: JSON字符串
- * @return: JSON对象
- */
-iStr2Json = function (str) {
-    return JSON.parse(str);
-};
-
-/**
- * 打印日志
- * @param content: 日志内容
- */
-iLog = console.log.bind(console);
-/**
- * 判断是否微信浏览器
- */
-function isWeixinBrowser() {
-    var agent = navigator.userAgent.toLowerCase();
-    if (agent.match(/MicroMessenger/i) == 'micromessenger') {
-        return true;
-    } else {
-        return false;
-    }
-}
-/**
- * 验证邮箱
- * @param val: 邮箱字符串
- * @return: true(是)/false(否)
- */
-iIsEmail = function (val) {
-    var reg = /^([.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/;
-    return reg.test(val);
-};
-/**
- * 验证是否手机号码
- * @param val: 手机号码字符串
- * @return: true(是)/false(否)
- */
-iIsPhone = function (val) {
-    var reg = /^1[\d]{10}$/;
-    return reg.test(val);
-};
-
-/**
- * 验证密码
- * @param {String} val: 密码字符串
- * @return: {Boolean} true(是)/false(否)
- */
-iIsPwd = function (val) {
-    var reg = /(?!^\d+$)(?!^[a-zA-Z]+$)[0-9a-zA-Z]{6,20}$/;
-    return reg.test(val);
-};
-/**
- * 将数字字符串转换为数字
- * @param str: 原字符串
- * @return: 数字
- */
-iInt = function (str) {
-    return parseInt(str, 10);
-};
-
-/**
- * 将浮点数字符串转换为浮点数
- * @param str: 浮点数字符串
- * @param precision: 精度(默认:2)
- * @return: 浮点数
- */
-iFloat = function (str, precision) {
-    var ret = parseFloat(str);
-
-    if (precision == null) {
-        precision = 2;
-    }
-
-    ret = ret.toFixed(precision);
-    return parseFloat(ret);
-};
-
-/**
- * 将整数格式化为指定位数的字符串
- * @param no: 整数
- * @param len: 位数
- * @return: 新字符串
- */
-iNoStr = function (no, len) {
-    var ret = String(no);
-
-    len -= ret.length;
-
-    if (len > 0) {
-        for (var i = 0; i < len; i++) {
-            ret = '0' + ret;
-        }
-    }
-
-    return ret;
-};
-/**
- * 遍历数组/对象
- * @param obj: 原数组/对象
- * @param callback: 回调函数(v:值,k:对象键字符串/数组索引)
- * @return: 回调函数返回true时的元素值
- */
-iEach = (function () {
-    var _isArrayLike = function (obj) {
-        var length = !!obj && 'length' in obj && obj.length,
-            type = iType(obj);
-
-        if (type === 'function' || obj != null && obj === obj.window) {
-            return false;
-        }
-
-        return type === 'array' || length === 0 ||
-            typeof length === 'number' && length > 0 && (length - 1) in obj;
-    };
-
-    return function (obj, callback) {
-        var k = 0;
-
-        if (!callback) {
-            return null;
-        }
-
-        if (_isArrayLike(obj)) {
-            var len = obj.length;
-
-            for (k = 0; k < len; k++) {
-                if (callback.call(obj[k], obj[k], k)) {
-                    return obj[k];
-                }
-            }
-        } else {
-            for (k in obj) {
-                if (callback.call(obj[k], obj[k], k)) {
-                    return obj[k];
-                }
-            }
-        }
-
-        return null;
-    };
-})();
-
-/**
- * 格式化日期字符串中的-为/
- * @param data: 日期(时间)字符串
- * @return: 新字符串
- */
-iFmtDate = function (data) {
-    return data.replace(/-/g, '/');
-};
-
-/**
- * 将日期时间对象转换为日期字符串
- * @param date: 日期时间对象
- * @param spt: 间隔符(默认:"-")
- * @return: 新字符串
- */
-iDate = function (date, spt) {
-    if (spt == null) {
-        spt = '-';
-    }
-
-    var year = date.getFullYear();
-    var month = date.getMonth() + 1;
-    var day = date.getDate();
-
-    return iNoStr(year, 4) + spt +
-        iNoStr(month, 2) + spt +
-        iNoStr(day, 2);
-};
-
-/**
- * 将日期时间对象转换为时间字符串
- * @param date: 日期时间对象
- * @param spt: 间隔符(默认:":")
- * @return: 新字符串
- */
-iTime = function (date, spt) {
-    if (spt == null) {
-        spt = ':';
-    }
-
-    var hour = date.getHours();
-    var minute = date.getMinutes();
-    var second = date.getSeconds();
-
-    return iNoStr(hour, 2) + spt +
-        iNoStr(minute, 2) + spt +
-        iNoStr(second, 2);
-};
-
-/**
- * 将日期时间对象转换为日期时间字符串
- * @param date: 日期时间对象
- * @param dateSpt: 日期间隔符(默认:"-")
- * @param timeSpt: 时间间隔符(默认:":")
- * @param connSpt: 日期、时间间隔符(默认:" ")
- * @return: 新字符串
- */
-iDateTime = function (date, dateSpt, timeSpt, connSpt) {
-    if (connSpt == null) {
-        connSpt = ' ';
-    }
-    return iDate(date, dateSpt) + connSpt +
-        iTime(date, timeSpt);
-};
-
-/**
- * 将当前日期时间转换为日期字符串
- * @param spt: 日期间隔符(默认:"-")
- * @return: 新字符串
- */
-iCurDate = function (spt) {
-    var date = new Date();
-    return iDate(date, spt);
-};
-
-/**
- * 将当前日期时间转换为时间字符串
- * @param spt: 时间间隔符(默认:":")
- * @return: 新字符串
- */
-iCurTime = function (spt) {
-    var date = new Date();
-    return iTime(date, spt);
-};
-
-/**
- * 将当前日期时间转换为日期时间字符串
- * @param dateSpt: 日期间隔符(默认:"-")
- * @param timeSpt: 时间间隔符(默认:":")
- * @param connSpt: 日期、时间间隔符(默认:" ")
- * @return: 新字符串
- */
-iCurDateTime = function (dateSpt, timeSpt, connSpt) {
-    var date = new Date();
-    return iDateTime(date, dateSpt, timeSpt, connSpt);
-};

src/utils/rem.js

@@ -1,11 +1,15 @@
 (function(){
 	function resize(){
-		var baseFontSize = 1;
+		var baseFontSize = 75;//确保跟config配置文件的remUnit一致
 		var designWidth = 750;
 		// var width = window.innerWidth;
 		var width = window.screen.width;
+		if(window.innerWidth && window.screen.width){
+			width = Math.min(window.innerWidth,window.screen.width)
+		}
 		var currentFontSize = (width/designWidth)*baseFontSize;
-		document.querySelector('html').style.fontSize = currentFontSize+'px';
+		// document.querySelector('html').style.fontSize = currentFontSize+'px';
+		document.documentElement.style.fontSize = currentFontSize+'px';
 	}
 	// 页面大小发生变化时
 	window.onresize = function(){

src/utils/util.js

@@ -1,5 +1,6 @@
 import {
-	getStorage
+	getStorage,
+	setStorage
 } from '@/utils/localStorage';
 window.sessionTime = new Date();
 var util = {
@@ -157,61 +158,70 @@ var util = {
 			return
 		}
 		try {
-			var session = Number(getStorage('sessionNumber')) + 1;
+			
+			if(typeof (para.clkParams) == 'object'){
+			    let obj = {
+			        locusBehaviorName: para.locusBehaviorName ? para.locusBehaviorName : ''
+			    }
+			    para.clkParams = Object.assign(obj,para.clkParams)
+			}
+			
+			let pvCurPageParams = "";//字符串string对象
+			if(para.pvCurPageParams){//调用的时候传递进来的-先转为对象
+				pvCurPageParams = typeof para.pvCurPageParams === 'object' ? para.pvCurPageParams : JSON.parse(para.pvCurPageParams)
+			}else{
+				pvCurPageParams = {};
+			}
+			let queryObj = getStorage('queryObj') ? JSON.parse(getStorage('queryObj')) : null;
+			let urlObj = queryObj || util.getUrlParams(location.href) || {};
+			let brandId = urlObj.special_ID || $config.brandId || ''
+			//在页面参数里面手动添加path参数
+			pvCurPageParams.brandId = brandId;
+			pvCurPageParams.locusBehaviorName = para.locusBehaviorName || currentPage.locusBehaviorName || '';
+			pvCurPageParams.locusValue = para.locusValue || currentPage.locusValue || '';
+			pvCurPageParams.locusName = para.locusName || currentPage.locusName || '';
 			let data = {
 				session: '',
 				userAgent: navigator.userAgent.substring(0, 255) || '',
 				browserName: navigator.appName || '',
 				browserVersion: navigator.appVersion.substring(0, 255) || '',
-				platform: location.href.indexOf("shareSign") > -1 ? 'h5' : 'tfb', //iframeUrl代表是顾问分享的外链
-				fromPlatform: util.getUrlParams(location.href).fromPlatform || util.getUrlParams(location.href)
-					.fromProduce || 'tfb',
-				deviceType: '' || "",
+				platform: 'h5', //iframeUrl代表是顾问分享的外链
+				fromPlatform: urlObj.fromPlatform || urlObj.fromProduce || 'h5',
 				ip: window.ip || '',
 				cookieId: from_cookie || getStorage("cookie_id") || '',
-				openId: util.getUrlParams(location.href).openid,
-				userId: util.getUrlParams(location.href).leavePhoneCustomerId || '',
-				brandUserId: util.getUrlParams(location.href).leavePhoneCustomerId || '',
+				openId: urlObj.openid || '',
+				userId: urlObj.leavePhoneCustomerId || '',
+				brandUserId: urlObj.leavePhoneCustomerId || '',
 				createTime: this.formatTime(new Date()),
 				uploadTime: this.formatTime(new Date()),
-				product: location.href.indexOf("shareSign") > -1 ? 'h5' : 'tfb', //iframeUrl代表是顾问分享的外链
-				project: para.project,
-				brandId: util.getUrlParams(location.href).special_ID || util.getUrlParams(location.href)
-					.brandId || null,
-				// expand:typeof para.expand==='object'?JSON.stringify(para.expand):para.expand,//扩展字段
-				expand: JSON.stringify(util.getUrlParams(location.href)), //扩展字段
+				product: 'h5', //iframeUrl代表是顾问分享的外链
+				project: para.project || urlObj.xcxHouseId || $config.xcxHouseId || '',
+				brandId: brandId,
+				expand: JSON.stringify(urlObj), //扩展字段
 				imTalkId: para.imTalkId || '', //IM对话编号
 				imTalkType: para.imTalkType || '', //IM对话类型
-				eventModuleDes: para.eventModuleDes || '', //模块描述信息
-				eventInnerModuleId: para.eventInnerModuleId || '', //事件内部模块信息
 				eventName: para.eventName || '', //事件名称
-				eventId: para.eventId || '', //埋点ID
-				adviserId: para.adviserId || '', //顾问id
 				clkDesPage: para.clkDesPage || '', //点击前往的页面名称
 				clkId: para.clkId || '', //点击ID
 				clkName: para.clkName || '',
 				pvId: para.pvId || '', //PV埋点ID
-				clkParams: typeof para.clkParams === 'object' ? JSON.stringify(para.clkParams) : para
-				.clkParams, //点击参数
-				pvPageStayTime: para.pvPageStayTime || '',
-				pvCurPageName: para.pvCurPageName || '', //当前页面名称
-				pvCurPageParams: typeof para.pvCurPageParams === 'object' ? JSON.stringify(para
-					.pvCurPageParams) : para.pvCurPageParams ||
-					'', //当前页面参数
+				clkParams: typeof para.clkParams === 'object' ? JSON.stringify(para.clkParams) : (para.clkParams || ''), //点击参数
+				pvCurPageName: para.pvCurPageName || currentPage.pvCurPageName || '', //当前页面名称
+				pvCurPageParams: typeof pvCurPageParams === 'object' ? JSON.stringify(pvCurPageParams) : (pvCurPageParams ||''), //当前页面参数
 				pvLastPageName: para.pvLastPageName || '', //上一页页面名称
 				pvLastPageParams: para.pvLastPageParams || '', //上一页页面参数
 				pvPageLoadTime: para.pvPageLoadTime || '', //加载时间
 				type: para.type || '', //埋点类型
 			}
 			let timeNow = new Date().getTime();
-			if (timeNow - sessionTime > 180000 && !from_session) {
+			let session = getStorage('sessionNumber') ? Number(getStorage('sessionNumber')) : timeNow;
+			if (timeNow - sessionTime > 180000 && !urlObj.session) {
 				// session++;
-				getStorage('sessionNumber', session)
+				session = timeNow;
+				setStorage('sessionNumber', session)
 			}
-			session = Number(getStorage('sessionNumber')) + 1;
-			data.session = from_session || getStorage("cookie_id") + "_" + session || '';
-			sessionTime = timeNow
-			console.log(data.session)
+			data.session = urlObj.session || data.userId + "_" + session || '';
+			sessionTime = timeNow;
 			// return data;
 			// app.globalData.session_id = data.session
 			// app.globalData.sessionTime = timeNow;
@@ -225,7 +235,7 @@ var util = {
 			// 	"\u0000"
 			// ];
 			// app.wsSendOrder(param,data);//socket 消息发送
-			console.warn("***mook***", (data.pvId || data.clkId || data.eventId), data.reserve3)
+			console.warn("***mook***", (data.pvId || data.clkId || data.eventId), data)
 		} catch (e) {
 			console.warn("***util.js-onError***", e);
 		}

vue.config.js

@@ -17,12 +17,22 @@ module.exports = {
 		proxy:{},
 	},
 	chainWebpack: config => {
-		config
-			.plugin('html')
+		config.plugin('html')
 			.tap(args => {
-				args[0].title = "webgl";//定义 HTML 文档的标题
+				args[0].title = "";//定义 HTML 文档的标题
 				args[0].template = 'public/index.html';// webpack模板的地址-相对或绝对路径
 				return args
-			})
+			}).end();
+		config.module
+			.rule('scss')
+			.test(/\.scss$/)
+			.oneOf('vue')
+			.use('px2rem-loader')
+			.loader('px2rem-loader')
+			.before('postcss-loader') // this makes it work.
+			.options({
+				remUnit: 75, //根据视觉稿，rem为px的⼗分之⼀，750px  75rem
+				remPrecision: 4 //保留8位⼩数
+			}).end();
 	}
 }

webgl/index.html

@@ -1,18 +0,0 @@
-<!DOCTYPE html>
-<html lang="">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-	<meta http-equiv="Access-Control-Allow-Origin" content="*">
-    <link rel="icon" href="favicon.ico">
-    <title>webgl</title>
-  <script defer src="static/js/chunk-vendors.js"></script><script defer src="static/js/app.js"></script></head>
-  <body>
-    <noscript>
-      <strong>We're sorry but webgl doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
-</html>