import { LiveDetailsBean, LiveRoomDataBean, postBatchAttentionStatusParams, } from 'wdBean/Index'
import { MultiPictureDetailViewModel } from 'wdComponent/src/main/ets/viewmodel/MultiPictureDetailViewModel'
import { SpConstants } from 'wdConstant/Index'
import { ContentDetailRequest, postInteractAccentionOperateParams } from 'wdDetailPlayApi/Index'
import { NumberFormatterUtils, DateTimeUtils, SPHelper } from 'wdKit/Index'
import { WDRouterPage, WDRouterRule } from 'wdRouter/Index'

const TAG = 'PlayerEndView'

@Preview
@Component
export struct PlayerEndView {
  @Consume liveDetailsBean: LiveDetailsBean
  @Consume liveRoomDataBean: LiveRoomDataBean
  @State duration: string = ''
  @State followStatus: String = '0';

  aboutToAppear(): void {
    const sn = DateTimeUtils.parseDate(this.liveDetailsBean.liveInfo.startTime, DateTimeUtils.PATTERN_DATE_TIME_HYPHEN)
    const en = DateTimeUtils.parseDate(this.liveDetailsBean.liveInfo.endTime, DateTimeUtils.PATTERN_DATE_TIME_HYPHEN)
    const sd = DateTimeUtils.getDuration(sn, en)
    this.duration = DateTimeUtils.secondToTime(sd / 1000)
    this.getBatchAttentionStatus()
  }

  /**
   * 查询当前登录用户是否关注作品号主
   * */
  async getBatchAttentionStatus() {
    try {
      const params: postBatchAttentionStatusParams = {
        creatorIds: [{ creatorId: this.liveDetailsBean?.rmhInfo?.rmhId ?? '' }]
      }
      let data = await MultiPictureDetailViewModel.getBatchAttentionStatus(params)
      this.followStatus = data[0]?.status;
      console.log(TAG, `followStatus：${JSON.stringify(this.followStatus)}`)
    } catch (exception) {

    }
  }

  /**
   * 关注号主
   */
  async handleAccention() {
    // 未登录，跳转登录
    const user_id = await SPHelper.default.get(SpConstants.USER_ID, '')
    if (!user_id) {
      WDRouterRule.jumpWithPage(WDRouterPage.loginPage)
      return
    }
    // TODO:直播间没有携带人民号信息
    const params2: postInteractAccentionOperateParams = {
      attentionUserType: this.liveDetailsBean?.rmhInfo?.userType || '', //被关注用户类型（1 普通用户 2 视频号 3 矩阵号）
      attentionUserId: this.liveDetailsBean?.rmhInfo?.userId || '', // 被关注用户号主id
      attentionCreatorId: this.liveDetailsBean?.rmhInfo?.rmhId || '', // 被关注用户号主id
      status: this.followStatus == '0' ? 1 : 0,
    }


    ContentDetailRequest.postInteractAccentionOperate(params2).then(res => {
      console.log('关注号主==', JSON.stringify(res.data))
      if (this.followStatus == '1') {
        this.followStatus = '0'
      } else {
        this.followStatus = '1'
      }
    }).catch(() => {
      AlertDialog.show({ message: '关注失败' })
    })
  }

  build() {
    Column() {
      Text('直播已结束').fontWeight(500)
        .fontSize(20)
        .fontColor(Color.White)
        .padding({ bottom: 40, top: 120 })

      Stack() {
        Column() {
          Text(this.liveDetailsBean?.rmhInfo?.rmhName)
            .fontWeight(400)
            .fontSize(18)
            .fontColor(Color.White)
            .padding({ top: 52 })
          Text(this.liveDetailsBean?.rmhInfo?.rmhDesc || '')
            .fontWeight(400)
            .fontSize(13)
            .fontColor('#B2FFFFFF')
            .padding({ top: 8 })

          Row() {
            Column() {
              Text(this.duration).fontWeight(600).fontSize(24).fontColor(Color.White)
              Text('时长').fontWeight(400).fontSize(13).fontColor(Color.White)
            }

            Text('').width(1).height(32).margin({ left: 36, right: 36 }).backgroundColor('#33FFFFFF')
            Column() {
              Text(NumberFormatterUtils.formatNumberWithWan(this.liveRoomDataBean?.pv || ''))
                .fontWeight(600)
                .fontSize(24)
                .fontColor(Color.White)
              Text('观看人数').fontWeight(400).fontSize(13).fontColor(Color.White)
            }
          }
          .padding({ top: 16 })

          Row() {
            Text(this.followStatus == '0' ? '关注' : '已关注')
              .fontWeight(400)
              .fontSize(16)
              .fontColor(Color.White)
              .padding({ top: 8, bottom: 8, left: 122, right: 122 })
              .backgroundColor(this.followStatus == '0' ? '#FFED2800' : Color.Grey)
              .borderRadius(4)
              .onClick(() => {
                this.handleAccention()
              })
          }
          .padding({ top: 24 })

        }
        .width(307)
        .height(254)
        .backgroundColor('#999999')
        .borderRadius(4)

        Image(this.liveDetailsBean?.fullColumnImgUrls[0]?.url)
          .width(80)
          .height(80)
          .borderRadius(40)
          .borderWidth(1)
          .borderColor(Color.White)
          .borderStyle(BorderStyle.Solid)
          .position({ x: '50%', y: 0 })
          .markAnchor({ x: '50%', y: '50%' })
      }
      .width(307)
      .padding({ top: 40 })
    }
    .height('100%')

  }
}