|
|
@@ -0,0 +1,351 @@
|
|
|
+<template>
|
|
|
+ <main>
|
|
|
+ <van-datetime-picker v-model="sourceDate" :filter="onFilter" type="date" title="选择年月日" />
|
|
|
+ </main>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, onMounted, computed, nextTick } from 'vue'
|
|
|
+import { http } from '@/utils/request'
|
|
|
+import browser from '@/utils/browser'
|
|
|
+import sync, { loadSourceScene, loadTargetScene } from '@/utils/sync'
|
|
|
+
|
|
|
+// 是否校准模式
|
|
|
+const showSplit = ref(browser.urlHasValue('split'))
|
|
|
+const showAdjust = ref(browser.urlHasValue('adjust'))
|
|
|
+
|
|
|
+const bimChecked = ref(null)
|
|
|
+const dbsChecked = ref(null)
|
|
|
+const fscChecked = ref(null)
|
|
|
+
|
|
|
+const datepickName = ref(null)
|
|
|
+
|
|
|
+const sourceFrame = ref(null)
|
|
|
+const targetFrame = ref(null)
|
|
|
+
|
|
|
+const mode = ref(0)
|
|
|
+const source = ref(null)
|
|
|
+const target = ref(null)
|
|
|
+const project = ref(null)
|
|
|
+const points = ref({ p1: false, p2: false })
|
|
|
+
|
|
|
+const scenes = computed(() => {
|
|
|
+ if (!project.value) {
|
|
|
+ return []
|
|
|
+ }
|
|
|
+ return project.value.sceneList.map(item => {
|
|
|
+ return {
|
|
|
+ num: item.num,
|
|
|
+ type: item.type,
|
|
|
+ createTime: item.createTime,
|
|
|
+ }
|
|
|
+ })
|
|
|
+})
|
|
|
+const sourceURL = computed(() => {
|
|
|
+ if (bimChecked.value && !dbsChecked.value) {
|
|
|
+ return `smart-bim.html?m=${source.value.num}`
|
|
|
+ }
|
|
|
+
|
|
|
+ if (source.value.type < 2) {
|
|
|
+ // 看看、看见场景
|
|
|
+ return `smart-kankan.html?m=${source.value.num}&dev`
|
|
|
+ } else {
|
|
|
+ // 深时场景
|
|
|
+ return `smart-laser.html?m=${source.value.num}&dev`
|
|
|
+ }
|
|
|
+})
|
|
|
+const targetURL = computed(() => {
|
|
|
+ if (bimChecked.value) {
|
|
|
+ return `smart-bim.html?m=${target.value.num}`
|
|
|
+ }
|
|
|
+
|
|
|
+ if (source.value.type < 2) {
|
|
|
+ // 看看、看见场景
|
|
|
+ return `smart-kankan.html?m=${target.value.num}&dev`
|
|
|
+ } else {
|
|
|
+ // 深时场景
|
|
|
+ return `smart-laser.html?m=${target.value.num}&dev`
|
|
|
+ }
|
|
|
+})
|
|
|
+const sourceDate = computed(() => {
|
|
|
+ if (source.value) {
|
|
|
+ return source.value.createTime.toDate()
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const targetDate = computed(() => {
|
|
|
+ if (target.value) {
|
|
|
+ return target.value.createTime.toDate()
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const sourceDays = computed(() => {
|
|
|
+ let dates = []
|
|
|
+ if (datepickName.value == 'source') {
|
|
|
+ if (dbsChecked.value) {
|
|
|
+ // 分屏模式
|
|
|
+ if (bimChecked.value) {
|
|
|
+ // BIM模式
|
|
|
+ dates = scenes.value.map(item => item.createTime.toDate())
|
|
|
+ } else {
|
|
|
+ // 非BIM模式
|
|
|
+ dates = scenes.value.filter(item => item.createTime != target.value.createTime).map(item => item.createTime.toDate())
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // 非分屏模式
|
|
|
+ dates = scenes.value.map(item => item.createTime.toDate())
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ dates: dates,
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const targetDays = computed(() => {
|
|
|
+ let dates = []
|
|
|
+ if (datepickName.value == 'target') {
|
|
|
+ dates = scenes.value.filter(item => item.createTime != source.value.createTime).map(item => item.createTime.toDate())
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ dates: dates,
|
|
|
+ }
|
|
|
+})
|
|
|
+const onFilter = (type, options)=> {
|
|
|
+ console.log(type,options)
|
|
|
+}
|
|
|
+const onLoadSource = () => {
|
|
|
+ if (bimChecked.value && !dbsChecked.value) {
|
|
|
+ // BIM单屏模式
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ loadSourceScene(sourceFrame, source.value.type < 2 ? 'kankan' : 'laser')
|
|
|
+}
|
|
|
+const onLoadTarget = () => {
|
|
|
+ if (bimChecked.value) {
|
|
|
+ loadTargetScene(targetFrame, 'bim')
|
|
|
+ } else {
|
|
|
+ loadTargetScene(targetFrame, target.value.type < 2 ? 'kankan' : 'laser', mode.value)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const onModeChange = targetMode => {
|
|
|
+ if (sync.sourceInst) {
|
|
|
+ sync.sourceInst.loaded.then(sdk => sdk.scene.changeMode(targetMode))
|
|
|
+ mode.value = targetMode
|
|
|
+ }
|
|
|
+}
|
|
|
+const onPickDate = name => {
|
|
|
+ datepickName.value = name
|
|
|
+}
|
|
|
+
|
|
|
+const onSelected = data => {
|
|
|
+ if (!data.payload) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let { name, payload } = data
|
|
|
+ let date = payload.format('YYYY-mm-dd')
|
|
|
+ let dates = (name == 'source' ? sourceDays : targetDays).value.dates.map(item => item.format('YYYY-mm-dd'))
|
|
|
+
|
|
|
+ if (dates.indexOf(date) != -1) {
|
|
|
+ let time = payload.format('YYYY-mm-dd HH:MM')
|
|
|
+ let find = scenes.value.find(c => c.createTime.indexOf(time) != -1)
|
|
|
+ if (find) {
|
|
|
+ if (name == 'source') {
|
|
|
+ if (find.num != source.value.num) {
|
|
|
+ source.value = find
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (find.num != target.value.num) {
|
|
|
+ target.value = find
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ datepickName.value = null
|
|
|
+}
|
|
|
+
|
|
|
+const onPrevDate = name => {
|
|
|
+ let scene = null
|
|
|
+ if (name == 'source') {
|
|
|
+ scene = source
|
|
|
+ } else {
|
|
|
+ scene = target
|
|
|
+ }
|
|
|
+ let index = scenes.value.findIndex(item => item.num == scene.value.num)
|
|
|
+ if (index == -1) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (--index == -1) {
|
|
|
+ index = scenes.value.length - 1
|
|
|
+ }
|
|
|
+
|
|
|
+ if (target.value) {
|
|
|
+ // 分屏模式判断
|
|
|
+ if (name == 'source') {
|
|
|
+ if (scenes.value[index].createTime == target.value.createTime) {
|
|
|
+ index--
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (scenes.value[index].createTime == source.value.createTime) {
|
|
|
+ index--
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (index == -1) {
|
|
|
+ index = scenes.value.length - 1
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ scene.value = scenes.value[index]
|
|
|
+}
|
|
|
+const onNextDate = name => {
|
|
|
+ let scene = null
|
|
|
+ if (name == 'source') {
|
|
|
+ scene = source
|
|
|
+ } else {
|
|
|
+ scene = target
|
|
|
+ }
|
|
|
+ let index = scenes.value.findIndex(item => item.num == scene.value.num)
|
|
|
+ if (index == -1) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (++index > scenes.value.length - 1) {
|
|
|
+ index = 0
|
|
|
+ }
|
|
|
+
|
|
|
+ if (target.value) {
|
|
|
+ // 分屏模式判断
|
|
|
+ if (name == 'source') {
|
|
|
+ if (scenes.value[index].createTime == target.value.createTime) {
|
|
|
+ index++
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (scenes.value[index].createTime == source.value.createTime) {
|
|
|
+ index++
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if (index > scenes.value.length - 1) {
|
|
|
+ index = 0
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ scene.value = scenes.value[index]
|
|
|
+}
|
|
|
+
|
|
|
+// bim点击
|
|
|
+const onBimChecked = () => {
|
|
|
+ if (bimChecked.value) {
|
|
|
+ bimChecked.value = false
|
|
|
+ if (dbsChecked.value) {
|
|
|
+ // 判断是否分屏状态
|
|
|
+ let index = scenes.value.findIndex(item => item.num == source.value.num)
|
|
|
+ if (index == -1) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (++index > scenes.value.length - 1) {
|
|
|
+ index = 0
|
|
|
+ }
|
|
|
+ target.value = scenes.value[index]
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ bimChecked.value = true
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 分屏点击
|
|
|
+const onDbsChecked = () => {
|
|
|
+ dbsChecked.value = !dbsChecked.value
|
|
|
+ if (dbsChecked.value) {
|
|
|
+ if (bimChecked.value) {
|
|
|
+ // BIM分屏
|
|
|
+ source.value = scenes.value[0]
|
|
|
+ target.value = project.value.bimData
|
|
|
+ } else {
|
|
|
+ // 四维看看、激光场景分屏
|
|
|
+ let index = scenes.value.findIndex(item => item.num == source.value.num)
|
|
|
+ if (index == -1) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (++index > scenes.value.length - 1) {
|
|
|
+ index = 0
|
|
|
+ }
|
|
|
+ target.value = scenes.value[index]
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ target.value = null
|
|
|
+ targetApp = null
|
|
|
+ views.clear()
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 全屏点击
|
|
|
+const onFscChecked = () => {
|
|
|
+ let element = document.documentElement
|
|
|
+
|
|
|
+ fscChecked.value = !fscChecked.value
|
|
|
+
|
|
|
+ if (fscChecked.value) {
|
|
|
+ if (element.requestFullscreen) {
|
|
|
+ element.requestFullscreen()
|
|
|
+ } else if (element.webkitRequestFullScreen) {
|
|
|
+ element.webkitRequestFullScreen()
|
|
|
+ } else if (element.mozRequestFullScreen) {
|
|
|
+ element.mozRequestFullScreen()
|
|
|
+ } else if (element.msRequestFullscreen) {
|
|
|
+ element.msRequestFullscreen()
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (document.exitFullscreen) {
|
|
|
+ document.exitFullscreen()
|
|
|
+ } else if (document.webkitCancelFullScreen) {
|
|
|
+ document.webkitCancelFullScreen()
|
|
|
+ } else if (document.mozCancelFullScreen) {
|
|
|
+ document.mozCancelFullScreen()
|
|
|
+ } else if (document.msExitFullscreen) {
|
|
|
+ document.msExitFullscreen()
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const onPointsUpdate = type => {
|
|
|
+ points.value[type] = true
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ const projectId = browser.valueFromUrl('projectId') || 1
|
|
|
+ http.get(`smart-site/project/info?projectId=${projectId}`)
|
|
|
+ .then(response => {
|
|
|
+ if (response.success) {
|
|
|
+ project.value = response.data
|
|
|
+ if (project.value.sceneList.length) {
|
|
|
+ source.value = project.value.sceneList[0]
|
|
|
+ if (showAdjust.value || showSplit.value) {
|
|
|
+ onBimChecked()
|
|
|
+ nextTick(() => onDbsChecked())
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ alert('获取数据失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ alert('服务器连接失败')
|
|
|
+ })
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+main{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+#app {
|
|
|
+ background-color: rgba(0, 0, 0, 0.8);
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+</style>
|
