diff --git a/entry/src/main/ets/components/FbTaskPanel.ets b/entry/src/main/ets/components/FbTaskPanel.ets index 825eeaa..c25147c 100644 --- a/entry/src/main/ets/components/FbTaskPanel.ets +++ b/entry/src/main/ets/components/FbTaskPanel.ets @@ -1020,13 +1020,20 @@ export struct FbTaskPanel { /** 状态三段（点一下即改，没有"保存"按钮） */ @Builder statusSeg() { - Row({ space: 8 }) { - this.statusChip('todo') - this.statusChip('doing') - this.statusChip('done') + Column({ space: 6 }) { + /* #77i：状态也有标题了（原来只有三个 chip，没有区段标题， + 而下面每个区段都有 —— 视觉上它是"飘着的"）。 */ + FbSectionTitle({ title: '状态', accent: this.accent }) + Row({ space: 8 }) { + this.statusChip('todo') + this.statusChip('doing') + this.statusChip('done') + } + .width('100%') } .width('100%') - .padding({ top: 10, bottom: 4 }) + .padding({ bottom: 4 }) + .alignItems(HorizontalAlign.Start) } @Builder @@ -1064,9 +1071,15 @@ export struct FbTaskPanel { @Builder boardChips() { Column({ space: 6 }) { - Text('分组（看板）') - .fontSize(FbMetric.fontTiny) - .fontColor(FbColors.faint) + /* 🔴 #77i（用户 2026-11-05）：「分组看板那个地方没改…还是不对，标题的颜色不对。」 + + 上一轮我只把「子任务/附件/留言」三个标题换成了 `FbSectionTitle`， + **看板、状态、协作人、以及「更多信息」里那几个字段标签全都漏了** —— + 它们还是手写的 `fontTiny + faint`（浅灰小字）。 + + 规范（`Widgets.ets` / `FbSectionTitle`）：区块标题 = **Bold + 主题色 + 字距 0.6**。 + ⇒ 这一处改成组件。 */ + FbSectionTitle({ title: '分组（看板）', accent: this.accent }) if (this.boardCountAll() <= 6) { /* 平铺：全部一屏可见 */ Flex({ wrap: FlexWrap.Wrap }) { @@ -1150,10 +1163,7 @@ export struct FbTaskPanel { Column({ space: 0 }) { /* ---- 截止：可点，弹 FbDateTimePicker ---- */ Row({ space: 8 }) { - Text('截止') - .fontSize(FbMetric.fontTiny) - .fontColor(FbColors.faint) - .width(44) + this.fieldLb('截止') Text(this.dueOf() !== '' ? this.dueOf() : '设置…') .fontSize(FbMetric.fontSmall) .fontColor(this.dueOf() === '' ? FbColors.faint @@ -1182,10 +1192,7 @@ export struct FbTaskPanel { /* ---- 负责人：头像 + 可点选人 ---- */ Row({ space: 8 }) { - Text('负责人') - .fontSize(FbMetric.fontTiny) - .fontColor(FbColors.faint) - .width(44) + this.fieldLb('负责人') /* 头像（#77「负责人那个地方也需要有图标，就是人的头像」） ⚠️ 端上不一定拿得到头像图（`assigneeAvatar` 可能是空 key）⇒ 有图用图，没图用首字色块兜底（与留言区同一个手法）。 */ @@ -1233,10 +1240,7 @@ export struct FbTaskPanel { /* ---- 备注：可编辑 ---- */ Column({ space: 4 }) { Row({ space: 8 }) { - Text('备注') - .fontSize(FbMetric.fontTiny) - .fontColor(FbColors.faint) - .width(44) + this.fieldLb('备注') if (this.noteEdit) { TextInput({ text: this.noteDraft, placeholder: '补充说明…' }) .placeholderColor(FbColors.faint) @@ -1320,13 +1324,37 @@ export struct FbTaskPanel { return k !== '' ? fbImageSrc(k, this.token()) : ''; } + /** + * 「更多信息」里的一行字段标题（截止 / 负责人 / 备注 / 分类 / 循环）。 + * + * 🔴 #77j（用户 2026-11-05）：「截止、负责人、备注没改 —— + * 这几个字的颜色要变主题色粗体。」 + * + * ⚠️ 这与「编辑表单」的字段标签口径**不同**，是用户明确要求的： + * 整页编辑表单里 `期限` 那种是 `fontTiny + faint`（浅灰小字）， + * 但这个详情面板里用户希望它们**和区块标题一个观感** + * （主题色 + Bold）—— 因为它和「子任务/附件/留言」那些标题同属一个视觉层级， + * 只有它浅灰会显得"这两块不是一回事"。 + * + * ⚠️ 不走 `FbSectionTitle` 组件：那个带 `width('100%')` + + * `padding({top:12,bottom:8})`，而这里要的是"44vp 宽的行内标签"， + * 塞进去会把右侧控件顶到下一行。只**取它的三个核心属性** + * （Bold / accent / letterSpacing 0.6），宽度与内边距按行内标签给。 + */ + @Builder + fieldLb(t: string) { + Text(t) + .fontSize(FbMetric.fontSmall) + .fontWeight(FontWeight.Bold) + .fontColor(this.accent) + .letterSpacing(0.6) + .width(48) + } + @Builder kvRow(label: string, value: string) { Row({ space: 8 }) { - Text(label) - .fontSize(FbMetric.fontTiny) - .fontColor(FbColors.faint) - .width(44) + this.fieldLb(label) Text(value) .fontSize(FbMetric.fontSmall) .fontColor(FbColors.ink) @@ -1341,17 +1369,14 @@ export struct FbTaskPanel { @Builder shareSection() { Column({ space: 6 }) { + /* #77（用户 2026-11-05）：「共享给谁这个地方都和网页端一样，都改成协作人吧。」 + #77i：标题按规范走 `FbSectionTitle`（Bold + 主题色 + 字距）。 */ + FbSectionTitle({ + title: '协作人', + accent: this.accent, + extra: this.shares().length > 0 ? this.shares().length.toString() : '' + }) Row({ space: 6 }) { - /* #77（用户 2026-11-05）：「共享给谁这个地方都和网页端一样，都改成协作人吧。」 */ - Text('协作人') - .fontSize(FbMetric.fontSmall) - .fontWeight(FontWeight.Medium) - .fontColor(FbColors.ink) - if (this.shares().length > 0) { - Text(this.shares().length.toString()) - .fontSize(FbMetric.fontTiny) - .fontColor(FbColors.faint) - } Blank() Text(this.shareBusy ? '处理中…' : '＋ 共享') .fontSize(FbMetric.fontTiny) @@ -1643,9 +1668,12 @@ export struct FbTaskPanel { ⚠️ `FbPersonChip` 自带 `FbAvatar`（dia 18）+ inputBg 胶囊底， 所以外面那个 24vp 的 FbAvatar 要去掉，否则头像画两遍。 */ + /* #77i：把头像 URL 传进去 —— `FbPersonChip` 之前不透传 `imageUrl`， + 所以换成它之后头像就只剩首字色块了（那个参数我刚在 Widgets.ets 补上）。 */ FbPersonChip({ name: c.name, - color: c.color !== '' ? c.color : '#A84A28' + color: c.color !== '' ? c.color : '#A84A28', + imageUrl: c.avatar !== '' ? fbImageSrc(c.avatar, this.token()) : '' }) Text(c.createdAt) .fontSize(9) diff --git a/entry/src/main/ets/components/Widgets.ets b/entry/src/main/ets/components/Widgets.ets index 8e22c5d..91813bb 100644 --- a/entry/src/main/ets/components/Widgets.ets +++ b/entry/src/main/ets/components/Widgets.ets @@ -334,10 +334,34 @@ export struct FbPersonChip { @Param color: string = '#A84A28'; /** 是否显示文字（只放头像时传 false） */ @Param withText: boolean = true; + /** + * 头像图 URL（空 = 用色块字回落）。 + * + * 🔴 #77i（用户 2026-11-05）：「评论那个地方的头像怎么又没了？」 + * + * 真因：`FbAvatar` **本来就支持** `imageUrl`（它自己的注释里写着 + * 「名册 800 人里只有 19 人传过头像 ⇒ 两者都要有：有图显示图、没图回落色块字」）， + * 但 `FbPersonChip` **没有把这个参数透传下去** —— + * 它内部只写了 `FbAvatar({ name, color, dia, fontSizeVp })`。 + * ⇒ 凡是用 `FbPersonChip` 的地方，头像永远是首字色块，真图显示不出来。 + * + * ⚠️ 这是我上一轮"改用规范组件"时替换掉的：原来手写的 + * `FbAvatar({ ..., imageUrl: ... })` 是**能显示图的**， + * 换成 `FbPersonChip` 后反而丢了图 —— 用规范组件没错， + * 但规范组件本身缺了这层透传，得先补它。 + * ⚠️ URL 由调用方用 `fbImageSrc(key, token)` 拼好传进来（与 `FbAvatar` 同口径）。 + */ + @Param imageUrl: string = ''; build() { Row({ space: 4 }) { - FbAvatar({ name: this.name, color: this.color, dia: 18, fontSizeVp: 10 }) + FbAvatar({ + name: this.name, + color: this.color, + dia: 18, + fontSizeVp: 10, + imageUrl: this.imageUrl + }) if (this.withText) { Text(this.name) .fontSize(FbMetric.fontTiny)