import { ContentDetailDTO, LiveDetailsBean, LiveRoomItemBean } from 'wdBean/Index'
import { EmptyComponent, ErrorComponent, ListHasNoMoreDataUI, WDViewDefaultType } from 'wdComponent/Index'
import { TabLiveItemComponent } from './TabLiveItemComponent'
import CustomRefreshLoadLayout from 'wdComponent/src/main/ets/components/page/CustomRefreshLoadLayout'
import { RefreshLayoutBean } from 'wdComponent/src/main/ets/components/page/RefreshLayoutBean'
import PageModel from 'wdComponent/src/main/ets/viewmodel/PageModel'
import { ViewType } from 'wdConstant/Index'
import RefreshLayout from 'wdComponent/src/main/ets/components/page/RefreshLayout'
import { StringUtils } from 'wdKit/Index'
import { LiveViewModel } from '../../viewModel/LiveViewModel'
import { Logger } from 'wdKit'

const TAG: string = 'TabLiveComponent';

/**
 *  非沉浸式直播间组件
 */
@Component
export struct TabLiveComponent {
  liveViewModel: LiveViewModel = new LiveViewModel()
  @State liveList: Array<LiveRoomItemBean> = []
  @Consume @Watch('updateData') contentDetailData: ContentDetailDTO
  @State private pageModel: PageModel = new PageModel()

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

  build() {
    Stack() {
      if (this.pageModel.viewType == ViewType.LOADING) {
        this.LoadingLayout()
      } else if (this.pageModel.viewType == ViewType.ERROR) {
        ErrorComponent()
      } else if (this.pageModel.viewType == ViewType.EMPTY) {
        EmptyComponent({ emptyType: WDViewDefaultType.WDViewDefaultType_NoContent1 })
      } else {
        this.ListLayout()
      }
    }
    .alignContent(Alignment.Top)
    .backgroundColor('#F5F5F5')
    .height('100%')
    .width('100%')
  }

  @Builder
  ListLayout() {
    List() {
      ListItem() {
        // 下拉刷新 TODO 待对接新的下拉刷新组件
        // RefreshLayout({
        //   refreshBean: new RefreshLayoutBean(this.pageModel.isVisiblePullDown, this.pageModel.pullDownRefreshImage,
        //     this.pageModel.pullDownRefreshText, this.pageModel.pullDownRefreshHeight)
        // })
      }

      ForEach(this.liveList, (item: LiveRoomItemBean) => {
        ListItem() {
          TabLiveItemComponent({ item: item })
        }
      })
      // 加载更多
      ListItem() {
        if (this.pageModel.hasMore) {
          // LoadMoreLayout({
          //   refreshBean: new RefreshLayoutBean(this.pageModel.isVisiblePullUpLoad, this.pageModel.pullUpLoadImage,
          //     this.pageModel.pullUpLoadText, this.pageModel.pullUpLoadHeight)
          // })
        } else {
          ListHasNoMoreDataUI()
        }
      }
    }
  }

  @Builder
  LoadingLayout() {
    CustomRefreshLoadLayout({
      refreshBean: new RefreshLayoutBean(true,
        $r('app.media.ic_pull_up_load'), $r('app.string.pull_up_load_text'), this.pageModel.pullDownRefreshHeight)
    })
  }

  getLiveList() {
    if (!this.contentDetailData || !this.contentDetailData.newsId) {
      // 参数不够，直接拦截接口
      return
    }
    this.pageModel.currentPage = 1
    this.liveViewModel.getLiveList(
      this.pageModel.currentPage,
      this.contentDetailData?.liveInfo?.mlive?.mliveId,
      this.contentDetailData?.newsId+'',
      20)
      .then(
        (data) => {
          Logger.debug(TAG, '直播间数据：' + `${JSON.stringify(data)}`)
          if (data.barrageResponses && data.barrageResponses.length > 0) {
            /**
             * 在直播聊天添加一条新内容逻辑：
             判断 oldNewsId：迁移id为空 且 直播状态不是预约："wait"
             消息内容：
             1.头像固定：APP默认头像
             2.名称固定：人民日报主持人
             3.内容：详情接口的简介，newIntroduction
             */
            this.pageModel.viewType = ViewType.LOADED;
            this.liveList.push(...data.barrageResponses)
            if (data.barrageResponses.length === this.pageModel.pageSize) {
              this.pageModel.currentPage++;
              this.pageModel.hasMore = true;
            } else {
              this.pageModel.hasMore = false;
              if (StringUtils.isEmpty(this.contentDetailData.oldNewsId)
                && this.contentDetailData
                && this.contentDetailData.liveInfo.liveState != 'wait') {
                this.updateLiveListData()
              }
            }
          } else {
            if (StringUtils.isEmpty(this.contentDetailData.oldNewsId)
              && this.contentDetailData
              && this.contentDetailData.liveInfo.liveState != 'wait') {
              this.pageModel.viewType = ViewType.LOADED;
              this.updateLiveListData()
            } else {
              this.pageModel.viewType = ViewType.EMPTY;
            }
          }
        },
        () => {
          Logger.debug(TAG, `Error`)
          this.pageModel.viewType = ViewType.ERROR;

        })
  }

  updateLiveListData() {
    let liveRoomItemBeanTemp: LiveRoomItemBean = {} as LiveRoomItemBean
    liveRoomItemBeanTemp.text = this.contentDetailData.newIntroduction
    liveRoomItemBeanTemp.senderUserName = '人民日报主持人'
    liveRoomItemBeanTemp.pictureUrls = []
    liveRoomItemBeanTemp.pictureUrls.push(this.contentDetailData?.fullColumnImgUrls[0]?.url)
    liveRoomItemBeanTemp.dataType = 'ZH_TEXT_AND_IMAGE_MSG'
    let temp = this.contentDetailData?.fullColumnImgUrls[0]
    if (temp) {
      liveRoomItemBeanTemp.pictureResolutions = []
      liveRoomItemBeanTemp.pictureResolutions.push(`${temp.height}*${temp.weight}`)
    }
    this.liveList.push(liveRoomItemBeanTemp)
  }

  aboutToDisappear(): void {
  }

  updateData() {
    if (this.liveList.length > 0) {
      // TODO 拦截刷新？根据业务斟酌下
      return
    }
    this.getLiveList()
  }
}