FamilyBook_harmonyos/entry/src/main/ets/components/FbEventEditSheet.ets

/**
 * 家书 FamilyBook · 日程新建 / 编辑浮层（鸿蒙端）
 *
 * 用户 2026-10-15：「我们家书的日程功能模块……跟 SyncCalendar 做得一样」。
 *
 * 字段对齐 SyncCalendar 的 `EventEditPage`：
 *   **标题 / 全天 / 日期与时间（同一行）/ 重复 / 提醒 / 日历本 / 地点 / 备注**，
 *   编辑既有日程时底部还有一颗**删除**。
 *
 * 🔴 用户 2026-10-16 的两条修正：
 *   1. 「**重复和提醒都挤在一块了**……而且**重复和提醒什么的都点不了**。」
 *      · "点不了" = chip 曾是 `@Builder` 值参数（不参与观察）⇒ 换成 `FbEventChip` 组件；
 *      · "挤在一块" = 裸 `Flex({wrap})` 里的 chip **没有 margin** ⇒
 *        间距放进 `FbEventChip` 组件内部（项目别处的 wrap 也都写了 margin）。
 *   2. 「时间和日期……**放在一行上吧**，别放上下了。」
 *      · 原来开始/结束各占一整行（`日期 时间` 拼成一串）。
 *   3. **第二轮**：「你参考一下 SyncCalendar 的做法，实际上就是
 *      **把日期和时间放在一个控件里面**。」
 *      · 🔴 第一版我只做到"日期块 + 时间块并排一行"，**但仍是两个可点区**、
 *        点开的是**两个独立选择器** —— 不是 SyncCalendar 的形态。
 *      · SyncCalendar（`EventEditPage.dateTimePickerSheet`）是：
 *        **一个底部弹层里 `DatePicker` 与 `TimePicker` 并排**，
 *        选完点「确定」**一次回填**。
 *      · ⇒ 改成：控件是**一整块可点的框**（显示 `10月16日 周五 20:00`），
 *        点它开弹层、里面两个滚轮并排、点「确定」写回；
 *        弹层内部用**草稿**（`pickDate`/`pickHour`/`pickMin`）—— 取消可丢弃。
 *
 * 🔴 为什么用**浮层**而不是像 SyncCalendar 那样跳新页面：
 *    本项目的浮层范式已经统一（见 `FbPersonEditSheet` / `FbMovieDetailSheet`）——
 *    都是页面内的 `Stack` 覆盖层。跳页面会丢列表滚动位置、还要处理返回栈；
 *    浮层状态完全由父页面掌控（一个 `@Param`），更简单。
 *    ⚠️ 与 SyncCalendar 的**功能对齐**是有意的；**形态不同**是有意的。
 *
 * ⚠️ 服务端 `POST/PATCH /api/v1/events` 的字段名是**下划线**（`starts_at` 等），
 *    且"没传的字段沿用旧值" ⇒ 编辑时只需发改动的那些（见 `FbCalRepo.toBody`）。
 */

import { hilog } from '@kit.PerformanceAnalysisKit';
import { FbColors, FbMetric, FB_MASK } from '../common/Theme';
import { FbModuleDef, fbModuleOf, fbThemeVars } from '../model/Modules';
import { FbCalEventFull, FbCalEventInput, FbCalRepo } from '../data/FbCalRepo';
import { FbCalBook } from '../model/Types';
import { FB_TOKEN_STORE } from '../data/FbTokenStore';
import { FB_CAL_SETTINGS } from '../data/FbCalSettings';
import { FbEventChip } from './FbEventChip';
import { FbSheetRing } from './FbSheetRing';
/* 🔴 2026-10-30（工单 #36）：地点改成带联想的输入框 ——
   用户要「输入简单地址 → 下拉里带详细地址，好区分同名地点」。 */
import { FbAddrInput } from './FbAddrInput';
/* 🔴 v64（用户 2026-10-19）：「观影的开始/结束时间应该跟**日程里面的是一样的**。」
   ⇒ 「日期 + 时间」那一套控件抽成了共用组件（见该文件头），日程与观影都用它。
   ⚠️ 本文件里原来的 `dateTimeRow` / `dateTimePickerSheet` / `cnDate` /
      `parseDate` / `parseTime` / `pad` 全部删掉，改调这里的 —— 两份实现必然漂移，
      用户这次点名的正是"两边不一致"。 */
import {
  FbDateTimeRow,
  FbDateTimePicker,
  fbCnDate,
  fbPad2,
  fbToday,
  fbParseDate,
  fbParseTime,
  fbDateOf,
  fbTimeOf,
  fbIsoOf,
  fbAddHour,
  // 工单 #34 追加需求：点「开始」确定后，结束 = 开始 + 1 小时（跨天自动进位）
  fbPlusHours,
  FbDateTime
} from './FbDateTimeField';

const DOMAIN: number = 0x0000;
const TAG: string = 'FbEventEdit';

