修改 树后面按钮

frontend/src/layouts/LayoutClassic/index.vue

@@ -1,6 +1,7 @@
 <!-- 经典布局 -->
 <template>
   <el-container class="layout">
+
     <el-header>
       <div class="header-lf mask-image">
         <div class="logo flx-center">

frontend/src/layouts/LayoutTransverse/index.vue

@@ -44,7 +44,10 @@
       </el-menu>
       <ToolBarRight />
     </el-header>
-    <Main />
+    <Main class="111" style="height: calc(100vh - 150px);overflow-y:auto; overflow-x:hidden;"/>
+    <!-- <div>
+      123
+    </div> -->
   </el-container>
 </template>
 

frontend/src/layouts/components/Main/index.vue

@@ -2,7 +2,7 @@
   <Maximize v-show="maximize" />
   <Tabs v-if="tabs && showMenuFlag" />
   <el-main>
-    <router-view v-slot="{ Component, route }">
+    <router-view v-slot="{ Component, route }" >
       <transition appear name="fade-transform" mode="out-in">
         <keep-alive :include="keepAliveName">
           <component

frontend/src/layouts/index.vue

@@ -2,6 +2,8 @@
 <template>
   <component :is="LayoutComponents[layout]" />
   <ThemeDrawer />
+
+
 </template>
 
 <script setup lang="ts" name="layout">

frontend/src/views/home/components/tree.vue

@@ -1,38 +1,38 @@
 <template>
   <div class="plan_tree">
-    <el-input
+    <el-input placeholder="请输入计划名称" v-model="searchForm.planName"></el-input>
-      placeholder="请输入计划名称"
-      v-model="searchForm.planName"
-    ></el-input>
     <div class="tree_container">
-      <el-tree
+      <el-tree :data="data" ref="treeRef" :filter-node-method="filterNode" :props="defaultProps" node-key="id"
-        :data="data"
+        default-expand-all :default-checked-keys="defaultChecked" @node-click="handleNodeClick">
-        ref="treeRef"
+        <template #default="{ node, data }">
-        :filter-node-method="filterNode"
+          <span class="custom-tree-node">
-        :props="defaultProps"
+            <span>{{ node.label }}</span>
-        node-key="id"
+            <Menu v-if="data.pid" @click.stop="detail(data)" style="width: 12px;margin-left: 8px;"/>
-        default-expand-all
+          </span>
-        :default-checked-keys="defaultChecked"
+        </template>
-        @node-click="handleNodeClick"
+
-      >
+      </el-tree>
-    </el-tree>
     </div>
   </div>
 </template>
 <script lang="ts" setup>
 import { ref, onMounted, defineExpose, watch } from "vue";
+import {
+  Menu
+} from '@element-plus/icons-vue'
+const emit = defineEmits(['jump'])
 const data: any = ref([]);
 const defaultProps = {
   children: "children",
   label: "name",
-  pid:"pid",
+  pid: "pid",
 };
 const searchForm = ref({
   planName: "",
 });
-const defaultChecked=ref([])
+const defaultChecked = ref([])
 const getTreeData = (val: any) => {
-  defaultChecked.value=[]
+  defaultChecked.value = []
   data.value = val;
   defaultChecked.value.push(data.value[0].children[0].id)
 };
@@ -54,6 +54,12 @@ const filterNode = (value: string, data) => {
   if (!value) return true;
   return data.name.includes(value);
 };
+// 点击详情
+const detail=(e:any) => {
+ 
+  emit('jump',e)
+  
+}
 onMounted(() => {
   console.log();
 });
@@ -68,13 +74,16 @@ defineExpose({ getTreeData });
   padding: 5px;
   height: calc(100% - 70px);
   background-color: #fff;
+
   .el-input {
     width: 100%;
     margin: 0 10px 10px 0;
   }
+
   .tree_container {
     flex: 1;
     overflow-y: auto;
+
     .el-tree {
       height: 100%;
     }

frontend/src/views/home/tabs/dashboard.vue

@@ -2,7 +2,7 @@
 <template>
   <div class="static">
     <div class="left_tree">
-      <tree ref="treeRef" />
+      <tree ref="treeRef"  @jump="jump"/>
     </div>
     <!-- <span class="new_span">测试scss颜色</span> -->
     <div class="right_container">
@@ -99,7 +99,7 @@
             <el-button type="primary" v-if="form.activeTabs === 5"
               >设备导入</el-button
             >
-            <el-button type="primary" @click="planDetail">计划详情</el-button>
+            <!-- <el-button type="primary" @click="planDetail">计划详情</el-button> -->
           </el-form-item>
         </el-form>
       </div>
@@ -393,6 +393,13 @@ const handleCheckFunction = (val: any) => {
   });
   form.value.activeTabs=val;
 };
+// 树点击跳转
+const jump=(e:any) => {
+  console.log("🚀 ~ jump ~ e:", e)
+  router.push({
+    path: "/plan/planList",
+  });
+}
 onMounted(() => {
   console.log();
   getTree();