From ac0893cdb5120f477fdce399fbb40b75a375b9d4 Mon Sep 17 00:00:00 2001
From: xiaozhu <2395895331@qq.com>
Date: Tue, 1 Sep 2026 16:15:54 +0800
Subject: [PATCH] =?UTF-8?q?update:=E9=83=A8=E5=88=86=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/app/components/common/Topbar.tsx     | 13 ++--
 .../app/features/schedules/SchedulePage.tsx   | 77 ++++++++++---------
 2 files changed, 48 insertions(+), 42 deletions(-)

diff --git a/frontend/app/components/common/Topbar.tsx b/frontend/app/components/common/Topbar.tsx
index 7f3ee73..c68d154 100644
--- a/frontend/app/components/common/Topbar.tsx
+++ b/frontend/app/components/common/Topbar.tsx
@@ -53,7 +53,7 @@ export function Topbar({
           className="grid h-[31px] w-[31px] rotate-180 cursor-pointer place-items-center rounded-[7px] border border-transparent bg-white text-[#7b8999] hover:border-[#b9c9da] hover:bg-[#f7faff]"
           type="button"
         >
-          <ChevronRight size={19} />
+          <ChevronRight size={19} className="text-[#748497]"/>
         </button>
         <div>
           <span className="text-[10px] font-[650] uppercase tracking-[0.08em] text-[#94a2b3]">
@@ -93,10 +93,10 @@ export function Topbar({
                 {currentWorkspace.workspace_name}
               </strong>
             </span>
-            <ChevronRight size={15} />
+            <ChevronRight size={15} className="text-[#748497]"/>
           </button>
           {workspaceMenuOpen && (
-            <div className="absolute top-[calc(100%+7px)] right-0 z-50 w-[260px] rounded-lg border border-line bg-white p-1.5 shadow-lg">
+            <div className="absolute top-[calc(100%+7px)] right-0 z-50 max-h-[min(300px,calc(100vh-90px))] w-[260px] overflow-y-auto rounded-lg border border-line bg-white p-1.5 shadow-lg">
               {workspaces.map((workspace) => {
                 const isSelected =
                   workspace.workspace_id === currentWorkspace.workspace_id;
@@ -131,7 +131,7 @@ export function Topbar({
         </div>
         <div className="relative" ref={userMenuRef}>
           <button
-            className="flex h-[46px] cursor-pointer items-center gap-[9px] rounded-lg border border-transparent bg-white px-[11px] hover:border-[#b9cce0]"
+            className="flex h-[46px] cursor-pointer items-center gap-[9px] rounded-lg border border-line bg-white px-[11px] hover:border-[#b9cce0]"
             type="button"
             aria-expanded={userMenuOpen}
             aria-haspopup="menu"
@@ -148,11 +148,12 @@ export function Topbar({
                 {user?.role_code === "admin" ? "管理员" : "开发人员"}
               </small>
             </span>
-            <ChevronRight size={15} className="text-[#97a3b1]" />
+            {/* <ChevronRight size={15} className="text-[#97a3b1]" /> */}
+            <ChevronRight size={15} className="text-[#748497]" />
           </button>
           {userMenuOpen && (
             <div
-              className="absolute top-[calc(100%+7px)] right-0 z-50 w-[240px] rounded-lg border border-line bg-white p-1.5 shadow-lg"
+              className="absolute top-[calc(100%+7px)] right-0 z-50 w-[200px] rounded-lg border border-line bg-white p-1.5 shadow-lg"
               role="menu"
             >
               <div className="border-b border-line px-2.5 py-2.5">
diff --git a/frontend/app/features/schedules/SchedulePage.tsx b/frontend/app/features/schedules/SchedulePage.tsx
index a378aa0..bee3ac3 100644
--- a/frontend/app/features/schedules/SchedulePage.tsx
+++ b/frontend/app/features/schedules/SchedulePage.tsx
@@ -449,37 +449,38 @@ export default function SchedulePage({
             linkSourceId={linkSourceId}
             onCancelLink={() => setLinkSourceId(null)}
           />
-          <div
-            className="relative min-h-0 flex-1 overflow-auto bg-bg-canvas data-[state=linking]:cursor-crosshair"
-            data-state={linkSourceId ? "linking" : "idle"}
-            ref={canvasRef}
-            style={{
-              backgroundImage:
-                "linear-gradient(#e7edf3 1px, transparent 1px), linear-gradient(90deg, #e7edf3 1px, transparent 1px), linear-gradient(#f1f4f7 1px, transparent 1px), linear-gradient(90deg, #f1f4f7 1px, transparent 1px)",
-              backgroundSize: "80px 80px, 80px 80px, 16px 16px, 16px 16px",
-              backgroundPosition: "-1px -1px",
-            }}
-            onDragOver={(event) => {
-              event.preventDefault();
-              event.dataTransfer.dropEffect = "copy";
-            }}
-            onDrop={onCanvasDrop}
-            onClick={(event) => {
-              // 画布实际内容位于 surface/SVG 子元素中，不能只比较 currentTarget；
-              // 点击节点或连线时保留选择，点击其余空白位置则返回调度方案基本信息。
-              const target = event.target as Element;
-              if (
-                target.closest(".schedule-node") ||
-                target.matches(".schedule-edge-line, .schedule-edge-hit")
-              ) return;
-              setSelectedNodeId(null);
-              setSelectedEdgeId(null);
-            }}
-          >
+          <div className="relative min-h-0 flex-1">
             <div
-              className="relative"
-              style={{ width: CANVAS_WIDTH, height: CANVAS_HEIGHT }}
+              className="absolute inset-0 overflow-auto bg-bg-canvas data-[state=linking]:cursor-crosshair"
+              data-state={linkSourceId ? "linking" : "idle"}
+              ref={canvasRef}
+              style={{
+                backgroundImage:
+                  "linear-gradient(#e7edf3 1px, transparent 1px), linear-gradient(90deg, #e7edf3 1px, transparent 1px), linear-gradient(#f1f4f7 1px, transparent 1px), linear-gradient(90deg, #f1f4f7 1px, transparent 1px)",
+                backgroundSize: "80px 80px, 80px 80px, 16px 16px, 16px 16px",
+                backgroundPosition: "-1px -1px",
+              }}
+              onDragOver={(event) => {
+                event.preventDefault();
+                event.dataTransfer.dropEffect = "copy";
+              }}
+              onDrop={onCanvasDrop}
+              onClick={(event) => {
+                // 画布实际内容位于 surface/SVG 子元素中，不能只比较 currentTarget；
+                // 点击节点或连线时保留选择，点击其余空白位置则返回调度方案基本信息。
+                const target = event.target as Element;
+                if (
+                  target.closest(".schedule-node") ||
+                  target.matches(".schedule-edge-line, .schedule-edge-hit")
+                ) return;
+                setSelectedNodeId(null);
+                setSelectedEdgeId(null);
+              }}
             >
+              <div
+                className="relative"
+                style={{ width: CANVAS_WIDTH, height: CANVAS_HEIGHT }}
+              >
               {schedule && (
                 <svg
                   className="absolute inset-0 z-[1] h-full w-full overflow-visible"
@@ -600,9 +601,11 @@ export default function SchedulePage({
                   />
                 </div>
               ))}
-
-              {!schedule ? (
-                <div className="sticky left-1/2 top-[46%] z-0 mx-auto mt-[190px] flex w-[350px] flex-col items-center text-center text-[#9aa8b6] [&>svg]:mb-3 [&>svg]:text-[#8cb4de]">
+              </div>
+            </div>
+            {!schedule ? (
+              <div className="pointer-events-none absolute inset-0 z-[2] flex items-center justify-center">
+                <div className="pointer-events-auto flex w-[350px] flex-col items-center text-center text-[#9aa8b6] [&>svg]:mb-3 [&>svg]:text-[#8cb4de]">
                   <CalendarClock size={34} />
                   <strong className="text-[14px] text-[#567089]">还没有选中调度方案</strong>
                   <p className="my-[7px_13px] text-[11px]">点击"新建"创建一个调度，然后拖入稳定版本脚本。</p>
@@ -616,14 +619,16 @@ export default function SchedulePage({
                     <Plus size={15} />新建调度
                   </Button>
                 </div>
-              ) : schedule.nodes.length === 0 ? (
-                <div className="sticky left-1/2 top-[46%] z-0 mx-auto mt-[190px] flex w-[350px] flex-col items-center text-center text-[#9aa8b6] [&>svg]:mb-3 [&>svg]:text-[#8cb4de]">
+              </div>
+            ) : schedule.nodes.length === 0 ? (
+              <div className="pointer-events-none absolute inset-0 z-[2] flex items-center justify-center">
+                <div className="pointer-events-auto flex w-[350px] flex-col items-center text-center text-[#9aa8b6] [&>svg]:mb-3 [&>svg]:text-[#8cb4de]">
                   <PackageOpen size={34} />
                   <strong className="text-[14px] text-[#567089]">从稳定版本开始编排</strong>
                   <p className="my-[7px_13px] text-[11px]">把左侧脚本卡片拖到这里，或双击卡片快速加入。</p>
                 </div>
-              ) : null}
-            </div>
+              </div>
+            ) : null}
           </div>
           <footer className="flex min-h-[35px] items-center gap-[14px] border-t border-[#e4eaf0] bg-white px-3 text-[10px] text-[#8b99a9]">
             <span