import { BasicType, yTRouter } from 'basic'
import { YTDiaLogComp } from 'basic/src/main/ets/components/generalComp/YTDiaLogComp'
import { DiaLogParam, YTDiaLogModel } from 'basic/src/main/ets/models/YTDiaLogModel'

@ComponentV2
struct YTNaviDiaLog {
  @Local param: DiaLogParam = {} as DiaLogParam
  @Local isPop: boolean = false
  @Local routerAns: string = ''

  _onBackPress = () => {
    yTRouter.pop(this.routerAns, false)
  }

  onBack(){
    this.isPop = !this.isPop
  }

  aboutToAppear(): void {
    this.param = yTRouter.getNaviDiaLogParam()
  }

  build() {
    YTDiaLogComp({ Align: YTDiaLogModel.Bottom, _onPop: this._onBackPress, isBack: this.isPop }){
      this.BottomMenu()
    }
  }

  // 底部菜单
  @Builder BottomMenu() {
    Column(){
      ForEach(this.param.params, (item: BasicType, index) => {
        Row(){
          Text(item.text)
            .fontSize(16)
            .textAlign(TextAlign.Center)
        }
        .width("100%")
        .alignItems(VerticalAlign.Center)
        .justifyContent(FlexAlign.Center)
        .padding({ top: 24, bottom: 24 })
        .onClick(() => {
          this.routerAns = item.message ?? item.text ?? `${index}`
          this.onBack()
        })

        Divider().width("80%").height(1).backgroundColor('#000000F2')
      })
    }
    .width("100%")
    .padding({ bottom: 30 })
    .backgroundColor(Color.White)
    .justifyContent(FlexAlign.Center)
    .alignItems(HorizontalAlign.Center)
    .borderRadius({ topLeft: 8, topRight: 8 })
  }
}

@Builder
function YTNaviDiaLogBuilder() {
  YTNaviDiaLog()
}