From 63e58593d77a3794583e5aefd72cdfbe80672e6b Mon Sep 17 00:00:00 2001
From: yuetsh <517252939@qq.com>
Date: Mon, 20 Oct 2025 20:05:16 +0800
Subject: [PATCH] add flowchart

---
 src/admin/problem/components/Modal.vue        |   2 +-
 src/oj/ai/components/SolvedTable.vue          |  66 +++++++-
 src/oj/api.ts                                 |   5 +-
 src/oj/store/ai.ts                            |   2 +
 .../submission/components/FlowchartLink.vue   |  25 +++
 src/oj/submission/components/Grade.vue        |  25 +++
 src/oj/submission/list.vue                    | 153 +++++++++++++-----
 src/utils/constants.ts                        |   1 +
 src/utils/types.ts                            |  25 ++-
 9 files changed, 259 insertions(+), 45 deletions(-)
 create mode 100644 src/oj/submission/components/FlowchartLink.vue
 create mode 100644 src/oj/submission/components/Grade.vue

diff --git a/src/admin/problem/components/Modal.vue b/src/admin/problem/components/Modal.vue
index 272f146..561a1c7 100644
--- a/src/admin/problem/components/Modal.vue
+++ b/src/admin/problem/components/Modal.vue
@@ -47,7 +47,7 @@ async function getList() {
     query.limit,
     query.keyword,
     "",
-    "ACM",
+    "",
   )
   total.value = res.total
   problems.value = res.results
diff --git a/src/oj/ai/components/SolvedTable.vue b/src/oj/ai/components/SolvedTable.vue
index 43760dd..2926d12 100644
--- a/src/oj/ai/components/SolvedTable.vue
+++ b/src/oj/ai/components/SolvedTable.vue
@@ -1,8 +1,28 @@
 <template>
+  <n-tabs animated v-if="submissions.length && flowcharts.length">
+    <n-tab-pane name="代码提交">
+      <n-data-table
+        v-if="submissions.length"
+        striped
+        :data="submissions"
+        :columns="columns"
+        :max-height="isDesktop ? 1500 : 500"
+      />
+    </n-tab-pane>
+    <n-tab-pane name="流程图提交">
+      <n-data-table
+        v-if="flowcharts.length"
+        striped
+        :data="flowcharts"
+        :columns="flowchartsColumns"
+        :max-height="isDesktop ? 1500 : 500"
+      />
+    </n-tab-pane>
+  </n-tabs>
   <n-data-table
-    v-if="solvedProblems.length"
+    v-if="submissions.length && !flowcharts.length"
     striped
-    :data="solvedProblems"
+    :data="submissions"
     :columns="columns"
     :max-height="isDesktop ? 1500 : 500"
   />
@@ -11,17 +31,18 @@
 <script lang="ts" setup>
 import { NButton } from "naive-ui"
 import TagTitle from "./TagTitle.vue"
-import { SolvedProblem } from "utils/types"
+import { FlowchartSummary, SolvedProblem } from "utils/types"
 import { useAIStore } from "oj/store/ai"
 import { useBreakpoints } from "shared/composables/breakpoints"
+import { parseTime } from "utils/functions"
 
 const router = useRouter()
 const aiStore = useAIStore()
 
 const { isDesktop } = useBreakpoints()
 
