From 03e3d31a83c73620a1729abcf8bc26d196c3de44 Mon Sep 17 00:00:00 2001
From: yu <191972707@qq.com>
Date: Mon, 2 Nov 2026 15:45:35 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=A7=BB=E9=99=A4=E5=8F=B3=E4=BE=A7?=
 =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E6=A6=82=E8=A7=88=E9=9D=A2=E6=9D=BF=EF=BC=8C?=
 =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E5=88=97=E8=A1=A8=E5=8D=A0=E6=BB=A1=E6=95=B4?=
 =?UTF-8?q?=E5=B1=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 删除 TasksPage 的 aside 任务概览区块及其全部 CSS
- 空状态并入列表: 无任务时在列表内显示「还没有任务+新建按钮」, 搜索无结果显示原提示
- .tasks-content 改为单列布局, 任务列表占满可用宽度
---
 src/renderer/src/pages/TasksPage.tsx |  35 +------
 src/renderer/src/styles/app.css      | 147 ++-------------------------
 2 files changed, 11 insertions(+), 171 deletions(-)

diff --git a/src/renderer/src/pages/TasksPage.tsx b/src/renderer/src/pages/TasksPage.tsx
index 152c748..4ab1f44 100644
--- a/src/renderer/src/pages/TasksPage.tsx
+++ b/src/renderer/src/pages/TasksPage.tsx
@@ -44,8 +44,6 @@ function formatDuration(value?: number): string {
   return `${(value / 1000).toFixed(value < 10000 ? 1 : 0)} s`;
 }
 
-const RUN_LABEL = { succeeded: "成功", failed: "失败", cancelled: "已取消", never: "未运行" } as const;
-
 export function TasksPage({ flows, onCreate, onCreateExamples, onOpenEditor, onRun, onDelete, onRefresh, onToast }: TasksPageProps) {
   const [query, setQuery] = useState("");
   const [selectedId, setSelectedId] = useState<string | null>(flows[0]?.id || null);
@@ -172,38 +170,13 @@ export function TasksPage({ flows, onCreate, onCreateExamples, onOpenEditor, onR
                 </span>
               </div>
             ))}
-            {!filtered.length && (
+            {!flows.length ? (
+              <div className="task-empty"><ListChecks className="icon" /><strong>还没有任务</strong><span>新建一个任务开始搭建自动化流程。</span><button type="button" className="btn btn-primary" onClick={onCreate}><Plus className="icon" />新建任务</button></div>
+            ) : !filtered.length ? (
               <div className="task-empty"><ListChecks className="icon" /><strong>没有匹配的任务</strong><span>调整搜索条件，或新建一个自动化任务。</span></div>
-            )}
+            ) : null}
           </div>
         </section>
-
-        <aside className="panel task-overview" aria-label="任务概览">
-          {selected ? (
-            <>
-              <div className="task-overview-head">
-                <span className="task-icon large"><ListChecks className="icon" /></span>
-                <div><span className="eyebrow">任务概览</span><h2>{selected.name}</h2></div>
-              </div>
-              <div className="overview-status"><span className="status-dot" />{selected.enabled === false ? "未启用" : "已启用"}<span className="overview-sep" />本地执行</div>
-              <div className="overview-actions">
-                <button type="button" className="btn btn-primary" onClick={() => onRun(selected.id)}><CirclePlay className="icon" />运行任务</button>
-                <button type="button" className="btn" onClick={() => onOpenEditor(selected.id)}><Pencil className="icon" />编辑流程</button>
-              </div>
-              <dl className="overview-meta">
-                <div><dt>触发方式</dt><dd><CalendarClock className="icon" />{selected.triggerLabel || "手动运行"}</dd></div>
-                <div><dt>流程节点</dt><dd>{selected.nodeCount} 个</dd></div>
-                <div><dt>最近运行</dt><dd className={`overview-run ${selected.lastRunStatus || "never"}`}>{RUN_LABEL[selected.lastRunStatus || "never"]} · {selected.lastRunAt ? formatTime(selected.lastRunAt) : "尚未运行"}</dd></div>
-                <div><dt>运行耗时</dt><dd>{selected.lastRunDurationMs === undefined ? "—" : formatDuration(selected.lastRunDurationMs)}</dd></div>
-                {selected.lastRunError && <div><dt>失败原因</dt><dd className="overview-error" title={selected.lastRunError}>{selected.lastRunError}</dd></div>}
-                <div><dt>最近修改</dt><dd>{formatTime(selected.updatedAt)}</dd></div>
-              </dl>
-              <div className="overview-note"><Zap className="icon" /><span>任务打开后先查看概览；只有点击“编辑流程”才进入画布。</span></div>
-            </>
-          ) : (
-            <div className="task-empty overview-empty"><ListChecks className="icon" /><strong>还没有任务</strong><span>新建一个任务开始搭建自动化流程。</span><button type="button" className="btn btn-primary" onClick={onCreate}><Plus className="icon" />新建任务</button></div>
-          )}
-        </aside>
       </div>
     </div>
   );
