Compare commits
2 Commits
3c916bfbbd
...
09252381a0
| Author | SHA1 | Date | |
|---|---|---|---|
| 09252381a0 | |||
| c706e7c791 |
@ -145,7 +145,7 @@ const tableColumns = ref([
|
|||||||
{ prop: "stakeNo", label: "起止桩号", width: "", slot: "stakeNo" },
|
{ prop: "stakeNo", label: "起止桩号", width: "", slot: "stakeNo" },
|
||||||
{ prop: "location", label: "路况位置", width: "", slot: "location" },
|
{ prop: "location", label: "路况位置", width: "", slot: "location" },
|
||||||
{ prop: "occurrenceTime", label: "发生时间", width: "" },
|
{ prop: "occurrenceTime", label: "发生时间", width: "" },
|
||||||
{ prop: "routeNo2", label: "线路编号", width: "" },
|
// { prop: "routeNo2", label: "线路编号", width: "" },
|
||||||
{ prop: "type", label: "类型", width: "" },
|
{ prop: "type", label: "类型", width: "" },
|
||||||
{
|
{
|
||||||
prop: "roadConditionType",
|
prop: "roadConditionType",
|
||||||
@ -255,7 +255,7 @@ const fetchData = async () => {
|
|||||||
stakeNo: `${item.startStakeNo}-${item.endStakeNo}` || "-",
|
stakeNo: `${item.startStakeNo}-${item.endStakeNo}` || "-",
|
||||||
location: item.occurLocation || "-",
|
location: item.occurLocation || "-",
|
||||||
occurrenceTime: item.occurTime || "-",
|
occurrenceTime: item.occurTime || "-",
|
||||||
routeNo2: item.routeNo || "-",
|
// routeNo2: item.routeNo || "-",
|
||||||
type: item.roadConditionType || "-",
|
type: item.roadConditionType || "-",
|
||||||
roadConditionType: item.roadConditionType || "-",
|
roadConditionType: item.roadConditionType || "-",
|
||||||
expectRecoverTime: item.expectRecoverTime || "-",
|
expectRecoverTime: item.expectRecoverTime || "-",
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
<template>
|
<template>
|
||||||
<base-dialog
|
<base-dialog
|
||||||
v-model:visible="props.visible"
|
v-model:visible="props.visible"
|
||||||
title="详情"
|
title="详情"
|
||||||
@ -37,7 +37,11 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="info-item">
|
<div class="info-item">
|
||||||
<span class="info-label">事件等级:</span>
|
<span class="info-label">事件等级:</span>
|
||||||
<span class="info-value level-tag" :class="eventInfo.levelClass">{{ eventInfo.eventLevel }}</span>
|
<span
|
||||||
|
class="info-value level-tag"
|
||||||
|
:class="eventInfo.levelClass"
|
||||||
|
>{{ eventInfo.eventLevel }}</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="info-row">
|
<div class="info-row">
|
||||||
@ -76,7 +80,11 @@
|
|||||||
处置反馈信息
|
处置反馈信息
|
||||||
</div>
|
</div>
|
||||||
<div class="feedback-list">
|
<div class="feedback-list">
|
||||||
<div v-for="(item, index) in feedbackList" :key="item.id" class="feedback-item">
|
<div
|
||||||
|
v-for="(item, index) in feedbackList"
|
||||||
|
:key="item.id"
|
||||||
|
class="feedback-item"
|
||||||
|
>
|
||||||
<div class="feedback-header">
|
<div class="feedback-header">
|
||||||
<div class="feedback-num">{{ index + 1 }}</div>
|
<div class="feedback-num">{{ index + 1 }}</div>
|
||||||
<div class="feedback-info">
|
<div class="feedback-info">
|
||||||
@ -97,19 +105,25 @@
|
|||||||
<div class="detail-row">
|
<div class="detail-row">
|
||||||
<span class="detail-label">预计开始时间:</span>
|
<span class="detail-label">预计开始时间:</span>
|
||||||
<span class="detail-value">{{ item.estimatedStartTime }}</span>
|
<span class="detail-value">{{ item.estimatedStartTime }}</span>
|
||||||
<span class="detail-label" style="margin-left: 40px">预计结束时间:</span>
|
<span class="detail-label" style="margin-left: 40px"
|
||||||
|
>预计结束时间:</span
|
||||||
|
>
|
||||||
<span class="detail-value">{{ item.estimatedEndTime }}</span>
|
<span class="detail-value">{{ item.estimatedEndTime }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail-row">
|
<div class="detail-row">
|
||||||
<span class="detail-label">实际开始时间:</span>
|
<span class="detail-label">实际开始时间:</span>
|
||||||
<span class="detail-value">{{ item.actualStartTime }}</span>
|
<span class="detail-value">{{ item.actualStartTime }}</span>
|
||||||
<span class="detail-label" style="margin-left: 40px">实际结束时间:</span>
|
<span class="detail-label" style="margin-left: 40px"
|
||||||
|
>实际结束时间:</span
|
||||||
|
>
|
||||||
<span class="detail-value">{{ item.actualEndTime }}</span>
|
<span class="detail-value">{{ item.actualEndTime }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail-row">
|
<div class="detail-row">
|
||||||
<span class="detail-label">处置人:</span>
|
<span class="detail-label">处置人:</span>
|
||||||
<span class="detail-value">{{ item.handlerName }}</span>
|
<span class="detail-value">{{ item.handlerName }}</span>
|
||||||
<span class="detail-label" style="margin-left: 40px">联系电话:</span>
|
<span class="detail-label" style="margin-left: 40px"
|
||||||
|
>联系电话:</span
|
||||||
|
>
|
||||||
<span class="detail-value">{{ item.contactPhone }}</span>
|
<span class="detail-value">{{ item.contactPhone }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail-row">
|
<div class="detail-row">
|
||||||
@ -124,7 +138,11 @@
|
|||||||
</base-dialog>
|
</base-dialog>
|
||||||
|
|
||||||
<!-- 图片预览弹窗 -->
|
<!-- 图片预览弹窗 -->
|
||||||
<div v-if="previewVisible" class="image-preview-overlay" @click="closePreview">
|
<div
|
||||||
|
v-if="previewVisible"
|
||||||
|
class="image-preview-overlay"
|
||||||
|
@click="closePreview"
|
||||||
|
>
|
||||||
<div class="image-preview-container" @click.stop>
|
<div class="image-preview-container" @click.stop>
|
||||||
<img :src="previewImageUrl" alt="预览" />
|
<img :src="previewImageUrl" alt="预览" />
|
||||||
<div class="close-preview-btn" @click="closePreview">
|
<div class="close-preview-btn" @click="closePreview">
|
||||||
@ -163,7 +181,8 @@ const eventInfo = ref({
|
|||||||
reporter: "张三",
|
reporter: "张三",
|
||||||
address: "万州区太白路123号附近",
|
address: "万州区太白路123号附近",
|
||||||
reportTime: "2023-10-12 14:35:00",
|
reportTime: "2023-10-12 14:35:00",
|
||||||
description: "路面出现塌陷,面积约2平方米,深度约0.5米,已设置警示标志,请尽快处理。",
|
description:
|
||||||
|
"路面出现塌陷,面积约2平方米,深度约0.5米,已设置警示标志,请尽快处理。",
|
||||||
});
|
});
|
||||||
|
|
||||||
// 处置反馈信息
|
// 处置反馈信息
|
||||||
@ -226,7 +245,7 @@ watch(
|
|||||||
// 如果有传入数据,更新显示
|
// 如果有传入数据,更新显示
|
||||||
Object.assign(eventInfo.value, props.eventData);
|
Object.assign(eventInfo.value, props.eventData);
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
);
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -327,6 +346,7 @@ watch(
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 16px;
|
gap: 16px;
|
||||||
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.feedback-item {
|
.feedback-item {
|
||||||
|
|||||||
@ -379,6 +379,7 @@ watch(
|
|||||||
.timeline-list {
|
.timeline-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
margin-bottom: 10px;
|
||||||
gap: 16px;
|
gap: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1069,9 +1069,8 @@ watch(
|
|||||||
// 监听 dateRange 变化,重新加载数据
|
// 监听 dateRange 变化,重新加载数据
|
||||||
watch(
|
watch(
|
||||||
() => props.dateRange,
|
() => props.dateRange,
|
||||||
async (newVal) => {
|
async (newVal, oldVal) => {
|
||||||
console.log("dateRange 变化:", newVal);
|
console.log("dateRange 变化:", newVal, oldVal);
|
||||||
if (newVal && newVal.length === 2) {
|
|
||||||
// 先重新加载受影响区县数据
|
// 先重新加载受影响区县数据
|
||||||
await getAffectedCountyData();
|
await getAffectedCountyData();
|
||||||
|
|
||||||
@ -1092,7 +1091,6 @@ watch(
|
|||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
},
|
},
|
||||||
{ deep: true },
|
{ deep: true },
|
||||||
);
|
);
|
||||||
|
|||||||
@ -34,8 +34,9 @@
|
|||||||
<slot name="filter"></slot>
|
<slot name="filter"></slot>
|
||||||
</div>
|
</div>
|
||||||
<!-- 数据表格 -->
|
<!-- 数据表格 -->
|
||||||
<div class="table-section" v-if="props.tableData.length > 0">
|
<div class="table-section">
|
||||||
<el-table
|
<el-table
|
||||||
|
v-if="props.tableData.length > 0"
|
||||||
:data="props.tableData"
|
:data="props.tableData"
|
||||||
:height="props.tableHeight"
|
:height="props.tableHeight"
|
||||||
style="width: 100%; min-height: 300px"
|
style="width: 100%; min-height: 300px"
|
||||||
@ -59,11 +60,9 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 分页 -->
|
<!-- 分页 -->
|
||||||
<div
|
<div class="pagination">
|
||||||
class="pagination"
|
|
||||||
v-if="props.tableData.length > 0 && props.showPagination"
|
|
||||||
>
|
|
||||||
<el-pagination
|
<el-pagination
|
||||||
|
v-if="props.tableData.length > 0 && props.showPagination"
|
||||||
:current-page="props.currentPage"
|
:current-page="props.currentPage"
|
||||||
:page-size="props.pageSize"
|
:page-size="props.pageSize"
|
||||||
:page-sizes="props.pageSizes"
|
:page-sizes="props.pageSizes"
|
||||||
|
|||||||
@ -406,21 +406,32 @@ const handleCenterCardClickType = (item) => {
|
|||||||
|
|
||||||
// 兄弟组件通信机制
|
// 兄弟组件通信机制
|
||||||
const refreshLeftData = ref(null);
|
const refreshLeftData = ref(null);
|
||||||
|
const refreshRightData = ref(null);
|
||||||
|
|
||||||
// 提供刷新函数给子组件
|
// 提供刷新函数给子组件
|
||||||
const setRefreshLeftData = (callback) => {
|
const setRefreshLeftData = (callback) => {
|
||||||
refreshLeftData.value = callback;
|
refreshLeftData.value = callback;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 提供刷新函数给 right.vue
|
||||||
|
const setRefreshRightData = (callback) => {
|
||||||
|
refreshRightData.value = callback;
|
||||||
|
};
|
||||||
|
|
||||||
// 触发刷新函数
|
// 触发刷新函数
|
||||||
const triggerRefreshLeftData = () => {
|
const triggerRefreshLeftData = () => {
|
||||||
if (refreshLeftData.value) {
|
if (refreshLeftData.value) {
|
||||||
refreshLeftData.value();
|
refreshLeftData.value();
|
||||||
}
|
}
|
||||||
|
// 同时触发 right.vue 刷新
|
||||||
|
if (refreshRightData.value) {
|
||||||
|
refreshRightData.value();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// 提供通信机制给子组件
|
// 提供通信机制给子组件
|
||||||
provide("setRefreshLeftData", setRefreshLeftData);
|
provide("setRefreshLeftData", setRefreshLeftData);
|
||||||
|
provide("setRefreshRightData", setRefreshRightData);
|
||||||
provide("triggerRefreshLeftData", triggerRefreshLeftData);
|
provide("triggerRefreshLeftData", triggerRefreshLeftData);
|
||||||
|
|
||||||
// ==================== 地图状态管理 ====================
|
// ==================== 地图状态管理 ====================
|
||||||
|
|||||||
@ -116,7 +116,9 @@
|
|||||||
<SectionHeader title="响应调度">
|
<SectionHeader title="响应调度">
|
||||||
<template #right>
|
<template #right>
|
||||||
<div class="header-filters">
|
<div class="header-filters">
|
||||||
<span class="filter-item active">本轮</span>
|
<span class="filter-item active" @click="handleDateRangeClick()"
|
||||||
|
>本轮</span
|
||||||
|
>
|
||||||
<div class="date-range-wrapper">
|
<div class="date-range-wrapper">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="dateRange"
|
v-model="dateRange"
|
||||||
@ -304,6 +306,11 @@ const handleDateChange = (val) => {
|
|||||||
dateRange.value = val;
|
dateRange.value = val;
|
||||||
dispatchLoadLoad();
|
dispatchLoadLoad();
|
||||||
};
|
};
|
||||||
|
// 点击日期范围器
|
||||||
|
const handleDateRangeClick = (val) => {
|
||||||
|
dateRange.value = [];
|
||||||
|
dispatchLoadLoad();
|
||||||
|
};
|
||||||
// 日期选择器数据
|
// 日期选择器数据
|
||||||
const dateRange = ref([]);
|
const dateRange = ref([]);
|
||||||
// 调度清单数据
|
// 调度清单数据
|
||||||
@ -438,16 +445,20 @@ const scheduleStatisticsByCountyLoad = async () => {
|
|||||||
|
|
||||||
// 合并渝北区和江北区为两江新区
|
// 合并渝北区和江北区为两江新区
|
||||||
const mergeLiangjiangNewArea = (arr) => {
|
const mergeLiangjiangNewArea = (arr) => {
|
||||||
const yubeiItems = arr.filter(item => item.countyName === "渝北区");
|
const yubeiItems = arr.filter((item) => item.countyName === "渝北区");
|
||||||
const jiangbeiItems = arr.filter(item => item.countyName === "江北区");
|
const jiangbeiItems = arr.filter(
|
||||||
|
(item) => item.countyName === "江北区",
|
||||||
|
);
|
||||||
|
|
||||||
if (yubeiItems.length > 0 || jiangbeiItems.length > 0) {
|
if (yubeiItems.length > 0 || jiangbeiItems.length > 0) {
|
||||||
// 计算合并后的数据
|
// 计算合并后的数据
|
||||||
const mergedItem = {
|
const mergedItem = {
|
||||||
countyName: "两江新区",
|
countyName: "两江新区",
|
||||||
countyId: yubeiItems[0]?.countyId || jiangbeiItems[0]?.countyId || "",
|
countyId:
|
||||||
|
yubeiItems[0]?.countyId || jiangbeiItems[0]?.countyId || "",
|
||||||
type: yubeiItems[0]?.type || jiangbeiItems[0]?.type || "",
|
type: yubeiItems[0]?.type || jiangbeiItems[0]?.type || "",
|
||||||
roadType: yubeiItems[0]?.roadType || jiangbeiItems[0]?.roadType || "",
|
roadType:
|
||||||
|
yubeiItems[0]?.roadType || jiangbeiItems[0]?.roadType || "",
|
||||||
// 数值字段累加
|
// 数值字段累加
|
||||||
noticeCount: 0,
|
noticeCount: 0,
|
||||||
replyCount: 0,
|
replyCount: 0,
|
||||||
@ -456,7 +467,7 @@ const scheduleStatisticsByCountyLoad = async () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// 累加渝北区数据
|
// 累加渝北区数据
|
||||||
yubeiItems.forEach(item => {
|
yubeiItems.forEach((item) => {
|
||||||
mergedItem.noticeCount += item.noticeCount || 0;
|
mergedItem.noticeCount += item.noticeCount || 0;
|
||||||
mergedItem.replyCount += item.replyCount || 0;
|
mergedItem.replyCount += item.replyCount || 0;
|
||||||
mergedItem.population += item.population || 0;
|
mergedItem.population += item.population || 0;
|
||||||
@ -464,7 +475,7 @@ const scheduleStatisticsByCountyLoad = async () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
// 累加江北区数据
|
// 累加江北区数据
|
||||||
jiangbeiItems.forEach(item => {
|
jiangbeiItems.forEach((item) => {
|
||||||
mergedItem.noticeCount += item.noticeCount || 0;
|
mergedItem.noticeCount += item.noticeCount || 0;
|
||||||
mergedItem.replyCount += item.replyCount || 0;
|
mergedItem.replyCount += item.replyCount || 0;
|
||||||
mergedItem.population += item.population || 0;
|
mergedItem.population += item.population || 0;
|
||||||
@ -472,8 +483,9 @@ const scheduleStatisticsByCountyLoad = async () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
// 移除渝北区和江北区的数据,添加合并后的两江新区数据
|
// 移除渝北区和江北区的数据,添加合并后的两江新区数据
|
||||||
const filteredArr = arr.filter(item =>
|
const filteredArr = arr.filter(
|
||||||
item.countyName !== "渝北区" && item.countyName !== "江北区"
|
(item) =>
|
||||||
|
item.countyName !== "渝北区" && item.countyName !== "江北区",
|
||||||
);
|
);
|
||||||
filteredArr.push(mergedItem);
|
filteredArr.push(mergedItem);
|
||||||
return filteredArr;
|
return filteredArr;
|
||||||
|
|||||||
@ -116,7 +116,9 @@
|
|||||||
<SectionHeader title="受灾情况">
|
<SectionHeader title="受灾情况">
|
||||||
<template #right>
|
<template #right>
|
||||||
<div class="header-filters">
|
<div class="header-filters">
|
||||||
<span class="filter-item active">本轮</span>
|
<span class="filter-item active" @click="handleDateRangeClick()"
|
||||||
|
>1本轮</span
|
||||||
|
>
|
||||||
<div class="date-range-wrapper">
|
<div class="date-range-wrapper">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="dateRange"
|
v-model="dateRange"
|
||||||
@ -128,6 +130,7 @@
|
|||||||
popper-class="custom-date-picker"
|
popper-class="custom-date-picker"
|
||||||
:teleported="false"
|
:teleported="false"
|
||||||
:prefix-icon="Calendar"
|
:prefix-icon="Calendar"
|
||||||
|
@change="handleDateChange"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -194,7 +197,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, onMounted } from "vue";
|
import { ref, computed, onMounted, inject } from "vue";
|
||||||
import { request } from "@/utils/request";
|
import { request } from "@/utils/request";
|
||||||
|
|
||||||
import SectionHeader from "./component/sectionHeader.vue";
|
import SectionHeader from "./component/sectionHeader.vue";
|
||||||
@ -223,14 +226,37 @@ const emit = defineEmits([
|
|||||||
"openResourceDetail",
|
"openResourceDetail",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
// 组件挂载时获取数据
|
// 注入兄弟组件通信机制
|
||||||
onMounted(() => {
|
const setRefreshRightData = inject("setRefreshRightData");
|
||||||
|
|
||||||
|
// 刷新数据的函数
|
||||||
|
const refreshData = () => {
|
||||||
|
console.log("right.vue 刷新数据");
|
||||||
getYhYjllList();
|
getYhYjllList();
|
||||||
getYhYjllListMaterials();
|
getYhYjllListMaterials();
|
||||||
getControlStats();
|
getControlStats();
|
||||||
getRescueInputStats();
|
getRescueInputStats();
|
||||||
getDisasterStats();
|
getDisasterStats();
|
||||||
|
};
|
||||||
|
|
||||||
|
// 组件挂载时获取数据并注册刷新函数
|
||||||
|
onMounted(() => {
|
||||||
|
refreshData();
|
||||||
|
// 注册刷新函数到父组件
|
||||||
|
if (setRefreshRightData) {
|
||||||
|
setRefreshRightData(refreshData);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
// 日期选择器变化事件
|
||||||
|
const handleDateChange = (val) => {
|
||||||
|
dateRange.value = val;
|
||||||
|
getDisasterStats();
|
||||||
|
};
|
||||||
|
// 点击日期范围器
|
||||||
|
const handleDateRangeClick = (val) => {
|
||||||
|
dateRange.value = [];
|
||||||
|
getDisasterStats();
|
||||||
|
};
|
||||||
|
|
||||||
// 获取应急力量列表数据
|
// 获取应急力量列表数据
|
||||||
const getYhYjllList = async () => {
|
const getYhYjllList = async () => {
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="filter-header">
|
<div class="filter-header">
|
||||||
<div class="filter-container">
|
<div class="filter-container">
|
||||||
<span class="filter-item active">本轮</span>
|
<span class="filter-item active" @click="handleDateRangeClick()"
|
||||||
|
>本轮</span
|
||||||
|
>
|
||||||
<div class="date-range-wrapper">
|
<div class="date-range-wrapper">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="dateRange"
|
v-model="dateRange"
|
||||||
@ -38,12 +40,18 @@ const setEndOfDay = (date) => {
|
|||||||
d.setHours(23, 59, 59, 999);
|
d.setHours(23, 59, 59, 999);
|
||||||
return d;
|
return d;
|
||||||
};
|
};
|
||||||
|
// 点击日期范围器
|
||||||
|
const handleDateRangeClick = () => {
|
||||||
|
dateRange.value = [];
|
||||||
|
triggerRefreshLeftData();
|
||||||
|
emit("dateRangeChange", []);
|
||||||
|
};
|
||||||
// 监听 dateRange 变化
|
// 监听 dateRange 变化
|
||||||
watch(
|
watch(
|
||||||
dateRange,
|
dateRange,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
// 只有当值真正发生变化时才触发
|
// 只有当值真正发生变化时才触发
|
||||||
|
console.log("dateRange 变化:", newVal, oldVal);
|
||||||
if (JSON.stringify(newVal) !== JSON.stringify(oldVal)) {
|
if (JSON.stringify(newVal) !== JSON.stringify(oldVal)) {
|
||||||
console.log("dateRange 发生变化:", newVal);
|
console.log("dateRange 发生变化:", newVal);
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user