修改 树后面按钮

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

@@ -1,38 +1,38 @@
 <template>
   <div class="plan_tree">
-    <el-input
-      placeholder="请输入计划名称"
-      v-model="searchForm.planName"
-    ></el-input>
+    <el-input placeholder="请输入计划名称" v-model="searchForm.planName"></el-input>
     <div class="tree_container">
-      <el-tree
-        :data="data"
-        ref="treeRef"
-        :filter-node-method="filterNode"
-        :props="defaultProps"
-        node-key="id"
-        default-expand-all
-        :default-checked-keys="defaultChecked"
-        @node-click="handleNodeClick"
-      >
-    </el-tree>
+      <el-tree :data="data" ref="treeRef" :filter-node-method="filterNode" :props="defaultProps" node-key="id"
+        default-expand-all :default-checked-keys="defaultChecked" @node-click="handleNodeClick">
+        <template #default="{ node, data }">
+          <span class="custom-tree-node">
+            <span>{{ node.label }}</span>
+            <Menu v-if="data.pid" @click.stop="detail(data)" style="width: 12px;margin-left: 8px;"/>
+          </span>
+        </template>
+
+      </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%;
     }