浏览代码

basic: add table loading div

Michael Wang 6 年之前
父节点
当前提交
4138652a6d

+ 5 - 3
src/modules/basic/view/campus.vue

@@ -3,8 +3,8 @@
     <div class="box box-info">
       <div
         class="box-body"
-        v-loading.body="fileLoading"
-        element-loading-text="机构上传中,请稍后..."
+        v-loading.fullscreen="fileLoading"
+        element-loading-text="请稍后..."
       >
         <!-- 表单 -->
         <el-form inline :model="formSearch">
@@ -428,6 +428,7 @@ export default {
     //查询
     searchForm() {
       this.loading = true;
+      this.fileLoading = true;
       var param = new URLSearchParams(this.formSearch);
       var url =
         CORE_API +
@@ -441,7 +442,8 @@ export default {
         this.tableData = response.data.list;
         this.total = response.data.total;
         this.loading = false;
-      });
+      })
+      .finally(() => (this.fileLoading = false));
     },
     //导入
     handleRemove(file, fileList) {

+ 19 - 5
src/modules/basic/view/course.vue

@@ -3,7 +3,8 @@
     <div class="box box-info">
       <div
         v-loading.body="fileLoading"
-        element-loading-text="课程上传中,请稍后..."
+        v-loading.fullscreen="loading"
+        element-loading-text="请稍后..."
       >
         <el-form
           inline
@@ -535,6 +536,7 @@ export default {
       errMessages: [],
       errDialog: false,
       fileLoading: false,
+      loading: false,
       fileList: [],
 
       courseDialog: false,
@@ -770,6 +772,12 @@ export default {
       this.searchForm();
     },
     searchForm() {
+      let searchLock = true;
+      setTimeout(() => {
+        if (searchLock) {
+          this.loading = true;
+        }
+      }, 500);
       var param = new URLSearchParams(this.formSearch);
       var url =
         CORE_API +
@@ -779,10 +787,16 @@ export default {
         this.pageSize +
         "?" +
         param;
-      this.$httpWithMsg.get(url).then(response => {
-        this.tableData = response.data.content;
-        this.total = response.data.totalElements;
-      });
+      this.$httpWithMsg
+        .get(url)
+        .then(response => {
+          this.tableData = response.data.content;
+          this.total = response.data.totalElements;
+        })
+        .finally(() => {
+          searchLock = false;
+          this.loading = false;
+        });
     },
     handleCurrentChange(val) {
       this.currentPage = val;

+ 22 - 7
src/modules/basic/view/school.vue

@@ -1,6 +1,10 @@
 <template>
   <section class="content">
-    <div class="box-body">
+    <div
+      class="box-body"
+      v-loading.fullscreen="loading"
+      element-loading-text="请稍后..."
+    >
       <!-- 表单 -->
       <el-form :inline="true" :model="formSearch">
         <el-form-item label="学校名称">
@@ -438,7 +442,12 @@ export default {
     },
     //查询
     searchForm() {
-      this.loading = true;
+      let searchLock = true;
+      setTimeout(() => {
+        if (searchLock) {
+          this.loading = true;
+        }
+      }, 500);
       var param = new URLSearchParams(this.formSearch);
       var url =
         CORE_API +
@@ -448,11 +457,17 @@ export default {
         this.pageSize +
         "?" +
         param;
-      this.$httpWithMsg.get(url).then(response => {
-        this.tableData = response.data.list;
-        this.total = response.data.total;
-        this.loading = false;
-      });
+      this.$httpWithMsg
+        .get(url)
+        .then(response => {
+          this.tableData = response.data.list;
+          this.total = response.data.total;
+          this.loading = false;
+        })
+        .finally(() => {
+          searchLock = false;
+          this.loading = false;
+        });
     },
     //启用
     enableOrg() {

+ 23 - 6
src/modules/basic/view/specially.vue

@@ -1,6 +1,11 @@
 <template>
   <section class="content">
-    <div class="box-body">
+    <div
+      class="box-body"
+      v-loading.body="fileLoading"
+      v-loading.fullscreen="loading"
+      element-loading-text="请稍后..."
+    >
       <el-form :inline="true" :model="formSearch" ref="primaryForm">
         <el-row>
           <el-form-item label="专业名称">
@@ -590,6 +595,12 @@ export default {
     },
     //查询
     searchForm() {
+      let searchLock = true;
+      setTimeout(() => {
+        if (searchLock) {
+          this.loading = true;
+        }
+      }, 500);
       var param = new URLSearchParams(this.formSearch);
       var url =
         CORE_API +
@@ -599,11 +610,17 @@ export default {
         this.pageSize +
         "?" +
         param;
-      this.$httpWithMsg.get(url).then(response => {
-        console.log("response :", response);
-        this.tableData = response.data.content;
-        this.total = response.data.totalElements;
-      });
+      this.$httpWithMsg
+        .get(url)
+        .then(response => {
+          console.log("response :", response);
+          this.tableData = response.data.content;
+          this.total = response.data.totalElements;
+        })
+        .finally(() => {
+          searchLock = false;
+          this.loading = false;
+        });
     },
     handleCurrentChange(val) {
       this.currentPage = val;

+ 25 - 8
src/modules/basic/view/user.vue

@@ -1,7 +1,11 @@
 <template>
   <section class="content">
     <div class="box box-info">
-      <div class="box-body">
+      <div
+        class="box-body"
+        v-loading.fullscreen="loading"
+        element-loading-text="请稍后..."
+      >
         <!-- 搜索 -->
         <el-form inline :model="searchForm" label-width="70px">
           <el-form-item label="顶级机构">
@@ -467,6 +471,7 @@
 <script>
 import { CORE_API } from "@/constants/constants.js";
 import { mapState } from "vuex";
+import { setTimeout } from "timers";
 
 export default {
   name: "User",
@@ -486,6 +491,7 @@ export default {
       }
     };
     return {
+      loading: false,
       orgLoading4InsertOrUpdate: false,
       isSuperAdmin: false,
       roleList4Search: [],
@@ -695,7 +701,12 @@ export default {
       this.search();
     },
     search() {
-      this.loading = true;
+      let searchLock = true;
+      setTimeout(() => {
+        if (searchLock) {
+          this.loading = true;
+        }
+      }, 500);
       var param = new URLSearchParams(this.searchForm);
       var url =
         CORE_API +
@@ -705,12 +716,18 @@ export default {
         this.pageSize +
         "?" +
         param;
-      this.$httpWithMsg.get(url).then(response => {
-        console.log(response);
-        this.tableData = response.data.list;
-        this.total = response.data.total;
-        this.loading = false;
-      });
+      this.$httpWithMsg
+        .get(url)
+        .then(response => {
+          console.log(response);
+          this.tableData = response.data.list;
+          this.total = response.data.total;
+          this.loading = false;
+        })
+        .finally(() => {
+          searchLock = false;
+          this.loading = false;
+        });
     },
     handleCurrentChange(val) {
       this.currentPage = val;