h5-webgl-program/src/components/newQCCom/viewlayout/viewlayout.vue

<template src="./viewlayout.html">

</template>
<script>
	// const util = require('@/static/utils/util.js');
	const config = require('@/services/urlConfig.js');
	import {
		Toast
	} from 'mint-ui';
	// import Bus from '@/common/bus';
	// import commonMethod from '@/common/commonMethod.js';
	// import requestConfig from '@/static/lib/requestConfig';
	// import { language } from '@/static/utils/conf.js'
	// const plugin = requirePlugin("WechatSI");
	// 获取**全局唯一**的语音识别管理器**recordRecoManager**
	// const manager = plugin.getRecordRecognitionManager()
	// import bgLoading from "@/components/bgLoading/bgLoading.vue"
	// import { nextTick } from "vue";
	// const app = getApp(); //获取应用实例
	// let positions = new Set();
	export default {
		data: function() {
			return {
				seedLayoutList: [],
				selectSeedId: null, //当前选中的种子户型id
				currentTranslate: {
					// 当前语音输入内容
					create: '04/27 15:37',
					text: '等待说话',
				},
				recording: false, // 正在录音
				startX:0,
				startY:0,
				clientX:0,
				clientY:0,
				defaultIndex:0,//默认选中的户型大类
				carefulList:[],
				lastSpace:null,	//上一个语音操作的空间对象
				bigWord:"变大,放大,大一点,变宽",
				bigWordPY:"bianda,fangda,dayidian,biankuan",
				smaillWord:"变小,缩放,小一点,变窄",
				smaillWordPY:"bianxiao,suofang,xiaoyidian,bianzhai",
				changeRate:0.05,	//每次变化的比例
				spaceList:[],
				showX:false,
			}
		},
		props: {
			// houseList: {//当前户型所有的户型详情，可以切换
			// 	type: Array,
			// 	default: () => {
			// 		return []
			// 	}
			// },
			curHouseObj: {//当前展示的户型
				type: Object,
				default: () => {
					return null
				}
			},
			overChange: {//当前选中的户型类型
				type: Boolean,
				default: false,
			},
			styleType:{
				type: [String, Number],
				default: '',
			}
		},
		watch: {
			// houseList: {
			// 	handler(newVal) {
			// 		if (newVal) {
			// 			console.warn("***houseList-change***", newVal)
			// 			this.initData(newVal);
			// 		}
			// 	},
			// },
			curHouseObj: {
				handler(newVal,oldVal) {
					if (newVal) {
						console.warn("***curHouseObj-CHANGE-layout***", newVal)
						// if((oldVal && oldVal.id != newVal.id) || !oldVal){
						// 	this.initSpanceData();
						// }
						const spaceDetail = newVal;
						this.spaceList = JSON.parse(spaceDetail.houseJson);
					}
				},
			},
			curSpaceId: {
				handler(newVal,oldVal) {
					if (newVal) {
						console.warn("***curSpaceId-CHANGE-layout***", newVal)
						let space = this.spaceList.find(it=>it.spaceId==this.curSpaceId);
						if(space && space.spaceType==15){//X空间
							this.showX = true;
						}else{
							this.showX = false;
						}
					}
				},
			},
		},
		computed: {
			curSpaceId() {
				return this.$store.state.curSpaceId;
			},
		},
		async mounted() {
			// this.getRecordAuth();//获取录音权限
			// this.initRecord();
			// var currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
			// currPage.updateSpanceData = this.initSpanceData;//页面注册变更方法
		},
		// 页面被展示时执行
		onPageShow: function() {
			
		},
		//页面被隐藏时执行
		onPageHide: function() {
			console.warn("***detached-hide***")
		},
		methods: {
			initSpanceData(){
				this.carefulList = [];
				// var currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
				const spaceDetail = this.curHouseObj;
				const spaceList = JSON.parse(spaceDetail.houseJson);
				spaceList && spaceList.forEach(async (item,index)=>{
					let curSpaceArea = parseFloat(
						(item.spaceWidth * item.spaceHeight) / 10000
					).toFixed(1);
					let minArea = 0;
					let maxArea = 100;
					if(item.hasOwnProperty('spaceWidthMin') && item.hasOwnProperty('spaceHeightMin')){
						minArea = parseFloat((item.spaceWidthMin * item.spaceHeightMin) / 10000).toFixed(1);
					}
					if(item.hasOwnProperty('spaceWidthMax') && item.hasOwnProperty('spaceHeightMax')){
						maxArea = parseFloat((item.spaceWidthMax * item.spaceHeightMax) / 10000).toFixed(1);
					}
					let text = item.spaceName;
					if(text && !item.isSizeLock){
						// let res = await requestConfig("chineseToPinyin", {chinese:text},true);
						// let pinyin = res.single;
						let data = {
							spaceId:item.spaceId,
							index:this.carefulList.length,
							name:text,
							namePY:'',
							area:curSpaceArea,
							percent:null,
							minArea:minArea,	//最小面积
							maxArea:maxArea,	//最大面积
						}
						this.carefulList.push(data)
					}
				})
				console.warn("***viewlayout-init***", this.carefulList)
			},
			initData(houseList){
				this.seedLayoutList = [];
				houseList && houseList.forEach(item=>{
					let data = {
						spaceStructure: item.spaceStructure,
						spaceName: item.spaceName,
						set: false, //是否已经设置过
					};
					this.seedLayoutList.push(data);
				})
				// var currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
				// if(currPage.curHouseType){//获取当前页面选中的户型类型
				// 	this.selectSeedId = currPage.curHouseType
				// } else if(this.seedLayoutList && this.seedLayoutList[this.defaultIndex]){//默认选中第一个
				// 	this.selectSeedId = this.seedLayoutList[this.defaultIndex].spaceStructure;
				// }
				this.selectSeedId = this.seedLayoutList[this.defaultIndex].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=>{
						return it.spaceStructure == this.selectSeedId
					})
					this.$emit("seedChange", item);//通知父组件-当前已经选中了户型大类
					let param = {
						type: 'CLK', //埋点类型
						clkId: 'clk_2cmina_23080402', //点击ID
						clkName: 'seedroom_clk', //点击前往的页面名称
						clkParams: {
							type: item.spaceName,
							locusValue: item.spaceStructure,
							locusName: "切换种子户型",
						}
					};
					// util.trackRequest(param);
				}
				console.warn("***curHouseType-init***",this.seedLayoutList)
			},
			//打开布局
			openLayout(style) {
				console.warn("***openLayout***",style,this.curSpaceId)
				let space = this.spaceList.find(it=>it.spaceId==this.curSpaceId);
				if(space && space.spaceType==15){//X空间
					this.showX = true;
				}else{
					this.showX = false;
				}
				if(style==3){
					if(this.showX){//X空间
						this.$emit("changeStyle",style);
					}else{
						Toast({
							message: '此空间无法更改功能',
						});
						return false
					}
				}else{
					this.$emit("changeStyle",style);
				}
				// util.trackRequest(param);
			},
			goRoam(){
				this.$parent.$refs.viewCareful.goRoam();
			},
			
		}
	}
</script>
<style lang="scss" scoped>
	@import "./viewlayout.scss";
	/* @import "@/common/css/common.css"; */
</style>