-
设备列表
@@ -82,8 +91,9 @@ export default {
data() {
return {
addDeviceDialogVisible: false,
- selectedDevices: [],
+ selectedDevices: [],
isAllSelected: false,
+ searchKeyword: "",
currentAgentId: this.$route.query.agentId || '',
currentPage: 1,
pageSize: 5,
@@ -93,13 +103,22 @@ export default {
};
},
computed: {
+ filteredDeviceList() {
+ const keyword = this.searchKeyword.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 = [];
@@ -115,7 +134,7 @@ export default {
pages.push(i);
}
return pages;
- },
+ }
},
mounted() {
const agentId = this.$route.query.agentId;
@@ -124,6 +143,10 @@ export default {
}
},
methods: {
+ handleSearch() {
+ this.currentPage = 1;
+ this.fetchBindDevices(this.currentAgentId);
+ },
handleSelectionChange(val) {
this.selectedDevices = val;
@@ -183,9 +206,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 {
@@ -221,9 +242,8 @@ export default {
height: 100vh;
display: flex;
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;
}
@@ -252,14 +272,6 @@ export default {
}
}
-.device-list-title {
- float: left;
- font-size: 18px;
- font-weight: 700;
- margin: 5px;
- color: #2c3e50;
-}
-
.el-icon-edit {
color: #409eff;
cursor: pointer;
@@ -348,4 +360,44 @@ export default {
}
+.operation-bar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 16px 24px;
+ margin-top: 15px;
+}
+
+.page-title {
+ font-size: 24px;
+ margin: 0;
+ color: #2c3e50;
+}
+
+.right-operations {
+ display: flex;
+ gap: 10px;
+ margin-left: auto;
+}
+
+.search-input {
+ width: 280px;
+ border-radius: 4px;
+ transition: all 0.3s;
+}
+
+.btn-search {
+ background: linear-gradient(135deg, #6b8cff, #a966ff);
+ border: none;
+ color: white;
+ transition: all 0.3s;
+
+ &:hover {
+ opacity: 0.9;
+ transform: translateY(-1px);
+ box-shadow: 0 2px 6px rgba(107, 140, 255, 0.4);
+ }
+}
+
+
From 5a4d65986d3ecacf602ec33959873e4cf09fafc8 Mon Sep 17 00:00:00 2001
From: CGD <3030332422@qq.com>
Date: Mon, 14 Apr 2025 07:52:00 +0800
Subject: [PATCH 2/9] =?UTF-8?q?=E4=BC=98=E5=8C=96=E4=BA=86=E7=95=8C?=
=?UTF-8?q?=E9=9D=A2=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../src/views/DeviceManagement.vue | 390 +++++++++++-------
1 file changed, 240 insertions(+), 150 deletions(-)
diff --git a/main/manager-web/src/views/DeviceManagement.vue b/main/manager-web/src/views/DeviceManagement.vue
index ade5e7d8..eb42d565 100644
--- a/main/manager-web/src/views/DeviceManagement.vue
+++ b/main/manager-web/src/views/DeviceManagement.vue
@@ -11,73 +11,86 @@