feat(流程图): 画流程图不用再拖框连线——点箭头上的 + 加一步，判断自动分出是 / 否，排版全自动

原来要从节点库拖框、对准连接点拉线、自己摆位置，还能画出断线和孤立的框；
画布上全是彩色圆角块，交上去的却是平行四边形和菱形。现在照画布稿 FlowEdB：
- 图存成一棵结构树（顺序 / 判断 / 循环），开始、结束固定在两头，排版是纯函数
- 每根箭头上一个 +，点了选输入 / 输出 / 处理 / 判断 / 循环；点框直接改字，右上角「删除」
- 形状照国标流程图，画布、缩略图、交给 AI 的 Mermaid 是同一套；缩略图配色跟着画布改
- 已保存时间、撤销、重做挪到工具栏，「清空画布」收进「⋯」；空框交不上去
- 去掉 vue-flow 三个包（编辑器打包后 16 KB），删掉没人进的 /flowchart 页

2026-10 之前交的图是 vue-flow 格式，只能看缩略图、载不回画布；旧草稿键名不同，不去碰。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/oj/problem/components/SubmitFlowchart.vue

@@ -2,7 +2,7 @@
 import { storeToRefs } from "pinia"
 import { compressToBase64 } from "utils/functions"
 import { useBreakpoints } from "shared/composables/breakpoints"
-import { useMermaidConverter } from "../composables/useMermaidConverter"
+import { countBlank, toMermaid } from "shared/components/FlowchartEditor/model"
 import { useProblemStore } from "oj/store/problem"
 import { useFlowchartStore, type FlowchartEditorInstance } from "oj/store/flowchart"
 
@@ -21,20 +21,22 @@ const { problem } = storeToRefs(useProblemStore())
 const flowchartStore = useFlowchartStore()
 const { loading } = storeToRefs(flowchartStore)
 const { isDesktop } = useBreakpoints()
-const { convertToMermaid } = useMermaidConverter()
 
 function submit() {
   const editor = flowchartEditorRef?.value
   if (!editor) return
-  const flowchartData = editor.getFlowchartData()
-  if (!flowchartData?.nodes?.length || !flowchartData?.edges?.length) {
-    message.warning("画布上还没有图：从左边拖几个框进来，再用线连起来")
+  const doc = editor.getDoc()
+  if (!doc.steps.length) {
+    message.warning("画布上还没有图：点「开始」下面的 +，加第一步")
     return
   }
-  flowchartStore.submit(
-    convertToMermaid(flowchartData),
-    compressToBase64(JSON.stringify(flowchartData)),
-  )
+  // 空框交上去 AI 只能瞎猜，学生也不知道扣分是因为忘了写字
+  const blank = countBlank(doc.steps)
+  if (blank) {
+    message.warning(`有 ${blank} 个框还没写字，点一下框就能写`)
+    return
+  }
+  flowchartStore.submit(toMermaid(doc), compressToBase64(JSON.stringify(doc)))
 }
 
 // 进题、换题都读一次历次分数（store 里同一道题只读一次）