| | |
| | | * @Author: shuishen 1109946754@qq.com |
| | | * @Date: 2024-11-09 15:41:35 |
| | | * @LastEditors: shuishen 1109946754@qq.com |
| | | * @LastEditTime: 2025-09-07 20:29:02 |
| | | * @LastEditTime: 2025-09-11 22:34:57 |
| | | * @FilePath: \bigScreen\src\views\pd\components\dynamicPanel.vue |
| | | * @Description: |
| | | * |
| | |
| | | import qysgwslx from "@/assets/json/qysgwslx" |
| | | import disposeDataJson from "@/assets/json/dispose" |
| | | const { VITE_APP_BASE } = import.meta.env |
| | | import { computed, onBeforeUnmount, onUnmounted } from 'vue' |
| | | import { computed, onBeforeUnmount, onUnmounted, watch } from 'vue' |
| | | import { spatialAnalysisPoint } from "@/api/space/space" |
| | | import { useMap } from 'store/map' |
| | | const mapStore = useMap() |
| | |
| | | }) |
| | | |
| | | const clearAll = () => { |
| | | |
| | | EventBus.emit('restHandleDelChange', `2`) |
| | | EventBus.emit('restHandleDelChange', `3-2`) |
| | | EventBus.emit('restHandleDelChange', `3-4`) |
| | | |
| | |
| | | clearAll() |
| | | |
| | | if (type === 1) { |
| | | EventBus.emit('restHandleCheckChange', `2`) |
| | | EventBus.emit('restHandleCheckChange', `3-2`) |
| | | EventBus.emit('restHandleCheckChange', `3-4`) |
| | | |
| | | contentData.value = modelData |
| | | contentData.value.disposeData[0].show = true |
| | | curContentInd.value = 0 |
| | |
| | | divIcon.attrParams = item |
| | | |
| | | divIcon.on(DC.MouseEventType.CLICK, (e) => { |
| | | console.log(e, '-') |
| | | EventBus.emit('restHandleCheckChange', `2`) |
| | | EventBus.emit('restHandleCheckChange', `3-2`) |
| | | EventBus.emit('restHandleCheckChange', `3-4`) |
| | | |
| | | contentData.value = e.overlay.attrParams |
| | | contentData.value.disposeData[0].show = true |
| | | curContentInd.value = 0 |
| | |
| | | if (contentData.value === null) return false |
| | | |
| | | const isShow = contentData.value?.disposeData[curContentInd.value]?.isNeedHandle |
| | | |
| | | mapStore.setStartCustomWx(isShow) |
| | | return isShow |
| | | }) |
| | | |
| | |
| | | |
| | | const clickId = e.overlay.attrParams.id |
| | | |
| | | console.log(clickId, contentData.value?.disposeData[curContentInd.value]?.needSelectID, 111) |
| | | |
| | | let flag = contentData.value?.disposeData[curContentInd.value]?.needSelectID.some(i => i == clickId) |
| | | let isSelectedCur = contentData.value?.disposeData[curContentInd.value]?.selectedID.some(i => i == clickId) |
| | | |
| | |
| | | contentData.value.disposeData[curContentInd.value].selectedID.push(clickId) |
| | | |
| | | contentData.value.disposeData[curContentInd.value].selectedNum += 1 |
| | | |
| | | if (isDisabledNextBtn.value) { |
| | | ElMessage({ |
| | | message: '选择正确,请继续选择下一个。', |
| | | type: 'success', |
| | | }) |
| | | } else { |
| | | ElMessage({ |
| | | message: '选择正确。', |
| | | type: 'success', |
| | | }) |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | message: '选择错误,请重新选择。', |
| | |
| | | EventBus.on('wxEntityClick', wxEntityClick) |
| | | |
| | | const modelData = { |
| | | title: '典型情景模拟', |
| | | incidentSiteLng: 115.6129562, |
| | | incidentSiteLat: 29.80862305, |
| | | incidentSiteAlt: 8, |
| | |
| | | show: false, |
| | | }, |
| | | { |
| | | useLayerID: '3-2', |
| | | content: '启动应急池的使用,将泄漏的化学原料引导至应急池中。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择应急池', |
| | |
| | | show: false, |
| | | }, |
| | | { |
| | | useLayerID: '3-2', |
| | | content: '若该公司应急池容量不足,可通过移动泵或槽罐车将事故废水转移至临近企业事故应急池或污水处理厂事故应急池。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择临近企业', |
| | | buttonText: '选择应急池', |
| | | isSelectNum: 1, |
| | | selectedNum: 0, |
| | | needSelectID: ['1875103368541917185'], |
| | | needSelectID: ['1875105469779234817'], |
| | | selectedID: [], |
| | | show: false, |
| | | }, |
| | | { |
| | | useLayerID: '3-4', |
| | | content: '立即关闭园区排洪渠下游闸坝,拦截污染水体。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择闸坝', |
| | |
| | | }, |
| | | |
| | | { |
| | | useLayerID: '3-4', |
| | | content: '立即关闭园区上游闸坝,拦截清水,减轻应急压力。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择闸坝', |
| | |
| | | }, |
| | | |
| | | { |
| | | useLayerID: '3-2', |
| | | content: '开启园区事故应急池将拦截的污水转输至池内。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择应急池', |
| | |
| | | |
| | | const customData = [ |
| | | { |
| | | title: '自定义情景模拟', |
| | | incidentSiteLng: 115.61393792, |
| | | incidentSiteLat: 29.79786228, |
| | | incidentSiteAlt: 11.98, |
| | |
| | | isNeedHandle: false, |
| | | show: false, |
| | | }, |
| | | |
| | | { |
| | | content: '处理完成后打开上游临时闸坝释放清水,稀释后打开下游临时闸坝排放处理后的污水。', |
| | | useLayerID: '3-4', |
| | | content: '处理完成后打开上游临时闸坝释放清水。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择闸坝', |
| | | isSelectNum: 3, |
| | | isSelectNum: 2, |
| | | selectedNum: 0, |
| | | needSelectID: ['1922914799476486145', '1922914776902742017', '1922914784108556289'], |
| | | needSelectID: ['1922914802630602754', '1922914799476486145'], |
| | | selectedID: [], |
| | | show: false, |
| | | }, |
| | | |
| | | { |
| | | useLayerID: '3-4', |
| | | content: '稀释后打开下游临时闸坝排放处理后的污水。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择闸坝', |
| | | isSelectNum: 2, |
| | | selectedNum: 0, |
| | | needSelectID: ['1922914776902742017', '1922914784108556289'], |
| | | selectedID: [], |
| | | show: false, |
| | | }, |
| | | |
| | | { |
| | | useLayerID: '3-2', |
| | | content: '开启园区事故应急池将拦截的污水转输至池内。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择应急池', |
| | |
| | | }, |
| | | |
| | | { |
| | | title: '自定义情景模拟', |
| | | incidentSiteLng: 115.61264639, |
| | | incidentSiteLat: 29.81692806, |
| | | incidentSiteAlt: 19, |
| | |
| | | show: false, |
| | | }, |
| | | { |
| | | useLayerID: '3-2', |
| | | content: '启动应急池的使用,喷淋水将泄漏的化学原料导入厂区事故应急池。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择应急池', |
| | |
| | | show: false, |
| | | }, |
| | | { |
| | | useLayerID: '3-4', |
| | | content: '立即关闭园区排洪渠下游闸坝,拦截污染水体。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择闸坝', |
| | |
| | | }, |
| | | |
| | | { |
| | | useLayerID: '3-4', |
| | | content: '立即关闭园区上游闸坝,拦截清水,减轻应急压力。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择闸坝', |
| | |
| | | }, |
| | | |
| | | { |
| | | useLayerID: '3-2', |
| | | content: '开启园区事故应急池将拦截的污水转输至池内。', |
| | | isNeedHandle: true, |
| | | buttonText: '选择应急池', |
| | |
| | | } |
| | | ] |
| | | |
| | | let curLoadLayerId = null |
| | | |
| | | const nextStep = () => { |
| | | if (curLoadLayerId) { |
| | | EventBus.emit('restHandleDelChange', curLoadLayerId) |
| | | } |
| | | |
| | | mapStore.setStartCustomWx(false) |
| | | curContentInd.value += 1 |
| | | contentData.value.disposeData[curContentInd.value].show = true |
| | | |
| | | if ('useLayerID' in contentData.value.disposeData[curContentInd.value]) { |
| | | curLoadLayerId = contentData.value.disposeData[curContentInd.value].useLayerID |
| | | EventBus.emit('restHandleCheckChange', contentData.value.disposeData[curContentInd.value].useLayerID) |
| | | } else { |
| | | curLoadLayerId = null |
| | | } |
| | | |
| | | if ('needSelectID' in contentData.value.disposeData[curContentInd.value]) { |
| | | mapStore.setNeedSelectID(contentData.value.disposeData[curContentInd.value].needSelectID) |
| | |
| | | } |
| | | } |
| | | |
| | | const selectEquipment = () => { |
| | | mapStore.setStartCustomWx(true) |
| | | } |
| | | |
| | | const cancelFlowDispose = () => { |
| | | clearAll() |
| | | } |
| | | |
| | | watch([isShowSelectBtn, isDisabledNextBtn], ([newData, newDisabledData]) => { |
| | | window.$viewer.tooltip.enable = newData && newDisabledData |
| | | }) |
| | | |
| | | const mouseToolTip = (e) => { |
| | | if (isShowSelectBtn.value) { |
| | | window.$viewer.tooltip.showAt(e.windowPosition, isShowSelectText.value) |
| | | } |
| | | } |
| | | |
| | | window.$viewer.on(DC.MouseEventType.MOUSE_MOVE, mouseToolTip) |
| | | |
| | | onBeforeUnmount(() => { |
| | | clearAll() |
| | | window.$viewer.off(DC.MouseEventType.MOUSE_MOVE, mouseToolTip) |
| | | |
| | | |
| | | dynamicVectorLayer && window.$viewer && window.$viewer.removeLayer(dynamicVectorLayer) |
| | | customVectorLayer && window.$viewer && window.$viewer.removeLayer(customVectorLayer) |
| | |
| | | |
| | | <div v-show="isShowPdContent" class="right-container"> |
| | | <div class="title"> |
| | | 情景模拟 |
| | | {{ contentData?.title }} |
| | | </div> |
| | | |
| | | <div class="content"> |
| | |
| | | <el-button @click="cancelFlowDispose">{{ cancelText }}</el-button> |
| | | <el-button :disabled="isDisabledNextBtn" type="primary" @click="nextStep" |
| | | v-show="isShowNextBtn">下一步</el-button> |
| | | <el-button :disabled="!isDisabledNextBtn" type="primary" v-show="isShowSelectBtn" |
| | | @click="selectEquipment">{{ |
| | | isShowSelectText |
| | | }}</el-button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | display: flex; |
| | | color: #fff; |
| | | |
| | | user-select: none; |
| | | /* 禁止文本选择 */ |
| | | -webkit-user-select: none; |
| | | /* Safari 兼容 */ |
| | | -moz-user-select: none; |
| | | /* Firefox 兼容 */ |
| | | -ms-user-select: none; |
| | | /* IE10+/Edge 兼容 */ |
| | | |
| | | .title { |
| | | line-height: 40px; |
| | | } |