From 50b1b07bfa382c3f19c6b23f1cff4dfa50294f07 Mon Sep 17 00:00:00 2001
From: 石广澎 <shiguangpeng@163.com>
Date: 星期四, 30 十一月 2023 10:58:38 +0800
Subject: [PATCH] feat: 库存管理 增加加载状态

---
 admin-web/src/views/stock/accessStock/outbound/edit.vue |  128 +++++++++++++++++++++++-------------------
 1 files changed, 71 insertions(+), 57 deletions(-)

diff --git a/admin-web/src/views/stock/accessStock/outbound/edit.vue b/admin-web/src/views/stock/accessStock/outbound/edit.vue
index 064fcf2..e7d1cd4 100644
--- a/admin-web/src/views/stock/accessStock/outbound/edit.vue
+++ b/admin-web/src/views/stock/accessStock/outbound/edit.vue
@@ -1,12 +1,17 @@
 <template>
-  <win-md class="stock-edit" :title="`${setting.title}鍑哄簱鍑哄簱`" @close="close" :width="'800px'">
-    <el-form class="form" ref="ruleForm" :model="formData" :rules="rules" label-width="120px">
+  <win-md class="stock-edit" :title="`${setting.title}鍑哄簱`" @close="close" :width="'800px'">
+    <el-form v-loading="loading" class="form" ref="ruleForm" :model="formData" :rules="rules" label-width="120px">
       <div class="main-w">
         <el-row :gutter="24" class="headerHeight">
           <el-col :span="12">
             <el-form-item label="鍑哄簱浠撳簱" prop="warehouseId">
               <el-select v-model="formData.warehouseId" placeholder="璇烽�夋嫨" style="width: 100%">
-                <el-option v-for="item in warehouseOptions" :key="item.id" :label="item.warehouseName" :value="item.id" />
+                <el-option
+                  v-for="item in warehouseOptions"
+                  :key="item.id"
+                  :label="item.warehouseName"
+                  :value="item.id"
+                />
               </el-select>
             </el-form-item>
           </el-col>
@@ -118,7 +123,7 @@
               </template>
             </el-table-column>
             <el-table-column prop="price" label="鐜版湁搴撳瓨" align="center">
-              <template slot-scope="scope">{{  }}
+              <template slot-scope="scope">
                 {{ scope.row.worehouseCount }}
               </template>
             </el-table-column>
@@ -130,11 +135,11 @@
                   :prop="`goods[${goodsIndex}].models[${scope.$index}].counts`"
                   :rules="rules.counts"
                 >
-                <el-input
-                  type="number"
-                  v-model="scope.row.counts"
-                  @change="countsChange($event, goodsIndex,scope.$index)"
-                ></el-input>
+                  <el-input
+                    type="number"
+                    v-model="scope.row.counts"
+                    @change="countsChange($event, goodsIndex, scope.$index)"
+                  ></el-input>
                 </el-form-item>
               </template>
             </el-table-column>
@@ -164,26 +169,19 @@
     </el-form>
     <div slot="footer" align="center" class="dialog-footer">
       <my-button name="鍙栨秷" site="form" @click="close" />
-      <my-button name="淇濆瓨" site="form" @click="handleSubmit" />
+      <el-button name="淇濆瓨" type="primary" size="medium" :loading="btnloading" @click="handleSubmit">淇濆瓨</el-button>
     </div>
   </win-md>
 </template>
 <script>
-import {
-  goodsTemplate,
-  goodsModel,
-  selectTenantWarehouse,
-} from '@/api/baseSetting/finsystenant';
-import {
-  outputAdd,
-  outputSelectNumber
-} from '@/api/stock/accessStock';
-import { getTree } from '@/api/foudation/classification';
+import {goodsModel, goodsTemplate, selectTenantWarehouse, warehouseSelectNumber,} from '@/api/baseSetting/finsystenant';
+import {outputAdd} from '@/api/stock/accessStock';
+import {getTree} from '@/api/foudation/classification';
 import MyButton from '@/components/myButton/myButton';
 import winMd from '@/components/win/win-md';
 import upload from '@/components/upload/index';
-import { getUploadUrl } from '@/utils/base';
-import {mapGetters} from 'vuex'
+import {getUploadUrl} from '@/utils/base';
+import {mapGetters} from 'vuex';
 
 export default {
   components: { MyButton, winMd, upload },
@@ -201,13 +199,14 @@
         return callback(new Error('璇烽�夋嫨'));
       }
       let temp = this.formData.goods.filter((v) => v.baseGoodsTemplateId == value);
-      if (!temp || temp.length!=1) {
+      if (!temp || temp.length != 1) {
         return callback(new Error('宸查�夎繃姝ょ墿鍝�'));
       }
       callback();
     };
     return {
-      loading: false,
+      loading: true,
+      btnloading: false,
       warehouseOptions: [], // 鍑哄簱浠撳簱鍒楄〃
       categoryOptions: [], // 鐗╁搧鍒嗙被鍒楄〃
       modelList: [], //鍨嬪彿鍒楄〃
@@ -257,28 +256,29 @@
       },
     };
   },
