ytpm-ClassAffairsAssistant/features/user/src/main/ets/pages/SettingPage.ets

import {
  BasicType,
  IBestToast,
  reviseImgHeaderBuilder,
  userInfo,
  UserInfo,
  YTAvoid,
  YTButton,
  YTHeader,
  YTLog,
  YTPhotoHelper,
  yTRouter,
  yTToast,
  YTUserRequest
} from 'basic'

@Builder
function settingBuilder() {
  NavDestination() {
    SettingPage()
  }
  .hideTitleBar(true)
}

@Component
struct SettingPage {
  @State showReviseName: boolean = false
  @State showHeaderImgRevise: boolean = false
  @StorageProp(YTAvoid.SAFE_BOTTOM_KEY) private safeBottom: number = 0
  @StorageProp(UserInfo.KEY) private userInfo: UserInfo = userInfo
  @State private value: string = ''
  private yTPhotoHelper = new YTPhotoHelper(this.getUIContext().getHostContext()!)
  private reviseBuilderArr: Array<BasicType> = [
    {
      text: '头像修改',
      src: '头像',
      click: () => {
        this.showHeaderImgRevise = true
      }
    },
    {
      text: '昵称修改',
      src: '名称',
      click: () => {
        this.showReviseName = true
      }
    },
  // {
  //   text: '密码设置',
  //   click: () => {
  //     yTRouter.router2UpdatePasswordPage()
  //   }
  // }
  ]
  private options: BasicType[] = [
    {
      text: '拍照',
      click: async () => {
        try {
          const fullpath = await this.yTPhotoHelper.takePicture()
          this.showHeaderImgRevise = false
          yTRouter.router2DelPhotoPage({ src: fullpath, type: 'header' })
        } catch (e) {
          YTLog.warn(e)
        }
      }
    },
    {
      text: '从相册中选择',
      click: () => {
        this.yTPhotoHelper.selectImage(
          (fullPath) => {
            this.showHeaderImgRevise = false
            yTRouter.router2DelPhotoPage({ src: fullPath, type: 'header' })
          })
      }
    },
    {
      text: '取消',
      click: () => {
        this.showHeaderImgRevise = false
      }
    },
  ]

  build() {
    Column() {
      YTHeader({ defaultStyle: { title: '用户设置' } })
      Column() {
        ForEach(this.reviseBuilderArr, (item: BasicType, index) => {
          this.reviseBuilder(item)
          if (index < this.reviseBuilderArr.length - 1) {
            Column() {
              Text('')
                .height(1)
                .width('100%')
                .backgroundColor('#1c1c1c1a')
            }
            .padding({ left: 12, right: 8 })
            .bindSheet($$this.showHeaderImgRevise, this.changeBuilder, {
              height: 204,
              backgroundColor: Color.White,
              showClose: false
            })
          }
        })
        Blank()
          .layoutWeight(1)

        YTButton({
          btContent: '注销用户',
          btFontColor: '#991C1C1C',
          btFontSize: 16,
          btHeight: 48,
          btBorderRadius: 40,
          bgc: Color.White,
          click: () => {
            yTToast.doubleConfirm({
              message: '注销后无法恢复,是否确定注销?', click: () => {
                YTUserRequest.logout(() => {
                  yTToast.hide()
                  yTRouter.routerBack()
                  setTimeout(() => {
                    IBestToast.show('注销成功')
                  }, 50)
                })

              }
            })
          }
        })
        YTButton({
          btContent: '退出登录',
          click: () => {
            this.userInfo.logout()
            yTRouter.routerBack()
            IBestToast.show({ message: '退出登录成功' })
          },
          btFontSize: 16,
          btHeight: 48,
          btBorderRadius: 40,
        })
        Text()
          .height(200)
          .width('100%')

      }
      .bindSheet($$this.showReviseName, this.reviseNameBuilder, {
        height: 275,
        showClose: false,
        backgroundColor: Color.White
      })
      .padding({
        left: 16,
        right: 16,

      })
    }
    .padding({ bottom: this.safeBottom })

  }

  @Builder
  reviseBuilder(item: BasicType) {
    Row() {
      Text(item.text)
        .fontSize($r('[basic].float.page_text_font_size_12'))
        .fontColor('#FF1C1C1C')
        .fontWeight(500)
        .fontSize(16)
      Row() {
        if (item.src == '头像') {
          Image(this.userInfo.getHeadImg() ? this.userInfo.getHeadImg() : $r('app.media.default_img'))
            .height(32)
            .width(32)
            .borderRadius(99)
        } else if (item.src == '名称') {
          Text(this.userInfo.getName() ?? this.userInfo.getPhoneNumber() ?? this.userInfo.getId()?.toString())
            .fontSize(16)
            .fontColor('#E61C1C1C')
        }
        Image($r('app.media.right_arrow'))
          .width(24)
          .width(24)
      }
    }
    .width('100%')
    .justifyContent(FlexAlign.SpaceBetween)
    .padding({ left: 12, right: 4 })
    .height(56)
    .onClick(item.click)
  }

  @Builder
  reviseNameBuilder() {
    Column() {

      Text('昵称')
        .width('100%')
        .height(36)
        .textAlign(TextAlign.Start)
        .fontSize(12)

      TextInput({ text: $$this.value, placeholder: '请输入昵称' })
        .borderRadius(4)
        .fontSize(12)
        .placeholderFont({ size: 12 })
        .placeholderColor('#14000000')
        .height(36)
        .width('100%')
        .backgroundColor(Color.White)
        .border({ width: 1, color: '#14000000' })
        .margin({ bottom: 25 })
        .maxLength(7)


      Row({ space: 32 }) {
        YTButton({
          btContent: '取消',
          btHeight: 25,
          btWidth: 78,
          btBorder: { width: 1, color: '#1A000000' },
          btPadding: {
            left: 26,
            right: 26,
            top: 4,
            bottom: 4
          },
          bgc: Color.White,
          btFontColor: $r('sys.color.mask_secondary'),
          click: () => {
            this.showReviseName = false
            this.value = ''

          }
        })
        YTButton({
          btContent: '完成',
          btHeight: 25,
          btWidth: 78,
          btPadding: {
            left: 26,
            right: 26,
            top: 4,
            bottom: 4
          },
          click: () => {
            if (!this.value) {
              IBestToast.show({
                type: "warning",
                message: "昵称不能为空"
              })
              return
            }
            YTUserRequest.changeNickname(this.value, () => {
              IBestToast.show({ message: '名称修改成功' })
              this.showReviseName = false
            })

          }
        })
      }
      .justifyContent(FlexAlign.Center)
      .width('100%')

    }
    .padding({ left: 22, right: 22, top: 8 })
  }

  @Builder
  changeBuilder() {
    reviseImgHeaderBuilder(this.options)
  }
}