feat: add admin UI for AST rule configuration

src/admin/problem/components/AstRulesEditor.vue

@@ -0,0 +1,241 @@
+<script setup lang="ts">
+import type { LANGUAGE } from "utils/types"
+
+interface AstRule {
+  engine: string
+  target?: string
+  min?: number
+  max?: number
+  message: string
+}
+
+interface Props {
+  modelValue: { [key: string]: AstRule[] } | null
+  languages: LANGUAGE[]
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<{
+  (e: "update:modelValue", value: { [key: string]: AstRule[] } | null): void
+}>()
+
+const activeTab = ref(props.languages[0] || "Python3")
+
+const ENGINE_OPTIONS: SelectOption[] = [
+  { label: "节点检查", type: "group", key: "node_group", children: [
+    { label: "必须存在", value: "must_exist_node" },
+    { label: "不能存在", value: "must_not_exist_node" },
+    { label: "出现次数", value: "count_node" },
+  ]},
+  { label: "函数调用", type: "group", key: "func_group", children: [
+    { label: "必须调用函数", value: "must_call_function" },
+    { label: "不能调用函数", value: "must_not_call_function" },
+    { label: "函数调用次数", value: "count_function_call" },
+  ]},
+  { label: "方法调用", type: "group", key: "method_group", children: [
+    { label: "必须调用方法", value: "must_call_method" },
+    { label: "不能调用方法", value: "must_not_call_method" },
+  ]},
+  { label: "运算符", type: "group", key: "op_group", children: [
+    { label: "必须使用运算符", value: "must_use_operator" },
+  ]},
+]
+
+const NODE_TARGET_OPTIONS: SelectOption[] = [
+  { label: "for 循环", value: "for_loop" },
+  { label: "while 循环", value: "while_loop" },
+  { label: "if 条件", value: "if_statement" },
+  { label: "else 子句", value: "else_clause" },
+  { label: "函数定义", value: "function_definition" },
+  { label: "return 语句", value: "return" },
+  { label: "break 语句", value: "break" },
+  { label: "continue 语句", value: "continue" },
+  { label: "列表推导式", value: "list_comprehension" },
+  { label: "列表", value: "list_literal" },
+  { label: "字典", value: "dict_literal" },
+  { label: "集合", value: "set_literal" },
+  { label: "f-string", value: "f_string" },
+  { label: "try-except", value: "try_except" },
+  { label: "类定义", value: "class_definition" },
+]
+
+const OPERATOR_TARGET_OPTIONS: SelectOption[] = [
+  { label: "+", value: "+" },
+  { label: "-", value: "-" },
+  { label: "*", value: "*" },
+  { label: "/", value: "/" },
+  { label: "//", value: "//" },
+  { label: "%", value: "%" },
+  { label: "**", value: "**" },
+  { label: "+=", value: "+=" },
+  { label: "-=", value: "-=" },
+  { label: "==", value: "==" },
+  { label: "!=", value: "!=" },
+  { label: ">", value: ">" },
+  { label: ">=", value: ">=" },
+  { label: "<", value: "<" },
+  { label: "<=", value: "<=" },
+  { label: "and / &&", value: "and" },
+  { label: "or / ||", value: "or" },
+  { label: "not / !", value: "not" },
+]
+
+const NODE_ENGINES = ["must_exist_node", "must_not_exist_node", "count_node"]
+const FUNCTION_ENGINES = ["must_call_function", "must_not_call_function", "count_function_call"]
+const METHOD_ENGINES = ["must_call_method", "must_not_call_method"]
+const OPERATOR_ENGINES = ["must_use_operator"]
+const COUNT_ENGINES = ["count_node", "count_function_call"]
+
+function isNodeEngine(engine: string) { return NODE_ENGINES.includes(engine) }
+function isFunctionEngine(engine: string) { return FUNCTION_ENGINES.includes(engine) }
+function isMethodEngine(engine: string) { return METHOD_ENGINES.includes(engine) }
+function isOperatorEngine(engine: string) { return OPERATOR_ENGINES.includes(engine) }
+function isCountEngine(engine: string) { return COUNT_ENGINES.includes(engine) }
+
+function needsTargetDropdown(engine: string) { return isNodeEngine(engine) }
+function needsTargetInput(engine: string) { return isFunctionEngine(engine) || isMethodEngine(engine) }
+function needsOperatorDropdown(engine: string) { return isOperatorEngine(engine) }
+
+function getRulesForLang(lang: string): AstRule[] {
+  if (!props.modelValue) return []
+  return props.modelValue[lang] || []
+}
+
+function updateRules(lang: string, rules: AstRule[]) {
+  const current = { ...(props.modelValue || {}) }
+  if (rules.length === 0) {
+    delete current[lang]
+  } else {
+    current[lang] = rules
+  }
+  emit("update:modelValue", Object.keys(current).length > 0 ? current : null)
+}
+
+function addRule(lang: string) {
+  const rules = [...getRulesForLang(lang)]
+  rules.push({ engine: "must_exist_node", target: "for_loop", message: "" })
+  updateRules(lang, rules)
+}
+
+function removeRule(lang: string, index: number) {
+  const rules = [...getRulesForLang(lang)]
+  rules.splice(index, 1)
+  updateRules(lang, rules)
+}
+
+function updateRule(lang: string, index: number, field: string, value: any) {
+  const rules = [...getRulesForLang(lang)]
+  const rule = { ...rules[index] }
+
+  if (field === "engine") {
+    rule.engine = value
+    if (isNodeEngine(value)) rule.target = "for_loop"
+    else if (isOperatorEngine(value)) rule.target = "+"
+    else rule.target = ""
+    delete rule.min
+    delete rule.max
+  } else if (field === "target") {
+    rule.target = value
+  } else if (field === "min") {
+    if (value === null || value === undefined) delete rule.min
+    else rule.min = value
+  } else if (field === "max") {
+    if (value === null || value === undefined) delete rule.max
+    else rule.max = value
+  } else if (field === "message") {
+    rule.message = value
+  }
+
+  rules[index] = rule
+  updateRules(lang, rules)
+}
+
+watch(() => props.languages, (langs) => {
+  if (langs.length && !langs.includes(activeTab.value as LANGUAGE)) {
+    activeTab.value = langs[0]
+  }
+})
+</script>
+
+<template>
+  <n-collapse>
+    <n-collapse-item title="代码规则检查（选填）" name="ast-rules">
+      <n-tabs v-if="languages.length" type="segment" v-model:value="activeTab">
+        <n-tab-pane v-for="lang in languages" :key="lang" :name="lang" :tab="lang">
+          <n-flex vertical>
+            <div v-for="(rule, index) in getRulesForLang(lang)" :key="index" style="margin-bottom: 8px">
+              <n-flex align="center" :wrap="true">
+                <n-select
+                  :options="ENGINE_OPTIONS"
+                  :value="rule.engine"
+                  @update:value="(v: string) => updateRule(lang, index, 'engine', v)"
+                  style="width: 160px"
+                  size="small"
+                />
+                <n-select
+                  v-if="needsTargetDropdown(rule.engine)"
+                  :options="NODE_TARGET_OPTIONS"
+                  :value="rule.target"
+                  @update:value="(v: string) => updateRule(lang, index, 'target', v)"
+                  style="width: 140px"
+                  size="small"
+                  filterable
+                />
+                <n-input
+                  v-if="needsTargetInput(rule.engine)"
+                  :value="rule.target"
+                  @update:value="(v: string) => updateRule(lang, index, 'target', v)"
+                  placeholder="函数/方法名"
+                  style="width: 120px"
+                  size="small"
+                />
+                <n-select
+                  v-if="needsOperatorDropdown(rule.engine)"
+                  :options="OPERATOR_TARGET_OPTIONS"
+                  :value="rule.target"
+                  @update:value="(v: string) => updateRule(lang, index, 'target', v)"
+                  style="width: 100px"
+                  size="small"
+                />
+                <n-input-number
+                  v-if="isCountEngine(rule.engine)"
+                  :value="rule.min ?? null"
+                  @update:value="(v: number | null) => updateRule(lang, index, 'min', v)"
+                  placeholder="最少"
+                  style="width: 90px"
+                  size="small"
+                  :min="0"
+                  clearable
+                />
+                <n-input-number
+                  v-if="isCountEngine(rule.engine)"
+                  :value="rule.max ?? null"
+                  @update:value="(v: number | null) => updateRule(lang, index, 'max', v)"
+                  placeholder="最多"
+                  style="width: 90px"
+                  size="small"
+                  :min="0"
+                  clearable
+                />
+                <n-input
+                  :value="rule.message"
+                  @update:value="(v: string) => updateRule(lang, index, 'message', v)"
+                  placeholder="错误提示（选填）"
+                  style="width: 200px"
+                  size="small"
+                />
+                <n-button size="small" tertiary type="error" @click="removeRule(lang, index)">
+                  删除
+                </n-button>
+              </n-flex>
+            </div>
+            <n-button size="small" tertiary type="primary" @click="addRule(lang)">
+              添加规则
+            </n-button>
+          </n-flex>
+        </n-tab-pane>
+      </n-tabs>
+      <n-empty v-else description="请先选择编程语言" />
+    </n-collapse-item>
+  </n-collapse>
+</template>

src/admin/problem/detail.vue

@@ -2,6 +2,7 @@
 import { getProblemTagList } from "shared/api"
 import TextEditor from "shared/components/TextEditor.vue"
 import TestcaseGenerator from "./components/TestcaseGenerator.vue"
+import AstRulesEditor from "./components/AstRulesEditor.vue"
 import {
   CODE_TEMPLATES,
   LANGUAGE_SHOW_VALUE,
@@ -87,6 +88,7 @@ const problem = useLocalStorage<BlankProblem>(STORAGE_KEY.ADMIN_PROBLEM, {
   flowchart_data: {},
   flowchart_hint: "",
   show_flowchart: false,
+  ast_rules: null as { [key: string]: any[] } | null,
 })
 
 // 从服务器来的tag列表
@@ -176,6 +178,7 @@ async function getProblemDetail() {
     problem.value.mermaid_code = data.mermaid_code ?? ""
     problem.value.flowchart_hint = data.flowchart_hint ?? ""
     problem.value.flowchart_data = data.flowchart_data
+    problem.value.ast_rules = data.ast_rules ?? null
     if (data.answers && data.answers.length) {
       problem.value.answers = data.answers
     } else {
@@ -643,6 +646,11 @@ watch(
     </n-gi>
   </n-grid>
 
+  <AstRulesEditor
+    v-model="problem.ast_rules"
+    :languages="problem.languages"
+  />
+
   <n-divider />
 
   <h2 class="title">测试用例区域</h2>