UPDATE:优化子计划增删tab展示数据刷新问题

frontend/src/views/plan/planList/components/childrenPlan.vue

@@ -23,7 +23,7 @@
                     :closable="item.closable"
                 ></el-tab-pane>
             </el-tabs>
-            <ProTable ref="proTable" :columns="columns" :request-api="getTableList" type="selection">
+            <ProTable :key="planId" ref="proTable" :columns="columns" :request-api="getTableList" type="selection">
                 <!-- 表格 header 按钮 -->
                 <template #tableHeader="scope">
                     <el-button
@@ -169,7 +169,7 @@
 </template>
 <script setup lang="tsx">
 import { ElMessage, ElMessageBox, TabPaneName } from 'element-plus'
-import { computed, reactive, ref } from 'vue'
+import { reactive, ref } from 'vue'
 import PlanPopup from '@/views/plan/planList/components/planPopup.vue' // 导入子组件
 import { Plan } from '@/api/plan/interface'
 import { useModeStore } from '@/stores/modules/mode' // 引入模式 store
@@ -332,9 +332,9 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
     },
     { prop: 'operation', label: '操作', fixed: 'right', width: 100 }
 ])
+const editableTabs = ref<any[]>([])
 
-const editableTabs = computed(() => {
-    console.log('editableTabs', planFormContent.value)
+const renderTabs = () => {
     const tabs = []
     // 主计划 tab
     if (planFormContent.value) {
@@ -354,8 +354,8 @@ const editableTabs = computed(() => {
             })
         })
     }
-    return tabs
-})
+    editableTabs.value = tabs
+}
 
 //解绑被检设备
 const unbindDevice = (row: any) => {
@@ -401,6 +401,7 @@ const addTab = (type: string) => {
 //收到子组件回复后新增子计划tab
 const addNewChildTab = async () => {
     await props.refreshTable!() //刷新检测计划列表
+    renderTabs()
 }
 
 //分配被检设备
@@ -445,7 +446,14 @@ const removeTab = async (targetName: TabPaneName) => {
     const tabTitle = tab?.title || '未知计划' // 获取 tab 的标题，若不存在则默认为 '未知计划'
 
     await useHandleData(deletePlan, { id: [targetName], pattern: patternId.value }, `删除【${tabTitle}】检测计划`)
+    const tabs = editableTabs.value
+
+    const mainTab = editableTabs.value.find(item => !item.closable)
+    editableTabsValue.value = mainTab.name
+    editableTabs.value = tabs.filter(tab => tab.name !== targetName)
     await props.refreshTable!() //刷新检测计划列表
+
+    handleTabClick({ props: mainTab })
 }
 
 // 弹窗打开方法
@@ -466,6 +474,7 @@ const open = async (textTitle: string, data: Plan.ReqPlan, pattern: string) => {
             item.isShow = false
         }
     })
+    renderTabs()
 }
 
 const handleTabClick = (tab: any) => {