feat(项目管理): 项目管理应用设置误报规则展示调整

frontend/src/views/project-management/projectAndPermission/menuManagement/components/falseAlermRule.vue

@@ -62,7 +62,7 @@
 </template>
 
 <script async lang="ts" setup>
-  import { useRouter } from 'vue-router';
+  import { useRoute, useRouter } from 'vue-router';
   import { Message, TableData } from '@arco-design/web-vue';
 
   import MsButton from '@/components/pure/ms-button/index.vue';
@@ -97,6 +97,7 @@
   const { t } = useI18n();
   const appStore = useAppStore();
   const router = useRouter();
+  const route = useRoute();
   const currentProjectId = computed(() => appStore.currentProjectId);
   const addVisible = ref(false);
   const addLoading = ref(false);
@@ -207,6 +208,18 @@
       dataIndex: 'enable',
       width: 143,
       permission: ['PROJECT_APPLICATION_API:UPDATE'],
+      filterConfig: {
+        options: [
+          {
+            value: true,
+            label: t('common.enable'),
+          },
+          {
+            value: false,
+            label: t('common.close'),
+          },
+        ],
+      },
     },
     {
       title: 'project.menu.rule.label',
@@ -456,7 +469,14 @@
   }
 
   onMounted(() => {
-    setLoadListParams({ projectId: currentProjectId.value });
+    const { status } = route.query;
+    const enabledStatus = status === 'all' ? [] : [true];
+    setLoadListParams({
+      projectId: currentProjectId.value,
+      filter: {
+        enable: [enabledStatus],
+      },
+    });
     fetchData();
   });
 </script>

frontend/src/views/project-management/projectAndPermission/menuManagement/locale/en-US.ts

@@ -107,4 +107,7 @@ export default {
   'project.menu.rule.deleteRule': 'Confirm to delete {size} false alert rules?',
   'project.menu.rule.deleteRuleTip':
     'After deletion, it only takes effect on newly executed test reports. Please be cautious!',
+  'project.menu.rule.hasBeenEnabled': 'Have been enabled',
+  'project.menu.rule.bar': 'number',
+  'project.menu.rule.ruleAlertList': 'List of false alarm rules',
 };

frontend/src/views/project-management/projectAndPermission/menuManagement/locale/zh-CN.ts

@@ -94,4 +94,7 @@ export default {
   'project.menu.rule.enableRuleTip': '启用后，接口返回结果会优先进行误报规则匹配。',
   'project.menu.rule.deleteRule': '确认删除 {size} 条误报规则吗？',
   'project.menu.rule.deleteRuleTip': '删除后，仅对新执行的测试报告生效，请谨慎操作！',
+  'project.menu.rule.hasBeenEnabled': '已启用',
+  'project.menu.rule.bar': '条',
+  'project.menu.rule.ruleAlertList': '误报规则列表',
 };

frontend/src/views/project-management/projectAndPermission/menuManagement/menuManagement.vue

@@ -130,19 +130,15 @@
       <div v-if="record.type === 'API_ERROR_REPORT_RULE'" class="flex w-[100%] flex-row items-center">
         <!--接口测试 误报规则 -->
         <div class="error-report">
-          <a-input-number
-            v-model="allValueMap['FAKE_ERROR_NUM']"
-            class="w-[120px]"
-            disabled
-            :placeholder="t('project.menu.pleaseConfig')"
-          >
-            <template #append>
-              <div>{{ t('project.menu.count') }}</div>
-            </template>
-          </a-input-number>
+          {{ t('project.menu.rule.hasBeenEnabled') }}
+          <span class="text-[rgb(var(--primary-5))]" @click="pushFar(true)">
+            <!-- TODO 待测试字段后台还没有补充 -->
+            {{ allValueMap['ENABLE_FAKE_ERROR_NUM'] || 0 }}
+          </span>
+          {{ t('project.menu.rule.bar') }}
         </div>
-        <div class="ml-[8px] cursor-pointer text-[rgb(var(--primary-7))]" @click="pushFar">
-          {{ t('project.menu.API_ERROR_REPORT_RULE') }}
+        <div class="ml-[8px] cursor-pointer font-medium text-[rgb(var(--primary-5))]" @click="pushFar(false)">
+          {{ t('project.menu.rule.ruleAlertList') }}
         </div>
         <a-tooltip :content="t('project.menu.API_ERROR_REPORT_RULE_TIP')" position="right">
           <div>
@@ -479,7 +475,7 @@
 
   const noTitleColumns = [
     {
-      title: '',
+      title: 'project.menu.name',
       dataIndex: 'module',
       slotName: 'module',
       width: 221,
@@ -845,8 +841,13 @@
     relatedCaseDrawerVisible.value = true;
   };
   // 跳转到误报规则列表页
-  const pushFar = () => {
-    router.push({ name: ProjectManagementRouteEnum.PROJECT_MANAGEMENT_MENU_MANAGEMENT_ERROR_REPORT_RULE });
+  const pushFar = (isEnable: boolean) => {
+    router.push({
+      name: ProjectManagementRouteEnum.PROJECT_MANAGEMENT_MENU_MANAGEMENT_ERROR_REPORT_RULE,
+      query: {
+        status: isEnable ? 'enable' : 'all',
+      },
+    });
   };
 
   // 获取执行资源池的名称