@CustomDialog
export struct UpdateTipsDialog {
  // 接收外部传入的参数
  title: string = '提示';
  version: string = '';
  desc: string = '';
  confirmText: string = '确定';
  cancelText: string = '取消';

  // 是否强制更新
  isForce: boolean = false;

  controller: CustomDialogController;
  cancel: () => void = () => {};
  confirm: () => void = () => {};

  build() {
    Stack() {
      Image($r('app.media.ic_dialog_tips_mask_top'))
        .width('100%')
        .opacity(0.5)

      Column() {
        // 标题
        Text(this.title)
          .fontSize(18)
          .fontWeight(FontWeight.Bold)
          .margin({ top: 30, bottom: 12 })

        // 版本号
        Text(this.version)
          .fontSize(14)
          .fontColor('#FF999999')
          .margin({ bottom: 30 })
        // 描述
        Text(this.desc)
          .fontSize(14)
          .fontColor('#FF999999')
          .lineHeight(14 * 1.5)
          .margin({ bottom: 30 })
          .width('100%')
          .padding({ left: 20, right: 20})

        // 按钮区域
        Row({ space: 20 }) {
          if (!this.isForce) {
            Button(this.cancelText)
              .onClick(() => {
                this.controller.close();
                this.cancel();
              })
              .backgroundColor('#FFFFFFFF')
              .fontColor('#333333')
              .layoutWeight(1)
              .borderWidth(0.5)
              .borderColor('#FF252525')
              .height(44)
          }

          Button(this.confirmText)
            .onClick(() => {
              this.confirm();
              this.controller.close();
            })
            .backgroundColor(Color.Black) // 对应图片中的黑色按钮
            .fontColor(Color.White)
            .layoutWeight(1)
            .height(44)
        }
        .width('100%')
        .padding({ left: 20, right: 20, bottom: 20 })
      }
    }
    .width('90%')
    .alignContent(Alignment.TopStart)
    .backgroundColor(Color.White)
    .borderRadius(24) // 较大的圆角
  }
}
