From 8ae1654dd283f11a5be3bc155064217f3454a3f1 Mon Sep 17 00:00:00 2001
From: lixiangyu <lixiangyu@xalxzn.com>
Date: 星期日, 31 八月 2025 12:36:01 +0800
Subject: [PATCH] feat(cms): 优化刀具库存列表功能
---
src/views/cms/CuttingInventoryList.vue | 374 ++++++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 323 insertions(+), 51 deletions(-)
diff --git a/src/views/cms/CuttingInventoryList.vue b/src/views/cms/CuttingInventoryList.vue
index 7d31077..a21fc71 100644
--- a/src/views/cms/CuttingInventoryList.vue
+++ b/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">
@@ -108,8 +108,23 @@
</a-menu>
</a-dropdown>
</span>
-
</a-table>
+ </div>
+ <!-- 搴撳瓨缁熻琛ㄦ牸 -->
+ <div style="margin-top: 20px;">
+ <a-card title="搴撳瓨缁熻">
+ <a-table
+ :pagination="statisticsPagination"
+ :columns="statisticsColumns"
+ :dataSource="statisticsData"
+ :loading="statisticsLoading"
+ bordered
+ size="middle">
+ <span slot="inventoryStatus" slot-scope="text">
+ <a-tag :color="getTagColor(text)">{{ text }}</a-tag>
+ </span>
+ </a-table>
+ </a-card>
</div>
<cutting-inventory-modal ref="modalForm" @ok="modalFormOk"></cutting-inventory-modal>
@@ -157,7 +172,13 @@
{
title:'搴撳瓨鐘舵��',
align:"center",
- dataIndex: 'inventoryStatus'
+ dataIndex: 'inventoryStatus',
+ filters: [
+ { text: '姝ｅ父', value: '姝ｅ父' },
+ { text: '宸插嚭搴�', value: '宸插嚭搴�' },
+ ],
+ filterMultiple: true, // 璁剧疆涓篺alse琛ㄧず鍗曢�夛紝true琛ㄧず澶氶��
+ scopedSlots: { customRender: 'inventoryStatus' }
},
{
title:'褰撳墠瀵垮懡(鐧惧垎姣�)',
@@ -173,20 +194,80 @@
// scopedSlots: { customRender: 'action' }
// }
],
+ // 缁熻琛ㄦ牸鍒楀畾涔�
+ statisticsColumns: [
+ {
+ title:'鍒�鍏风紪鐮�',
+ align:"center",
+ dataIndex: 'cuttingCode',
+ customRender: (text, record, index) => {
+ const obj = {
+ children: text,
+ attrs: {}
+ };
+ // 璁剧疆鍚堝苟閫昏緫
+ if (record.rowSpan !== undefined) {
+ obj.attrs.rowSpan = record.rowSpan;
+ } else {
+ obj.attrs.rowSpan = 1;
+ }
+ return obj;
+ }
+ },
+ {
+ title: '搴撳瓨鐘舵��',
+ dataIndex: 'inventoryStatus',
+ align: "center",
+ },
+ {
+ title: '鏁伴噺',
+ dataIndex: 'cuttingIdNumber',
+ align: "center"
+ }
+ ],
url: {
list: "/cms/cuttingInventory/list",
delete: "/cms/cuttingInventory/delete",
deleteBatch: "/cms/cuttingInventory/deleteBatch",
exportXlsUrl: "/cms/cuttingInventory/exportXls",
importExcelUrl: "cms/cuttingInventory/importExcel",
-
+ statistics: "/cms/cuttingInventory/statistics" // 娣诲姞缁熻鎺ュ彛鍦板潃
},
dictOptions:{},
superFieldList:[],
+ // 缁熻鏁版嵁
+ statisticsData: [],
+ statisticsLoading: false,
+
+ // 涓轰富琛ㄦ牸淇濈暀鍘熸湁鐨勫垎椤甸厤缃�
+ ipagination: {
+ current: 1,
+ pageSize: 10,
+ pageSizeOptions: ['10', '20', '30'],
+ showTotal: (total, range) => {
+ return range[0] + '-' + range[1] + ' 鍏�' + total + '鏉�'
+ },
+ showQuickJumper: true,
+ showSizeChanger: true,
+ total: 0
+ },
+ // 涓虹粺璁¤〃鏍兼坊鍔犲崟鐙殑鍒嗛〉閰嶇疆
+ statisticsPagination: {
+ current: 1,
+ pageSize: 10,
+ pageSizeOptions: ['10', '20', '30'],
+ showTotal: (total, range) => {
+ return range[0] + '-' + range[1] + ' 鍏�' + total + '鏉�'
+ },
+ showQuickJumper: true,
+ showSizeChanger: true,
+ total: 0
+ }
}
},
created() {
- this.getSuperFieldList();
+ this.getSuperFieldList();
+ this.loadStatisticsData();
},
computed: {
importExcelUrl: function(){
@@ -194,15 +275,206 @@
},
},
methods: {
- initDictConfig(){
+ initDictConfig() {
},
- getSuperFieldList(){
- let fieldList=[];
- fieldList.push({type:'string',value:'cuttingId',text:'鍒�鍏稩D'})
- 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: '鍒�鍏稩D' })
+ fieldList.push({ type: 'string', value: 'cuttingBarcode', text: '鍒�鍏锋潯鐮�' })
+ fieldList.push({ type: 'string', value: 'inventoryStatus', text: '搴撳瓨鐘舵��' })
+ fieldList.push({ type: 'number', value: 'currentLife', text: '褰撳墠瀵垮懡(鐧惧垎姣�)' })
this.superFieldList = fieldList
+ },
+ // 鍔犺浇缁熻淇℃伅
+ loadStatisticsData() {
+ this.statisticsLoading = true;
+ // 璋冪敤鍚庣鎺ュ彛鑾峰彇缁熻鏁版嵁
+ this.$http({
+ url: this.url.statistics,
+ method: "get",
+ params: {
+ ...this.getQueryParams(),
+ pageNo: this.statisticsPagination.current,
+ pageSize: this.statisticsPagination.pageSize
+ }
+ }).then((res) => {
+ if (res.success) {
+ // 鏇存柊缁熻琛ㄦ牸鐨勫垎椤垫�绘暟
+ this.statisticsPagination.total = res.result.total;
+ // 瀵规暟鎹繘琛屽悎骞跺鐞嗭紝浣跨敤 res.result.records 鑰屼笉鏄� res.result
+ this.statisticsData = this.mergeStatisticsData(res.result.records);
+ }
+ this.statisticsLoading = false;
+ }).catch(() => {
+ this.statisticsLoading = false;
+ });
+ },
+
+ // 鏍规嵁鐘舵�佽繑鍥炴爣绛鹃鑹�
+ getTagColor(status) {
+ const colorMap = {
+ '姝ｅ父': 'green',
+ '宸插嚭搴�': 'orange',
+ };
+ return colorMap[status];
+ },
+
+ // 閲嶅啓鎼滅储鏂规硶锛屽湪鎼滅储瀹屾垚鍚庡姞杞界粺璁′俊鎭�
+ searchQuery() {
+ this.loadData(1);
+ // 鎼滅储瀹屾垚鍚庡姞杞界粺璁′俊鎭�
+ this.$nextTick(() => {
+ this.loadStatisticsData();
+ });
+ },
+
+ // 閲嶅啓閲嶇疆鏂规硶
+ searchReset() {
+ this.queryParam = {};
+ this.loadData(1);
+ this.$nextTick(() => {
+ this.loadStatisticsData();
+ });
+ },
+
+ 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(); // 杩欎釜鏂规硶搴旇鍖呭惈 queryParam 涓殑鎵�鏈夊弬鏁�
+
+ this.loading = true;
+ this.$http({
+ url: this.url.list,
+ method: "get",
+ params: params
+ }).then((res) => {
+ 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 => {
+ const key = item.cuttingCode;
+ if (!grouped[key]) {
+ grouped[key] = {
+ cuttingCode: item.cuttingCode,
+ cuttingId: item.cuttingId,
+ statuses: []
+ };
+ }
+ // 浣跨敤 item.inventoryStatus 鍜� item.cuttingIdNumber
+ grouped[key].statuses.push({
+ 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;
+ });
+
+ // 杞崲涓鸿〃鏍奸渶瑕佺殑鏍煎紡锛屽苟娣诲姞琛屽悎骞朵俊鎭�
+ const result = [];
+ Object.values(grouped).forEach(group => {
+ const statuses = group.statuses;
+ const totalCount = statuses.reduce((sum, s) => sum + s.count, 0);
+
+ // 绗竴琛屾樉绀哄垁鍏风紪鐮侊紝璁剧疆rowSpan
+ result.push({
+ cuttingCode: group.cuttingCode,
+ cuttingId: group.cuttingId,
+ inventoryStatus: `${statuses[0].status}:${statuses[0].count}`,
+ cuttingIdNumber: totalCount,
+ rowSpan: statuses.length // 鍚堝苟鐨勮鏁�
+ });
+
+ // 鍓╀綑琛屽彧鏄剧ず鐘舵�佷俊鎭紝鍒�鍏风紪鐮佸垪rowSpan涓�0
+ for (let i = 1; i < statuses.length; i++) {
+ result.push({
+ cuttingCode: '', // 淇敼杩欓噷锛屽皢閲嶅鐨刢uttingCode璁句负绌哄瓧绗︿覆
+ cuttingId: group.cuttingId,
+ inventoryStatus: `${statuses[i].status}:${statuses[i].count}`,
+ cuttingIdNumber: totalCount,
+ rowSpan: 0 // 琛ㄧず琚悎骞�
+ });
+ }
+ });
+
+ // 娣诲姞鎬昏琛�
+ if (result.length > 0) {
+ result.push({
+ cuttingCode: '鎬昏',
+ cuttingId: '',
+ inventoryStatus: `姝ｅ父:${totalStats.normal}`,
+ cuttingIdNumber: totalStats.total,
+ rowSpan: 1
+ });
+
+ result.push({
+ cuttingCode: '', // 淇敼杩欓噷锛屽皢閲嶅鐨刢uttingCode璁句负绌哄瓧绗︿覆
+ cuttingId: '',
+ inventoryStatus: `宸插嚭搴�:${totalStats.outbound}`,
+ cuttingIdNumber: '',
+ rowSpan: 1
+ });
+ }
+
+ return result;
}
}
}
--
Gitblit v1.9.3