天津_意博凯信 1.备件管理-新增独立备件出库功能入口，支持直接完成备件领用出库操作。 2.设备保养-支持按日期分组折叠展示，分组条目可展开查看明细；...

gaoluyang

2026-08-07 73d112ddc9bdfeb7eaaf3b7308cfb4dbeb470c89

 src/views/equipmentManagement/spareParts/index.vue

@@ -105,6 +105,7 @@
              <el-select v-model="usageQuery.sourceType" placeholder="请选择" clearable style="width: 200px">
                <el-option label="维修" :value="0" />
                <el-option label="保养" :value="1" />
                        <el-option label="直接出库" :value="2" />
              </el-select>
            </el-form-item>
            <el-form-item>
@@ -112,6 +113,9 @@
              <el-button @click="resetUsageQuery">重置</el-button>
            </el-form-item>
          </el-form>
               <div>
                  <el-button type="primary" @click="openRequisitionDialog">直接出库</el-button>
               </div>
        </div>
            <div class="table_list">
               <PIMTable
@@ -126,6 +130,60 @@
            </div>
      </el-tab-pane>
    </el-tabs>
		
      <!-- 直接出库弹窗 -->
      <el-dialog title="直接出库" v-model="requisitionDialogVisible" width="500px">
         <el-form :model="requisitionForm" :rules="requisitionRules" ref="requisitionFormRef" label-width="100px">
            <el-form-item label="设备选择" prop="deviceLedgerId">
               <el-select
                  v-model="requisitionForm.deviceLedgerId"
                  placeholder="请选择设备"
                  filterable
                  clearable
                  style="width: 100%"
               >
                  <el-option
                     v-for="item in requisitionDeviceOptions"
                     :key="item.id"
                     :label="item.deviceName"
                     :value="item.id"
                  />
               </el-select>
            </el-form-item>
            <el-form-item label="备件选择" prop="sparePartsId">
               <el-select
                  v-model="requisitionForm.sparePartsId"
                  placeholder="请选择备件"
                  filterable
                  clearable
                  style="width: 100%"
                  @change="onRequisitionSparePartChange"
               >
                  <el-option
                     v-for="item in requisitionSparePartsOptions"
                     :key="item.id"
                     :label="`${item.name}（库存: ${item.quantity}）`"
                     :value="item.id"
                  />
               </el-select>
            </el-form-item>
            <el-form-item label="领用数量" prop="quantity">
               <el-input-number
                  v-model="requisitionForm.quantity"
                  :min="1"
                  :max="selectedSparePartMaxQty"
                  style="width: 100%"
               />
            </el-form-item>
            <el-form-item label="备注" prop="remark">
               <el-input v-model="requisitionForm.remark" placeholder="请输入备注" />
            </el-form-item>
         </el-form>
         <template #footer>
            <el-button type="primary" @click="submitRequisition" :loading="requisitionLoading">确定</el-button>
            <el-button @click="requisitionDialogVisible = false">取消</el-button>
         </template>
      </el-dialog>
  </div>
</template>

@@ -135,7 +193,7 @@
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";
import { getSparePartsUsagePage, outboundSpareParts } from "@/api/equipmentManagement/sparePartsUsage";

// 加载状态
const loading = ref(false);
@@ -391,16 +449,10 @@
  fetchListData();
}

// 分页大小改变
const handleSizeChange = (size) => {
  pagination.size = size;
  pagination.current = 1;
  fetchListData();
}

// 当前页改变
const handleCurrentChange = (current) => {
  pagination.current = current;
// 分页变化
const handleSizeChange = ({ page, limit }) => {
   pagination.current = page;
   pagination.size = limit;
  fetchListData();
}

@@ -517,6 +569,93 @@
  }
};

// 直接出库
const requisitionDialogVisible = ref(false);
const requisitionLoading = ref(false);
const requisitionFormRef = ref(null);
const requisitionDeviceOptions = ref([]);
const requisitionSparePartsOptions = ref([]);
const selectedSparePartMaxQty = ref(1);
const requisitionForm = reactive({
   deviceLedgerId: null,
   sparePartsId: null,
   quantity: 1,
   remark: '',
});
const requisitionRules = {
   sparePartsId: [{ required: true, message: '请选择备件', trigger: 'change' }],
   quantity: [{ required: true, message: '请输入领用数量', trigger: 'blur' }],
};

const loadRequisitionOptions = async () => {
   try {
      const [deviceRes, spareRes] = await Promise.all([
         getDeviceLedger(),
         getSparePartsList({ current: 1, size: 9999 }),
      ]);
      requisitionDeviceOptions.value = deviceRes.data || [];
      requisitionSparePartsOptions.value = spareRes.data?.records || [];
   } catch (e) {
      ElMessage.error('加载选项失败');
   }
};

const openRequisitionDialog = async () => {
   requisitionForm.deviceLedgerId = null;
   requisitionForm.sparePartsId = null;
   requisitionForm.quantity = 1;
   requisitionForm.remark = '';
   selectedSparePartMaxQty.value = 1;
   await loadRequisitionOptions();
   requisitionDialogVisible.value = true;
};

const onRequisitionSparePartChange = (val) => {
   const selected = requisitionSparePartsOptions.value.find(item => item.id === val);
   selectedSparePartMaxQty.value = selected ? selected.quantity : 1;
   if (requisitionForm.quantity > selectedSparePartMaxQty.value) {
      requisitionForm.quantity = selectedSparePartMaxQty.value;
   }
};

const submitRequisition = async () => {
   if (!requisitionFormRef.value) return;
   try {
      await requisitionFormRef.value.validate();
   } catch {
      return;
   }
   if (requisitionForm.quantity <= 0) {
      ElMessage.warning('领用数量必须大于0');
      return;
   }
   const selected = requisitionSparePartsOptions.value.find(item => item.id === requisitionForm.sparePartsId);
   if (selected && requisitionForm.quantity > selected.quantity) {
      ElMessage.warning(`库存不足，当前库存为 ${selected.quantity}`);
      return;
   }
   requisitionLoading.value = true;
   try {
      const res = await outboundSpareParts({
         deviceLedgerId: requisitionForm.deviceLedgerId || undefined,
         sparePartsId: requisitionForm.sparePartsId,
         quantity: requisitionForm.quantity,
         remark: requisitionForm.remark || undefined,
      });
      if (res.code === 200) {
         ElMessage.success('领用成功');
         requisitionDialogVisible.value = false;
         fetchUsageData();
      } else {
         ElMessage.error(res.msg || '领用失败');
      }
   } catch {
      ElMessage.error('领用失败');
   } finally {
      requisitionLoading.value = false;
   }
};

// 组件挂载时获取列表数据
onMounted(() => {
  fetchListData();