From 72a480ccc8a787e1eb2657e59e54ab0a9b05781b Mon Sep 17 00:00:00 2001
From: kang <kangdeng28@gmail.com>
Date: Sat, 16 May 2026 10:52:44 +0800
Subject: [PATCH] =?UTF-8?q?refactor(config):=20=E4=BC=98=E5=8C=96=E7=8E=A9?=
 =?UTF-8?q?=E6=B3=95=E9=85=8D=E7=BD=AE=E7=89=88=E6=9C=AC=E5=88=87=E6=8D=A2?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../config/config-version-switcher.tsx        | 16 +++---
 .../config/doc/play-config-doc-screen.tsx     | 57 ++++++++++---------
 2 files changed, 40 insertions(+), 33 deletions(-)

diff --git a/src/modules/config/config-version-switcher.tsx b/src/modules/config/config-version-switcher.tsx
index 5fb52de..439c7b5 100644
--- a/src/modules/config/config-version-switcher.tsx
+++ b/src/modules/config/config-version-switcher.tsx
@@ -59,6 +59,7 @@ export type ConfigVersionSwitcherProps = {
   label?: string;
   sheetTitle?: string;
   sheetDescription?: string;
+  className?: string;
   onDeleteVersion?: (row: ConfigVersionSummary) => Promise<void>;
   onRollbackVersion?: (row: ConfigVersionSummary) => void;
   rollbackBusy?: boolean;
@@ -72,6 +73,7 @@ export function ConfigVersionSwitcher({
   label = "配置版本",
   sheetTitle = "切换配置版本",
   sheetDescription = "选择一条版本在本页查看；草稿可编辑，生效中与已归档为只读。",
+  className,
   onDeleteVersion,
   onRollbackVersion,
   rollbackBusy = false,
@@ -132,15 +134,15 @@ export function ConfigVersionSwitcher({
 
   return (
     <>
-      <div className="flex flex-wrap items-end gap-2">
-        <div className="grid gap-2 min-w-[260px]">
-          <Label>{label}</Label>
+      <div className={cn("flex w-full flex-col gap-2 sm:w-auto sm:min-w-[280px]", className)}>
+        <Label>{label}</Label>
+        <div className="flex flex-col gap-2 sm:flex-row sm:items-center">
           <Select
             value={selectedId}
             onValueChange={(v) => onSelectedIdChange(v ?? "")}
             disabled={loading || sortedVersions.length === 0}
           >
-            <SelectTrigger>
+            <SelectTrigger className="w-full sm:w-[280px]">
               <SelectValue placeholder={loading ? "加载中…" : "选择版本"} />
             </SelectTrigger>
             <SelectContent>
@@ -151,10 +153,10 @@ export function ConfigVersionSwitcher({
               ))}
             </SelectContent>
           </Select>
+          <Button type="button" variant="outline" disabled={loading} onClick={() => setSheetOpen(true)}>
+            切换版本
+          </Button>
         </div>
-        <Button type="button" variant="outline" disabled={loading} onClick={() => setSheetOpen(true)}>
-          切换版本
-        </Button>
       </div>
 
       <Sheet open={sheetOpen} onOpenChange={setSheetOpen}>
diff --git a/src/modules/config/doc/play-config-doc-screen.tsx b/src/modules/config/doc/play-config-doc-screen.tsx
index 9649b40..f2b88cb 100644
--- a/src/modules/config/doc/play-config-doc-screen.tsx
+++ b/src/modules/config/doc/play-config-doc-screen.tsx
@@ -279,33 +279,38 @@ export function PlayConfigDocScreen() {
         <CardTitle className="text-lg">玩法配置</CardTitle>
       </CardHeader>
       <CardContent className="space-y-4">
-        <ConfigVersionSwitcher
-          versions={list}
-          selectedId={selectedId}
-          onSelectedIdChange={setSelectedId}
-          loading={loadingList}
-          sheetTitle="玩法配置版本"
-          onDeleteVersion={handleDeleteVersion}
-        />
+        <div className="rounded-xl border bg-muted/20 p-3">
+          <div className="flex flex-col gap-3 lg:flex-row lg:items-end lg:justify-between">
+            <ConfigVersionSwitcher
+              versions={list}
+              selectedId={selectedId}
+              onSelectedIdChange={setSelectedId}
+              loading={loadingList}
+              sheetTitle="玩法配置版本"
+              onDeleteVersion={handleDeleteVersion}
+              className="lg:flex-1"
+            />
 
-        <div className="flex flex-wrap items-center gap-2">
-          <Button type="button" variant="secondary" onClick={() => void refreshList()} disabled={loadingList}>
-            刷新版本
-          </Button>
-          <Button type="button" onClick={() => void handleNewDraft()} disabled={saving}>
-            新建草稿
-          </Button>
-          <Button type="button" onClick={() => void handleSaveDraft()} disabled={!isDraft || saving || loadingDetail}>
-            保存草稿
-          </Button>
-          <Button
-            type="button"
-            className="bg-emerald-600 text-white hover:bg-emerald-600/90"
-            onClick={() => void handlePublish()}
-            disabled={!isDraft || saving || loadingDetail}
-          >
-            启用为当前版本
-          </Button>
+            <div className="flex flex-wrap items-center gap-2 lg:justify-end">
+              <Button type="button" variant="secondary" onClick={() => void refreshList()} disabled={loadingList}>
+                刷新版本
+              </Button>
+              <Button type="button" onClick={() => void handleNewDraft()} disabled={saving}>
+                新建草稿
+              </Button>
+              <Button type="button" onClick={() => void handleSaveDraft()} disabled={!isDraft || saving || loadingDetail}>
+                保存草稿
+              </Button>
+              <Button
+                type="button"
+                className="bg-emerald-600 text-white hover:bg-emerald-600/90"
+                onClick={() => void handlePublish()}
+                disabled={!isDraft || saving || loadingDetail}
+              >
+                启用为当前版本
+              </Button>
+            </div>
+          </div>
         </div>
 
         {detail ? (