调整布局加载逻辑

src/mixins/loadModel.js

@@ -11,6 +11,10 @@ export default {
 		return {
 			gltfLayouts: [],
 			instancedFurList:[],
+			
+			graderGltfLayouts: [],//花园地块的模型对象
+			graderInstancedFurList:[],//花园地块的模型
+			
 			arrFrunList:[],
 			promise_list:[],
 			dracoLoader:null,
@@ -18,6 +22,7 @@ export default {
 			tmpList:[],
 			realList:[],
 			nextString:'_simple',//精简模型后缀
+			lastFrunList:[],
 		}
 	},
 	watch: {},
@@ -69,20 +74,47 @@ export default {
 			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.gltfLayouts = []; //模型列表，所有空间里面的每个模型(家具)对应一条记录
 			// 通过默认布局
-			this.furnHandle(this.arrFrunList);
+			this.furnHandle(this.arrFrunList,[]);
+		},
+		loadLastSpaceModel(){
+			if(!this.changeSpaces || this.changeSpaces.length==0){
+				return false;
+			}
+			let layoutIds = this.changeSpaces.map(it=>it.layoutId);
+			let list = this.arrFrunList.filter(item=>{
+				return !layoutIds.includes(item.id)
+			})
+			let spaceIds = this.changeSpaces.map(it=>it.spaceId); 
+			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(arrFrunList, spaceObj = null){
-			console.log("bug修复", arrFrunList, spaceObj)
+		furnHandle(arrFrunList, tmpSpaceList=[]){
+			console.log("bug修复", arrFrunList, tmpSpaceList)
 			if(!arrFrunList || arrFrunList.length == 0){
 				return
 			}
 			let startTime = new Date().getTime();
 			let tmpList = [];//临时数据
-			this.gltfLayouts = []; //模型列表，所有空间里面的每个模型(家具)对应一条记录
 			
 			let allowSpaceId = [this.curSpaceObj.spaceId];
 			if(this.type == 2){//全局精简模型;需要的是所有空间的模型
@@ -97,14 +129,7 @@ export default {
 					let list = this.spaceList.filter(it=>it.spaceType==4)
 					allowSpaceId.push(...list.map(it=>it.spaceId));//厨房
 				}
-				//花园类型的添加到家具加载目录里面
-				// this.spaceList.forEach(it=>{
-				// 	if(it.spaceType==14){
-				// 		allowSpaceId.push(it.spaceId);
-				// 	}
-				// })
 			}
-			// allowSpaceId = [388];//模型有警告，需要看下
 			console.warn("重新加载布局", arrFrunList,this.spaceList,this.gltfLayouts,allowSpaceId);
 			arrFrunList.forEach(signel => {
 				let spaceId = this.spaceList.find(it => it.layoutId == signel.id).spaceId;
@@ -117,29 +142,49 @@ export default {
 						item.layoutId = signel.id;
 						item.h5Id = signel.id+""+item.id;//唯一标识
 						if(item.modelName=='BP_furnitureBase_C'){
-							
-							console.warn("***布局1***", item, signel.id)
+							// console.warn("***布局1***", item, signel.id)
 							continue;
 						}else{
 							tmpList.push(item);
-							console.warn("***布局***", item, signel.id)
+							// console.warn("***布局***", item, signel.id)
 						}
 					}
 				}
 			})
+			// 处理删除模型时，其他空间引用了该模型时的重新载入处理
+			// 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.realList.length);
 				tmpList = this.realList;
 			}
 			let realFurArr = this.preFurnitureData(tmpList);//统一处理家具模型
-			if(spaceObj != null){
-				this.calculateLayoutModelSizeBySpace(spaceObj) // 提前计算模型的位置
+			if(tmpSpaceList && tmpSpaceList.length>0){
+				this.calculateLayoutModelSizeBySpace(tmpSpaceList) // 提前计算模型的位置
 			}else{
 				this.calculateLayoutModelSize() // 提前计算模型的位置
 			}
-			
 			console.log("***realFurArr***", realFurArr,this.gltfLayouts);
 			realFurArr && realFurArr.forEach((item,index) => {
 				this.promise_list.push(
@@ -151,6 +196,7 @@ export default {
 			Promise.all(this.promise_list).then(() => {
 				let endTime = new Date().getTime();
 				console.log("家具模型全部加载完成，时间：", endTime - startTime, this.gltfLayouts);
+				this.loadLastSpaceModel();//加载剩余空间的家具模型
 			})
 		},
 		//过滤掉不需要的家具
@@ -207,7 +253,7 @@ export default {
 				// console.log("布局模型名称", modelName);
 				let layoutModel = modelData.find(it => modelName.indexOf(it.modelName) == 0); //模型地址
 				
-				console.log("要加载的模型数据", item.modelName, layoutModel)
+				// console.log("要加载的模型数据", item.modelName, layoutModel)
 				if (layoutModel && layoutModel.url) {//该数据存在模型地址
 					let object = realFurnitureArr.find(it=>it.url==layoutModel.url);
 					//列表中还没有这个数据
@@ -259,6 +305,11 @@ export default {
 			if(realData.name.includes('BP_XSPACE_deng_01')){//灯光
 				resolve();
 			}else{
+				//不在白名单里面的，不加载
+				if(!globlShowModel.includes(realData.name)){
+					resolve();
+					return false;
+				}
 				that.loader.setDRACOLoader(this.dracoLoader);
 				that.loader.load(realData.url, ( gltf ) => {
 					gltf.scene.traverse((child)=> {
@@ -324,18 +375,34 @@ 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=>{
-					it.visible = isShow;
+					if(it){
+						it.visible = isShow;
+					}
 				})
-				console.log("移动过程中显示隐藏空间家具", this.gltfLayouts,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,changeSpaceList);
+			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 => {
@@ -369,50 +436,60 @@ export default {
 				})
 			}
 		},
+		// 删除对应空间家具模型
 		deleteLayoutModel(spaceObj, layoutObj){
-			// 删除布局数据
-			for (let index = 0; index < this.arrFrunList.length; index++) {
-				const element = this.arrFrunList[index];
-				
+			if(!layoutObj){//删除完家具模型后，修改空间的布局id为0，表示当前空间不存在布局了
+				spaceObj.delateLayoutId = true;//当前空间已经删除了家具模型
+			}else{
+				spaceObj.delateLayoutId = false;
 			}
 			const oldLayoutIndex = this.arrFrunList.findIndex((item)=>{
 				return item.id == spaceObj.layoutId
 			})
-	
-			if(oldLayoutIndex!=-1){
-				this.arrFrunList[oldLayoutIndex] = layoutObj;
+			//对应空间的布局替换为新的布局数据
+			if(oldLayoutIndex!=-1 && layoutObj){
+				this.arrFrunList[oldLayoutIndex] = layoutObj
+				// this.arrFrunList.splice(oldLayoutIndex,1)
 			}
 			
-			console.log("准备删除模型", spaceObj, this.gltfLayouts, this.arrFrunList);
-			
+			console.log("准备删除模型", spaceObj, 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];//网格实例对象
-						deleList.push(instancedMesh)
-						// this.scene.remove(instancedMesh);//添加到场景中
+						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.gltfLayouts //删除对象的家具模型
-			this.scene.remove(...deleList);
+			this.scene.remove(...deleList);//释放家具的资源,this.instancedFurList
+			console.log("删除模型了", spaceObj, this.gltfLayouts,this.lastFrunList);
 		},
 		// 计算家具的位置
 		calculateLayoutModelSize() {
 			console.log("计算家具的位置", this.gltfLayouts,this.changeSpaces);
 			// 有改变空间，只刷新改变空间的模型数据
-			const spaceList = this.changeSpaces.length ==0 ? this.spaceList : 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 => {
@@ -433,21 +510,16 @@ export default {
 			}
 		},
 		// 计算家具的位置
-		calculateLayoutModelSizeBySpace(spaceObj) {
-			// for (let index = 0; index < this.spaceList.length; index++) {
-				const element = spaceObj;
+		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;
 				})
-				
-				const gltfLayoutModelss = this.gltfLayouts.filter(item => {
-					return element.spaceId == item.userData.spaceId;
-				})
-
-				console.log("计算指定空间的家具的位置", spaceObj, element.layoutId, gltfLayoutModels, gltfLayoutModelss);
+				// console.log("计算指定空间的家具的位置", element, element.layoutId, gltfLayoutModels);
 				//空间下不存在家具模型，则该空间不需要进行下一步处理
 				if (!gltfLayoutModels || gltfLayoutModels.length == 0) {
-					return;
+					continue;
 				}
 				gltfLayoutModels.sort(function(a, b) {
 					return a.userData.level - b.userData.level
@@ -457,7 +529,7 @@ export default {
 					const cube = gltfLayoutModels[j];
 					this.drawLayoutModel(element, cube);
 				}
-			// }
+			}
 		},
 		// 绘制模型
 		drawLayoutModel(curSpace, cube) {
@@ -814,7 +886,7 @@ export default {
 			
 			}
 			// console.log("模型计算位置--", positionX, positionY)
-			console.log("模型计算位置", cubeInfo, centerX, centerY, spaceWidth, spaceHeight, modelWidth, modelHeight, spaceId, scaleX, scaleY, positionX, positionY, cubeInfo.modelName)
+			// 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);
 			cube.position.x = positionX / 100;
@@ -1002,9 +1074,7 @@ export default {
 		},
 		// 改变空间模型
 		changeLayoutModel(){
-		
 			let changeSpaces = [];
-		     
 			// 去重
 			for (let index = 0; index < this.changeSpaces.length; index++) {
 				const element = this.changeSpaces[index];
@@ -1015,39 +1085,38 @@ export default {
 					const findListIndex = this.spaceList.findIndex((item)=>{
 						return item.spaceId == element.spaceId;
 					})
-					if(findListIndex !=-1){
+					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);
 						})
 					)
 				}
-				
 			}
 			Promise.all(promise_list).then(()=>{
 				this.$nextTick(()=>{
-					console.log("新布局替换完成",this.changeLayouts, changeSpaces);
-					this.furnHandle(this.changeLayouts, changeSpaces[0]);
+					console.log("新布局替换完成",this.changeLayouts, changeSpaces,,this.arrFrunList.map(it=>it.id));
+					this.furnHandle(this.changeLayouts, changeSpaces);//先加载变化的空间的布局
 				})
 			})
 		},
@@ -1077,8 +1146,6 @@ export default {
 				return (item.minWidth * item.minDepth ) <= (spaceObj.spaceWidth * spaceObj.spaceHeight)
 			})
 			console.log("过滤适合的布局02", layouts02)
-		
-		
 			// 取布局面积最大的一个
 			let layoutObj = null
 			for (let index = 0; index < layouts02.length; index++) {
@@ -1093,29 +1160,27 @@ export default {
 			}
 			if(layoutObj==null){
 				console.warn("没有合适的布局", layoutObj);
+				// this.deleteLayoutModel(spaceObj, layoutObj);//删除当前的布局
 				return resolve()
 			}
 			console.log("找出最合适的布局", layoutObj)
-			console.log("更新空间的布局ID=", layoutObj.id)
+			console.log("更新空间的布局ID=", spaceObj.layoutId)
 		
-			// 合适的布局更现有布局相同
-			if(spaceObj.layoutId == layoutObj.id){
-				// this.calculateLayoutModelSizeBySpace(spaceObj) // 提前计算模型的位置
-				// this.changeLayoutModelState(true); // 显示家具模型
-				return resolve()
-			}
+			// 合适的布局更现有布局相同-不在需要了，因为这此之前已经把所有的家具都删除了
+			// if(spaceObj.layoutId == layoutObj.id && !spaceObj.delateLayoutId){
+			// 	// this.calculateLayoutModelSizeBySpace(spaceObj) // 提前计算模型的位置
+			// 	// 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);
-				}
+			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/pages/webgl_rxdz/webgl_rxdz.vue

@@ -964,7 +964,7 @@
 					that.calculateLayoutModelSize(); //重新计算家具位置
 					that.updateWallModels(); // 替换墙体模型
 					that.changeLayoutModel(); // 改变空间模型
-					that.changeLayoutModelState(true); // 显示家具模型
+					// that.changeLayoutModelState(true); // 显示家具模型
 				}, 4200);
 			}, 
 			moveSpace(curSpace, directionIndex, directionIndex01, isZoomIn, newArea, newWidth, newHeight, changeWidth, changeHeight){

src/static/globlShowModel.js

@@ -41,6 +41,7 @@ var globlShowModel = [
 	"BP_L_TeaTable05",
 	"BP_L_Teatable03",
 	"BP_L_FloorLamp01",
+	"BP_T_stairs01",
 ];
 
 module.exports = globlShowModel;