refactor(V0.2): 看板卡片左列布局 / 列表负责人右移 / 把手再收窄
Docker Build and Push / build-image (push) Successful in 1m0s

- 看板卡片: 状态点与 ⋯ 竖排移到卡片左侧, 负责人+成员靠右, 标题独占中间
- 列表行: 负责人从第二行元信息移到行右侧 (⋯ 左边)
- ⠿ 把手: 宽度收到约 10px, 负外距悬进卡片内边距, 基本不占横向空间
This commit is contained in:
jif2.zhang
2026-10-25 02:32:49 +08:00
parent 2fa41c774b
commit 49037371f8
3 changed files with 44 additions and 31 deletions
+29 -23
View File
@@ -20,8 +20,8 @@ export default function TaskCard({
onClick={onClick}
{...(bindDrag ? bindDrag(task) : {})}
>
<div className="brow1">
<span className="btitle">{task.title}</span>
{/* 左侧竖排: 状态点 + ⋯ */}
<div className="bcard-left">
<span
className="bstat"
onClick={(e) => { e.stopPropagation(); onToggle?.(task) }}
@@ -30,15 +30,6 @@ export default function TaskCard({
>
<StatusDot status={task.status} />
</span>
</div>
<div className="bmeta">
<span className={`bassignee${task.assignee ? '' : ' none'}`}>
{task.assignee?.name || '未指派'}
</span>
{task.members?.length > 0 && (
<span className="bmembers">+ {task.members.map((m) => m.name).join('、')}</span>
)}
{onMore && (
<span
className="bmore-btn"
@@ -48,19 +39,34 @@ export default function TaskCard({
)}
</div>
{shown.map((c) => (
<div
key={c.id}
className={`bsub${c.status === 'done' ? ' done' : ''}`}
onClick={(e) => { e.stopPropagation(); onToggleSub?.(c) }}
onPointerDown={(e) => e.stopPropagation()}
>
<span className="sbox" />
<span className="stitle">{c.title}</span>
<StatusDot status={c.status} />
<div className="bcard-body">
<div className="brow1">
<span className="btitle">{task.title}</span>
</div>
))}
{rest > 0 && <div className="bmore">+{rest} 个子任务</div>}
<div className="bmeta">
<span className={`bassignee${task.assignee ? '' : ' none'}`}>
{task.assignee?.name || '未指派'}
</span>
{task.members?.length > 0 && (
<span className="bmembers">+ {task.members.map((m) => m.name).join('、')}</span>
)}
</div>
{shown.map((c) => (
<div
key={c.id}
className={`bsub${c.status === 'done' ? ' done' : ''}`}
onClick={(e) => { e.stopPropagation(); onToggleSub?.(c) }}
onPointerDown={(e) => e.stopPropagation()}
>
<span className="sbox" />
<span className="stitle">{c.title}</span>
<StatusDot status={c.status} />
</div>
))}
{rest > 0 && <div className="bmore">+{rest} 个子任务</div>}
</div>
</div>
)
}
+3 -3
View File
@@ -51,15 +51,15 @@ export default function TaskRow({
<div className="task-meta">
<StatusDot status={task.status} />
<span>{statusLabel(task.status)}</span>
<span className={`assignee${task.assignee ? '' : ' none'}`}>
{task.assignee?.name || '未指派'}
</span>
{task.members?.length > 0 && (
<span className="members">+ {task.members.map((m) => m.name).join('、')}</span>
)}
</div>
</div>
<div className="task-right">
<span className={`assignee${task.assignee ? '' : ' none'}`}>
{task.assignee?.name || '未指派'}
</span>
<span
className="more"
onClick={(e) => { e.stopPropagation(); onMore?.(task) }}