fix(后台建题): 修好 dev 代理走错服务，以及新建页带出上一题 id、超长标签报英文

三处不相干的小毛病，都在「新建/编辑题目」这条路上。

vite 的 /api 代理写的是 localhost:3000。api 用 Bun.serve 起、只绑 IPv4 的
0.0.0.0:3000，而 Node 解析 localhost 时 ::1 排在前面 —— 别的项目的 dev server
一占 [::1]:3000，两边端口就不冲突（一个 v4 一个 v6，谁都不报错），浏览器发出的
/api/* 整个落到那个站上，表现是后台一进就被弹回首页。改成 127.0.0.1。

新建页和编辑页共用同一个 localStorage 草稿键，而编辑页会把服务器数据连 id 一起
写进去。没保存就离开的话，这个 id 跟着草稿漂到新建页：「下载测试点」下的是那道旧
题的包，SQL 测试点编辑器也会去回显那道旧题的脚本。新建分支进来先把 id 摘掉。

新标签没有长度限制，超过 32 字要到保存时才撞出 zod 的英文原文（Too big:
expected string to have <=32 characters）。把 32 提成契约里的
PROBLEM_TAG_MAX_LENGTH，输入框拿它做 maxlength，validateNewTags 再兜一道粘贴
绕过的情况，提示换成中文。校验的松紧没动，32 字仍然存得进、33 字仍然拦下。

editContestProblem 和 editProblem 函数体逐字相同（都是 PUT admin/problems/:id，
比赛由后端从题目自己推导），合成一个。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XvmqDsZNyUo9P3sFQtoWVB

apps/web/src/admin/api.ts

@@ -84,6 +84,8 @@ export function deleteContestProblem(id: number) {
   return api.delete(`admin/problems/${id}`)
 }
 
+// 比赛题也走这条：后端是同一条 PUT admin/problems/:id，比赛由题目自己推导，
+// 所以不像新建那样需要分两个函数
 export function editProblem(problem: AdminProblem | BlankProblem) {
   return api.put<AdminProblem>(
     `admin/problems/${(problem as AdminProblem).id}`,
@@ -103,13 +105,6 @@ export function generateFlowchartFromPythonCode(python: string) {
   })
 }
 
-export function editContestProblem(problem: AdminProblem | BlankProblem) {
-  return api.put<AdminProblem>(
-    `admin/problems/${(problem as AdminProblem).id}`,
-    toProblemBody(problem),
-  )
-}
-
 export function getProblem(id: string | number) {
   return api.get<AdminProblem>(`admin/problems/${id}`)
 }

apps/web/src/admin/problem/detail.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { PROBLEM_TAG_MAX_LENGTH } from "@oj2/contract"
 import { getProblemTagList } from "shared/api"
 import TextEditor from "shared/components/TextEditor.vue"
 import TestcaseGenerator from "./components/TestcaseGenerator.vue"
@@ -15,7 +16,6 @@ import type { BlankProblem, LANGUAGE, Tag, Testcase } from "utils/types"
 import {
   createContestProblem,
   createProblem,
-  editContestProblem,
   editProblem,
   generateFlowchartFromPythonCode,
   getProblem,
@@ -136,6 +136,12 @@ function validateNewTags(v: string[]) {
   const existing = new Set(tagList.value.map((t) => t.name))
   const blanks: string[] = []
   for (const tag of unique(v)) {
+    // 输入框已经挂了 maxlength，这里兜住粘贴等绕过的情况。只丢这一个标签、
+    // 不像重复那支那样 break —— 后端撞上来只会回一句 zod 的英文
+    if (tag.length > PROBLEM_TAG_MAX_LENGTH) {
+      message.error(`标签最多 ${PROBLEM_TAG_MAX_LENGTH} 个字：` + tag)
+      continue
+    }
     if (existing.has(tag)) {
       message.error("已经存在标签：" + tag)
       break
@@ -213,6 +219,11 @@ watch(
 
 async function getProblemDetail() {
   if (!props.problemID) {
+    // 草稿缓存和编辑页共用同一个 localStorage key：编辑页会把服务器数据连 id
+    // 一起写进去，没保存就离开的话，这个 id 会跟着草稿漂到新建页 ——「下载测试点」
+    // 下的是那道旧题的包，SQL 测试点编辑器也会去回显那道旧题的脚本。
+    // 新建页不存在 id，进来先摘掉。
+    delete problem.value.id
     syncTagInputsFromProblemTags()
     toggleReady(true)
     return
@@ -445,7 +456,7 @@ async function submit() {
     "admin problem create": createProblem,
     "admin problem edit": editProblem,
     "admin contest problem create": createContestProblem,
-    "admin contest problem edit": editContestProblem,
+    "admin contest problem edit": editProblem,
   }[route.name as string]
   if (
     route.name === "admin contest problem create" ||
@@ -588,6 +599,7 @@ watch(
         </n-flex>
         <n-dynamic-tags
           v-model:value="newTags"
+          :input-props="{ maxlength: PROBLEM_TAG_MAX_LENGTH }"
           @update:value="validateNewTags"
         />
       </n-flex>