import router from '@ohos.router';
import { Params } from 'wdBean'
import { RecommendHeader } from './RecommendHeader';
import  { RecommendTitle } from './RecommendTitle';
import { RecommendLists } from './RecommendLists'
import { SelectedColumns } from './SelectedColumns'
import { CompList, PageInfoBean, CompInfoBean } from 'wdBean';
import { DateTimeUtils, Logger } from 'wdKit/Index';
import { PaperReaderSimpleDialog } from '../../dialog/PaperReaderDialog';
import { BroadcastViewModel } from '../../viewmodel/BroadcastViewModel';
import { DateFormatUtil, PlayerConstants, WDPlayerController } from 'wdPlayer';
import { AudioDataList } from 'wdBean/src/main/ets/bean/morningevening/AudioDataList';
import { CommonConstants } from 'wdConstant/Index';

const TAG = 'BroadcastPageComponent';

@Entry
@Component
export struct BroadcastPageComponent {
  @State params:Params = router.getParams() as Params;

  @State pageInfoBean: PageInfoBean = {} as PageInfoBean // 播报页面信息
  @State compInfoBean: CompInfoBean = {} as CompInfoBean // 组件信息
  @State recommendCompInfoBean: CompInfoBean = {} as CompInfoBean // 推荐播报组件信息
  @State columnsCompInfoBean: CompInfoBean = {} as CompInfoBean // 精选栏目组件信息

  @State compListItem: CompList = {} as CompList
  @State audioPlayUrl: string = ""
  @Provide title: string = ''
  @Provide subTitle: string = ''
  @Provide isAudioPlaying: boolean = false
  @Provide status: number = PlayerConstants.STATUS_START;
  @Provide currentTime: string = "00:00";
  @Provide totalTime: string = "00:00";
  @Provide progressVal: number = 0;
  private audioDataList: AudioDataList[] = []
  private playerController: WDPlayerController = new WDPlayerController();
  simpleAudioDialog: CustomDialogController = new CustomDialogController({
    builder: PaperReaderSimpleDialog({
      cancel: this.onCancel,
      confirm: this.onConfirm,
      playerController: this.playerController
    }),
    autoCancel: false,
    customStyle: true,
    alignment: DialogAlignment.CenterStart,
    offset: { dx: 12, dy: -150 },
  })

  onCancel() {
    Logger.info(TAG, "cj2024 onCancel = ")
  }

  /**
   *  回调无用
   **/
  onConfirm() {
    Logger.info(TAG, "cj2024 onConfirm = ")
  }

  // 续播判断
  changeContinue() {
    Logger.info(TAG, "cj2024 changeContinue = 1")
    this.playerController.continue = () => {
      Logger.info(TAG, "cj2024 changeContinue = 2")
      this.playerController?.stop();
    }
    return;
  }

  async aboutToAppear() {
    Logger.debug(TAG, `about1ToAppear`, router.getParams().toString())
    const currentTime = new Date().getTime()
    try {
      // 获取页面信息
      Logger.warn('获取页面信息')
      let pageInfoBean = await BroadcastViewModel.getBroadcastViewPageInfo('21003')
      Logger.warn('pageInfoBean-')
      Logger.warn(pageInfoBean.groups[0].blockDesc)

      this.pageInfoBean = pageInfoBean;
      //TODO 根据页面中组件信息。现在默认认为后端只返回2个。第一个是播报，第二个是精选栏目
      const pageId = pageInfoBean.id,
        groupId_0 = pageInfoBean.groups[0]?.id,
        refreshTime = currentTime + "",
        topicId =  pageInfoBean?.topicInfo?.topicId || '',
        channelId = pageInfoBean?.channelInfo?.channelId || ''
      if(pageInfoBean.groups[0]) {
        this.recommendCompInfoBean = await BroadcastViewModel.getBroadcastCompInfo(pageId, groupId_0, refreshTime, topicId, channelId)
      }
      if(pageInfoBean.groups[1]) {
        const groupId_1 = pageInfoBean.groups[1]?.id
        this.columnsCompInfoBean = await BroadcastViewModel.getBroadcastCompInfo(pageId, groupId_1, refreshTime, topicId, channelId)
      }
    } catch (exception) {

    }
  }
  onPageShow() {
    Logger.debug(TAG, `onPageShow--`, JSON.stringify(router.getParams()))
  }
  onPageHide() {
    this.status = PlayerConstants.STATUS_PAUSE;
      this.playerController?.pause();
  }

  build() {
    Column() {
      // 顶部标题
      RecommendHeader()
      List() {
        ListItem(){
          RecommendTitle()
        }
        if(this.pageInfoBean.groups && this.pageInfoBean.groups[0] && this.recommendCompInfoBean.compList) {
          ListItem(){
            RecommendLists({
              recommendCompInfoBean: this.recommendCompInfoBean
            })
          }
        }
        if(this.pageInfoBean.groups && this.pageInfoBean.groups[1] && this.columnsCompInfoBean.compList) {
          ListItem() {
            SelectedColumns({
              columnsCompTitle: this.pageInfoBean.groups[1].blockDesc,
              columnsCompInfoBean: this.columnsCompInfoBean
            })
              .margin({ top: 12 })
          }
        }
      }
      .layoutWeight(1)
      // .onScrollFrameBegin((offset, state) => {
      //   console.log('ccc',String(offset), state)
      // })
      .onReachStart(() => {
        console.log('onReachStart----->',)
      })
    }
    .width(CommonConstants.FULL_WIDTH)
    .backgroundImage($r('app.media.broadcast_bg'))
    .backgroundImageSize({width: '100%', height: '100%'})
  }
}