/*
 * 手动输入设备序列号/验证码 页面
 * EZOpenSDK
 *
 * Created by boa on 2024/3/15.
 * Copyright (c) 2024年 Ezviz. All rights reserved.
 */
import GlobalKit from '../../global/GlobalKit'
import RouterManager from '../../global/RouterManager/RouterManager'

import { NavigationView } from '../../global/view/NavigationView'

@Entry
@Component
struct EZInputSerialPage {
  @State deviceSerial: string = ''
  @State verifyCode: string = ''

  // ------------------------ 生命周期 ------------------------

  aboutToAppear() {
    if (GlobalKit.isJCTest) {
      this.deviceSerial = 'C4219413'
      this.verifyCode = 'GIAIFP'
    }
  }

  // ------------------------ UI ------------------------

  build() {
    Column() {
      NavigationView({
        title: $r('app.string.ad_input_manual')
      })

      TextInput({ text: this.deviceSerial, placeholder: $r('app.string.ad_input_manual_serial') })
        .onChange((value: string) => {
          this.deviceSerial = value
        })
        .maxLength(9)
        .backgroundColor(Color.White)
        .borderRadius(0)
        .fontSize(14)
        .placeholderFont({ size: 14 })
        .padding({ left: 10 })
        .height(40)
        .margin({ top: 24 })
      TextInput({ text: this.verifyCode, placeholder: $r('app.string.ad_input_manual_verify') })
        .onChange((value: string) => {
          this.verifyCode = value
        })
        .maxLength(6)
        .backgroundColor(Color.White)
        .borderRadius(0)
        .fontSize(14)
        .placeholderFont({ size: 14 })
        .padding({ left: 10 })
        .height(40)
        .margin({ top: 24 })
      Button($r('app.string.ad_input_manual_next'))
        .backgroundColor($r('app.color.ez_text_blue'))
        .width('80%')
        .margin({ top: 32 })
        .onClick(() => {
          GlobalKit.getInstance().deviceSerialNo = this.deviceSerial
          GlobalKit.getInstance().deviceVerifyCode = this.verifyCode
          GlobalKit.getInstance().deviceModel = ''
          RouterManager.pushUrl(RouterManager.deviceResultPage)
        })
        .enabled(this.deviceSerial.length == 9 && this.verifyCode.length >= 6)
      Blank()
      Text('接触式配网')
        .fontSize(14)
        .fontColor(Color.Gray)
        .height(40)
        .margin({ bottom: 32 })
        .onClick(() => {
          RouterManager.pushUrl(RouterManager.touchAPPage)
        })
        .visibility(Visibility.Hidden)
    }.backgroundColor($r('app.color.message_cell_select_color'))
    .width('100%').height('100%')
  }
}