/** 贴底卡片的手势区缓冲（同其他浮层） */
const FB_SHEET_BOTTOM_GAP: number = 16;

/**
 * 提醒选项（分钟 → 文案）。
 *
 * 🔴 与 SyncCalendar 的 `reminderChip` 同一组值（0/5/10/15/30/60/1440）——
 *    两边口径一致，用户在两个 App 里看到的选项不会不一样。
 */
interface FbRemindOpt {
  min: number;
  label: string;
}

const REMIND_OPTS: FbRemindOpt[] = [
  { min: 0, label: '不提醒' },
  { min: 5, label: '提前5分钟' },
  { min: 10, label: '提前10分钟' },
  { min: 15, label: '提前15分钟' },
  { min: 30, label: '提前30分钟' },
  { min: 60, label: '提前1小时' },
  { min: 1440, label: '提前1天' }
];

/**
 * 重复选项（key → 文案 + RRULE）。
 *
 * ⚠️ 只做**最常见的那几种**（对齐 SyncCalendar 的 chip 组），
 *    "每两周/自定义"这类留给网页端 —— 手机上点五层下拉去拼 RRULE 得不偿失。
 *    ⚠️ 端上拼的是**完整 RRULE 串**，服务端 `rruleFromBody()` 也认这个口径。
 */
interface FbRepeatOpt {
  key: string;
  label: string;
  rule: string;
}

const REPEAT_OPTS: FbRepeatOpt[] = [
  { key: 'none', label: '不重复', rule: '' },
  { key: 'daily', label: '每天', rule: 'FREQ=DAILY' },
  { key: 'weekday', label: '工作日', rule: 'FREQ=WEEKLY;BYDAY=MO,TU,WE,TH,FR' },
  { key: 'weekly', label: '每周', rule: 'FREQ=WEEKLY' },
  { key: 'monthly', label: '每月', rule: 'FREQ=MONTHLY' },
  { key: 'yearly', label: '每年', rule: 'FREQ=YEARLY' }
];

@ComponentV2
export struct FbEventEditSheet {
  /** 要编辑的日程（null + isCreate=false 表示没打开；isCreate=true 时是"新建"） */
  @Param event: FbCalEventFull | null = null;
  /** 新建模式 */
  @Param isCreate: boolean = false;
  /** 新建时预填的日期（`YYYY-MM-DD`，从"点哪天的格子"来） */
  @Param presetDate: string = '';
  /** 可选的日历本（新建时要选落到哪本） */
  @Param books: FbCalBook[] = [];

  /**
   * 卡片外圈描边环的颜色（hex，'' = 用日程模块色）。
   *
   * ⚠️ 必须是字符串：环色要直接当背景色（`FbColors.brand` 是 `Resource`，用不了）。
   */
  @Param accent: string = '';

  /** 环色：显式给了就用给的，否则取日程模块色 */
  private accentColor(): string {
    if (this.accent !== '') {
      return this.accent;
    }
    const m: FbModuleDef | undefined = fbModuleOf('calendar');
    return fbThemeVars(m !== undefined ? m.color : '#A84A28').brand;
  }

  /** 取消 */
  @Event onCancel: () => void = (): void => {
  };
  /** 保存成功 */
  @Event onSaved: () => void = (): void => {
  };
  /** 删除成功 */
  @Event onDeleted: () => void = (): void => {
  };

  // ---- 表单状态 ----
  @Local fTitle: string = '';
  @Local fAllDay: boolean = false;
  /** `YYYY-MM-DD` */
  @Local fStartDate: string = '';
  /** `HH:mm` */
  @Local fStartTime: string = '09:00';
  @Local fEndDate: string = '';
  @Local fEndTime: string = '10:00';
  @Local fPlace: string = '';
  @Local fNote: string = '';
  /** 重复的 key（REPEAT_OPTS 里那个） */
  @Local fRepeat: string = 'none';
  /**
   * 🔴 用户**是否亲手点过**重复选项（v86d）。
   *
   * 为什么要这一位：`save()` 里有个保护逻辑 —— 原日程的 `rrule` 若非空
   * 而端上认不出（归到 `none`），就不发 `rrule`，免得把人家自定义的规则清掉。
   * 但这条保护**误伤了一个常见操作**：原规则是「每天」，用户改选「不重复」，
   * 此时 `fRepeat === 'none'` 且 `event.rrule !== ''` ⇒ 被判成"认不出"⇒
   * **整项跳过、规则原样保留** ⇒ 用户看着选了不重复，存完还是每天，且毫无提示。
   * ⇒ 用这一位区分"归入 none"（初始态/认不出）与"主动选了 none"（要清空）。
   */
  @Local fRepeatTouched: boolean = false;
  /** 提醒分钟（可多选；空数组 = 不提醒） */
  @Local fRemind: number[] = [];
  /** 选中的日历本 id */
  @Local fBookId: number = 0;

  @Local busy: boolean = false;
  @Local err: string = '';
  @Local confirmDel: boolean = false;
  @Local deleting: boolean = false;

