feat: 添加规则组选择功能

为规则测试页面添加了规则组选择功能，用户可以从下拉列表中选择规则组进行测试。

- 添加了规则组选择表单项
- 加载规则组列表的函数
- 调用API识别时传递规则组名称

Fixes #209

src/views/system/RuleTestView.vue

@@ -2,15 +2,17 @@
 import { reactive, ref } from 'vue'
 import { requiredValidator } from '@/@validators'
 import api from '@/api'
+import { FilterRuleGroup } from '@/api/types'
+import { title } from 'process'
 
 // 识别结果
 const ruleTestResult = ref('')
 
 // 名称识别表单
 const ruleTestForm = reactive({
-  title: '',
+  title: null,
-  subtitle: '',
+  subtitle: null,
-  ruletype: '1',
+  rulegroup: null,
 })
 
 // 识别按钮状态
@@ -22,10 +24,27 @@ const ruleTestText = ref('测试')
 // 是否显示结果
 const showResult = ref(false)
 
+// 所有规则组列表
+const filterRuleGroups = ref<FilterRuleGroup[]>([])
+
+// 规则组选项
+const filterRuleGroupItems = computed(() => {
+  return filterRuleGroups.value.map(item => ({ title: item.name, value: item.name }))
+})
+
+// 加载规则组
+async function queryFilterRuleGroups() {
+  try {
+    const result: { [key: string]: any } = await api.get('system/setting/UserFilterRuleGroups')
+    filterRuleGroups.value = result.data?.value ?? []
+  } catch (error) {
+    console.log(error)
+  }
+}
+
 // 调用API识别
 async function ruleTest() {
-  if (!ruleTestForm.title)
+  if (!ruleTestForm.title) return
-    return
 
   try {
     ruleTestLoading.value = true
@@ -35,69 +54,41 @@ async function ruleTest() {
       params: {
         title: ruleTestForm.title,
         subtitle: ruleTestForm.subtitle,
-        ruletype: ruleTestForm.ruletype,
+        rulegroup_name: ruleTestForm.rulegroup,
       },
     })
-    if (result.success)
+    if (result.success) ruleTestResult.value = `优先级：${result.data.priority}`
-      ruleTestResult.value = `优先级：${result.data.priority}`
+    else ruleTestResult.value = '未命中任何优先级规则！'
-
-    else
-      ruleTestResult.value = '未命中任何优先级规则！'
 
     ruleTestLoading.value = false
     ruleTestText.value = '重新测试'
     showResult.value = true
-  }
+  } catch (error) {
-  catch (error) {
     console.error(error)
   }
 }
+
+onMounted(() => {
+  queryFilterRuleGroups()
+})
 </script>
 
 <template>
   <VForm @submit.prevent="() => {}">
     <VRow class="pt-2">
       <VCol cols="12" md="8">
-        <VTextField
+        <VTextField v-model="ruleTestForm.title" label="标题" :rules="[requiredValidator]" />
-          v-model="ruleTestForm.title"
-          label="标题"
-          :rules="[requiredValidator]"
-        />
       </VCol>
       <VCol cols="12" md="4">
-        <VSelect
+        <VSelect v-model="ruleTestForm.rulegroup" label="规则组" :items="filterRuleGroupItems" />
-          v-model="ruleTestForm.ruletype"
-          label="规则类型"
-          :items="[{
-            title: '订阅优先级',
-            value: '1',
-          }, {
-            title: '洗版优先级',
-            value: '2',
-          }, {
-            title: '搜索优先级',
-            value: '3',
-          }]"
-        />
       </VCol>
       <VCol cols="12">
-        <VTextarea
+        <VTextarea v-model="ruleTestForm.subtitle" label="副标题" rows="2" auto-grow />
-          v-model="ruleTestForm.subtitle"
-          label="副标题"
-          rows="2"
-          auto-grow
-        />
       </VCol>
     </VRow>
     <VRow>
-      <VCol
+      <VCol cols="12" class="text-center">
-        cols="12"
+        <VBtn :disabled="ruleTestLoading" @click="ruleTest">
-        class="text-center"
-      >
-        <VBtn
-          :disabled="ruleTestLoading"
-          @click="ruleTest"
-        >
           <template #prepend>
             <VIcon icon="mdi-filter-check-outline" />
           </template>
@@ -109,9 +100,7 @@ async function ruleTest() {
   <VExpandTransition>
     <div v-show="showResult">
       <VCol>
-        <VAlert
+        <VAlert icon="mdi-alert-circle-outline">
-          icon="mdi-alert-circle-outline"
-        >
           {{ ruleTestResult }}
         </VAlert>
       </VCol>