feat(cms): 优化刀具库存列表功能

lixiangyu

昨天 8ae1654dd283f11a5be3bc155064217f3454a3f1

 src/views/cms/CuttingInventoryList.vue

@@ -2,41 +2,41 @@
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :md="6" :sm="8">
            <a-form-item label="刀具编码">
              <a-input placeholder="请输入刀具编码" v-model="queryParam.cuttingId" />
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
              <a-form-item label="刀具条码">
                <a-input placeholder="请输入刀具条码" v-model="queryParam.cuttingBarcode" />
              </a-form-item>
            </a-col>
            <a-col
            :md="6"
            :sm="8"
          >
            <span
              style="float: left;overflow: hidden;"
              class="table-page-search-submitButtons"
            >
              <a-button
                type="primary"
                @click="searchQuery"
                icon="search"
              >查询</a-button>
              <a-button
                type="primary"
                @click="searchReset"
                icon="reload"
                style="margin-left: 8px"
              >重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
<!--      <a-form layout="inline" @keyup.enter.native="searchQuery">-->
<!--        <a-row :gutter="24">-->
<!--          <a-col :md="6" :sm="8">-->
<!--            <a-form-item label="刀具编码">-->
<!--              <a-input placeholder="请输入刀具编码" v-model="queryParam.cuttingId" />-->
<!--            </a-form-item>-->
<!--          </a-col>-->
<!--          <a-col :md="6" :sm="8">-->
<!--              <a-form-item label="刀具条码">-->
<!--                <a-input placeholder="请输入刀具条码" v-model="queryParam.cuttingBarcode" />-->
<!--              </a-form-item>-->
<!--            </a-col>-->
<!--            <a-col-->
<!--            :md="6"-->
<!--            :sm="8"-->
<!--          >-->
<!--            <span-->
<!--              style="float: left;overflow: hidden;"-->
<!--              class="table-page-search-submitButtons"-->
<!--            >-->
<!--              <a-button-->
<!--                type="primary"-->
<!--                @click="searchQuery"-->
<!--                icon="search"-->
<!--              >查询</a-button>-->
<!--              <a-button-->
<!--                type="primary"-->
<!--                @click="searchReset"-->
<!--                icon="reload"-->
<!--                style="margin-left: 8px"-->
<!--              >重置</a-button>-->
<!--            </span>-->
<!--          </a-col>-->
<!--        </a-row>-->
<!--      </a-form>-->
    </div>
    <!-- 查询区域-END -->

@@ -51,11 +51,12 @@

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>
<!--      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
<!--        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项-->
<!--        <a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
<!--      </div>-->

      <!--        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"-->
      <a-table
        ref="table"
        size="middle"
@@ -66,7 +67,6 @@
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        class="j-table-force-nowrap"
        @change="handleTableChange">

@@ -115,7 +115,7 @@
      <a-card title="库存统计">
        <a-table
          :pagination="statisticsPagination"
          :columns="statisticsColumns"/>in
          :columns="statisticsColumns"
          :dataSource="statisticsData"
          :loading="statisticsLoading"
          bordered
@@ -123,7 +123,7 @@
          <span slot="inventoryStatus" slot-scope="text">
            <a-tag :color="getTagColor(text)">{{ text }}</a-tag>
          </span>
        />
        </a-table>
      </a-card>
    </div>