  // ---- 「日期 + 时间」选择弹层（照 SyncCalendar 的 `dateTimePickerSheet`）----
  /**
   * 弹层开着吗。
   *
   * 🔴 **为什么不是"就地展开"**（这是用户 2026-10-16 的第二条反馈）：
   *    SyncCalendar 的做法是**一个底部弹层里 `DatePicker` 与 `TimePicker` 并排**
   *    （见其 `EventEditPage.dateTimePickerSheet`），选完点「确定」一次回填。
   *    我第一版做成了"点日期块就地展开一个 DatePicker、点时间块再展开一个 TimePicker"
   *    —— 那是两个控件、分两次选，不是它的做法。
   */
  @Local pickOpen: boolean = false;
  /** 正在选的是"结束"（false = 开始） */
  @Local pickIsEnd: boolean = false;
  /** 弹层里的**草稿**值：点「确定」才写回 `fStartXxx`/`fEndXxx`（取消则丢弃） */
  @Local pickDate: Date = new Date();
  @Local pickHour: number = 9;
  @Local pickMin: number = 0;

  aboutToAppear(): void {
    const e: FbCalEventFull | null = this.event;
    if (e !== null) {
      // ---- 编辑：回填 ----
      this.fTitle = e.title;
      this.fAllDay = e.all_day;
      this.fStartDate = fbDateOf(e.starts_at, this.todayStr());
      this.fStartTime = fbTimeOf(e.starts_at, '09:00');
      this.fEndDate = e.ends_at !== '' ? fbDateOf(e.ends_at, this.todayStr()) : fbDateOf(e.starts_at, this.todayStr());
      this.fEndTime = e.ends_at !== '' ? fbTimeOf(e.ends_at, '10:00') : this.addHour(e.starts_at);
      this.fPlace = e.location;
      this.fNote = e.note;
      this.fRepeat = this.repeatKeyOf(e.rrule);
      this.fRemind = this.minsOf(e.reminder_minutes);
      this.fBookId = e.calendar_id;
      return;
    }
    // ---- 新建：预填 ----
    const d: string = this.presetDate !== '' ? this.presetDate : fbToday();
    this.fStartDate = d;
    this.fEndDate = d;
    // 新建时把**开始时间**预填成"下一个整点"、结束 +1 小时 ——
    // 比固定 09:00 更符合"现在就要加一条"的场景（打开就能直接存）。
    const now: Date = new Date();
    const nh: number = Math.min(now.getHours() + 1, 22);
    this.fStartTime = fbPad2(nh) + ':00';
    this.fEndTime = fbPad2(nh + 1 > 23 ? 23 : nh + 1) + ':00';
    this.fBookId = this.defaultBookId();
  }

  // ============================================================
  // 取值 / 换算
  // ============================================================

  private todayStr(): string {
    return fbToday();
  }

  /** 给一个时刻的时分 +1 小时（当结束时间没填时的兜底） */
  private addHour(dt: string): string {
    return fbAddHour(fbTimeOf(dt, '09:00'));
  }

  /** 默认落到的日历本：设置里选的（若还在可选列表里），否则第一本可写的 */
  private defaultBookId(): number {
    const want: number = FB_CAL_SETTINGS.getBookId();
    for (const b of this.books) {
      if (b.id === want && b.canWrite) {
        return b.id;
      }
    }
    for (const b of this.books) {
      if (b.canWrite) {
        return b.id;
      }
    }
    return 0;
  }

  /** 重复：从 RRULE 串反推是哪个 chip（认不出就归"不重复"） */
  private repeatKeyOf(rrule: string): string {
    if (rrule === '') {
      return 'none';
    }
    for (const o of REPEAT_OPTS) {
      if (o.rule !== '' && rrule.indexOf(o.rule) === 0) {
        return o.key;
      }
    }
    // 认不出的复杂规则：给"不重复"更危险（会覆盖掉原规则），
    // 但端上确实没有编辑自定义规则的能力 ⇒ 保留原文不覆盖（见 save() 的处理）
    return 'none';
  }

  /** 重复 chip → RRULE 串 */
  private ruleOfRepeat(): string {
    for (const o of REPEAT_OPTS) {
      if (o.key === this.fRepeat) {
        return o.rule;
      }
    }
    return '';
  }

  /** 提醒串 → 分钟数组 */
  private minsOf(s: string): number[] {
    const out: number[] = [];
    if (s === '') {
      return out;
    }
    for (const x of s.split(',')) {
      const n: number = parseInt(x.trim(), 10);
      if (!isNaN(n) && n > 0) {
        out.push(n);
      }
    }
    return out;
  }

  /** 登录令牌 */
  private token(): string {
    return FB_TOKEN_STORE.get();
  }

  // ============================================================
  // 小件
  // ============================================================

