import { CustomTitleUI } from '../reusable/CustomTitleUI'
import router from '@ohos.router'
import { editModel, editModelParams, WDEditDataModelType } from '../../model/EditInfoModel'
import EditInfoViewModel from '../../viewmodel/EditInfoViewModel';
@Entry
@Component
struct EditUserIntroductionPage {
  @State numCount: number = 0
  @State textColor : string = '#222222'
  @State introduction: string = ''
  @State params:editModelParams =  router.getParams() as editModelParams;
  @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
  @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
  build() {
    Column(){
      CustomTitleUI({titleName:'修改简介'})

      Row(){
        TextInput({placeholder:'请输入简介',text:this.params.editContent})
          .maxLength(60)
          .width('100%')
          .height(80)
          .backgroundColor(Color.White)
          .placeholderColor('#999999')
          .onChange(value => {
            this.numCount = value.length
            if (this.numCount === 60) {
              this.textColor = '#ED2800'
            }else if(this.numCount === 0){
              this.textColor = '#999999'
            }else {
              this.textColor = '#222222'
            }
            this.introduction = value
          })

        Row(){
          Text(this.numCount.toString())
            .fontColor(this.textColor)
          Text('/60')
            .fontColor('#999999')
        }.margin({left: -50})
      }
      .alignItems(VerticalAlign.Bottom)


      Divider()
        .margin(20)

      Row(){
        Text('1、账号中(头像、昵称等)不允许含有违禁违规内容；\n2、最多16个字，只能输入中文、数字、英文字母。')
          .fontSize(13)
          .fontColor(Color.Gray).lineHeight(25)
      }.padding({left:16}).width('100%')

      Button('保存')
        .type(ButtonType.Normal)
        .width('90%')
        .backgroundColor('#ED2800')
        .opacity(this.numCount === 0 ? 0.6 : 1)
        .fontColor(this.numCount === 0 ? '#999999' : Color.White)
        .borderRadius(5)
        .margin(30)
        .onClick(()=>{
          this.updateEditModel()
        })
    }
    .padding({top:px2vp(this.topSafeHeight),bottom:px2vp(this.bottomSafeHeight)})
  }


  updateEditModel(){
    if (this.params.editContent === this.introduction) {
      this.goBack()
      return
    }

    let currentUserInfo:editModel = new editModel()
    currentUserInfo.userExtend.introduction = this.introduction
    currentUserInfo.editDataType = WDEditDataModelType.WDEditDataModelType_intro
    EditInfoViewModel.updateUserInfo(currentUserInfo).then(()=>{
      this.goBack()
    }).catch(()=>{
      this.goBack()
    })
  }

  goBack(){
    let params: editModelParams = {
      introduction: this.introduction
    }
    router.back({
      url:'',
      params:params
    })
  }
}