import { Constants } from '../common/Constants';
import { RouterUrls } from '../common/RouterUrls';

@CustomDialog
export struct LoginTipDialog {
  controller: CustomDialogController;
  cancel: () => void = () => {
  }
  confirm: () => void = () => {
  }

  build() {
    Stack({alignContent: Alignment.TopStart}) {
      RelativeContainer() {
        Image($r('app.media.ic_tip_dialog_top_bg')).width('100%').aspectRatio(2.72)

        Column() {
          Text('温馨提示')
            .fontColor($r('app.color.color_212226'))
            .fontSize(24)
            .fontFamily('ysbth')
            .margin({ top: 20 })

          Text() {
            Span('登录之前需查看并同意')
            Span('《用户协议》')
              .fontColor($r("app.color.color_466afd"))
              .onClick(() => {
                this.getUIContext().getRouter().pushUrl({
                  url: RouterUrls.WEB_PAGE, params: {
                    title: '用户协议',
                    url: Constants.USER_AGREEMENT
                  }
                })
              })
            Span('和')
            Span('《隐私政策》')
              .fontColor($r("app.color.color_466afd"))
              .onClick(() => {
                this.getUIContext().getRouter().pushUrl({
                  url: RouterUrls.WEB_PAGE, params: {
                    title: '隐私政策',
                    url: Constants.PRIVACY_POLICY
                  }
                })
              })
          }
          .fontColor($r('app.color.color_727686'))
          .fontSize(14)
          .textAlign(TextAlign.Center)
          .margin({ top: 20, left: 20, right: 20 })

          Button('同意', { type: ButtonType.Capsule, stateEffect: true })
            .width(110)
            .height(40)
            .fontColor(Color.White)
            .fontSize(16)
            .backgroundColor($r("app.color.color_466afd"))
            .margin({ top: 20, bottom: 20 })
            .onClick(() => {
              this.controller.close();
              if (this.confirm) {
                this.confirm();
              }
            })
        }
        .width('100%')

        Image($r('app.media.ic_close_dialog')).width(18).height(18)
          .margin({top: 10, right: 10})
          .alignRules({
            right: {anchor: '__container__', align: HorizontalAlign.End}
          })
          .onClick(() => {
            this.controller.close()
          })
      }
      .width('100%')
      .height('auto')
      .borderRadius(20)
      .backgroundColor(Color.White)
      .margin({top: 26})

      Image($r('app.media.ic_notify_icon')).width(87).height(66).margin({left: 4})
    }
  }
}