From ccd22b7113fcecabcdde18b3f363a271012d4e50 Mon Sep 17 00:00:00 2001 From: fanjia <3278303149@qq.com> Date: Fri, 17 Apr 2026 14:50:25 +0800 Subject: [PATCH] =?UTF-8?q?=E5=9C=B0=E5=9B=BE=E6=B7=BB=E5=8A=A0=E6=B6=89?= =?UTF-8?q?=E7=81=BE=E9=9A=90=E6=82=A3=E7=82=B9=EF=BC=8C=E5=A4=9A=E7=A7=8D?= =?UTF-8?q?=E7=AD=89=E7=BA=A7=E8=B7=AF=E6=AE=B5=EF=BC=8C=E5=9B=BD=E7=9C=81?= =?UTF-8?q?=E9=81=93=E5=BC=B9=E7=AA=97=EF=BC=8C=E5=86=9C=E6=9D=91=E9=81=93?= =?UTF-8?q?=E8=B7=AF=EF=BC=8C=E9=A1=B9=E7=9B=AE=EF=BC=8C=E5=BC=B9=E7=AA=97?= =?UTF-8?q?title=E4=BF=AE=E6=94=B9=EF=BC=8C=E6=B6=89=E7=81=BE=E9=9A=90?= =?UTF-8?q?=E6=82=A3=E7=82=B9=E8=AF=A6=E6=83=85=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .prettierrc | 10 + .../RiskWarning_img/隐患点弹窗背景@2x.png | Bin 0 -> 5418 bytes .../Dialog/clearanceSituationDialog.vue | 118 ++- .../Dialog/hazardPointSituationDialog.vue | 369 +++++++++ .../RiskWarning/Dialog/impactPointDialog.vue | 2 +- .../Dialog/responseStatusDialog.vue | 307 ++++---- .../RiskWarning/Dialog/tongnanInfoDialog.vue | 109 +-- .../Dialog/tongnanProjectPersonDialog.vue | 238 ++++++ .../Dialog/tongnanResponsibleDialog.vue | 58 +- .../RiskWarning/Dialog/tongnanTeamDialog.vue | 54 +- .../screen/src/views/RiskWarning/bottom.vue | 666 +++------------- .../RiskWarning/component/ChongqingMap.vue | 744 +++++++++++------- .../component/WeatherWarningTable.vue | 441 +++++++++++ .../src/views/RiskWarning/component/index.js | 108 ++- .../screen/src/views/RiskWarning/index.vue | 294 ++++--- .../screen/src/views/RiskWarning/right.vue | 443 +++++------ packages/screen/src/views/RiskWarning/top.vue | 267 ++++++- 17 files changed, 2683 insertions(+), 1545 deletions(-) create mode 100644 .prettierrc create mode 100644 packages/screen/src/assets/RiskWarning_img/隐患点弹窗背景@2x.png create mode 100644 packages/screen/src/views/RiskWarning/Dialog/hazardPointSituationDialog.vue create mode 100644 packages/screen/src/views/RiskWarning/Dialog/tongnanProjectPersonDialog.vue create mode 100644 packages/screen/src/views/RiskWarning/component/WeatherWarningTable.vue diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..3e79c95 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,10 @@ +{ + "printWidth": 100, + "tabWidth": 2, + "semi": true, + "singleQuote": true, + "trailingComma": "es5", + "arrowParens": "avoid", + "htmlWhitespaceSensitivity": "ignore", + "vueIndentScriptAndStyle": false +} \ No newline at end of file diff --git a/packages/screen/src/assets/RiskWarning_img/隐患点弹窗背景@2x.png b/packages/screen/src/assets/RiskWarning_img/隐患点弹窗背景@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..e2b6a67393b42fefb8e232120c86a8bb4b97c632 GIT binary patch literal 5418 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 @@ -99,15 +99,11 @@ diff --git a/packages/screen/src/views/RiskWarning/Dialog/hazardPointSituationDialog.vue b/packages/screen/src/views/RiskWarning/Dialog/hazardPointSituationDialog.vue new file mode 100644 index 0000000..fb15420 --- /dev/null +++ b/packages/screen/src/views/RiskWarning/Dialog/hazardPointSituationDialog.vue @@ -0,0 +1,369 @@ + + + + + diff --git a/packages/screen/src/views/RiskWarning/Dialog/impactPointDialog.vue b/packages/screen/src/views/RiskWarning/Dialog/impactPointDialog.vue index 0014b13..54a3218 100644 --- a/packages/screen/src/views/RiskWarning/Dialog/impactPointDialog.vue +++ b/packages/screen/src/views/RiskWarning/Dialog/impactPointDialog.vue @@ -683,7 +683,7 @@ const processUnifiedData = (item, type) => { return { ...baseData, // 影响区域 - 使用区县名称 - region: item.GL1_QXMC || "-", + region: item.GL1_ZDMC || "-", // 影响点位置 - 使用路线名称+起终点桩号 pointLocation: `${item.GL1_GLMC || item.GL1_GLBH || "-"} (${item.GL1_QDZH || "-"} - ${item.GL1_ZDZH || "-"})`, // 影响点等级 - 使用风险等级 diff --git a/packages/screen/src/views/RiskWarning/Dialog/responseStatusDialog.vue b/packages/screen/src/views/RiskWarning/Dialog/responseStatusDialog.vue index 5fffb6e..7a80771 100644 --- a/packages/screen/src/views/RiskWarning/Dialog/responseStatusDialog.vue +++ b/packages/screen/src/views/RiskWarning/Dialog/responseStatusDialog.vue @@ -19,78 +19,20 @@
-
+
- 影响桥梁 - (1430) -
-
-
-
-
- 影响边坡 - (933) -
-
-
-
-
- 影响隧道 - (1033) -
-
-
-
-
- 影响项目 - (832) -
-
-
-
-
- 影响路段 - (832) + {{ item.label }} + {{ item.value }}
@@ -115,7 +57,8 @@ -->
影响点等级 -
是否回应 - @@ -160,11 +102,7 @@ {{ row.trafficDept.name }}
@@ -197,11 +135,11 @@ - diff --git a/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue b/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue index f4f29f0..c8f396e 100644 --- a/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue +++ b/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue @@ -16,10 +16,6 @@ :z-index="zIndex" :width="width" > - + +
diff --git a/packages/screen/src/views/RiskWarning/component/WeatherWarningTable.vue b/packages/screen/src/views/RiskWarning/component/WeatherWarningTable.vue new file mode 100644 index 0000000..4a2e1d1 --- /dev/null +++ b/packages/screen/src/views/RiskWarning/component/WeatherWarningTable.vue @@ -0,0 +1,441 @@ + + + + + diff --git a/packages/screen/src/views/RiskWarning/component/index.js b/packages/screen/src/views/RiskWarning/component/index.js index daab8f2..5f6ed0a 100644 --- a/packages/screen/src/views/RiskWarning/component/index.js +++ b/packages/screen/src/views/RiskWarning/component/index.js @@ -1,32 +1,74 @@ // 弹窗组件统一数据配置 +import { ref } from 'vue'; +import { request } from '@/utils/request'; // 行政区域选项 -export const regionOptions = [ - { label: "重庆市", value: "重庆市" }, - { label: "万州区", value: "万州区" }, - { label: "沙坪坝区", value: "沙坪坝区" }, - { label: "渝中区", value: "渝中区" }, - { label: "巫溪县", value: "巫溪县" }, - { label: "涪陵区", value: "涪陵区" }, - { label: "合川区", value: "合川区" }, - { label: "万盛区", value: "万盛区" }, - { label: "长寿区", value: "长寿区" }, - { label: "城口区", value: "城口区" }, - { label: "柏梓镇", value: "柏梓镇" }, - { label: "江北区", value: "江北区" }, -]; +export const regionOptions = ref([ + // { label: "重庆市", value: "重庆市" }, + // { label: "万州区", value: "万州区" }, + // { label: "沙坪坝区", value: "沙坪坝区" }, + // { label: "渝中区", value: "渝中区" }, + // { label: "巫溪县", value: "巫溪县" }, + // { label: "涪陵区", value: "涪陵区" }, + // { label: "合川区", value: "合川区" }, + // { label: "万盛区", value: "万盛区" }, + // { label: "长寿区", value: "长寿区" }, + // { label: "城口区", value: "城口区" }, + // { label: "柏梓镇", value: "柏梓镇" }, + // { label: "江北区", value: "江北区" }, +]); -// 类型选项 -export const typeOptions = [ - { label: "边坡坍塌", value: "边坡坍塌" }, - { label: "路面塌陷", value: "路面塌陷" }, - { label: "桥梁损坏", value: "桥梁损坏" }, - { label: "隧道事故", value: "隧道事故" }, - { label: "交通主管部门", value: "交通主管部门" }, - { label: "公路机构", value: "公路机构" }, - { label: "养护站", value: "养护站" }, - { label: "护路员", value: "护路员" }, -]; +// 获取行政区域选项 +export const fetchDistrictOptions = async () => { + try { + const res = await request({ + url: '/snow-ops-platform/sm-event/dashboard/district-options', + method: 'GET', + }); + if (res && res.code === '00000' && Array.isArray(res.data)) { + // 将接口返回的数据转换为选项格式 + const options = res.data.map(item => ({ + label: item.qxmc, + value: item.xzdm, + })); + // 保留"全部"选项，并添加接口返回的数据 + regionOptions.value = [ + { label: "全部", value: "" }, + ...options, + ]; + return options; + } + } catch (error) { + console.error('获取行政区域选项失败:', error); + } + return regionOptions.value; +}; + +// 路况类型选项（默认数据，会被API数据替换） +export const typeOptions = ref([ +]); + +// 获取路况类型选项 +export const fetchRoadConditionOptions = async () => { + try { + const res = await request({ + url: '/snow-ops-platform/sm-event/dashboard/road-condition-options', + method: 'GET', + }); + if (res && res.code === '00000' && Array.isArray(res.data)) { + // 将接口返回的字符串数组转换为选项格式 + const options = res.data.map(item => ({ + label: item, + value: item, + })); + typeOptions.value = options; + return options; + } + } catch (error) { + console.error('获取路况类型选项失败:', error); + } + return typeOptions.value; +}; // 管控措施选项 export const controlMeasureOptions = [ @@ -84,15 +126,9 @@ export const isEndedOptions = [ ]; // 行政区域选项（带全部） -export const regionOptionsWithAll = [ - { label: "全部", value: "" }, - { label: "万州区", value: "wanzhou" }, - { label: "涪陵区", value: "fuling" }, - { label: "合川区", value: "hechuan" }, - { label: "万盛区", value: "wansheng" }, - { label: "长寿区", value: "changshou" }, - { label: "城口区", value: "chengkou" }, -]; +export const regionOptionsWithAll = ref([ +]); + // 格式化日期时间为接口所需格式 export const formatDateTime = (date) => { @@ -120,4 +156,6 @@ export default { isEndedOptions, regionOptionsWithAll, formatDateTime, -}; \ No newline at end of file + fetchRoadConditionOptions, + fetchDistrictOptions, +}; diff --git a/packages/screen/src/views/RiskWarning/index.vue b/packages/screen/src/views/RiskWarning/index.vue index 1967cdf..d02b29a 100644 --- a/packages/screen/src/views/RiskWarning/index.vue +++ b/packages/screen/src/views/RiskWarning/index.vue @@ -1,17 +1,9 @@ @@ -502,7 +591,7 @@ onMounted(() => { position: relative; width: 100%; height: 100%; - background-image: url("../../assets/RiskWarning_img/遮罩层.png"); + background-image: url('../../assets/RiskWarning_img/遮罩层.png'); background-size: cover; background-position: center; } @@ -571,9 +660,17 @@ onMounted(() => { position: absolute; bottom: 5px; left: 25%; - width: 50%; + width: 20%; height: 43%; } +.weather-warning-table { + position: absolute; + bottom: 5px; + left: 30%; + width: 40%; + height: 43%; + // z-index: 1; +} .top { position: absolute; @@ -591,7 +688,7 @@ onMounted(() => { // left: 25%; width: 100%; height: 100%; - z-index: 2; + // z-index: 2; } /* 地图底层 - 填满整个容器 */ @@ -609,8 +706,7 @@ onMounted(() => { z-index: 1; pointer-events: none; /* 不阻挡交互 */ - background: url(../../assets/RiskWarning_img/遮罩层.png) no-repeat - center/cover; + background: url(../../assets/RiskWarning_img/遮罩层.png) no-repeat center/cover; } // 四个角的装饰 diff --git a/packages/screen/src/views/RiskWarning/right.vue b/packages/screen/src/views/RiskWarning/right.vue index 481fa64..46c10d2 100644 --- a/packages/screen/src/views/RiskWarning/right.vue +++ b/packages/screen/src/views/RiskWarning/right.vue @@ -19,7 +19,8 @@
{{ item.label }}
- {{ item.value }}{{ item.unit }} + {{ item.value }} + {{ item.unit }}
@@ -28,8 +29,8 @@
-
管控路段数 2
-
管控项目 2
+
管控路段数
+
管控项目
@@ -78,11 +79,7 @@
-
+
{{ item.value }}
{{ item.label }}
@@ -93,16 +90,13 @@
抢险投入情况
-
+
- {{ item.value }}{{ item.unit }} + {{ item.value }} + {{ item.unit }}
{{ item.label }}
@@ -116,9 +110,7 @@ @@ -699,7 +684,7 @@ watch( .section-header { display: flex; justify-content: space-between; - background-image: url("../../assets/RiskWarning_img/标题bg@2x.png"); + background-image: url('../../assets/RiskWarning_img/标题bg@2x.png'); align-items: center; margin-bottom: vw(8); height: vw(50); @@ -721,7 +706,7 @@ watch( justify-content: center; &::before { - content: "←"; + content: '←'; color: #fff; font-size: vw(10); } @@ -751,12 +736,7 @@ watch( padding: vw(4) vw(8); background: linear-gradient(270deg, rgba(18, 52, 97, 0) 0%, #203555 100%); border: 2px solid transparent; - border-image: linear-gradient( - 270deg, - rgba(80, 145, 201, 0), - rgba(39, 77, 153, 1) - ) - 2 2; + border-image: linear-gradient(270deg, rgba(80, 145, 201, 0), rgba(39, 77, 153, 1)) 2 2; border-radius: 6px; border-right: 0px; @@ -771,16 +751,16 @@ watch( font-size: vw(18); &.icon-team::before { - content: "👷"; + content: '👷'; } &.icon-person::before { - content: "👤"; + content: '👤'; } &.icon-equip::before { - content: "🚛"; + content: '🚛'; } &.icon-material::before { - content: "📦"; + content: '📦'; } } @@ -837,7 +817,7 @@ watch( grid-template-columns: repeat(2, 1fr); // background: rgba(62, 106, 172, 0.36); // box-shadow: inset 0px 0px 8px 0px #379bff; - background-image: url("../../assets/RiskWarning_img/路径 62@2x.png"); + background-image: url('../../assets/RiskWarning_img/路径 62@2x.png'); background-size: 100% 100%; background-position: right; gap: vw(8); @@ -904,7 +884,7 @@ watch( padding: vw(6) vw(5); // background: rgba(64, 169, 255, 0.1); // border-radius: 4px; - background-image: url("../../assets/RiskWarning_img/路径62@2x (1).png"); + background-image: url('../../assets/RiskWarning_img/路径62@2x (1).png'); background-size: 100% 100%; background-position: right; @@ -946,7 +926,7 @@ watch( // background: rgba(64, 169, 255, 0.1); // border: 1px solid rgba(64, 169, 255, 0.2); // border-radius: 6px; - background-image: url("../../assets/RiskWarning_img/路径62@2x (1).png"); + background-image: url('../../assets/RiskWarning_img/路径62@2x (1).png'); background-size: 100% 100%; background-position: right; @@ -960,13 +940,13 @@ watch( margin-left: vw(5); &.icon-rescue-person::before { - content: "👷"; + content: '👷'; } &.icon-rescue-equip::before { - content: "🚜"; + content: '🚜'; } &.icon-rescue-clear::before { - content: "🏔️"; + content: '🏔️'; } } @@ -1030,7 +1010,7 @@ watch( // display: grid; // grid-template-columns: repeat(5, 1fr); // gap: 10px; - background-image: url("../../assets/RiskWarning_img/编组22@2x.png"); + background-image: url('../../assets/RiskWarning_img/编组22@2x.png'); background-size: 100% 100%; background-position: center; @@ -1038,12 +1018,7 @@ watch( width: 2px; height: vw(40); margin: auto 0; - background: linear-gradient( - 180deg, - transparent 0%, - #18f2f9 50%, - transparent 100% - ); + background: linear-gradient(180deg, transparent 0%, #18f2f9 50%, transparent 100%); // margin: 0 auto; } @@ -1116,7 +1091,7 @@ watch( padding: vw(4) 0; // background: rgba(64, 169, 255, 0.1); // border-radius: 6px; - background-image: url("../../assets/RiskWarning_img/路径62@2x.png"); + background-image: url('../../assets/RiskWarning_img/路径62@2x.png'); background-size: 100% 100%; background-position: left; @@ -1159,7 +1134,7 @@ watch( padding: vw(12); // background: rgba(64, 169, 255, 0.1); // border-radius: 6px; - background-image: url("../../assets/RiskWarning_img/编组5@2x.png"); + background-image: url('../../assets/RiskWarning_img/编组5@2x.png'); background-size: 100% 100%; background-position: left; diff --git a/packages/screen/src/views/RiskWarning/top.vue b/packages/screen/src/views/RiskWarning/top.vue index 62bb2c4..16146a6 100644 --- a/packages/screen/src/views/RiskWarning/top.vue +++ b/packages/screen/src/views/RiskWarning/top.vue @@ -1,9 +1,7 @@