fix: 设备备件与设备维修、设备保养关联起来

spring

4 天以前 899cf3d156b845ec610aae7352ab4b8332f32037

fix: 设备备件与设备维修、设备保养关联起来

 src/api/equipmentManagement/sparePartsUsage.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,36 @@
import request from "@/utils/request";

/**
 * å¤‡ä»¶é¢†ç”¨è®°å½• - åˆ†é¡µæŸ¥è¯¢
 * params: { current, size, sparePartId?, sparePartName?, source?, deviceId?, startTime?, endTime? }
 */
export const getSparePartsUsagePage = (params) => {
  return request({
    url: "/sparePartsUsage/listPage",
    method: "get",
    params,
  });
};

/**
 * å¤‡ä»¶é¢†ç”¨è®°å½• - æ–°å¢ž
 * data ç¤ºä¾‹ï¼š
 * {
 *   source: "repair" | "upkeep" | "manual",
 *   sourceId?: number | string,
 *   deviceId?: number | string,
 *   deviceName?: string,
 *   operatorId?: number | string,
 *   operator?: string,
 *   useTime?: string, // YYYY-MM-DD HH:mm:ss
 *   items: [{ sparePartId: number|string, qty: number }]
 * }
 */
export const addSparePartsUsage = (data) => {
  return request({
    url: "/sparePartsUsage/add",
    method: "post",
    data,
  });
};


 src/views/equipmentManagement/repair/Modal/MaintainModal.vue

@@ -32,23 +32,61 @@
          style="width: 100%"
        />
      </el-form-item>
      <el-form-item label="设备备件">
        <el-select v-model="form.sparePartsIds" :loading="loadingSparePartOptions" placeholder="请选择设备备件" multiple filterable>
          <el-option
              v-for="item in sparePartOptions"
              :key="item.id"
              :label="item.name"
              :value="item.id"
          />
        </el-select>
      </el-form-item>

      <el-form-item v-if="selectedSpareParts.length" label="领用数量">
        <div style="width: 100%">
          <div
            v-for="item in selectedSpareParts"
            :key="item.id"
            style="display: flex; align-items: center; gap: 10px; margin-bottom: 10px;"
          >
            <div style="flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
              {{ item.name }}
              <span v-if="item.quantity !== null && item.quantity !== undefined" style="color: #909399;">
                ï¼ˆåº“存：{{ item.quantity }}）
              </span>
            </div>
            <el-input-number
              v-model="sparePartQtyMap[item.id]"
              :min="1"
              :max="item.quantity !== null && item.quantity !== undefined ? Number(item.quantity) : undefined"
              :step="1"
              controls-position="right"
              style="width: 180px"
            />
          </div>
        </div>
      </el-form-item>
    </el-form>
  </FormDialog>
</template>

<script setup>
import { computed, getCurrentInstance, nextTick, ref } from "vue";
import FormDialog from "@/components/Dialog/FormDialog.vue";
import { addMaintain } from "@/api/equipmentManagement/repair";
import useFormData from "@/hooks/useFormData";
import useUserStore from "@/store/modules/user";
import dayjs from "dayjs";
import { ElMessage } from "element-plus";
import { getSparePartsList } from "@/api/equipmentManagement/spareParts";

defineOptions({
  name: "维修模态框",
});

const emits = defineEmits(["ok"]);
const { proxy } = getCurrentInstance();

// ä¿å­˜æŠ¥ä¿®è®°å½•çš„id
const repairId = ref();
@@ -61,6 +99,16 @@
  maintenanceResult: undefined, // ç»´ä¿®ç»“æžœ
  maintenanceTime: undefined, // ç»´ä¿®æ—¥æœŸ
  status: 0,
  sparePartsIds: [],
});
const sparePartOptions = ref([])
const loadingSparePartOptions = ref(true)
const sparePartQtyMap = ref({})

const selectedSpareParts = computed(() => {
  const ids = Array.isArray(form.sparePartsIds) ? form.sparePartsIds : [];
  const set = new Set(ids.map((i) => String(i)));
  return (sparePartOptions.value || []).filter((p) => set.has(String(p.id)));
});