  @Builder
  /**
   * 一个输入行（**两排版式**，GLOBAL-FORM-SPEC —— 用户 2026-11-05）。
   *
   * 「点击名册里面的"添加"，姓名之类的内容全部都按这种形式显示。
   *   它会按照主题色，加粗大一点显示。**所有地方都需要这样改**。」
   * 「为了解决字数原因导致输入框左右来回对不齐的问题，我们全部按两排来显示。」
   *
   * | 项 | 规则 |
   * |---|---|
   * | 标签颜色 | **主题色** `this.accent`（必填红 `#C0533F`） |
   * | 标签字重 | **Bold** |
   * | 标签字号 | `fontSmall`（比正文大一号） |
   * | 版式 | 标签独占第一排，输入框第二排整宽 |
   * | 必填 | 红色，**无星号** |
   */
  @Builder
  field(label: string, value: string, hint: string, onChange: (v: string) => void,
    req: boolean = false) {
    Column({ space: 6 }) {
      Text(label)
        .fontSize(FbMetric.fontSmall)
        .fontWeight(FontWeight.Bold)
        .fontColor(req ? '#C0533F' : this.accent)
        .width('100%')
      TextInput({ text: value, placeholder: hint })
        .placeholderColor(FbColors.faint)
        .fontSize(FbMetric.fontSmall)
        .fontColor(FbColors.ink)
        .backgroundColor(FbColors.inputBg)
        .borderRadius(FbMetric.radiusS)
        .height(42)
        .width('100%')
        .padding({ left: 12, right: 12 })
        .onChange((v: string): void => {
          onChange(v);
        })
    }
    .width('100%')
    .alignItems(HorizontalAlign.Start)
  }

  @Builder
  area(label: string, value: string, hint: string, onChange: (v: string) => void) {
    Column({ space: 4 }) {
      Text(label)
        .fontSize(FbMetric.fontTiny)
        .fontColor(FbColors.faint)
      TextArea({ text: value, placeholder: hint })
        .placeholderColor(FbColors.faint)
        .fontSize(FbMetric.fontSmall)
        .fontColor(FbColors.ink)
        .backgroundColor(FbColors.inputBg)
        .borderRadius(FbMetric.radiusS)
        .height(72)
        .padding({ left: 12, right: 12, top: 8, bottom: 8 })
        .onChange((v: string): void => {
          onChange(v);
        })
    }
    .width('100%')
    .alignItems(HorizontalAlign.Start)
  }

  /** 小标题（把一大串字段分开） */
  @Builder
  section(title: string) {
    Text(title)
      .fontSize(FbMetric.fontTiny)
      .fontColor(FbColors.faint)
      .width('100%')
      .margin({ top: 6 })
  }

  /**
   * ⚠️ 这里删掉过两个 `@Builder`，都**不要**加回来：
   *   · `chip(label, on: boolean, onTap)` —— "重复/提醒点不了"的根因
   *     （@Builder 值参数不参与观察）⇒ 已换成 `FbEventChip` 组件。
   *   · `pickRow(label, value, onTap)` —— 被"日期时间并排一行"取代
   *     （用户要求时间和日期同一行，不再上下堆）⇒ 见 `dateTimeRow`。
   */

  build() {
    // 🔴 外层 `Stack` 是**必需**的：本组件有**三个**要显示的层
    //    （编辑卡片 + 日期时间弹层 + 删除确认遮罩），而 build() 只能有一个根节点。
    // 🔴 2026-10-19 用户：「所有弹框都加线，编辑也弄成弹框，保持一致。」
    //    ⇒ 原来 `alignContent: Bottom`（贴底抽屉），现在改成**居中**，
    //      与名册的编辑/详情、日程详情同一个形态（四角圆角浮卡 + 主题色环）。
    Stack({ alignContent: Alignment.Center }) {
      this.editCard()

      // ---- 「日期 + 时间」选择弹层（照 SyncCalendar）----
      if (this.pickOpen) {
        this.dateTimePickerSheet()
      }

      if (this.confirmDel) {
        this.deleteConfirm()
      }
    }
    .width('100%')
    .height('100%')
  }

