import { Action, ContentDetailDTO, InteractDataDTO } from 'wdBean/Index';
import { ContentDetailRequest } from 'wdDetailPlayApi/Index'
import { ResponseDTO } from 'wdNetwork/Index';
import { DetailPlayShortVideoPage } from './DetailPlayShortVideoPage'
// import { Test } from './Test'
import router from '@ohos.router';
import window from '@ohos.window';
import {
  batchContentDetailParams,
  compListItem,
  contentListParams,
  contentsItem,
  getRecCompInfoParams
} from 'wdDetailPlayApi/src/main/ets/request/ContentDetailRequest';
import { Logger, WindowModel } from 'wdKit/Index';
import { BusinessError } from '@kit.BasicServicesKit';
import { PictureLoading } from './PictureLoading';

interface loadMoreData {
  pageNum: number;
  refreshTime: number;
  loadStrategy: string;
}

const TAG = 'VideoChannelDetail'
let timer: number = -1

@Entry
@Component
export struct VideoChannelDetail {
  private groupId: string = '' // 楼层id
  private pageId: string = '' //页面id
  private pageNum: number = 1
  private pageSize: number = 10
  private loadStrategy: string = 'first_load' // 首次加载： first_load, 上推刷新：  push_up, 下拉刷新： pull_down
  private refreshTime: number = new Date().getTime() // 第一页刷新时间，用于频道分页排序时过滤，查询时携带【首刷、下拉取当前最新时间；其他的都使用首刷的时间】
  private channelId: string = '' // 频道id
  private channelStrategy: string = '1' // 频道策略 1-推荐;2-时间线
  // private topicId?: string = '' // 专题id
  // private recommend?: string = '' // 0.非推荐，1.推荐；
  @Link @Watch('navIndexChange') bottomNavIndex: number
  @Link @Watch('navIndexChange') topNavIndex: number
  @Link barBackgroundColor: Color
  private swiperController: SwiperController = new SwiperController()
  @Provide showComment: boolean = false
  @State data: ContentDetailDTO[] = []
  @State currentIndex: number = 0
  @State interactDataList: InteractDataDTO[] = []
  @State totalCount: number = 0
  @State switchVideoStatus: boolean = false
  @State isMouted: boolean = false

  /**
   * 监听视频频道激活或失活
   */
  navIndexChange() {
    // if (timer) clearTimeout(timer)
    console.log('navIndexChange', this.bottomNavIndex, this.topNavIndex)
    // timer = setTimeout(() => {

    if (this.bottomNavIndex === 2 && this.topNavIndex === 0) {
      // 如果视频在暂停则播放视频
      this.switchVideoStatus = true
      this.barBackgroundColor = Color.Black
      this.openFullScreen()
    } else {
      // 如果视频在播放则暂停视频
      this.switchVideoStatus = false
      this.barBackgroundColor = Color.Transparent
      this.closeFullScreen()
    }
    //   timer = -1
    // }, 100)


  }

  aboutToAppear() {
    this.openFullScreen()
    // 根据视频频道传参查询视频楼层信息
    this.getRecCompInfo()
    Logger.info(TAG, 'aboutToAppear');
  }

  aboutToDisappear(): void {
    this.closeFullScreen()
    Logger.info(TAG, 'aboutToDisappear');
  }

  onPageShow(): void {
    this.openFullScreen()
    Logger.info(TAG, 'onPageShow');
  }

  onPageHide(): void {
    this.closeFullScreen()
    Logger.info(TAG, 'onPageHide');
  }

  /**
   * 开启沉浸式
   * TODO:颜色待根据业务接口修改
   */
  openFullScreen() {
    WindowModel.shared.setWindowSystemBarProperties({
      statusBarContentColor: '#ffffff',
      statusBarColor: '#000000',
      // navigationBarColor: '#000000',
      // navigationBarContentColor: '#ffffff'
    })
    // WindowModel.shared.setWindowLayoutFullScreen(true)
    // WindowModel.shared.setWindowSystemBarEnable([])
  }

