feat(接口测试): 接口定义页面回收站后增加统计数量展示

https://www.tapd.cn/55049933/s/1504569

frontend/src/views/api-test/management/components/management/api/apiTable.vue

@@ -409,6 +409,7 @@
       },
       fixed: 'left',
       width: 100,
+      columnSelectorDisabled: true,
     },
     {
       title: 'apiTestManagement.apiName',
@@ -419,6 +420,7 @@
         sorter: true,
       },
       width: 200,
+      columnSelectorDisabled: true,
     },
     {
       title: 'apiTestManagement.apiType',

frontend/src/views/api-test/management/components/management/case/caseTable.vue

@@ -462,6 +462,7 @@
       width: 130,
       ellipsis: true,
       showTooltip: true,
+      columnSelectorDisabled: true,
     },
     {
       title: 'case.caseName',
@@ -472,6 +473,7 @@
         sorter: true,
       },
       width: 180,
+      columnSelectorDisabled: true,
     },
     {
       title: 'case.caseLevel',

frontend/src/views/api-test/management/components/recycle/api/apiTable.vue

@@ -188,6 +188,7 @@
         sorter: true,
       },
       fixed: 'left',
+      columnSelectorDisabled: true,
       width: 100,
     },
     {
@@ -199,6 +200,7 @@
         sorter: true,
       },
       width: 200,
+      columnSelectorDisabled: true,
     },
     {
       title: 'apiTestManagement.apiType',

frontend/src/views/api-test/management/components/recycle/case/caseTable.vue

@@ -266,6 +266,7 @@
       },
       fixed: 'left',
       width: 100,
+      columnSelectorDisabled: true,
     },
     {
       title: 'case.caseName',
@@ -276,6 +277,7 @@
         sorter: true,
       },
       width: 180,
+      columnSelectorDisabled: true,
     },
     {
       title: 'case.caseLevel',

frontend/src/views/api-test/management/index.vue

@@ -28,6 +28,7 @@
               >
                 <MsIcon type="icon-icon_delete-trash_outlined" class="folder-icon" />
                 <div class="folder-name mx-[4px]">{{ t('caseManagement.featureCase.recycle') }}</div>
+                <div class="folder-count">({{ recycleModulesCount || 0 }})</div>
               </div>
             </div>
           </div>
@@ -76,12 +77,15 @@
   import management from './components/management/index.vue';
   import moduleTree from './components/moduleTree.vue';
 
+  import { getTrashModuleCount } from '@/api/modules/api-test/management';
   import { useI18n } from '@/hooks/useI18n';
 
   import { ApiDefinitionGetModuleParams } from '@/models/apiTest/management';
   import { ModuleTreeNode } from '@/models/common';
   import { ApiTestRouteEnum } from '@/enums/routeEnum';
 
+  import useAppStore from '../../../store/modules/app';
+
   const route = useRoute();
   const { t } = useI18n();
   const router = useRouter();
@@ -128,8 +132,22 @@
     protocol.value = val;
   }
 
+  const appStore = useAppStore();
+  const recycleModulesCount = ref(0);
+  async function selectRecycleCount() {
+    const res = await getTrashModuleCount({
+      projectId: appStore.currentProjectId,
+      keyword: '',
+      moduleIds: [],
+      protocol: protocol.value,
+    });
+    recycleModulesCount.value = res.all;
+  }
+
   function refreshModuleTree() {
     moduleTreeRef.value?.refresh();
+    //  涉及到模块树的刷新操作（比如删除），也会刷新回收站的数量
+    selectRecycleCount();
   }
 
   function refreshModuleTreeCount(params: ApiDefinitionGetModuleParams) {
@@ -161,6 +179,7 @@
       // 携带 cId 参数，自动打开接口用例详情 tab
       managementRef.value?.newCaseTab(route.query.cId as string);
     }
+    selectRecycleCount();
   });
 
   // 获取激活用例类型样式