From 5904ee15716ef1587152a84bd3e4f64f598bf9e7 Mon Sep 17 00:00:00 2001
From: CGD <3030332422@qq.com>
Date: Mon, 21 Apr 2025 10:02:50 +0800
Subject: [PATCH 1/2] =?UTF-8?q?update:=E6=B7=BB=E5=8A=A0=E2=80=9C=E6=A8=A1?=
 =?UTF-8?q?=E5=9E=8B=E9=85=8D=E7=BD=AE=E2=80=9D=E3=80=81=E2=80=9C=E7=94=A8?=
 =?UTF-8?q?=E6=88=B7=E7=AE=A1=E7=90=86=E2=80=9D=E3=80=81=E2=80=9C=E5=8F=82?=
 =?UTF-8?q?=E6=95=B0=E7=AE=A1=E7=90=86=E2=80=9D=E9=A1=B5=E9=9D=A2=E2=80=9C?=
 =?UTF-8?q?=E8=8E=B7=E5=8F=96=E5=88=97=E8=A1=A8=E2=80=9D=E6=97=B6=E7=9A=84?=
 =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 main/manager-web/src/views/ModelConfig.vue    | 38 ++++++++-
 .../src/views/ParamsManagement.vue            | 77 +++++++++++++------
 main/manager-web/src/views/UserManagement.vue | 62 ++++++++++-----
 3 files changed, 132 insertions(+), 45 deletions(-)

diff --git a/main/manager-web/src/views/ModelConfig.vue b/main/manager-web/src/views/ModelConfig.vue
index dbcd2b1f..7c158001 100644
--- a/main/manager-web/src/views/ModelConfig.vue
+++ b/main/manager-web/src/views/ModelConfig.vue
@@ -44,9 +44,19 @@
         <!-- 右侧内容 -->
         <div class="content-area">
           <el-card class="model-card" shadow="never">
-            <el-table ref="modelTable" style="width: 100%" :header-cell-style="{ background: 'transparent' }"
-              :data="modelList" class="data-table" header-row-class-name="table-header"
-              :header-cell-class-name="headerCellClassName" @selection-change="handleSelectionChange">
+              <el-table
+                ref="modelTable"
+                style="width: 100%"
+                v-loading="loading"
+                element-loading-text="拼命加载中"
+                element-loading-spinner="el-icon-loading"
+                element-loading-background="rgba(255, 255, 255, 0.7)"
+                :header-cell-style="{ background: 'transparent' }"
+                :data="modelList"
+                class="data-table"
+                header-row-class-name="table-header"
+                :header-cell-class-name="headerCellClassName"
+                @selection-change="handleSelectionChange">
               <el-table-column type="selection" width="55" align="center"></el-table-column>
               <el-table-column label="模型名称" prop="modelName" align="center"></el-table-column>
               <el-table-column label="模型编码" prop="modelCode" align="center"></el-table-column>
@@ -157,7 +167,8 @@ export default {
       pageSize: 10,
       total: 0,
       selectedModels: [],
-      isAllSelected: false
+      isAllSelected: false,
+      loading: false
     };
   },
 