  @Builder
  editCard() {
    // ⚠️ 这一层只给**宽度**（92%）；卡片自己必须 100%，
    //    否则 0.92×0.92 ≈ 84.6%，比别的浮层窄一圈。
    Column() {
      FbSheetRing({ radius: FbMetric.radius, ringColor: this.accentColor() }) {
        Column({ space: 0 }) {
      // ---- 标题栏 ----
      Row({ space: 12 }) {
        Text(this.isCreate ? '新建日程' : '编辑日程')
          .fontSize(FbMetric.fontTitle)
          .fontWeight(FontWeight.Medium)
          .fontColor(FbColors.ink)
        Blank()
        Text('取消')
          .fontSize(FbMetric.fontSmall)
          .fontColor(FbColors.muted)
          .padding({ left: 12, right: 12, top: 6, bottom: 6 })
          .onClick((): void => {
            this.onCancel();
          })
      }
      .width('100%')
      .alignItems(VerticalAlign.Center)

      Scroll() {
        Column({ space: 12 }) {
          this.field('标题', this.fTitle, '日程得有个标题', (v: string): void => {
            this.fTitle = v;
          })

          // ---- 全天 ----
          Row() {
            Text('全天')
              .fontSize(FbMetric.fontSmall)
              .fontColor(FbColors.ink)
            Blank()
            Toggle({ type: ToggleType.Switch, isOn: this.fAllDay })
              .selectedColor('#4A7C82')
              .onChange((on: boolean): void => {
                this.fAllDay = on;
              })
          }
          .width('100%')
          .height(42)
          .padding({ left: 12, right: 12 })
          .backgroundColor(FbColors.inputBg)
          .borderRadius(FbMetric.radiusS)

          // ---- 日历本 ----
          /* 🔴🔴 v84 真机实测（2026-10-24）：这一组原来排在「提醒」后面，
             而表单内容比卡片（`maxHeight: 86%`）高 ⇒ 它在**滚动区下方**，
             首屏只能看到被底边切掉半行的标题（实测 bounds 高 7px）。
             用户报「选不了日历本」的直觉来源就是这个：看不见 = 用不了。
             ⇒ 它是**必选项**（没选就 `请选一本日历` 存不上），
               必须排在**首屏可见**的位置：紧跟「全天」，在日期时间之前。
             ⚠️ 别再往回调到「提醒」后面 —— 那栏一长，它必然被推到屏幕外。 */
          if (this.books.length > 0) {
            this.section('加入哪本日历')
            Flex({ wrap: FlexWrap.Wrap }) {
              ForEach(this.books, (b: FbCalBook) => {
                FbEventChip({
                  label: b.name,
                  active: this.fBookId === b.id,
                  // 选中时用**这本日历自己的颜色**（一眼看出落到哪本）
                  activeBg: b.color,
                  onPick: (): void => {
                    this.fBookId = b.id;
                  }
                })
              }, (b: FbCalBook): string => 'bk_' + b.id.toString())
            }
            .width('100%')
          }

          // ---- 日期与时间 ----
          // 🔴 照 SyncCalendar：**一行一个"日期 + 时间"控件**（点开一个弹层、
          //    里面 DatePicker 与 TimePicker 并排，选完点「确定」）。
          //    用户 2026-10-16：「实际上就是把日期和时间放在一个控件里面。」
          this.section('日期与时间')
          this.dateTimeRow('开始', true)
          if (!this.fAllDay) {
            this.dateTimeRow('结束', false)
          }

          // ---- 重复 ----
          // 🔴 用 `FbEventChip` **组件**而不是 @Builder ——
          //    @Builder 的值类型参数（on: boolean）变化**不触发重建**，
          //    这正是"重复/提醒点不了"的根因（见该组件文件头）。
          this.section('重复')
          Flex({ wrap: FlexWrap.Wrap }) {
            ForEach(REPEAT_OPTS, (o: FbRepeatOpt) => {
              FbEventChip({
                label: o.label,
                active: this.fRepeat === o.key,
                onPick: (): void => {
                  this.fRepeat = o.key;
                  /* 🔴 v86d（2026-10-24 真机事故）：**记下"用户真的点过"**。
                     详见 `save()` 里 `recognize` 的说明 —— 没有这一位，
                     用户从「每天」改选「不重复」时，保存会把这项**整条跳过**，
                     于是"选了不重复、存完还是每天"，而且**没有任何报错**。 */
                  this.fRepeatTouched = true;
                }
              })
            }, (o: FbRepeatOpt): string => 'rp_' + o.key)
          }
          .width('100%')
          .margin({ top: 2 })

          // ---- 提醒 ----
          this.section('提醒（可多选）')
          Flex({ wrap: FlexWrap.Wrap }) {
            ForEach(REMIND_OPTS, (o: FbRemindOpt) => {
              FbEventChip({
                label: o.label,
                active: this.hasRemind(o.min),
                onPick: (): void => {
                  this.toggleRemind(o.min);
                }
              })
            }, (o: FbRemindOpt): string => 'rm_' + o.min.toString())
          }
          .width('100%')
          .margin({ top: 2 })

          // ---- 地点 / 备注 ----
          /* 🔴 2026-10-30（工单 #36）：地点换成**带联想**的输入框。
             用户：「输入一个简单地址、下拉显示详细地址时，不能只把地点告诉我，
             一定要把详细地址也放在后面。因为同一个地址可能有好几个，
             我根本不知道应该选哪一个。」——与网页端 addr_suggest.js 同一行为。
             ⚠️ 选中候选后只把**地名**写进 location（与网页端日程那栏一致：
                日程没有单独的"详细地址"字段，而带门牌会让后续按名字搜索变难；
                详细地址在下拉里已经看到、能区分就够）。 */
          FbAddrInput({
            label: '地点',
            placeholder: '地点（可选，输入后可从下拉选）',
            value: this.fPlace,
            onValue: (v: string): void => {
              this.fPlace = v;
            }
          })
          this.area('备注', this.fNote, '备注（可选）', (v: string): void => {
            this.fNote = v;
          })
        }
        .width('100%')
        .padding({ top: 14 })
      }
      .layoutWeight(1)
      .width('100%')
      .scrollBar(BarState.Off)
      .align(Alignment.TopStart)

      /* 🔴🔴 v84 真机实测（2026-10-24）：错误提示原来放在**滚动区内部最底部**
         （`this.area('备注' …)` 后面），于是——
           ① 用户在顶部点「创建」时，提示在几百 px 之下，**根本看不见**；
           ② 就算滚到底，它也被 `Scroll` 底边切掉半行（实测 bounds 高 39px，紧贴 2024 边界）。
         现象就是「点了创建什么都没发生」——这是最难查的一类失败（用户只会以为没生效）。
         ⇒ 挪到**滚动区外面、按钮区上方**：无论滚到哪儿，点完立刻看得见。
         ⚠️ 不要挪回 Scroll 里：那里的可见性取决于用户当时滚到哪儿，运气好才看得见。 */
      if (this.err !== '') {
        Text(this.err)
          .fontSize(FbMetric.fontTiny)
          .fontColor('#A32D2D')
          .width('100%')
          .margin({ top: 10 })
      }

      // ---- 底部按钮：删除 / 保存 ----
      if (this.deleting) {
        Text('删除中…')
          .fontSize(FbMetric.fontSmall)
          .fontColor(FbColors.faint)
          .textAlign(TextAlign.Center)
          .width('100%')
          .height(42)
          .margin({ top: 16 })
      } else {
        Row({ space: 10 }) {
          if (!this.isCreate) {
            // 🔴 用户 2026-10-19：「删除按钮全部用红色背景」
            //    （原来是红色描边、白底 —— 与"所有删除都红底"不一致）
            Text('删除')
              .fontSize(FbMetric.fontSmall)
              .fontColor(Color.White)
              .textAlign(TextAlign.Center)
              .height(42)
              .padding({ left: 18, right: 18 })
              .backgroundColor(FbColors.red)
              .borderRadius(FbMetric.radiusS)
              .onClick((): void => {
                if (!this.busy) {
                  this.confirmDel = true;
                }
              })
          }
          Text(this.busy ? '保存中…' : (this.isCreate ? '创建' : '保存'))
            .fontSize(FbMetric.fontSmall)
            .fontColor(Color.White)
            .textAlign(TextAlign.Center)
            .layoutWeight(1)
            .height(42)
            // 🔴 底色用**日程模块主题色**（原来写死名册青 #4A7C82，
            //    在日程页里看着像走错了页面 —— 用户 2026-10-19）
            .backgroundColor(this.busy ? FbColors.faint : this.accentColor())
            .borderRadius(FbMetric.radiusS)
            .onClick((): void => {
              if (!this.busy) {
                this.save();
              }
            })
        }
        .width('100%')
        .margin({ top: 16 })
      }
    }
    .width('100%')
    .constraintSize({ maxHeight: '86%' })
    .padding({ left: 18, right: 18, top: 18, bottom: 20 })
    .alignItems(HorizontalAlign.Start)
      }
    }
    .width('92%')
  }

