import { HeroPopWindow } from '../view/HeroPopWindow'
import { router } from '@kit.ArkUI'

@Preview
@Component
export struct HeaderView {
  @State heroIndex: number = 0  // 当前页索引
  private scrollerForList: Scroller = new Scroller()
  private heroList: string[] = ['2020年英雄榜','2021年英雄榜','2022年英雄榜','2023年英雄榜','2024年英雄榜']

  dialogController: CustomDialogController = new CustomDialogController({
    builder: HeroPopWindow(),
    alignment: DialogAlignment.Center,
    customStyle: true
  })

  handleAvatarClick() {
    router.pushUrl({url:'pages/MinePage/EditUserDataPage'})
  }

  build() {
    // Row() {
      Column({space:5}) {
        Row({space:10}) {
          Image($r('app.media.app_icon'))
            .margin({left:15})
            .width(60)
            .height(60)
            .borderRadius(30)
            .objectFit(ImageFit.Fill)
            .onClick(()=>this.handleAvatarClick())
          Column({space:5}) {
            Text('段钟平专家工作室')
              .fontSize(18)
              .fontColor('#333')
              .onClick(()=>this.handleAvatarClick())
            List({space:5,initialIndex:this.heroIndex,scroller:this.scrollerForList}) {
              ForEach(this.heroList, (item: string,index:number) => {
                ListItem() {
                  Row() {
                    Image($r('app.media.app_icon'))
                      .width(13)
                      .height(13)
                      .margin({left:7})
                    Text(item)
                      .fontColor(Color.White)
                      .fontSize(11)
                      .margin({left:4,right:10})
                  }
                  .height(18)
                  // .width('autp')
                  .margin({right:5})
                  .borderRadius(9)
                  .borderWidth(1)
                  .borderColor(Color.White)
                  .onClick(() => {
                    console.log('Show HeroPopWindow');
                  })
                  .onClick(()=>this.dialogController.open())
                }
              })
            }
            .listDirection(Axis.Horizontal)
            .scrollBar(BarState.Off)
            .width('100%')
            .height(18)
          }
          .alignItems(HorizontalAlign.Start)
          .height(60)
          .width('70%')
          .margin({top:22})
        }
        .width('100%')
        .height(97)
      }
      .width('100%')
      .height(97)
      .backgroundColor(Color.Green)
    }
  // }
}
