From a2db45cace4e1c8722739ae2e949e3fe9c69aa86 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B4=BE=E5=90=8C=E5=AD=A6?= <stary1993@qq.com>
Date: Wed, 20 Aug 2025 08:51:01 +0800
Subject: [PATCH] =?UTF-8?q?ADD:=E6=B7=BB=E5=8A=A0=E6=8C=89=E9=92=AE?=
 =?UTF-8?q?=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/views/home/components/tree.vue   | 450 +++++++++---------
 .../plan/planList/components/childrenPlan.vue |  26 +-
 frontend/src/views/plan/planList/index.vue    |  13 +-
 3 files changed, 263 insertions(+), 226 deletions(-)

diff --git a/frontend/src/views/home/components/tree.vue b/frontend/src/views/home/components/tree.vue
index d86e68e..0902670 100644
--- a/frontend/src/views/home/components/tree.vue
+++ b/frontend/src/views/home/components/tree.vue
@@ -1,70 +1,88 @@
 <template>
-  <div class='plan_tree'>
-    <div class='search_view'>
-      <el-input
-        placeholder='请输入计划名称'
-        clearable
-        v-model='searchForm.planName'
-        show-word-limit
-        maxlength="32"
-      ></el-input>
-      <el-tooltip content="检测计划列表" placement="top">
-      <Menu style='width: 26px;height: 26px; margin-left: 8px;cursor: pointer;color:var(--el-color-primary)'
-            @click.stop='detail()' />
-      </el-tooltip>
-    </div>
-    <div class='tree_container'>
-      <el-tree
-        :data='data'
-        ref='treeRef'
-        :filter-node-method='filterNode'
-        :props='defaultProps'
-        node-key='id'
-        class="filter-tree"
-        :highlight-current="true"
-        default-expand-all
-        :default-checked-keys='defaultChecked'
-        @node-click='handleNodeClick'
-      >
-        <template #default='{ node, data }'>
-          <span class='custom-tree-node' style='display: flex;align-items: center;'>
-             <!-- 父节点图标 -->
-            <Platform v-if='!data.pid' style='width:18px;height: 18px;margin-right:8px;'
-                      :style="{color:node.label=='未检'?'#fac858':node.label=='检测中'?'#ee6666':'#91cc75'}" />
-            <!-- 节点名称 -->
-            <span>{{ node.label }}</span>
-            <!-- 子节点右侧图标 + tooltip -->
-            <el-tooltip 
-              v-if="node.label!='未检' && node.label!='检测中' && node.label!='检测完成' && hasChildrenInPlanTable(node.data)"
-              placement="top" 
-              :manual="true"
-              content="子计划信息">
-              <List
-                @click.stop="childDetail(node.data)"
-                style="width: 16px; height: 16px; margin-left: 8px; cursor: pointer; color: var(--el-color-primary)"
-              />
+    <div class="plan_tree">
+        <div class="search_view">
+            <el-input
+                placeholder="请输入计划名称"
+                clearable
+                v-model="searchForm.planName"
+                show-word-limit
+                maxlength="32"
+            ></el-input>
+            <el-tooltip content="检测计划列表" placement="top">
+                <Menu
+                    style="width: 26px; height: 26px; margin-left: 8px; cursor: pointer; color: var(--el-color-primary)"
+                    @click.stop="detail()"
+                />
             </el-tooltip>
-          </span>
-        </template>
-      </el-tree>
+        </div>
+        <div class="tree_container">
+            <el-tree
+                :data="data"
+                ref="treeRef"
+                :filter-node-method="filterNode"
+                :props="defaultProps"
+                node-key="id"
+                class="filter-tree"
+                :highlight-current="true"
+                default-expand-all
+                :default-checked-keys="defaultChecked"
+                @node-click="handleNodeClick"
+            >
+                <template #default="{ node, data }">
+                    <span class="custom-tree-node" style="display: flex; align-items: center">
+                        <!-- 父节点图标 -->
+                        <Platform
+                            v-if="!data.pid"
+                            style="width: 18px; height: 18px; margin-right: 8px"
+                            :style="{
+                                color: node.label == '未检' ? '#fac858' : node.label == '检测中' ? '#ee6666' : '#91cc75'
+                            }"
+                        />
+                        <!-- 节点名称 -->
+                        <span>{{ node.label }}</span>
+                        <!-- 子节点右侧图标 + tooltip -->
+                        <el-tooltip
+                            v-if="
+                                node.label != '未检' &&
+                                node.label != '检测中' &&
+                                node.label != '检测完成' &&
+                                hasChildrenInPlanTable(node.data)
+                            "
+                            placement="top"
+                            :manual="true"
+                            content="子计划信息"
+                        >
+                            <List
+                                v-auth.plan="'add_subplan'"
+                                @click.stop="childDetail(node.data)"
+                                style="
+                                    width: 16px;
+                                    height: 16px;
+                                    margin-left: 8px;
+                                    cursor: pointer;
+                                    color: var(--el-color-primary);
+                                "
+                            />
+                        </el-tooltip>
+                    </span>
+                </template>
+            </el-tree>
+        </div>
     </div>