  /**
   * **一个「日期 + 时间」控件**（照 SyncCalendar 的 `EventEditPage`）。
   *
   * 🔴 v64：实现已抽到 `FbDateTimeField.ets::FbDateTimeRow`（**与观影共用**）——
   *    用户 2026-10-19：「观影的开始/结束时间应该跟日程里面的是一样的。」
   *    这里只负责"把本表单的值传进去 + 接住点击"。
   */
  @Builder
  dateTimeRow(label: string, isStart: boolean) {
    FbDateTimeRow({
      label: label,
      date: isStart ? this.fStartDate : this.fEndDate,
      time: isStart ? this.fStartTime : this.fEndTime,
      allDay: this.fAllDay,
      accent: this.accentColor(),
      onTap: (): void => {
        this.openPicker(isStart);
      }
    })
  }

  /**
   * 打开「日期 + 时间」弹层（把当前值装进草稿）。
   *
   * ⚠️ 草稿的意义：用户滚了一半又点「取消」⇒ **不写回**（`fStartXxx` 保持原样）。
   *    若直接改 `fStartXxx`，"取消"就没法撤销了。
   *
   * 🔴🔴 v88（工单 #34，用户 2026-10-30）：「日程添加时，选择时间，点上面，
   *    修改的反而是结束时间。」
   *
   *    根因：这个参数**原来叫 `isEnd`**，而调用方 `dateTimeRow(label, isStart)`
   *    传进来的是 `isStart`。名字一换、语义就反了：
   *      isStart=true（点「开始」）→ isEnd=true → 整条链路按"结束"处理。
   *    而且错得很"自洽"——弹层初值读的是结束时间、写回也写给结束时间、
   *    连标题都显示「选择结束时间」，三个地方一起错，所以看着不像坏。
   *
   *    ⇒ 参数统一成 `isStart`（**与调用方同名同义**），内部自己取反。
   *      不要图省事在调用处写 `openPicker(!isStart)` —— 双重否定更容易再错一次。
   */
  private openPicker(isStart: boolean): void {
    this.pickIsEnd = !isStart;
    // ⚠️ 草稿值放在宿主，弹层组件 `aboutToAppear` 时从这里读初值 ——
    //    组件每次挂载都会重新读一次，所以"点开始 → 取消 → 点结束"拿到的是各自的值。
    this.pickDate = fbParseDate(isStart ? this.fStartDate : this.fEndDate);
    const tm: Date = fbParseTime(isStart ? this.fStartTime : this.fEndTime);
    this.pickHour = tm.getHours();
    this.pickMin = tm.getMinutes();
    this.pickOpen = true;
  }

