update:优化模型配置左侧栏显示

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

@@ -44,19 +44,11 @@
         <!-- 右侧内容 -->
         <div class="content-area">
           <el-card class="model-card" shadow="never">
-              <el-table
+            <el-table ref="modelTable" style="width: 100%" v-loading="loading" element-loading-text="拼命加载中"
-                ref="modelTable"
+              element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.7)"
-                style="width: 100%"
+              :header-cell-style="{ background: 'transparent' }" :data="modelList" class="data-table"
-                v-loading="loading"
+              header-row-class-name="table-header" :header-cell-class-name="headerCellClassName"
-                element-loading-text="拼命加载中"
+              @selection-change="handleSelectionChange">
-                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="模型ID" prop="id" align="center"></el-table-column>
               <el-table-column label="模型名称" prop="modelName" align="center"></el-table-column>
@@ -136,6 +128,9 @@
       <TtsModel :visible.sync="ttsDialogVisible" :ttsModelId="selectedTtsModelId" />
       <AddModelDialog :modelType="activeTab" :visible.sync="addDialogVisible" @confirm="handleAddConfirm" />
     </div>
+    <el-footer>
+      <version-footer />
+    </el-footer>
   </div>
 </template>
 
@@ -145,9 +140,9 @@ import AddModelDialog from "@/components/AddModelDialog.vue";
 import HeaderBar from "@/components/HeaderBar.vue";
 import ModelEditDialog from "@/components/ModelEditDialog.vue";
 import TtsModel from "@/components/TtsModel.vue";
