diff --git a/main/manager-web/src/components/ManualAddDeviceDialog.vue b/main/manager-web/src/components/ManualAddDeviceDialog.vue index 7cc8625f..00490de6 100644 --- a/main/manager-web/src/components/ManualAddDeviceDialog.vue +++ b/main/manager-web/src/components/ManualAddDeviceDialog.vue @@ -1,43 +1,45 @@ - - \ No newline at end of file diff --git a/main/manager-web/src/components/VoiceCloneDialog.vue b/main/manager-web/src/components/VoiceCloneDialog.vue index 7bd95f48..6af12268 100644 --- a/main/manager-web/src/components/VoiceCloneDialog.vue +++ b/main/manager-web/src/components/VoiceCloneDialog.vue @@ -1,6 +1,11 @@ diff --git a/main/manager-web/src/components/VoiceResourceDialog.vue b/main/manager-web/src/components/VoiceResourceDialog.vue index 1575ea0b..d05c8d52 100644 --- a/main/manager-web/src/components/VoiceResourceDialog.vue +++ b/main/manager-web/src/components/VoiceResourceDialog.vue @@ -1,7 +1,15 @@ - - diff --git a/main/manager-web/src/views/DeviceManagement.vue b/main/manager-web/src/views/DeviceManagement.vue index a897352b..1cefd474 100644 --- a/main/manager-web/src/views/DeviceManagement.vue +++ b/main/manager-web/src/views/DeviceManagement.vue @@ -2,118 +2,83 @@
-
-

{{ $t('device.management') }}

-
- - {{ $t('device.search') }} -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
- - {{ isCurrentPageAllSelected ? $t('common.deselectAll') : $t('common.selectAll') }} - - - {{ $t('device.bindWithCode') }} - - - {{ $t('device.manualAdd') }} - - - {{ $t('device.unbind') }} - -
-
- - - - - - - - - - {{ $t('dictManagement.totalRecords').replace('{total}', deviceList.length) }} - +
+

{{ $t('device.management') }}