  /**
   * 「确定」：把草稿写回。
   *
   * 🔵 工单 #34 追加需求（用户 2026-11-01）：
   *   「当我选择了开始时间并确定之后，结束时间要跟着开始时间变成开始时间加1个小时。
   *     也就是说，所有时间我们都默认它是一个小时。如果不是一个小时，再让他自己去改。」
   *
   * ⇒ **点「开始」确定后，结束无条件重置为「开始 + 1 小时」**。
   *
   * 改动前只在"会变成负时长"时才动结束（`if (结束 < 开始)`），
   * 于是用户改了开始、结束还挂在老位置，实际时长变成随机的 —— 就是要灭掉这个。
   *
   * ⚠️ 改「结束」那条路**一个字不动**：改结束不能影响开始。
   *    这正是"默认一小时、不像一小时再自己改"的另一半。
   * ⚠️ 跨天用 `fbPlusHours()` 的 `Date` 运算：23:30 + 1h ⇒ **次日 00:30**，
   *    日期一起进一天。不要图省事写成 `fbAddHour()` —— 那个封顶 23 点且不带日期。
   * ⚠️ 全天日程不参与：时刻部分本来就不生效（`save()` 里全天走 `00:00:00`），
   *    这里改了也不会落到服务端，但会让"切回非全天"时看到一个莫名的时间，所以跳过。
   */
  private applyPicker(iso: string, hm: string): void {
    if (this.pickIsEnd) {
      this.fEndDate = iso;
      this.fEndTime = hm;
    } else {
      this.fStartDate = iso;
      this.fStartTime = hm;
      if (!this.fAllDay) {
        // 结束 = 开始 + 1 小时（默认时长一律一小时；要别的时长用户自己去点「结束」改）
        const plus: FbDateTime = fbPlusHours(iso, hm, 1);
        this.fEndDate = plus.date;
        this.fEndTime = plus.time;
      }
    }
    this.pickOpen = false;
  }

  /**
   * 日期 + 时间选择弹层（**照 SyncCalendar 的 `dateTimePickerSheet`**）。
   *
   * 🔴 v64：实现已抽到 `FbDateTimeField.ets::FbDateTimePicker`（**与观影共用**）。
   *    结构（标题 → `Row { DatePicker | TimePicker }` 并排 → 确定）与原来完全一致，
   *    差别只是"这一份现在只有一处代码"。
   */
  @Builder
  dateTimePickerSheet() {
    FbDateTimePicker({
      title: this.pickIsEnd ? '选择结束时间' : '选择开始时间',
      date: fbIsoOf(this.pickDate),
      time: fbPad2(this.pickHour) + ':' + fbPad2(this.pickMin),
      allDay: this.fAllDay,
      accent: this.accentColor(),
      onConfirm: (d: string, t: string): void => {
        this.applyPicker(d, t);
      },
      onCancel: (): void => {
        this.pickOpen = false;
      }
    })
  }

