gaoluyang
2026-06-02 10a440fac0dd665bf4af78e1e3c913dcf893bf10
src/views/equipmentManagement/repair/Modal/RepairModal.vue
@@ -59,43 +59,96 @@
        </el-col>
        <el-col :span="12">
          <el-form-item label="报修日期">
            <el-date-picker
              v-model="form.repairTime"
              placeholder="请选择报修日期"
              format="YYYY-MM-DD"
              value-format="YYYY-MM-DD"
              type="date"
              clearable
              style="width: 100%"
            />
            <el-date-picker v-model="form.repairTime"
                            placeholder="请选择报修日期"
                            format="YYYY-MM-DD"
                            value-format="YYYY-MM-DD"
                            type="date"
                            clearable
                            style="width: 100%"
                            :disabled="operationType === 'view'" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="报修人">
            <el-input v-model="form.repairName" placeholder="请输入报修人" />
            <el-input v-model="form.repairName"
                      placeholder="请输入报修人"
                      :disabled="operationType === 'view'" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="报修报修项目">
            <el-input v-model="form.machineryCategory"
                      placeholder="请输入报修报修项目"
                      :disabled="operationType === 'view'" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="维修人">
            <el-input v-model="form.maintenanceName"
                      placeholder="请输入维修人姓名"
                      :disabled="operationType === 'view'" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="id">
        <el-col :span="12">
          <el-form-item label="报修状态">
            <el-select v-model="form.status">
              <el-option label="待维修" :value="0" />
              <el-option label="完结" :value="1" />
              <el-option label="失败" :value="2" />
            <el-select v-model="form.status"
                       disabled>
              <el-option label="待维修"
                         :value="0"></el-option>
              <el-option label="已验收"
                         :value="1"></el-option>
              <el-option label="失败"
                         :value="2"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- 验收信息展示 -->
      <el-row v-if="id && (form.status === 1 || form.status === 3)">
        <el-col :span="12">
          <el-form-item label="验收人">
            <el-input v-model="form.acceptanceName"
                      disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="验收时间">
            <el-input v-model="form.acceptanceTime"
                      disabled />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="验收备注">
            <el-input v-model="form.acceptanceRemark"
                      type="textarea"
                      :rows="2"
                      disabled />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="故障现象">
            <el-input
              v-model="form.remark"
              :rows="2"
              type="textarea"
              placeholder="请输入故障现象"
            />
            <el-input v-model="form.remark"
                      :rows="2"
                      type="textarea"
                      placeholder="请输入故障现象"
                      :disabled="operationType === 'view'" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="operationType !== 'view'"
              :gutter="30">
        <el-col :span="24">
          <el-form-item label="附件"
                        prop="attachmentIds">
            <FileUpload v-model:file-list="form.storageBlobDTOs"
                        :disabled="operationType === 'view'" />
          </el-form-item>
        </el-col>
      </el-row>
@@ -104,21 +157,18 @@
</template>
<script setup>
import { nextTick, ref, unref } from "vue";
import dayjs from "dayjs";
import { ElMessage } from "element-plus";
import FormDialog from "@/components/Dialog/FormDialog.vue";
import useFormData from "@/hooks/useFormData";
import useUserStore from "@/store/modules/user";
import {
  addRepair,
  editRepair,
  getRepairById,
} from "@/api/equipmentManagement/repair";
import {
  getDeviceAreaTree,
  getDeviceAreaTreeWithDevices,
} from "@/api/equipmentManagement/deviceArea";
  import FormDialog from "@/components/Dialog/FormDialog.vue";
  import FileUpload from "@/components/AttachmentUpload/file/index.vue";
  import {
    addRepair,
    editRepair,
    getRepairById,
  } from "@/api/equipmentManagement/repair";
  import { ElMessage } from "element-plus";
  import dayjs from "dayjs";
  import useFormData from "@/hooks/useFormData";
  import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
  import useUserStore from "@/store/modules/user";
defineOptions({
  name: "设备报修弹窗",
@@ -126,16 +176,26 @@
const emits = defineEmits(["ok"]);
const id = ref();
const visible = ref(false);
const loading = ref(false);
const userStore = useUserStore();
const areaOptions = ref([]);
const deviceOptions = ref([]);
const areaTreeProps = {
  label: "areaName",
  children: "children",
};
  const id = ref();
  const visible = ref(false);
  const loading = ref(false);
  const operationType = ref(""); // add, edit, view
  const computedTitle = computed(() => {
    if (operationType.value === "add") return "新增设备报修";
    if (operationType.value === "edit") return "编辑设备报修";
    if (operationType.value === "view") return "设备报修详情";
    return "";
  });
  const userStore = useUserStore();
  const deviceOptions = ref([]);
  const fileList = ref([]);
  const loadDeviceName = async () => {
    const { data } = await getDeviceLedger();
    deviceOptions.value = data;
  };
const { form, resetForm } = useFormData({
  areaId: undefined,
@@ -314,29 +374,40 @@
  visible.value = false;
};
const openAdd = async () => {
  id.value = undefined;
  visible.value = true;
  await nextTick();
  await loadAreaTree();
  deviceOptions.value = [];
};
  const openAdd = async () => {
    id.value = undefined;
    operationType.value = "add";
    visible.value = true;
    fileList.value = [];
    await nextTick();
    await loadDeviceName();
  };
const openEdit = async (editId) => {
  const { data } = await getRepairById(editId);
  id.value = editId;
  visible.value = true;
  await nextTick();
  await loadAreaTree();
  setForm(data);
  await loadDevicesByArea(form.areaId);
  syncDeviceFields(form.deviceLedgerIds);
};
  const openEdit = async editId => {
    const { data } = await getRepairById(editId);
    id.value = editId;
    operationType.value = "edit";
    visible.value = true;
    await nextTick();
    await loadDeviceName();
    setForm(data);
  };
defineExpose({
  openAdd,
  openEdit,
});
  const openView = async viewId => {
    const { data } = await getRepairById(viewId);
    id.value = viewId;
    operationType.value = "view";
    visible.value = true;
    await nextTick();
    await loadDeviceName();
    setForm(data);
  };
  defineExpose({
    openAdd,
    openEdit,
    openView,
  });
</script>
<style lang="scss" scoped></style>