-  </div>
-  <SourceOpen  ref='openSourceView' :width="width" :height="height + 175"></SourceOpen>
-
+    <SourceOpen ref="openSourceView" :width="width" :height="height + 175"></SourceOpen>
 </template>
-<script lang='ts' setup>
-import { type Plan } from '@/api/plan/interface';
-import { Menu, Platform ,List} from '@element-plus/icons-vue'
-import { nextTick, onMounted, PropType, ref, watch } from 'vue';
+<script lang="ts" setup>
+import { type Plan } from '@/api/plan/interface'
+import { List, Menu, Platform } from '@element-plus/icons-vue'
+import { nextTick, onMounted, ref, watch } from 'vue'
 import { useRouter } from 'vue-router'
-import {useCheckStore} from "@/stores/modules/check";
-import { ElTooltip } from 'element-plus';
+import { useCheckStore } from '@/stores/modules/check'
+import { ElTooltip } from 'element-plus'
 import SourceOpen from '@/views/plan/planList/components/childrenPlan.vue'
-import {getPlanList } from '@/api/plan/plan.ts'
+import { getPlanList } from '@/api/plan/plan.ts'
 import { useModeStore } from '@/stores/modules/mode' // 引入模式 store
 import { useDictStore } from '@/stores/modules/dict'
 
-
 const openSourceView = ref()
 const router = useRouter()
 const checkStore = useCheckStore()
@@ -75,240 +93,228 @@ const modeStore = useModeStore()
 const dictStore = useDictStore()
 
 const defaultProps = {
-  children: 'children',
-  label: 'name',
-  pid: 'pid',
+    children: 'children',
+    label: 'name',
+    pid: 'pid'
 }
 const searchForm = ref({
-  planName: '',
+    planName: ''
 })
