fix

virgo.wzfrontend/console/src/components/work/bim/bimRoam.vue

@@ -0,0 +1,335 @@
+<template>
+	<div class="bim-roam">
+		<div class="roam-form">
+			<div class="page-header-content">
+				<div class="page-header-select">
+					<el-select v-model="roamId" placeholder="请选择" @change="changeRoam">
+						<el-option v-for="item in list" :key="item.id" :label="item.roamName" :value="item.id">
+						</el-option>
+					</el-select>
+				</div>
+				<div class="page-header-button">
+					<el-button type="primary" size="mini" @click="insert">新增</el-button>
+				</div>
+			</div>
+			<div class="roam-form-box">
+				<div class="hui-alert">
+					<div class="hui-alert-box">
+						<i class="iconfont huifont-yiwen"></i>
+						<span>将右侧视角设置漫游视角</span>
+					</div>
+				</div>
+				<el-form ref="form" :model="form">
+					<el-form-item label="漫游名称">
+						<el-input type="text" v-model="form.roamName" placeholder="请输入漫游名称"></el-input>
+					</el-form-item>
+					<el-form-item label="漫游时间">
+						<el-input type="number" v-model="form.roamTime" placeholder="请输入漫游时间"></el-input>
+					</el-form-item>
+				</el-form>
+				<div class="roam-form-title">漫游节点</div>
+				<div class="roam-item-box">
+					<div class="bim-iot-element-tag" v-for="(item,index) in walk" :key="item.id">
+						<div class="bim-iot-element-label">
+							<el-input type="text" size="small" v-model="item.name" placeholder="请输入节点名称"></el-input>
+						</div>
+						<div class="bim-iot-element-close">
+							<i class="iconfont huifont-shanchu" @click="deleteElement(index,item)"></i>
+						</div>
+					</div>
+					<div class="roam-item-box-insert">
+						<el-button type="primary" size="mini" @click="getWalk">记录视角</el-button>
+					</div>
+				</div>
+			</div>
+			<div class="roam-form-submit">
+				<el-button size="mini" type="primary" @click="submit">保 存</el-button>
+				<el-button size="mini" @click="start">{{!stop?'暂 停':'预 览'}}</el-button>
+				<el-button size="mini" type="info" @click="delWalk" v-if="form.id">删 除</el-button>
+			</div>
+		</div>
+		<div id="previewBim"></div>
+	</div>
+</template>
+
+<script>
+	import bimView from '@/uitls/controls'
+	import {
+		getIntegrateViewToken,
+		getRoamList,
+		insertRoam,
+		updateRoam,
+		deleteRoam,
+		updateProjectItem
+	} from '@/httpApi/bim';
+	export default {
+		props: ['projectItem'],
+		data() {
+			return {
+				roamId: '',
+				list: [],
+				form: {
+					roamName: '',
+					roamTime: ''
+				},
+				walk: [],
+				bimViewer: null,
+				wt: null,
+				stop: true
+			}
+		},
+		created() {
+			this.init();
+			this.$nextTick(() => {
+				this.initBIM();
+			})
+		},
+		beforeDestroy() {
+			// 离开当前路由前的操作
+			if (this.bimViewer) this.bimViewer.destroy();
+		},
+		methods: {
+			deleteElement(index) {
+				this.walk.splice(index, 1);
+			},
+			init() {
+				if (!this.projectItem.bimIntegrateId) return;
+				getRoamList(this.projectItem.id, this.projectItem.bimIntegrateId).then(res => {
+					if (res.state) {
+						this.list = res.data;
+						if (this.list.length === 0) return this.insert();
+						if (!this.roamId) this.roamId = this.list[0].id;
+						this.changeRoam();
+					}
+				})
+			},
+			insert() {
+				this.form = {
+					roamName: '',
+					roamTime: ''
+				}
+				this.walk = [];
+				this.roamId = '';
+			},
+			changeRoam() {
+				if (this.wt) this.pause();
+				this.form = this.list.filter(node => node.id == this.roamId)[0];
+				this.walk = JSON.parse(this.form.roamNode);
+			},
+			initBIM() {
+				document.getElementById('previewBim').innerHTML = '';
+				if (!this.projectItem.bimIntegrateId) return;
+				getIntegrateViewToken(this.projectItem.bimIntegrateId).then(this.successFunc)
+			},
+			changeBimViewer(type, data) {
+				if (!this.bimViewer) return;
+				this.bimViewer[type](data);
+			},
+			successFunc(res) {
+				if (res.state) {
+					if (!res.data) return;
+					this.bimViewer = new bimView({
+						dom: document.getElementById('previewBim'),
+						viewToken: res.data,
+						bimIntegrateId: this.projectItem.bimIntegrateId,
+						roamAngle: this.projectItem.roamAngle,
+						renderSuccess: () => {
+							this.bimViewer.setToolbars(true);
+						},
+						roomSaved: data => {},
+						click: data => {}
+					})
+				}
+			},
+			submit() {
+				if (this.wt) this.pause();
+				let postData = {
+					integrateId: this.projectItem.bimIntegrateId,
+					projectItemId: this.projectItem.id,
+					roamName: this.form.roamName,
+					roamTime: this.form.roamTime || 20,
+					roamNode: JSON.stringify(this.walk)
+				}
+				if (this.form.id) postData['id'] = this.form.id;
+				!this.form.id ? insertRoam(postData).then(this.success) : updateRoam(postData).then(this.success)
+			},
+			success(res) {
+				if (res.state) {
+					this.roamId = !res.data ? '' : res.data.id;
+					this.init();
+					this.$message.success('操作成功')
+				}
+			},
+			lookRoamAngle() {
+				this.bimViewer.setStatus(this.projectItem.roamAngle);
+			},
+			setCamera() {
+				let data = JSON.stringify(this.bimViewer.getCameraState());
+				updateProjectItem({
+					id: this.projectItem.id,
+					roamAngle: data
+				}).then(res => {
+					if (res.state) {
+						this.projectItem.roamAngle = data;
+						this.bimViewer.setStatusValue(data);
+						this.$message.success('操作成功')
+					}
+				})
+			},
+			getWalk() {
+				let walk = this.bimViewer.getWalkthroughData();
+				this.walk.push(walk);
+			},
+			start() {
+				if (!this.bimViewer) return;
+				if (!this.stop) return this.pause();
+				this.wt = this.bimViewer.walkthrough();
+				this.wt.setWalkthroughTime(parseInt(this.form.roamTime));
+				this.wt.setKeyFrames(this.walk);
+				this.wt.play();
+				this.stop = false;
+			},
+			pause() {
+				if (!this.wt) return;
+				this.wt.pause();
+				this.stop = true;
+			},
+			delWalk() {
+				if (this.wt) this.pause();
+				this.$confirm('确定要删除该漫游?', () => {
+					deleteRoam(this.roamId).then(this.success)
+				});
+			}
+		},
+	}
+</script>
+
+<style lang="scss">
+	.bim-roam {
+		width: 100%;
+		height: 100%;
+		display: flex;
+
+		#previewBim {
+			flex: 1;
+			width: 0;
+			height: 100%;
+		}
+
+		.roam-form {
+			width: 300px;
+			height: 100%;
+			display: flex;
+			flex-direction: column;
+			border-right: 1px solid $--color-border;
+
+
+			.el-input {
+				margin: 0;
+				font-size: 12px;
+
+				.el-input__inner {
+					border: none;
+					background: #191E28;
+					height: 24px;
+					line-height: 24px;
+				}
+
+				.el-input__icon {
+					line-height: 24px;
+					color: #545F79;
+				}
+			}
+
+			.page-header-content {
+				position: relative;
+				border-bottom: 1px solid $--color-border;
+				display: flex;
+				align-items: center;
+				height: 42px;
+				padding: 0 10px;
+
+				.page-header-select {
+					flex: 1;
+					width: 0;
+					margin-right: 10px;
+				}
+			}
+
+			.roam-form-box {
+				flex: 1;
+				height: 0;
+				overflow-y: auto;
+				padding-top: 10px;
+				font-size: 12px;
+				padding: 12px;
+
+				.el-form {
+					margin-top: 10px;
+				}
+
+				.el-form-item {
+					width: 100%;
+					padding: 0;
+					display: flex;
+					align-items: center;
+					margin-bottom: 0;
+
+					.el-form-item__label {
+						font-size: 12px;
+						padding: 0;
+						margin-right: 10px;
+					}
+
+					.el-form-item__content {
+						flex: 1;
+						width: 0;
+					}
+				}
+
+				.roam-form-title {
+					margin: 7px 0 10px 0;
+				}
+
+				.roam-item-box {
+					background: #191E28;
+					padding: 10px;
+					border-radius: 2px;
+
+					.el-input__inner {
+						border: none;
+						background: #232A37;
+						height: 24px;
+						line-height: 24px;
+					}
+
+					.bim-iot-element-tag {
+						display: flex;
+						margin-bottom: 10px;
+						align-items: center;
+
+						.bim-iot-element-label {
+							flex: 1;
+							width: 0;
+						}
+
+						.bim-iot-element-close {
+							padding-left: 10px;
+						}
+					}
+
+					.roam-item-box-insert {
+						text-align: center;
+						padding: 10px 0;
+					}
+				}
+			}
+
+			.roam-form-submit {
+				padding: 12px;
+				border-top: 1px solid $--color-border;
+				text-align: right;
+			}
+		}
+	}
+</style>

