feat: 支持批量上传关卡

components/levels/level-dialog.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useMemo } from 'react'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
@@ -20,10 +20,19 @@ interface LevelDialogProps {
   open: boolean
   onOpenChange: (open: boolean) => void
   level?: Level | null
+  /** 当前关卡总数（含正在编辑的这条） */
+  totalCount: number
+  /** 编辑时当前行的 0-based index；创建时传 null */
+  currentIndex: number | null
   onSubmit: (data: LevelFormData) => Promise<void>
 }
 
-const defaultFormData: LevelFormData = {
+type FormState = Omit<LevelFormData, 'position'> & {
+  /** 位置字段以字符串保存，便于处理"空输入"状态；提交时解析为数字 */
+  position: string
+}
+
+const defaultFormState: FormState = {
   image1Url: '',
   image1Description: '',
   image2Url: '',
@@ -33,13 +42,35 @@ const defaultFormData: LevelFormData = {
   hint1: '',
   hint2: '',
   hint3: '',
+  position: '',
 }
 
-export function LevelDialog({ open, onOpenChange, level, onSubmit }: LevelDialogProps) {
-  const [formData, setFormData] = useState<LevelFormData>(defaultFormData)
+export function LevelDialog({
+  open,
+  onOpenChange,
+  level,
+  totalCount,
+  currentIndex,
+  onSubmit,
+}: LevelDialogProps) {
+  const [formData, setFormData] = useState<FormState>(defaultFormState)
   const [isLoading, setIsLoading] = useState(false)
   const [error, setError] = useState('')
 
+  const isEdit = !!level
+
+  // 位置的合法范围与默认值
+  const { minPos, maxPos, defaultPos } = useMemo(() => {
+    if (isEdit) {
+      const min = 1
+      const max = Math.max(totalCount, 1)
+      const def = typeof currentIndex === 'number' ? currentIndex + 1 : max
+      return { minPos: min, maxPos: max, defaultPos: def }
+    }
+    const max = totalCount + 1
+    return { minPos: 1, maxPos: max, defaultPos: max }
+  }, [isEdit, totalCount, currentIndex])
+
   // Reset form when dialog opens/closes or level changes
   useEffect(() => {
     if (open) {
@@ -54,13 +85,14 @@ export function LevelDialog({ open, onOpenChange, level, onSubmit }: LevelDialog
           hint1: level.hint1 || '',
           hint2: level.hint2 || '',
           hint3: level.hint3 || '',
+          position: String(defaultPos),
         })
       } else {
-        setFormData(defaultFormData)
+        setFormData({ ...defaultFormState, position: String(defaultPos) })
       }
       setError('')
     }
-  }, [open, level])
+  }, [open, level, defaultPos])
 
   const handleImage1Upload = (url: string) => {
     setFormData((prev) => ({ ...prev, image1Url: url }))
@@ -94,9 +126,39 @@ export function LevelDialog({ open, onOpenChange, level, onSubmit }: LevelDialog
       return
     }
 
+    // 位置：留空视为"不改位置"（编辑）/ "追加末尾"（创建）
+    let position: number | undefined
+    const raw = formData.position.trim()
+    if (raw !== '') {
+      const n = Number(raw)
+      if (!Number.isInteger(n) || n < minPos || n > maxPos) {
+        setError(`位置必须是 ${minPos}-${maxPos} 之间的整数`)
+        return
+      }
+      // 编辑场景：值没变则不上传 position，避免后端无谓重算 sortKey
+      if (isEdit && typeof currentIndex === 'number' && n === currentIndex + 1) {
+        position = undefined
+      } else {
+        position = n
+      }
+    }
+
+    const payload: LevelFormData = {
+      image1Url: formData.image1Url,
+      image1Description: formData.image1Description,
+      image2Url: formData.image2Url,
+      image2Description: formData.image2Description,
+      answer: formData.answer,
+      punchline: formData.punchline,
+      hint1: formData.hint1,
+      hint2: formData.hint2,
+      hint3: formData.hint3,
+      ...(position !== undefined ? { position } : {}),
+    }
+
     setIsLoading(true)
     try {
-      await onSubmit(formData)
+      await onSubmit(payload)
       onOpenChange(false)
     } catch (err) {
       setError(err instanceof Error ? err.message : '操作失败，请稍后重试')
@@ -173,6 +235,39 @@ export function LevelDialog({ open, onOpenChange, level, onSubmit }: LevelDialog
             </p>
           </div>
 
+          <div className="space-y-2">
+            <Label htmlFor="position">
+              位置 <span className="text-muted-foreground font-normal">*</span>
+            </Label>
+            <div className="flex items-center gap-3">
+              <Input
+                id="position"
+                type="number"
+                min={minPos}
+                max={maxPos}
+                step={1}
+                inputMode="numeric"
+                value={formData.position}
+                onChange={(e) =>
+                  setFormData((prev) => ({ ...prev, position: e.target.value }))
+                }
+                className="w-32 font-mono tabular-nums"
+                placeholder={String(defaultPos)}
+              />
+              <p className="text-xs text-muted-foreground">
+                可填 <span className="font-mono">{minPos}</span> 到{' '}
+                <span className="font-mono">{maxPos}</span>
+                {isEdit && typeof currentIndex === 'number' && (
+                  <>
+                    {' · 当前第 '}
+                    <span className="font-mono">{currentIndex + 1}</span> 位
+                  </>
+                )}
+                {!isEdit && ' · 留空则追加到末尾'}
+              </p>
+            </div>
+          </div>
+
           <div className="space-y-2">
             <Label htmlFor="punchline">谐音梗说明 (可选)</Label>
             <Input