feat: 设备台账启用状态、审批签核展示与导入交互修复

gaoluyang

11 小时以前 4f0517d5c30ec2962c16883f0552cfa6db2034dc

 src/views/equipmentManagement/ledger/index.vue

@@ -140,6 +140,11 @@
            @selection-change="handleSelectionChange"
            @pagination="changePage"
          >
            <template #isEnabled="{ row }">
              <el-tag :type="row.isEnabled === 0 ? 'info' : 'success'" size="small">
                {{ row.isEnabled === 0 ? '停用' : '启用' }}
              </el-tag>
            </template>
          </PIMTable>
        </div>
      </div>
@@ -166,6 +171,9 @@
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :on-error="handleFileError"
        :on-change="handleFileChange"
        :on-exceed="handleFileExceed"
        :auto-upload="false"
        drag
      >
@@ -202,7 +210,11 @@
        <el-descriptions-item label="设备类型">{{ detailData.type }}</el-descriptions-item>
        <el-descriptions-item label="供应商">{{ detailData.supplierName }}</el-descriptions-item>
        <el-descriptions-item label="所属区域">{{ detailData.areaName }}</el-descriptions-item>
        <el-descriptions-item label="存放位置">{{ detailData.storageLocation }}</el-descriptions-item>
        <el-descriptions-item label="启用状态">
          <el-tag :type="detailData.isEnabled === 0 ? 'info' : 'success'" size="small">
            {{ detailData.isEnabled === 0 ? '停用' : '启用' }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item label="单位">{{ detailData.unit }}</el-descriptions-item>
        <el-descriptions-item label="数量">{{ detailData.number }}</el-descriptions-item>
        <el-descriptions-item label="启用折旧">{{ detailData.isDepr === 1 ? '是' : '否' }}</el-descriptions-item>
@@ -287,7 +299,7 @@
  editDeviceArea,
  delDeviceArea,
} from "@/api/equipmentManagement/area";
import { onMounted, getCurrentInstance, ref, reactive, computed } from "vue";
import { onMounted, getCurrentInstance, ref, reactive, computed, nextTick } from "vue";
import Modal from "./Modal.vue";
import { ElMessageBox, ElMessage } from "element-plus";
import { UploadFilled } from "@element-plus/icons-vue";
@@ -339,6 +351,7 @@
  open: false,
  title: "",
  isUploading: false,
  file: null,
  headers: { Authorization: "Bearer " + getToken() },
  url: import.meta.env.VITE_APP_BASE_API + "/device/ledger/import",
});
@@ -387,8 +400,11 @@
      prop: "supplierName",
    },
    {
      label: "存放位置",
      prop: "storageLocation",
      label: "启用状态",
      prop: "isEnabled",
      dataType: "slot",
      slot: "isEnabled",
      width: 100,
    },
    {
      label: "数量",
@@ -670,7 +686,13 @@

const handleImport = () => {
  upload.title = "设备台账导入";
  upload.isUploading = false;
  upload.file = null;
  upload.open = true;
  // 清理上一次失败/成功遗留的文件，避免出现已选文件却无法再次选择的情况
  nextTick(() => {
    proxy.$refs["uploadRef"] && proxy.$refs["uploadRef"].clearFiles();
  });
};

const importTemplate = () => {
@@ -685,21 +707,71 @@
  upload.isUploading = true;
};

const handleFileSuccess = (response, file, fileList) => {
  upload.open = false;
  upload.isUploading = false;
  proxy.$refs["uploadRef"].handleRemove(file);
const handleFileChange = (file) => {
  // 只记录待上传的文件；删除/成功/失败时 Element Plus 也会触发 change，不能覆盖成旧文件
  upload.file = file && file.status === "ready" ? file.raw : null;
};

const handleFileExceed = (files) => {
  // 只允许选择一个文件，后选的文件覆盖先选的文件
  proxy.$refs["uploadRef"].clearFiles();
  proxy.$refs["uploadRef"].handleStart(files[0]);
};

const showImportResult = (msg) => {
  proxy.$alert(
    "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
      response.msg +
      msg +
      "</div>",
    "导入结果",
    { dangerouslyUseHTMLString: true }
  );
  getTableData();
};

const handleFileSuccess = (response, file, fileList) => {
  upload.open = false;
  upload.isUploading = false;
  upload.file = null;
  proxy.$refs["uploadRef"].handleRemove(file);
  const success = response && response.code === 200;
  showImportResult((response && response.msg) || (success ? "导入成功" : "导入失败"));
  if (success) {
    getTableData();
  }
};

// 网络异常/后端返回非 2xx 时触发，必须复位上传状态并给出提示，否则再次点击“确定”不会有任何反应
const handleFileError = (error, file, fileList) => {
  upload.isUploading = false;
  upload.file = null;
  // 移除失败文件，否则文件状态为 fail，再次点“确定”不会重新上传
  try {
    proxy.$refs["uploadRef"].handleRemove(file);
  } catch (e) {
    // ignore
  }
  let msg = "导入失败，请检查网络或稍后重试";
  try {
    const data = error && error.message ? JSON.parse(error.message) : null;
    if (data && data.msg) {
      msg = data.msg;
    }
  } catch (e) {
    // 非 JSON 响应，使用默认提示
  }
  showImportResult(msg);
};

const submitFileForm = () => {
  if (upload.isUploading) {
    ElMessage.warning("文件上传中，请稍候");
    return;
  }
  if (!upload.file) {
    ElMessage.warning("请先选择要导入的 Excel 文件");
    return;
  }
  upload.isUploading = true;
  proxy.$refs["uploadRef"].submit();
};