This commit is contained in:
fanjia 2026-04-24 16:37:05 +08:00
commit c590197ebf
15 changed files with 411 additions and 487 deletions

View File

@ -206,7 +206,7 @@ const handleClickItem = (item) => {
router.push({
path: '/waterDisasterDetail',
query: {
id: item.id
id: item.relationId
}
})
}

View File

@ -4,7 +4,7 @@
<PanelItem title="基本信息" v-if="!isContinue">
<!-- 发生时间 (顶层 occurTime) -->
<BaseDatePicker
v-model="formData.occurTime"
v-model="formData.event.occurTime"
label="发生时间"
placeholder="请选择时间"
:columnsType="['year', 'month', 'day', 'hour', 'minute']"
@ -17,21 +17,33 @@
<!-- 线路编号 (顶层 routeNo) -->
<RoadRoutesPicker
v-model="formData.routeNo"
v-model="formData.event.routeNo"
label="线路编号"
placeholder="请线路"
@change="handleRouteNoChange"
/>
<!-- 发生地点 (occurLocation) -->
<van-field v-model="formData.occurLocation" label="发生地点" placeholder="请填写" />
<van-field v-model="formData.event.occurLocation" label="发生地点" placeholder="请填写" />
<!-- 起点桩号 (event.startStakeNo) -->
<van-field v-model="formData.event.startStakeNo" label="起点桩号(K)" placeholder="请填写" />
<!-- 起点桩经度 -->
<van-field v-model="formData.event.startStakeLng" label="起点桩经度" placeholder="请填写" type="digit" />
<!-- 起点桩纬度 -->
<van-field v-model="formData.event.startStakeLat" label="起点桩纬度" placeholder="请填写" type="digit" />
<!-- 止点桩号 (event.endStakeNo) -->
<van-field v-model="formData.event.endStakeNo" label="止点桩号(K)" placeholder="请填写" />
<!-- 止点桩经度 -->
<van-field v-model="formData.event.endStakeLng" label="止点桩经度" placeholder="请填写" type="digit" />
<!-- 止点桩纬度 -->
<van-field v-model="formData.event.endStakeLat" label="止点桩纬度" placeholder="请填写" type="digit" />
<!-- 受灾里程 (event.disasterMileage) -->
<van-field
v-model="formData.event.disasterMileage"
@ -127,6 +139,8 @@
placeholder="请填写"
/>
<van-field v-model="formData.report.siteDescription" label="现场描述" placeholder="请填写" type="textarea" rows="2" autosize />
<BaseDatePicker
v-model="formData.report.actualRecoverTime"
label="实际恢复时间"
@ -152,15 +166,18 @@ import BasePicker from '@/components/BasePicker.vue';
import BaseDatePicker from '@/components/BaseDatePicker.vue';
import RoadRoutesPicker from '../components/RoadRoutesPicker.vue';
import MaterialPicker from '../components/MaterialPicker.vue';
import { useRoute } from 'vue-router';
import { request } from '@shared/utils/request';
import { useOptions } from '@shared/composables/useOptions';
import DisasterFileUpload from '../components/DisasterFileUpload.vue';
import { showToast, showFailToast, showLoadingToast, showSuccessToast } from 'vant';
import { useRouter, useRoute } from 'vue-router'
import { formatDate } from '@shared/utils';
import { useYHZStore } from '@/stores/yhzStore';
const route = useRoute();
const route = useRoute()
const router = useRouter()
const { options } = useOptions();
const yhzStore = useYHZStore();
//
const isContinue = computed(() => route.query.isContinue);
@ -169,7 +186,14 @@ const minDate = new Date();
const maxDate = new Date(2050, 11, 31);
const formData = ref({
event: {},
event: {
startStakeNo: '',
startStakeLng: '',
startStakeLat: '',
endStakeNo: '',
endStakeLng: '',
endStakeLat: '',
},
report: {},
fileList: [],
yhzMaterialList: [],
@ -205,25 +229,61 @@ const parsePointValue = point => {
};
const handleRouteNoChange = (item = {}) => {
formData.routeNo = item.routeCode || formData.routeNo;
formData.event.startStakeNo = item.startStakeNo;
formData.event.endStakeNo = item.endStakeNo;
formData.value.event.routeNo = item.routeCode;
formData.value.event.startStakeNo = item.startStakeNo;
formData.value.event.endStakeNo = item.endStakeNo;
const startPoint = parsePointValue(item.startPoint ?? item.startpoint);
const endPoint = parsePointValue(item.endPoint ?? item.endpoint);
formData.event.startStakeLng = startPoint.longitude;
formData.event.startStakeLat = startPoint.latitude;
formData.event.endStakeLng = endPoint.longitude;
formData.event.endStakeLat = endPoint.latitude;
formData.value.event.startStakeLng = startPoint.longitude;
formData.value.event.startStakeLat = startPoint.latitude;
formData.value.event.endStakeLng = endPoint.longitude;
formData.value.event.endStakeLat = endPoint.latitude;
};
const calibrateTime = isShowToast => {
formData.value.occurTime = formatDate(Date.now());
formData.value.event.occurTime = formatDate(Date.now());
if (isShowToast) showToast('时间已校准为当前时间');
};
const isEmpty = value => {
return value === null || value === undefined || value === '';
};
const validate = () => {
if (isEmpty(formData.value.report?.disposalMeasures)) {
showToast('请选择处置措施');
return false;
}
if (isEmpty(formData.value.event?.occurTime)) {
showToast('请选择发生时间');
return false;
}
if (isEmpty(formData.value.report?.expectRecoverTime)) {
showToast('请输入预计恢复时间');
return false;
}
if (isEmpty(formData.value.event?.routeNo)) {
showToast('请输入线路编号');
return false;
}
if (isEmpty(formData.value.event?.startStakeNo)) {
showToast('请输入起点桩号');
return false;
}
if (isEmpty(formData.value.event?.endStakeNo)) {
showToast('请输入止点桩号');
return false;
}
if (isEmpty(formData.value.event?.occurLocation)) {
showToast('请输入发生地点');
return false;
}
if (isEmpty(formData.value.event?.disasterMileage)) {
showToast('请输入受灾里程');
return false;
}
return true;
};
@ -239,17 +299,22 @@ const handleSubmit = async () => {
...formData.value,
//
};
submitData.event.serviceStationId = yhzStore.getYHZInfo?.id
submitData.event.serviceStationName = yhzStore.getYHZInfo?.mc
let apiUrl = formData.value.event?.id ? '/snow-ops-platform/event/dispose' : '/snow-ops-platform/event/report'
if(formData.value.event?.id && formData.value.report.disposalMeasures == '正常通行') {
apiUrl = '/snow-ops-platform/event/release'
}
const res = await request({
url: '/snow-ops-platform/event/addOrUpdate',
url: apiUrl,
method: 'post',
data: submitData,
});
if (res?.code === '00000') {
showSuccessToast('提交成功');
let isRebuilded = false;
if (isContinue && detail.value.event.needsRecovery) {
if (isContinue.value && detail.value.event.needsRecovery) {
//
isRebuilded = true;
}
@ -263,7 +328,7 @@ const handleSubmit = async () => {
} else {
//
setTimeout(() => {
if (isContinue) router.go(-1);
if (isContinue.value) router.go(-1);
else router.replace('/disasterManagement');
}, 500);
}
@ -277,7 +342,7 @@ const handleSubmit = async () => {
submitting.value = false;
}
};
const detailData = ref(null);
const detail = ref(null);
const getDisasterDetail = async () => {
const id = route.query.id;
if (!id) {
@ -300,7 +365,7 @@ const getDisasterDetail = async () => {
data.report = {};
data.yhzMaterialList = [];
data.fileList = [];
detailData.value = data;
detail.value = data;
formData.value = data;
} else {
ElMessage.warning(result.message || '获取详情失败');

View File

@ -1,5 +1,5 @@
<template>
<PageContainer title="冰毁详情" @click-back="handleClickBack" class="page-container">
<PageContainer title="冰毁详情" @click-back="handleClickBack" class="page-container" :class="{ ['is-release'] : isRelease()}">
<!-- 当前站点信息 -->
<CurrentSite />
@ -28,19 +28,19 @@
<!-- 线路编号 -->
<div class="info-row">
<span class="info-label">线路编号</span>
<span class="info-value">{{ detailData.routeNo || '-' }}</span>
<span class="info-value">{{ detailData.event?.routeNo || '-' }}</span>
</div>
<!-- 发生时间 -->
<div class="info-row">
<span class="info-label">发生时间</span>
<span class="info-value">{{ detailData.occurTime || '-' }}</span>
<span class="info-value">{{ detailData.event?.occurTime || '-' }}</span>
</div>
<!-- 地点路线 -->
<div class="info-row">
<span class="info-label">路况位置</span>
<span class="info-value">{{ detailData.occurLocation || '-' }}</span>
<span class="info-value">{{ detailData.event?.roadConditionLocation || '-' }}</span>
</div>
<!-- 发生地点 -->
@ -136,7 +136,7 @@
</PanelItem>
<!-- 底部按钮未解除状态显示续报按钮 -->
<div class="footer-buttons" v-if="!loading">
<div class="footer-buttons" v-if="!loading && !isRelease()">
<van-button type="primary" class="footer-btn" @click="handleContinueReport">续报</van-button>
</div>
@ -171,10 +171,6 @@ const detailData = ref({
report: [], //
fileList: [], //
lossList: [], //
occurLocation: '',
occurTime: '',
roadConditionType: '',
routeNo: '',
});
const loading = ref(true);
@ -200,12 +196,12 @@ const hasReportData = computed(() => {
//
const getEventStatusText = () => {
return detailData.eventStatus === 1 ? '已解除' : '未解除';
return isRelease() ? '已解除' : '未解除';
};
//
const getEventStatusType = () => {
return detailData.eventStatus === 1 ? 'success' : 'danger';
return isRelease() ? 'success' : 'danger';
};
//
@ -230,6 +226,11 @@ const getVehicleStrandedText = report => {
return count > 0 ? `有车滞留` : '无车滞留';
};
//
const isRelease = () => {
return detailData.value.report?.some(item => item.reportType == 3)
}
//
const getDisasterDetail = async () => {
const id = route.query.id;
@ -255,10 +256,6 @@ const getDisasterDetail = async () => {
report: data.reportList?.reverse() || [], // 使 report
fileList: data.fileList || [],
lossList: data.lossList || [],
occurLocation: data.occurLocation || '',
occurTime: data.occurTime || '',
roadConditionType: data.roadConditionType || '',
routeNo: data.routeNo || '',
};
} else {
showToast(result.message || '获取详情失败');
@ -316,6 +313,10 @@ onMounted(() => {
<style scoped lang="scss">
.page-container {
padding-bottom: 80px;
&.is-release {
padding-bottom: 20px;
}
}
.status-wrapper {

View File

@ -1,10 +1,10 @@
<template>
<div class="water-disaster">
<div class="water-disaster" >
<!-- 基本信息 -->
<PanelItem title="基本信息" v-if="!isContinue">
<van-form>
<van-form >
<!-- 路况类别 -->
<BasePicker v-model="formData.roadConditionType" :options="options['waterRoadConditionType']" label="路况类别" placeholder="请选择" />
<BasePicker v-model="formData.event.roadConditionType" :options="options['waterRoadConditionType']" label="路况类别" placeholder="请选择" />
<!-- 是否阻断 (event.isBlocked) -->
<BasePicker v-model="formData.event.isBlocked" :options="options['yesOrNoBool']" label="是否阻断" placeholder="请选择" />
@ -23,27 +23,35 @@
</van-field>
<!-- 发生时间 (顶层 occurTime) -->
<BaseDatePicker v-model="formData.occurTime" label="发生时间" placeholder="请选择时间" :columnsType="['year', 'month', 'day', 'hour', 'minute']" />
<BaseDatePicker v-model="formData.event.occurTime" label="发生时间" placeholder="请选择时间" :columnsType="['year', 'month', 'day', 'hour', 'minute']" />
<div class="calibrate-time-btn" @click="calibrateTime">
<van-icon name="replay" />
<span>校准时间</span>
</div>
<!-- 线路编号 (顶层 routeNo) -->
<RoadRoutesPicker v-model="formData.routeNo" label="线路编号" placeholder="请线路" @change="handleRouteNoChange" />
<RoadRoutesPicker v-model="formData.event.routeNo" label="线路编号" placeholder="请线路" @change="handleRouteNoChange" />
<!-- 起点桩号 (event.startStakeNo) -->
<van-field v-model="formData.event.startStakeNo" label="起点桩号(K)" placeholder="请填写" />
<!-- 起点桩经度 -->
<van-field v-model="formData.event.startStakeLng" label="起点桩经度" placeholder="请填写" type="digit" />
<!-- 起点桩纬度 -->
<van-field v-model="formData.event.startStakeLat" label="起点桩纬度" placeholder="请填写" type="digit" />
<!-- 止点桩号 (event.endStakeNo) -->
<van-field v-model="formData.event.endStakeNo" label="止点桩号(K)" placeholder="请填写" />
<van-field v-model="formData.event.longitude" label="经度" placeholder="请填写" />
<!-- 止点桩经度 -->
<van-field v-model="formData.event.endStakeLng" label="止点桩经度" placeholder="请填写" type="digit" />
<van-field v-model="formData.event.latitude" label="纬度" placeholder="请填写" />
<!-- 止点桩纬度 -->
<van-field v-model="formData.event.endStakeLat" label="止点桩纬度" placeholder="请填写" type="digit" />
<!-- 路况位置 (occurLocation) -->
<van-field v-model="formData.occurLocation" label="路况位置" placeholder="请填写" />
<van-field v-model="formData.event.occurLocation" label="路况位置" placeholder="请填写" />
<!-- 阻断点小地名 (event.blockedPointName) -->
<van-field v-model="formData.event.blockedPointName" label="阻断点小地名" placeholder="请填写" />
@ -164,54 +172,29 @@ import { useRouter, useRoute } from 'vue-router'
import { request } from '@shared/utils/request'
import { useOptions } from '@shared/composables/useOptions'
import { formatDate } from '@shared/utils'
import { useYHZStore } from '@/stores/yhzStore';
const route = useRoute()
const router = useRouter()
const { options } = useOptions()
const yhzStore = useYHZStore();
//
const isContinue = computed(() => route.query.isContinue)
// - Request 使 ref
const formData = ref({
//
occurLocation: '', //
occurTime: null, //
roadConditionType: '', //
routeNo: '', // 线
// event
event: {
blockedMileage: '', //
blockedPointName: '', //
contactPerson: '', //
contactPhone: '', //
damageCount: '', //
district: '', //
endStakeNo: '', //
estimatedRecoveryCost: '', //
isBlocked: '', //
needsRecovery: '', //
repairProgress: '', //
reporterUnit: '', //
startStakeNo: '' //
startStakeNo: '',
startStakeLng: '',
startStakeLat: '',
endStakeNo: '',
endStakeLng: '',
endStakeLat: ''
},
// report
report: {
actualRecoverTime: '', //
damagedVehicleCount: '', //
deadCount: '', //
disposalMeasures: '', //
expectRecoverTime: '', //
injuredCount: '', //
investedFunds: '', //
investedMachinery: '', //
investedManpower: '', //
remark: '', // /
siteDescription: '', //
strandedPersonCount: '', //
strandedVehicleCount: '', //
totalLossAmount: '' //
},
report: {},
// lossList
lossList: [],
@ -227,26 +210,14 @@ const minDate = new Date(2020, 0, 1)
const maxDate = new Date(2030, 11, 31)
const initFormData = (newVal) => {
if (newVal && Object.keys(newVal).length > 0) {
// -
formData.value = {
occurLocation: newVal.occurLocation || '',
occurTime: newVal.occurTime || formatDate(Date.now()),
roadConditionType: newVal.roadConditionType || '',
routeNo: newVal.routeNo || '',
event: { ...formData.value.event, ...(newVal.event || {}) },
report: { ...formData.value.report, ...(newVal.report || {}) },
lossList: newVal.lossList || [],
fileList: newVal.fileList || []
}
}
formData.value = { ...newVal }
}
//
const calibrateTime = () => {
const now = new Date()
const formatted = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')} ${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}`
formData.value.occurTime = formatted
formData.value.event.occurTime = formatted
showToast('时间已校准为当前时间')
}
@ -280,17 +251,17 @@ const parsePointValue = (point) => {
}
const handleRouteNoChange = (item) => {
formData.routeNo = item.routeCode
formData.event.startStakeNo = item.startStakeNo
formData.event.endStakeNo = item.endStakeNo
formData.value.event.routeNo = item.routeCode
formData.value.event.startStakeNo = item.startStakeNo
formData.value.event.endStakeNo = item.endStakeNo
const startPoint = parsePointValue(item.startPoint)
const endPoint = parsePointValue(item.endPoint)
formData.event.startStakeLongitude = startPoint.longitude
formData.event.startStakeLatitude = startPoint.latitude
formData.event.endStakeLongitude = endPoint.longitude
formData.event.endStakeLatitude = endPoint.latitude
formData.value.event.startStakeLng = startPoint.longitude
formData.value.event.startStakeLat = startPoint.latitude
formData.value.event.endStakeLng = endPoint.longitude
formData.value.event.endStakeLat = endPoint.latitude
}
//
@ -299,7 +270,7 @@ const isEmpty = (value) => {
}
const validate = () => {
if (isEmpty(formData.value.roadConditionType)) {
if (isEmpty(formData.value.event?.roadConditionType)) {
showToast('请选择路况类别')
return false
}
@ -323,7 +294,7 @@ const validate = () => {
showToast('请输入阻断里程')
return false
}
if (isEmpty(formData.value.occurTime)) {
if (isEmpty(formData.value.event?.occurTime)) {
showToast('请选择发生时间')
return false
}
@ -331,7 +302,7 @@ const validate = () => {
showToast('请输入预计恢复时间')
return false
}
if (isEmpty(formData.value.routeNo)) {
if (isEmpty(formData.value.event?.routeNo)) {
showToast('请输入线路编号')
return false
}
@ -343,7 +314,7 @@ const validate = () => {
showToast('请输入止点桩号')
return false
}
if (isEmpty(formData.value.occurLocation)) {
if (isEmpty(formData.value.event?.occurLocation)) {
showToast('请输入路况位置')
return false
}
@ -351,14 +322,6 @@ const validate = () => {
showToast('请输入阻断点小地名')
return false
}
if (isEmpty(formData.value.event?.longitude)) {
showToast('请输入经度')
return false
}
if (isEmpty(formData.value.event?.latitude)) {
showToast('请输入纬度')
return false
}
if (isEmpty(formData.value.event?.needsRecovery)) {
showToast('请选择是否需要恢复重建')
return false
@ -390,9 +353,16 @@ const handleSubmit = async () => {
...formData
//
}
submitData.event.serviceStationId = yhzStore.getYHZInfo?.id
submitData.event.serviceStationName = yhzStore.getYHZInfo?.mc
//
let apiUrl = formData.value.event?.id ? '/snow-ops-platform/water-damage/dispose' : '/snow-ops-platform/water-damage/report'
if(formData.value.event?.id && formData.value.report.disposalMeasures == '正常通行') {
apiUrl = '/snow-ops-platform/water-damage/release'
}
const res = await request({
url: '/snow-ops-platform/water-damage/addOrUpdate',
url: apiUrl,
method: 'post',
data: submitData
})
@ -400,7 +370,7 @@ const handleSubmit = async () => {
if (res?.code === '00000') {
showSuccessToast('提交成功')
let isRebuilded = false
if (isContinue && detail.value.event.needsRecovery) {
if (isContinue.value && detail.value.event.needsRecovery) {
//
isRebuilded = true
}
@ -414,7 +384,7 @@ const handleSubmit = async () => {
} else {
//
setTimeout(() => {
if(isContinue) router.go(-1)
if(isContinue.value) router.go(-1)
else router.replace('/disasterManagement')
}, 500)
}
@ -451,9 +421,9 @@ const getDisasterDetail = async () => {
detail.value = result.data
const newFormData = {
...data,
lossList: null,
lossList: [],
report: {},
fileList: null
fileList: []
}
initFormData(newFormData)
} else {
@ -467,12 +437,10 @@ const getDisasterDetail = async () => {
onMounted(() => {
formData.value.occurTime = formatDate(Date.now())
formData.value.event.occurTime = formatDate(Date.now())
if (route.query.id) {
getDisasterDetail()
} else {
initFormData({})
}
}
})
//

View File

@ -1,5 +1,5 @@
<template>
<PageContainer title="水毁详情" @click-back="handleClickBack" class="page-container">
<PageContainer title="水毁详情" @click-back="handleClickBack" class="page-container" :class="{ ['is-release'] : isRelease()}">
<!-- 当前站点信息 -->
<CurrentSite />
@ -22,7 +22,7 @@
<!-- 路况类别 -->
<div class="info-row">
<span class="info-label">路况类别</span>
<span class="info-value">{{ detailData.roadConditionType || '-' }}</span>
<span class="info-value">{{ detailData.event?.roadConditionType || '-' }}</span>
</div>
<!-- 是否阻断 -->
@ -57,19 +57,19 @@
<!-- 发生时间 -->
<div class="info-row">
<span class="info-label">发生时间</span>
<span class="info-value">{{ detailData.occurTime || '-' }}</span>
<span class="info-value">{{ detailData.event?.occurTime || '-' }}</span>
</div>
<!-- 线路编号 -->
<div class="info-row">
<span class="info-label">线路编号</span>
<span class="info-value">{{ detailData.routeNo || '-' }}</span>
<span class="info-value">{{ detailData.event?.routeNo || '-' }}</span>
</div>
<!-- 地点路线 -->
<div class="info-row">
<span class="info-label">地点路线</span>
<span class="info-value">{{ detailData.occurLocation || '-' }}</span>
<span class="info-label">路况位置</span>
<span class="info-value">{{ detailData.event?.occurLocation || '-' }}</span>
</div>
<!-- 起点桩号 -->
@ -87,7 +87,7 @@
<!-- 路况位置使用阻断点小地名或发生地点 -->
<div class="info-row">
<span class="info-label">路况位置</span>
<span class="info-value">{{ detailData.event?.blockedPointName || detailData.occurLocation || '-' }}</span>
<span class="info-value">{{ detailData.event?.occurLocation || '-' }}</span>
</div>
<!-- 阻断点小地名 -->
@ -160,7 +160,7 @@
<span class="info-label">有无车辆滞留</span>
<span class="info-value">{{ getVehicleStrandedText(report) }}</span>
</div>
<div class="info-row">
<div class="info-row" v-if="report.hasStrandedVehicles">
<span class="info-label">滞留车辆</span>
<span class="info-value">{{ report.strandedVehicleCount || 0 }}</span>
</div>
@ -200,7 +200,7 @@
</PanelItem>
<!-- 底部按钮未解除状态显示续报按钮 -->
<div class="footer-buttons" v-if="!loading">
<div class="footer-buttons" v-if="!loading && !isRelease()">
<van-button type="primary" class="footer-btn" @click="handleContinueReport">续报</van-button>
</div>
@ -231,10 +231,6 @@ const detailData = ref({
report: [], //
fileList: [], //
lossList: [], //
occurLocation: '',
occurTime: '',
roadConditionType: '',
routeNo: ''
})
const loading = ref(true)
@ -253,6 +249,11 @@ const allReports = computed(() => {
// return reports.reverse()
})
//
const isRelease = () => {
return detailData.value.report?.some(item => item.reportType == 3)
}
//
const hasReportData = computed(() => {
return allReports.value.length > 0
@ -260,12 +261,12 @@ const hasReportData = computed(() => {
//
const getEventStatusText = () => {
return detailData.eventStatus === 1 ? '已解除' : '未解除'
return isRelease() ? '已解除' : '未解除'
}
//
const getEventStatusType = () => {
return detailData.eventStatus === 1 ? 'success' : 'danger'
return isRelease() ? 'success' : 'danger'
}
//
@ -329,10 +330,6 @@ const getDisasterDetail = async () => {
report: data.report || [], // 使 report
fileList: data.fileList || [],
lossList: data.lossList || [],
occurLocation: data.occurLocation || '',
occurTime: data.occurTime || '',
roadConditionType: data.roadConditionType || '',
routeNo: data.routeNo || ''
}
} else {
showToast(result.message || '获取详情失败')
@ -382,6 +379,7 @@ const previewFile = (report, file) => {
previewImagesVisible.value = true
}
onMounted(() => {
getDisasterDetail()
})
@ -390,6 +388,10 @@ onMounted(() => {
<style scoped lang="scss">
.page-container {
padding-bottom: 80px;
&.is-release {
padding-bottom: 20px;
}
}
.status-wrapper {

View File

@ -134,7 +134,7 @@
<el-table-column label="操作" width="100" fixed="right" align="center">
<template #default="{ row }">
<el-button link type="primary" size="small" @click="handleDetail(row)">详情</el-button>
<el-button link type="warning" size="small" @click="handleEdit(row)">编辑</el-button>
<el-button link type="warning" size="small" v-if="row.eventStatus == 0" @click="handleEdit(row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
@ -320,7 +320,7 @@ const resetFilters = () => {
//
const handleDetail = (row) => {
if (row.disasterType == 'WATER_DAMAGE') {
router.push({ path: '/waterDisasterDetail', query: { id: row.id } })
router.push({ path: '/waterDisasterDetail', query: { id: row.relationId } })
}
if (row.disasterType == 'ICE_SNOW') {
router.push({ path: '/iceDisasterDetail', query: { id: row.relationId } })
@ -330,7 +330,7 @@ const handleDetail = (row) => {
//
const handleEdit = (row) => {
if (row.disasterType == 'WATER_DAMAGE') {
router.push({ path: '/waterDisasterDetail', query: { id: row.id, mode: 'edit' } })
router.push({ path: '/waterDisasterDetail', query: { id: row.relationId, mode: 'edit' } })
}
if (row.disasterType == 'ICE_SNOW') {
router.push({ path: '/iceDisasterDetail', query: { id: row.relationId, mode: 'edit' } })

View File

@ -65,7 +65,7 @@
</el-select>
</el-form-item>
<el-form-item label="滞留车辆">
<el-form-item label="滞留车辆" v-if="formData.report.hasStrandedVehicles">
<NumberInput v-model="formData.report.strandedVehicleCount" :precision="0" placeholder="请填写" style="width: 300px">
<template #append></template>
</NumberInput>
@ -84,7 +84,8 @@
</BlockItem>
<el-form-item>
<el-button type="primary" @click="handleSubmit">追加记录</el-button>
<el-button type="primary" @click="handleAddSubmit">追加记录</el-button>
<el-button type="primary" @click="handleCompleteSubmit">解除事件</el-button>
</el-form-item>
</el-form>
</el-card>
@ -100,6 +101,7 @@ import FileUpload from '@/component/FileUpload/FileUpload.vue'
import NumberInput from '@/component/NumberInput/NumberInput.vue'
import MaterialList from '../components/MaterialList.vue'
import { useOptions } from '@shared/composables/useOptions'
import { useRouter } from 'vue-router'
const props = defineProps({
value: {
@ -111,7 +113,7 @@ const props = defineProps({
const emit = defineEmits(['refresh'])
const { options } = useOptions()
const router = useRouter()
const formData = ref({})
@ -164,7 +166,7 @@ const calibrateTime = () => {
const day = String(now.getDate()).padStart(2, '0')
const hours = String(now.getHours()).padStart(2, '0')
const minutes = String(now.getMinutes()).padStart(2, '0')
formData.value.occurTime = `${year}-${month}-${day} ${hours}:${minutes}`
formData.value.event.occurTime = `${year}-${month}-${day} ${hours}:${minutes}`
ElMessage.success('时间已校准为当前时间')
}
@ -174,14 +176,14 @@ const handleHasStrandedVehiclesChange = (value) => {
}
}
const handleSubmit = async () => {
const handleAddSubmit = async () => {
if (!validate()) {
return
}
try {
const res = await request({
url: '/snow-ops-platform/event/addOrUpdate',
url: '/snow-ops-platform/event/dispose',
method: 'post',
data: getFormData()
})
@ -198,6 +200,24 @@ const handleSubmit = async () => {
}
}
const handleCompleteSubmit = async () => {
const res = await request({
url: '/snow-ops-platform/event/release',
method: 'post',
data: {
...formData.value
}
})
if (res?.code === '00000') {
ElMessage.success('提交成功')
setTimeout(()=>{
router.replace({ path: '/iceDisasterDetail', query: { id: formData.value.event.id } })
}, 500)
} else {
ElMessage.error(res.message)
}
}
defineExpose({
validate,
initFormData,

View File

@ -26,7 +26,7 @@
<el-col :span="8">
<div class="info-item">
<span class="info-label">线路编号</span>
<span class="info-value">{{ detailData.routeNo || '-' }}</span>
<span class="info-value">{{ detailData.event?.routeNo || '-' }}</span>
</div>
</el-col>
</el-row>
@ -34,13 +34,13 @@
<el-col :span="8">
<div class="info-item">
<span class="info-label">发现时间</span>
<span class="info-value">{{ detailData.occurTime || '-' }}</span>
<span class="info-value">{{ detailData.event?.occurTime || '-' }}</span>
</div>
</el-col>
<el-col :span="8">
<div class="info-item">
<span class="info-label">路况位置</span>
<span class="info-value">{{ detailData.occurLocation || '-' }}</span>
<span class="info-value">{{ detailData.event?.roadConditionLocation || '-' }}</span>
</div>
</el-col>
<el-col :span="8">
@ -60,13 +60,13 @@
<span class="info-label">起点桩号</span>
<span class="info-value">{{ formatStakeNo(detailData.event?.startStakeNo) }}</span>
</div>
<div class="info-item">
<span class="info-label"></span>
<span class="info-value">{{ formatValue(detailData.event?.startStakeLat ?? detailData.event?.startStakeLatitude) }}</span>
<div class="info-item">
<span class="info-label">止点桩经</span>
<span class="info-value">{{ formatValue(detailData.event?.startStakeLng) }}</span>
</div>
<div class="info-item">
<span class="info-label"></span>
<span class="info-value">{{ formatValue(detailData.event?.startStakeLng ?? detailData.event?.startStakeLongitude) }}</span>
<span class="info-label">止点桩纬</span>
<span class="info-value">{{ formatValue(detailData.event?.startStakeLat ) }}</span>
</div>
</div>
<div class="stake-center">
@ -85,12 +85,12 @@
<span class="info-value">{{ formatStakeNo(detailData.event?.endStakeNo) }}</span>
</div>
<div class="info-item">
<span class="info-label"></span>
<span class="info-value">{{ formatValue(detailData.event?.endStakeLat ?? detailData.event?.endStakeLatitude) }}</span>
<span class="info-label">止点桩经</span>
<span class="info-value">{{ formatValue(detailData.event?.endStakeLng) }}</span>
</div>
<div class="info-item">
<span class="info-label"></span>
<span class="info-value">{{ formatValue(detailData.event?.endStakeLng ?? detailData.event?.endStakeLongitude) }}</span>
<span class="info-label">止点桩纬</span>
<span class="info-value">{{ formatValue(detailData.event?.endStakeLat ) }}</span>
</div>
</div>
</el-row>
@ -125,11 +125,11 @@
</div>
<div class="info-item">
<span class="info-label">填报人</span>
<span class="info-value">{{ formatValue(report.reporterName || report.reportUserName || report.createByName) }}</span>
<span class="info-value">{{ formatValue(report.reporter) }}</span>
</div>
<div class="info-item">
<span class="info-label">联系电话</span>
<span class="info-value">{{ formatValue(report.reporterPhone || report.phone || report.reportPhone || report.contactPhone) }}</span>
<span class="info-value">{{ formatValue(report.contactPhone) }}</span>
</div>
<div class="info-item" v-for="(item, index) in report.materialUsageList" :key="index">
<span class="info-label">{{item.materialName}}</span>
@ -137,23 +137,23 @@
</div>
<div class="info-item">
<span class="info-label">投入资金</span>
<span class="info-value">{{ formatUnitValue(report.inputFunds ?? report.material?.inputFunds ?? report.investedFunds, '万元') }}</span>
<span class="info-value">{{ formatUnitValue(report.inputFunds , '万元') }}</span>
</div>
<div class="info-item">
<span class="info-label">投入人力</span>
<span class="info-value">{{ formatUnitValue(report.inputManpower ?? report.material?.inputManpower ?? report.investedManpower, '人次') }}</span>
<span class="info-value">{{ formatUnitValue(report.inputManpower , '人次') }}</span>
</div>
<div class="info-item">
<span class="info-label">投入设备</span>
<span class="info-value">{{ formatUnitValue(report.inputEquipment ?? report.material?.inputEquipment ?? report.investedMachinery, '台') }}</span>
<span class="info-value">{{ formatUnitValue(report.inputEquipment , '台') }}</span>
</div>
<div class="info-item">
<span class="info-label">有无车辆滞留</span>
<span class="info-value">{{ getHasStrandedVehiclesText(report) }}</span>
</div>
<div class="info-item">
<div class="info-item" v-if="report.hasStrandedVehicles">
<span class="info-label">滞留车辆</span>
<span class="info-value">{{ formatUnitValue(report.strandedVehicleCount ?? report.traffic?.strandedVehicleCount, '辆') }}</span>
<span class="info-value">{{ formatUnitValue(report.strandedVehicleCount, '辆') }}</span>
</div>
<div class="info-item">
<span class="info-label">现场情况描述</span>
@ -249,11 +249,11 @@ const getMaterialUsageText = (item) => {
}
const getHasStrandedVehiclesText = (report) => {
const value = report?.hasStrandedVehicles ?? report?.traffic?.hasStrandedVehicles
const value = report?.hasStrandedVehicles
if (value === 1 || value === true || value === '1' || value === '是' || value === '有') return '有'
if (value === 0 || value === false || value === '0' || value === '否' || value === '无') return '无'
const count = report?.strandedVehicleCount ?? report?.traffic?.strandedVehicleCount
const count = report?.strandedVehicleCount
if (count === null || count === undefined || count === '') return '-'
return Number(count) > 0 ? '有' : '无'
}
@ -279,10 +279,6 @@ const getDisasterDetail = async () => {
report: data.reportList?.reverse(),
fileList: data.fileList || [],
lossList: data.lossList || [],
occurLocation: data.occurLocation || data.event?.roadConditionLocation || '',
occurTime: data.occurTime || data.event?.occurTime || '',
roadConditionType: data.roadConditionType || '',
routeNo: data.routeNo || data.event?.routeNo || ''
}
if (isEdit.value) {

View File

@ -16,13 +16,13 @@
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系人员" prop="event.reporterName">
<el-input v-model="formData.event.reporterName" placeholder="请填写" />
<el-form-item label="联系人员" prop="report.contactPerson">
<el-input v-model="formData.report.contactPerson" placeholder="请填写" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系电话" prop="event.reporterPhone">
<el-input v-model="formData.event.reporterPhone" maxlength="11" placeholder="请填写" />
<el-form-item label="联系电话" prop="report.contactPhone">
<el-input v-model="formData.report.contactPhone" maxlength="11" placeholder="请填写" />
</el-form-item>
</el-col>
</el-row>
@ -39,12 +39,12 @@
</el-col>
<el-col :span="8">
<el-form-item label="填报站点" prop="event.serviceStationId">
<YHZSelect v-model="formData.event.serviceStationId" />
<YHZSelect v-model="formData.event.serviceStationId" @change="(item) => formData.event.serviceStationName = item.mc" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="发生时间" prop="occurTime">
<el-date-picker v-model="formData.occurTime" type="datetime" placeholder="请选择日期时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
<el-form-item label="发生时间" prop="event.occurTime">
<el-date-picker v-model="formData.event.occurTime" type="datetime" placeholder="请选择日期时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
</el-form-item>
</el-col>
</el-row>
@ -68,8 +68,8 @@
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="线路编号" prop="routeNo">
<RoadRoutesSelect v-model="formData.routeNo" :extra-params="{ xzdj: filterForm.routeType, qxid: formData.event.district }" @change="handleRouteNoChange" />
<el-form-item label="线路编号" prop="event.routeNo">
<RoadRoutesSelect v-model="formData.event.routeNo" :extra-params="{ xzdj: filterForm.routeType, qxid: formData.event.district }" @change="handleRouteNoChange" />
</el-form-item>
</el-col>
</el-row>
@ -81,8 +81,8 @@
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="路况位置" prop="occurLocation">
<el-input v-model="formData.occurLocation" placeholder="请选择">
<el-form-item label="路况位置" prop="event.roadConditionLocation">
<el-input v-model="formData.event.roadConditionLocation" placeholder="请选择">
<template #suffix>
<el-icon class="location-icon"><LocationFilled /></el-icon>
</template>
@ -212,7 +212,7 @@
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="8" v-if="formData.report.hasStrandedVehicles">
<el-form-item label="滞留车辆" prop="report.strandedVehicleCount">
<NumberInput v-model="formData.report.strandedVehicleCount" :precision="0" placeholder="请填写" style="width: 100%">
<template #append></template>

View File

@ -6,9 +6,6 @@ import { useOptions } from '@shared/composables/useOptions'
import { useUserStore} from '@/store/userStore'
const createDefaultFormData = () => ({
occurLocation: '',
occurTime: '',
routeNo: '',
event: {},
report: {},
fileList: [],
@ -61,17 +58,17 @@ export const useIceDisasterReport = () => {
const formData = reactive(createDefaultFormData())
const formRules = {
'event.reporterName': [{ required: true, message: '请输入联系人员', trigger: 'blur' }],
'event.reporterPhone': [
{ required: true, message: '请输入联系电话', trigger: 'blur' },
// 'report.contactPerson': [{ required: true, message: '请输入联系人员', trigger: 'blur' }],
'report.contactPhone': [
// { required: true, message: '请输入联系电话', trigger: 'blur' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的联系电话', trigger: 'blur' }
],
'event.serviceStationId': [{ required: true, message: '请选择填报站点', trigger: 'change' }],
occurTime: [{ required: true, message: '请选择发生时间', trigger: 'change' }],
'event.district': [{ required: true, message: '请选择所属区县', trigger: 'change' }],
routeNo: [{ required: true, message: '请选择线路编号', trigger: 'change' }],
'event.routeNo': [{ required: true, message: '请选择线路编号', trigger: 'change' }],
'event.occurLocation': [{ required: true, message: '请输入发生地点', trigger: 'blur' }],
occurLocation: [{ required: true, message: '请选择路况位置', trigger: 'blur' }],
'event.roadConditionLocation': [{ required: true, message: '请输入路况位置', trigger: 'blur' }],
'event.startStakeNo': [{ required: true, message: '请输入起点桩号', trigger: 'blur' }],
'event.startStakeLng': [{ required: true, message: '请输入起点桩经度', trigger: 'blur' }],
'event.startStakeLat': [{ required: true, message: '请输入起点桩纬度', trigger: 'blur' }],
@ -118,7 +115,7 @@ export const useIceDisasterReport = () => {
}
const handleRouteNoChange = (item = {}) => {
formData.routeNo = item.routeCode || formData.routeNo
formData.event.routeNo = item.routeCode
formData.event.startStakeNo = item.startStakeNo
formData.event.endStakeNo = item.endStakeNo
@ -149,8 +146,7 @@ export const useIceDisasterReport = () => {
}
const buildSubmitData = () => {
console.log(formData)
return
return formData
}
const validate = async () => {
@ -175,7 +171,7 @@ export const useIceDisasterReport = () => {
submitting.value = true
try {
const res = await request({
url: '/snow-ops-platform/event/addOrUpdate',
url: '/snow-ops-platform/event/report',
method: 'post',
data: buildSubmitData()
})

View File

@ -84,7 +84,7 @@
</el-form-item>
<!-- 损失列表组件 -->
<loss-list :col-span="24" v-model="formData.lossList" />
<loss-list :col-span="24" v-if="formData.lossList" v-model="formData.lossList" />
<!-- 已投机械 -->
<el-form-item label="投入机械">
@ -133,7 +133,8 @@
</el-form-item> -->
<el-form-item>
<el-button type="primary" @click="handleSubmit">追加记录</el-button>
<el-button type="primary" @click="handleAddSubmit">追加记录</el-button>
<el-button type="primary" @click="handleCompleteSubmit">解除事件</el-button>
</el-form-item>
</el-form>
</el-card>
@ -141,12 +142,13 @@
</template>
<script setup>
import { ref, reactive, watch, computed } from 'vue'
import { ref, watch } from 'vue'
import { ElMessage } from 'element-plus'
import { request } from '@shared/utils/request'
import BlockItem from '@/component/BlockItem.vue'
import NumberInput from '@/component/NumberInput/NumberInput.vue'
import LossList from '../WaterDisasterReport/WaterDisasterLossListPC.vue'
import { useRouter } from 'vue-router'
// Props
const props = defineProps({
@ -159,49 +161,19 @@ const props = defineProps({
// Emits
const emit = defineEmits(['input', 'change'])
//
const formData = reactive({
occurLocation: '',
occurTime: '',
roadConditionType: '',
routeNo: '',
const router = useRouter()
const createDefaultFormData = () => ({
event: {
blockedMileage: '',
blockedPointName: '',
contactPerson: '',
contactPhone: '',
damageCount: '',
district: '',
endStakeNo: '',
estimatedRecoveryCost: '',
isBlocked: '',
needsRecovery: '',
repairProgress: '',
reporterUnit: '',
startStakeNo: ''
},
report: {
actualRecoverTime: '',
damagedVehicleCount: '',
deadCount: '',
disposalMeasures: '',
expectRecoverTime: '',
injuredCount: '',
investedFunds: '',
investedMachinery: '',
investedManpower: '',
remark: '',
siteDescription: '',
strandedPersonCount: '',
strandedVehicleCount: '',
totalLossAmount: ''
},
lossList: [],
fileList: []
})
//
const disposalMeasureValue = ref('')
//
const formData = ref(createDefaultFormData())
//
const roadConditionOptions = [
@ -231,11 +203,6 @@ const pickerOptions = {
}
}
//
watch(disposalMeasureValue, (newVal) => {
formData.report.disposalMeasures = newVal
})
//
watch(
() => props.value,
@ -249,7 +216,7 @@ watch(
//
watch(
() => formData,
formData,
(newVal) => {
emit('input', newVal)
emit('change', newVal)
@ -257,33 +224,9 @@ watch(
{ deep: true }
)
// report.disposalMeasures
watch(
() => formData.report.disposalMeasures,
(newVal) => {
if (newVal && typeof newVal === 'string') {
disposalMeasureValue.value = newVal
}
},
{ immediate: true }
)
//
const initFormData = (data) => {
Object.assign(formData, {
occurLocation: data.occurLocation || '',
occurTime: data.occurTime || '',
roadConditionType: data.roadConditionType || '',
routeNo: data.routeNo || '',
event: { ...formData.event, ...(data.event || {}) },
report: { ...formData.report, ...(data.report || {}) },
lossList: data.lossList || [],
fileList: data.fileList || []
})
if (data.report?.disposalMeasures) {
disposalMeasureValue.value = data.report.disposalMeasures
}
formData.value = data
}
//
@ -294,7 +237,7 @@ const calibrateTime = () => {
const day = String(now.getDate()).padStart(2, '0')
const hours = String(now.getHours()).padStart(2, '0')
const minutes = String(now.getMinutes()).padStart(2, '0')
formData.occurTime = `${year}-${month}-${day} ${hours}:${minutes}`
formData.value.event.occurTime = `${year}-${month}-${day} ${hours}:${minutes}`
ElMessage.success('时间已校准为当前时间')
}
@ -305,54 +248,17 @@ const validate = () => {
//
const getFormData = () => {
return { ...formData }
return {
...formData.value,
}
}
//
const resetForm = () => {
Object.assign(formData, {
occurLocation: '',
occurTime: '',
roadConditionType: '',
routeNo: '',
event: {
blockedMileage: '',
blockedPointName: '',
contactPerson: '',
contactPhone: '',
damageCount: '',
district: '',
endStakeNo: '',
estimatedRecoveryCost: '',
isBlocked: '',
needsRecovery: '',
repairProgress: '',
reporterUnit: '',
startStakeNo: ''
},
report: {
actualRecoverTime: '',
damagedVehicleCount: '',
deadCount: '',
disposalMeasures: '',
expectRecoverTime: '',
injuredCount: '',
investedFunds: '',
investedMachinery: '',
investedManpower: '',
remark: '',
siteDescription: '',
strandedPersonCount: '',
strandedVehicleCount: '',
totalLossAmount: ''
},
lossList: [],
fileList: []
})
disposalMeasureValue.value = ''
formData.value = createDefaultFormData()
}
const handleSubmit = async () => {
const handleAddSubmit = async () => {
//
if (!validate()) {
return
@ -363,12 +269,12 @@ const handleSubmit = async () => {
//
const submitData = {
...formData
...formData.value
//
}
const res = await request({
url: '/snow-ops-platform/water-damage/addOrUpdate',
url: '/snow-ops-platform/water-damage/dispose',
method: 'post',
data: submitData
})
@ -387,6 +293,24 @@ const handleSubmit = async () => {
}
}
const handleCompleteSubmit = async () => {
const res = await request({
url: '/snow-ops-platform/water-damage/release',
method: 'post',
data: {
...formData.value
}
})
if (res?.code === '00000') {
ElMessage.success('提交成功')
setTimeout(()=>{
router.replace({ path: '/waterDisasterDetail', query: { id: formData.value.event.id } })
}, 500)
} else {
ElMessage.error(res.message)
}
}
//
defineExpose({
validate,

View File

@ -10,99 +10,15 @@
</div>
</template>
<div class="base-info-grid">
<div class="base-info-column">
<div class="info-item">
<span class="info-label">事件类型</span>
<span class="info-value">水毁事件</span>
</div>
<div class="info-item">
<span class="info-label">路况类别</span>
<span class="info-value">{{ detailData.roadConditionType || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">是否阻断</span>
<span class="info-value">{{ formatBooleanValue(detailData.event?.isBlocked) }}</span>
</div>
<div class="info-item">
<span class="info-label">路况位置</span>
<span class="info-value">{{ detailData.occurLocation || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">所属区县</span>
<span class="info-value">{{ detailData.event?.district || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">起点桩经度</span>
<span class="info-value">{{ detailData.event?.startStakeLongitude || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">止点桩经度</span>
<span class="info-value">{{ detailData.event?.endStakeLongitude || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">是否需要恢复重建</span>
<span class="info-value">{{ formatBooleanValue(detailData.event?.needsRecovery) }}</span>
</div>
</div>
<div class="base-info-column">
<div class="info-item">
<span class="info-label">填报站点</span>
<span class="info-value">{{ detailData.stationName || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">抢险进度</span>
<span class="info-value">{{ detailData.event?.repairProgress || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">地点路线</span>
<span class="info-value">{{ detailData.routeNo }}</span>
</div>
<div class="info-item">
<span class="info-label">阻断点小地名</span>
<span class="info-value">{{ detailData.event?.blockedPointName || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">起点桩号</span>
<span class="info-value">{{ detailData.event?.startStakeNo || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">止点桩号</span>
<span class="info-value">{{ detailData.event?.endStakeNo || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">受灾里程</span>
<span class="info-value">{{ formatUnitValue(detailData.event?.blockedMileage, '公里') }}</span>
</div>
<div class="info-item">
<span class="info-label">恢复重建预估费用万元</span>
<span class="info-value">{{ detailData.event?.estimatedRecoveryCost ?? '-' }}</span>
</div>
</div>
<div class="base-info-column">
<div class="info-item">
<span class="info-label">发生时间</span>
<span class="info-value">{{ detailData.occurTime || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">处理措施</span>
<span class="info-value">{{ getBaseDisposalMeasures() }}</span>
</div>
<div class="info-item">
<span class="info-label">水毁处数</span>
<span class="info-value">{{ detailData.event?.damageCount ?? '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">起点桩纬度</span>
<span class="info-value">{{ detailData.event?.startStakeLatitude || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">止点桩纬度</span>
<span class="info-value">{{ detailData.event?.endStakeLatitude || '-' }}</span>
</div>
</div>
<div class="base-info-group">
<el-row v-for="(row, rowIndex) in baseInfoRows" :key="rowIndex" :gutter="24" class="base-info-row">
<el-col v-for="item in row" :key="`${rowIndex}-${item.label}`" :span="getColSpan(item, row)" class="info-column">
<div class="info-item">
<span class="info-label">{{ item.label }}</span>
<span class="info-value">{{ item.value }}</span>
</div>
</el-col>
</el-row>
</div>
</el-card>
@ -122,34 +38,14 @@
</div>
<div class="content-wrapper">
<div class="basic-info-wrapper">
<div class="info-list">
<div class="info-item">
<span class="info-label">现场描述</span>
<span class="info-value">{{ report.siteDescription || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">处置措施</span>
<span class="info-value">{{ report.disposalMeasures || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">实际恢复时间</span>
<span class="info-value">{{ report.actualRecoverTime || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">预计恢复时间</span>
<span class="info-value">{{ report.expectRecoverTime || '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">填报人</span>
<span class="info-value">{{ report.reporterName ? report.reporterName : '-' }}</span>
</div>
<div class="info-item">
<span class="info-label">联系电话</span>
<span class="info-value">{{ report.phone ? report.phone : '-' }}</span>
</div>
</div>
<el-row :gutter="24" class="report-info-row">
<el-col v-for="item in getReportInfoItems(report)" :key="item.label" :span="24" class="info-column">
<div class="info-item">
<span class="info-label">{{ item.label }}</span>
<span class="info-value">{{ item.value }}</span>
</div>
</el-col>
</el-row>
<div class="file-list">
<FileUpload v-model="report.fileList" :readonly="!isEdit" />
</div>
@ -239,6 +135,64 @@ const hasReportData = computed(() => {
return allReports.value.length > 0
})
const baseInfoRows = computed(() => {
if (!detailData.value) return []
const rows = [
[
{ label: '事件类型', value: '水毁事件' },
{ label: '填报站点', value: detailData.value.event.stationName || '-' },
{ label: '发生时间', value: detailData.value.event.occurTime || '-' }
],
[
{ label: '路况类别', value: detailData.value.event.roadConditionType || '-' },
{ label: '抢险进度', value: detailData.value.event?.repairProgress || '-' },
{ label: '处理措施', value: getBaseDisposalMeasures() }
],
[
{ label: '是否阻断', value: formatBooleanValue(detailData.value.event?.isBlocked) },
{ label: '受灾里程', value: formatUnitValue(detailData.value.event?.blockedMileage, '公里') },
{ label: '水毁处数', value: detailData.value.event?.damageCount ?? '-' }
],
[
{ label: '地点路线', value: detailData.value.event?.routeNo || '-'},
{ label: '起点桩号', value: detailData.value.event?.startStakeNo || '-' },
{ label: '止点桩号', value: detailData.value.event?.endStakeNo || '-' },
],
[
{ label: '路况位置', value: detailData.value.event?.occurLocation || '-' },
{ label: '阻断点小地名', value: detailData.value.event?.blockedPointName || '-' },
{ label: '所属区县', value: detailData.value.event?.district || '-' },
],
[
{ label: '是否需要恢复重建', value: formatBooleanValue(detailData.value.event?.needsRecovery), span: 8 }
],
]
if (detailData.value.event?.estimatedRecoveryCost) {
rows[5].push({ label: '恢复重建预估费用(万元)', value: detailData.value.event?.estimatedRecoveryCost ?? '-', span: 16 })
}
return rows
})
const getReportInfoItems = (report) => {
return [
{ label: '现场描述', value: report.siteDescription || '-' },
{ label: '处置措施', value: report.disposalMeasures || '-' },
{ label: '实际恢复时间', value: report.actualRecoverTime || '-' },
{ label: '预计恢复时间', value: report.expectRecoverTime || '-' },
{ label: '填报人', value: report.reporterName || '-' },
{ label: '联系电话', value: report.phone || '-' }
]
}
const getColSpan = (item, row) => {
if(item.span) return item.span
const length = row?.length || 1
return Math.floor(24 / length)
}
const getBaseDisposalMeasures = () => {
const firstItem = allReports.value[0]
if (!firstItem) return '-'
@ -293,11 +247,6 @@ const getDisasterDetail = async () => {
report: data.report || [],
fileList: data.fileList || [],
lossList: data.lossList || [],
occurLocation: data.occurLocation || '',
occurTime: data.occurTime || '',
roadConditionType: data.roadConditionType || '',
routeNo: data.routeNo || '',
routeName: data.routeName || ''
}
if (isEdit.value) {
@ -353,12 +302,6 @@ onMounted(() => {
}
}
.base-info-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
}
.info-item {
display: flex;
align-items: flex-start;
@ -387,8 +330,15 @@ onMounted(() => {
}
}
.base-info-column {
.base-info-group,
.base-info-row,
.report-info-row {
width: 100%;
}
.info-column {
min-width: 0;
margin-bottom: 10px;
}
.report-section {
@ -439,16 +389,20 @@ onMounted(() => {
}
.basic-info-wrapper {
display: flex;
gap: 24px;
}
.detal-info-wrapper {
margin-top: 10px;
border-top: 1px solid #efefef;
padding-top: 10px;
}
.info-list {
.report-info-row {
flex: 1;
overflow: hidden;
margin-bottom: -10px;
}
.file-list {
width: 320px;
flex-shrink: 0;
}
</style>

View File

@ -16,13 +16,13 @@
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系人员" prop="event.contactPerson">
<el-input v-model="formData.event.contactPerson" placeholder="请填写" />
<el-form-item label="联系人员" prop="report.contactPerson">
<el-input v-model="formData.report.contactPerson" placeholder="请填写" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系电话" prop="event.contactPhone">
<el-input v-model="formData.event.contactPhone" maxlength="11" placeholder="请填写" />
<el-form-item label="联系电话" prop="report.contactPhone">
<el-input v-model="formData.report.contactPhone" maxlength="11" placeholder="请填写" />
</el-form-item>
</el-col>
</el-row>
@ -39,20 +39,20 @@
</el-col>
<el-col :span="8">
<el-form-item label="填报站点" prop="event.serviceStationId">
<YHZSelect v-model="formData.event.serviceStationId" />
<YHZSelect v-model="formData.event.serviceStationId" @change="(item) => formData.event.serviceStationName = item.mc" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="发生时间" prop="occurTime">
<el-date-picker v-model="formData.occurTime" type="datetime" placeholder="请选择日期时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
<el-form-item label="发生时间" prop="event.occurTime">
<el-date-picker v-model="formData.event.occurTime" type="datetime" placeholder="请选择日期时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="路况类别" prop="roadConditionType">
<el-select v-model="formData.roadConditionType" placeholder="请选择" style="width: 100%">
<el-form-item label="路况类别" prop="event.roadConditionType">
<el-select v-model="formData.event.roadConditionType" placeholder="请选择" style="width: 100%">
<el-option v-for="(option, idx) in options['waterRoadConditionType']" :key="idx" :label="option.label" :value="option.value" />
</el-select>
</el-form-item>
@ -109,16 +109,16 @@
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="线路编号" prop="routeNo">
<RoadRoutesSelect v-model="formData.routeNo" :extra-params="{ xzdj: filterForm.routeType, qxid: formData.event.district }" @change="handleRouteNoChange" />
<el-form-item label="线路编号" prop="event.routeNo">
<RoadRoutesSelect v-model="formData.event.routeNo" :extra-params="{ xzdj: filterForm.routeType, qxid: formData.event.district }" @change="handleRouteNoChange" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="路况位置" prop="occurLocation">
<el-input v-model="formData.occurLocation" placeholder="请选择">
<el-form-item label="路况位置" prop="event.occurLocation">
<el-input v-model="formData.event.occurLocation" placeholder="请选择">
<template #suffix>
<el-icon class="location-icon"><LocationFilled /></el-icon>
</template>
@ -141,13 +141,13 @@
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="起点桩经度" prop="event.startStakeLongitude">
<NumberInput v-model="formData.event.startStakeLongitude" :precision="6" placeholder="请填写" />
<el-form-item label="起点桩经度" prop="event.startStakeLng">
<NumberInput v-model="formData.event.startStakeLng" :precision="6" placeholder="请填写" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="起点桩纬度" prop="event.startStakeLatitude">
<NumberInput v-model="formData.event.startStakeLatitude" :precision="6" placeholder="请填写" />
<el-form-item label="起点桩纬度" prop="event.startStakeLat">
<NumberInput v-model="formData.event.startStakeLat" :precision="6" placeholder="请填写" />
</el-form-item>
</el-col>
<el-col :span="8">
@ -161,13 +161,13 @@
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="止点桩经度" prop="event.endStakeLongitude">
<NumberInput v-model="formData.event.endStakeLongitude" :precision="6" placeholder="请填写" />
<el-form-item label="止点桩经度" prop="event.endStakeLng">
<NumberInput v-model="formData.event.endStakeLng" :precision="6" placeholder="请填写" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="止点桩纬度" prop="event.endStakeLatitude">
<NumberInput v-model="formData.event.endStakeLatitude" :precision="6" placeholder="请填写" />
<el-form-item label="止点桩纬度" prop="event.endStakeLat">
<NumberInput v-model="formData.event.endStakeLat" :precision="6" placeholder="请填写" />
</el-form-item>
</el-col>
</el-row>

View File

@ -6,10 +6,6 @@ import { useOptions } from '@shared/composables/useOptions'
import { useUserStore} from '@/store/userStore'
const createDefaultFormData = () => ({
occurLocation: '',
occurTime: '',
roadConditionType: '',
routeNo: '',
event: {
},
report: {
@ -40,27 +36,27 @@ export const useWaterDisasterReport = () => {
const showEstimatedRecoveryCost = computed(() => formData.event.needsRecovery === true)
const formRules = {
'event.contactPerson': [{ required: true, message: '请输入联系人员', trigger: 'blur' }],
'event.contactPhone': [
{ required: true, message: '请输入联系电话', trigger: 'blur' },
// 'report.contactPerson': [{ required: true, message: '请输入联系人员', trigger: 'blur' }],
'report.contactPhone': [
// { required: true, message: '请输入联系电话', trigger: 'blur' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的联系电话', trigger: 'blur' }
],
'event.serviceStationId': [{ required: true, message: '请选择填报站点', trigger: 'change' }],
occurTime: [{ required: true, message: '请选择发生时间', trigger: 'change' }],
roadConditionType: [{ required: true, message: '请选择路况类别', trigger: 'change' }],
"event.occurTime": [{ required: true, message: '请选择发生时间', trigger: 'change' }],
'event.roadConditionType': [{ required: true, message: '请选择路况类别', trigger: 'change' }],
'event.repairProgress': [{ required: true, message: '请选择抢险进度', trigger: 'change' }],
'event.isBlocked': [{ required: true, message: '请选择是否阻断', trigger: 'change' }],
'event.blockedMileage': [{ required: true, message: '请输入受灾里程', trigger: 'blur' }],
'event.damageCount': [{ required: true, message: '请输入水毁处数', trigger: 'blur' }],
'event.district': [{ required: true, message: '请选择所属区县', trigger: 'change' }],
routeNo: [{ required: true, message: '请选择线路编号', trigger: 'change' }],
occurLocation: [{ required: true, message: '请输入路况位置', trigger: 'blur' }],
'event.routeNo': [{ required: true, message: '请选择线路编号', trigger: 'change' }],
'event.occurLocation': [{ required: true, message: '请输入路况位置', trigger: 'blur' }],
'event.blockedPointName': [{ required: true, message: '请输入阻断点小地名', trigger: 'blur' }],
'event.startStakeNo': [{ required: true, message: '请输入起点桩号', trigger: 'blur' }],
'event.startStakeLongitude': [{ required: true, message: '请输入起点桩经度', trigger: 'blur' }],
'event.startStakeLatitude': [{ required: true, message: '请输入起点桩纬度', trigger: 'blur' }],
'event.startStakeLng': [{ required: true, message: '请输入起点桩经度', trigger: 'blur' }],
'event.startStakeLat': [{ required: true, message: '请输入起点桩纬度', trigger: 'blur' }],
'event.endStakeNo': [{ required: true, message: '请输入止点桩号', trigger: 'blur' }],
'event.endStakeLongitude': [{ required: true, message: '请输入止点桩经度', trigger: 'blur' }],
'event.endStakeLat': [{ required: true, message: '请输入止点桩经度', trigger: 'blur' }],
'event.endStakeLatitude': [{ required: true, message: '请输入止点桩纬度', trigger: 'blur' }],
'report.disposalMeasures': [{ required: true, message: '请选择处置措施', trigger: 'change' }],
'report.expectRecoverTime': [{ required: true, message: '请选择预计恢复时间', trigger: 'change' }],
@ -133,13 +129,14 @@ export const useWaterDisasterReport = () => {
const startPoint = parsePointValue(item.startPoint)
const endPoint = parsePointValue(item.endPoint)
formData.event.startStakeLongitude = startPoint.longitude
formData.event.startStakeLatitude = startPoint.latitude
formData.event.endStakeLongitude = endPoint.longitude
formData.event.endStakeLatitude = endPoint.latitude
formData.event.startStakeLng = startPoint.longitude
formData.event.startStakeLat = startPoint.latitude
formData.event.endStakeLng = endPoint.longitude
formData.event.endStakeLat = endPoint.latitude
}
const buildSubmitData = () => {
return formData
}
const validate = async () => {
@ -164,7 +161,7 @@ export const useWaterDisasterReport = () => {
submitting.value = true
try {
const res = await request({
url: '/snow-ops-platform/water-damage/addOrUpdate',
url: '/snow-ops-platform/water-damage/report',
method: 'post',
data: buildSubmitData()
})

View File

@ -213,6 +213,7 @@ const handleSizeChange = (size) => {
const handleRowClick = (row) => {
tempSelectedItem.value = row
console.log("🚀 ~ handleRowClick ~ row:", row)
selectedValue.value = tempSelectedItem.value.id
dialogVisible.value = false
emit('change', tempSelectedItem.value)