import { RouterUrls } from '../common/RouterUrls';
import { MediaRecordEntity } from '../entity/MediaRecordEntity';
import { router } from '@kit.ArkUI';
import { AppUtil, DateUtil, StrUtil } from '@pura/harmony-utils';
import { ShareManager } from '../manager/ShareManager';
import { Want } from '@kit.AbilityKit';
import { SimpleTipDialog } from '../dialog/SimpleTipDialog';
import { PrefUtils } from '../utils/PrefUtils';
import { WantUtils } from '../utils/WantUtils';

@ComponentV2
export struct VideoRecordItemView {
  @Param onShare?: (entity: MediaRecordEntity) => void = undefined
  @Param onDelete?: (entity: MediaRecordEntity) => void = undefined
  @Param media?: MediaRecordEntity = undefined;
  @Param rowCount: number = 1;

  build() {
    RelativeContainer() {
      Image(this.media?.thumb)
        .width('100%')
        .height('100%')
        .borderRadius(6)
        .backgroundColor($r('app.color.color_222222'))
        .id('iv_thumb')

      Image($r('app.media.ic_play_video')).width(50).height(50)
        .alignRules({
          left: { anchor: 'iv_thumb', align: HorizontalAlign.Start },
          top: { anchor: 'iv_thumb', align: VerticalAlign.Top },
          right: { anchor: 'iv_thumb', align: HorizontalAlign.End },
          bottom: { anchor: 'iv_thumb', align: VerticalAlign.Bottom },
        })
        .onClick(() => {
          this.getUIContext()
            .getRouter()
            .pushUrl({
              url: RouterUrls.VIDEO_PLAYER_PAGE,
              params: { title: '', uri: this.media?.uri, showActions: true }
            }, router.RouterMode.Single)
        })

      Row() {
        Stack() {
          Image($r('app.media.ic_share_material')).height(18).width(18)
        }.layoutWeight(1).height(34)
        .onClick(() => {
          if (StrUtil.isNotEmpty(this.media?.uri)) {
            ShareManager.shareFile(this.media?.uri!!)
          }
        })

        Stack() {
          Image($r('app.media.ic_delete_material')).height(18).width(18)
        }.layoutWeight(1).height(34)
        .onClick(() => {
          if (PrefUtils.getBoolean('show_record_delete_tip', true)) {
            SimpleTipDialog.show(this.getUIContext(), {
              title: '提示', content: '因系统限制，请到相册中手动删除', buttonText: '知道了', callback: {
                confirm: () => {
                  WantUtils.toPhotoGallery()
                  PrefUtils.put('show_record_delete_tip', false)
                }
              }
            })
          } else {
            WantUtils.toPhotoGallery()
          }
        })
      }
      .borderRadius({ bottomLeft: 6, bottomRight: 6 })
      .backdropBlur(20)
      .alignRules({
        bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
      })
      .visibility(Visibility.Visible)
    }.width('100%').aspectRatio(this.rowCount === 1 ? 1.715 : this.rowCount === 2 ? 0.677 : 1)
  }
}

@ComponentV2
export struct ImageRecordItemView {
  @Param onShare?: (entity: MediaRecordEntity) => void = undefined
  @Param onDelete?: (entity: MediaRecordEntity) => void = undefined
  @Param media?: MediaRecordEntity = undefined;
  @Param rowCount: number = 1;

  build() {
    RelativeContainer() {
      Image(this.media?.uri)
        .width('100%')
        .height('100%')
        .borderRadius(6)
        .backgroundColor($r('app.color.color_222222'))
        .onClick(() => {
            this.getUIContext().getRouter().pushUrl({ url: RouterUrls.PHOTO_VIEW_PAGE, params: { uri : this.media?.uri } })
        })

      Row() {
        Stack() {
          Image($r('app.media.ic_share_material')).height(18).width(18)
        }.layoutWeight(1).height(34)
        .onClick(() => {
          if (StrUtil.isNotEmpty(this.media?.uri)) {
            ShareManager.shareFile(this.media?.uri!!)
          }
        })

        Stack() {
          Image($r('app.media.ic_delete_material')).height(18).width(18)
        }.layoutWeight(1).height(34)
        .onClick(() => {
          if (PrefUtils.getBoolean('show_record_delete_tip', true)) {
            SimpleTipDialog.show(this.getUIContext(), {
              title: '提示', content: '因系统限制，请到相册中手动删除', buttonText: '知道了', callback: {
                confirm: () => {
                  WantUtils.toPhotoGallery()
                  PrefUtils.put('show_record_delete_tip', false)
                }
              }
            })
          } else {
            WantUtils.toPhotoGallery()
          }
        })
      }
      .borderRadius({ bottomLeft: 6, bottomRight: 6 })
      .backdropBlur(20)
      .alignRules({
        bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
      })
      .visibility(Visibility.Visible)
    }.width('100%').aspectRatio(this.rowCount === 1 ? 1.715 : this.rowCount === 2 ? 0.677 : 1)
  }
}

@ComponentV2
export struct AudioRecordItemView {
  @Param media?: MediaRecordEntity = undefined;

  build() {
    RelativeContainer() {
      Text(this.media?.name)
        .layoutWeight(1)
        .fontColor($r('app.color.color_90ffffff'))
        .fontSize(15)
        .maxLines(1)
        .textOverflow({ overflow: TextOverflow.Ellipsis })
        .alignRules({
          bottom: { anchor: '__container__', align: VerticalAlign.Center }
        })
        .margin({ bottom: 2 })

      Text(this.formatTime(Math.trunc(this.media!!.duration / 1000)))
        .fontColor($r('app.color.color_60ffffff'))
        .fontSize(14)
        .alignRules({
          top: { anchor: '__container__', align: VerticalAlign.Center }
        })
        .margin({ top: 2 })
        .id('tv_duration')

      Text(DateUtil.getFormatDateStr(this.media!!.createTime, 'yyyy年MM月dd日 HH:mm:ss'))
        .fontColor($r('app.color.color_30ffffff'))
        .fontSize(12)
        .alignRules({
          left: { anchor: 'tv_duration', align: HorizontalAlign.End },
          top: { anchor: 'tv_duration', align: VerticalAlign.Top },
          bottom: { anchor: 'tv_duration', align: VerticalAlign.Bottom }
        })
        .margin({ left: 12 })

      Image($r('app.media.ic_arrow_dp22')).width(24).height(24)
        .alignRules({
          top: { anchor: '__container__', align: VerticalAlign.Top },
          bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
          right: { anchor: '__container__', align: HorizontalAlign.End }
        })

      Divider().color($r('app.color.color_10ffffff')).width('100%').strokeWidth(1)
        .alignRules({
          bottom: { anchor: '__container__', align: VerticalAlign.Bottom }
        })
    }
    .height(74)
    .onClick(() => {
      this.getUIContext()
        .getRouter()
        .pushUrl({
          url: RouterUrls.AUDIO_PLAYER_PAGE,
          params: { title: this.media?.name, uri: this.media?.uri, showActions: true }
        }, router.RouterMode.Single)
    })
  }

  formatTime(time: number): string {
    let minute: number = 0
    let second: number = 0
    if (time > 60) {
      minute = Math.trunc(time / 60)
      second = time % 60
      if (minute < 10) {
        if (second < 10) {
          return `0${minute}:0${second}`
        } else {
          return `0${minute}:${second}`
        }
      } else {
        if (second < 10) {
          return `${minute}:0${second}`
        } else {
          return `${minute}:${second}`
        }
      }
    } else {
      second = time
      if (second < 10) {
        return `00:0${second}`
      } else {
        return `00:${second}`
      }
    }
  }
}