gaoluyang
2026-05-25 b87f35ad442544fa3892def5c2979357eb76e4d7
src/views/inventoryManagement/receiptManagement/Record.vue
@@ -1,43 +1,87 @@
<template>
  <div>
    <div class="search_form" style="margin-bottom: 10px;">
      <div>
        <span class="search_title ml10">入库日期:</span>
        <el-date-picker v-model="searchForm.timeStr"
                        type="date"
                        placeholder="请选择日期"
                        value-format="YYYY-MM-DD"
                        format="YYYY-MM-DD"
                        clearable
                        @change="handleQuery"/>
        <span class="search_title ml10">产品大类:</span>
        <el-input v-model="searchForm.productName"
                  style="width: 240px"
                  placeholder="请输入"
                  clearable/>
        <span class="search_title ml10">来源:</span>
        <el-select v-model="searchForm.recordType"
                  style="width: 240px"
                  placeholder="请选择"
                  clearable>
          <el-option v-for="item in stockRecordTypeOptions"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value"/>
        </el-select>
        <el-button type="primary"
                   @click="handleQuery"
                   style="margin-left: 10px">搜索
        </el-button>
      </div>
      <div>
        <el-button type="primary" @click="handleBatchApprove">审批</el-button>
        <el-button @click="handleOut">导出</el-button>
        <el-button type="danger"
                   plain
                   @click="handleDelete">删除
        </el-button>
      </div>
      <el-form
          ref="searchFormRef"
          :model="searchForm"
          class="demo-form-inline"
      >
        <el-row :gutter="20">
          <el-col :span="4">
            <el-form-item label="入库日期" prop="timeStr">
              <el-date-picker v-model="searchForm.timeStr"
                              type="date"
                              placeholder="请选择日期"
                              value-format="YYYY-MM-DD"
                              format="YYYY-MM-DD"
                              clearable/>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="产品大类" prop="productName">
              <el-input v-model="searchForm.productName"
                        style="width: 240px"
                        placeholder="请输入"
                        clearable/>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="产品规格" prop="model">
              <el-input v-model="searchForm.model"
                        style="width: 240px"
                        placeholder="请输入"
                        clearable/>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="批号" prop="batchNo">
              <el-input v-model="searchForm.batchNo"
                        style="width: 240px"
                        placeholder="请输入"
                        clearable/>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="来源" prop="recordType">
              <el-select v-model="searchForm.recordType"
                         style="width: 240px"
                         placeholder="请选择"
                         clearable>
                <el-option v-for="item in stockRecordTypeOptions"
                           :key="item.value"
                           :label="item.label"
                           :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <!-- 按钮 -->
          <el-col :span="4">
            <el-form-item>
              <el-button type="primary" @click="getList">
                搜索
              </el-button>
              <el-button @click="resetSearch">
                重置
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="actions">
      <el-button type="primary"
                 :disabled="!canBatchApprove"
                 @click="handleBatchApprove">审批</el-button>
      <el-button :disabled="!canReverseApprove"
                 @click="handleReverseApprove">反审</el-button>
      <el-button @click="handleOut">导出</el-button>
      <el-button type="danger"
                 plain
                 :disabled="!canDelete"
                 @click="handleDelete">删除
      </el-button>
    </div>
    <div class="table_list">
      <el-table :data="tableData"
@@ -50,7 +94,7 @@
                height="calc(100vh - 18.5em)">
        <el-table-column align="center"
                         type="selection"
                         :selectable="isRowSelectableForApprove"
                         :selectable="isRowSelectable"
                         width="55"/>
        <el-table-column align="center"
                         label="序号"
@@ -58,7 +102,7 @@
                         width="60"/>
        <el-table-column label="入库批次"
                         prop="inboundBatches"
                         width="280"
                         width="200"
                         show-overflow-tooltip/>
        <el-table-column label="入库时间"
                         prop="createTime"
@@ -88,6 +132,16 @@
            {{ getRecordType(scope.row.recordType) }}
          </template>
        </el-table-column>
        <el-table-column
            v-if="showSourceOrderNoColumn"
            label="源单号"
            width="150"
            prop="sourceOrderNo"
            show-overflow-tooltip>
          <template #default="scope">
            {{ formatSourceOrderNo(scope.row?.sourceOrderNo) }}
          </template>
        </el-table-column>
        <el-table-column label="审批状态"
                         prop="approvalStatus"
                         show-overflow-tooltip>