virgo.wzfrontend/console/src/httpApi/bim.js

@@ -46,6 +46,18 @@ export function updateProjectItemTargetBim(data) {
 		data: data
 	})
 }
+/* 
+ * 编辑单位工程
+ * 
+ * 
+ */
+export function updateProjectItem(data) {
+	return request({
+		url: `/api/projectItem/update`,
+		method: 'put',
+		data: data
+	})
+}
 /* 
  * 转换BIM
  * 
@@ -169,4 +181,50 @@ export function modelIntegrateFiles(integrateId) {
 		url: `/bim/bim/integrate/files/${integrateId}`,
 		method: 'get',
 	});
+}
+/* 
+ * 获取漫游列表
+ * 
+ * 
+ */
+export function getRoamList(projectItemId, bimIntegrateId) {
+	return request({
+		url: `/api/roam/${projectItemId}/${bimIntegrateId}`,
+		method: 'get'
+	})
+}
+/* 
+ * 新增漫游
+ * 
+ * 
+ */
+export function insertRoam(data) {
+	return request({
+		url: `/api/roam`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 更新漫游
+ * 
+ * 
+ */
+export function updateRoam(data) {
+	return request({
+		url: `/api/roam`,
+		method: 'put',
+		data: data
+	})
+}
+/* 
+ * 删除漫游
+ * 
+ * 
+ */
+export function deleteRoam(id) {
+	return request({
+		url: `/api/roam/${id}`,
+		method: 'delete'
+	})
 }

virgo.wzfrontend/console/src/router/modules/bim.js

@@ -19,5 +19,12 @@ const bim = [{
 	meta: {
 		title: '楼层分布'
 	}
+}, {
+	path: 'bim/roam',
+	component: () => import('@/views/work/bim/roam'),
+	name: '模型漫游',
+	meta: {
+		title: '模型漫游'
+	}
 }]
 export default bim;

virgo.wzfrontend/console/src/views/work/bim/roam.vue

@@ -0,0 +1,72 @@
+<template>
+	<div class="yui-tree-box">
+		<div class="hui-left-tree">
+			<div class="hui-left-tree-title">
+				<svg-icon name="zhuangshi" width="16" height="20"></svg-icon>
+				<span class="hui-left-tree-sub">单位工程列表</span>
+			</div>
+			<div class="hui-left-tree-content">
+				<div class="project-list">
+					<div :class="'project-list-item' + (projectItem.id === item.id?' active':'') "
+						v-for="(item,index) in list" :key="item.id" @click="changeProject(item)">
+						<i class="iconfont huifont-shuzhuangcaidantubiao"></i>
+						<span class="project-item-name">{{item.name}}</span>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="hui-tree-content">
+			<div class="hui-flex hui-content box-background">
+				<div class="hui-content-title">
+					<div class="hui-title-item active">BIM漫游设置</div>
+				</div>
+				<div class="hui-flex-box hui-flex">
+					<bim-roam v-if="projectItem.id" :projectItem="projectItem" :key="projectItem.id"></bim-roam>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	import {
+		getProjectItemList
+	} from '@/httpApi/space'
+	import bimRoam from '@/components/work/bim/bimRoam'
+	export default {
+		data() {
+			return {
+				list: [],
+				projectItem: {}
+			}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init() {
+				getProjectItemList({
+					projectId: this.$store.getters.project.id,
+					currPage: 1,
+					pageSize: 100
+				}).then(res => {
+					if (res.state) {
+						this.list = res.data.dataList;
+						if (this.list.length > 0) {
+							this.projectItem = this.list[0];
+						}
+					}
+				})
+			},
+			changeProject(item) {
+				this.projectItem = item;
+			}
+		},
+		components: {
+			bimRoam
+		},
+	}
+</script>
+
+<style lang="scss">
+</style>