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

Merge remote-tracking branch 'upstream/main'

Browse Source
This commit is contained in:
huangjunsen0406
2025-04-15 09:54:05 +08:00
parent afa0527b4c e2fda532d1
commit 0892dfc601
6 changed files with 388 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files
main/manager-web/src/components/AddModelDialog.vue
-1
View File
@@ -6,7 +6,6 @@
添加模型
</div>
<button class="custom-close-btn" @click="handleClose">
×
</button>
main/manager-web/src/views/DeviceManagement.vue
+316 -129
View File
@@ -1,67 +1,94 @@
<template>
<div class="welcome">
<HeaderBar />
<el-main style="padding: 20px; display: flex; flex-direction: column;">
<div class="table-container">
<h3 class="device-list-title">设备列表</h3>
<el-table ref="deviceTable" :data="paginatedDeviceList" @selection-change="handleSelectionChange"
style="width: 100%; margin-top: 20px" border stripe>
<el-table-column type="selection" align="center" width="60"></el-table-column>
<el-table-column label="设备型号" prop="model" flex></el-table-column>
<el-table-column label="固件版本" prop="firmwareVersion" width="120"></el-table-column>
<el-table-column label="Mac地址" prop="macAddress"></el-table-column>
<el-table-column label="绑定时间" prop="bindTime" width="200"></el-table-column>
<el-table-column label="最近对话" prop="lastConversation" width="140"></el-table-column>
<el-table-column label="备注" width="180">
<template slot-scope="scope">
<el-input v-if="scope.row.isEdit" v-model="scope.row.remark" size="mini"
@blur="stopEditRemark(scope.$index)"></el-input>
<span v-else>
<i v-if="!scope.row.remark" class="el-icon-edit" @click="startEditRemark(scope.$index, scope.row)"></i>
<span v-else @click="startEditRemark(scope.$index, scope.row)">
{{ scope.row.remark }}
</span>
</span>
</template>
</el-table-column>
<el-table-column label="OTA升级" width="120">
<template slot-scope="scope">
<el-switch v-model="scope.row.otaSwitch" size="mini" active-color="#13ce66"
inactive-color="#ff4949"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template slot-scope="scope">
<el-button size="mini" type="text" @click="handleUnbind(scope.row.device_id)" style="color: #ff4949">
解绑
</el-button>
</template>
</el-table-column>
</el-table>
<div class="table_bottom">
<div class="ctrl_btn">
<el-button size="mini" type="primary" class="select-all-btn" @click="toggleAllSelection">
{{ isAllSelected ? '取消全选' : '全选' }}
</el-button>
<el-button type="primary" size="mini" class="add-device-btn" @click="handleAddDevice">
新增
</el-button>
</div>
<div class="custom-pagination">
<button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">首页</button>
<button class="pagination-btn" :disabled="currentPage === 1" @click="goPrev">上一页</button>
<button v-for="page in visiblePages" :key="page" class="pagination-btn"
:class="{ active: page === currentPage }" @click="goToPage(page)">
{{ page }}
</button>
<button class="pagination-btn" :disabled="currentPage === pageCount" @click="goNext">下一页</button>
<span class="total-text">共{{ deviceList.length }}条记录</span>
</div>
<div class="operation-bar">
<h2 class="page-title">设备管理</h2>
<div class="right-operations">
<el-input placeholder="请输入设备型号或Mac地址查询" v-model="searchKeyword"
class="search-input" @keyup.enter.native="handleSearch" clearable />
<el-button class="btn-search" @click="handleSearch">搜索</el-button>
</div>
</div>
<div class="main-wrapper">
<div class="content-panel">
<div class="content-area">
<el-card class="params-card" shadow="never">
<el-table
ref="deviceTable"
:data="paginatedDeviceList"
@selection-change="handleSelectionChange"
class="transparent-table"
:header-cell-class-name="headerCellClassName"
stripe>
<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>
<el-table-column label="Mac地址" prop="macAddress" align="center"></el-table-column>
<el-table-column label="绑定时间" prop="bindTime" align="center"></el-table-column>
<el-table-column label="最近对话" prop="lastConversation" align="center"></el-table-column>
<el-table-column label="备注" align="center">
<template slot-scope="scope">
<el-input v-if="scope.row.isEdit" v-model="scope.row.remark" size="mini"
@blur="stopEditRemark(scope.$index)"></el-input>
<span v-else>
<i v-if="!scope.row.remark" class="el-icon-edit" @click="startEditRemark(scope.$index, scope.row)"></i>
<span v-else @click="startEditRemark(scope.$index, scope.row)">
{{ scope.row.remark }}
</span>
</span>
</template>
</el-table-column>
<el-table-column label="OTA升级" align="center">
<template slot-scope="scope">
<el-switch v-model="scope.row.otaSwitch" size="mini" active-color="#13ce66"
inactive-color="#ff4949"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button size="mini" type="text" @click="handleUnbind(scope.row.device_id)">
解绑
</el-button>
</template>
</el-table-column>
</el-table>
<div class="table_bottom">
<div class="ctrl_btn">
<el-button size="mini" type="primary" class="select-all-btn" @click="toggleAllSelection">
{{ isAllSelected ? '取消全选' : '全选' }}
</el-button>
<el-button type="success" size="mini" class="add-device-btn" @click="handleAddDevice">
新增
</el-button>
<el-button size="mini" type="danger" icon="el-icon-delete"
@click="deleteSelected">解绑</el-button>
</div>
<div class="custom-pagination">
<button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">首页</button>
<button class="pagination-btn" :disabled="currentPage === 1" @click="goPrev">上一页</button>
<button
v-for="page in visiblePages"
:key="page"
class="pagination-btn"
:class="{ active: page === currentPage }"
@click="goToPage(page)">
{{ page }}
</button>
<button class="pagination-btn" :disabled="currentPage === pageCount" @click="goNext">下一页</button>
<span class="total-text">共{{ deviceList.length }}条记录</span>
</div>
</div>
</el-card>
</div>
</div>
<AddDeviceDialog :visible.sync="addDeviceDialogVisible" :agent-id="currentAgentId"
@refresh="fetchBindDevices(currentAgentId)" />
</el-main>
</div>
<AddDeviceDialog :visible.sync="addDeviceDialogVisible" :agent-id="currentAgentId"
@refresh="fetchBindDevices(currentAgentId)" />
</div>
</template>
@@ -77,22 +104,35 @@ export default {
addDeviceDialogVisible: false,
selectedDevices: [],
isAllSelected: false,
searchKeyword: "",
activeSearchKeyword: "",
currentAgentId: this.$route.query.agentId || '',
currentPage: 1,
pageSize: 5,
deviceList: [],
loading: false,
userApi: null,
};
},
computed: {
filteredDeviceList() {
const keyword = this.activeSearchKeyword.toLowerCase();
if (!keyword) return this.deviceList;
return this.deviceList.filter(device =>
(device.model && device.model.toLowerCase().includes(keyword)) ||
(device.macAddress && device.macAddress.toLowerCase().includes(keyword))
);
},
paginatedDeviceList() {
const start = (this.currentPage - 1) * this.pageSize;
const end = start + this.pageSize;
return this.deviceList.slice(start, end);
return this.filteredDeviceList.slice(start, end);
},
pageCount() {
return Math.ceil(this.deviceList.length / this.pageSize);
return Math.ceil(this.filteredDeviceList.length / this.pageSize);
},
visiblePages() {
const pages = [];
@@ -108,7 +148,7 @@ export default {
pages.push(i);
}
return pages;
},
}
},
mounted() {
const agentId = this.$route.query.agentId;
@@ -117,6 +157,10 @@ export default {
}
},
methods: {
handleSearch() {
this.activeSearchKeyword = this.searchKeyword;
this.currentPage = 1;
},
handleSelectionChange(val) {
this.selectedDevices = val;
@@ -126,6 +170,55 @@ export default {
this.$refs.deviceTable.toggleAllSelection();
},
deleteSelected() {
if (this.selectedDevices.length === 0) {
this.$message.warning({
message: '请至少选择一条记录',
showClose: true
});
return;
}
this.$confirm(`确认要解绑选中的 ${this.selectedDevices.length} 台设备吗？`, '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const deviceIds = this.selectedDevices.map(device => device.device_id);
this.batchUnbindDevices(deviceIds);
});
},
batchUnbindDevices(deviceIds) {
const promises = deviceIds.map(id => {
return new Promise((resolve, reject) => {
Api.device.unbindDevice(id, ({ data }) => {
if (data.code === 0) {
resolve();
} else {
reject(data.msg || '解绑失败');
}
});
});
});
Promise.all(promises)
.then(() => {
this.$message.success({
message: `成功解绑 ${deviceIds.length} 台设备`,
showClose: true
});
this.fetchBindDevices(this.currentAgentId);
this.selectedDevices = [];
this.isAllSelected = false;
})
.catch(error => {
this.$message.error({
message: error || '批量解绑过程中出现错误',
showClose: true
});
});
},
handleAddDevice() {
this.addDeviceDialogVisible = true;
@@ -176,9 +269,7 @@ export default {
Api.device.getAgentBindDevices(agentId, ({ data }) => {
this.loading = false;
if (data.code === 0) {
// 格式化日期并按照绑定时间降序排列
this.deviceList = data.data.map(device => {
// 格式化绑定时间
const bindDate = new Date(device.createDate);
const formattedBindTime = `${bindDate.getFullYear()}-${(bindDate.getMonth() + 1).toString().padStart(2, '0')}-${bindDate.getDate().toString().padStart(2, '0')} ${bindDate.getHours().toString().padStart(2, '0')}:${bindDate.getMinutes().toString().padStart(2, '0')}:${bindDate.getSeconds().toString().padStart(2, '0')}`;
return {
@@ -186,25 +277,30 @@ export default {
model: device.board,
firmwareVersion: device.appVersion,
macAddress: device.macAddress,
bindTime: formattedBindTime, // 使用格式化后的时间
bindTime: formattedBindTime,
lastConversation: device.lastConnectedAt,
remark: device.alias,
isEdit: false,
otaSwitch: device.autoUpdate === 1,
// 添加原始时间用于排序
rawBindTime: new Date(device.createDate).getTime()
};
})
// 按照绑定时间降序排序
.sort((a, b) => a.rawBindTime - b.rawBindTime);
.sort((a, b) => a.rawBindTime - b.rawBindTime);
this.activeSearchKeyword = "";
this.searchKeyword = "";
} else {
this.$message.error(data.msg || '获取设备列表失败');
}
});
},
headerCellClassName({columnIndex}) {
if (columnIndex === 0) {
return "custom-selection-header";
}
return "";
}
}
};
</script>
<style scoped>
@@ -213,51 +309,122 @@ export default {
min-height: 506px;
height: 100vh;
display: flex;
position: relative;
flex-direction: column;
background: linear-gradient(145deg, #e6eeff, #eff0ff);
background: linear-gradient(to bottom right, #dce8ff, #e4eeff, #e6cbfd);
background-size: cover;
background-position: center;
-webkit-background-size: cover;
-o-background-size: cover;
}
.table-container {
background: #f9fafc;
padding: 20px;
border-radius: 20px;
.main-wrapper {
margin: 5px 22px;
border-radius: 15px;
min-height: 600px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
margin-top: 15px;
position: relative;
background: rgba(237, 242, 255, 0.5);
}
.add-device-btn {
background: linear-gradient(135deg, #6b8cff, #a966ff) !important;
border: none !important;
color: white !important;
margin-left: 10px;
height: 32px;
padding: 7px 12px;
border-radius: 4px !important;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
&:hover {
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
.operation-bar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 16px 24px;
}
.device-list-title {
float: left;
font-size: 18px;
font-weight: 700;
margin: 5px;
.page-title {
font-size: 24px;
margin: 0;
color: #2c3e50;
}
.el-icon-edit {
color: #409eff;
cursor: pointer;
font-size: 14px;
vertical-align: middle;
.right-operations {
display: flex;
gap: 10px;
margin-left: auto;
}
.search-input {
width: 280px;
border-radius: 4px;
}
.btn-search {
background: linear-gradient(135deg, #6b8cff, #a966ff);
border: none;
color: white;
}
.content-panel {
flex: 1;
display: flex;
overflow: hidden;
height: 100%;
border-radius: 15px;
background: transparent;
border: 1px solid #fff;
}
.content-area {
flex: 1;
height: 100%;
min-width: 600px;
overflow-x: auto;
background-color: white;
}
.params-card {
background: white;
border: none;
box-shadow: none;
}
.table_bottom {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 40px;
padding: 0 20px;
}
.ctrl_btn {
display: flex;
gap: 8px;
padding-left: 6px;
}
.ctrl_btn .el-button {
min-width: 72px;
height: 32px;
padding: 7px 12px 7px 10px;
font-size: 12px;
border-radius: 4px;
line-height: 1;
font-weight: 500;
border: none;
transition: all 0.3s ease;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
.ctrl_btn .el-button:hover {
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
.ctrl_btn .el-button--primary {
background: #5f70f3;
color: white;
}
.ctrl_btn .el-button--success {
background: #5bc98c;
color: white;
}
.ctrl_btn .el-button--danger {
background: #fd5b63;
color: white;
}
.custom-pagination {
@@ -307,36 +474,56 @@ export default {
margin-left: 10px;
}
.table_bottom {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 20px;
:deep(.transparent-table) {
background: white;
border: none;
}
.ctrl_btn {
display: flex;
gap: 8px;
padding-left: 26px;
.el-button {
min-width: 72px;
height: 32px;
padding: 7px 12px;
border-radius: 4px;
border: none;
transition: all 0.3s;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
&:hover {
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
}
.el-button--primary {
background: #5f70f3;
color: white;
}
:deep(.transparent-table .el-table__header th) {
background: white !important;
color: black;
border-right: none !important;
}
:deep(.transparent-table .el-table__body tr td) {
border-top: 1px solid rgba(0, 0, 0, 0.04);
border-bottom: 1px solid rgba(0, 0, 0, 0.04);
border-right: none !important;
}
:deep(.transparent-table .el-table__header tr th:first-child .cell),
:deep(.transparent-table .el-table__body tr td:first-child .cell) {
padding-left: 10px;
}
:deep(.el-icon-edit) {
color: #7079aa;
cursor: pointer;
}
:deep(.el-icon-edit:hover) {
color: #5a64b5;
}
:deep(.custom-selection-header .el-checkbox) {
display: none !important;
}
:deep(.custom-selection-header::after) {
content: "选择";
display: inline-block;
color: black;
font-weight: bold;
padding-bottom: 18px;
}
:deep(.el-table .el-button--text) {
color: #7079aa;
}
:deep(.el-table .el-button--text:hover) {
color: #5a64b5;
}
</style>
main/manager-web/src/views/ParamsManagement.vue
+64 -11
View File
@@ -16,7 +16,7 @@
<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">
:header-cell-class-name="headerCellClassName" :max-height="tableMaxHeight">
<el-table-column label="选择" type="selection" align="center" width="120"></el-table-column>
<el-table-column label="参数编码" prop="paramCode" align="center"></el-table-column>
<el-table-column label="参数值" prop="paramValue" align="center"
@@ -40,6 +40,14 @@
@click="deleteParam($refs.paramsTable.selection)">删除</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}条/页`"
:value="item">
</el-option>
</el-select>
<button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">
首页
</button>
@@ -64,6 +72,7 @@
<!-- 新增/编辑参数对话框 -->
<param-dialog :title="dialogTitle" :visible.sync="dialogVisible" :form="paramForm" @submit="handleSubmit"
@cancel="dialogVisible = false" />
</div>
</template>
@@ -80,10 +89,12 @@ export default {
paramsList: [],
currentPage: 1,
pageSize: 5,
pageSizeOptions: [5, 10, 20, 50, 100],
total: 0,
dialogVisible: false,
dialogTitle: "新增参数",
isAllSelected: false,
tableMaxHeight: 400,
paramForm: {
id: null,
paramCode: "",
@@ -94,7 +105,9 @@ export default {
},
created() {
this.fetchParams();
},
computed: {
pageCount() {
return Math.ceil(this.total / this.pageSize);
@@ -116,6 +129,11 @@ export default {
},
},
methods: {
handlePageSizeChange(val) {
this.pageSize = val;
this.currentPage = 1;
this.fetchParams();
},
fetchParams() {
Api.admin.getParamsList(
{
@@ -190,7 +208,6 @@ export default {
return;
}
const paramCount = params.length;
this.$confirm(`确定要删除选中的${paramCount}个参数吗？`, '警告', {
confirmButtonText: '确定',
@@ -210,7 +227,7 @@ export default {
message: `成功删除${paramCount}个参数`,
showClose: true
});
this.fetchParams(); // 刷新参数列表
this.fetchParams();
} else {
this.$message.error({
message: data.msg || '删除失败，请重试',
@@ -279,12 +296,16 @@ export default {
}
.main-wrapper {
margin: 5px 22px;
border-radius: 15px;
min-height: 600px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
position: relative;
background: rgba(237, 242, 255, 0.5);
margin: 5px 22px;
border-radius: 15px;
min-height: calc(100vh - 350px);
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 {
@@ -344,6 +365,7 @@ export default {
justify-content: space-between;
align-items: center;
margin-top: 10px;
padding-bottom: 10px;
}
.ctrl_btn {
@@ -386,9 +408,14 @@ export default {
gap: 8px;
margin-top: 15px;
.el-select {
margin-right: 8px;
}
.pagination-btn:first-child,
.pagination-btn:nth-child(2),
.pagination-btn:nth-last-child(2) {
.pagination-btn:nth-last-child(2),
.pagination-btn:nth-child(3) {
min-width: 60px;
height: 32px;
padding: 0 12px;
@@ -410,7 +437,7 @@ export default {
}
}
.pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-last-child(2)) {
.pagination-btn:not(:first-child):not(:nth-child(3)):not(:nth-child(2)):not(:nth-last-child(2)) {
min-width: 28px;
height: 32px;
padding: 0;
@@ -446,6 +473,7 @@ export default {
:deep(.transparent-table) {
background: white;
flex: 1;
.el-table__header th {
background: white !important;
@@ -534,4 +562,29 @@ export default {
overflow: hidden;
text-overflow: ellipsis;
}
.page-size-select {
width: 100px;
margin-right: 8px;
: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) {
line-height: 32px;
}
}
:deep(.el-table) {
.el-table__body-wrapper {
transition: height 0.3s ease;
}
}
</style>
main/manager-web/src/views/UserManagement.vue
+1
View File
@@ -69,6 +69,7 @@
</div>
</div>
</div>
<view-password-dialog :visible.sync="showViewPassword" :password="currentPassword" />
</div>
</template>
main/manager-web/src/views/home.vue
+6 -3
View File
@@ -19,13 +19,13 @@
<div class="hi-hint">
Hello, Let's have a wonderful day!
</div>
<div class="add-device-btn" @click="showAddDialog">
<div class="left-add">
<div class="add-device-btn">
<div class="left-add" @click="showAddDialog">
添加智能体
</div>
<div style="width: 23px;height: 13px;background: #5778ff;margin-left: -10px;" />
<div class="right-add">
<i class="el-icon-right" style="font-size: 20px;color: #fff;" />
<i class="el-icon-right" @click="showAddDialog" style="font-size: 20px;color: #fff;" />
</div>
</div>
</div>
@@ -261,4 +261,7 @@ export default {
text-align: center;
/* 居中显示 */
}
</style>
main/manager-web/src/views/roleConfig.vue
+1
View File
@@ -81,6 +81,7 @@
</div>
</div>
</div>
</el-main>
</div>
</template>