feat(仓库管理): 增加明细下载功能并优化表单交互

src/views/warehouseManagement/statisticalReports/transceiverDetails/add.vue

@@ -9,6 +9,7 @@
       <!-- 数据表格 -->
       <div>
         <el-form
+          ref="formRef"
           label-position="left"
           class="ele-form-search"
           :model="formData"
@@ -68,6 +69,7 @@
                   placeholder="请选择"
                   v-model="formData.type"
                   clearable
+                  :disabled="isView"
                   @change="handleOutInChange"
                 >
                   <el-option
@@ -85,6 +87,7 @@
                   filterable
                   placeholder="请选择"
                   v-model="formData.bizType"
+                  :disabled="isView"
                   clearable
                 >
                   <el-option
@@ -102,6 +105,7 @@
                   filterable
                   placeholder="请选择"
                   v-model="formData.categoryLevelId"
+                  :disabled="isView"
                   clearable
                 >
                   <el-option
@@ -233,7 +237,7 @@
           status: 2,
           keyWord: '',
           bizType: '',
-          assetType: '',
+          categoryLevelId: '',
           type: ''
         },
         // 表单验证规则
@@ -374,153 +378,153 @@
           // }
         ];
 
-        if (!this.isView) {
+        // if (!this.isView) {
           return arr.filter((item) => item != '');
-        }
+        // }
 