-const defaultChecked = ref<string[]>([])  // 明确类型为 number[]
-const tree = ref(false)//确保左侧树高凉只执行一次
+const defaultChecked = ref<string[]>([]) // 明确类型为 number[]
+const tree = ref(false) //确保左侧树高凉只执行一次
 const getTreeData = (val: any) => {
-  defaultChecked.value = [];
-  // 遍历 val 的每个 children，过滤掉 pid !== '0'
-  data.value = val
-  for (let item of data.value) {
-    if (item.children.length > 0) {
-      let node = item.children[0];
-      defaultChecked.value.push(node.id);
-      checkStore.setPlan(node);
-      // 高亮显示第一个节点
-      // 使用 nextTick 确保在 DOM 更新后调用 setCurrentKey
-      nextTick(() => {
-        treeRef.value?.setCurrentKey(node.id);
-        idd.value = node.id;
-      });
-      // 找到第一个符合条件的 children 后跳出循环
-      break;
+    defaultChecked.value = []
+    // 遍历 val 的每个 children，过滤掉 pid !== '0'
+    data.value = val
+    for (let item of data.value) {
+        if (item.children.length > 0) {
+            let node = item.children[0]
+            defaultChecked.value.push(node.id)
+            checkStore.setPlan(node)
+            // 高亮显示第一个节点
+            // 使用 nextTick 确保在 DOM 更新后调用 setCurrentKey
+            nextTick(() => {
+                treeRef.value?.setCurrentKey(node.id)
+                idd.value = node.id
+            })
+            // 找到第一个符合条件的 children 后跳出循环
+            break
+        }
     }
-  }
 }
 
 //点击表格后左侧树刷新，高亮显示对应节点
-const  clickTableToTree = (val: any,id:any) => {
-  defaultChecked.value = []
-  data.value = val
-  let node = ref('')
-  if (data.value.length > 0) {
-    for (let i = 0; i < data.value.length; i++){
-        for (let j = 0; j < data.value[i].children.length; j++) {
-            if (data.value[i].children[j].id == id) {
-              node.value = data.value[i].children[j].id
-              break;
+const clickTableToTree = (val: any, id: any) => {
+    defaultChecked.value = []
+    data.value = val
+    let node = ref('')
+    if (data.value.length > 0) {
+        for (let i = 0; i < data.value.length; i++) {
+            for (let j = 0; j < data.value[i].children.length; j++) {
+                if (data.value[i].children[j].id == id) {
+                    node.value = data.value[i].children[j].id
+                    break
+                }
             }
         }
+
+        // 使用 nextTick 确保在 DOM 更新后调用 setCurrentKey
+        nextTick(() => {
+            treeRef.value?.setCurrentKey(node.value)
+            idd.value = node.value
+        })
     }
-    
-    // 使用 nextTick 确保在 DOM 更新后调用 setCurrentKey
-    nextTick(() => {
-      treeRef.value?.setCurrentKey(node.value);
-      idd.value = node.value
-    });
-   
-  }
 }
 
-const {updateSelectedTreeNode,width,height,planTable}  = defineProps<{
-    updateSelectedTreeNode:Function;
-    width: number;
-    height: number;
-    planTable?: Array<[]>;
-}>();
+const { updateSelectedTreeNode, width, height, planTable } = defineProps<{
+    updateSelectedTreeNode: Function
+    width: number
+    height: number
+    planTable?: Array<[]>
+}>()
 
 watch(
-  () => searchForm.value.planName,
-  (val) => {
-    treeRef.value!.filter(val)
-  },
-  {
-    deep: true,
-  },
+    () => searchForm.value.planName,
+    val => {
+        treeRef.value!.filter(val)
+    },
+    {
+        deep: true
+    }
 )
 
 const hasChildrenInPlanTable = (nodeData: Plan.ResPlan) => {
-  try {
-    // 在 planTable 中查找对应的节点数据
-    const foundItem = tableData.value.find((item: any) => item.id === nodeData.id);
-    
-    // 检查是否有 children 且 children 数组不为空
-    return foundItem && Array.isArray(foundItem.children) && foundItem.children.length > 0;
-  } catch (error) {
-    console.error('检查子节点时出错:', error);
-    return false;
-  }
-};
+    try {
+        // 在 planTable 中查找对应的节点数据
+        const foundItem = tableData.value.find((item: any) => item.id === nodeData.id)
 
+        // 检查是否有 children 且 children 数组不为空
+        return foundItem && Array.isArray(foundItem.children) && foundItem.children.length > 0
+    } catch (error) {
+        console.error('检查子节点时出错:', error)
+        return false
+    }
+}
 
 const idd = ref('')
 const handleNodeClick = (data: Plan.ResPlan) => {
-
     if (data.name === '未检' || data.name === '检测中' || data.name === '检测完成') {
-      // 如果是父节点，不执行任何操作
-      //console.log('父节点不执行任何操作');
-      // 设置当前高亮节点
-    nextTick(() => {
-      treeRef.value?.setCurrentKey(idd.value);
-    });
-    return;
-  }
- 
-  idd.value = data.id
+        // 如果是父节点，不执行任何操作
+        //console.log('父节点不执行任何操作');
+        // 设置当前高亮节点
+        nextTick(() => {
+            treeRef.value?.setCurrentKey(idd.value)
+        })
+        return
+    }
 
-  checkStore.setPlan(data);
-  updateSelectedTreeNode(data.id)
+    idd.value = data.id
+
+    checkStore.setPlan(data)
+    updateSelectedTreeNode(data.id)
 }
 const filterNode = (value: string, data: any) => {
-  if (!value) return true
-   return data.name.includes(value)
+    if (!value) return true
+    return data.name.includes(value)
 }
 
 // 点击详情
 const detail = () => {
-  router.push('/plan/planList')
+    router.push('/plan/planList')
 }
 
-
 const childDetail = (data: Plan.ResPlan) => {
-  const filteredPlans = tableData.value.filter(item => item.id === data.id);
+    const filteredPlans = tableData.value.filter(item => item.id === data.id)
 
-  // 确保有匹配项再访问 [0]
-  if (filteredPlans.length > 0 && openSourceView.value) {
-    openSourceView.value.open("检测计划详情", filteredPlans[0]);
-  } 
+    // 确保有匹配项再访问 [0]
+    if (filteredPlans.length > 0 && openSourceView.value) {
+        openSourceView.value.open('检测计划详情', filteredPlans[0])
+    }
 }
 
-
 function buildTree(flatList: any[]): any[] {
-  const map = new Map();
-  const tree: any[] = [];
+    const map = new Map()
+    const tree: any[] = []
 
-  // First, create a map of all items by id for fast lookup
-  flatList.forEach(item => {
-    map.set(item.id, { ...item, children: [] });
-  });
+    // First, create a map of all items by id for fast lookup
+    flatList.forEach(item => {
+        map.set(item.id, { ...item, children: [] })
+    })
 
-  // Then, assign each item to its parent's children array
-  flatList.forEach(item => {
-    if (item.fatherPlanId && map.has(item.fatherPlanId)) {
-      map.get(item.fatherPlanId).children.push(map.get(item.id));
-    } else if (item.fatherPlanId === '0') {
-      // Items with fatherPlanId '0' are root nodes
-      tree.push(map.get(item.id));
-    }
-  });
+    // Then, assign each item to its parent's children array
+    flatList.forEach(item => {
+        if (item.fatherPlanId && map.has(item.fatherPlanId)) {
+            map.get(item.fatherPlanId).children.push(map.get(item.id))
+        } else if (item.fatherPlanId === '0') {
+            // Items with fatherPlanId '0' are root nodes
+            tree.push(map.get(item.id))
+        }
+    })
 
-  return tree;
+    return tree
 }
 
-
-
 const tableData = ref<any[]>([])
 onMounted(async () => {
-  if(modeStore.currentMode != '比对式')
-      return;
-  const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id;
-  const result = await getPlanList({'patternId' : patternId});
-  tableData.value = buildTree(result.data as any[]);
+    if (modeStore.currentMode != '比对式') return
+    const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id
+    const result = await getPlanList({ patternId: patternId })
+    tableData.value = buildTree(result.data as any[])
 })
 
-defineExpose({ getTreeData ,clickTableToTree})
-
-
+defineExpose({ getTreeData, clickTableToTree })
 </script>
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .plan_tree {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  background-color: #fff;
-
-  .search_view {
-    width: 100%;
-    height: auto;
+    height: 100%;
     display: flex;
-    justify-content: space-between;
-    padding: 0 5px;
-    box-sizing: border-box;
-    align-items: center;
+    flex-direction: column;
+    background-color: #fff;
+
+    .search_view {
+        width: 100%;
+        height: auto;
+        display: flex;
+        justify-content: space-between;
+        padding: 0 5px;
+        box-sizing: border-box;
+        align-items: center;
+
+        .el-input {
+            margin-top: 6px;
+        }
+    }
 
     .el-input {
-      margin-top: 6px;
+        width: 100%;
+        margin: 0 10px 10px 0;
     }
-  }
 
-  .el-input {
-    width: 100%;
-    margin: 0 10px 10px 0;
-  }
+    .tree_container {
+        height: 100%;
+        width: 100%;
+        flex: 1;
+        overflow-y: auto;
+        overflow-x: auto;
 
-  .tree_container {
-    height: 100%;
-    width: 100%;
-    flex: 1;
-    overflow-y: auto;
-    overflow-x: auto;
-
-    .el-tree {
-      // height: 100%;
-      width: auto;
+        .el-tree {
+            // height: 100%;
+            width: auto;
+        }
     }
-  }
 }
 
-
 .filter-tree {
-//  border: 1px solid #dcdfe6;
-  min-width: 100%;
-  height: 97%;
-  display: inline-block;
-  overflow: auto;
-  margin-top: 12px;
-
+    //  border: 1px solid #dcdfe6;
+    min-width: 100%;
+    height: 97%;
+    display: inline-block;
+    overflow: auto;
+    margin-top: 12px;
 }
 
 //.filter-tree span {
 //  font-size: 16px;
 //  display:block;
 //  overflow:hidden;
-  // word-break:keep-all;
-  // white-space:nowrap;
-  //  text-overflow:ellipsis;
+// word-break:keep-all;
+// white-space:nowrap;
+//  text-overflow:ellipsis;
 //   padding-right: 12px;
 //}
 .leftBox {
-  // float: left;
-  // width: 20%;
-  height: 100%;
-  width: 100%;
+    // float: left;
+    // width: 20%;
+    height: 100%;
+    width: 100%;
 }
 .left {
-  height: calc(100% - 45px);
-  overflow: auto;
+    height: calc(100% - 45px);
+    overflow: auto;
 }
 /* 设置滚动条宽度 */
 :deep(.bodyTwo ::-webkit-scrollbar) {
-    width: 3px !important; 
-    height: 6px !important;   
-  } 
+    width: 3px !important;
+    height: 6px !important;
+}
 </style>
diff --git a/frontend/src/views/plan/planList/components/childrenPlan.vue b/frontend/src/views/plan/planList/components/childrenPlan.vue
index ab4b58f..bc861b9 100644
--- a/frontend/src/views/plan/planList/components/childrenPlan.vue
+++ b/frontend/src/views/plan/planList/components/childrenPlan.vue
@@ -26,13 +26,31 @@
             <ProTable ref="proTable" :columns="columns" :request-api="getTableList" type="selection">
                 <!-- 表格 header 按钮 -->
                 <template #tableHeader="scope">
-                    <el-button type="primary" icon="CirclePlus" @click="addTab('add')" v-if="!isTabPlanFather">
+                    <el-button
+                        v-auth.plan="'add_subplan'"
+                        type="primary"
+                        icon="CirclePlus"
+                        @click="addTab('add')"
+                        v-if="!isTabPlanFather"
+                    >
                         新增子计划
                     </el-button>
-                    <el-button type="primary" icon="Edit" @click="addTab('edit')" v-if="isTabPlanFather">
+                    <el-button
+                        v-auth.plan="'add_subplan'"
+                        type="primary"
+                        icon="Edit"
+                        @click="addTab('edit')"
+                        v-if="isTabPlanFather"
+                    >
                         编辑子计划
                     </el-button>
-                    <el-button type="primary" icon="Download" @click="exportPlan" v-if="isTabPlanFather">
+                    <el-button
+                        type="primary"
+                        v-auth.plan="'export_subplan'"
+                        icon="Download"
+                        @click="exportPlan"
+                        v-if="isTabPlanFather"
+                    >
                         导出子计划元信息
                     </el-button>
                     <el-button type="primary" icon="Upload">导入检测结果</el-button>
@@ -48,6 +66,7 @@
                         批量移除
                     </el-button>
                     <el-dropdown
+                        v-auth.plan="'add_subplan'"
                         v-if="planFormContent && planFormContent?.children.length > 0"
                         trigger="hover"
                         placement="right-start"
@@ -75,6 +94,7 @@
                         </template>
                     </el-dropdown>
                     <el-dropdown
+                        v-auth.plan="'add_subplan'"
                         v-if="planFormContent && planFormContent?.children.length > 0"
                         trigger="hover"
                         placement="right-start"
diff --git a/frontend/src/views/plan/planList/index.vue b/frontend/src/views/plan/planList/index.vue
index 6513715..d4d7b47 100644
--- a/frontend/src/views/plan/planList/index.vue
+++ b/frontend/src/views/plan/planList/index.vue
@@ -32,7 +32,7 @@
         </el-button> -->
                 <el-button
                     type="primary"
-                    v-auth.plan="'import'"
+                    v-auth.plan="'import_subplan'"
                     icon="Upload"
                     @click="importSubClick"
                     v-if="modeStore.currentMode === '比对式'"
@@ -82,9 +82,20 @@
                     :icon="List"
                     @click="openChildrenPlan(scope.row)"
                     v-if="modeStore.currentMode == '比对式' && scope.row.fatherPlanId == 0"
+                    v-auth.plan="'add_subplan'"
                 >
                     子计划
                 </el-button>
+                <el-button
+                    type="primary"
+                    link
+                    icon="View"
+                    @click="openChildrenPlan(scope.row)"
+                    v-if="modeStore.currentMode == '比对式' && scope.row.fatherPlanId == 0"
+                    v-auth.plan="'import_subplan'"
+                >
+                    查看
+                </el-button>
                 <!-- <el-button type='primary' link :icon='List' @click='showDeviceOpen(scope.row)'>设备绑定</el-button> -->
                 <el-button
                     type="primary"