laoyang
4d04490f7f
网页端任务面板按鸿蒙版结构重排 + 输入框占满整行 (#82)
用户 2026-11-05：「网页版编辑在首页编辑任务的时候，那个输入框怎么那么短呢？
所有输入框都应该跟弹出框一样宽。它里面的信息应该和鸿蒙版一样：
1.标题是"编辑任务" 2.下面分成两行：第一行是任务标题，第二行是状态
3.后续内容也和鸿蒙版保持一致，不需要额外信息。
布局顺序也和鸿蒙版一致：1.任务标题 2.状态 3.看板
4.截止日期、负责人、备注、协作人 5.子任务，一直到子任务都和鸿蒙版一致。
颜色也是用主题颜色。」
① 输入框为什么那么短 —— 是我上一轮修"对齐"时引入的
#80 给每行加了 `max-width: var(--tk-attr-w)`（300px），
目的是让各个控件右缘对齐。但代价是：面板 680 宽、控件只有 300，
右边空着 300 多像素，看起来像没做完。
⇒ 改成上下两行之后，**每行只有一个控件、天然左缘对齐**，
不再需要靠限宽来对齐 ⇒ 全面 `width: 100%; max-width: none`。
实测（Playwright 量 getBoundingClientRect）：
五行控件宽全部 648 / 行宽 648 = **100%** ✅
② 排列改成上下两行
`.tk-attr-row` 从 `flex-direction: row` 改成 `column`：
① 标签独占一行（主题色 + 加粗 + 字距 .6，与鸿蒙 fieldLb 同一口径）
② 控件独占一行
顺带 `.tk-sec-inline`（状态/看板那两段）也改成纵向，
与字段行同形态 —— 否则这里横着、那里竖着，看着像两套东西。
③ 顺序按鸿蒙版重排
改前：状态 → 看板 → 更多信息{标题/截止/负责人/协作人/分类/备注}
改后：任务标题 → 状态 → 看板 → 截止 → 负责人 → 备注 → 协作人 → 子任务 → 附件 → 讨论
标题从「更多信息」里提出来，单独做第一个小节。
④ 去掉"额外信息"：分类、循环
用户明确说「不需要额外信息」，鸿蒙端面板里也没有这两项。
⚠️ 安全性确认：`tasks/panel_save` 用 `array_key_exists` 判"传没传"，
收不到 category_id 就**保留原值**，所以删掉字段不会把分类清空
（这条在 #76 就是按这个原则写的）。
⑤ 颜色：小节标题 + 字段标签都用主题色
`.tk-sec-h`（附件/讨论/子任务）从 var(--ink) 改 var(--tk-accent, var(--brand))，
`.tk-attr-lb` 从 faint 灰改主题色 + 700 粗体。
⑥ 只读态也做成"框"
新增 `.tk-attr-val`：浅底 + 圆角 + min-height 40，
与可编辑态同宽同高。原来只读用户看到的是一行裸文字，
和编辑态差太多（同一位置两种长相）。
实测渲染（family 1 最新任务）：
字段标签顺序：任务标题 → 截止 → 负责人 → 备注 → 协作人 ✅
横排段顺序：状态 → 看板 ✅
分类 / 循环：已删 ✅