import { Button, Icon, Image, Tag } from 'vant'
import classNames from 'classnames'
import MusicIcon from '@/views/music/list/icons/music-icon.png'
import InitUserIcon from '@/views/music/list/icons/init-user-icon.png'
// import FavoriteIcon from '@/student/music/album/favorite.svg'
// import FavoritedIcon from '@/student/music/album/favorited.svg'
import { defineComponent } from 'vue'
import styles from './index.module.less'
import Item from '@/views/music/album/item'

const chargeTypes = {
  CHARGE: '点播',
  FREE: '免费',
  VIP: 'VIP'
}

export default defineComponent({
  name: 'OrderMusic',
  props: {
    item: {
      type: Object,
      default: {}
    }
  },
  render() {
    const item = this.item
    return (
      <div class={styles.album}>
        <Image class={styles.img} src={item.albumCoverUrl} />
        {item.paymentType === 'CHARGE' && (
          <span class={styles.albumType}>付费</span>
        )}

        <div class={styles.content}>
          <h4 class="van-ellipsis">{item.albumName}</h4>
          <p class="van-multi-ellipsis--l2">{item.albumDesc}</p>
          {/* <Footer
            musicSheetCount={item.musicSheetCount}
            albumFavoriteCount={item.albumFavoriteCount}
          /> */}
          <div class={styles.footer}>
            <span>{item.musicSheetCount}首</span>
            <span>{item.albumFavoriteCount}人收藏</span>
          </div>
        </div>
      </div>
    )
  }
})