  /**
   * 关闭沉浸式
   * TODO:颜色待根据业务接口修改
   */
  closeFullScreen() {
    WindowModel.shared.setWindowSystemBarProperties({
      statusBarContentColor: '#000000',
      statusBarColor: '#ffffff',
      // navigationBarColor: '#0x66000000',
      // navigationBarContentColor: '#0xE5FFFFFF'

    })
    // WindowModel.shared.setWindowLayoutFullScreen(false)
    // WindowModel.shared.setWindowSystemBarEnable(['status', 'navigation'])
  }

  /**
   * 根据视频频道传参查询视频楼层信息
   */
  async getRecCompInfo() {
    if (this.data.length > 0 && this.data.length === this.totalCount) {
      AlertDialog.show({ message: '没有更多视频了~' })
      return
    }

    const params: getRecCompInfoParams = {
      groupId: this.groupId,
      pageId: this.pageId,
      channelId: this.channelId,
      loadStrategy: this.loadStrategy,
      channelStrategy: this.channelStrategy,
      pageNum: this.pageNum,
      pageSize: this.pageSize,
      refreshTime: this.refreshTime,
    }

    await ContentDetailRequest.getRecCompInfo(params).then(res => {
      console.log('根据视频频道传参查询视频楼层信息totalCount', res.data?.totalCount + '')

      this.totalCount = res.data?.totalCount || 0
      const list1: batchContentDetailParams = {
        contents: []
      }
      const list2: contentListParams = {
        contentList: []
      }

      if (res.data?.compList.length) {
        res.data?.compList.map((item: compListItem) => {
          list1.contents.push({
            contentId: item.operDataList[0].objectId,
            contentRelId: item.operDataList[0].relId,
            contentType: Number(item.operDataList[0].objectType),
            relId: item.operDataList[0].relId,
            relType: item.operDataList[0].relType,
          })

          list2.contentList.push({
            contentId: item.operDataList[0].objectId,
            contentType: Number(item.operDataList[0].objectType),
          })
        })
      }

      this.batchContentDetail(list1)
      this.getContentInteract(list2)
      setTimeout(() => {
        this.isMouted = true
      }, 500)

    })
  }

  /**
   * 根据视频楼层信息批量查询视频列表
   */
  async batchContentDetail(list: batchContentDetailParams) {
    if (list.contents.length > 0) {
      await ContentDetailRequest.batchContentDetail(list).then(res => {
        console.log('根据视频楼层信息批量查询视频列表', res.data)
        this.data = this.data.concat(res.data as [])
      })
    }
  }

  /**
   * 根据视频信息批量查询点赞、收藏状态
   */
  async getContentInteract(list: contentListParams) {
    if (list.contentList.length > 0) {
      await ContentDetailRequest.getContentInteract(list).then(res => {
        this.interactDataList = res.data || []
        console.log('根据视频信息批量查询点赞、收藏状态', res.data)
      })
    }
  }

  build() {
    Column() {
      PictureLoading().visibility(this.isMouted ? Visibility.None : Visibility.Visible)
      Swiper(this.swiperController) {
        ForEach(this.data, (item: ContentDetailDTO, index: number) => {
          Column() {
            DetailPlayShortVideoPage({
              contentDetailData: item,
              currentIndex: this.currentIndex,
              index: index,
              interactData: this.interactDataList[index]
            })
          }.width('100%')
          .height('100%')
        }, (item: ContentDetailDTO) => item.newsId + '')
      }
      .visibility(this.isMouted ? Visibility.Visible : Visibility.None)
      .cachedCount(-1)
      .indicator(false)
      .vertical(true)
      .loop(false)
      .width('100%')
      .height('100%')
      // 扩展至所有非安全区域
      .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
      .onChange((index: number) => {
        this.currentIndex = index
        console.info('onChange==', index.toString())

        if (this.currentIndex === this.data.length - 1) {
          this.pageNum++
          this.refreshTime = new Date().getTime()
          this.loadStrategy = 'push_up'
          this.getRecCompInfo()
        }
      })

    }
    .width('100%')
    .height('100%')
    .backgroundColor('#000000')
  }
}