+
+ + {{ $t('device.search') }}
+ + + + + + + + +
@@ -136,6 +101,8 @@ import HeaderBar from "@/components/HeaderBar.vue"; import ManualAddDeviceDialog from "@/components/ManualAddDeviceDialog.vue"; import VersionFooter from "@/components/VersionFooter.vue"; import MacAddressMask from "@/components/MacAddressMask.vue"; +import CustomButton from "@/components/CustomButton.vue"; +import CustomTable from "@/components/CustomTable.vue"; export default { components: { @@ -144,6 +111,8 @@ export default { ManualAddDeviceDialog, VersionFooter, MacAddressMask, + CustomButton, + CustomTable, }, data() { return { @@ -160,7 +129,7 @@ export default { loading: false, userApi: null, firmwareTypes: [], - mqttServiceAvailable: false, // MQTT服务是否可用 + mqttServiceAvailable: false, }; }, computed: { @@ -178,28 +147,24 @@ export default { const end = start + this.pageSize; return this.filteredDeviceList.slice(start, end); }, - pageCount() { - return Math.ceil(this.filteredDeviceList.length / this.pageSize); - }, - // 计算当前页是否全选 isCurrentPageAllSelected() { return this.paginatedDeviceList.length > 0 && this.paginatedDeviceList.every(device => device.selected); }, - visiblePages() { - const pages = []; - const maxVisible = 3; - let start = Math.max(1, this.currentPage - 1); - let end = Math.min(this.pageCount, start + maxVisible - 1); - - if (end - start + 1 < maxVisible) { - start = Math.max(1, end - maxVisible + 1); + tableColumns() { + const columns = [ + { prop: 'model', label: this.$t('device.model'), align: 'center' }, + { prop: 'firmwareVersion', label: this.$t('device.firmwareVersion'), align: 'center' }, + { prop: 'macAddress', label: this.$t('device.macAddress'), align: 'center' }, + { prop: 'bindTime', label: this.$t('device.bindTime'), align: 'center' }, + { prop: 'lastConversation', label: this.$t('device.lastConversation'), align: 'center' }, + ]; + if (this.mqttServiceAvailable) { + columns.push({ prop: 'deviceStatus', label: this.$t('device.deviceStatus'), align: 'center' }); } - - for (let i = start; i <= end; i++) { - pages.push(i); - } - return pages; + columns.push({ prop: 'remark', label: this.$t('device.remark'), align: 'center' }); + columns.push({ prop: 'otaSwitch', label: this.$t('device.autoUpdate'), align: 'center' }); + return columns; }, }, mounted() { @@ -313,14 +278,12 @@ export default { row._submitting = false; }); }, - // 备注输入框:失焦时提交 onRemarkBlur(row) { row.isEdit = false; setTimeout(() => { this.submitRemark(row); - }, 100); // 延迟 100ms,避开 enter+blur 同时触发的窗口 + }, 100); }, - // 备注输入框:按回车时提交 onRemarkEnter(row) { row.isEdit = false; this.submitRemark(row); @@ -354,15 +317,6 @@ export default { sessionStorage.setItem('devicePath', window.location.href); window.location.href = url; }, - goFirst() { - this.currentPage = 1; - }, - goPrev() { - if (this.currentPage > 1) this.currentPage--; - }, - goNext() { - if (this.currentPage < this.pageCount) this.currentPage++; - }, goToPage(page) { this.currentPage = page; }, @@ -389,7 +343,6 @@ export default { otaSwitch: device.autoUpdate === 1, rawBindTime: new Date(device.createDate).getTime(), selected: false, - // 初始设置为离线状态 deviceStatus: 'offline' }; }) @@ -397,7 +350,6 @@ export default { this.activeSearchKeyword = ""; this.searchKeyword = ""; - // 获取设备列表后,立即获取设备状态 this.fetchDeviceStatus(agentId); } else { this.$message.error(data.msg || this.$t('device.getListFailed')); @@ -405,47 +357,35 @@ export default { }); }, - // 获取设备状态 fetchDeviceStatus(agentId) { - // 开启表格等待状态,处理动态加载表头导致鼠标所在行的hover事件无法移除的问题 this.loading = true; Api.device.getDeviceStatus(agentId, ({ data }) => { this.loading = false; if (data.code === 0) { try { - // 解析后端返回的设备状态JSON const statusData = JSON.parse(data.data); - // 直接使用解析后的数据作为设备状态映射(不需要devices字段包装) if (statusData && typeof statusData === 'object') { - // 成功获取到设备状态 this.mqttServiceAvailable = true; - // 更新设备状态 this.updateDeviceStatusFromResponse(statusData); } else { - // 数据格式不正确,MQTT服务不可用 this.mqttServiceAvailable = false; } } catch (error) { - // JSON解析失败,MQTT服务不可用 this.mqttServiceAvailable = false; } } else { - // 接口调用失败,MQTT服务不可用 this.mqttServiceAvailable = false; } }); }, - // 根据API响应更新设备状态 updateDeviceStatusFromResponse(deviceStatusMap) { this.deviceList.forEach(device => { - // 构建设备的MQTT客户端ID const macAddress = device.macAddress ? device.macAddress.replace(/:/g, '_') : 'unknown'; const groupId = device.model ? device.model.replace(/:/g, '_') : 'GID_default'; const mqttClientId = `${groupId}@@@${macAddress}@@@${macAddress}`; - // 从状态映射中获取设备状态 if (deviceStatusMap[mqttClientId]) { const statusInfo = deviceStatusMap[mqttClientId]; @@ -462,17 +402,10 @@ export default { device.deviceStatus = isOnline ? 'online' : 'offline'; } else { - // 如果没有找到对应的状态信息,默认为离线 device.deviceStatus = 'offline'; } }); }, - headerCellClassName({ columnIndex }) { - if (columnIndex === 0) { - return "custom-selection-header"; - } - return ""; - }, getFirmwareTypeName(type) { const firmwareType = this.firmwareTypes.find(item => item.key === type) return firmwareType ? firmwareType.name : type @@ -492,7 +425,6 @@ export default { this.$message.error(msg || this.$t('message.error')) }) }, - // 判断是否可以生成表情、主题、字体bin文件 isGenerate(row) { const version = row.firmwareVersion.replace(/\./g, ''); return Number(version) >= 200; @@ -503,13 +435,13 @@ export default { if (isNaN(ts)) return '-'; const date = new Date(ts); if (isNaN(date.getTime())) return '-'; - return date.toLocaleString(); // 自动适配本地时区 + return date.toLocaleString(); }, } }; - diff --git a/main/manager-web/src/views/VoiceCloneManagement.vue b/main/manager-web/src/views/VoiceCloneManagement.vue index e7740a87..0fa67db5 100644 --- a/main/manager-web/src/views/VoiceCloneManagement.vue +++ b/main/manager-web/src/views/VoiceCloneManagement.vue @@ -1,128 +1,83 @@ + \ No newline at end of file diff --git a/main/manager-web/src/views/VoiceResourceManagement.vue b/main/manager-web/src/views/VoiceResourceManagement.vue index 0e2b0b38..cf3e9ee9 100644 --- a/main/manager-web/src/views/VoiceResourceManagement.vue +++ b/main/manager-web/src/views/VoiceResourceManagement.vue @@ -1,91 +1,48 @@