@@ -385,6 +396,7 @@ export default {
 
     // 获取模型配置列表
     loadData() {
+      this.loading = true; // 开始加载
       const params = {
         modelType: this.activeTab,
         modelName: this.search,
@@ -393,6 +405,7 @@ export default {
       };
 
       Api.model.getModelList(params, ({ data }) => {
+        this.loading = false; // 结束加载
         if (data.code === 0) {
           this.modelList = data.data.list;
           this.total = data.data.total;
@@ -912,4 +925,21 @@ export default {
   overflow-y: auto;
 }
 
+::v-deep .el-loading-mask {
+  background-color: rgba(255, 255, 255, 0.6) !important;
+  backdrop-filter: blur(2px);
+}
+::v-deep .el-loading-spinner .circular {
+  width: 28px;
+  height: 28px;
+}
+::v-deep .el-loading-spinner .path {
+  stroke: #6b8cff;
+}
+::v-deep .el-loading-text {
+  color: #6b8cff !important;
+  font-size: 14px;
+  margin-top: 8px;
+}
+
 </style>
diff --git a/main/manager-web/src/views/ParamsManagement.vue b/main/manager-web/src/views/ParamsManagement.vue
index 63d511d5..1525bb07 100644
--- a/main/manager-web/src/views/ParamsManagement.vue
+++ b/main/manager-web/src/views/ParamsManagement.vue
@@ -15,8 +15,15 @@
             <div class="content-panel">
                 <div class="content-area">
                     <el-card class="params-card" shadow="never">
-                        <el-table ref="paramsTable" :data="paramsList" class="transparent-table"
-                            :header-cell-class-name="headerCellClassName">
+                            <el-table
+                              ref="paramsTable"
+                              :data="paramsList"
+                              class="transparent-table"
+                              v-loading="loading"
+                              element-loading-text="拼命加载中"
+                              element-loading-spinner="el-icon-loading"
+                              element-loading-background="rgba(255, 255, 255, 0.7)"
+                              :header-cell-class-name="headerCellClassName">
                             <el-table-column label="选择" align="center" width="120">
                                 <template slot-scope="scope">
                                     <el-checkbox v-model="scope.row.selected"></el-checkbox>
@@ -92,6 +99,7 @@ export default {
             searchCode: "",
             paramsList: [],
             currentPage: 1,
+            loading: false,
             pageSize: 10,
             pageSizeOptions: [10, 20, 50, 100],
             total: 0,
@@ -138,27 +146,29 @@ export default {
             this.fetchParams();
         },
         fetchParams() {
-            Api.admin.getParamsList(
-                {
-                    page: this.currentPage,
-                    limit: this.pageSize,
-                    paramCode: this.searchCode,
-                },
-                ({ data }) => {
-                    if (data.code === 0) {
-                        this.paramsList = data.data.list.map(item => ({
-                            ...item,
-                            selected: false
-                        }));
-                        this.total = data.data.total;
-                    } else {
-                        this.$message.error({
-                            message: data.msg || '获取参数列表失败',
-                            showClose: true
-                        });
-                    }
-                }
-            );
+          this.loading = true;
+          Api.admin.getParamsList(
+            {
+              page: this.currentPage,
+              limit: this.pageSize,
+              paramCode: this.searchCode,
+            },
+            ({ data }) => {
+              this.loading = false;
+              if (data.code === 0) {
+                this.paramsList = data.data.list.map(item => ({
+                  ...item,
+                  selected: false
+                }));
+                this.total = data.data.total;
+              } else {
+                this.$message.error({
+                  message: data.msg || '获取参数列表失败',
+                  showClose: true
+                });
+              }
+            }
+          );
         },
         handleSearch() {
             this.currentPage = 1;
@@ -656,4 +666,25 @@ export default {
     max-height: calc(var(--table-max-height) - 40px);
   }
 }
+
+:deep(.el-loading-mask) {
+  background-color: rgba(255, 255, 255, 0.6) !important;
+  backdrop-filter: blur(2px);
+}
+
+:deep(.el-loading-spinner .circular) {
+  width: 28px;
+  height: 28px;
+}
+
+:deep(.el-loading-spinner .path) {
+  stroke: #6b8cff;
+}
+
+:deep(.el-loading-text) {
+  color: #6b8cff !important;
+  font-size: 14px;
+  margin-top: 8px;
+}
+
 </style>
diff --git a/main/manager-web/src/views/UserManagement.vue b/main/manager-web/src/views/UserManagement.vue
index 988d42a6..7b2574aa 100644
--- a/main/manager-web/src/views/UserManagement.vue
+++ b/main/manager-web/src/views/UserManagement.vue
@@ -15,7 +15,14 @@
       <div class="content-panel">
         <div class="content-area">
           <el-card class="user-card" shadow="never">
-            <el-table ref="userTable" :data="userList" class="transparent-table">
+            <el-table
+                ref="userTable"
+                :data="userList"
+                class="transparent-table"
+                v-loading="loading"
+                element-loading-text="拼命加载中"
+                element-loading-spinner="el-icon-loading"
+                element-loading-background="rgba(255, 255, 255, 0.7)">
               <el-table-column label="选择" align="center" width="120">
                   <template slot-scope="scope">
                       <el-checkbox v-model="scope.row.selected"></el-checkbox>
@@ -103,7 +110,8 @@ export default {
       currentPage: 1,
       pageSize: 10,
       total: 0,
-      isAllSelected: false
+      isAllSelected: false,
+      loading: false,
     };
   },
   created() {
@@ -137,22 +145,24 @@ export default {
     },
 
     fetchUsers() {
-        Api.admin.getUserList(
-            {
-                page: this.currentPage,
-                limit: this.pageSize,
-                mobile: this.searchPhone,
-            },
-            ({ data }) => {
-                if (data.code === 0) {
-                    this.userList = data.data.list.map(item => ({
-                        ...item,
-                        selected: false
-                    }));
-                    this.total = data.data.total;
-                }
-            }
-        );
+      this.loading = true;
+      Api.admin.getUserList(
+        {
+          page: this.currentPage,
+          limit: this.pageSize,
+          mobile: this.searchPhone,
+        },
+        ({ data }) => {
+          this.loading = false; // 结束加载
+          if (data.code === 0) {
+            this.userList = data.data.list.map(item => ({
+              ...item,
+              selected: false
+            }));
+            this.total = data.data.total;
+          }
+        }
+      );
     },
     handleSearch() {
       this.currentPage = 1;
@@ -682,5 +692,21 @@ export default {
   }
 }
 
+:deep(.el-loading-mask) {
+  background-color: rgba(255, 255, 255, 0.6) !important;
+  backdrop-filter: blur(2px);
+}
+:deep(.el-loading-spinner .circular) {
+  width: 28px;
+  height: 28px;
+}
+:deep(.el-loading-spinner .path) {
+  stroke: #6b8cff;
+}
+:deep(.el-loading-text) {
+  color: #6b8cff !important;
+  font-size: 14px;
+  margin-top: 8px;
+}
 
 </style>

From ec9fa32c81527af295e0e6df3c18c15b61f09343 Mon Sep 17 00:00:00 2001
From: CGD <3030332422@qq.com>
Date: Mon, 21 Apr 2025 11:36:10 +0800
Subject: [PATCH 2/2] =?UTF-8?q?update:=E6=B7=BB=E5=8A=A0=E5=A4=9A=E4=B8=AA?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6"=E4=BF=9D=E5=AD=98"=E6=97=B6=E7=9A=84loading?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/AddModelDialog.vue         | 25 +++++++--
 .../src/components/ModelEditDialog.vue        | 25 +++++++--
 .../src/components/ParamDialog.vue            | 21 +++++++-
 main/manager-web/src/views/ModelConfig.vue    |  4 +-
 .../src/views/ParamsManagement.vue            | 51 ++++++++++---------
 5 files changed, 92 insertions(+), 34 deletions(-)

diff --git a/main/manager-web/src/components/AddModelDialog.vue b/main/manager-web/src/components/AddModelDialog.vue
index 9a4a6022..5add8a77 100644
--- a/main/manager-web/src/components/AddModelDialog.vue
+++ b/main/manager-web/src/components/AddModelDialog.vue
@@ -77,7 +77,12 @@
     </div>
 
     <div style="display: flex;justify-content: center;">
-      <el-button type="primary" @click="confirm" class="save-btn">
+      <el-button
+        type="primary"
+        @click="confirm"
+        class="save-btn"
+        :loading="saving"
+        :disabled="saving">
         保存
       </el-button>
     </div>
@@ -94,6 +99,7 @@ export default {
   },
   data() {
     return {
+      saving: false,
       providers: [],
       dialogVisible: false,
       providersLoaded: false,
@@ -175,6 +181,7 @@ export default {
     },
 
     handleClose() {
+      this.saving = false;
       this.$emit('update:visible', false);
     },
     initDynamicConfig() {
@@ -185,8 +192,11 @@ export default {
       this.formData.configJson = newConfig;
     },
     confirm() {
+      this.saving = true;
+
       if (!this.formData.supplier) {
         this.$message.error('请选择供应器');
+        this.saving = false;
         return;
       }
 
@@ -206,11 +216,18 @@ export default {
         }
       };
 
-      this.$emit('confirm', submitData);
-      this.$emit('update:visible', false);
-      this.resetForm();
+      try {
+        this.$emit('confirm', submitData);
+        this.$emit('update:visible', false);
+        this.resetForm();
+      } catch (e) {
+        console.error(e);
+      } finally {
+        this.saving = false;
+      }
     },
     resetForm() {
+      this.saving = false;
       this.formData = {
         modelName: '',
         modelCode: '',
diff --git a/main/manager-web/src/components/ModelEditDialog.vue b/main/manager-web/src/components/ModelEditDialog.vue
index 9a534116..f4d582c6 100644
--- a/main/manager-web/src/components/ModelEditDialog.vue
+++ b/main/manager-web/src/components/ModelEditDialog.vue
@@ -76,7 +76,12 @@
     </div>
 
     <div style="display: flex;justify-content: center;">
-      <el-button type="primary" @click="handleSave" class="save-btn">
+      <el-button
+        type="primary"
+        @click="handleSave"
+        class="save-btn"
+        :loading="saving"
+        :disabled="saving">
         保存
       </el-button>
     </div>
@@ -102,6 +107,7 @@ export default {
       dialogVisible: this.visible,
       providers: [],
       providersLoaded: false,
+      saving: false,
       allProvidersData: null,
       pendingProviderType: null,
       pendingModelData: null,
@@ -195,6 +201,8 @@ export default {
       }
     },
     handleSave() {
+      this.saving = true; // 开始保存加载
+
       const provideCode = this.form.configJson.type;
       const formData = {
         id: this.modelData.id,
@@ -209,8 +217,19 @@ export default {
           ...this.form.configJson,
         }
       };
-      this.$emit("save", { provideCode, formData });
-      this.dialogVisible = false;
+
+      this.$emit("save", {
+        provideCode,
+        formData,
+        done: () => {
+          this.saving = false; // 保存完成后回调
+        }
+      });
+
+      // 如果父组件不处理done回调，3秒后自动关闭加载状态
+      setTimeout(() => {
+        this.saving = false;
+      }, 3000);
     },
     loadProviders() {
       if (this.providersLoaded) return;
diff --git a/main/manager-web/src/components/ParamDialog.vue b/main/manager-web/src/components/ParamDialog.vue
index 6fd5d872..7c126aa5 100644
--- a/main/manager-web/src/components/ParamDialog.vue
+++ b/main/manager-web/src/components/ParamDialog.vue
@@ -40,7 +40,12 @@
       </el-form>
 
       <div class="dialog-footer">
-        <el-button type="primary" @click="submit" class="save-btn">
+        <el-button
+          type="primary"
+          @click="submit"
+          class="save-btn"
+          :loading="saving"
+          :disabled="saving">
           保存
         </el-button>
         <el-button @click="cancel" class="cancel-btn">
@@ -76,6 +81,7 @@ export default {
   data() {
     return {
       dialogKey: Date.now(),
+      saving: false,
       valueTypeOptions: [
         { value: 'string', label: '字符串(string)' },
         { value: 'number', label: '数字(number)' },
@@ -100,11 +106,22 @@ export default {
     submit() {
       this.$refs.form.validate((valid) => {
         if (valid) {
-          this.$emit('submit', this.form);
+          this.saving = true; // 开始加载
+          this.$emit('submit', {
+            form: this.form,
+            done: () => {
+              this.saving = false; // 加载完成
+            }
+          });
+
+          setTimeout(() => {
+            this.saving = false;
+          }, 3000);
         }
       });
     },
     cancel() {
+      this.saving = false; // 取消时重置状态
       this.$emit('cancel');
     }
   },
diff --git a/main/manager-web/src/views/ModelConfig.vue b/main/manager-web/src/views/ModelConfig.vue
index 7c158001..294a6ed8 100644
--- a/main/manager-web/src/views/ModelConfig.vue
+++ b/main/manager-web/src/views/ModelConfig.vue
@@ -312,9 +312,10 @@ export default {
       this.currentPage = page;
       this.$refs.modelTable.clearSelection();
     },
-    handleModelSave({ provideCode, formData }) {
+    handleModelSave({ provideCode, formData, done }) {
       const modelType = this.activeTab;
       const id = formData.id;
+
       Api.model.updateModel(
         { modelType, provideCode, id, formData },
         ({ data }) => {
@@ -325,6 +326,7 @@ export default {
           } else {
             this.$message.error(data.msg || '保存失败');
           }
+          done && done(); // 调用done回调关闭加载状态
         }
       );
     },
diff --git a/main/manager-web/src/views/ParamsManagement.vue b/main/manager-web/src/views/ParamsManagement.vue
index 1525bb07..ef7817e4 100644
--- a/main/manager-web/src/views/ParamsManagement.vue
+++ b/main/manager-web/src/views/ParamsManagement.vue
@@ -195,32 +195,35 @@ export default {
             this.paramForm = { ...row };
             this.dialogVisible = true;
         },
-        handleSubmit(form) {
-            if (form.id) {
-                // 编辑
-                Api.admin.updateParam(form, ({ data }) => {
-                    if (data.code === 0) {
-                        this.$message.success({
-                          message:"修改成功",
-                          showClose:true
-                        });
-                        this.dialogVisible = false;
-                        this.fetchParams();
-                    }
+
+        handleSubmit({ form, done }) {
+          if (form.id) {
+            // 编辑
+            Api.admin.updateParam(form, ({ data }) => {
+              if (data.code === 0) {
+                this.$message.success({
+                  message:"修改成功",
+                  showClose:true
                 });
-            } else {
-                // 新增
-                Api.admin.addParam(form, ({ data }) => {
-                    if (data.code === 0) {
-                        this.$message.success({
-                          message:"新增成功",
-                          showClose:true
-                        });
-                        this.dialogVisible = false;
-                        this.fetchParams();
-                    }
+                this.dialogVisible = false;
+                this.fetchParams();
+              }
+              done && done();
+            });
+          } else {
+            // 新增
+            Api.admin.addParam(form, ({ data }) => {
+              if (data.code === 0) {
+                this.$message.success({
+                  message:"新增成功",
+                  showClose:true
                 });
-            }
+                this.dialogVisible = false;
+                this.fetchParams();
+              }
+              done && done();
+            });
+          }
         },
 
         deleteSelectedParams() {