feat: 冰雪阻断事件
This commit is contained in:
nightdays
parent
2059579bd0
commit
c3a32b328d
67
packages/screen/src/views/cockpit/api/DDT.json
Normal file
67
packages/screen/src/views/cockpit/api/DDT.json
Normal file
@ -0,0 +1,67 @@
|
||||
[
|
||||
{
|
||||
"Rid": "4126",
|
||||
"Name": "底图",
|
||||
"Attribute": {
|
||||
"rid": 4126,
|
||||
"name": "底图",
|
||||
"layerId": 0,
|
||||
"internalService": 1,
|
||||
"serviceTypeId": "",
|
||||
"serviceTypeName": "",
|
||||
"servicePath": "",
|
||||
"domainService": "",
|
||||
"status": 0,
|
||||
"parentId": "#",
|
||||
"sortValue": 2,
|
||||
"createTime": "2025-05-26T14:44:05.926Z",
|
||||
"dataType": "1",
|
||||
"bootLoad": 0,
|
||||
"internalServiceName": "",
|
||||
"historyServicePath": "",
|
||||
"expandParam": "",
|
||||
"thumbnail": "",
|
||||
"showDirectory": 0,
|
||||
"selectSubLayer": "",
|
||||
"accessInfo": "",
|
||||
"pcatalog": "DDT",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [
|
||||
{
|
||||
"Rid": "928",
|
||||
"Name": "重庆三维",
|
||||
"Attribute": {
|
||||
"rid": 928,
|
||||
"name": "重庆三维",
|
||||
"layerId": 0,
|
||||
"internalService": 2,
|
||||
"serviceTypeId": "",
|
||||
"serviceTypeName": "WmsServiceLayer",
|
||||
"servicePath": "/ylzggeoserver/gwc/service/wms?service=WMS&version=1.3.0&request=GetMap&layers=chongqing_yx",
|
||||
"domainService": "",
|
||||
"status": 0,
|
||||
"parentId": "4126",
|
||||
"sortValue": 10,
|
||||
"createTime": "2025-10-18T15:04:46.56008Z",
|
||||
"dataType": "2",
|
||||
"bootLoad": 0,
|
||||
"internalServiceName": "",
|
||||
"historyServicePath": "",
|
||||
"expandParam": "{\"mapUseRange\":[\"2D\"],\"data\":[],\"expandedNode\":false,\"isUseExpandParam\":false,\"mapIndex\":1}",
|
||||
"thumbnail": "",
|
||||
"showDirectory": 0,
|
||||
"selectSubLayer": "",
|
||||
"accessInfo": "{\"verifyType\":\"usrpwd\",\"tokenName\":\"token\",\"isUseVerification\":false,\"isUseToken\":false,\"verifyParams\":{\"url\":\"\",\"username\":\"\",\"password\":\"\",\"token\":\"\",\"tokenLoginUrl\":\"\",\"requestType\":\"Get\",\"requestParam\":\"\",\"interval\":60,\"rule\":\"\",\"tokenName\":\"\"}}",
|
||||
"pcatalog": "DDT",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [],
|
||||
"SortValue": 0,
|
||||
"ParentId": ""
|
||||
}
|
||||
],
|
||||
"SortValue": 0,
|
||||
"ParentId": ""
|
||||
}
|
||||
]
|
||||
@ -1,12 +1,37 @@
|
||||
import { request } from '@shared/utils/request'
|
||||
import si from './si.json'
|
||||
import ddt from './DDT.json'
|
||||
|
||||
// 获取业务基础地图
|
||||
export function getBusinessBaseMapLayer() {
|
||||
return request({
|
||||
url: '/snow-ops-platform/dataDirectory/queryCatalog',
|
||||
method: 'GET',
|
||||
params: {
|
||||
pcatalog: 'DDT'
|
||||
export function getBusinessBaseMapDDT() {
|
||||
return [...ddt]
|
||||
// return request({
|
||||
// url: '/snow-ops-platform/dataDirectory/queryCatalog',
|
||||
// method: 'GET',
|
||||
// params: {
|
||||
// pcatalog: 'DDT'
|
||||
// }
|
||||
// })
|
||||
}
|
||||
|
||||
// 获取业务基础地图
|
||||
export function getBusinessBaseMapSI() {
|
||||
return [...si]
|
||||
// return request({
|
||||
// url: '/snow-ops-platform/dataDirectory/queryCatalog',
|
||||
// method: 'GET',
|
||||
// params: {
|
||||
// pcatalog: 'SI'
|
||||
// }
|
||||
// })
|
||||
}
|
||||
|
||||
export function test() {
|
||||
return request({
|
||||
url: '/ylzggeoserver/gwc/service/wms?service=WMS&request=GetMap&transparent=true&srs=EPSG%3A3857&format=image%2Fpng&styles=&layers=chongqing_yx&bbox=12053813.612459153%2C3130860.6785608195%2C12210356.646387197%2C3287403.71248886&width=256&height=256',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
196
packages/screen/src/views/cockpit/api/si.json
Normal file
196
packages/screen/src/views/cockpit/api/si.json
Normal file
@ -0,0 +1,196 @@
|
||||
[
|
||||
{
|
||||
"Rid": "922",
|
||||
"Name": "地图服务",
|
||||
"Attribute": {
|
||||
"id": 922,
|
||||
"name": "地图服务",
|
||||
"externalService": 0,
|
||||
"internalService": 0,
|
||||
"serviceTypeId": null,
|
||||
"serviceTypeName": null,
|
||||
"servicePath": null,
|
||||
"domainService": null,
|
||||
"status": 0,
|
||||
"parentId": "#",
|
||||
"sortValue": 1,
|
||||
"createTime": null,
|
||||
"dataType": "1",
|
||||
"bootLoad": 0,
|
||||
"internalServiceName": null,
|
||||
"historyServicePath": null,
|
||||
"expandParam": null,
|
||||
"thumbnail": null,
|
||||
"showDirectory": 0,
|
||||
"selectSublayer": null,
|
||||
"accessInfo": null,
|
||||
"pcatalog": "SI",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [
|
||||
{
|
||||
"Rid": "936",
|
||||
"Name": "三维模型",
|
||||
"Attribute": {
|
||||
"id": 936,
|
||||
"name": "三维模型",
|
||||
"externalService": 0,
|
||||
"internalService": 0,
|
||||
"serviceTypeId": null,
|
||||
"serviceTypeName": null,
|
||||
"servicePath": null,
|
||||
"domainService": null,
|
||||
"status": 0,
|
||||
"parentId": "922",
|
||||
"sortValue": 1,
|
||||
"createTime": null,
|
||||
"dataType": "1",
|
||||
"bootLoad": 0,
|
||||
"internalServiceName": null,
|
||||
"historyServicePath": null,
|
||||
"expandParam": null,
|
||||
"thumbnail": null,
|
||||
"showDirectory": 0,
|
||||
"selectSublayer": null,
|
||||
"accessInfo": null,
|
||||
"pcatalog": "SI",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [
|
||||
{
|
||||
"Rid": "923",
|
||||
"Name": "S107",
|
||||
"Attribute": {
|
||||
"id": 923,
|
||||
"name": "S107",
|
||||
"externalService": 0,
|
||||
"internalService": 2,
|
||||
"serviceTypeId": null,
|
||||
"serviceTypeName": "Cesium3DTileService",
|
||||
"servicePath": "http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/model/S107/terra_b3dms/tileset.json",
|
||||
"domainService": null,
|
||||
"status": 0,
|
||||
"parentId": "936",
|
||||
"sortValue": 1,
|
||||
"createTime": null,
|
||||
"dataType": "2",
|
||||
"bootLoad": 0,
|
||||
"internalServiceName": null,
|
||||
"historyServicePath": null,
|
||||
"expandParam": "{\"data\":[],\"editUrl\":\"\",\"isUseExpandParam\":false,\"expandedNode\":false,\"mapUseRange\":[\"2D\"]}",
|
||||
"thumbnail": null,
|
||||
"showDirectory": 0,
|
||||
"selectSublayer": null,
|
||||
"accessInfo": "{\"verifyType\":\"usrpwd\",\"tokenName\":\"token\",\"isUseVerification\":false,\"isUseToken\":false,\"verifyParams\":{\"url\":\"\",\"username\":\"\",\"password\":\"\",\"token\":\"\",\"tokenLoginUrl\":\"\",\"requestType\":\"Get\",\"requestParam\":\"\",\"interval\":60,\"rule\":\"\",\"tokenName\":\"\"}}",
|
||||
"pcatalog": "SI",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [],
|
||||
"SortValue": null,
|
||||
"ParentId": null
|
||||
}
|
||||
],
|
||||
"SortValue": null,
|
||||
"ParentId": null
|
||||
},
|
||||
{
|
||||
"Rid": "927",
|
||||
"Name": "行政区划服务",
|
||||
"Attribute": {
|
||||
"id": 927,
|
||||
"name": "行政区划服务",
|
||||
"externalService": 0,
|
||||
"internalService": 2,
|
||||
"serviceTypeId": null,
|
||||
"serviceTypeName": "WmsServiceLayer",
|
||||
"servicePath": "/ylzggeoserver/cite/wms?service=WMS&version=1.3.0&request=GetMap&layers=cite:base_xzqh_geo",
|
||||
"domainService": null,
|
||||
"status": 0,
|
||||
"parentId": "922",
|
||||
"sortValue": 10,
|
||||
"createTime": null,
|
||||
"dataType": "2",
|
||||
"bootLoad": 1,
|
||||
"internalServiceName": null,
|
||||
"historyServicePath": null,
|
||||
"expandParam": "{\"mapUseRange\":[\"2D\"],\"data\":[],\"expandedNode\":false,\"isUseExpandParam\":false,\"mapIndex\":1}",
|
||||
"thumbnail": null,
|
||||
"showDirectory": 0,
|
||||
"selectSublayer": null,
|
||||
"accessInfo": "{\"verifyType\":\"usrpwd\",\"tokenName\":\"token\",\"isUseVerification\":false,\"isUseToken\":false,\"verifyParams\":{\"url\":\"\",\"username\":\"\",\"password\":\"\",\"token\":\"\",\"tokenLoginUrl\":\"\",\"requestType\":\"Get\",\"requestParam\":\"\",\"interval\":60,\"rule\":\"\",\"tokenName\":\"\"}}",
|
||||
"pcatalog": "SI",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [],
|
||||
"SortValue": null,
|
||||
"ParentId": null
|
||||
},
|
||||
{
|
||||
"Rid": "940",
|
||||
"Name": "管理段路线名称",
|
||||
"Attribute": {
|
||||
"id": 940,
|
||||
"name": "管理段路线名称",
|
||||
"externalService": 0,
|
||||
"internalService": 2,
|
||||
"serviceTypeId": null,
|
||||
"serviceTypeName": "WmsServiceLayer",
|
||||
"servicePath": "/ylzggeoserver/cite/wms?service=WMS&version=1.3.0&request=GetMap&layers=cite:nianbao_2024_3857_lxbq&cql_filter=XZQH_ID%3D%27402880e74a28b152014a28b885c60000%27",
|
||||
"domainService": null,
|
||||
"status": 0,
|
||||
"parentId": "922",
|
||||
"sortValue": 16,
|
||||
"createTime": null,
|
||||
"dataType": "2",
|
||||
"bootLoad": 1,
|
||||
"internalServiceName": null,
|
||||
"historyServicePath": null,
|
||||
"expandParam": "{\"mapUseRange\":[\"2D\"],\"data\":[],\"expandedNode\":false,\"isUseExpandParam\":false,\"mapIndex\":1}",
|
||||
"thumbnail": null,
|
||||
"showDirectory": 0,
|
||||
"selectSublayer": null,
|
||||
"accessInfo": "{\"verifyType\":\"usrpwd\",\"tokenName\":\"token\",\"isUseVerification\":false,\"isUseToken\":false,\"verifyParams\":{\"url\":\"\",\"username\":\"\",\"password\":\"\",\"token\":\"\",\"tokenLoginUrl\":\"\",\"requestType\":\"Get\",\"requestParam\":\"\",\"interval\":60,\"rule\":\"\",\"tokenName\":\"\"}}",
|
||||
"pcatalog": "SI",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [],
|
||||
"SortValue": null,
|
||||
"ParentId": null
|
||||
},
|
||||
{
|
||||
"Rid": "937",
|
||||
"Name": "管理段",
|
||||
"Attribute": {
|
||||
"id": 937,
|
||||
"name": "管理段",
|
||||
"externalService": 0,
|
||||
"internalService": 2,
|
||||
"serviceTypeId": null,
|
||||
"serviceTypeName": "WmsServiceLayer",
|
||||
"servicePath": "/ylzggeoserver/cite/wms?service=WMS&version=1.3.0&request=GetMap&layers=cite:nianbao_2024_3857&cql_filter=XZQH_ID%3D%27402880e74a28b152014a28b885c60000%27",
|
||||
"domainService": null,
|
||||
"status": 0,
|
||||
"parentId": "922",
|
||||
"sortValue": 16,
|
||||
"createTime": null,
|
||||
"dataType": "2",
|
||||
"bootLoad": 1,
|
||||
"internalServiceName": null,
|
||||
"historyServicePath": null,
|
||||
"expandParam": "{\"mapUseRange\":[\"2D\"],\"data\":[],\"expandedNode\":false,\"isUseExpandParam\":false,\"mapIndex\":1}",
|
||||
"thumbnail": null,
|
||||
"showDirectory": 0,
|
||||
"selectSublayer": null,
|
||||
"accessInfo": "{\"verifyType\":\"usrpwd\",\"tokenName\":\"token\",\"isUseVerification\":false,\"isUseToken\":false,\"verifyParams\":{\"url\":\"\",\"username\":\"\",\"password\":\"\",\"token\":\"\",\"tokenLoginUrl\":\"\",\"requestType\":\"Get\",\"requestParam\":\"\",\"interval\":60,\"rule\":\"\",\"tokenName\":\"\"}}",
|
||||
"pcatalog": "SI",
|
||||
"orgCode": "YLZG"
|
||||
},
|
||||
"Children": [],
|
||||
"SortValue": null,
|
||||
"ParentId": null
|
||||
}
|
||||
],
|
||||
"SortValue": null,
|
||||
"ParentId": null
|
||||
}
|
||||
]
|
||||
@ -1,27 +1,18 @@
|
||||
<template>
|
||||
<transition name="fade">
|
||||
<div
|
||||
v-if="visible && position"
|
||||
class="common-tooltip"
|
||||
:style="{
|
||||
<div v-if="visible && position" class="common-tooltip" :style="{
|
||||
left: `${position.x}px`,
|
||||
top: `${position.y - 20}px`
|
||||
}"
|
||||
>
|
||||
|
||||
}">
|
||||
<span class="title">{{ title }}</span>
|
||||
<!-- 关闭按钮 -->
|
||||
<button
|
||||
class="close-button"
|
||||
type="button"
|
||||
aria-label="关闭"
|
||||
@click="handleClose"
|
||||
>
|
||||
<button class="close-button" type="button" aria-label="关闭" @click="handleClose">
|
||||
×
|
||||
</button>
|
||||
|
||||
<!-- 内容区域 -->
|
||||
<div class="tooltip-content">
|
||||
<component v-if="hasData" :is="contentMap[data.mapData.layer]" />
|
||||
<component v-if="hasData" :is="contentMap[data.mapData.layerId]" :data="data" />
|
||||
|
||||
<!-- 如果没有数据 -->
|
||||
<div v-if="!hasData" class="no-data">
|
||||
@ -44,7 +35,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from 'vue'
|
||||
import { computed, ref } from 'vue'
|
||||
import serviceFacility from './serviceFacility.vue'
|
||||
import riskRoad from './riskRoad.vue'
|
||||
import weatherAlert from './weatherAlert.vue'
|
||||
@ -126,6 +117,21 @@ const hasData = computed(() => {
|
||||
return !!props.data
|
||||
})
|
||||
|
||||
const title = computed(() => {
|
||||
if (props.data.mapData.layerId === 'serviceFacility') {
|
||||
return '养护站'
|
||||
}
|
||||
if (props.data.mapData.layerId === 'riskRoad') {
|
||||
return '高海拔路段'
|
||||
}
|
||||
if (props.data.mapData.layerId === 'blockEvent') {
|
||||
return '阻断事件'
|
||||
}
|
||||
if (props.data.mapData.layerId === 'weatherAlert') {
|
||||
return '气象预警'
|
||||
}
|
||||
})
|
||||
|
||||
// ==================== Methods ====================
|
||||
|
||||
/**
|
||||
@ -159,9 +165,7 @@ const handleClose = () => {
|
||||
|
||||
// 上下 padding 需要容纳顶部和底部图片 + 内容间距
|
||||
// 左右 padding 保持一致
|
||||
padding: calc(var(--tooltip-top-height))
|
||||
var(--tooltip-side-padding)
|
||||
calc(var(--tooltip-bottom-height));
|
||||
padding: calc(var(--tooltip-top-height)) var(--tooltip-side-padding) calc(var(--tooltip-bottom-height));
|
||||
|
||||
// 三段式可拉伸背景：顶部固定高度、中部可拉伸、底部固定高度
|
||||
background-image:
|
||||
@ -212,6 +216,25 @@ const handleClose = () => {
|
||||
// }
|
||||
}
|
||||
|
||||
.title {
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
left: 20px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
padding: 0;
|
||||
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
line-height: 22px;
|
||||
text-shadow: 0px 0px 20px #079DFF;
|
||||
text-align: right;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
// 关闭按钮 - 仅作为透明点击热区，视觉由背景图中的关闭图标承载
|
||||
.close-button {
|
||||
position: absolute;
|
||||
|
||||
@ -1,24 +1,51 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div v-if="data.qxmc" class="info-item">
|
||||
<span class="label">区县:</span>
|
||||
<span class="value">{{ data.qxmc }}</span>
|
||||
<div class="content" v-if="data">
|
||||
<div class="info-item">
|
||||
<span class="label">名称:</span>
|
||||
<span class="value">{{ data.mc }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="data.yjllpz" class="info-item">
|
||||
<span class="label">应急力量配置:</span>
|
||||
<div class="flex">
|
||||
<div class="info-item">
|
||||
<span class="label">所属区县：</span>
|
||||
<span class="value">{{ data.yjllpz }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="data.wzQtwz" class="info-item">
|
||||
<span class="label">物资:</span>
|
||||
<span class="value">{{ data.wzQtwz }}</span>
|
||||
<div class="info-item">
|
||||
<span class="label">应急物资：</span>
|
||||
<span class="value">{{ data.wz }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { onMounted, ref } from 'vue';
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
@use '@/styles/mixins.scss' as *;
|
||||
|
||||
// 信息项
|
||||
.info-item {
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.label {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,12 +1,38 @@
|
||||
import { getBusinessBaseMapLayer } from '@/views/cockpit/api/commonHttp.js'
|
||||
import { getBusinessBaseMapDDT, getBusinessBaseMapSI, test } from '@/views/cockpit/api/commonHttp.js'
|
||||
|
||||
// 当前页面的最基础地图服务
|
||||
// 主要是加载地图底图
|
||||
export const useMapBase = (mapStore) => {
|
||||
|
||||
const loadBusinessBaseMapLayer = async () => {
|
||||
const loadBusinessBaseMapDDT = async () => {
|
||||
const layerService = mapStore.services().layer
|
||||
const res = await getBusinessBaseMapLayer()
|
||||
const res = await getBusinessBaseMapDDT()
|
||||
const data = [...res]
|
||||
mapStore.baseMapGroups = data
|
||||
for (const item of data) {
|
||||
const layers = mapStore.getBaseMapLayersForGroup(item.Attribute?.rid || item.Rid)
|
||||
for (const layerConfig of layers) {
|
||||
const layer = {
|
||||
id: layerConfig.id,
|
||||
type: layerConfig.type,
|
||||
url: layerConfig.url,
|
||||
meta: layerConfig.meta,
|
||||
options: {
|
||||
parameters: {
|
||||
srs: 'EPSG:3857',
|
||||
transparent: true,
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
await layerService.addLayer(layer)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const loadBusinessBaseMapLayerSI = async () => {
|
||||
const layerService = mapStore.services().layer
|
||||
const res = await getBusinessBaseMapSI()
|
||||
const data = [...res]
|
||||
mapStore.baseMapGroups = data
|
||||
for (const item of data) {
|
||||
@ -21,13 +47,13 @@ export const useMapBase = (mapStore) => {
|
||||
await layerService.addLayer(layer)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
const loadBaseData = () => {
|
||||
setTimeout(() => {
|
||||
loadBusinessBaseMapLayer()
|
||||
// loadBusinessBaseMapDDT()
|
||||
// test()
|
||||
loadBusinessBaseMapLayerSI()
|
||||
}, 0)
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user