-  computed:{
-    ...mapGetters(['userInfo'])
+  computed: {
+    ...mapGetters(['userInfo']),
   },
   created() {
     this.init();
   },
   methods: {
     async init() {
-      this.getWarehouseList();
-      this.getgoodsTemplate();
-      this.getgoodsModel();
+      await this.getWarehouseList();
+      await this.getgoodsTemplate();
+      await this.getgoodsModel();
       // 鑾峰彇鐗╁搧鍒嗙被鍒楄〃
       const treeRes = await getTree();
       this.categoryOptions = this.removeEmptyChildren(treeRes);
+      this.loading = false
     },
 
     // 鑾峰彇鍑哄簱浠撳簱鍒楄〃
-    getWarehouseList() {
-      selectTenantWarehouse({agencyId:this.userInfo.tenantId})
+    async getWarehouseList() {
+      await selectTenantWarehouse({ agencyId: this.userInfo.tenantId })
         .then((res) => {
-          this.warehouseOptions = res
-          if(res.length) {
+          this.warehouseOptions = res;
+          if (res.length) {
             this.formData.goods.push(JSON.parse(JSON.stringify(this.goodsItem)));
           }
           if (this.warehouseOptions.length && !this.formData.warehouseId) {
@@ -303,8 +303,8 @@
     },
 
     // 鑾峰彇鐗╁搧鍚嶇О鍒楄〃
-    getgoodsTemplate(id, index) {
-      goodsTemplate({ categoryId: id || '' }).then((res) => {
+    async getgoodsTemplate(id, index) {
+      await goodsTemplate({ categoryId: id || '' }).then((res) => {
         if (index || index == 0) {
           this.$set(this.formData.goods[index], 'goodsOptions', res);
         } else {
@@ -314,8 +314,8 @@
     },
 
     // 瑙勬牸鍨嬪彿
-    getgoodsModel(id, index) {
-      goodsModel({ goodsTemplatesId: id || '' }).then((res) => {
+    async getgoodsModel(id, index) {
+      await goodsModel({ goodsTemplatesId: id || '' }).then((res) => {
         if (index || index == 0) {
           this.$set(this.formData.goods[index], 'modelsOptions', res);
         } else {
@@ -371,12 +371,18 @@
     async modelChange(e, index) {
       let arr = [...this.formData.goods[index].models];
       let str = JSON.stringify(arr);
-      for(let item of e) {
+      for (let item of e) {
         if (str.indexOf(item) == -1) {
           let temp = this.goodsModelAll.find((v) => v.id == item);
           // 鑾峰彇搴撳瓨
-          let num = await outputSelectNumber({warehouseId:this.formData.warehouseId,baseGoodsModelsId:item})
-          arr.push({ ...this.modelsItem, baseGoodsModelsId: item, unit: temp.unit,worehouseCount: num});
+          let num = await warehouseSelectNumber({
+            warehouseId: this.formData.warehouseId,
+            baseGoodsModelsId: item,
+            warehouseType: 0,
+            states: 1,
+            buyType: null,
+          });
+          arr.push({ ...this.modelsItem, baseGoodsModelsId: item, unit: temp.unit, worehouseCount: num });
         }
       }
       this.formData.goods[index].models = arr;
@@ -391,8 +397,8 @@
 
     // 涓婁紶
     uploadChange() {
-      let arr = this.$refs.uploadRef.fileList
-      this.formData.procureDoc = JSON.stringify(arr)
+      let arr = this.$refs.uploadRef.fileList;
+      this.formData.procureDoc = JSON.stringify(arr);
     },
 
     // 鐐瑰嚮鏂板鐗╁搧
@@ -406,16 +412,16 @@
     },
 
     // 鍑哄簱鏁伴噺鏍¢獙
-    countsChange(e, goodsIndex,index) {
-      const curItem = this.formData.goods[goodsIndex].models[index]
-      const worehouseCount = curItem.worehouseCount
+    countsChange(e, goodsIndex, index) {
+      const curItem = this.formData.goods[goodsIndex].models[index];
+      const worehouseCount = curItem.worehouseCount;
       if (e == 0) {
         this.$message.warning('鏁伴涓嶈兘涓�0');
-        curItem.counts = null
+        curItem.counts = null;
       }
       if (e > worehouseCount) {
         this.$message.warning('鏁伴瓒呰繃鐜版湁搴撳瓨');
-        curItem.counts = worehouseCount > 0 ? worehouseCount : null
+        curItem.counts = worehouseCount > 0 ? worehouseCount : null;
       }
     },
 
@@ -423,19 +429,27 @@
     handleSubmit() {
       this.$refs['ruleForm'].validate((valid) => {
         if (valid) {
+          if (this.loading) return
+          this.loading = true;
+          this.btnloading = true;
           console.log('this.formData', this.formData);
-            outputAdd(this.formData)
-              .then((res) => {
-                this.$message.success('淇濆瓨鎴愬姛锛�');
-                this.close();
-                this.$emit('search');
-              })
-              .catch((err) => {
-                console.log('edit err', err);
-                this.$message.error('淇濆瓨澶辫触');
-              });
+          outputAdd(this.formData)
+            .then((res) => {
+              this.$message.success('淇濆瓨鎴愬姛锛�');
+              this.btnloading = false;
+              this.loading = false;
+              this.close();
+              this.$emit('search');
+            })
+            .catch((err) => {
+              console.log('edit err', err);
+              this.btnloading = false;
+              this.loading = false;
+              this.$message.error('淇濆瓨澶辫触');
+            });
         } else {
           this.$message.error('鏍¢獙鏈�氳繃锛岃妫�鏌ャ��');
+          this.btnloading = false;
         }
       });
     },

--
Gitblit v1.9.1