@@ -114,6 +168,7 @@
  ref,
  reactive,
  toRefs,
  computed,
  onMounted,
  getCurrentInstance,
} from "vue";
@@ -122,6 +177,7 @@
  getStockInRecordListPage,
  batchDeletePendingStockInRecords,
  batchApproveStockInRecords,
  batchUnapproveStockInRecords,
} from "@/api/inventoryManagement/stockInRecord.js";
import {
  findAllQualifiedStockInRecordTypeOptions, 
@@ -156,17 +212,20 @@
const data = reactive({
  searchForm: {
    productName: "",
    batchNo: "",
    model: "",
    timeStr: "",
    recordType: "",
  },
});
const {searchForm} = toRefs(data);
// 查询列表
/** 搜索按钮操作 */
const handleQuery = () => {
const searchFormRef = ref(null);
const resetSearch = () => {
  searchFormRef.value?.resetFields();
  page.current = 1;
  getList();
};
}
const getRecordType = (recordType) => {
  return stockRecordTypeOptions.value.find(item => item.value === recordType)?.label || ''
@@ -203,8 +262,33 @@
  return status === 0 || status === "0" || status === "pending" || status === "PENDING" || status === null || status === undefined || status === "";
};
const isRowSelectableForApprove = row => {
  return isPendingApproval(row?.approvalStatus);
const isRejectedApproval = status => {
  return status === 2 || status === "2" || status === "rejected" || status === "REJECTED";
};
const isRowSelectable = row => {
  return isPendingApproval(row?.approvalStatus) || isRejectedApproval(row?.approvalStatus);
};
const canBatchApprove = computed(() => {
  return selectedRows.value.length > 0
      && selectedRows.value.every(row => isPendingApproval(row.approvalStatus));
});
const canReverseApprove = computed(() => {
  return selectedRows.value.length > 0
      && selectedRows.value.every(row => isRejectedApproval(row.approvalStatus));
});
const canDelete = computed(() => canBatchApprove.value);
const showSourceOrderNoColumn = computed(() => {
  const topParentProductId = Number(props.topParentProductId);
  return topParentProductId === 276 || topParentProductId === 278;
});
const formatSourceOrderNo = (value) => {
  const text = String(value ?? "").trim();
  return text || "--";
};
const pageProductChange = obj => {
@@ -215,11 +299,7 @@
const getList = () => {
  tableLoading.value = true;
  const params = {...page,  topParentProductId: props.topParentProductId};
  params.timeStr = searchForm.value.timeStr;
  params.productName = searchForm.value.productName;
  params.recordType = searchForm.value.recordType;
  getStockInRecordListPage(params)
  getStockInRecordListPage(Object.assign({}, {...searchForm.value, ...page,  topParentProductId: props.topParentProductId}))
      .then(res => {
        tableData.value = res.data.records;
        total.value = res.data.total || 0;
@@ -245,14 +325,40 @@
// 表格选择数据
const handleSelectionChange = selection => {
  selectedRows.value = selection.filter(item => item.id && isPendingApproval(item.approvalStatus));
  selectedRows.value = selection.filter(item => item.id && isRowSelectable(item));
};
const expandedRowKeys = ref([]);
const handleReverseApprove = () => {
  if (!canReverseApprove.value) {
    proxy.$modal.msgWarning("请选择已驳回的数据");
    return;
  }
  const ids = selectedRows.value.map(item => item.id);
  ElMessageBox.confirm("反审后记录将恢复为待审批状态,是否确认反审?", "反审", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
      .then(() => {
        batchUnapproveStockInRecords({ids})
            .then(() => {
              proxy.$modal.msgSuccess("反审成功");
              getList();
            })
            .catch(() => {
              proxy.$modal.msgError("反审失败");
            });
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
};
const handleBatchApprove = () => {
  if (selectedRows.value.length === 0) {
    proxy.$modal.msgWarning("请选择数据");
  if (!canBatchApprove.value) {
    proxy.$modal.msgWarning("请选择待审批的数据");
    return;
  }
  const ids = selectedRows.value.map(item => item.id);
@@ -306,8 +412,8 @@
// 删除
const handleDelete = () => {
  if (selectedRows.value.length === 0) {
    proxy.$modal.msgWarning("请选择数据");
  if (!canDelete.value) {
    proxy.$modal.msgWarning("请选择待审批的数据");
    return;
  }
  const ids = selectedRows.value.map(item => item.id);
@@ -346,7 +452,10 @@
);
</script>
<style scoped lang="scss"></style>
<style scoped lang="scss">
.actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
}
</style>