import { ContentDTO, joinPeopleNum } from 'wdBean/Index'
import { DateTimeUtils, Logger } from 'wdKit/Index'
import { LottieView } from '../../components/lottie/LottieView';
import { LiveModel } from '../../viewmodel/LiveModel'
import font from '@ohos.font';
import text from '@ohos.graphics.text';

const TAG = "CardMediaInfo"
/**
 * 这里是样式卡中，右下角显示的音视频信息
 * 目前已知：
 * 音频： 音频图标+时长
 * 视频：点播图标+时长；直播图标+'直播中'
 */
@Component
@Reusable
export struct CardMediaInfo {

  @State livePeopleNum :boolean  = true
  //@ObjectLink compDTO: CompDTO
  @State beused: string = ''; // 2024-05-28 给CardMediaInfo组件添加beused的字段让其知道被哪个组件使用,不传默认为空
  @State contentDTO: ContentDTO = new ContentDTO() // 如果有duraion，代表点播，显示时长；如果不传或者传0，显示直播中
  @State joinPeopleNum: number = 0;
  // objectType 0:不跳转 1:点播,2:直播,3:活动,4:广告,5:专题,6:链接,7:榜单,8:图文,9:组图,10:H5新闻,11:频道,12:组件,13:音频,
  // 14动态图文,15动态视频16问政；100人民号,101标签

  aboutToAppear(): void {
    if(this.livePeopleNum){
      this.getJoinPeopleNum();
    }

    font.registerFont({
      familyName: 'BebasNeue',
      familySrc: $rawfile('font/BebasNeue.ttf')
    })
  }

  aboutToReuse(params: Record<string, object>): void {
    this.contentDTO = params.contentDTO as ContentDTO
  }

  aboutToRecycle(): void {
  }

  aboutToDisappear(): void {
  }

  /**
   * 全域数字显示规则
   * 1、当数量为千位以內时，显示数字，不保留小数点，比如 4585
   * 2、当数量为万位~1亿时，显示xx 万，保留小数点后一位，比如1517.9w、2.9w
   * 3、当数量为1亿~千亿时，显示XX 亿，保留小数点后一位，比如1517.9亿、2.9亿
   * 4、不进行四舍五入
   * 5、0 和空 不显示
   */
  handlerNum(number: string) {
    const num = number??'0';
    if (Number.parseInt(num) <= 9999) {
      return Number.parseInt(num).toString()
    } else if (Number.parseInt(num) > 9999 && Number.parseInt(num) <= 99999999) {
      let num1: string = num.slice(0, -4); // 万
      let num2: string = num.slice(-4, -3); // 千
      const num3: string = num.slice(-3, -2); // 百
      if (Math.round(Number(`0.${num3}`)) === 1) num2 = `${Number(num2) + 1}`
      if (Number(num2) === 10) {
        num2 = '0';
        num1 = `${Number(num1) + 1}`
      }
      return num2 === '0' ? num1 +'万' : num1 + '.' + num2 + '万'
    } else if (Number.parseInt(num) > 99999999) {
      let num1: string = num.slice(0, -8); // 亿
      let num2: string = num.slice(-8, -7);
      const num3: string = num.slice(-3, -2); // 百
      if (Math.round(Number(`0.${num3}`)) === 1) num2 = `${Number(num2) + 1}`
      if (Number(num2) === 10) {
        num2 = '0';
        num1 = `${Number(num1) + 1}`
      }
      return num2 === '0' ? num1 +'亿' : num1 + '.' + num2 + '亿'
    }
    return num
  }

  //
  /**
   * 获取直播节目参与人数
   */
  async getJoinPeopleNum() {
    if (this.contentDTO.objectType !== '2') return;
    Logger.debugOptimize(TAG, () => {
      return 'getJoinPeopleNum-ContentDTO' + JSON.stringify(this.contentDTO.objectId)
    })
    LiveModel.getJoinPeopleNum(this.contentDTO.objectId).then((data) => {
      this.joinPeopleNum = data[0].pv;
      Logger.debug(TAG, 'getJoinPeopleNum ' + this.joinPeopleNum)
    })
  }