const setForm = (data) => {
@@ -71,16 +119,59 @@
      ? dayjs(data.maintenanceTime).format("YYYY-MM-DD HH:mm:ss")
      : dayjs().format("YYYY-MM-DD HH:mm:ss");
  form.status = 1; // é»˜è®¤çŠ¶æ€ä¸ºå®Œç»“
  // multiple é€‰æ‹©å™¨è¦æ±‚数组；后端常返回 "1,2,3"
  if (Array.isArray(data?.sparePartsIds)) {
    form.sparePartsIds = data.sparePartsIds.map((v) => Number(v)).filter((v) => Number.isFinite(v));
  } else if (typeof data?.sparePartsIds === "string") {
    form.sparePartsIds = data.sparePartsIds
      .split(",")
      .map((s) => Number(String(s).trim()))
      .filter((v) => Number.isFinite(v));
  } else if (typeof data?.sparePartsIds === "number") {
    form.sparePartsIds = [data.sparePartsIds];
  } else {
    form.sparePartsIds = [];
  }
};

const sendForm = async () => {
  loading.value = true;
  try {
    const { code } = await addMaintain({ id: repairId.value, ...form });
    // é¢†ç”¨æ•°é‡æ ¡éªŒ
    if (Array.isArray(form.sparePartsIds) && form.sparePartsIds.length > 0) {
      for (const partId of form.sparePartsIds) {
        const qty = Number(sparePartQtyMap.value?.[partId]);
        if (!Number.isFinite(qty) || qty <= 0) {
          proxy?.$modal?.msgError?.("请填写备件领用数量");
          return;
        }
        const part = sparePartOptions.value.find((p) => String(p.id) === String(partId));
        const stock = part?.quantity;
        if (stock !== null && stock !== undefined && Number.isFinite(Number(stock))) {
          if (qty > Number(stock)) {
            proxy?.$modal?.msgError?.(`备件「${part?.name || ""}」领用数量不能超过库存（${stock}）`);
            return;
          }
        }
      }
    }
    const data = {
      id: repairId.value,
      ...form,
      sparePartsIds: form.sparePartsIds ? form.sparePartsIds.join(",") : "",
      sparePartsQty: form.sparePartsIds
        ? form.sparePartsIds.map((id) => sparePartQtyMap.value?.[id] ?? 1).join(",")
        : "",
      sparePartsUseList: form.sparePartsIds
        ? form.sparePartsIds.map((id) => ({ id, quantity: sparePartQtyMap.value?.[id] ?? 1 }))
        : [],
    }
    const { code } = await addMaintain(data);
    if (code == 200) {
      ElMessage.success("维修成功");
      emits("ok");
      resetForm();
      sparePartQtyMap.value = {};
      visible.value = false;
    }
  } finally {
@@ -88,13 +179,34 @@
  }
};

const fetchSparePartOptions = () => {
  loadingSparePartOptions.value = true;
  // å’Œå¤‡ä»¶ç®¡ç†é¡µä¸€è‡´ï¼š/spareParts/listPage â†’ res.data.records
  getSparePartsList({ current: 1, size: 1000 })
    .then((res) => {
      if (res.code === 200) {
        sparePartOptions.value = res?.data?.records || [];
      } else {
        sparePartOptions.value = [];
      }
    })
    .catch(() => {
      sparePartOptions.value = [];
    })
    .finally(() => {
      loadingSparePartOptions.value = false;
    });
}

const handleCancel = () => {
  resetForm();
  sparePartQtyMap.value = {};
  visible.value = false;
};

const handleClose = () => {
  resetForm();
  sparePartQtyMap.value = {};
  visible.value = false;
};

@@ -103,6 +215,7 @@
  visible.value = true;
  await nextTick();
  setForm(row);
  fetchSparePartOptions()
};

