import { CustomTitleUI } from '../reusable/CustomTitleUI'

@Entry
@Component
struct EditUserIntroductionPage {
  @State numCount: number = 0
  @State textColor : string = '#222222'

  build() {
    Column(){
      CustomTitleUI({titleName:'修改简介'})

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

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


      Divider()
        .margin(12)

      Text('1、账号中（头像、昵称等）不允许含有违禁违规内容；\n2、出于商业或作为素材恶搞目的，而将国旗、国徽以及国家领导人用于头像、昵称；\n3、最多60个字，只能输入中文、数字、英文字母。')
        .fontSize(13)
        .padding(12)
        .fontColor(Color.Gray)

      Button('保存')
        .type(ButtonType.Normal)
        .width('90%')
        .backgroundColor('#ED2800')
        .borderRadius(5)
        .margin(30)
    }
  }
}