  build() {
    Row() {
      // Text(`${this.contentDTO?.objectType}`)
      if (this.contentDTO?.objectType === '1' || this.contentDTO?.objectType === '15') {
        // 点播、动态视频
        Row() {
          Image($r('app.media.card_play'))
            .mediaLogo()
          if (this.contentDTO.videoInfo != null) {
            Text(DateTimeUtils.getFormattedDuration(this.contentDTO.videoInfo.videoDuration * 1000))
              .mediaText()
              .fontFamily('BebasNeue')

          }
        }
        .margin({ right: 5})
      } else if (this.contentDTO.objectType === '2') {
        // liveInfo.liveState 直播新闻-直播状态 wait待开播running直播中end已结束cancel已取消paused暂停
        // 显示直播信息
        Row() {
          // 搜索接口没有返回liveInfo字段所以得做个区分
          if (this.contentDTO && this.contentDTO.liveInfo && JSON.stringify(this.contentDTO.liveInfo) === '{}') {
              //  当liveInfo不存在的时候
              if (this.contentDTO?.liveType === 'wait') {
                Image($r('app.media.card_wait'))
                  .mediaLogo()
                Text('预约')
                  .mediaText()
              } else if (this.contentDTO?.liveType === 'running') {
                LottieView({
                  name: 'live_status_wait-' + Math.random().toString().slice(2, 12),
                  path: "lottie/live_detail_living.json",
                  lottieWidth: 14,
                  lottieHeight: 14,
                  autoplay: true,
                  loop: true,
                })
                  .margin({
                    right: '2vp'
                  })
                Text('直播中')
                  .mediaText()
              } else if (this.contentDTO?.liveType === 'end' && this.contentDTO?.linkUrl) {
                Image($r('app.media.card_play'))
                  .mediaLogo()
                Text('回看')
                  .mediaText()
              }else if(this.contentDTO?.liveType === 'end' && !this.contentDTO?.linkUrl){
                Text('已结束')
                  .mediaText()
              }else if(!this.contentDTO?.liveType  && this.contentDTO?.linkUrl){
                // 加个防护，生产有出现这样的特例
                Image($r('app.media.card_play'))
                  .mediaLogo()
                Text('回看')
                  .mediaText()
              }

          } else {
            // 当liveInfo存在时后

              if (this.contentDTO?.liveInfo?.liveState === 'wait') {
                Image($r('app.media.card_wait'))
                  .mediaLogo()
                Text('预约')
                  .mediaText()
              } else if (this.contentDTO?.liveInfo?.liveState === 'running') {
                Row(){
                  LottieView({
                    name: 'live_status_wait-' + Math.random().toString().slice(2, 12),
                    path: "lottie/live_detail_living.json",
                    lottieWidth: 14,
                    lottieHeight: 14,
                    autoplay: true,
                    loop: true,
                  }).margin({
                    right: '2vp'
                  })
                  Text('直播中')
                    .mediaText()

                }

              } else if (this.contentDTO?.liveInfo?.liveState === 'end' && this.contentDTO?.liveInfo?.replayUri) {
                Image($r('app.media.card_play'))
                  .mediaLogo()
                Text('回看')
                  .mediaText()
              }else if(this.contentDTO?.liveInfo?.liveState === 'end' && !this.contentDTO?.liveInfo
              ?.replayUri){
                Text('已结束')
                  .mediaText()
              }
          }
          // 备注直播间观看人数在轮播图卡不显示
          if(this.beused !== 'Zh_Carousel_Layout_01'){
              if (!!this.joinPeopleNum) {
                Text(' | ')
                  .mediaText()
                Text(`${this.handlerNum(this.joinPeopleNum.toString())}人参加`)
                  .mediaText()
              }
            }
        }
      } else if (this.contentDTO.objectType === '9') {
        // 显示组图；图片数量
        Row() {
          Image($r('app.media.card_image'))
            .mediaLogo()
          Text(`${this.contentDTO.photoNum}`)
            .mediaTextImgtype()
            .fontFamily('BebasNeue')
        }
        .margin({ right: 5 })

      } else if (this.contentDTO.objectType === '13') {
        // 显示音频信息
        Row() {
          Image($r('app.media.card_audio'))
            .mediaLogo()
          Text(DateTimeUtils.getFormattedDuration(this.contentDTO.voiceInfo.voiceDuration * 1000))
            .mediaText()
            .fontFamily('BebasNeue')
        }
      } else if (this.contentDTO.objectType === '4') {//广告标签
        Text($r('app.string.comp_advertisement'))
          .fontSize('10fp')
          .fontColor($r('app.color.white'))
          .width(28)
          .height(16)
          .backgroundColor('#80000000')
          .borderRadius(3)
          .textAlign(TextAlign.Center)
      }
    }
    .margin(6)
  }

  @Styles
  mediaLogo() {
    .width(14)
    .height(14)
    .margin({ right: 3 })
  }
  @Styles
  mediaLogo2() {
    .width(14)
    .height(14)
    .margin({ top:5,right:5  })
  }

}



@Extend(Text)
function mediaText() {
  .fontColor($r('app.color.color_fff'))
  .fontSize($r('app.float.font_size_13'))
  .lineHeight(18)
  .textShadow({
    radius: 2,
    color: 'rgba(0,0,0,0.3)',
    offsetY: 2
  })
}
@Extend(Text)
function mediaTextImgtype() {
    .fontColor($r('app.color.color_fff'))
    .fontSize($r('app.float.font_size_13'))
    .lineHeight(18)
    .textShadow({
      radius: 2,
      color: 'rgba(0,0,0,0.3)',
      offsetY: 2
    })
}