-const solvedProblems = computed(() => aiStore.detailsData.solved)
-
+const submissions = computed(() => aiStore.detailsData.solved)
+const flowcharts = computed(() => aiStore.detailsData.flowcharts)
 const columns: DataTableColumn<SolvedProblem>[] = [
   {
     title: "完成的题目",
@@ -67,4 +88,39 @@ const columns: DataTableColumn<SolvedProblem>[] = [
     align: "center",
   },
 ]
+
+const flowchartsColumns: DataTableColumn<FlowchartSummary>[] = [
+  {
+    title: "完成的题目",
+    key: "problem_title",
+    width: 300,
+    render: (row) =>
+      h(
+        NButton,
+        {
+          text: true,
+          onClick: () => {
+            router.push("/problem/" + row.problem__id)
+          },
+        },
+        () => `${row.problem__id} ${row.problem_title}`,
+      ),
+  },
+  { title: "提交次数", key: "submission_count", width: 100, align: "center" },
+  {
+    title: "最高分",
+    key: "best",
+    width: 100,
+    align: "center",
+    render: (row) => `${row.best_score} (${row.best_grade})`,
+  },
+  {
+    title: "最新提交时间",
+    key: "latest_submission_time",
+    width: 200,
+    align: "center",
+    render: (row) => parseTime(row.latest_submission_time),
+  },
+  { title: "平均分", key: "avg_score", width: 100, align: "center" },
+]
 </script>
diff --git a/src/oj/api.ts b/src/oj/api.ts
index 347a685..aa284bb 100644
--- a/src/oj/api.ts
+++ b/src/oj/api.ts
@@ -283,8 +283,9 @@ export function getFlowchartSubmission(id: string) {
 }
 
 export function getFlowchartSubmissions(params: {
-  user_id?: number
-  problem_id?: number
+  username?: string
+  problem_id?: string
+  myself?: string
   offset?: number
   limit?: number
 }) {
diff --git a/src/oj/store/ai.ts b/src/oj/store/ai.ts
index f9f93e7..27ab04e 100644
--- a/src/oj/store/ai.ts
+++ b/src/oj/store/ai.ts
@@ -15,6 +15,7 @@ export const useAIStore = defineStore("ai", () => {
     difficulty: {},
     contest_count: 0,
     solved: [],
+    flowcharts: [],
   })
   const heatmapData = ref<{ timestamp: number; value: number }[]>([])
 
@@ -36,6 +37,7 @@ export const useAIStore = defineStore("ai", () => {
     detailsData.tags = res.data.tags
     detailsData.difficulty = res.data.difficulty
     detailsData.contest_count = res.data.contest_count
+    detailsData.flowcharts = res.data.flowcharts
   }
 
   async function fetchDurationData(end: string, duration: string) {
diff --git a/src/oj/submission/components/FlowchartLink.vue b/src/oj/submission/components/FlowchartLink.vue
new file mode 100644
index 0000000..24793ae
--- /dev/null
+++ b/src/oj/submission/components/FlowchartLink.vue
@@ -0,0 +1,25 @@
+<template>
+  <n-button v-if="showLink" type="info" text @click="goto">
+    {{ flowchart.id.slice(0, 12) }}
+  </n-button>
+  <n-text v-else>{{ flowchart.id.slice(0, 12) }}</n-text>
+</template>
+<script setup lang="ts">
+import { useUserStore } from "shared/store/user"
+import { FlowchartSubmissionListItem } from "utils/types"
+
+const userStore = useUserStore()
+
+interface Props {
+  flowchart: FlowchartSubmissionListItem
+}
+const props = defineProps<Props>()
+
+const showLink = computed(() => {
+  if (!userStore.isAuthed) return false
+  if (userStore.isSuperAdmin) return true
+  return props.flowchart.username === userStore.user?.username
+})
+
+function goto() {}
+</script>
diff --git a/src/oj/submission/components/Grade.vue b/src/oj/submission/components/Grade.vue
new file mode 100644
index 0000000..b6b2ce8
--- /dev/null
+++ b/src/oj/submission/components/Grade.vue
@@ -0,0 +1,25 @@
+<template>
+  <n-text :type="gradeType(grade)">
+    <span>{{ score }}</span>
+    <span>({{ grade }})</span>
+  </n-text>
+</template>
+<script setup lang="ts">
+import { Grade } from "utils/types"
+defineProps<{
+  score: number
+  grade: Grade
+}>()
+
+function gradeType(grade: Grade) {
+  return (
+    {
+      S: "success",
+      A: "info",
+      B: "warning",
+      C: "error",
+    } as const
+  )[grade]
+}
+</script>
+<style scoped></style>
diff --git a/src/oj/submission/list.vue b/src/oj/submission/list.vue
index d77b3f4..16f0dbd 100644
--- a/src/oj/submission/list.vue
+++ b/src/oj/submission/list.vue
@@ -1,9 +1,18 @@
 <script setup lang="ts">
 import { NButton, NH2, NText } from "naive-ui"
 import { useRouteQuery } from "@vueuse/router"
-import { adminRejudge, getSubmissions, getTodaySubmissionCount } from "oj/api"
+import {
+  adminRejudge,
+  getFlowchartSubmissions,
+  getSubmissions,
+  getTodaySubmissionCount,
+} from "oj/api"
 import { parseTime } from "utils/functions"
-import { LANGUAGE, SubmissionListItem } from "utils/types"
+import {
+  FlowchartSubmissionListItem,
+  LANGUAGE,
+  SubmissionListItem,
+} from "utils/types"
 import Pagination from "shared/components/Pagination.vue"
 import SubmissionResultTag from "shared/components/SubmissionResultTag.vue"
 import { useBreakpoints } from "shared/composables/breakpoints"
@@ -16,6 +25,8 @@ import StatisticsPanel from "shared/components/StatisticsPanel.vue"
 import SubmissionLink from "./components/SubmissionLink.vue"
 import SubmissionDetail from "./detail.vue"
 import IconButton from "shared/components/IconButton.vue"
+import Grade from "./components/Grade.vue"
+import FlowchartLink from "./components/FlowchartLink.vue"
 
 interface SubmissionQuery {
   username: string
@@ -33,6 +44,7 @@ const message = useMessage()
 const { isMobile, isDesktop } = useBreakpoints()
 
 const submissions = ref<SubmissionListItem[]>([])
+const flowcharts = ref<FlowchartSubmissionListItem[]>([])
 const total = ref(0)
 const todayCount = ref(0)
 
@@ -58,7 +70,8 @@ const resultOptions: SelectOption[] = [
 ]
 
 const languageOptions: SelectOption[] = [
-  { label: "全部", value: "" },
+  { label: "流程图", value: "Flowchart" },
+  { label: "全部语言", value: "" },
   { label: "Python", value: "Python3" },
   { label: "C语言", value: "C" },
   { label: "C++", value: "C++" },
@@ -66,15 +79,27 @@ const languageOptions: SelectOption[] = [
 async function listSubmissions() {
   if (query.page < 1) query.page = 1
   const offset = query.limit * (query.page - 1)
-  const res = await getSubmissions({
-    ...query,
-    offset,
-    problem_id: query.problem,
-    contest_id: <string>route.params.contestID ?? "",
-    language: query.language,
-  })
-  submissions.value = res.data.results
-  total.value = res.data.total
+  if (query.language === "Flowchart") {
+    const res = await getFlowchartSubmissions({
+      username: query.username,
+      problem_id: query.problem,
+      myself: query.myself,
+      offset,
+      limit: query.limit,
+    })
+    total.value = res.data.total
+    flowcharts.value = res.data.results
+  } else {
+    const res = await getSubmissions({
+      ...query,
+      offset,
+      problem_id: query.problem,
+      contest_id: <string>route.params.contestID ?? "",
+      language: query.language,
+    })
+    submissions.value = res.data.results
+    total.value = res.data.total
+  }
 }
 
 async function getTodayCount() {
@@ -104,7 +129,7 @@ async function rejudge(submissionID: string) {
   listSubmissions()
 }
 
-function problemClicked(row: SubmissionListItem) {
+function problemClicked(row: SubmissionListItem | FlowchartSubmissionListItem) {
   if (route.name === "contest submissions") {
     const path = router.resolve({
       name: "contest problem",
@@ -136,27 +161,18 @@ watch(
   listSubmissions,
 )
 
-watch(
-  () =>
-    (route.name === "submissions" || route.name === "contest submissions") &&
-    route.query,
-  (newVal) => {
-    if (newVal) listSubmissions()
-  },
-)
-
 const columns = computed(() => {
   const res: DataTableColumn<SubmissionListItem>[] = [
     {
       title: renderTableTitle("提交时间", "noto:seven-oclock"),
       key: "create_time",
-      width: 200,
+      minWidth: 200,
       render: (row) => parseTime(row.create_time, "YYYY-MM-DD HH:mm:ss"),
     },
     {
       title: renderTableTitle("提交编号", "fluent-emoji-flat:input-numbers"),
       key: "id",
-      minWidth: 180,
+      minWidth: 200,
       render: (row) =>
         h(SubmissionLink, {
           submission: row,
@@ -166,13 +182,13 @@ const columns = computed(() => {
     {
       title: renderTableTitle("状态", "streamline-emojis:panda-face"),
       key: "status",
-      width: 140,
+      minWidth: 140,
       render: (row) => h(SubmissionResultTag, { result: row.result }),
     },
     {
       title: renderTableTitle("题目", "streamline-emojis:blossom"),
       key: "problem",
-      width: 160,
+      minWidth: 300,
       render: (row) =>
         h(
           ButtonWithSearch,
@@ -181,7 +197,7 @@ const columns = computed(() => {
             onClick: () => problemClicked(row),
             onSearch: () => (query.problem = row.problem),
           },
-          () => row.problem,
+          () => `${row.problem} ${row.problem_title}`,
         ),
     },
     {
@@ -190,7 +206,7 @@ const columns = computed(() => {
         "streamline-emojis:globe-showing-europe-africa",
       ),
       key: "language",
-      width: 120,
+      minWidth: 120,
       render: (row) => LANGUAGE_SHOW_VALUE[row.language],
     },
     {
@@ -233,6 +249,58 @@ const columns = computed(() => {
   }
   return res
 })
+
+const flowchartColumns: DataTableColumn<FlowchartSubmissionListItem>[] = [
+  {
+    title: renderTableTitle("提交时间", "noto:seven-oclock"),
+    key: "create_time",
+    render: (row) => parseTime(row.create_time, "YYYY-MM-DD HH:mm:ss"),
+  },
+  {
+    title: renderTableTitle("提交编号", "fluent-emoji-flat:input-numbers"),
+    key: "id",
+    render: (row) => h(FlowchartLink, { flowchart: row }),
+  },
+  {
+    title: renderTableTitle("题目", "streamline-emojis:blossom"),
+    key: "problem_title",
+    render: (row) =>
+      h(
+        ButtonWithSearch,
+        {
+          type: "题目",
+          onClick: () => problemClicked(row),
+          onSearch: () => (query.problem = row.problem),
+        },
+        () => `${row.problem} ${row.problem_title}`,
+      ),
+  },
+  {
+    title: renderTableTitle("评分", "streamline-emojis:bar-chart"),
+    key: "ai_score",
+    render: (row) => h(Grade, { score: row.ai_score, grade: row.ai_grade }),
+  },
+  {
+    title: renderTableTitle(
+      "用户",
+      "streamline-emojis:smiling-face-with-sunglasses",
+    ),
+    key: "username",
+    minWidth: 200,
+    render: (row) =>
+      h(
+        ButtonWithSearch,
+        {
+          type: "用户",
+          username: row.username,
+          onClick: () => window.open("/user?name=" + row.username, "_blank"),
+          onSearch: () => (query.username = row.username),
+          onFilterClass: (classname: string) => (query.username = classname),
+        },
+        () => row.username,
+      ),
+  },
+]
 </script>
 <template>
   <n-flex vertical size="large">
@@ -245,13 +313,6 @@ const columns = computed(() => {
             unchecked-value="0"
           />
         </n-form-item>
-        <n-form-item label="状态">
-          <n-select
-            class="select"
-            v-model:value="query.result"
-            :options="resultOptions"
-          />
-        </n-form-item>
         <n-form-item label="语言" v-if="route.name !== 'contest submissions'">
           <n-select
             class="select"
@@ -259,10 +320,19 @@ const columns = computed(() => {
             :options="languageOptions"
           />
         </n-form-item>
+        <n-form-item label="状态">
+          <n-select
+            :disabled="query.language === 'Flowchart'"
+            class="select"
+            v-model:value="query.result"
+            :options="resultOptions"
+          />
+        </n-form-item>
       </n-form>
       <n-form :show-feedback="false" inline label-placement="left">
         <n-form-item>
           <n-input
+            :disabled="query.myself === '1'"
             class="input"
             clearable
             v-model:value="query.username"
@@ -317,7 +387,18 @@ const columns = computed(() => {
         </n-form-item>
       </n-form>
     </n-space>
-    <n-data-table :bordered="false" :columns="columns" :data="submissions" />
+    <n-data-table
+      v-if="query.language === 'Flowchart'"
+      :bordered="false"
+      :columns="flowchartColumns"
+      :data="flowcharts"
+    />
+    <n-data-table
+      v-else
+      :bordered="false"
+      :columns="columns"
+      :data="submissions"
+    />
   </n-flex>
   <Pagination
     :total="total"
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 4615a29..eed74c1 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -235,6 +235,7 @@ export const CODE_TEMPLATES = {
   Java: blankTemplate,
   JavaScript: blankTemplate,
   Golang: blankTemplate,
+  Flowchart: blankTemplate,
 } as const
 
 export enum ScreenMode {
diff --git a/src/utils/types.ts b/src/utils/types.ts
index 9c88b47..714205f 100644
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@@ -223,9 +223,20 @@ export interface FlowchartSubmission {
 }
 
 // 列表接口返回的字段（包含 username 和 problem_title）
-export interface FlowchartSubmissionListItem extends FlowchartSubmission {
+export interface FlowchartSubmissionListItem {
+  id: string
+  create_time: string
+  evaluation_time: string
+  ai_score: number
+  ai_grade: Grade
+  ai_model: string
+  ai_provider: string
+  processing_time: number
+  status: number
   username: string
   problem_title: string
+  problem: string
+  show_link: boolean
 }
 export interface SubmitFlowchartPayload {
   problem_id: number
@@ -275,6 +286,7 @@ export interface Submission {
 export interface SubmissionListItem {
   id: string
   problem: string
+  problem_title: string
   show_link: boolean
   create_time: string
   user_id: number
@@ -479,6 +491,16 @@ export interface SolvedProblem {
   difficulty: string
 }
 
+export interface FlowchartSummary {
+  problem__id: string
+  problem_title: string
+  submission_count: number
+  best_score: number
+  best_grade: string
+  latest_submission_time: string
+  avg_score: number
+}
+
 export interface DetailsData {
   start: string
   end: string
@@ -488,6 +510,7 @@ export interface DetailsData {
   difficulty: { [key: string]: number }
   contest_count: number
   solved: SolvedProblem[]
+  flowcharts: FlowchartSummary[]
 }
 
 export type Grade = "S" | "A" | "B" | "C"