import promptAction from '@ohos.promptAction';
import { router } from '@kit.ArkUI'

@Preview
@Component
export struct ChangePasswordComp {
  @State oldPassword: string = ''
  @State newPassword: string = ''
  @State confirmPassword: string = ''

  build() {
    Column() {
      // 原密码输入框
      TextInput({ placeholder: '请输入原密码' })
        .width('95%')
        .height(40)
        .margin({ top: 10 })
        .borderWidth(1)
        .borderRadius(8)
        .borderColor('#cccccc')
        .type(InputType.Password)
        .onChange((value: string) => {
          this.oldPassword = value
        })

      // 新密码输入框
      TextInput({ placeholder: '新密码（6~16位数字字母组合）' })
        .width('95%')
        .height(40)
        .margin({ top: 10 })
        .borderWidth(1)
        .borderRadius(8)
        .borderColor('#cccccc')
        .type(InputType.Password)
        .onChange((value: string) => {
          this.newPassword = value
        })

      // 确认新密码输入框
      TextInput({ placeholder: '确认新密码' })
        .width('95%')
        .height(40)
        .margin({ top: 10 })
        .borderWidth(1)
        .borderRadius(8)
        .borderColor('#cccccc')
        .type(InputType.Password)
        .onChange((value: string) => {
          this.confirmPassword = value
        })

      // 忘记密码链接
      Text('忘记密码？')
        .fontSize(14)
        .fontColor('#666666')
        .margin({ top: 12 })
        .onClick(() => {
          // 处理忘记密码逻辑
          router.pushUrl({url:'pages/MinePage/ForgetPassword'})
        })

      // 确定按钮
      Button({ type: ButtonType.Normal }){
        Text('确 定')
      }
      .width('90%')
      .height(40)
      .position({x:'5%',y:'80%'})
      .backgroundColor('#ffffff')
      .borderColor($r('app.color.main_color'))
      .borderRadius(8)
      .borderWidth(1)
      .fontColor($r('app.color.main_color'))
      .onClick(() => {
        // 处理密码修改提交逻辑
        this.handleSubmit()
      })
    }
    .width('100%')
    .height('100%')
    .backgroundColor(Color.White)
  }

  // 提交处理函数
  private handleSubmit() {
    // 这里添加密码验证和提交逻辑
    // 验证规则示例：
    if (this.newPassword !== this.confirmPassword) {
      promptAction.showToast({message:'两次输入的新密码不一致'})
      return
    }

    const passwordRegex = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{6,16}$/
    if (!passwordRegex.test(this.newPassword)) {
      promptAction.showToast({message:'密码必须为6-16位数字字母组合'})
      return
    }

    // 调用修改密码接口...
  }
}
