From edef58568d6181c5496940128a73448cfc57bc4c Mon Sep 17 00:00:00 2001
From: huang <1724659546@qq.com>
Date: Tue, 30 Sep 2025 23:05:27 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BE=A7=E8=BE=B9=E6=A0=8F=E6=94=B9=E4=B8=BA?=
 =?UTF-8?q?=E4=B8=A4=E7=BA=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/DeviceTemplateList.vue | 40 +++++++++++++++++++++++++++
 src/layouts/MainLayout.vue            | 36 ++++++++++++++++++------
 src/main.js                           |  4 ++-
 3 files changed, 71 insertions(+), 9 deletions(-)
 create mode 100644 src/components/DeviceTemplateList.vue

diff --git a/src/components/DeviceTemplateList.vue b/src/components/DeviceTemplateList.vue
new file mode 100644
index 00000000..cfd07aee
--- /dev/null
+++ b/src/components/DeviceTemplateList.vue
@@ -0,0 +1,40 @@
+<template>
+  <div class="device-template-list">
+    <el-card>
+      <template #header>
+        <div class="card-header">
+          <h2 class="page-title">设备模板管理</h2>
+        </div>
+      </template>
+      <el-empty description="设备模板管理功能待开发" />
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'DeviceTemplateList',
+};
+</script>
+
+<style scoped>
+.device-template-list {
+  padding: 20px;
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 15px 0;
+}
+
+.page-title {
+  margin: 0;
+  font-size: 1.5rem;
+  font-weight: bold;
+  line-height: 1;
+}
+</style>
\ No newline at end of file
diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
index 633ced5d..1ff8e25d 100644
--- a/src/layouts/MainLayout.vue
+++ b/src/layouts/MainLayout.vue
@@ -20,10 +20,23 @@
           <el-icon><House /></el-icon>
           <template #title>首页</template>
         </el-menu-item>
-        <el-menu-item index="/devices">
-          <el-icon><Monitor /></el-icon>
-          <template #title>设备管理</template>
-        </el-menu-item>
+
+        <!-- 设备管理二级菜单 -->
+        <el-sub-menu index="/device-management">
+          <template #title>
+            <el-icon><Setting /></el-icon>
+            <span>设备</span>
+          </template>
+          <el-menu-item index="/devices">
+            <el-icon><Monitor /></el-icon>
+            <template #title>设备管理</template>
+          </el-menu-item>
+          <el-menu-item index="/device-templates">
+            <el-icon><Tickets /></el-icon>
+            <template #title>设备模板管理</template>
+          </el-menu-item>
+        </el-sub-menu>
+
         <el-menu-item index="/plans">
           <el-icon><Calendar /></el-icon>
           <template #title>计划管理</template>
@@ -74,7 +87,7 @@
 <script>
 import { ref, computed, onMounted, onUnmounted } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import { House, Monitor, Calendar, ArrowDown, Menu, Fold, Expand } from '@element-plus/icons-vue';
+import { House, Monitor, Calendar, ArrowDown, Menu, Fold, Expand, Setting, Tickets } from '@element-plus/icons-vue'; // 导入Setting和Tickets图标
 
 export default {
   name: 'MainLayout',
@@ -85,7 +98,9 @@ export default {
     ArrowDown,
     Menu,
     Fold,
-    Expand
+    Expand,
+    Setting, // 注册Setting图标
+    Tickets // 注册Tickets图标
   },
   setup() {
     const route = useRoute();
@@ -111,6 +126,10 @@ export default {
     };
     
     const activeMenu = computed(() => {
+      // 对于二级菜单，需要判断当前路由是否在其子菜单中
+      if (route.path === '/devices' || route.path === '/device-templates') {
+        return route.path; // 激活子菜单项
+      }
       return route.path;
     });
 
@@ -118,6 +137,7 @@ export default {
       const routeMap = {
         '/': '系统首页',
         '/devices': '设备管理',
+        '/device-templates': '设备模板管理',
         '/plans': '计划管理'
       };
       return routeMap[route.path] || '猪场管理系统';
@@ -125,8 +145,8 @@ export default {
 
     const logout = () => {
       localStorage.removeItem('jwt_token');
-      localStorage.removeItem('username'); // 清除用户名
-      username.value = '管理员'; // 重置显示
+      localStorage.removeItem('username');
+      username.value = '管理员';
       router.push('/login');
     };
 
diff --git a/src/main.js b/src/main.js
index e7aad36c..2becd479 100644
--- a/src/main.js
+++ b/src/main.js
@@ -7,7 +7,8 @@ import App from './App.vue';
 import Home from './components/Home.vue';
 import DeviceList from './components/DeviceList.vue';
 import PlanList from './components/PlanList.vue';
-import LoginForm from './components/LoginForm.vue'; // 导入登录组件
+import LoginForm from './components/LoginForm.vue';
+import DeviceTemplateList from './components/DeviceTemplateList.vue'; // 导入设备模板列表组件
 
 // 导入全局样式
 import './assets/styles/main.css';
@@ -16,6 +17,7 @@ import './assets/styles/main.css';
 const routes = [
   { path: '/', component: Home, meta: { requiresAuth: true } },
   { path: '/devices', component: DeviceList, meta: { requiresAuth: true } },
+  { path: '/device-templates', component: DeviceTemplateList, meta: { requiresAuth: true } }, // 添加设备模板路由
   { path: '/plans', component: PlanList, meta: { requiresAuth: true } },
   { path: '/login', component: LoginForm }
 ];