-
+import VersionFooter from "@/components/VersionFooter.vue";
 export default {
-  components: { HeaderBar, ModelEditDialog, TtsModel, AddModelDialog },
+  components: { HeaderBar, ModelEditDialog, TtsModel, AddModelDialog, VersionFooter },
   data() {
     return {
       addDialogVisible: false,
@@ -520,8 +515,9 @@ export default {
 
 .nav-panel .el-menu-item {
   height: 50px;
+  background: #e9f0ff;
   line-height: 50px;
-  border-radius: 4px;
+  border-radius: 4px 0 0 4px !important;
   transition: all 0.3s;
   display: flex !important;
   justify-content: flex-end;
@@ -532,8 +528,7 @@ export default {
 }
 
 .nav-panel .el-menu-item.is-active {
-  background: #e9f0ff;
+  background: #5778ff;
-  color: #0ba6f4 !important;
   position: relative;
   padding-left: 40px !important;
 }
@@ -546,7 +541,7 @@ export default {
   transform: translateY(-50%);
   width: 13px;
   height: 13px;
-  background: #409EFF;
+  background: #fff;
   border-radius: 50%;
   box-shadow: 0 0 4px rgba(64, 158, 255, 0.5);
 }
@@ -758,7 +753,7 @@ export default {
 }
 
 ::v-deep .nav-panel .el-menu-item.is-active .menu-text {
-  color: #409EFF !important;
+  color: #fff !important;
 }
 
 ::v-deep .data-table {
@@ -929,17 +924,19 @@ export default {
   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>

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

@@ -91,7 +91,9 @@
         <!-- 新增/编辑固件对话框 -->
         <firmware-dialog :title="dialogTitle" :visible.sync="dialogVisible" :form="firmwareForm" @submit="handleSubmit"
             @cancel="dialogVisible = false" />
-
+        <el-footer>
+            <version-footer />
+        </el-footer>
     </div>
 </template>
 
@@ -99,11 +101,12 @@
 import Api from "@/apis/api";
 import FirmwareDialog from "@/components/FirmwareDialog.vue";
 import HeaderBar from "@/components/HeaderBar.vue";
+import VersionFooter from "@/components/VersionFooter.vue";
 import { FIRMWARE_TYPES } from "@/utils";
 import { formatDate, formatFileSize } from "@/utils/format";
 
 export default {
-    components: { HeaderBar, FirmwareDialog },
+    components: { HeaderBar, FirmwareDialog, VersionFooter },
     data() {
         return {
             searchName: "",

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

@@ -15,15 +15,10 @@
             <div class="content-panel">
                 <div class="content-area">
                     <el-card class="params-card" shadow="never">
-                            <el-table
+                        <el-table ref="paramsTable" :data="paramsList" class="transparent-table" v-loading="loading"
-                              ref="paramsTable"
+                            element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
-                              :data="paramsList"
+                            element-loading-background="rgba(255, 255, 255, 0.7)"
-                              class="transparent-table"
+                            :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)"
-                              :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>
@@ -48,14 +43,11 @@
                                 </el-button>
                                 <el-button size="mini" type="success" @click="showAddDialog">新增</el-button>
                                 <el-button size="mini" type="danger" icon="el-icon-delete"
-                                     @click="deleteSelectedParams">删除</el-button>
+                                    @click="deleteSelectedParams">删除</el-button>
                             </div>
                             <div class="custom-pagination">
                                 <el-select v-model="pageSize" @change="handlePageSizeChange" class="page-size-select">
-                                    <el-option
+                                    <el-option v-for="item in pageSizeOptions" :key="item" :label="`${item}条/页`"
-                                        v-for="item in pageSizeOptions"
-                                        :key="item"
-                                        :label="`${item}条/页`"
                                         :value="item">
                                     </el-option>
                                 </el-select>
@@ -83,7 +75,9 @@
         <!-- 新增/编辑参数对话框 -->
         <param-dialog :title="dialogTitle" :visible.sync="dialogVisible" :form="paramForm" @submit="handleSubmit"
             @cancel="dialogVisible = false" />
-
+        <el-footer>
+            <version-footer />
+        </el-footer>
     </div>
 </template>
 
@@ -91,9 +85,9 @@
 import Api from "@/apis/api";
 import HeaderBar from "@/components/HeaderBar.vue";
 import ParamDialog from "@/components/ParamDialog.vue";
-
+import VersionFooter from "@/components/VersionFooter.vue";
 export default {
-    components: { HeaderBar, ParamDialog },
+    components: { HeaderBar, ParamDialog, VersionFooter },
     data() {
         return {
             searchCode: "",
@@ -146,29 +140,29 @@ export default {
             this.fetchParams();
         },
         fetchParams() {
-          this.loading = true;
+            this.loading = true;
-          Api.admin.getParamsList(
+            Api.admin.getParamsList(
-            {
+                {
-              page: this.currentPage,
+                    page: this.currentPage,
-              limit: this.pageSize,
+                    limit: this.pageSize,
-              paramCode: this.searchCode,
+                    paramCode: this.searchCode,
-            },
+                },
-            ({ data }) => {
+                ({ data }) => {
-              this.loading = false;
+                    this.loading = false;
-              if (data.code === 0) {
+                    if (data.code === 0) {
-                this.paramsList = data.data.list.map(item => ({
+                        this.paramsList = data.data.list.map(item => ({
-                  ...item,
+                            ...item,
-                  selected: false
+                            selected: false
-                }));
+                        }));
-                this.total = data.data.total;
+                        this.total = data.data.total;
-              } else {
+                    } else {
-                this.$message.error({
+                        this.$message.error({
-                  message: data.msg || '获取参数列表失败',
+                            message: data.msg || '获取参数列表失败',
-                  showClose: true
+                            showClose: true
-                });
+                        });
-              }
+                    }
-            }
+                }
-          );
+            );
         },
         handleSearch() {
             this.currentPage = 1;
@@ -197,33 +191,33 @@ export default {
         },
 
         handleSubmit({ form, done }) {
-          if (form.id) {
+            if (form.id) {
-            // 编辑
+                // 编辑
-            Api.admin.updateParam(form, ({ data }) => {
+                Api.admin.updateParam(form, ({ data }) => {
-              if (data.code === 0) {
+                    if (data.code === 0) {
-                this.$message.success({
+                        this.$message.success({
-                  message:"修改成功",
+                            message: "修改成功",
-                  showClose:true
+                            showClose: true
+                        });
+                        this.dialogVisible = false;
+                        this.fetchParams();
+                    }
+                    done && done();
                 });
-                this.dialogVisible = false;
+            } else {
-                this.fetchParams();
+                // 新增
-              }
+                Api.admin.addParam(form, ({ data }) => {
-              done && done();
+                    if (data.code === 0) {
-            });
+                        this.$message.success({
-          } else {
+                            message: "新增成功",
-            // 新增
+                            showClose: true
-            Api.admin.addParam(form, ({ data }) => {
+                        });
-              if (data.code === 0) {
+                        this.dialogVisible = false;
-                this.$message.success({
+                        this.fetchParams();
-                  message:"新增成功",
+                    }
-                  showClose:true
+                    done && done();
                 });
-                this.dialogVisible = false;
+            }
-                this.fetchParams();
-              }
-              done && done();
-            });
-          }
         },
 
         deleteSelectedParams() {
@@ -243,8 +237,8 @@ export default {
 
             if (Array.isArray(row) && row.length === 0) {
                 this.$message.warning({
-                  message:"请先选择需要删除的参数",
+                    message: "请先选择需要删除的参数",
-                  showClose:true
+                    showClose: true
                 });
                 return;
             }
@@ -259,8 +253,8 @@ export default {
                 const ids = params.map(param => param.id);
                 if (ids.some(id => isNaN(id))) {
                     this.$message.error({
-                      message:'存在无效的参数ID',
+                        message: '存在无效的参数ID',
-                      showClose: true
+                        showClose: true
                     });
                     return;
                 }
@@ -341,16 +335,16 @@ export default {
 }
 
 .main-wrapper {
-  margin: 5px 22px;
+    margin: 5px 22px;
-  border-radius: 15px;
+    border-radius: 15px;
-  min-height: calc(100vh - 24vh);
+    min-height: calc(100vh - 24vh);
-  height: auto;
+    height: auto;
-  max-height: 80vh;
+    max-height: 80vh;
-  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
-  position: relative;
+    position: relative;
-  background: rgba(237, 242, 255, 0.5);
+    background: rgba(237, 242, 255, 0.5);
-  display: flex;
+    display: flex;
-  flex-direction: column;
+    flex-direction: column;
 }
 
 .operation-bar {
@@ -402,21 +396,21 @@ export default {
 }
 
 .params-card {
-  background: white;
+    background: white;
-  flex: 1;
+    flex: 1;
-  display: flex;
-  flex-direction: column;
-  border: none;
-  box-shadow: none;
-  overflow: hidden;
-
-  ::v-deep .el-card__body {
-    padding: 15px;
     display: flex;
     flex-direction: column;
-    flex: 1;
+    border: none;
+    box-shadow: none;
     overflow: hidden;
-  }
+
+    ::v-deep .el-card__body {
+        padding: 15px;
+        display: flex;
+        flex-direction: column;
+        flex: 1;
+        overflow: hidden;
+    }
 }
 
 .table_bottom {
@@ -467,7 +461,7 @@ export default {
     gap: 10px;
 
     .el-select {
-      margin-right: 8px;
+        margin-right: 8px;
     }
 
     .pagination-btn:first-child,
@@ -535,15 +529,17 @@ export default {
     width: 100%;
     display: flex;
     flex-direction: column;
+
     .el-table__body-wrapper {
-      flex: 1;
+        flex: 1;
-      overflow-y: auto;
+        overflow-y: auto;
-      max-height: none !important;
+        max-height: none !important;
     }
 
     .el-table__header-wrapper {
-      flex-shrink: 0;
+        flex-shrink: 0;
     }
+
     .el-table__header th {
         background: white !important;
         color: black;
@@ -670,32 +666,31 @@ export default {
 }
 
 .el-table {
-  --table-max-height: calc(100vh - 40vh);
+    --table-max-height: calc(100vh - 40vh);
-  max-height: var(--table-max-height);
+    max-height: var(--table-max-height);
 
-  .el-table__body-wrapper {
+    .el-table__body-wrapper {
-    max-height: calc(var(--table-max-height) - 40px);
+        max-height: calc(var(--table-max-height) - 40px);
-  }
+    }
 }
 
 :deep(.el-loading-mask) {
-  background-color: rgba(255, 255, 255, 0.6) !important;
+    background-color: rgba(255, 255, 255, 0.6) !important;
-  backdrop-filter: blur(2px);
+    backdrop-filter: blur(2px);
 }
 
 :deep(.el-loading-spinner .circular) {
-  width: 28px;
+    width: 28px;
-  height: 28px;
+    height: 28px;
 }
 
 :deep(.el-loading-spinner .path) {
-  stroke: #6b8cff;
+    stroke: #6b8cff;
 }
 
 :deep(.el-loading-text) {
-  color: #6b8cff !important;
+    color: #6b8cff !important;
-  font-size: 14px;
+    font-size: 14px;
-  margin-top: 8px;
+    margin-top: 8px;
 }
-
 </style>

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

@@ -15,18 +15,13 @@
       <div class="content-panel">
         <div class="content-area">
           <el-card class="user-card" shadow="never">
-            <el-table
+            <el-table ref="userTable" :data="userList" class="transparent-table" v-loading="loading"
-                ref="userTable"
+              element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
-                :data="userList"
+              element-loading-background="rgba(255, 255, 255, 0.7)">
-                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">
+                <template slot-scope="scope">
-                      <el-checkbox v-model="scope.row.selected"></el-checkbox>
+                  <el-checkbox v-model="scope.row.selected"></el-checkbox>
-                  </template>
+                </template>
               </el-table-column>
               <el-table-column label="用户Id" prop="userid" align="center"></el-table-column>
               <el-table-column label="手机号码" prop="mobile" align="center"></el-table-column>
@@ -61,11 +56,7 @@
               </div>
               <div class="custom-pagination">
                 <el-select v-model="pageSize" @change="handlePageSizeChange" class="page-size-select">
-                  <el-option
+                  <el-option v-for="item in pageSizeOptions" :key="item" :label="`${item}条/页`" :value="item">
-                    v-for="item in pageSizeOptions"
-                    :key="item"
-                    :label="`${item}条/页`"
-                    :value="item">
                   </el-option>
                 </el-select>
 
@@ -90,16 +81,19 @@
     </div>
 
     <view-password-dialog :visible.sync="showViewPassword" :password="currentPassword" />
+    <el-footer>
+      <version-footer />
+    </el-footer>
   </div>
 </template>
 
 <script>
 import Api from "@/apis/api";
 import HeaderBar from "@/components/HeaderBar.vue";
+import VersionFooter from "@/components/VersionFooter.vue";
 import ViewPasswordDialog from "@/components/ViewPasswordDialog.vue";
-
 export default {
-  components: { HeaderBar, ViewPasswordDialog },
+  components: { HeaderBar, ViewPasswordDialog, VersionFooter },
   data() {
     return {
       showViewPassword: false,
@@ -138,7 +132,7 @@ export default {
     },
   },
   methods: {
-     handlePageSizeChange(val) {
+    handlePageSizeChange(val) {
       this.pageSize = val;
       this.currentPage = 1;
       this.fetchUsers();
@@ -169,10 +163,10 @@ export default {
       this.fetchUsers();
     },
     handleSelectAll() {
-        this.isAllSelected = !this.isAllSelected;
+      this.isAllSelected = !this.isAllSelected;
-        this.userList.forEach(row => {
+      this.userList.forEach(row => {
-            row.selected = this.isAllSelected;
+        row.selected = this.isAllSelected;
-        });
+      });
     },
     batchDelete() {
       const selectedUsers = this.userList.filter(user => user.selected);
@@ -240,12 +234,12 @@ export default {
         });
     },
     batchEnable() {
-        const selectedUsers = this.userList.filter(user => user.selected);
+      const selectedUsers = this.userList.filter(user => user.selected);
-        this.handleChangeStatus(selectedUsers, 1);
+      this.handleChangeStatus(selectedUsers, 1);
     },
     batchDisable() {
-        const selectedUsers = this.userList.filter(user => user.selected);
+      const selectedUsers = this.userList.filter(user => user.selected);
-        this.handleChangeStatus(selectedUsers, 0);
+      this.handleChangeStatus(selectedUsers, 0);
     },
     resetPassword(row) {
       this.$confirm("重置后将会生成新密码，是否继续？", "提示", {
@@ -573,6 +567,7 @@ export default {
   width: 100%;
   display: flex;
   flex-direction: column;
+
   .el-table__body-wrapper {
     flex: 1;
     overflow-y: auto;
@@ -648,47 +643,47 @@ export default {
 }
 
 .page-size-select {
-    width: 100px;
+  width: 100px;
-    margin-right: 10px;
+  margin-right: 10px;
 
-    :deep(.el-input__inner) {
+  :deep(.el-input__inner) {
-        height: 32px;
+    height: 32px;
-        line-height: 32px;
+    line-height: 32px;
-        border-radius: 4px;
+    border-radius: 4px;
-        border: 1px solid #e4e7ed;
+    border: 1px solid #e4e7ed;
-        background: #dee7ff;
+    background: #dee7ff;
-        color: #606266;
+    color: #606266;
-        font-size: 14px;
+    font-size: 14px;
-    }
+  }
 
-    :deep(.el-input__suffix) {
+  :deep(.el-input__suffix) {
-        right: 6px;
+    right: 6px;
-        width: 15px;
+    width: 15px;
-        height: 20px;
+    height: 20px;
-        display: flex;
+    display: flex;
-        justify-content: center;
+    justify-content: center;
-        align-items: center;
+    align-items: center;
-        top: 6px;
+    top: 6px;
-        border-radius: 4px;
+    border-radius: 4px;
-    }
+  }
 
-    :deep(.el-input__suffix-inner) {
+  :deep(.el-input__suffix-inner) {
-        display: flex;
+    display: flex;
-        align-items: center;
+    align-items: center;
-        justify-content: center;
+    justify-content: center;
-        width: 100%;
+    width: 100%;
-    }
+  }
 
-    :deep(.el-icon-arrow-up:before) {
+  :deep(.el-icon-arrow-up:before) {
-        content: "";
+    content: "";
-        display: inline-block;
+    display: inline-block;
-        border-left: 6px solid transparent;
+    border-left: 6px solid transparent;
-        border-right: 6px solid transparent;
+    border-right: 6px solid transparent;
-        border-top: 9px solid #606266;
+    border-top: 9px solid #606266;
-        position: relative;
+    position: relative;
-        transform: rotate(0deg);
+    transform: rotate(0deg);
-        transition: transform 0.3s;
+    transition: transform 0.3s;
-    }
+  }
 }
 
 .el-table {
@@ -704,17 +699,19 @@ export default {
   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>