caseEditor/src/app/fire/view/dispatch/editFire.vue

<template>
  <el-form ref="form" label-width="84px" class="camera-from">
    <div class="el-form-item">
      <el-col :span="12">
        <el-form-item label="项目编号" class="mandatory">
          <el-input
            v-model="bindFire.projectSn"
            maxlength="18"
            placeholder="请输入项目编号"
          />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="起火对象" class="mandatory">
          <el-input
            v-model="bindFire.projectName"
            maxlength="50"
            placeholder="请输入起火对象"
          />
        </el-form-item>
      </el-col>
    </div>
    <el-form-item label="起火地址" class="mandatory">
      <el-input
        v-model="bindFire.projectAddress"
        maxlength="50"
        placeholder="请输入起火地址"
      />
    </el-form-item>
    <el-form-item label="起火场所" class="mandatory">
      <el-cascader
        style="width: 100%"
        v-model="projectSite"
        placeholder="起火场所"
        :options="place"
        :props="{ expandTrigger: 'hover' }"
      />
    </el-form-item>
    <div class="el-form-item">
      <el-col :span="12">
        <el-form-item label="承办单位" class="mandatory">
          <companySelect v-model="bindFire.deptId" hideAll :notUpdate="true" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="承办人员" class="mandatory" placeholder="请输入承办人员">
          <el-input v-model="bindFire.organizerUsers" maxlength="50" />
        </el-form-item>
      </el-col>
    </div>
    <div class="el-form-item">
      <el-col :span="12">
        <el-form-item label="事故日期" class="mandatory" placeholder="请选择事故日期">
          <el-date-picker type="date" v-model="accidentDate" style="width: 100%" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="火灾原因" class="mandatory">
          <el-cascader
            style="width: 100%"
            v-model="fireReason"
            placeholder="火灾原因："
            :options="reason"
            :props="{ expandTrigger: 'hover' }"
          />
        </el-form-item>
      </el-col>
    </div>
  </el-form>
</template>

<script setup lang="ts">
import companySelect from "@/components/company-select/index.vue";
import { ref } from "vue";
import { Fire, setFire, addFire } from "@/app/fire/store/fire";
import { reason, place } from "@/app/fire/constant/fire";
import { ElMessage } from "element-plus";
import { dateFormat } from "@/util";
import { genCascaderValue, getCode } from "@/helper/cascader";
import { QuiskExpose } from "@/helper/mount";

const props = defineProps<{ fire?: Fire }>();

const bindFire = ref<Fire>(props.fire || ({} as Fire));

const fireReason = genCascaderValue(bindFire, "fireReason");
const projectSite = genCascaderValue(bindFire, "projectSite");
const accidentDate = ref(
  bindFire.value.accidentDate ? new Date(bindFire.value.accidentDate) : new Date()
);

defineExpose<QuiskExpose>({
  async submit() {
    if (!bindFire.value.projectAddress || !bindFire.value.projectAddress.trim()) {
      ElMessage.error("起火地址不能为空！");
      throw "起火地址不能为空！";
    } else if (!bindFire.value.projectSn || !bindFire.value.projectSn.trim()) {
      ElMessage.error("项目编号不能为空！");
      throw "项目编号不能为空！";
    } else if (!bindFire.value.projectName || !bindFire.value.projectName.trim()) {
      ElMessage.error("起火对象不能为空！");
      throw "起火对象不能为空！";
    } else if (!bindFire.value.projectSite || !bindFire.value.projectSite.trim()) {
      ElMessage.error("起火场所不能为空！");
      throw "起火场所不能为空！";
    } else if (!bindFire.value.deptId || !bindFire.value.deptId.trim()) {
      ElMessage.error("承办单位不能为空！");
      throw "承办单位不能为空！";
    } else if (!bindFire.value.organizerUsers || !bindFire.value.organizerUsers.trim()) {
      ElMessage.error("承办人员不能为空！");
      throw "承办人员不能为空！";
    } else if (!accidentDate) {
      ElMessage.error("事故日期不能为空！");
      throw "事故日期不能为空！";
    } else if (!bindFire.value.fireReason || !bindFire.value.fireReason.trim()) {
      ElMessage.error("火灾原因不能为空！");
      throw "火灾原因不能为空！";
    }

    bindFire.value.accidentDate = dateFormat(accidentDate.value, "yyyy-MM-dd");
    bindFire.value.projectSiteCode = getCode(place, bindFire.value.projectSite);
    bindFire.value.id
      ? await setFire(bindFire.value)
      : await addFire(bindFire.value as any);
  },
});
</script>