import { VideoRollModel,VideoRoll } from '../model/VideoRollModel'
import { BasicConstant,hdHttp, HdResponse ,logger} from '@itcast/basic/Index'
import { promptAction, router } from '@kit.ArkUI'
import { BusinessError } from '@kit.BasicServicesKit';
import { HdLoadingDialog } from '@itcast/basic'
import HashMap from '@ohos.util.HashMap';


@Component
export struct SwiperComp {
  @State
  list: VideoRoll[] = []




  hashMap: HashMap<string, string> = new HashMap();

  dialog: CustomDialogController = new CustomDialogController({
    builder: HdLoadingDialog({ message: '加载中...' }),
    customStyle: true,
    alignment: DialogAlignment.Center
  })

  aboutToAppear(): void {
    this.initData()
  }

  initData()
  {
    this.dialog.open()
    this.hashMap.clear();
    hdHttp.httpReq<string>(BasicConstant.videoRoll,this.hashMap).then(async (res: HdResponse<string>) => {
      logger.info('Response meetingListV2'+res);
      let json:VideoRollModel = JSON.parse(res+'') as VideoRollModel;
      this.dialog.close();
      this.list = json.data

    }).catch((err: BusinessError) => {
      this.dialog.close();
    })
  }

  build() {
    Column() {  // 使用堆叠布局实现按钮覆盖
      Swiper() {
        ForEach(this.list, (item: VideoRoll) => {
          Stack({alignContent:Alignment.Bottom}) {
            Image(BasicConstant.urlHtml + item.imgpath)
              .objectFit(ImageFit.Fill)// 图片填充模式
              .width('100%')
              .height(150)
            Text(item.name)
              .maxLines(1)
              .height(30)
              .fontColor('#F6F6F6')
              .textAlign(TextAlign.Start)
              .textOverflow({ overflow: TextOverflow.Ellipsis })
              .backgroundColor('#88000000')
              .width('100%')
              .padding({right:100,left:5})
              .margin({ bottom: 0 })
          }.onClick(()=>{

          })
        }, (item: VideoRoll) => JSON.stringify(item))

      }
      .indicator(
        Indicator.dot()
          .right(0)
          .itemWidth(4)
          .itemHeight(4)
          .selectedItemWidth(4)
          .selectedItemHeight(4)
          .color($r('app.color.common_gray_02'))
          .selectedColor('#3cc9c0')
      )
      .loop(true)
      .autoPlay(true)
      .interval(3000)
      .onChange((index: number) => {

      })


    }
    .width('100%')

  }
}