Explorar o código

1.导入导出增加loading

yanghe17378 hai 11 meses
pai
achega
f597491c73

+ 11 - 3
src/components/upload/import-dialogNew.vue

@@ -37,7 +37,13 @@
     </el-form>
     </el-form>
     <div slot="footer" class="dialog-footer">
     <div slot="footer" class="dialog-footer">
       <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
       <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
-      <el-button size="small" @click="upload" type="primary">上 传</el-button>
+      <el-button
+        size="small"
+        @click="upload"
+        :loading="uploading"
+        type="primary"
+        >上 传</el-button
+      >
     </div>
     </div>
   </el-dialog>
   </el-dialog>
 </template>
 </template>
@@ -45,7 +51,7 @@
 <script>
 <script>
   import { importBatch } from '@/api/system/file/index.js';
   import { importBatch } from '@/api/system/file/index.js';
   // import { download1 } from '@/utils/file';
   // import { download1 } from '@/utils/file';
-  import {downLoadTemplateNew } from '@/api/system/file/index.js';
+  import { downLoadTemplateNew } from '@/api/system/file/index.js';
   export default {
   export default {
     props: {
     props: {
       // eslint-disable-next-line vue/require-prop-type-constructor
       // eslint-disable-next-line vue/require-prop-type-constructor
@@ -57,6 +63,7 @@
     //注册组件
     //注册组件
     data() {
     data() {
       return {
       return {
+        uploading: false,
         showViewer: false, // 显示查看器
         showViewer: false, // 显示查看器
         dialogVisible: false,
         dialogVisible: false,
         uploadShow: false,
         uploadShow: false,
@@ -96,11 +103,12 @@
           return this.$message.warning('文件不能为空!');
           return this.$message.warning('文件不能为空!');
         }
         }
         this.module = this.$props.defModule;
         this.module = this.$props.defModule;
-
+        this.uploading = true;
         await importBatch({
         await importBatch({
           module: this.module,
           module: this.module,
           multiPartFiles: this.attaments
           multiPartFiles: this.attaments
         });
         });
+        this.uploading = false;
         this.$message.success('操作成功!');
         this.$message.success('操作成功!');
         this.dialogVisible = false;
         this.dialogVisible = false;
         this.$emit('success');
         this.$emit('success');

+ 28 - 3
src/views/material/product/components/index-data.vue

@@ -79,7 +79,8 @@
           type="warning"
           type="warning"
           icon="el-icon-download"
           icon="el-icon-download"
           size="mini"
           size="mini"
-          @click="handleExport"
+          @click="handleExport()"
+          :loading="exportLoading"
           >导出</el-button
           >导出</el-button
         >
         >
         <el-button
         <el-button
@@ -306,6 +307,8 @@
   import DialogMoveTo from './DialogMoveTo.vue';
   import DialogMoveTo from './DialogMoveTo.vue';
   import tabMixins from '@/mixins/tableColumnsMixin';
   import tabMixins from '@/mixins/tableColumnsMixin';
   import { produceTypeList } from '@/enum/dict.js';
   import { produceTypeList } from '@/enum/dict.js';
+  import request from '@/utils/request';
+  import { download } from '@/utils/file';
   const attributeList = [
   const attributeList = [
     {
     {
       label: '总装',
       label: '总装',
@@ -377,6 +380,7 @@
     },
     },
     data() {
     data() {
       return {
       return {
+        exportLoading: false,
         moudleName: 'mainCategory',
         moudleName: 'mainCategory',
 
 
         errorData: [],
         errorData: [],
@@ -844,8 +848,29 @@
       },
       },
       /** 导出按钮操作 */
       /** 导出按钮操作 */
       handleExport() {
       handleExport() {
-        exportFile(this.whereData);
-        console.log(this.whereData, 'whereForm');
+        debugger;
+        const data = this.whereData;
+        if (!data || data === {} || !data.categoryLevelId) {
+          this.$message.warning('请选择物品类别');
+          return;
+        }
+        this.exportLoading = true;
+        request
+          .post('/main/category/export', data, {
+            responseType: 'blob'
+          })
+          .then((res) => {
+            debugger;
+            download(res.data, '产品/物品数据.xlsx');
+          })
+          .catch((e) => {
+            console.error(e);
+          })
+          .finally(() => {
+            this.exportLoading = false;
+          });
+        /*exportFile(this.whereData);
+        console.log(this.whereData, 'whereForm');*/
       },
       },
       /** 下载模板操作 */
       /** 下载模板操作 */
       importTemplate() {
       importTemplate() {