-        if (this.isView) {
-          return [
-            {
-              type: 'index',
-              label: '序号',
-              width: 50,
-              align: 'center'
-            },
-            {
-              prop: 'categoryCode',
-              label: '物品编码',
-              align: 'center',
-              showOverflowTooltip: true,
-              width: 150
-            },
-            {
-              prop: 'categoryName',
-              label: '物品名称',
-              align: 'center',
-              showOverflowTooltip: true,
-              width: 150
-            },
-            {
-              prop: 'categoryLevelPath',
-              label: '物品类型',
-              align: 'center',
-              showOverflowTooltip: true,
-              width: 150
-            },
-            {
-              prop: 'specification',
-              label: '规格',
-              align: 'center',
-              showOverflowTooltip: true,
-              width: 150
-            },
-            {
-              width: 160,
-              prop: 'inStorageTime',
-              label: '出入库时间',
-              align: 'center',
-              showOverflowTooltip: true
-            },
+        // if (this.isView) {
+        //   return [
+        //     {
+        //       type: 'index',
+        //       label: '序号',
+        //       width: 50,
+        //       align: 'center'
+        //     },
+        //     {
+        //       prop: 'categoryCode',
+        //       label: '物品编码',
+        //       align: 'center',
+        //       showOverflowTooltip: true,
+        //       width: 150
+        //     },
+        //     {
+        //       prop: 'categoryName',
+        //       label: '物品名称',
+        //       align: 'center',
+        //       showOverflowTooltip: true,
+        //       width: 150
+        //     },
+        //     {
+        //       prop: 'categoryLevelPath',
+        //       label: '物品类型',
+        //       align: 'center',
+        //       showOverflowTooltip: true,
+        //       width: 150
+        //     },
+        //     {
+        //       prop: 'specification',
+        //       label: '规格',
+        //       align: 'center',
+        //       showOverflowTooltip: true,
+        //       width: 150
+        //     },
+        //     {
+        //       width: 160,
+        //       prop: 'inStorageTime',
+        //       label: '出入库时间',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
 
-            {
-              prop: 'bizNo',
-              label: '单号',
-              align: 'center',
-              slot: 'bizNo',
-              showOverflowTooltip: true,
-              width: 150
-            },
-            {
-              prop: 'inBizType',
-              slot: 'inBizType',
-              label: '出入库类型',
-              align: 'center',
-              showOverflowTooltip: true,
-              width: 150,
-              formatter: (row) => {
-                return (
-                  sceneState.find((item) => item.code == row.inBizType).label ??
-                  ''
-                );
-              }
-            },
+        //     {
+        //       prop: 'bizNo',
+        //       label: '单号',
+        //       align: 'center',
+        //       slot: 'bizNo',
+        //       showOverflowTooltip: true,
+        //       width: 150
+        //     },
+        //     {
+        //       prop: 'inBizType',
+        //       slot: 'inBizType',
+        //       label: '出入库类型',
+        //       align: 'center',
+        //       showOverflowTooltip: true,
+        //       width: 150,
+        //       formatter: (row) => {
+        //         return (
+        //           sceneState.find((item) => item.code == row.inBizType).label ??
+        //           ''
+        //         );
+        //       }
+        //     },
 
-            {
-              prop: 'supplierName',
-              label: '往来单位',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'warehouseName',
-              label: '仓库名称',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'remark',
-              label: '备注',
-              align: 'center',
-              showOverflowTooltip: true
-            },
+        //     {
+        //       prop: 'supplierName',
+        //       label: '往来单位',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'warehouseName',
+        //       label: '仓库名称',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'remark',
+        //       label: '备注',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
 
-            {
-              prop: 'inQuantity',
-              label: '入库数量',
-              align: 'center',
-              showOverflowTooltip: true
-            },
+        //     {
+        //       prop: 'inQuantity',
+        //       label: '入库数量',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
 
-            {
-              prop: 'inUnitPrice',
-              label: '入库单价',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'inPrice',
-              label: '入库成本小计',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'outQuantity',
-              label: '出库数量',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'outUnitPrice',
-              label: '出库单价',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'outPrice',
-              label: '出库成本小计',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'totalQuantity',
-              label: '结存数量',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'totalUnitPrice',
-              label: '结存单位成本',
-              align: 'center',
-              showOverflowTooltip: true
-            },
-            {
-              prop: 'totalPrice',
-              label: '结存成本',
-              align: 'center',
-              showOverflowTooltip: true
-            }
-          ];
-        }
+        //     {
+        //       prop: 'inUnitPrice',
+        //       label: '入库单价',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'inPrice',
+        //       label: '入库成本小计',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'outQuantity',
+        //       label: '出库数量',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'outUnitPrice',
+        //       label: '出库单价',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'outPrice',
+        //       label: '出库成本小计',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'totalQuantity',
+        //       label: '结存数量',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'totalUnitPrice',
+        //       label: '结存单位成本',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     },
+        //     {
+        //       prop: 'totalPrice',
+        //       label: '结存成本',
+        //       align: 'center',
+        //       showOverflowTooltip: true
+        //     }
+        //   ];
+        // }
       },
       clientEnvironmentId() {
         return this.$store.state.user.info.clientEnvironmentId;
@@ -642,9 +646,13 @@
       },
 
       async open(isView, row) {
-        console.log(row);
+        console.log('open', row, this.$refs.formRef);
+        if(this.$refs.formRef) {
+          this.$refs.formRef.resetFields()
+        }
+      
         if (isView) {
-          await this.getList(row);
+          // await this.getList(row);
 
           // this.tableList = row.info.map((item) => {
           //   return {
@@ -652,7 +660,7 @@
           //     startTime: this.getDate(new Date(Number(item.startTime)))
           //   };
           // });
-          console.log(this.tableList);
+          // console.log(this.tableList);
 
           this.formData.code = row.code;
           this.formData.name = row.name;
@@ -660,6 +668,9 @@
           this.formData.time =
             row.startTime && row.endTime ? [row.startTime, row.endTime] : [];
           this.formData.keyWord = row.keyWord;
+          this.formData.type = row.isType;
+          this.formData.bizType = row.bizType;
+          this.formData.categoryLevelId = row.categoryLevelId;
         } else {
           this.tableList = [];
           this.formData = {
@@ -667,7 +678,10 @@
             name: '',
             status: 2,
             time: [],
-            keyWord: ''
+            keyWord: '',
+            type: '',
+            bizType: '',
+            categoryLevelId: ''
           };
         }
         this.isView = isView;
@@ -678,9 +692,9 @@
       },
       /* 表格数据源 */
       async datasource({ page, limit, where, order }) {
-        if (this.isView) {
-          return this.tableList;
-        } else {
+        // if (this.isView) {
+        //   return this.tableList;
+        // } else {
           const params = Object.assign({}, this.formData);
           if (params.time?.length) {
             params.startTime = params.time[0];
@@ -697,7 +711,7 @@
           console.log(data);
           this.tableList = data;
           return data;
-        }
+        // }
       },
       search() {
         this.$refs.table.reload();
@@ -705,6 +719,10 @@
       reset() {
         this.formData.time = [];
         this.formData.keyWord = '';
+        this.formData.type = '';
+        this.formData.bizType = '';
+        this.formData.categoryLevelId = '';
+        this.$refs.formRef.resetFields()
         this.search();
       }
     }

src/views/warehouseManagement/statisticalReports/transceiverDetails/index.vue

@@ -77,9 +77,17 @@
             type="primary"
             :underline="false"
             icon="el-icon-download"
-            @click="downLoad(row)"
+            @click="downLoad(row, 'statistics')"
           >
-            下载
+            统计下载
+          </el-link>
+          <el-link
+            type="primary"
+            :underline="false"
+            icon="el-icon-download"
+            @click="downLoad(row, 'detail')"
+          >
+            明细下载
           </el-link>
         </template>
       </ele-pro-table>
@@ -93,6 +101,7 @@
   import ItemSearch from './components/item-search.vue';
   import {
     getStatementLogPage,
+    sendReceiveDetailListExcel,
     sendReceiveExcel
   } from '@/api/warehouseManagement/statisticalReports';
 
@@ -152,7 +161,7 @@
       };
     },
     methods: {
-      downLoad(row) {
+      downLoadOld(row) {
         sendReceiveExcel({
           code: row.code,
           name: row.name,
@@ -179,6 +188,48 @@
           }
         });
       },
+      downLoad(row,type) {
+        this.loading = true;
+        
+        const params = {
+          code: row.code,
+          name: row.name,
+          startTime: row.startTime,
+          endTime: row.endTime,
+          exportStatus: 1,
+          type: row.isType,
+          bizType: row.bizType,
+          categoryLevelId: row.categoryLevelId,
+          status: 2,
+        };
+        if (params.time?.length) {
+          params.startTime = params.time[0];
+          params.endTime = params.time[1];
+        }
+        delete params.time;
+        const requestApi = type == 'statistics' ? sendReceiveExcel : sendReceiveDetailListExcel;
+        requestApi(params).then((data) => {
+          try {
+            let objectUrl1 = window.URL.createObjectURL(new Blob([data]));
+            let elink = document.createElement('a');
+            elink.setAttribute(
+              'download',
+              decodeURI(decodeURI('收发明细表.xlsx'))
+            );
+            elink.style.display = 'none';
+            elink.href = objectUrl1;
+            document.body.appendChild(elink);
+            elink.click();
+            document.body.removeChild(elink);
+            window.URL.revokeObjectURL(elink.href);
+            this.loading = false;
+            this.visible = false;
+            this.$emit('reload');
+          } catch (err) {
+            this.$message.error('导出失败,请联系管理员!');
+          }
+        });
+      },
       add(isView, row) {
         console.log('isView--', isView);
         console.log('row-----', row);