diff --git a/src/renderer/src/styles/app.css b/src/renderer/src/styles/app.css
index 72543b1..9b019a5 100644
--- a/src/renderer/src/styles/app.css
+++ b/src/renderer/src/styles/app.css
@@ -2705,8 +2705,7 @@ textarea:focus-visible {
   text-transform: uppercase;
 }
 
-.page-heading-actions,
-.overview-actions {
+.page-heading-actions {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -2756,12 +2755,10 @@ textarea:focus-visible {
   min-height: 0;
   flex: 1;
   display: grid;
-  grid-template-columns: minmax(0, 1.65fr) minmax(300px, 0.75fr);
-  gap: 12px;
+  grid-template-columns: minmax(0, 1fr);
 }
 
-.task-list-panel,
-.task-overview {
+.task-list-panel {
   min-width: 0;
   min-height: 0;
   display: flex;
@@ -2863,9 +2860,7 @@ textarea:focus-visible {
 .task-name-cell,
 .task-trigger,
 .task-updated,
-.task-status,
-.overview-status,
-.overview-meta dd {
+.task-status {
   display: flex;
   align-items: center;
   min-width: 0;
@@ -2883,22 +2878,11 @@ textarea:focus-visible {
   color: var(--blue-dark);
 }
 
-.task-icon.large {
-  width: 42px;
-  height: 42px;
-  border-radius: 11px;
-}
-
 .task-icon .icon {
   width: 16px;
   height: 16px;
 }
 
-.task-icon.large .icon {
-  width: 20px;
-  height: 20px;
-}
-
 .task-copy {
   min-width: 0;
   display: flex;
@@ -2933,29 +2917,18 @@ textarea:focus-visible {
   flex: none;
 }
 
-.run-result.failed,
-.overview-run.failed,
-.overview-error {
+.run-result.failed {
   color: var(--danger);
 }
 
-.run-result.succeeded,
-.overview-run.succeeded {
+.run-result.succeeded {
   color: var(--success-deep);
 }
 
-.run-result.cancelled,
-.overview-run.cancelled {
+.run-result.cancelled {
   color: var(--warn-deep);
 }
 
-.overview-error {
-  max-width: 210px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
 .task-status {
   font-size: 10.5px;
   white-space: nowrap;
@@ -3036,108 +3009,6 @@ textarea:focus-visible {
   line-height: 17px;
 }
 
-.overview-empty {
-  flex: 1;
-}
-
-.task-overview {
-  padding: 20px;
-}
-
-.task-overview-head {
-  display: flex;
-  align-items: center;
-  gap: 11px;
-}
-
-.task-overview-head h2 {
-  max-width: 230px;
-  margin-top: 3px;
-  overflow: hidden;
-  color: var(--ink);
-  font-size: 17px;
-  line-height: 23px;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.overview-status {
-  margin-top: 16px;
-  color: var(--success-deep);
-  font-size: 11px;
-}
-
-.overview-sep {
-  width: 1px;
-  height: 14px;
-  background: var(--line-strong);
-}
-
-.overview-actions {
-  margin-top: 16px;
-}
-
-.overview-actions .btn {
-  flex: 1;
-  justify-content: center;
-}
-
-.overview-meta {
-  margin-top: 20px;
-  display: grid;
-  gap: 0;
-  border-top: 1px solid var(--line);
-}
-
-.overview-meta > div {
-  min-height: 48px;
-  padding: 8px 0;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 10px;
-  border-bottom: 1px solid var(--line);
-}
-
-.overview-meta dt {
-  color: var(--muted);
-  font-size: 11px;
-}
-
-.overview-meta dd {
-  justify-content: flex-end;
-  color: var(--ink-2);
-  font-size: 11px;
-  text-align: right;
-}
-
-.overview-meta dd .icon {
-  width: 13px;
-  height: 13px;
-  color: var(--blue);
-}
-
-.overview-note {
-  margin-top: auto;
-  padding: 10px;
-  display: flex;
-  align-items: flex-start;
-  gap: 8px;
-  border: 1px solid rgba(34, 100, 229, 0.1);
-  border-radius: 9px;
-  background: var(--blue-mist);
-  color: var(--ink-2);
-  font-size: 10.5px;
-  line-height: 16px;
-}
-
-.overview-note .icon {
-  width: 14px;
-  height: 14px;
-  flex: none;
-  color: var(--blue);
-}
-
 /* ---------- 组件树 ---------- */
 .palette-expand-all {
   min-height: 24px;
@@ -3333,10 +3204,6 @@ textarea:focus-visible {
 }
 
 @media (max-width: 1250px) {
-  .tasks-content {
-    grid-template-columns: minmax(0, 1fr) 300px;
-  }
-
   .task-table-head,
   .task-row {
     grid-template-columns: minmax(170px, 1.3fr) 82px minmax(90px, 0.8fr) 96px 96px;