riku
2025-04-11 5e059c9c17a6d63b6c017d2d2beb25ae227071d1
src/components/mission/MissionEdit.vue
@@ -1,5 +1,9 @@
<template>
  <CardDialog v-model="visible" title="新建走航任务">
  <CardDialog
    :title="dialogTitle"
    :model-value="modelValue"
    @update:modelValue="(e) => $emit('update:modelValue', e)"
  >
    <el-form
      :inline="false"
      :model="formObj"
@@ -43,26 +47,10 @@
      </el-form-item>
    </el-form>
  </CardDialog>
  <el-button
    v-if="mode == 'create'"
    type="primary"
    class="el-button-custom"
    @click="visible = !visible"
  >
    新建任务
  </el-button>
  <el-button
    v-else
    type="primary"
    size="small"
    icon="EditPen"
    class="el-button-custom"
    @click="visible = !visible"
  ></el-button>
</template>
<script setup>
import moment from 'moment';
import { ref, reactive, computed } from 'vue';
import { ref, onMounted, reactive, computed, watch } from 'vue';
import missionApi from '@/api/missionApi';
import thirdPartyDataApi from '@/api/thirdPartyDataApi';
import { useFormConfirm } from '@/composables/formConfirm';
@@ -74,15 +62,19 @@
  mode: {
    type: String,
    default: 'create'
  },
  modelValue: Boolean,
  mission: {
    type: Object
  }
  // visible: {
  //   type: String,
  //   default: 'create'
  // }
});
const dialogTitle = computed(() => {
  return `${props.mode == 'create' ? '新建' : '修改'}走航任务`;
});
const emits = defineEmits(['update:modelValue']);
const missionStore = useMissionStore();
const visible = ref(false);
const { loading, fetchData } = useFetchData();
const rules = reactive({
  location: [
@@ -130,15 +122,22 @@
    endTime: formObj.value.timeArray[1]
  };
});
function submitMission() {
  const newMission = { ...param.value };
}
// 创建任务
function createMission() {
  fetchData((page, pageSize) => {
    return missionApi.putNewMission(param.value).then((res) => {
      visible.value = false;
    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({
@@ -147,11 +146,37 @@
  },
  cancel: {
    do: () => {
      visible.value = false;
      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',
@@ -161,6 +186,9 @@
    dCode: '310106',
    dName: '静安区'
  };
  } else {
    formObj.value = {};
  }
}
</script>
<style scoped>