diff --git a/src/api/api.ts b/src/api/api.ts index 004ba16..1f30fe0 100644 --- a/src/api/api.ts +++ b/src/api/api.ts @@ -2,9 +2,11 @@ import type { DisasterType } from '@/types/common/DisasterType.ts' import { getSm2PublicKey } from './crypto' import { getBasePoins as getHiddenDangerBasePoints, getPointDetailById as getHiddenDangerPointDetailById} from './hidden-danger-spots' import { getBasePoins as getRiskBasePoints, getPointDetailById as getRiskPointDetailById} from './risk-spots' +import { getBasePoins as getHospitalsBasePoints, getPointDetailById as getHospitalsPointDetailById} from './hospitals' import type { ApiResponse } from '@/types/ApiResponse' import type { XianHiddenDangerSpots } from '@/types/base/XianHiddenDangerSpots' import type { XianRiskSpots } from '@/types/base/XianRiskSpots' +import type { XianHospitals } from '@/types/base/XianHospitals' /** * API接口统一导出对象 @@ -52,4 +54,20 @@ export const $api = { */ getPointDetailById: (id: number): Promise> => getRiskPointDetailById(id), }, + + // 医院信息 + hospitals: { + /** + * 获取所有基础医院 + * @returns 医院数据数组 + */ + getBasePoins: (): Promise> => getHospitalsBasePoints(), + + /** + * 根据id获取医院详情 + * @param id - 医院id + * @returns 医院详情 + */ + getPointDetailById: (id: number): Promise> => getHospitalsPointDetailById(id), + }, } diff --git a/src/api/hospitals.ts b/src/api/hospitals.ts new file mode 100644 index 0000000..f003a12 --- /dev/null +++ b/src/api/hospitals.ts @@ -0,0 +1,20 @@ +import type { ApiResponse } from "@/types/ApiResponse" +import type { XianHospitals } from "@/types/base/XianHospitals" +import httpInstance from "@/utils/request/http" + +/** + * 获取医院基础数据 + * @returns 医院数据数组 + */ +export const getBasePoins = (): Promise> => { + return httpInstance.get('/hospitals/base-points') +} + +/** + * 根据id获取医院详情 + * @param id - 医院id + * @returns 医院详情 + */ +export const getPointDetailById = (id: number): Promise> => { + return httpInstance.get(`/hospitals/point-detail/${id}`) +} diff --git a/src/assets/images/icon/hospital.png b/src/assets/images/icon/hospital.png new file mode 100644 index 0000000..c201188 Binary files /dev/null and b/src/assets/images/icon/hospital.png differ diff --git a/src/assets/index.ts b/src/assets/index.ts index a91ce36..8d4ada1 100644 --- a/src/assets/index.ts +++ b/src/assets/index.ts @@ -6,6 +6,7 @@ export { default as waterLoggingIcon } from '@/assets/images/icon/waterlogging.p export { default as debrisFlowIcon } from '@/assets/images/icon/debris-flow.png'; export { default as flashFloodIcon } from '@/assets/images/icon/flash-flood.png'; export { default as riskAreaIcon } from '@/assets/images/icon/risk-area.png'; +export { default as hospitalIcon } from '@/assets/images/icon/hospital.png'; // 图片 export { default as backgroundImage } from '@/assets/images/background-image.png'; diff --git a/src/component/map/MapComponent.vue b/src/component/map/MapComponent.vue index 7d8cdfb..5a48a06 100644 --- a/src/component/map/MapComponent.vue +++ b/src/component/map/MapComponent.vue @@ -2,7 +2,12 @@
- + + + diff --git a/src/component/rain-earthquake/DisasterChainPointComponent.vue b/src/component/rain-earthquake/DisasterChainPointComponent.vue index 2b978ce..562c245 100644 --- a/src/component/rain-earthquake/DisasterChainPointComponent.vue +++ b/src/component/rain-earthquake/DisasterChainPointComponent.vue @@ -6,15 +6,15 @@ type="primary" @click="changeStatus" circle - :title="`${useStatusStore().uiComponents.disasterChainPointShow ? '关闭' : '打开'}灾害链影响点列表`" + :title="`${useStatusStore().uiComponents.disasterChainPointShow.show ? '关闭' : '打开'}灾害链影响点列表`" >{{ - useStatusStore().uiComponents.disasterChainPointShow ? '-' : '+' + useStatusStore().uiComponents.disasterChainPointShow.show ? '-' : '+' }}
灾害链影响点列表 @@ -124,8 +124,8 @@ // 切换面板显示状态 const changeStatus = () => { - useStatusStore().uiComponents.disasterChainPointShow = - !useStatusStore().uiComponents.disasterChainPointShow; + useStatusStore().uiComponents.disasterChainPointShow.show = + !useStatusStore().uiComponents.disasterChainPointShow.show; }; // 上一页 diff --git a/src/component/rain-earthquake/HiddenPointComponent.vue b/src/component/rain-earthquake/HiddenPointComponent.vue index 993dd79..fb7bb3a 100644 --- a/src/component/rain-earthquake/HiddenPointComponent.vue +++ b/src/component/rain-earthquake/HiddenPointComponent.vue @@ -15,13 +15,11 @@
@@ -62,14 +60,14 @@ // 监听id变化 watch( - () => useLoadingInformationStore().getHiddenPointId(), + () => useLoadingInformationStore().hiddenPoint.id, async (newId: number) => { if (newId === -1) { return; } // 获取隐患点数据 - const clickObject = useLoadingInformationStore().getClickObject(); + const clickObject = useLoadingInformationStore().clickObject; if (!clickObject || !clickObject.primitive) { console.warn('点击对象或图元不存在'); @@ -77,7 +75,7 @@ } const res = await $api.hiddenDangerSpots.getPointDetailById( - useLoadingInformationStore().getHiddenPointId() + useLoadingInformationStore().hiddenPoint.id ); // 更新数据 @@ -93,9 +91,7 @@ offsetY.value = screenPos.y; // 显示新的信息框 - useLoadingInformationStore().setLoadingHiddenPointInformationStatus( - true - ); + useLoadingInformationStore().hiddenPoint.loading = true; } catch (error) { throw new Error(`坐标转换失败:${error}`); } diff --git a/src/component/rain-earthquake/HospitalComponent.vue b/src/component/rain-earthquake/HospitalComponent.vue new file mode 100644 index 0000000..a20843d --- /dev/null +++ b/src/component/rain-earthquake/HospitalComponent.vue @@ -0,0 +1,95 @@ + + + + + + diff --git a/src/component/rain-earthquake/LeftButtonComponent.vue b/src/component/rain-earthquake/LeftButtonComponent.vue index 94fc337..2f23ea4 100644 --- a/src/component/rain-earthquake/LeftButtonComponent.vue +++ b/src/component/rain-earthquake/LeftButtonComponent.vue @@ -2,7 +2,7 @@
    diff --git a/src/component/rain-earthquake/LegendComponent.vue b/src/component/rain-earthquake/LegendComponent.vue index 1b04813..d1e9c9f 100644 --- a/src/component/rain-earthquake/LegendComponent.vue +++ b/src/component/rain-earthquake/LegendComponent.vue @@ -4,17 +4,22 @@
    {{ useStatusStore().uiComponents.legendShow ? '-' : '+' }}{{ + useStatusStore().uiComponents.legendShow.show ? '-' : '+' + }}
    -
    +
    图例
    @@ -55,8 +60,8 @@ // 切换图例显示状态 const changeStatus = () => { - useStatusStore().uiComponents.legendShow = - !useStatusStore().uiComponents.legendShow; + useStatusStore().uiComponents.legendShow.show = + !useStatusStore().uiComponents.legendShow.show; }; onMounted(() => { diff --git a/src/component/rain-earthquake/RiskPointComponent.vue b/src/component/rain-earthquake/RiskPointComponent.vue index 78cccd0..74a291c 100644 --- a/src/component/rain-earthquake/RiskPointComponent.vue +++ b/src/component/rain-earthquake/RiskPointComponent.vue @@ -15,11 +15,11 @@
    @@ -53,13 +53,13 @@ // 监听id变化 watch( - () => useLoadingInformationStore().getRiskPointId(), + () => useLoadingInformationStore().riskPoint.id, async (newId: number) => { if (newId === -1) { return; } // 获取风险点数据 - const clickObject = useLoadingInformationStore().getClickObject(); + const clickObject = useLoadingInformationStore().clickObject; if (!clickObject || !clickObject.primitive) { console.warn('点击对象或图元不存在'); @@ -67,7 +67,7 @@ } const res = await $api.riskSpots.getPointDetailById( - useLoadingInformationStore().getRiskPointId() + useLoadingInformationStore().riskPoint.id ); // 更新数据 @@ -82,7 +82,7 @@ offsetY.value = screenPos.y; // 显示新的信息框 - useLoadingInformationStore().setLoadingRiskPointInformationStatus(true); + useLoadingInformationStore().riskPoint.loading = true; } catch (error) { throw new Error(`坐标转换失败:${error}`); } diff --git a/src/config/config.json b/src/config/config.json index 11182b6..85e9cdd 100644 --- a/src/config/config.json +++ b/src/config/config.json @@ -35,6 +35,7 @@ }, "prefix": { "hiddenDangerPointId": "hidden-danger-point-", - "riskPointId": "risk-point-" + "riskPointId": "risk-point-", + "hospitalPointId": "hospital-point-" } } \ No newline at end of file diff --git a/src/hooks/earthquake/useEarthquakeDisasterChain.ts b/src/hooks/earthquake/useEarthquakeDisasterChain.ts index f504e18..4484c88 100644 --- a/src/hooks/earthquake/useEarthquakeDisasterChain.ts +++ b/src/hooks/earthquake/useEarthquakeDisasterChain.ts @@ -176,113 +176,133 @@ export const useEarthquakeDisasterChain = () => { ]; // ================控制面板================================ - const controlPanel = ref([ - { - name: '显示隐患点', - selected: useStatusStore().mapLayers.hiddenDangerPointShow, - callback: useLayerControl().clickHiddenDangerPoint, - }, - { - name: '显示医院', - selected: useStatusStore().poiLayers.showHospital, - callback: () => { - console.log('显示医院'); - }, - }, - { - name: '显示危险源', - selected: useStatusStore().poiLayers.showDangerSource, - callback: () => { - console.log('显示危险源'); - }, - }, - { - name: '显示避难所', - selected: useStatusStore().poiLayers.showRefugeeShelter, - callback: () => { - console.log('显示避难所'); - }, - }, - { - name: '显示消防站', - selected: useStatusStore().poiLayers.showFireStation, - callback: () => { - console.log('显示消防站'); - }, - }, - { - name: '显示储备点', - selected: useStatusStore().poiLayers.showReservePoint, - callback: () => { - console.log('显示储备点'); - }, - }, - { - name: '显示学校', - selected: useStatusStore().poiLayers.showSchool, - callback: () => { - console.log('显示学校'); - }, - }, - { - name: '显示人口网格', - selected: useStatusStore().poiLayers.showPopulationGrid, - callback: () => { - console.log('显示人口网格'); - }, - }, - { - name: '显示管网系统', - selected: useStatusStore().infrastructureLayers.showNetworkSystem, - callback: () => { - console.log('显示管网系统'); - }, - }, - { - name: '显示交通道路', - selected: useStatusStore().infrastructureLayers.showTrafficRoad, - callback: () => { - console.log('显示交通道路'); - }, - }, - { - name: '显示桥梁', - selected: useStatusStore().infrastructureLayers.showBridge, - callback: () => { - console.log('显示桥梁'); - }, - }, - { - name: '显示高速', - selected: useStatusStore().infrastructureLayers.showHighway, - callback: () => { - console.log('显示高速'); - }, - }, - { - name: '显示国道', - selected: useStatusStore().infrastructureLayers.showMainRoad, - callback: () => { - console.log('显示国道'); - }, - }, - { - name: '显示水库', - selected: useStatusStore().infrastructureLayers.showReservoir, - callback: () => { - console.log('显示水库'); - }, - }, - { - name: '显示地铁站', - selected: useStatusStore().infrastructureLayers.showReservoir, - callback: () => { - console.log('显示地铁站'); - }, - }, - ]); + /** + * 控制面板信息 + */ + const getControlPanel = () => { + const statusStore = useStatusStore(); + const layerControl = useLayerControl(); + + return [ + { + name: '显示隐患点', + statusStore: statusStore.mapLayers, + statusKey: 'hiddenDangerPointShow' as const, + callback: layerControl.clickHiddenDangerPoint, + }, + { + name: '显示医院', + statusStore: statusStore.poiLayers, + statusKey: 'showHospital' as const, + callback: layerControl.clickHospital, + }, + { + name: '显示危险源', + statusStore: statusStore.poiLayers, + statusKey: 'showDangerSource' as const, + callback: (status: unknown) => { + console.log('显示危险源', status); + }, + }, + { + name: '显示避难所', + statusStore: statusStore.poiLayers, + statusKey: 'showRefugeeShelter' as const, + callback: (status: unknown) => { + console.log('显示避难所', status); + }, + }, + { + name: '显示消防站', + statusStore: statusStore.poiLayers, + statusKey: 'showFireStation' as const, + callback: (status: unknown) => { + console.log('显示消防站', status); + }, + }, + { + name: '显示储备点', + statusStore: statusStore.poiLayers, + statusKey: 'showReservePoint' as const, + callback: (status: unknown) => { + console.log('显示储备点', status); + }, + }, + { + name: '显示学校', + statusStore: statusStore.poiLayers, + statusKey: 'showSchool' as const, + callback: (status: unknown) => { + console.log('显示学校', status); + }, + }, + { + name: '显示人口网格', + statusStore: statusStore.poiLayers, + statusKey: 'showPopulationGrid' as const, + callback: (status: unknown) => { + console.log('显示人口网格', status); + }, + }, + { + name: '显示管网系统', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showNetworkSystem' as const, + callback: (status: unknown) => { + console.log('显示管网系统', status); + }, + }, + { + name: '显示交通道路', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showTrafficRoad' as const, + callback: (status: unknown) => { + console.log('显示交通道路', status); + }, + }, + { + name: '显示桥梁', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showBridge' as const, + callback: (status: unknown) => { + console.log('显示桥梁', status); + }, + }, + { + name: '显示高速', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showHighway' as const, + callback: (status: unknown) => { + console.log('显示高速', status); + }, + }, + { + name: '显示国道', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showMainRoad' as const, + callback: (status: unknown) => { + console.log('显示国道', status); + }, + }, + { + name: '显示水库', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showReservoir' as const, + callback: (status: unknown) => { + console.log('显示水库', status); + }, + }, + { + name: '显示地铁站', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showReservoir' as const, + callback: (status: unknown) => { + console.log('显示地铁站', status); + }, + }, + ]; + }; - // 把所有需要用到的数据/方法 return 出去 return { conditions, selectOptions, @@ -292,7 +312,7 @@ export const useEarthquakeDisasterChain = () => { legendList, leftButtonInfo, rightButtonInfo, - controlPanel, + controlPanel: getControlPanel(), changeConditions, changeCurrentPage, }; diff --git a/src/hooks/map/useMap.ts b/src/hooks/map/useMap.ts index 1e5a100..f0a26f7 100644 --- a/src/hooks/map/useMap.ts +++ b/src/hooks/map/useMap.ts @@ -23,24 +23,35 @@ export const useMap = () => { // 当id改变时候，重置状态 if ( - useLoadingInformationStore().getHiddenPointId() !== id && - useLoadingInformationStore().getRiskPointId() !== id + useLoadingInformationStore().hiddenPoint.id !== id && + useLoadingInformationStore().riskPoint.id !== id && + useLoadingInformationStore().hospital.id !== id ) { useLoadingInformationStore().resetStatue(); } // 点击对象 - useLoadingInformationStore().setClickObject(pickedObject); + useLoadingInformationStore().clickObject.id = pickedObject.id; + useLoadingInformationStore().clickObject.primitive = + pickedObject.primitive; // 隐患点 if (pickedObject.id.startsWith(config.prefix.hiddenDangerPointId)) { - useLoadingInformationStore().setHiddenPointId(id); + useLoadingInformationStore().hiddenPoint.id = id; } // 风险点 else if (pickedObject.id.startsWith(config.prefix.riskPointId)) { - useLoadingInformationStore().setRiskPointId(id); - } else { + useLoadingInformationStore().riskPoint.id = id; + } + + // 医院 + else if (pickedObject.id.startsWith(config.prefix.hospitalPointId)) { + useLoadingInformationStore().hospital.id = id; + } + + // 其他 + else { // 重置状态 useLoadingInformationStore().resetStatue(); } diff --git a/src/hooks/rain-earthquake/useHospitalPoint.ts b/src/hooks/rain-earthquake/useHospitalPoint.ts new file mode 100644 index 0000000..f4d3862 --- /dev/null +++ b/src/hooks/rain-earthquake/useHospitalPoint.ts @@ -0,0 +1,31 @@ +import { hospitalIcon } from '@/assets'; + +/** + * 医院相关钩子函数 + * @returns + */ +export const useHospitalPoint = () => { + /** + * 字段映射配置 + */ + const field = { + name: '医院名称', + level: '级别', + address: '地理位置', + lon: '经度', + lat: '纬度', + sumPeople: '年度诊疗人数', + unitHead: '负责人', + telephone: '手机号', + }; + + /** + * 获取医院图标 + * @returns 图标路径 + */ + function getDisasterIcon(): string { + return hospitalIcon; + } + + return { field, getDisasterIcon }; +}; diff --git a/src/hooks/rainstorm/useRainDisasterChain.ts b/src/hooks/rainstorm/useRainDisasterChain.ts index 409eb5c..7d08fb2 100644 --- a/src/hooks/rainstorm/useRainDisasterChain.ts +++ b/src/hooks/rainstorm/useRainDisasterChain.ts @@ -12,6 +12,7 @@ import { riskAreaIcon, waterLoggingIcon, } from '@/assets'; +import { useLayerControl } from '../useLayerControl'; /** * 暴雨灾害链 @@ -211,108 +212,127 @@ export const useRainDisasterChain = () => { /** * 控制面板信息 */ - const controlPanel = [ - { - name: '显示医院', - selected: useStatusStore().poiLayers.showHospital, - callback: () => { - console.log('显示医院'); - }, - }, - { - name: '显示危险源', - selected: useStatusStore().poiLayers.showDangerSource, - callback: () => { - console.log('显示危险源'); - }, - }, - { - name: '显示避难所', - selected: useStatusStore().poiLayers.showRefugeeShelter, - callback: () => { - console.log('显示避难所'); - }, - }, - { - name: '显示消防站', - selected: useStatusStore().poiLayers.showFireStation, - callback: () => { - console.log('显示消防站'); - }, - }, - { - name: '显示储备点', - selected: useStatusStore().poiLayers.showReservePoint, - callback: () => { - console.log('显示储备点'); - }, - }, - { - name: '显示学校', - selected: useStatusStore().poiLayers.showSchool, - callback: () => { - console.log('显示学校'); - }, - }, - { - name: '显示人口网格', - selected: useStatusStore().poiLayers.showPopulationGrid, - callback: () => { - console.log('显示人口网格'); - }, - }, - { - name: '显示管网系统', - selected: useStatusStore().infrastructureLayers.showNetworkSystem, - callback: () => { - console.log('显示管网系统'); - }, - }, - { - name: '显示交通道路', - selected: useStatusStore().infrastructureLayers.showTrafficRoad, - callback: () => { - console.log('显示交通道路'); - }, - }, - { - name: '显示桥梁', - selected: useStatusStore().infrastructureLayers.showBridge, - callback: () => { - console.log('显示桥梁'); - }, - }, - { - name: '显示高速', - selected: useStatusStore().infrastructureLayers.showHighway, - callback: () => { - console.log('显示高速'); - }, - }, - { - name: '显示国道', - selected: useStatusStore().infrastructureLayers.showMainRoad, - callback: () => { - console.log('显示国道'); - }, - }, - { - name: '显示水库', - selected: useStatusStore().infrastructureLayers.showReservoir, - callback: () => { - console.log('显示水库'); - }, - }, - { - name: '显示地铁站', - selected: useStatusStore().infrastructureLayers.showReservoir, - callback: () => { - console.log('显示地铁站'); - }, - }, - ]; + /** + * 控制面板信息 + */ + const getControlPanel = () => { + const statusStore = useStatusStore(); + const layerControl = useLayerControl(); + + return [ + { + name: '显示医院', + statusStore: statusStore.poiLayers, + statusKey: 'showHospital' as const, + callback: layerControl.clickHospital, + }, + { + name: '显示危险源', + statusStore: statusStore.poiLayers, + statusKey: 'showDangerSource' as const, + callback: (status: unknown) => { + console.log('显示危险源', status); + }, + }, + { + name: '显示避难所', + statusStore: statusStore.poiLayers, + statusKey: 'showRefugeeShelter' as const, + callback: (status: unknown) => { + console.log('显示避难所', status); + }, + }, + { + name: '显示消防站', + statusStore: statusStore.poiLayers, + statusKey: 'showFireStation' as const, + callback: (status: unknown) => { + console.log('显示消防站', status); + }, + }, + { + name: '显示储备点', + statusStore: statusStore.poiLayers, + statusKey: 'showReservePoint' as const, + callback: (status: unknown) => { + console.log('显示储备点', status); + }, + }, + { + name: '显示学校', + statusStore: statusStore.poiLayers, + statusKey: 'showSchool' as const, + callback: (status: unknown) => { + console.log('显示学校', status); + }, + }, + { + name: '显示人口网格', + statusStore: statusStore.poiLayers, + statusKey: 'showPopulationGrid' as const, + callback: (status: unknown) => { + console.log('显示人口网格', status); + }, + }, + { + name: '显示管网系统', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showNetworkSystem' as const, + callback: (status: unknown) => { + console.log('显示管网系统', status); + }, + }, + { + name: '显示交通道路', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showTrafficRoad' as const, + callback: (status: unknown) => { + console.log('显示交通道路', status); + }, + }, + { + name: '显示桥梁', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showBridge' as const, + callback: (status: unknown) => { + console.log('显示桥梁', status); + }, + }, + { + name: '显示高速', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showHighway' as const, + callback: (status: unknown) => { + console.log('显示高速', status); + }, + }, + { + name: '显示国道', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showMainRoad' as const, + callback: (status: unknown) => { + console.log('显示国道', status); + }, + }, + { + name: '显示水库', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showReservoir' as const, + callback: (status: unknown) => { + console.log('显示水库', status); + }, + }, + { + name: '显示地铁站', + statusStore: statusStore.infrastructureLayers, + statusKey: 'showReservoir' as const, + callback: (status: unknown) => { + console.log('显示地铁站', status); + }, + }, + ]; + }; - // 把所有需要用到的数据/方法 return 出去 return { conditions, selectOptions, @@ -322,8 +342,8 @@ export const useRainDisasterChain = () => { legendList, leftButtonInfo, rightButtonInfo, - controlPanel, changeConditions, changeCurrentPage, + controlPanel: getControlPanel(), }; }; diff --git a/src/hooks/useLayerControl.ts b/src/hooks/useLayerControl.ts index ada716d..35314d1 100644 --- a/src/hooks/useLayerControl.ts +++ b/src/hooks/useLayerControl.ts @@ -1,4 +1,5 @@ import { useLoadingResourceStore } from '@/stores/useLoadingResourceStore'; +import { useStatusStore } from '@/stores/useStatusStore'; import { LoadingResource } from '@/types/common/LoadingResourceType'; import { CesiumUtilsSingleton } from '@/utils/cesium/CesiumUtils'; @@ -38,5 +39,23 @@ export const useLayerControl = () => { } }; - return { clickHiddenDangerPoint }; + /** + * 点击显示医院 + */ + const clickHospital = (status: unknown) => { + if (status as boolean) { + useStatusStore().poiLayers.showHospital.loading = true; + // 显示医院 + CesiumUtilsSingleton.batchShowPrimitives( + useLoadingResourceStore().getLoadingResource(LoadingResource.HOSPITAL) + ); + } else { + // 隐藏医院 + CesiumUtilsSingleton.batchHidePrimitives( + useLoadingResourceStore().getLoadingResource(LoadingResource.HOSPITAL) + ); + } + }; + + return { clickHiddenDangerPoint, clickHospital }; }; diff --git a/src/stores/useLoadingInformation.ts b/src/stores/useLoadingInformation.ts index c3e5c66..fa6243f 100644 --- a/src/stores/useLoadingInformation.ts +++ b/src/stores/useLoadingInformation.ts @@ -1,122 +1,84 @@ import type { ClickObject } from '@/types/cesium/ClickObject'; import { defineStore } from 'pinia'; -import { type Ref, ref } from 'vue'; +import { reactive } from 'vue'; /** * 加载信息弹窗相关状态管理 - * @returns 点击对象、隐患点/风险点状态及相关方法 + * @returns 点击对象、隐患点/风险点/医院状态及相关方法 */ export const useLoadingInformationStore = defineStore( 'loadingInformation', () => { + // ============================ 点击对象状态 ================================ + /** * 点击的对象 */ - const clickObject: Ref = ref({ id: '', primitive: null }); + const clickObject = reactive({ id: '', primitive: null }); + + // ============================ 隐患点加载状态 ================================ /** - * 隐患点加载状态 + * 隐患点加载信息状态 */ - const loadingHiddenPointInformationStatus: Ref = ref(false); - /** - * 隐患点ID - */ - const hiddenPointId: Ref = ref(-1); + const hiddenPoint = reactive({ + /** 加载状态 */ + loading: false, + /** 隐患点ID */ + id: -1, + }); + + // ============================ 风险点加载状态 ================================ /** - * 风险点加载状态 + * 风险点加载信息状态 */ - const loadingRiskPointInformationStatus: Ref = ref(false); - /** - * 风险点ID - */ - const riskPointId: Ref = ref(-1); + const riskPoint = reactive({ + /** 加载状态 */ + loading: false, + /** 风险点ID */ + id: -1, + }); + + // ============================ 医院加载状态 ================================ /** - * 重置状态 + * 医院加载信息状态 + */ + const hospital = reactive({ + /** 加载状态 */ + loading: false, + /** 医院ID */ + id: -1, + }); + + /** + * 重置所有状态 */ const resetStatue = () => { - loadingHiddenPointInformationStatus.value = false; - hiddenPointId.value = -1; - loadingRiskPointInformationStatus.value = false; - riskPointId.value = -1; - }; + // 点击对象重置 + clickObject.id = ''; + clickObject.primitive = null; - /** - * 获取点击对象 - * @returns 点击对象 - */ - const getClickObject = () => clickObject.value; - /** - * 设置点击对象 - * @param value - 点击对象 - */ - const setClickObject = (value: ClickObject) => { - clickObject.value = value; - }; - /** - * 获取隐患点加载状态 - * @returns 加载状态 - */ - const getLoadingHiddenPointInformationStatus = () => - loadingHiddenPointInformationStatus.value; - /** - * 设置隐患点加载状态 - * @param value - 加载状态 - */ - const setLoadingHiddenPointInformationStatus = (value: boolean) => { - loadingHiddenPointInformationStatus.value = value; - }; - /** - * 获取风险点加载状态 - * @returns 加载状态 - */ - const getLoadingRiskPointInformationStatus = () => - loadingRiskPointInformationStatus.value; - /** - * 设置风险点加载状态 - * @param value - 加载状态 - */ - const setLoadingRiskPointInformationStatus = (value: boolean) => { - loadingRiskPointInformationStatus.value = value; - }; - /** - * 获取隐患点ID - * @returns 隐患点ID - */ - const getHiddenPointId = () => hiddenPointId.value; - /** - * 设置隐患点ID - * @param value - 隐患点ID - */ - const setHiddenPointId = (value: number) => { - hiddenPointId.value = value; - }; - /** - * 获取风险点ID - * @returns 风险点ID - */ - const getRiskPointId = () => riskPointId.value; - /** - * 设置风险点ID - * @param value - 风险点ID - */ - const setRiskPointId = (value: number) => { - riskPointId.value = value; + // 隐患点状态重置 + hiddenPoint.loading = false; + hiddenPoint.id = -1; + + // 风险点状态重置 + riskPoint.loading = false; + riskPoint.id = -1; + + // 医院状态重置 + hospital.loading = false; + hospital.id = -1; }; return { + clickObject, + hiddenPoint, + riskPoint, + hospital, resetStatue, - getClickObject, - setClickObject, - getLoadingHiddenPointInformationStatus, - setLoadingHiddenPointInformationStatus, - getLoadingRiskPointInformationStatus, - setLoadingRiskPointInformationStatus, - getHiddenPointId, - setHiddenPointId, - getRiskPointId, - setRiskPointId, }; } ); diff --git a/src/stores/useStatusStore.ts b/src/stores/useStatusStore.ts index 1bd8d99..3beb9ab 100644 --- a/src/stores/useStatusStore.ts +++ b/src/stores/useStatusStore.ts @@ -20,9 +20,27 @@ export const useStatusStore = defineStore('status', () => { */ const uiComponents = reactive({ /** 图例显示状态 */ - legendShow: true, + legendShow: { + show: true, + loading: true, + }, /** 灾情链影响点表格显示状态 */ - disasterChainPointShow: false, + disasterChainPointShow: { + show: false, + loading: true, + }, + leftButton: { + show: true, + loading: true, + }, + rightButton: { + show: true, + loading: true, + }, + controlPanel: { + show: true, + loading: true, + }, }); // ============================ 地图图层显示状态 ================================ @@ -32,13 +50,25 @@ export const useStatusStore = defineStore('status', () => { */ const mapLayers = reactive({ /** 显示行政区划 */ - showAdministrativeDivision: true, + showAdministrativeDivision: { + show: true, + loading: true, + }, /** 隐患点显示状态 */ - hiddenDangerPointShow: true, + hiddenDangerPointShow: { + show: true, + loading: true, + }, /** 风险点显示状态 */ - riskPointShow: true, + riskPointShow: { + show: true, + loading: true, + }, /** 断裂带显示状态 */ - faultShow: true, + faultShow: { + show: true, + loading: true, + }, }); /** @@ -46,21 +76,45 @@ export const useStatusStore = defineStore('status', () => { */ const poiLayers = reactive({ /** 显示医院 */ - showHospital: false, + showHospital: { + show: false, + loading: false, + }, /** 显示危险源 */ - showDangerSource: false, + showDangerSource: { + show: false, + loading: false, + }, /** 显示避难所 */ - showRefugeeShelter: false, + showRefugeeShelter: { + show: false, + loading: false, + }, /** 显示消防站 */ - showFireStation: false, + showFireStation: { + show: false, + loading: false, + }, /** 显示储备点 */ - showReservePoint: false, + showReservePoint: { + show: false, + loading: false, + }, /** 显示学校 */ - showSchool: false, + showSchool: { + show: false, + loading: false, + }, /** 显示人口网格 */ - showPopulationGrid: false, + showPopulationGrid: { + show: false, + loading: false, + }, /** 显示地铁站 */ - showSubwayStation: false, + showSubwayStation: { + show: false, + loading: false, + }, }); /** @@ -68,17 +122,35 @@ export const useStatusStore = defineStore('status', () => { */ const infrastructureLayers = reactive({ /** 显示管网系统 */ - showNetworkSystem: false, + showNetworkSystem: { + show: false, + loading: false, + }, /** 显示交通道路 */ - showTrafficRoad: false, + showTrafficRoad: { + show: false, + loading: false, + }, /** 显示桥梁 */ - showBridge: false, + showBridge: { + show: false, + loading: false, + }, /** 显示高速 */ - showHighway: false, + showHighway: { + show: false, + loading: false, + }, /** 显示国道 */ - showMainRoad: false, + showMainRoad: { + show: false, + loading: false, + }, /** 显示水库 */ - showReservoir: false, + showReservoir: { + show: false, + loading: false, + }, }); /** @@ -89,31 +161,100 @@ export const useStatusStore = defineStore('status', () => { appLoadingCompleted.value = false; // UI 组件显示状态重置 - uiComponents.legendShow = true; - uiComponents.disasterChainPointShow = false; + uiComponents.legendShow = { + show: true, + loading: true, + }; + uiComponents.disasterChainPointShow = { + show: false, + loading: true, + }; + uiComponents.leftButton = { + show: true, + loading: true, + }; + uiComponents.rightButton = { + show: true, + loading: true, + }; + uiComponents.controlPanel = { + show: true, + loading: true, + }; // 地图基础图层显示状态重置 - mapLayers.showAdministrativeDivision = true; - mapLayers.hiddenDangerPointShow = true; - mapLayers.riskPointShow = true; + mapLayers.showAdministrativeDivision = { + show: true, + loading: true, + }; + mapLayers.hiddenDangerPointShow = { + show: true, + loading: true, + }; + mapLayers.riskPointShow = { + show: true, + loading: true, + }; // POI图层显示状态重置 - poiLayers.showHospital = false; - poiLayers.showDangerSource = false; - poiLayers.showRefugeeShelter = false; - poiLayers.showFireStation = false; - poiLayers.showReservePoint = false; - poiLayers.showSchool = false; - poiLayers.showPopulationGrid = false; - poiLayers.showSubwayStation = false; + poiLayers.showHospital = { + show: false, + loading: false, + }; + poiLayers.showDangerSource = { + show: false, + loading: false, + }; + poiLayers.showRefugeeShelter = { + show: false, + loading: false, + }; + poiLayers.showFireStation = { + show: false, + loading: false, + }; + poiLayers.showReservePoint = { + show: false, + loading: false, + }; + poiLayers.showSchool = { + show: false, + loading: false, + }; + poiLayers.showPopulationGrid = { + show: false, + loading: false, + }; + poiLayers.showSubwayStation = { + show: false, + loading: false, + }; // 基础设施图层显示状态重置 - infrastructureLayers.showNetworkSystem = false; - infrastructureLayers.showTrafficRoad = false; - infrastructureLayers.showBridge = false; - infrastructureLayers.showHighway = false; - infrastructureLayers.showMainRoad = false; - infrastructureLayers.showReservoir = false; + infrastructureLayers.showNetworkSystem = { + show: false, + loading: false, + }; + infrastructureLayers.showTrafficRoad = { + show: false, + loading: false, + }; + infrastructureLayers.showBridge = { + show: false, + loading: false, + }; + infrastructureLayers.showHighway = { + show: false, + loading: false, + }; + infrastructureLayers.showMainRoad = { + show: false, + loading: false, + }; + infrastructureLayers.showReservoir = { + show: false, + loading: false, + }; }; return { diff --git a/src/types/base/XianHospitals.ts b/src/types/base/XianHospitals.ts new file mode 100644 index 0000000..0c5e9c8 --- /dev/null +++ b/src/types/base/XianHospitals.ts @@ -0,0 +1,125 @@ +import type { Point } from './Point'; + +/** + * 西安市医院医疗机构数据接口 + */ +export interface XianHospitals extends Point { + /** 医院名称 */ + name?: string; + /** 详细地址 */ + address?: string; + /** 医疗卫生机构类别代码 */ + typeCode?: string; + /** 医疗机构类型（大类） */ + type?: string; + /** 医疗机构类型（中类） */ + middleType?: string; + /** 医疗机构类型（专业） */ + perferssionType?: string; + /** 医院等级 */ + level?: string; + /** 医疗机构性质 */ + institutionNature?: string; + /** 总面积 */ + area?: number; + /** 建筑面积 */ + structionArea?: number; + /** 万元以上设备数 */ + devices?: number; + /** 总职工数 */ + workers?: number; + /** 卫生技术人员数 */ + techWorker?: number; + /** 护士数 */ + nurse?: number; + /** 工勤人数 */ + dedicateWorker?: number; + /** 年度总诊疗人数 */ + sumPeople?: number; + /** 年度入院人数 */ + inPeople?: number; + /** 年度出院人数 */ + outPeople?: number; + /** 总床位 */ + beds?: number; + /** 负压病床 */ + negativeBeds?: number; + /** ICU病床 */ + icuBeds?: number; + /** 院前急救专业人员数 */ + savePeople?: number; + /** 指挥车数 */ + controllerCar?: number; + /** 转运车数 */ + transferCars?: number; + /** 监护车数 */ + inspectorCars?: number; + /** 负压车数 */ + negativeCars?: number; + /** 采血车数 */ + bloodCars?: number; + /** 送血车数 */ + sendBloodCars?: number; + /** 安保人员数 */ + safePeople?: number; + /** 应急供电能力 */ + emergencyPower?: string; + /** 供水方式 */ + waterSupply?: string; + /** 供暖方式 */ + heating?: string; + /** 应急通信保障方式 */ + connectionType?: string; + /** 曾遭受的自然灾害类型 */ + hadDisasterType?: string; + /** 已有自然灾害应急预案类型 */ + emergencyPlan?: string; + /** 行政区划代码 */ + governmentCode?: string; + /** 村 */ + village?: string; + /** 市 */ + city?: string; + /** 创建人名称 */ + createName?: string; + /** 单位负责人 */ + unitHead?: string; + /** 空间点 */ + position?: string; + /** 统计负责人 */ + statisticsHead?: string; + /** 联系电话 */ + telephone?: string; + /** 省 */ + province?: string; + /** 创建时间 */ + createTime?: string; + /** 上报时间 */ + reportTime?: string; + /** 县 */ + county?: string; + /** 乡 */ + country?: string; + /** 街 */ + street?: string; + /** 填表人 */ + fillName?: string; + /** 代码类型(统一社会信用代码/机构编码) */ + institutionCodeType?: string; + /** 统一社会信用代码/机构编码 */ + institutionCode?: string; + /** 物理主键 */ + physicalKey?: string; + /** 省编码 */ + provinceCode?: number; + /** 市编码 */ + cityCode?: number; + /** 县编码 */ + countyCode?: number; + /** 更新时间 */ + updateTime?: string; + /** 写入时间 */ + writeTime?: string; + /** 逻辑删除标识，0未删除，1已删除 */ + isDelete?: number; +} diff --git a/src/types/common/LoadingResourceType.ts b/src/types/common/LoadingResourceType.ts index 33b2b7f..fd51f4e 100644 --- a/src/types/common/LoadingResourceType.ts +++ b/src/types/common/LoadingResourceType.ts @@ -13,4 +13,7 @@ export enum LoadingResource { * 行政区划 */ ADMINISTRATIVE_DIVISION = 'ADMINISTRATIVE_DIVISION', + + /** 医院 */ + HOSPITAL = 'HOSPITAL', } diff --git a/src/views/home/earthquake/EarthquakeView.vue b/src/views/home/earthquake/EarthquakeView.vue index 16db611..7ed8bd9 100644 --- a/src/views/home/earthquake/EarthquakeView.vue +++ b/src/views/home/earthquake/EarthquakeView.vue @@ -16,6 +16,10 @@ - + - + - + + + +
    @@ -42,6 +68,7 @@ import FaultComponent from '@/component/earthquake/FaultComponent.vue'; import BasicComponent from '@/component/rain-earthquake/BasicComponent.vue'; import ControlShowComponent from '@/component/rain-earthquake/ControlShowComponent.vue'; + import ControlShowDetailComponent from '@/component/rain-earthquake/ControlShowDetailComponent.vue'; import DisasterChainPointComponent from '@/component/rain-earthquake/DisasterChainPointComponent.vue'; import LeftButtonComponent from '@/component/rain-earthquake/LeftButtonComponent.vue'; import LegendComponent from '@/component/rain-earthquake/LegendComponent.vue'; diff --git a/src/views/home/rainstorm/RainstormView.vue b/src/views/home/rainstorm/RainstormView.vue index 7822f87..e6d4be1 100644 --- a/src/views/home/rainstorm/RainstormView.vue +++ b/src/views/home/rainstorm/RainstormView.vue @@ -8,6 +8,10 @@ - + - + - + + + +