defineExpose({

 src/views/equipmentManagement/spareParts/index.vue

@@ -1,5 +1,7 @@
<template>
  <div class="spare-part-category">
    <el-tabs v-model="activeTab" @tab-change="handleTabChange">
      <el-tab-pane label="备件列表" name="list">
        <div class="search_form">
            <el-form :inline="true" :model="queryParams" class="search-form">
                <el-form-item label="备件名称">
@@ -90,18 +92,53 @@
        </span>
      </template>
    </el-dialog>
      </el-tab-pane>

      <el-tab-pane label="备件领用记录" name="usage">
        <div class="search_form">
          <el-form :inline="true" :model="usageQuery" class="search-form">
            <el-form-item label="备件名称">
              <el-input v-model="usageQuery.sparePartName" placeholder="请输入备件名称" clearable style="width: 240px" />
            </el-form-item>
            <el-form-item label="来源">
              <el-select v-model="usageQuery.source" placeholder="请选择" clearable style="width: 200px">
                <el-option label="ç»´ä¿®" value="repair" />
                <el-option label="保养" value="upkeep" />
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="handleUsageQuery">查询</el-button>
              <el-button @click="resetUsageQuery">重置</el-button>
            </el-form-item>
          </el-form>
        </div>

        <PIMTable
          rowKey="rowKey"
          :column="usageColumns"
          :tableData="usageTableData"
          :tableLoading="usageLoading"
          :page="usagePagination"
          :isShowPagination="true"
          @pagination="handleUsagePageChange"
        />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script setup>
import { ref, computed, onMounted, reactive, watch } from 'vue';
import { ref, computed, onMounted, reactive } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { getSparePartsList, addSparePart, editSparePart, delSparePart } from "@/api/equipmentManagement/spareParts";
import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
import PIMTable from "@/components/PIMTable/PIMTable.vue";
import { getSparePartsUsagePage } from "@/api/equipmentManagement/sparePartsUsage";

// åŠ è½½çŠ¶æ€
const loading = ref(false);
const formLoading = ref(false);
const activeTab = ref("list");
// å¯¹è¯æ¡†æ˜¾ç¤ºçŠ¶æ€
const dialogVisible = ref(false);
// ç¼–辑 ID
@@ -126,6 +163,35 @@
  size: 10,
  total: 0
});

// å¤‡ä»¶é¢†ç”¨è®°å½•
const usageLoading = ref(false);
const usageQuery = reactive({
  sparePartName: "",
  source: "",
});
const usagePagination = reactive({
  current: 1,
  size: 10,
  total: 0,
});
const usageTableData = ref([]);
const usageColumns = ref([
  { label: "来源", prop: "sourceText" },
  { label: "单据/记录ID", prop: "sourceId" },
  { label: "设备名称", prop: "deviceName" },
  { label: "备件名称", prop: "sparePartName" },
  { label: "领用数量", prop: "qty" },
  { label: "操作人", prop: "operator" },
  { label: "时间", prop: "time" },
]);

const handleTabChange = async (name) => {
  if (name === "usage") {
    usagePagination.current = 1;
    await fetchUsageData();
  }
};
const columns = ref([
  {
    label: "设备名称",
@@ -268,6 +334,52 @@
  }
}

const fetchUsageData = async () => {
  usageLoading.value = true;
  try {
    const res = await getSparePartsUsagePage({
      current: usagePagination.current,
      size: usagePagination.size,
      sparePartName: usageQuery.sparePartName || undefined,
      source: usageQuery.source || undefined,
    });
    if (res?.code === 200) {
      const records = res?.data?.records || [];
      usagePagination.total = res?.data?.total || 0;
      usageTableData.value = records.map((r, idx) => ({
        rowKey: r.id ?? `${usagePagination.current}-${idx}`,
        ...r,
        sourceText:
          r.source === "ç»´ä¿®" ? "ç»´ä¿®" :
          r.source === "保养" ? "保养" :
          r.source === "manual" ? "手工" :
          (r.source || "-"),
      }));
    } else {
      usagePagination.total = 0;
      usageTableData.value = [];
    }
  } finally {
    usageLoading.value = false;
  }
};

const handleUsageQuery = () => {
  usagePagination.current = 1;
  fetchUsageData();
};
const resetUsageQuery = () => {
  usageQuery.sparePartName = "";
  usageQuery.source = "";
  usagePagination.current = 1;
  fetchUsageData();
};
const handleUsagePageChange = (obj) => {
  usagePagination.current = obj.page;
  usagePagination.size = obj.limit;
  fetchUsageData();
};

// æŸ¥è¯¢
const handleQuery = () => {
  pagination.current = 1;