realty/virgo.wzfrontend/console/src/components/work/bim/preview.vue

<template>
	<div class="bim-preview">
		<div class="no-empty" v-if="!state">
			<empty :description="type == 'model'?'模型转换中':'模型集成中'"></empty>
		</div>
		<div :id="'previewBim'+_uid" class="previewBim" v-else></div>
	</div>
</template>

<script>
	import bimView from '@/uitls/controls'
	import {
		getBimViewToken,
		getIntegrateViewToken
	} from '@/httpApi/bim';
	export default {
		props: ['file', 'type'],
		data() {
			return {
				state: false,
				bimViewer: null
			}
		},
		created() {
			this.init();
		},
		beforeDestroy() {
			if (this.bimViewer) this.bimViewer.destroy();
		},
		methods: {
			init() {
				this.type === 'model' ? getBimViewToken(this.file.id).then(this.successFunc) : getIntegrateViewToken(this
					.file.id).then(this.successFunc)
			},
			successFunc(res) {
				if (res.state) {
					if (!res.data) return;
					this.state = true;
					this.$nextTick(() => {
						this.bimViewer = new bimView({
							dom: document.getElementById('previewBim' + this._uid),
							viewToken: res.data,
							bimIntegrateId: this.file.id,
							type: this.type,
							renderSuccess: () => {
								this.bimViewer.setToolbars(true)
								this.$emit('renderSuccess');
							}
						})
					})
				}
			},
			colorAll() {
				this.bimViewer.overrideComponentsColorByObjectData()
			},
			colorElement(elementIds, option) {
				this.bimViewer.colorElementById(elementIds, option)
			}
		},
	}
</script>


<style lang="scss">
	.bim-preview {
		width: 100%;
		height: 100%;

		.previewBim {
			width: 100%;
			height: 100%;
		}
	}
</style>