<template>
|
<CardDialog
|
:title="dialogTitle"
|
: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
|
:level="3"
|
:initValue="false"
|
:checkStrictly="false"
|
:allOption="false"
|
v-model="formObj.location"
|
></OptionLocation2>
|
</el-form-item>
|
<el-form-item label="任务编号" prop="missionCode">
|
<el-input
|
size="small"
|
clearable
|
v-model="formObj.missionCode"
|
placeholder="任务编号"
|
/>
|
</el-form-item>
|
<OptionType v-model="formObj.deviceType"></OptionType>
|
<OptionDevice
|
:type="formObj.deviceType"
|
v-model="formObj.deviceCode"
|
></OptionDevice>
|
<OptionTime v-model="formObj.timeArray"></OptionTime>
|
<el-form-item>
|
<el-button
|
:disabled="!edit"
|
type="primary"
|
@click="onSubmit"
|
:loading="loading"
|
>提交</el-button
|
>
|
<el-button @click="onCancel">取消</el-button>
|
</el-form-item>
|
</el-form>
|
</CardDialog>
|
</template>
|
<script setup>
|
import moment from 'moment';
|
import { ref, onMounted, reactive, computed, watch } from 'vue';
|
import missionApi from '@/api/missionApi';
|
import thirdPartyDataApi from '@/api/thirdPartyDataApi';
|
import { useFormConfirm } from '@/composables/formConfirm';
|
import { useFetchData } from '@/composables/fetchData';
|
import { useMissionStore } from '@/stores/mission';
|
|
const props = defineProps({
|
// 走航任务编辑模式，新建或更新
|
mode: {
|
type: String,
|
default: 'create'
|
},
|
modelValue: Boolean,
|
mission: {
|
type: Object
|
}
|
});
|
const dialogTitle = computed(() => {
|
return `${props.mode == 'create' ? '新建' : '修改'}走航任务`;
|
});
|
|
const emits = defineEmits(['update:modelValue']);
|
|
const missionStore = useMissionStore();
|
const { loading, fetchData } = useFetchData();
|
const rules = reactive({
|
location: [
|
{
|
required: true,
|
message: '区县不能为空',
|
trigger: 'change'
|
}
|
],
|
missionCode: [
|
{
|
required: true,
|
message: '任务编号不能为空',
|
trigger: 'blur'
|
}
|
],
|
timeArray: [
|
{
|
required: true,
|
// message: '时间不能为空',
|
trigger: 'change',
|
validator: (rule, value, callback) => {
|
if (value == null) {
|
callback(new Error('时间不能为空'));
|
} else {
|
const st = moment(value[0]);
|
const et = moment(value[1]);
|
const range = et.diff(st, 'second');
|
if (range > 12 * 60 * 60) {
|
callback(new Error('任务时长最多为12小时'));
|
}
|
}
|
callback();
|
}
|
}
|
]
|
});
|
const param = computed(() => {
|
return {
|
districtName: formObj.value.location.dName,
|
missionCode: formObj.value.missionCode,
|
deviceType: formObj.value.deviceType,
|
deviceCode: formObj.value.deviceCode,
|
startTime: formObj.value.timeArray[0],
|
endTime: formObj.value.timeArray[1]
|
};
|
});
|
|
function submitMission() {
|
const newMission = { ...param.value };
|
}
|
|
// 创建任务
|
function createMission() {
|
fetchData((page, pageSize) => {
|
return missionApi
|
.putNewMission(param.value)
|
.then((res) => {
|
missionStore.fetchMission();
|
// 通知服务端启动任务范围内的第三方数据获取任务
|
thirdPartyDataApi.fetchMissionData(param.value.missionCode);
|
})
|
.finally(() => emits('update:modelValue', false));
|
});
|
}
|
const { formObj, formRef, edit, onSubmit, onCancel } = useFormConfirm({
|
submit: {
|
do: createMission
|
},
|
cancel: {
|
do: () => {
|
emits('update:modelValue', false);
|
}
|
}
|
});
|
|
// 监听传入的任务信息，在更新模式下，将任务信息映射到表单上
|
watch(
|
() => [props.modelValue, props.mission],
|
(nV, oV) => {
|
if (nV != oV) {
|
const [v, m] = nV;
|
if (v) {
|
initFormObj();
|
}
|
if (m && props.mode == 'update') {
|
formObj.value.location = { dName: m.districtName };
|
formObj.value.missionCode = m.missionCode;
|
formObj.value.deviceType = m.deviceType;
|
formObj.value.deviceCode = m.deviceCode;
|
formObj.value.timeArray = [m.startTime, m.endTime];
|
}
|
}
|
},
|
{ immediate: true }
|
);
|
|
onMounted(() => {
|
initFormObj();
|
});
|
|
function initFormObj() {
|
if (import.meta.env.VITE_DATA_MODE == 'jingan') {
|
formObj.value.location = {
|
pCode: '31',
|
pName: '上海市',
|
cCode: '3100',
|
cName: '上海市',
|
dCode: '310106',
|
dName: '静安区'
|
};
|
} else {
|
formObj.value = {};
|
}
|
}
|
</script>
|
<style scoped>
|
/* .el-form-item {
|
margin-bottom: 0px;
|
} */
|
</style>
|
