处理影响点详情数据回填,处理大屏重复调用接口问题,修复弹窗数据缓存问题,修复文档bug。
This commit is contained in:
parent
4ab5bb0abd
commit
037cd50871
@ -21,7 +21,11 @@
|
|||||||
<div class="panel left-panel">
|
<div class="panel left-panel">
|
||||||
<div class="panel-title">气象预警信息</div>
|
<div class="panel-title">气象预警信息</div>
|
||||||
<div class="panel-content">
|
<div class="panel-content">
|
||||||
<div class="warning-content-container">{{ warningData.warningContent }}</div>
|
<div class="warning-content-container">
|
||||||
|
<div>{{ warningData.warningContent }}</div>
|
||||||
|
<div>生效时间:2025-11-13 00:31:30.0</div>
|
||||||
|
<div>失效时间:2025-11-14 06:00:00.0</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@ -266,6 +266,7 @@ const fetchEventDetail = async () => {
|
|||||||
contactPhone: item.gl1Lxdh || '-',
|
contactPhone: item.gl1Lxdh || '-',
|
||||||
// disposeDesc: 处置情况描述
|
// disposeDesc: 处置情况描述
|
||||||
sceneDesc: item.gl1Xcqkms || '-',
|
sceneDesc: item.gl1Xcqkms || '-',
|
||||||
|
images: item.gl1Zjtp ? [item.gl1Zjtp] : [],
|
||||||
}))
|
}))
|
||||||
} else {
|
} else {
|
||||||
feedbackList.value = []
|
feedbackList.value = []
|
||||||
|
|||||||
@ -65,18 +65,13 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 照片 -->
|
<!-- 照片 -->
|
||||||
<div class="section" v-if="photoList.length > 0">
|
<div class="section">
|
||||||
<div class="section-title">
|
<div class="section-title">
|
||||||
<span class="title-icon">▍</span>
|
<span class="title-icon">▍</span>
|
||||||
照片
|
照片
|
||||||
</div>
|
</div>
|
||||||
<div class="photo-list">
|
<div class="photo-list">
|
||||||
<div
|
<div v-for="(photo, index) in photoList" :key="index" class="photo-item" @click="previewImage(photo)">
|
||||||
v-for="(photo, index) in photoList"
|
|
||||||
:key="index"
|
|
||||||
class="photo-item"
|
|
||||||
@click="previewImage(photo)"
|
|
||||||
>
|
|
||||||
<img :src="photo" alt="照片" />
|
<img :src="photo" alt="照片" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -117,10 +112,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="detail-row">
|
<div class="detail-row">
|
||||||
<span class="detail-label">是否发现问题:</span>
|
<span class="detail-label">是否发现问题:</span>
|
||||||
<span
|
<span class="detail-value" :class="record.hasProblem ? 'status-yes' : 'status-no'">
|
||||||
class="detail-value"
|
|
||||||
:class="record.hasProblem ? 'status-yes' : 'status-no'"
|
|
||||||
>
|
|
||||||
{{ record.hasProblem ? '是' : '否' }}
|
{{ record.hasProblem ? '是' : '否' }}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@ -145,10 +137,11 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, watch } from 'vue';
|
import { ref, watch } from 'vue'
|
||||||
import { Close } from '@element-plus/icons-vue';
|
import { Close } from '@element-plus/icons-vue'
|
||||||
import baseDialog from '../component/baseDialog.vue';
|
import baseDialog from '../component/baseDialog.vue'
|
||||||
import { request } from '@/utils/request';
|
import { request } from '@/utils/request'
|
||||||
|
import { getImageUrlList } from '../component/index.js'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
visible: {
|
visible: {
|
||||||
@ -163,9 +156,9 @@ const props = defineProps({
|
|||||||
type: Object,
|
type: Object,
|
||||||
default: () => ({}),
|
default: () => ({}),
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['update:visible', 'close']);
|
const emit = defineEmits(['update:visible', 'close'])
|
||||||
|
|
||||||
// 基本信息
|
// 基本信息
|
||||||
const basicInfo = ref({
|
const basicInfo = ref({
|
||||||
@ -176,18 +169,18 @@ const basicInfo = ref({
|
|||||||
location: '',
|
location: '',
|
||||||
riskDesc: '',
|
riskDesc: '',
|
||||||
discoverTime: '',
|
discoverTime: '',
|
||||||
});
|
})
|
||||||
watch(
|
watch(
|
||||||
() => props.item,
|
() => props.item,
|
||||||
newVal => {
|
(newVal) => {
|
||||||
if (newVal) {
|
if (newVal) {
|
||||||
// 当弹窗打开时获取数据
|
// 当弹窗打开时获取数据
|
||||||
getAffectedObjectTypeId(props.item);
|
getAffectedObjectTypeId(props.item)
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
);
|
)
|
||||||
// 照片列表
|
// 照片列表
|
||||||
const photoList = ref([]);
|
const photoList = ref([])
|
||||||
|
|
||||||
// 动态记录
|
// 动态记录
|
||||||
const dynamicRecords = ref([
|
const dynamicRecords = ref([
|
||||||
@ -207,82 +200,79 @@ const dynamicRecords = ref([
|
|||||||
// hasProblem: false,
|
// hasProblem: false,
|
||||||
// image: null,
|
// image: null,
|
||||||
// },
|
// },
|
||||||
]);
|
])
|
||||||
|
|
||||||
// 状态样式
|
// 状态样式
|
||||||
const getStatusClass = status => {
|
const getStatusClass = (status) => {
|
||||||
if (status === '未回应') return 'status-unresponse';
|
if (status === '未回应') return 'status-unresponse'
|
||||||
if (status === '已回应') return 'status-response';
|
if (status === '已回应') return 'status-response'
|
||||||
return '';
|
return ''
|
||||||
};
|
}
|
||||||
|
|
||||||
// 图片预览
|
// 图片预览
|
||||||
const previewVisible = ref(false);
|
const previewVisible = ref(false)
|
||||||
const previewImageUrl = ref('');
|
const previewImageUrl = ref('')
|
||||||
|
|
||||||
const previewImage = url => {
|
const previewImage = (url) => {
|
||||||
previewImageUrl.value = url;
|
previewImageUrl.value = url
|
||||||
previewVisible.value = true;
|
previewVisible.value = true
|
||||||
};
|
}
|
||||||
|
|
||||||
const closePreview = () => {
|
const closePreview = () => {
|
||||||
previewVisible.value = false;
|
previewVisible.value = false
|
||||||
previewImageUrl.value = '';
|
previewImageUrl.value = ''
|
||||||
};
|
}
|
||||||
|
|
||||||
// 关闭对话框
|
// 关闭对话框
|
||||||
const handleClose = () => {
|
const handleClose = () => {
|
||||||
emit('update:visible', false);
|
emit('update:visible', false)
|
||||||
emit('close');
|
emit('close')
|
||||||
};
|
}
|
||||||
const leveltext = level => {
|
const leveltext = (level) => {
|
||||||
if (level.includes('一') || level.includes('1')) return '一类';
|
if (level.includes('一') || level.includes('1')) return '一类'
|
||||||
if (level.includes('二') || level.includes('2')) return '二类';
|
if (level.includes('二') || level.includes('2')) return '二类'
|
||||||
if (level.includes('三') || level.includes('3')) return '三类';
|
if (level.includes('三') || level.includes('3')) return '三类'
|
||||||
if (level.includes('四') || level.includes('4')) return '四类';
|
if (level.includes('四') || level.includes('4')) return '四类'
|
||||||
if (level.includes('五') || level.includes('5')) return '五类';
|
if (level.includes('五') || level.includes('5')) return '五类'
|
||||||
if (level.includes('9')) return '未评定';
|
if (level.includes('9')) return '未评定'
|
||||||
return '未评定';
|
return '未评定'
|
||||||
};
|
}
|
||||||
// 点击遮罩关闭已由base-dialog组件处理
|
// 点击遮罩关闭已由base-dialog组件处理
|
||||||
// 处理影响点类型数据
|
// 处理影响点类型数据
|
||||||
const getAffectedObjectTypeId = data => {
|
const getAffectedObjectTypeId = (data) => {
|
||||||
let pointType = props.item.pointType;
|
let pointType = props.item.pointType
|
||||||
|
basicInfo.value = {}
|
||||||
|
photoList.value = []
|
||||||
|
dynamicRecords.value = []
|
||||||
if (!data) {
|
if (!data) {
|
||||||
basicInfo.value = {};
|
return
|
||||||
photoList.value = [];
|
|
||||||
dynamicRecords.value = [];
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
if (pointType === '桥梁') {
|
if (pointType === '桥梁') {
|
||||||
// 更新基本信息 - 根据数据库字段映射
|
// 更新基本信息 - 根据数据库字段映射
|
||||||
basicInfo.value = {
|
basicInfo.value = {
|
||||||
district: data.GL1_QXMC || '-', // 区县名称
|
district: data.GL1_QXMC || '-', // 区县名称
|
||||||
level: leveltext(data.GL1_JSZKPJDJ) || '未评定', // 技术状况评级等级
|
level: leveltext(data.GL1_JSZKPJDJ) || '未评定', // 技术状况评级等级
|
||||||
levelClass:
|
levelClass: data.GL1_JSZKPJDJ === '一类' || data.GL1_JSZKPJDJ === '二类' ? 'level-normal' : 'level-serious', // 一二类为一般,三四五类为重大
|
||||||
data.GL1_JSZKPJDJ === '一类' || data.GL1_JSZKPJDJ === '二类'
|
|
||||||
? 'level-normal'
|
|
||||||
: 'level-serious', // 一二类为一般,三四五类为重大
|
|
||||||
roadCode: data.GL1_LXBH || '-', // 路线编号
|
roadCode: data.GL1_LXBH || '-', // 路线编号
|
||||||
location: data.GL1_QLMC || '-', // 桥梁名称作为位置
|
location: data.GL1_QLMC || '-', // 桥梁名称作为位置
|
||||||
riskDesc: data.GL1_DQBH || '-', // 当前病害
|
riskDesc: data.GL1_DQBH || '-', // 当前病害
|
||||||
discoverTime: data.GL1_JSZKPDRQ || '-', // 技术状况评定日期
|
discoverTime: data.GL1_JSZKPDRQ || '-', // 技术状况评定日期
|
||||||
};
|
}
|
||||||
// 更新照片列表 - 使用桥梁照片字段
|
// 更新照片列表 - 使用桥梁照片字段
|
||||||
const photos = [];
|
const photos = []
|
||||||
if (data.GL1_QLZMZFJ) {
|
if (data.GL1_QLZMZFJ) {
|
||||||
photos.push(data.GL1_QLZMZFJ); // 桥梁正面照附件
|
photos.push(data.GL1_QLZMZFJ) // 桥梁正面照附件
|
||||||
}
|
}
|
||||||
if (data.GL1_QLLMZFJ) {
|
if (data.GL1_QLLMZFJ) {
|
||||||
photos.push(data.GL1_QLLMZFJ); // 桥梁立面照附件
|
photos.push(data.GL1_QLLMZFJ) // 桥梁立面照附件
|
||||||
}
|
}
|
||||||
if (data.GL1_QLDXZFJ) {
|
if (data.GL1_QLDXZFJ) {
|
||||||
photos.push(data.GL1_QLDXZFJ); // 桥梁典型照附件
|
photos.push(data.GL1_QLDXZFJ) // 桥梁典型照附件
|
||||||
}
|
}
|
||||||
if (data.GL1_QLZP) {
|
if (data.GL1_QLZP) {
|
||||||
photos.push(data.GL1_QLZP); // 桥梁照片
|
photos.push(data.GL1_QLZP) // 桥梁照片
|
||||||
}
|
}
|
||||||
photoList.value = photos.length > 0 ? photos : [];
|
photoList.value = photos.length > 0 ? photos : []
|
||||||
|
|
||||||
// 更新动态记录 - 桥梁信息没有巡查记录,使用基础信息展示
|
// 更新动态记录 - 桥梁信息没有巡查记录,使用基础信息展示
|
||||||
// dynamicRecords.value = [
|
// dynamicRecords.value = [
|
||||||
@ -300,22 +290,19 @@ const getAffectedObjectTypeId = data => {
|
|||||||
basicInfo.value = {
|
basicInfo.value = {
|
||||||
district: data.GL1_QXMC || '-', // 区县名称
|
district: data.GL1_QXMC || '-', // 区县名称
|
||||||
level: leveltext(data.GL1_FXDJ) || '未评定', // 风险等级
|
level: leveltext(data.GL1_FXDJ) || '未评定', // 风险等级
|
||||||
levelClass:
|
levelClass: data.GL1_FXDJ?.includes('一级') || data.GL1_FXDJ?.includes('二级') ? 'level-normal' : 'level-serious', // 一二级为一般,三四五级为重大
|
||||||
data.GL1_FXDJ?.includes('一级') || data.GL1_FXDJ?.includes('二级')
|
|
||||||
? 'level-normal'
|
|
||||||
: 'level-serious', // 一二级为一般,三四五级为重大
|
|
||||||
roadCode: data.GL1_LXBM || '-', // 路线编码
|
roadCode: data.GL1_LXBM || '-', // 路线编码
|
||||||
location: data.GL1_BPGC || '-', // 边坡概况
|
location: data.GL1_BPGC || '-', // 边坡概况
|
||||||
riskDesc: data.GL1_JCSSSZ || '-', // 监测设施设置
|
riskDesc: data.GL1_JCSSSZ || '-', // 监测设施设置
|
||||||
discoverTime: data.GL1_ZRRXM || '-', // 责任人姓名
|
discoverTime: data.GL1_ZRRXM || '-', // 责任人姓名
|
||||||
};
|
}
|
||||||
|
|
||||||
// 更新照片列表 - 边坡照片字段
|
// 更新照片列表 - 边坡照片字段
|
||||||
const photos = [];
|
const photos = []
|
||||||
if (data.GL1_ZRLXFS) {
|
if (data.GL1_ZRLXFS) {
|
||||||
photos.push(data.GL1_ZRLXFS); // 责任人联系方式(可能包含图片URL)
|
photos.push(data.GL1_ZRLXFS) // 责任人联系方式(可能包含图片URL)
|
||||||
}
|
}
|
||||||
photoList.value = photos.length > 0 ? photos : [];
|
photoList.value = photos.length > 0 ? photos : []
|
||||||
|
|
||||||
// 更新动态记录 - 边坡信息展示
|
// 更新动态记录 - 边坡信息展示
|
||||||
// dynamicRecords.value = [
|
// dynamicRecords.value = [
|
||||||
@ -333,29 +320,28 @@ const getAffectedObjectTypeId = data => {
|
|||||||
basicInfo.value = {
|
basicInfo.value = {
|
||||||
district: data.GL1_QXMC || '-', // 区县名称
|
district: data.GL1_QXMC || '-', // 区县名称
|
||||||
level: leveltext(data.GL1_PDDJ) || '未评定', // 评定等级
|
level: leveltext(data.GL1_PDDJ) || '未评定', // 评定等级
|
||||||
levelClass:
|
levelClass: data.GL1_PDDJ === '一级' || data.GL1_PDDJ === '二级' ? 'level-normal' : 'level-serious', // 一二级为一般,三四五级为重大
|
||||||
data.GL1_PDDJ === '一级' || data.GL1_PDDJ === '二级' ? 'level-normal' : 'level-serious', // 一二级为一般,三四五级为重大
|
|
||||||
roadCode: data.GL1_LXBH || '-', // 路线编号
|
roadCode: data.GL1_LXBH || '-', // 路线编号
|
||||||
location: data.GL1_SDMC || '-', // 隧道名称作为位置
|
location: data.GL1_SDMC || '-', // 隧道名称作为位置
|
||||||
riskDesc: data.GL1_BHMS || '-', // 病害描述
|
riskDesc: data.GL1_BHMS || '-', // 病害描述
|
||||||
discoverTime: data.GL1_PDRQ || '-', // 评定日期
|
discoverTime: data.GL1_PDRQ || '-', // 评定日期
|
||||||
};
|
}
|
||||||
|
|
||||||
// 更新照片列表 - 使用隧道照片字段
|
// 更新照片列表 - 使用隧道照片字段
|
||||||
const photos = [];
|
const photos = []
|
||||||
if (data.GL1_SDJDKFJS) {
|
if (data.GL1_SDJDKFJS) {
|
||||||
photos.push(data.GL1_SDJDKFJS); // 隧道进洞口照片
|
photos.push(data.GL1_SDJDKFJS) // 隧道进洞口照片
|
||||||
}
|
}
|
||||||
if (data.GL1_SDCDKFJS) {
|
if (data.GL1_SDCDKFJS) {
|
||||||
photos.push(data.GL1_SDCDKFJS); // 隧道出洞口照片
|
photos.push(data.GL1_SDCDKFJS) // 隧道出洞口照片
|
||||||
}
|
}
|
||||||
if (data.GL1_SDDXZP) {
|
if (data.GL1_SDDXZP) {
|
||||||
photos.push(data.GL1_SDDXZP); // 隧道典型照片
|
photos.push(data.GL1_SDDXZP) // 隧道典型照片
|
||||||
}
|
}
|
||||||
if (data.GL1_TP) {
|
if (data.GL1_TP) {
|
||||||
photos.push(data.GL1_TP); // 图片
|
photos.push(data.GL1_TP) // 图片
|
||||||
}
|
}
|
||||||
photoList.value = photos.length > 0 ? photos : [];
|
photoList.value = photos.length > 0 ? photos : []
|
||||||
|
|
||||||
// 更新动态记录 - 隧道信息展示
|
// 更新动态记录 - 隧道信息展示
|
||||||
// dynamicRecords.value = [
|
// dynamicRecords.value = [
|
||||||
@ -376,13 +362,17 @@ const getAffectedObjectTypeId = data => {
|
|||||||
levelClass: data.rawData.GL1_FXDJ, // 一二级为一般,三四五级为重大
|
levelClass: data.rawData.GL1_FXDJ, // 一二级为一般,三四五级为重大
|
||||||
roadCode: data.rawData.GL1_LXBH || '-', // 路线编号
|
roadCode: data.rawData.GL1_LXBH || '-', // 路线编号
|
||||||
location: data.pointLocation, // 起点到终点
|
location: data.pointLocation, // 起点到终点
|
||||||
riskDesc: data.rawData.GL1_FXMS || '-', // 风险点
|
riskDesc: data.rawData.GL1_FXMS || '-', // 风险点
|
||||||
discoverTime: data.rawData.GL1_SBSJ || '-', // 发现时间
|
discoverTime: data.rawData.GL1_SBSJ || '-', // 发现时间
|
||||||
};
|
}
|
||||||
|
const photos = []
|
||||||
// 更新照片列表 - 路段一般没有照片
|
// 更新照片列表 - 路段一般没有照片
|
||||||
photoList.value = [];
|
if (getImageUrlList(data.item?.RISK_POINT?.GL1_TP).length > 0) {
|
||||||
|
photos.push(...getImageUrlList(data.item?.RISK_POINT?.GL1_TP || '')) // 图片
|
||||||
|
}
|
||||||
|
photoList.value = photos.length > 0 ? photos : []
|
||||||
|
|
||||||
|
console.log('照片列表:', photos)
|
||||||
// 更新动态记录 - 路段信息展示
|
// 更新动态记录 - 路段信息展示
|
||||||
// dynamicRecords.value = [
|
// dynamicRecords.value = [
|
||||||
// {
|
// {
|
||||||
@ -395,58 +385,58 @@ const getAffectedObjectTypeId = data => {
|
|||||||
// },
|
// },
|
||||||
// ];
|
// ];
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// 获取影响点详情数据
|
// 获取影响点详情数据
|
||||||
const getAffectedObjectDetail = async () => {
|
const getAffectedObjectDetail = async () => {
|
||||||
try {
|
try {
|
||||||
let id = '';
|
let id = ''
|
||||||
let apiUrl = '';
|
let apiUrl = ''
|
||||||
const pointType = props.item?.pointType;
|
const pointType = props.item?.pointType
|
||||||
|
|
||||||
if (pointType === '桥梁') {
|
if (pointType === '桥梁') {
|
||||||
id = props.item?.rawData?.GL1_ZJ || '';
|
id = props.item?.rawData?.GL1_ZJ || ''
|
||||||
apiUrl = `/snow-ops-platform/weather-warning/affected-object/bridge/${id}`;
|
apiUrl = `/snow-ops-platform/weather-warning/affected-object/bridge/${id}`
|
||||||
} else if (pointType === '边坡') {
|
} else if (pointType === '边坡') {
|
||||||
id = props.item?.rawData?.GL1_ID || '';
|
id = props.item?.rawData?.GL1_ID || ''
|
||||||
apiUrl = `/snow-ops-platform/weather-warning/affected-object/slope/${id}`;
|
apiUrl = `/snow-ops-platform/weather-warning/affected-object/slope/${id}`
|
||||||
} else if (pointType === '隧道') {
|
} else if (pointType === '隧道') {
|
||||||
id = props.item?.rawData?.GL1_ZJ || '';
|
id = props.item?.rawData?.GL1_ZJ || ''
|
||||||
apiUrl = `/snow-ops-platform/weather-warning/affected-object/tunnel/${id}`;
|
apiUrl = `/snow-ops-platform/weather-warning/affected-object/tunnel/${id}`
|
||||||
} else if (pointType === '路段') {
|
} else if (pointType === '路段') {
|
||||||
id = props.item?.rawData?.GL1ZJ || '';
|
id = props.item?.rawData?.GL1ZJ || ''
|
||||||
apiUrl = `/snow-ops-platform/weather-warning/affected-object/road-section/${id}`;
|
apiUrl = `/snow-ops-platform/weather-warning/affected-object/road-section/${id}`
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!id || !apiUrl) {
|
if (!id || !apiUrl) {
|
||||||
console.warn('未找到影响点ID或API地址');
|
console.warn('未找到影响点ID或API地址')
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
const res = await request({
|
const res = await request({
|
||||||
url: apiUrl,
|
url: apiUrl,
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
});
|
})
|
||||||
|
|
||||||
console.log('影响点详情数据:', res);
|
console.log('影响点详情数据:', res)
|
||||||
if (res.code === '00000') {
|
if (res.code === '00000') {
|
||||||
getAffectedObjectTypeId(res.data || {});
|
getAffectedObjectTypeId(res.data || {})
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('获取影响点详情数据失败:', error);
|
console.error('获取影响点详情数据失败:', error)
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// 监听visible变化
|
// 监听visible变化
|
||||||
watch(
|
watch(
|
||||||
() => props.visible,
|
() => props.visible,
|
||||||
newVal => {
|
(newVal) => {
|
||||||
if (newVal) {
|
if (newVal) {
|
||||||
// 当弹窗打开时获取数据
|
// 当弹窗打开时获取数据
|
||||||
// getAffectedObjectDetail();
|
// getAffectedObjectDetail();
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
);
|
)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@ -209,7 +209,6 @@ import Icon3 from '../../../assets/xiangying/未选中3@2x.png'
|
|||||||
import Icon4 from '../../../assets/xiangying/未选中4@2x.png'
|
import Icon4 from '../../../assets/xiangying/未选中4@2x.png'
|
||||||
|
|
||||||
import { formatDateTime } from '../component/index.js'
|
import { formatDateTime } from '../component/index.js'
|
||||||
onMounted(() => {})
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
visible: {
|
visible: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
@ -367,6 +366,9 @@ const loadBarChartData = async () => {
|
|||||||
|
|
||||||
// 转换英文name为中文
|
// 转换英文name为中文
|
||||||
const convertedData = data.map((item) => {
|
const convertedData = data.map((item) => {
|
||||||
|
if (item.extension == '项目') {
|
||||||
|
item.extension = '驻地'
|
||||||
|
}
|
||||||
const name = nameMap[item.name] || item.name
|
const name = nameMap[item.name] || item.name
|
||||||
return { ...item, name }
|
return { ...item, name }
|
||||||
})
|
})
|
||||||
@ -463,8 +465,8 @@ const handleSearch = () => {
|
|||||||
|
|
||||||
// 查看详情
|
// 查看详情
|
||||||
const handleDetail = (item) => {
|
const handleDetail = (item) => {
|
||||||
emit('detail', item)
|
emit('detail', { ...item, warningId: props.handleImpactItem.warningId })
|
||||||
emit('itemClick', item)
|
emit('itemClick', { ...item, warningId: props.handleImpactItem.warningId })
|
||||||
}
|
}
|
||||||
|
|
||||||
// 分页操作
|
// 分页操作
|
||||||
@ -484,7 +486,7 @@ const handleFilterChange = () => {
|
|||||||
}
|
}
|
||||||
// 获取时间参数
|
// 获取时间参数
|
||||||
|
|
||||||
const getTimeParams = () => {
|
const getTimeParams = (type) => {
|
||||||
console.log('原始时间范围:', props.handleImpactItem)
|
console.log('原始时间范围:', props.handleImpactItem)
|
||||||
let countyId = ''
|
let countyId = ''
|
||||||
console.log('区域:', filterForm.value)
|
console.log('区域:', filterForm.value)
|
||||||
@ -493,10 +495,7 @@ const getTimeParams = () => {
|
|||||||
countyId = item.value || ''
|
countyId = item.value || ''
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
let obj = {
|
||||||
return {
|
|
||||||
// start: `${year}-${month}-01 00:00:00`,
|
|
||||||
// end: `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`,
|
|
||||||
start: formatDateTime(props.getdateRange[0] ? props.getdateRange[0] : props.handleImpactItem.dateRange?.[0] || ''),
|
start: formatDateTime(props.getdateRange[0] ? props.getdateRange[0] : props.handleImpactItem.dateRange?.[0] || ''),
|
||||||
end: formatDateTime(props.getdateRange[1] ? props.getdateRange[1] : props.handleImpactItem.dateRange?.[1] || ''),
|
end: formatDateTime(props.getdateRange[1] ? props.getdateRange[1] : props.handleImpactItem.dateRange?.[1] || ''),
|
||||||
limit: pageSize.value,
|
limit: pageSize.value,
|
||||||
@ -505,6 +504,15 @@ const getTimeParams = () => {
|
|||||||
riskLevel: filterForm.value.pointLevel || '',
|
riskLevel: filterForm.value.pointLevel || '',
|
||||||
roadTypes: filterForm.value.roadType || '',
|
roadTypes: filterForm.value.roadType || '',
|
||||||
}
|
}
|
||||||
|
if (type === '路段' || type === '驻地') {
|
||||||
|
obj.warningId = props.handleImpactItem.warningId || ''
|
||||||
|
}
|
||||||
|
|
||||||
|
return obj
|
||||||
|
// {
|
||||||
|
// // start: `${year}-${month}-01 00:00:00`,
|
||||||
|
// // end: `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`,
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
// 处理数据为统一格式
|
// 处理数据为统一格式
|
||||||
const processUnifiedData = (item, type) => {
|
const processUnifiedData = (item, type) => {
|
||||||
@ -752,7 +760,7 @@ const processDataByType = (item, type) => {
|
|||||||
const fetchData = async () => {
|
const fetchData = async () => {
|
||||||
console.log('获取第', currentPage.value, '页数据, 类型:', cardType.value)
|
console.log('获取第', currentPage.value, '页数据, 类型:', cardType.value)
|
||||||
try {
|
try {
|
||||||
const timeParams = getTimeParams()
|
const timeParams = getTimeParams(cardTypeVal.value)
|
||||||
|
|
||||||
// 根据 cardType 获取对应的 API URL
|
// 根据 cardType 获取对应的 API URL
|
||||||
const apiUrl = getApiUrlByType(cardTypeVal.value)
|
const apiUrl = getApiUrlByType(cardTypeVal.value)
|
||||||
@ -811,20 +819,22 @@ watch(
|
|||||||
total.value = 0
|
total.value = 0
|
||||||
tableData.value = []
|
tableData.value = []
|
||||||
cardType.value = '0'
|
cardType.value = '0'
|
||||||
loadBarChartData()
|
|
||||||
console.log('影响点情况=========newVal:', newVal)
|
console.log('影响点情况=========newVal:', newVal)
|
||||||
if (newVal) {
|
if (newVal) {
|
||||||
filterForm.value.region = newVal.countyName
|
filterForm.value.region = newVal.countyName
|
||||||
currentPage.value = 1
|
currentPage.value = 1
|
||||||
fetchData()
|
|
||||||
} else {
|
} else {
|
||||||
filterForm.value = {
|
filterForm.value = {
|
||||||
district: '',
|
district: '',
|
||||||
type: '',
|
type: '',
|
||||||
roadConditionType: '',
|
roadConditionType: '',
|
||||||
roadType: '',
|
roadType: '',
|
||||||
|
pointType: '',
|
||||||
}
|
}
|
||||||
|
cardType.value = '0'
|
||||||
}
|
}
|
||||||
|
fetchData()
|
||||||
|
loadBarChartData()
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
// 监听visible变化
|
// 监听visible变化
|
||||||
@ -839,9 +849,9 @@ watch(
|
|||||||
// }
|
// }
|
||||||
// tableData.value = []
|
// tableData.value = []
|
||||||
// cardType.value = '0'
|
// cardType.value = '0'
|
||||||
loadBarChartData()
|
// loadBarChartData()
|
||||||
// currentPage.value = 1
|
// currentPage.value = 1
|
||||||
// fetchData()
|
//
|
||||||
// }
|
// }
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
|
|||||||
@ -24,7 +24,7 @@
|
|||||||
@click="handleClick(item.type)"
|
@click="handleClick(item.type)"
|
||||||
class="stat-card"
|
class="stat-card"
|
||||||
:style="{
|
:style="{
|
||||||
backgroundImage: `url(${cardType === item.type ? selectedIcon : unselectedIcon})`,
|
backgroundImage: `url(${cardType == item.type ? selectedIcon : unselectedIcon})`,
|
||||||
backgroundSize: '100% 100%',
|
backgroundSize: '100% 100%',
|
||||||
backgroundPosition: 'center',
|
backgroundPosition: 'center',
|
||||||
}"
|
}"
|
||||||
@ -415,7 +415,25 @@ const handleFilterChange = () => {
|
|||||||
watch(
|
watch(
|
||||||
() => props.visible,
|
() => props.visible,
|
||||||
(newVal) => {
|
(newVal) => {
|
||||||
|
filterForm.value = {
|
||||||
|
pointType: '',
|
||||||
|
pointLevel: '',
|
||||||
|
region: '',
|
||||||
|
}
|
||||||
|
tableData.value = []
|
||||||
|
cardType.value = '路段'
|
||||||
|
currentPage.value = 1
|
||||||
if (newVal) {
|
if (newVal) {
|
||||||
|
// fetchData()
|
||||||
|
loadBarChartData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
)
|
||||||
|
watch(
|
||||||
|
() => cardType.value,
|
||||||
|
(newVal) => {
|
||||||
|
if (newVal) {
|
||||||
|
tableData.value = []
|
||||||
currentPage.value = 1
|
currentPage.value = 1
|
||||||
fetchData()
|
fetchData()
|
||||||
loadBarChartData()
|
loadBarChartData()
|
||||||
@ -428,7 +446,6 @@ watch(
|
|||||||
() => props.dispatchDateRange,
|
() => props.dispatchDateRange,
|
||||||
() => {
|
() => {
|
||||||
if (props.visible) {
|
if (props.visible) {
|
||||||
currentPage.value = 1
|
|
||||||
fetchData()
|
fetchData()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -437,7 +454,7 @@ watch(
|
|||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 初始化加载顶部卡片数据
|
// 初始化加载顶部卡片数据
|
||||||
loadBarChartData()
|
// loadBarChartData()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@ -85,7 +85,7 @@ const props = defineProps({
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['update:visible', 'close', 'impactClick'])
|
const emit = defineEmits(['update:visible', 'close', 'impactClick', 'impactClickItem'])
|
||||||
|
|
||||||
// 日期范围器
|
// 日期范围器
|
||||||
const dateRange = ref([])
|
const dateRange = ref([])
|
||||||
@ -224,6 +224,7 @@ const fetchWarningData = async () => {
|
|||||||
endTime: item.endTime || '-',
|
endTime: item.endTime || '-',
|
||||||
impactCount: item.affectedCount || 0,
|
impactCount: item.affectedCount || 0,
|
||||||
warningId: item.warningId || '',
|
warningId: item.warningId || '',
|
||||||
|
...item,
|
||||||
}))
|
}))
|
||||||
} else {
|
} else {
|
||||||
tableData.value = []
|
tableData.value = []
|
||||||
|
|||||||
@ -17,10 +17,9 @@
|
|||||||
:dataList="centerCardDataList"
|
:dataList="centerCardDataList"
|
||||||
@close="closeCenterCard"
|
@close="closeCenterCard"
|
||||||
@itemClick="handleCenterCardItemClick"
|
@itemClick="handleCenterCardItemClick"
|
||||||
@click="handleCenterCardClick"
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<hazardPointSituationDialog v-model:visible="hazardPointSituationDialogVisible" :data="{}" @close="closeHazardPointSituationDialog" />
|
<hazardPointSituationDialog :data="{}" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -1738,15 +1737,14 @@ const handleHazardItemClick = async (item, flag) => {
|
|||||||
const riskLevel = riskLevelMap[item.label] || ''
|
const riskLevel = riskLevelMap[item.label] || ''
|
||||||
await getRiskPointData(riskLevel, item, flag)
|
await getRiskPointData(riskLevel, item, flag)
|
||||||
}
|
}
|
||||||
|
const flag = ref(true)
|
||||||
// 监听 dateRange 变化,重新加载数据
|
// 监听 dateRange 变化,重新加载数据
|
||||||
watch(
|
watch(
|
||||||
() => props.dateRange,
|
() => props.dateRange,
|
||||||
async (newVal, oldVal) => {
|
async (newVal, oldVal) => {
|
||||||
console.log('dateRange 变化:', newVal, oldVal)
|
console.log('dateRange 变化:', newVal, oldVal)
|
||||||
// 先重新加载受影响区县数据
|
// 先重新加载受影响区县数据
|
||||||
clearProjectMarkers() // 清除项目标记
|
await clearProjectMarkers() // 清除项目标记
|
||||||
|
|
||||||
await getAffectedCountyData()
|
await getAffectedCountyData()
|
||||||
},
|
},
|
||||||
{ deep: true },
|
{ deep: true },
|
||||||
@ -1767,7 +1765,7 @@ watch(
|
|||||||
// 组件挂载时加载地图
|
// 组件挂载时加载地图
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 获取受影响对象数据
|
// 获取受影响对象数据
|
||||||
getAffectedCountyData()
|
// getAffectedCountyData()
|
||||||
|
|
||||||
// 检查 Leaflet 是否已加载
|
// 检查 Leaflet 是否已加载
|
||||||
if (typeof window.L === 'undefined') {
|
if (typeof window.L === 'undefined') {
|
||||||
|
|||||||
@ -172,32 +172,20 @@ export const formatDateTime = (date) => {
|
|||||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
|
||||||
}
|
}
|
||||||
|
|
||||||
// 记录用户操作日志(使用 fetch keepalive 确保页面切换后请求仍能完成)
|
// 记录用户操作日志
|
||||||
export const logUserOperation = (type, command) => {
|
export const logUserOperation = async (type, command) => {
|
||||||
try {
|
const data = { type, command }
|
||||||
const data = { type, command }
|
|
||||||
|
|
||||||
// 使用 fetch 的 keepalive 选项确保页面卸载后请求仍能完成
|
const res = await request({
|
||||||
fetch('/snow-ops-platform/weather-warning/users/logs', {
|
url: '/snow-ops-platform/weather-warning/users/logs',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
data: data,
|
||||||
'Content-Type': 'application/json',
|
})
|
||||||
},
|
console.log('日志请求完成:', res)
|
||||||
body: JSON.stringify(data),
|
if (res.code === '00000') {
|
||||||
keepalive: true, // 关键:确保页面切换后请求仍能完成
|
ElMessage.success('操作日志记录成功')
|
||||||
})
|
} else {
|
||||||
.then((response) => {
|
ElMessage.error(res.message || '操作日志记录失败')
|
||||||
console.log('日志请求完成:', response.status)
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
console.error('日志请求失败:', error)
|
|
||||||
})
|
|
||||||
|
|
||||||
console.log('日志已触发发送:', data)
|
|
||||||
return true
|
|
||||||
} catch (error) {
|
|
||||||
console.error('记录操作日志失败:', error)
|
|
||||||
return false
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -583,15 +583,15 @@ const allCountyData = ref({})
|
|||||||
const handleDistrictClick = (item) => {
|
const handleDistrictClick = (item) => {
|
||||||
console.log('区县点击:', item)
|
console.log('区县点击:', item)
|
||||||
allCountyData.value = item
|
allCountyData.value = item
|
||||||
// if (item.data.roadType == 'national') {
|
if (item.data.roadType == 'national') {
|
||||||
// // 国省道
|
// 国省道
|
||||||
// openDialog('tongnanTeam')
|
openDialog('tongnanTeam')
|
||||||
// } else if (item.data.roadType == 'rural') {
|
} else if (item.data.roadType == 'rural') {
|
||||||
// openDialog('responseSituation')
|
openDialog('responseSituation')
|
||||||
// } else if (item.data.type == 'project' && item.data.roadType == '-') {
|
} else if (item.data.type == 'project' && item.data.roadType == '-') {
|
||||||
// // 驻地
|
// 驻地
|
||||||
// openDialog('tongnanResponsible')
|
openDialog('tongnanResponsible')
|
||||||
// }
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 处理中心卡片点击
|
// 处理中心卡片点击
|
||||||
@ -604,6 +604,7 @@ const handleCenterCardClick = (item) => {
|
|||||||
title: getCardTitleByType(item.type),
|
title: getCardTitleByType(item.type),
|
||||||
dataList: item.data,
|
dataList: item.data,
|
||||||
}
|
}
|
||||||
|
if (item.type == 'second') return
|
||||||
chongqingMapRef.value.openCenterCard(cardData)
|
chongqingMapRef.value.openCenterCard(cardData)
|
||||||
|
|
||||||
// 如果数据中包含区县信息,定位到第一个区县
|
// 如果数据中包含区县信息,定位到第一个区县
|
||||||
@ -681,6 +682,16 @@ const mapBase = useMapBase(mapStore)
|
|||||||
* 组件挂载后初始化地图
|
* 组件挂载后初始化地图
|
||||||
*/
|
*/
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
// 首先尝试从 URL 获取 token
|
||||||
|
const urlParams = new URLSearchParams(window.location.search)
|
||||||
|
const urlToken = urlParams.get('token')
|
||||||
|
console.log('从 URL 获取的 token:', urlToken)
|
||||||
|
if (urlToken) {
|
||||||
|
// 更新本地存储
|
||||||
|
localStorage.setItem('token', urlToken)
|
||||||
|
sessionStorage.setItem('token', urlToken)
|
||||||
|
console.log('从 URL 获取并更新 token 成功')
|
||||||
|
}
|
||||||
// 加载地图业务底图 并 聚焦中心点
|
// 加载地图业务底图 并 聚焦中心点
|
||||||
mapBase.loadBaseData()
|
mapBase.loadBaseData()
|
||||||
fetchRoadConditionOptions() // 获取路况类型选项
|
fetchRoadConditionOptions() // 获取路况类型选项
|
||||||
|
|||||||
@ -148,24 +148,26 @@ const setRefreshLeftData = inject('setRefreshLeftData')
|
|||||||
// 注入日期范围
|
// 注入日期范围
|
||||||
const getdateRange = inject('getdateRange', ref([]))
|
const getdateRange = inject('getdateRange', ref([]))
|
||||||
|
|
||||||
|
const flag = ref(true)
|
||||||
// 监听日期范围变化,当获取到数据时重新加载
|
// 监听日期范围变化,当获取到数据时重新加载
|
||||||
watch(
|
watch(
|
||||||
() => getdateRange.value,
|
() => getdateRange.value,
|
||||||
(newVal) => {
|
(newVal) => {
|
||||||
console.log('left.vue 日期范围变化:', newVal)
|
console.log('left.vue 日期范围变化:', newVal)
|
||||||
dateRange.value = JSON.parse(JSON.stringify(newVal))
|
dateRange.value = newVal
|
||||||
|
// dispatchLoadLoad() // 加载调度清单
|
||||||
|
// scheduleStatisticsByCountyLoad() // 加载调度统计
|
||||||
init()
|
init()
|
||||||
},
|
},
|
||||||
{ deep: true },
|
{ deep: true },
|
||||||
)
|
)
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
init()
|
// init()
|
||||||
|
|
||||||
// 注册刷新函数给父组件
|
// 注册刷新函数给父组件
|
||||||
if (setRefreshLeftData) {
|
// if (setRefreshLeftData) {
|
||||||
setRefreshLeftData(init)
|
// setRefreshLeftData(init)
|
||||||
}
|
// }
|
||||||
})
|
})
|
||||||
const init = () => {
|
const init = () => {
|
||||||
roadTypeLoad() // 加载路段类型
|
roadTypeLoad() // 加载路段类型
|
||||||
@ -338,6 +340,7 @@ watch(
|
|||||||
(newVal) => {
|
(newVal) => {
|
||||||
console.log('left.vue 调度响应变化:', newVal)
|
console.log('left.vue 调度响应变化:', newVal)
|
||||||
dispatchLoadLoad()
|
dispatchLoadLoad()
|
||||||
|
scheduleStatisticsByCountyLoad() // 加载调度统计
|
||||||
},
|
},
|
||||||
{ deep: true },
|
{ deep: true },
|
||||||
)
|
)
|
||||||
@ -683,37 +686,37 @@ const districtData = ref([])
|
|||||||
const responseStats = ref([
|
const responseStats = ref([
|
||||||
{
|
{
|
||||||
label: '叫应总数',
|
label: '叫应总数',
|
||||||
value: '15',
|
value: '0',
|
||||||
iconClass: 'icon-call',
|
iconClass: 'icon-call',
|
||||||
img: imgCall,
|
img: imgCall,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '已回应数',
|
label: '已回应数',
|
||||||
value: '9',
|
value: '0',
|
||||||
iconClass: 'icon-reply',
|
iconClass: 'icon-reply',
|
||||||
img: imgReply,
|
img: imgReply,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '回应率',
|
label: '回应率',
|
||||||
value: '100%',
|
value: '0%',
|
||||||
iconClass: 'icon-rate',
|
iconClass: 'icon-rate',
|
||||||
img: imgRate,
|
img: imgRate,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '调度区县数',
|
label: '调度区县数',
|
||||||
value: '21',
|
value: '0',
|
||||||
iconClass: 'icon-district',
|
iconClass: 'icon-district',
|
||||||
img: imgDistrict,
|
img: imgDistrict,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '线下帮扶数',
|
label: '线下帮扶数',
|
||||||
value: '12',
|
value: '0',
|
||||||
iconClass: 'icon-help',
|
iconClass: 'icon-help',
|
||||||
img: imgHelp,
|
img: imgHelp,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '抽查人次',
|
label: '抽查人次',
|
||||||
value: '23',
|
value: '0',
|
||||||
iconClass: 'icon-check',
|
iconClass: 'icon-check',
|
||||||
img: imgCheck,
|
img: imgCheck,
|
||||||
},
|
},
|
||||||
|
|||||||
@ -745,18 +745,22 @@ const init = () => {
|
|||||||
|
|
||||||
// 组件挂载时获取数据并注册刷新函数
|
// 组件挂载时获取数据并注册刷新函数
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
init()
|
// init()
|
||||||
// 注册刷新函数到父组件
|
// 注册刷新函数到父组件
|
||||||
if (setRefreshRightData) {
|
// if (setRefreshRightData) {
|
||||||
setRefreshRightData(init)
|
// setRefreshRightData(init)
|
||||||
}
|
// }
|
||||||
})
|
})
|
||||||
|
const flag = ref(true)
|
||||||
watch(
|
watch(
|
||||||
() => getdateRange.value,
|
() => getdateRange.value,
|
||||||
(newVal) => {
|
(newVal, oldVal) => {
|
||||||
|
if (flag.value) {
|
||||||
|
flag.value = false
|
||||||
|
return
|
||||||
|
}
|
||||||
|
dateRange.value = JSON.parse(JSON.stringify(newVal))
|
||||||
console.log('right.vue 日期范围变化:', newVal)
|
console.log('right.vue 日期范围变化:', newVal)
|
||||||
dateRange.value = newVal
|
|
||||||
init()
|
init()
|
||||||
},
|
},
|
||||||
{ deep: true, immediate: true },
|
{ deep: true, immediate: true },
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user