隐患点风险点添加颜色字段(未完成)
This commit is contained in:
@@ -33,6 +33,7 @@
|
|||||||
title: string;
|
title: string;
|
||||||
data: Record<string, string>;
|
data: Record<string, string>;
|
||||||
field: Record<string, string>;
|
field: Record<string, string>;
|
||||||
|
color: Record<string, string> | null;
|
||||||
offsetX: number;
|
offsetX: number;
|
||||||
offsetY: number;
|
offsetY: number;
|
||||||
}>();
|
}>();
|
||||||
|
|||||||
@@ -15,6 +15,7 @@
|
|||||||
<InformationBox
|
<InformationBox
|
||||||
:data="collapsePointDetail as Record<string, any>"
|
:data="collapsePointDetail as Record<string, any>"
|
||||||
:field="field"
|
:field="field"
|
||||||
|
:color="color"
|
||||||
v-if="loadingInformationStore.collapseHiddenPoint.loading"
|
v-if="loadingInformationStore.collapseHiddenPoint.loading"
|
||||||
:title="informationBoxTitle"
|
:title="informationBoxTitle"
|
||||||
:offset-x="offsetX"
|
:offset-x="offsetX"
|
||||||
@@ -50,7 +51,7 @@
|
|||||||
const loadingResourceStore = useLoadingResourceStore();
|
const loadingResourceStore = useLoadingResourceStore();
|
||||||
const simulationIdStore = useSimulationIdStore();
|
const simulationIdStore = useSimulationIdStore();
|
||||||
|
|
||||||
const { field, getDisasterIcon } = useHiddenPoint();
|
const { field, color, getDisasterIcon } = useHiddenPoint();
|
||||||
|
|
||||||
// 信息框相关配置
|
// 信息框相关配置
|
||||||
const offsetX = ref(0);
|
const offsetX = ref(0);
|
||||||
|
|||||||
@@ -15,6 +15,7 @@
|
|||||||
<InformationBox
|
<InformationBox
|
||||||
:data="debrisFlowPointDetail as Record<string, any>"
|
:data="debrisFlowPointDetail as Record<string, any>"
|
||||||
:field="field"
|
:field="field"
|
||||||
|
:color="color"
|
||||||
v-if="loadingInformationStore.debrisFlowHiddenPoint.loading"
|
v-if="loadingInformationStore.debrisFlowHiddenPoint.loading"
|
||||||
:title="informationBoxTitle"
|
:title="informationBoxTitle"
|
||||||
:offset-x="offsetX"
|
:offset-x="offsetX"
|
||||||
@@ -50,7 +51,7 @@
|
|||||||
const loadingResourceStore = useLoadingResourceStore();
|
const loadingResourceStore = useLoadingResourceStore();
|
||||||
const simulationIdStore = useSimulationIdStore();
|
const simulationIdStore = useSimulationIdStore();
|
||||||
|
|
||||||
const { field, getDisasterIcon } = useHiddenPoint();
|
const { field, color, getDisasterIcon } = useHiddenPoint();
|
||||||
|
|
||||||
// 信息框相关配置
|
// 信息框相关配置
|
||||||
const offsetX = ref(0);
|
const offsetX = ref(0);
|
||||||
|
|||||||
@@ -15,6 +15,7 @@
|
|||||||
<InformationBox
|
<InformationBox
|
||||||
:data="flashFloodPointDetail as Record<string, any>"
|
:data="flashFloodPointDetail as Record<string, any>"
|
||||||
:field="field"
|
:field="field"
|
||||||
|
:color="color"
|
||||||
v-if="loadingInformationStore.flashFloodHiddenPoint.loading"
|
v-if="loadingInformationStore.flashFloodHiddenPoint.loading"
|
||||||
:title="informationBoxTitle"
|
:title="informationBoxTitle"
|
||||||
:offset-x="offsetX"
|
:offset-x="offsetX"
|
||||||
@@ -50,7 +51,7 @@
|
|||||||
const loadingResourceStore = useLoadingResourceStore();
|
const loadingResourceStore = useLoadingResourceStore();
|
||||||
const simulationIdStore = useSimulationIdStore();
|
const simulationIdStore = useSimulationIdStore();
|
||||||
|
|
||||||
const { field, getDisasterIcon } = useHiddenPoint();
|
const { field, color, getDisasterIcon } = useHiddenPoint();
|
||||||
|
|
||||||
// 信息框相关配置
|
// 信息框相关配置
|
||||||
const offsetX = ref(0);
|
const offsetX = ref(0);
|
||||||
|
|||||||
@@ -15,6 +15,7 @@
|
|||||||
<InformationBox
|
<InformationBox
|
||||||
:data="landslidePointDetail as Record<string, any>"
|
:data="landslidePointDetail as Record<string, any>"
|
||||||
:field="field"
|
:field="field"
|
||||||
|
:color="color"
|
||||||
v-if="loadingInformationStore.landslideHiddenPoint.loading"
|
v-if="loadingInformationStore.landslideHiddenPoint.loading"
|
||||||
:title="informationBoxTitle"
|
:title="informationBoxTitle"
|
||||||
:offset-x="offsetX"
|
:offset-x="offsetX"
|
||||||
@@ -50,7 +51,7 @@
|
|||||||
const loadingResourceStore = useLoadingResourceStore();
|
const loadingResourceStore = useLoadingResourceStore();
|
||||||
const simulationIdStore = useSimulationIdStore();
|
const simulationIdStore = useSimulationIdStore();
|
||||||
|
|
||||||
const { field, getDisasterIcon } = useHiddenPoint();
|
const { field, color, getDisasterIcon } = useHiddenPoint();
|
||||||
|
|
||||||
// 信息框相关配置
|
// 信息框相关配置
|
||||||
const offsetX = ref(0);
|
const offsetX = ref(0);
|
||||||
|
|||||||
@@ -15,6 +15,7 @@
|
|||||||
<InformationBox
|
<InformationBox
|
||||||
:data="riskPointDetail as Record<string, any>"
|
:data="riskPointDetail as Record<string, any>"
|
||||||
:field="field"
|
:field="field"
|
||||||
|
:color="color"
|
||||||
v-if="loadingInformationStore.riskPoint.loading"
|
v-if="loadingInformationStore.riskPoint.loading"
|
||||||
:title="informationBoxTitle"
|
:title="informationBoxTitle"
|
||||||
:offset-x="offsetX"
|
:offset-x="offsetX"
|
||||||
@@ -52,7 +53,7 @@
|
|||||||
const riskPointDetail = ref<Point>();
|
const riskPointDetail = ref<Point>();
|
||||||
|
|
||||||
// 获取钩子函数
|
// 获取钩子函数
|
||||||
const { informationBoxTitle, field, getDisasterIcon } = useRiskPoint();
|
const { informationBoxTitle, field, color, getDisasterIcon } = useRiskPoint();
|
||||||
|
|
||||||
$api.riskSpots.getBasePoints().then((res) => {
|
$api.riskSpots.getBasePoints().then((res) => {
|
||||||
riskPoints.value = res.data;
|
riskPoints.value = res.data;
|
||||||
|
|||||||
@@ -3,9 +3,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<!-- 加载内涝隐患点 -->
|
<!-- 加载内涝隐患点 -->
|
||||||
<LoadingPoints
|
<LoadingPoints
|
||||||
v-if="
|
v-if="statusStore.appLoadingCompleted && waterLoggingPoints.length > 0"
|
||||||
statusStore.appLoadingCompleted && waterLoggingPoints.length > 0
|
|
||||||
"
|
|
||||||
:base-points="waterLoggingPoints"
|
:base-points="waterLoggingPoints"
|
||||||
:get-disaster-icon="getDisasterIcon"
|
:get-disaster-icon="getDisasterIcon"
|
||||||
:prefix="config.prefix.waterLoggingHiddenPointId"
|
:prefix="config.prefix.waterLoggingHiddenPointId"
|
||||||
@@ -17,6 +15,7 @@
|
|||||||
<InformationBox
|
<InformationBox
|
||||||
:data="waterLoggingPointDetail as Record<string, any>"
|
:data="waterLoggingPointDetail as Record<string, any>"
|
||||||
:field="field"
|
:field="field"
|
||||||
|
:color="color"
|
||||||
v-if="loadingInformationStore.waterLoggingHiddenPoint.loading"
|
v-if="loadingInformationStore.waterLoggingHiddenPoint.loading"
|
||||||
:title="informationBoxTitle"
|
:title="informationBoxTitle"
|
||||||
:offset-x="offsetX"
|
:offset-x="offsetX"
|
||||||
@@ -43,14 +42,16 @@
|
|||||||
PointType,
|
PointType,
|
||||||
HiddenDangerPointTypeMap,
|
HiddenDangerPointTypeMap,
|
||||||
} from '@/types/common/DisasterType.ts';
|
} from '@/types/common/DisasterType.ts';
|
||||||
|
import { useSimulationIdStore } from '@/stores/useSimulationIdStore';
|
||||||
|
|
||||||
const waterLoggingPoints = ref<Point[]>([]);
|
const waterLoggingPoints = ref<Point[]>([]);
|
||||||
|
|
||||||
const statusStore = useStatusStore();
|
const statusStore = useStatusStore();
|
||||||
const loadingInformationStore = useLoadingInformationStore();
|
const loadingInformationStore = useLoadingInformationStore();
|
||||||
const loadingResourceStore = useLoadingResourceStore();
|
const loadingResourceStore = useLoadingResourceStore();
|
||||||
|
const simulationIdStore = useSimulationIdStore();
|
||||||
|
|
||||||
const { field, getDisasterIcon } = useHiddenPoint();
|
const { field, color, getDisasterIcon } = useHiddenPoint();
|
||||||
|
|
||||||
// 信息框相关配置
|
// 信息框相关配置
|
||||||
const offsetX = ref(0);
|
const offsetX = ref(0);
|
||||||
@@ -81,7 +82,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const res = await $api.hiddenDangerSpots.getPointDetailById(
|
const res = await $api.hiddenDangerSpots.getPointDetailById(
|
||||||
loadingInformationStore.waterLoggingHiddenPoint.id
|
loadingInformationStore.waterLoggingHiddenPoint.id,
|
||||||
|
simulationIdStore.status ? simulationIdStore.id : -1
|
||||||
);
|
);
|
||||||
|
|
||||||
// 更新数据
|
// 更新数据
|
||||||
|
|||||||
@@ -24,6 +24,13 @@ export const useHiddenPoint = () => {
|
|||||||
riskGrade: '风险等级',
|
riskGrade: '风险等级',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 颜色
|
||||||
|
*/
|
||||||
|
const color = {
|
||||||
|
probability: 'red',
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据灾害类型获取对应图标
|
* 根据灾害类型获取对应图标
|
||||||
* @param disasterType - 灾害类型(支持中英文)
|
* @param disasterType - 灾害类型(支持中英文)
|
||||||
@@ -52,5 +59,5 @@ export const useHiddenPoint = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return { field, getDisasterIcon };
|
return { field, color, getDisasterIcon };
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -28,6 +28,13 @@ export const useRiskPoint = () => {
|
|||||||
lat: '纬度',
|
lat: '纬度',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 颜色
|
||||||
|
*/
|
||||||
|
const color = {
|
||||||
|
probability: 'red',
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取风险点图标
|
* 获取风险点图标
|
||||||
* @returns 图标路径
|
* @returns 图标路径
|
||||||
@@ -36,5 +43,5 @@ export const useRiskPoint = () => {
|
|||||||
return riskAreaIcon;
|
return riskAreaIcon;
|
||||||
}
|
}
|
||||||
|
|
||||||
return { informationBoxTitle, field, getDisasterIcon };
|
return { informationBoxTitle, field, color, getDisasterIcon };
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user