feat(web-platform): release V0.9.3 全模块界面重构

web_platform/src/app/components/MapViewportTools.tsx

@@ -61,7 +61,7 @@ export function MapViewportToolbar({
   return (
     <div
       aria-label="地图视口工具"
-      className="engineering-glass map-tool-enter absolute left-1/2 top-3 z-20 flex max-w-[calc(100%-24px)] -translate-x-1/2 items-center gap-1.5 rounded-xl border p-1.5"
+      className="flex max-w-full flex-wrap items-center justify-center gap-1 p-1"
     >
       <button
         type="button"
@@ -69,7 +69,7 @@ export function MapViewportToolbar({
         aria-pressed={interactionActive}
         disabled={loading}
         onClick={onActivate}
-        className={`hidden h-8 items-center gap-1.5 rounded-lg px-2 text-[10px] font-semibold transition-colors sm:flex ${interactionActive ? 'bg-accent-soft text-accent' : 'bg-surface/80 text-text-secondary hover:bg-element-hover'}`}
+        className={`flex h-8 items-center gap-1.5 rounded-lg px-2 text-xs font-semibold transition-colors ${interactionActive ? 'bg-accent-soft text-accent' : 'bg-surface/80 text-text-secondary hover:bg-element-hover'}`}
       >
         <MapPinned className="h-3.5 w-3.5" aria-hidden="true" />
         地图编辑
@@ -91,8 +91,8 @@ export function MapViewportToolbar({
         <Grid3X3 className="h-3.5 w-3.5" />
       </IconButton>
       <span aria-hidden="true" className="mx-0.5 h-5 w-px bg-border" />
-      <label className="flex items-center gap-1 text-[10px] text-text-tertiary">
-        <span className="hidden lg:inline">贴地</span>
+      <label className="flex items-center gap-1 text-xs text-text-tertiary">
+        <span>贴地</span>
         <Select
           aria-label="贴地检测模式"
           className="w-[112px]"
@@ -129,27 +129,34 @@ export function MapDraftStatusOverlay({
   loading,
   onCommit,
   onDiscard,
+  error,
 }: {
   visible: boolean;
   changeCount: number;
   loading: boolean;
+  error?: string;
   onCommit: () => void;
   onDiscard: () => void;
 }) {
-  if (!visible) return null;
   const dirty = changeCount > 0;
+  if (!visible || (!dirty && !loading && !error)) return null;
   return (
     <div
       aria-label="地图草稿状态"
       role="status"
-      className="engineering-glass absolute bottom-3 left-1/2 z-20 flex max-w-[calc(100%-24px)] -translate-x-1/2 items-center gap-2 rounded-xl border px-2 py-1.5"
+      className="engineering-glass flex max-w-full flex-wrap items-center justify-center gap-2 rounded-xl border px-2 py-1.5"
     >
       <span
         aria-hidden="true"
         className={`h-2 w-2 shrink-0 rounded-full ${dirty ? 'draft-dirty-dot bg-warning' : 'bg-success'}`}
       />
-      <span className="min-w-0 whitespace-nowrap text-[10px] font-medium text-text-secondary sm:text-[11px]">
-        {dirty ? `${changeCount} 项未保存改动` : '地图草稿已同步'}
+      <span className="min-w-0 text-xs font-medium text-text-secondary">
+        {loading
+          ? '正在应用草稿…'
+          : error
+            ? `应用失败 · ${changeCount} 项未保存改动`
+            : `${changeCount} 项未保存改动`}
+        {error && <span className="block text-danger">{error}</span>}
       </span>
       <Button
         variant="ghost"
@@ -158,7 +165,7 @@ export function MapDraftStatusOverlay({
         icon={<Trash2 className="h-3 w-3" />}
         onClick={onDiscard}
       >
-        <span className="hidden sm:inline">丢弃</span>
+        放弃
       </Button>
       <Button
         variant="primary"
@@ -167,7 +174,7 @@ export function MapDraftStatusOverlay({
         icon={<Check className="h-3 w-3" />}
         onClick={onCommit}
       >
-        <span className="hidden sm:inline">提交</span>
+        应用
       </Button>
     </div>
   );
@@ -191,7 +198,7 @@ export function MapAssetDropIndicator({ target }: { target?: MapAssetDropTarget
         <span className="grid h-8 w-8 place-items-center rounded-full border border-current bg-panel/85 backdrop-blur">
           <MapPinned className="h-4 w-4" />
         </span>
-        <span className="absolute left-1/2 top-full mt-2 -translate-x-1/2 whitespace-nowrap rounded-lg border border-border-strong bg-panel/90 px-2 py-1 text-[10px] font-medium shadow-xl backdrop-blur">
+        <span className="absolute left-1/2 top-full mt-2 -translate-x-1/2 whitespace-nowrap rounded-lg border border-border-strong bg-panel/90 px-2 py-1 text-xs font-medium shadow-xl backdrop-blur">
           {valid
             ? `释放放置 · ${target.position![0].toFixed(1)}, ${target.position![1].toFixed(1)}`
             : '请拖到 3D 地面'}