  @Builder
  deleteConfirm() {
    Column() {
      // 🔴 2026-10-19：确认框也加主题色环（"所有弹框都加线"不能漏这一层）
      Column() {
        FbSheetRing({ radius: FbMetric.radius, ringColor: this.accentColor() }) {
          Column({ space: 8 }) {
        Text('删除这条日程？')
          .fontSize(FbMetric.fontBody)
          .fontWeight(FontWeight.Medium)
          .fontColor(FbColors.ink)
        Text('删掉之后不能撤销。若这条日程是重复的，这一次和以后的都会不见。')
          .fontSize(FbMetric.fontTiny)
          .fontColor(FbColors.muted)
          .maxLines(3)
        Row({ space: 10 }) {
          Text('取消')
            .fontSize(FbMetric.fontSmall)
            .fontColor(FbColors.muted)
            .textAlign(TextAlign.Center)
            .layoutWeight(1)
            .height(42)
            .backgroundColor(FbColors.inputBg)
            .borderRadius(FbMetric.radiusS)
            .onClick((): void => {
              this.confirmDel = false;
            })
          Text('删除')
            .fontSize(FbMetric.fontSmall)
            .fontColor(Color.White)
            .textAlign(TextAlign.Center)
            .layoutWeight(1)
            .height(42)
            .backgroundColor(FbColors.red)
            .borderRadius(FbMetric.radiusS)
            .onClick((): void => {
              this.confirmDel = false;
              this.doDelete();
            })
        }
        .width('100%')
        .margin({ top: 10 })
      }
      .width('100%')
      .padding(18)
      .alignItems(HorizontalAlign.Start)
        }
      }
      .width('100%')
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
    .padding({ left: 32, right: 32 })
    .backgroundColor(FB_MASK)
    .onClick((): void => {
      this.confirmDel = false;
    })
  }

  // ============================================================
  // 提醒多选
  // ============================================================

  private hasRemind(min: number): boolean {
    // 0 = "不提醒"：选中它等价于"没有任何提醒"
    if (min === 0) {
      return this.fRemind.length === 0;
    }
    return this.fRemind.indexOf(min) >= 0;
  }

  private toggleRemind(min: number): void {
    if (min === 0) {
      this.fRemind = [];
      return;
    }
    const at: number = this.fRemind.indexOf(min);
    if (at >= 0) {
      this.fRemind.splice(at, 1);
    } else {
      this.fRemind.push(min);
    }
  }

  // ============================================================
  // 网络
  // ============================================================

  private async doDelete(): Promise<void> {
    const e: FbCalEventFull | null = this.event;
    if (e === null) {
      return;
    }
    const token: string = this.token();
    if (token === '') {
      this.err = '未登录，无法删除';
      return;
    }
    this.deleting = true;
    this.err = '';
    const res = await FbCalRepo.inst().remove(e.id, token);
    this.deleting = false;
    if (!res.ok) {
      hilog.warn(DOMAIN, TAG, '删除日程失败：%{public}s', res.error);
      this.err = '删除失败：' + res.error;
      return;
    }
    this.onDeleted();
  }

  /** 保存（新建走 POST、编辑走 PATCH） */
  private async save(): Promise<void> {
    const title: string = this.fTitle.trim();
    if (title === '') {
      this.err = '日程得有个标题';
      return;
    }
    const token: string = this.token();
    if (token === '') {
      this.err = this.isCreate ? '未登录，无法创建' : '未登录，无法保存';
      return;
    }
    const isNew: boolean = this.isCreate || this.event === null;
    if (isNew && this.fBookId <= 0) {
      this.err = '请选一本日历';
      return;
    }

    // ---- 时间：全天归零到 00:00；否则拼上时分 ----
    const startAt: string = this.fAllDay
      ? (this.fStartDate + ' 00:00:00')
      : (this.fStartDate + ' ' + this.fStartTime + ':00');
    let endAt: string = this.fAllDay
      ? (this.fEndDate + ' 00:00:00')
      : (this.fEndDate + ' ' + this.fEndTime + ':00');
    // ⚠️ 结束早于开始 ⇒ 补成同一时刻（服务端不校验时长，但"负时长"看着是坏的）
    if (endAt < startAt) {
      endAt = startAt;
    }

    this.busy = true;
    this.err = '';
    const input: FbCalEventInput = {
      title: title,
      location: this.fPlace.trim(),
      starts_at: startAt,
      ends_at: endAt,
      all_day: this.fAllDay,
      note: this.fNote,
      reminder_minutes: this.fRemind
    };
    /* ⚠️ 重复：只在**能确定用户意图**时才发。
      两种情况会走到这里：
        ① 用户**亲手点过**某个 chip（含"不重复"）⇒ 以他点的为准，必须发。
        ② 用户没点过，但原日程的 `rrule` 本来就认得出（或本来就是空）⇒ 发原值。
      留空的唯一情形：用户没点过、且原规则非空又认不出（自定义重复）——
      这时发空 `rrule` 会把人家的规则**清掉**，所以宁可不发。
      🔴 v86d 修的正是漏掉情况 ① 里的"主动选不重复"：
         原写法只判 `fRepeat !== 'none'`，于是"每天 → 不重复"被判成认不出，
         整项跳过 ⇒ 存完还是每天（真机实测，用户会以为点了没生效）。 */
    const recognize: boolean = this.fRepeatTouched
      || this.fRepeat !== 'none'
      || (this.event !== null && this.event.rrule === '');
    if (recognize) {
      input.rrule = this.ruleOfRepeat();
    }
    if (isNew) {
      input.calendar_id = this.fBookId;
    }

    const repo: FbCalRepo = FbCalRepo.inst();
    const res = isNew ? await repo.create(input, token) : await repo.update(this.event!.id, input, token);
    this.busy = false;
    if (!res.ok) {
      hilog.warn(DOMAIN, TAG, '保存日程失败：%{public}s', res.error);
      this.err = (isNew ? '创建失败：' : '保存失败：') + res.error;
      return;
    }
    // 新建时把选的日历本记成"以后默认用它"（与 SyncCalendar 的默认本同一体验）
    if (isNew) {
      FB_CAL_SETTINGS.setBookId(this.fBookId);
    }
    this.onSaved();
  }
}