@@ -172,7 +172,13 @@
          {
            title:'库存状态',
            align:"center",
            dataIndex: 'inventoryStatus'
            dataIndex: 'inventoryStatus',
            filters: [
              { text: '正常', value: '正常' },
              { text: '已出库', value: '已出库' },
            ],
            filterMultiple: true, // 设置为false表示单选，true表示多选
            scopedSlots: { customRender: 'inventoryStatus' }
          },
          {
            title:'当前寿命(百分比)',
@@ -269,14 +275,25 @@
      },
    },
    methods: {
      initDictConfig(){
      initDictConfig() {
      },
      getSuperFieldList(){
        let fieldList=[];
        fieldList.push({type:'string',value:'cuttingId',text:'刀具ID'})
        fieldList.push({type:'string',value:'cuttingBarcode',text:'刀具条码'})
        fieldList.push({type:'string',value:'inventoryStatus',text:'库存状态'})
        fieldList.push({type:'number',value:'currentLife',text:'当前寿命(百分比)'})
      getCuttingInventory(cuttingId) {
        this.queryParam.cuttingId = cuttingId;
        // 重置分页到第一页
        this.ipagination.current = 1;
        // 加载数据
        this.loadData();

        this.statisticsPagination.current = 1;
        // 同时加载统计信息
        this.loadStatisticsData();
      },
      getSuperFieldList() {
        let fieldList = [];
        fieldList.push({ type: 'string', value: 'cuttingId', text: '刀具ID' })
        fieldList.push({ type: 'string', value: 'cuttingBarcode', text: '刀具条码' })
        fieldList.push({ type: 'string', value: 'inventoryStatus', text: '库存状态' })
        fieldList.push({ type: 'number', value: 'currentLife', text: '当前寿命(百分比)' })
        this.superFieldList = fieldList
      },
      // 加载统计信息
@@ -331,12 +348,31 @@
        });
      },

      handleTableChange(pagination, filters, sorter) {
        // 处理表格变化事件，包括筛选
        this.ipagination = pagination;

        // 处理筛选条件 - 使用OR逻辑
        if (filters.inventoryStatus && filters.inventoryStatus.length > 0) {
          // 如果有筛选条件，将多个状态用逗号连接
          this.queryParam.inventoryStatus = filters.inventoryStatus.join(',');
        } else {
          // 如果没有筛选条件，删除查询参数中的库存状态
          delete this.queryParam.inventoryStatus;
        }

        // 重新加载数据
        this.loadData();
      },

      // 重写加载数据方法
      loadData(arg) {
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        var params = this.getQueryParams();//查询条件
        // 确保查询参数被正确传递
        var params = this.getQueryParams(); // 这个方法应该包含 queryParam 中的所有参数

        this.loading = true;
        this.$http({
          url: this.url.list,
@@ -346,18 +382,26 @@
          if (res.success) {
            this.dataSource = res.result.records;
            this.ipagination.total = res.result.total;

            // 加载统计信息
            this.loadStatisticsData();
          }
          this.loading = false;
        }).catch(() => {
          this.loading = false;
        })
      },

      // 合并统计数据方法
      mergeStatisticsData(data) {
        if (!data || data.length === 0) return [];

        const grouped = {};
        // 初始化总计统计
        const totalStats = {
          normal: 0,
          outbound: 0,
          total: 0
        };

        // 按刀具编码分组
        data.forEach(item => {
@@ -374,6 +418,14 @@
            status: item.inventoryStatus,
            count: item.cuttingIdNumber
          });

          // 累计总计数据
          if (item.inventoryStatus === '正常') {
            totalStats.normal += item.cuttingIdNumber;
          } else if (item.inventoryStatus === '已出库') {
            totalStats.outbound += item.cuttingIdNumber;
          }
          totalStats.total += item.cuttingIdNumber;
        });

        // 转换为表格需要的格式，并添加行合并信息
@@ -394,7 +446,7 @@
          // 剩余行只显示状态信息，刀具编码列rowSpan为0
          for (let i = 1; i < statuses.length; i++) {
            result.push({
              cuttingCode: group.cuttingCode,
              cuttingCode: '', // 修改这里，将重复的cuttingCode设为空字符串
              cuttingId: group.cuttingId,
              inventoryStatus: `${statuses[i].status}:${statuses[i].count}`,
              cuttingIdNumber: totalCount,
@@ -402,9 +454,29 @@
            });
          }
        });

        // 添加总计行
        if (result.length > 0) {
          result.push({
            cuttingCode: '总计',
            cuttingId: '',
            inventoryStatus: `正常:${totalStats.normal}`,
            cuttingIdNumber: totalStats.total,
            rowSpan: 1
          });

          result.push({
            cuttingCode: '', // 修改这里，将重复的cuttingCode设为空字符串
            cuttingId: '',
            inventoryStatus: `已出库:${totalStats.outbound}`,
            cuttingIdNumber: '',
            rowSpan: 1
          });
        }

        return result;
      }
    },
    }
  }
</script>
<style scoped>