Hass/xiaozhi-esp32-server
1
0
Fork 0
mirror of https://github.com/xinnan-tech/xiaozhi-esp32-server.git synced 2026-07-22 23:23:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
hrz
2025-04-24 10:41:14 +08:00
parent 19cbd3b8da
commit 497fc1d1ae
4 changed files with 190 additions and 198 deletions
Download Patch File Download Diff File Expand all files Collapse all files
main/manager-web/src/views/ModelConfig.vue
+18 -21
View File
@@ -44,19 +44,11 @@
<!-- 右侧内容 -->
<div class="content-area">
<el-card class="model-card" shadow="never">
<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 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="模型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;
color: #0ba6f4 !important;
background: #5778ff;
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
+5 -2
View File
@@ -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
+105 -110
View File
@@ -15,15 +15,10 @@
<div class="content-panel">
<div class="content-area">
<el-card class="params-card" shadow="never">
<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 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>
@@ -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
v-for="item in pageSizeOptions"
:key="item"
:label="`${item}条/页`"
<el-option 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;
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
});
}
}
);
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;
@@ -197,33 +191,33 @@ export default {
},
handleSubmit({ form, done }) {
if (form.id) {
// 编辑
Api.admin.updateParam(form, ({ data }) => {
if (data.code === 0) {
this.$message.success({
message:"修改成功",
showClose:true
if (form.id) {
// 编辑
Api.admin.updateParam(form, ({ data }) => {
if (data.code === 0) {
this.$message.success({
message: "修改成功",
showClose: true
});
this.dialogVisible = false;
this.fetchParams();
}
done && done();
});
this.dialogVisible = false;
this.fetchParams();
}
done && done();
});
} else {
// 新增
Api.admin.addParam(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();
}
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:"请先选择需要删除的参数",
showClose:true
message: "请先选择需要删除的参数",
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',
showClose: true
message: '存在无效的参数ID',
showClose: true
});
return;
}
@@ -341,16 +335,16 @@ export default {
}
.main-wrapper {
margin: 5px 22px;
border-radius: 15px;
min-height: calc(100vh - 24vh);
height: auto;
max-height: 80vh;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
position: relative;
background: rgba(237, 242, 255, 0.5);
display: flex;
flex-direction: column;
margin: 5px 22px;
border-radius: 15px;
min-height: calc(100vh - 24vh);
height: auto;
max-height: 80vh;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
position: relative;
background: rgba(237, 242, 255, 0.5);
display: flex;
flex-direction: column;
}
.operation-bar {
@@ -402,21 +396,21 @@ export default {
}
.params-card {
background: white;
flex: 1;
display: flex;
flex-direction: column;
border: none;
box-shadow: none;
overflow: hidden;
::v-deep .el-card__body {
padding: 15px;
background: white;
flex: 1;
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;
overflow-y: auto;
max-height: none !important;
flex: 1;
overflow-y: auto;
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);
max-height: var(--table-max-height);
--table-max-height: calc(100vh - 40vh);
max-height: var(--table-max-height);
.el-table__body-wrapper {
max-height: calc(var(--table-max-height) - 40px);
}
.el-table__body-wrapper {
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);
background-color: rgba(255, 255, 255, 0.6) !important;
backdrop-filter: blur(2px);
}
:deep(.el-loading-spinner .circular) {
width: 28px;
height: 28px;
width: 28px;
height: 28px;
}
:deep(.el-loading-spinner .path) {
stroke: #6b8cff;
stroke: #6b8cff;
}
:deep(.el-loading-text) {
color: #6b8cff !important;
font-size: 14px;
margin-top: 8px;
color: #6b8cff !important;
font-size: 14px;
margin-top: 8px;
}
</style>
main/manager-web/src/views/UserManagement.vue
+62 -65
View File
@@ -15,18 +15,13 @@
<div class="content-panel">
<div class="content-area">
<el-card class="user-card" shadow="never">
<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 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>
</template>
<template slot-scope="scope">
<el-checkbox v-model="scope.row.selected"></el-checkbox>
</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
v-for="item in pageSizeOptions"
:key="item"
:label="`${item}条/页`"
:value="item">
<el-option 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.userList.forEach(row => {
row.selected = this.isAllSelected;
});
this.isAllSelected = !this.isAllSelected;
this.userList.forEach(row => {
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);
this.handleChangeStatus(selectedUsers, 1);
const selectedUsers = this.userList.filter(user => user.selected);
this.handleChangeStatus(selectedUsers, 1);
},
batchDisable() {
const selectedUsers = this.userList.filter(user => user.selected);
this.handleChangeStatus(selectedUsers, 0);
const selectedUsers = this.userList.filter(user => user.selected);
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;
margin-right: 10px;
width: 100px;
margin-right: 10px;
:deep(.el-input__inner) {
height: 32px;
line-height: 32px;
border-radius: 4px;
border: 1px solid #e4e7ed;
background: #dee7ff;
color: #606266;
font-size: 14px;
}
:deep(.el-input__inner) {
height: 32px;
line-height: 32px;
border-radius: 4px;
border: 1px solid #e4e7ed;
background: #dee7ff;
color: #606266;
font-size: 14px;
}
:deep(.el-input__suffix) {
right: 6px;
width: 15px;
height: 20px;
display: flex;
justify-content: center;
align-items: center;
top: 6px;
border-radius: 4px;
}
:deep(.el-input__suffix) {
right: 6px;
width: 15px;
height: 20px;
display: flex;
justify-content: center;
align-items: center;
top: 6px;
border-radius: 4px;
}
:deep(.el-input__suffix-inner) {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
:deep(.el-input__suffix-inner) {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
:deep(.el-icon-arrow-up:before) {
content: "";
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 9px solid #606266;
position: relative;
transform: rotate(0deg);
transition: transform 0.3s;
}
:deep(.el-icon-arrow-up:before) {
content: "";
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 9px solid #606266;
position: relative;
transform: rotate(0deg);
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>