<template>
|
<CardDialog
|
:title="dialogTitle"
|
:close-on-click-modal="!loading"
|
:model-value="modelValue"
|
@update:modelValue="(e) => $emit('update:modelValue', e)"
|
>
|
<el-form
|
:inline="false"
|
:model="formObj"
|
ref="formRef"
|
:rules="rules"
|
label-position="right"
|
label-width="100px"
|
>
|
<el-form-item label="区县" prop="location">
|
<OptionLocation2
|
:disabled="true"
|
:level="3"
|
:initValue="false"
|
:checkStrictly="false"
|
:allOption="false"
|
v-model="formObj.location"
|
></OptionLocation2>
|
</el-form-item>
|
<el-form-item label="任务编号" prop="missionCode">
|
<el-input
|
:disabled="true"
|
size="small"
|
clearable
|
v-model="formObj.missionCode"
|
placeholder="任务编号"
|
class="w-150"
|
/>
|
</el-form-item>
|
<el-form-item label="区域" prop="zone">
|
<el-input
|
size="small"
|
clearable
|
v-model="formObj.zone"
|
placeholder="区域"
|
class="w-150"
|
/>
|
</el-form-item>
|
<el-form-item label="污染背景" prop="pollutionDegreeIndex">
|
<OptionPollutionDegree
|
v-model="formObj.pollutionDegreeIndex"
|
></OptionPollutionDegree>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
:disabled="!edit"
|
type="primary"
|
@click="onSubmit"
|
:loading="loading"
|
>提交</el-button
|
>
|
<el-button @click="onCancel" :disabled="loading">取消</el-button>
|
</el-form-item>
|
</el-form>
|
</CardDialog>
|
</template>
|
<script setup>
|
import { ref, onMounted, reactive, computed, watch } from 'vue';
|
import { useFormConfirm } from '@/composables/formConfirm';
|
import { useFetchData } from '@/composables/fetchData';
|
import gridApi from '@/api/gridApi';
|
import { pollutionName } from '@/constant/pollution-degree';
|
|
const props = defineProps({
|
modelValue: Boolean,
|
// 走航融合编辑模式，新建或更新
|
mode: {
|
type: String,
|
default: 'create'
|
},
|
record: {
|
type: Object
|
},
|
groupId: {
|
type: Number,
|
default: 2
|
}
|
});
|
const emits = defineEmits(['update:modelValue', 'onSubmit']);
|
|
const dialogTitle = computed(() => {
|
return `${props.mode == 'create' ? '生成' : '修改'}走航融合记录`;
|
});
|
|
const { loading, fetchData } = useFetchData();
|
const { formObj, formRef, edit, onSubmit, onCancel } = useFormConfirm({
|
submit: {
|
do: submitFusionRecord
|
},
|
cancel: {
|
do: () => {
|
emits('update:modelValue', false);
|
}
|
}
|
});
|
const rules = reactive({
|
location: [
|
{
|
required: true,
|
message: '区县不能为空',
|
trigger: 'change'
|
}
|
],
|
missionCode: [
|
{
|
required: true,
|
message: '任务编号不能为空',
|
trigger: 'blur'
|
}
|
],
|
zone: [
|
{
|
required: true,
|
message: '区域不能为空',
|
trigger: 'change'
|
}
|
],
|
pollutionDegreeIndex: [
|
{
|
required: true,
|
message: '污染背景不能为空',
|
trigger: 'change'
|
}
|
]
|
});
|
|
const param = computed(() => {
|
return {
|
provinceCode: formObj.value.location.pCode,
|
provinceName: formObj.value.location.pName,
|
cityCode: formObj.value.location.cCode,
|
cityName: formObj.value.location.cName,
|
districtCode: formObj.value.location.dCode,
|
districtName: formObj.value.location.dName,
|
townCode: formObj.value.location.tCode,
|
townName: formObj.value.location.tName,
|
missionCode: formObj.value.missionCode,
|
// Fixme 2025.4.15: 网格组id需要通过服务器动态获取
|
groupId: props.groupId,
|
zone: formObj.value.zone,
|
pollutionDegreeIndex: formObj.value.pollutionDegreeIndex,
|
pollutionDegree: pollutionName(formObj.value.pollutionDegreeIndex)
|
};
|
});
|
|
function submitFusionRecord() {
|
fetchData((page, pageSize) => {
|
return gridApi.buildUnderwayProduct(param.value).then((res) => {
|
emits('onSubmit', param.value.missionCode);
|
emits('update:modelValue', false);
|
});
|
});
|
}
|
|
// 监听传入的走航融合信息，在更新模式下，将融合信息映射到表单上
|
watch(
|
() => props.record,
|
(nV, oV) => {
|
if (nV && nV != oV) {
|
const r = nV;
|
// 关闭对话框时，直接返回
|
if (!props.modelValue) {
|
return;
|
}
|
formObj.value.location = {
|
pCode: r.provinceCode,
|
pName: r.provinceName,
|
cCode: r.cityCode,
|
cName: r.cityName,
|
dCode: r.districtCode,
|
dName: r.districtName,
|
tCode: r.townCode,
|
tName: r.townName
|
};
|
formObj.value.missionCode = r.missionCode;
|
formObj.value.groupId = props.groupId;
|
formObj.value.zone = r.districtName;
|
formObj.value.pollutionDegreeIndex = undefined;
|
formObj.value.pollutionDegree = undefined;
|
|
if (r.fusionData && props.mode == 'update') {
|
const f = r.fusionData;
|
formObj.value.groupId = f.groupId;
|
formObj.value.zone = f.zone;
|
formObj.value.pollutionDegreeIndex = f.pollutionDegreeIndex;
|
formObj.value.pollutionDegree = f.pollutionDegree;
|
}
|
}
|
}
|
);
|
</script>
|
