import Taro from '@tarojs/taro'
import { Image } from '@tarojs/components'
import '@/assets/css/iconfont.css'
import { getImgURL } from '@/utils/image'
import './index.scss'

export default function LivingActivity (props) {
  const { Info = {} } = props
  const List = Info?.liveActivityList || []

  const gotoList = () => {
    const buildingId = Info?.buildingId
    Taro.switchTab({
      url: `/pages/video/index?buildingId=${buildingId}`
    })
  }

  const gotoDetail = (item) => {
    if(item.type=='video'){
      Taro.navigateTo({ url: `/pages/video/videoDetail/index?id=${item.liveActivityId}` })
    }else{
      Taro.navigateTo({ url: `/pages/video/liveDetail/index?id=${item.liveActivityId}` })
    }
  }

  return List.length > 0 ? (
    <view className='components LivingActivity'>

      <view className='Title flex-h'>
        <view className='flex-item'>
          <text>直播活动</text>
        </view>
        <text onClick={gotoList}>更多</text>
        <text className='iconfont icon-jiantouright'></text>
      </view>

      <view className='List flex-h'>
        {
          List.map((item, index) => (
            <view className='flex-item' key={`ListItem-${index}`} onClick={() => gotoDetail(item)}>
              <view style={{display: item.listImg ? 'block' : 'none'}}>
                <Image mode='aspectFill' src={getImgURL(item.listImg)} className='centerLabel'></Image>
              </view>
            </view>
          ))
        }
      </view>

    </view>
  ) : null
}
