Merge pull request #919 from xinnan-tech/web-vue-loading

Web vue loading

main/manager-web/src/components/AddWisdomBodyDialog.vue

@@ -11,7 +11,7 @@
     <div style="height: 1px;background: #e8f0ff;" />
     <div style="margin: 22px 15px;">
       <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;">
-        <div style="color: red;display: inline-block;">*</div> 智慧体名称：
+        <div style="color: red;display: inline-block;">*</div> 智能体名称：
       </div>
       <div class="input-46" style="margin-top: 12px;">
         <el-input ref="inputRef" placeholder="请输入智能体名称.." v-model="wisdomBodyName" @keyup.enter.native="confirm" />

main/manager-web/src/components/TtsModel.vue

@@ -20,7 +20,10 @@
               style="width: 100%;"
               class="data-table"
               header-row-class-name="table-header"
-            :fit="true">
+              :fit="true"
+              element-loading-text="拼命加载中"
+              element-loading-spinner="el-icon-loading"
+              element-loading-background="rgba(0, 0, 0, 0.8)">
           <el-table-column label="选择" width="50" align="center">
             <template slot-scope="scope">
               <el-checkbox v-model="scope.row.selected"></el-checkbox>
@@ -187,13 +190,13 @@ export default {
   },
   methods: {
     loadData() {
+      this.loading = true;
       const params = {
         ttsModelId: this.ttsModelId,
         page: this.currentPage,
         limit: this.pageSize,
         name: this.searchQuery
       };
-
       Api.timbre.getVoiceList(params, (data) => {
         if (data.code === 0) {
           this.ttsModels = data.data.list
@@ -216,12 +219,14 @@ export default {
             showClose: true
           });
         }
+        this.loading = false;
       }, (err) => {
         console.error('加载失败:', err);
         this.$message.error({
           message: '加载音色数据失败',
           showClose: true
         });
+        this.loading = false;
       });
     },
 

main/manager-web/src/views/DeviceManagement.vue

@@ -20,7 +20,11 @@
               :data="paginatedDeviceList"
               @selection-change="handleSelectionChange"
               class="transparent-table"
-              :header-cell-class-name="headerCellClassName">
+              :header-cell-class-name="headerCellClassName"
+              v-loading="loading"
+              element-loading-text="拼命加载中"
+              element-loading-spinner="el-icon-loading"
+              element-loading-background="rgba(255, 255, 255, 0.7)">
               <el-table-column type="selection" align="center" width="120"></el-table-column>
               <el-table-column label="设备型号" prop="model" align="center"></el-table-column>
               <el-table-column label="固件版本" prop="firmwareVersion" align="center" ></el-table-column>