
import withLayout from '@/layout'
import { ScrollView, Image, Swiper, SwiperItem } from '@tarojs/components'
// import Taro from '@tarojs/taro'
import { getImgURL } from '@/utils/image'
import '@/assets/css/iconfont.css'
import './index.scss'

export default withLayout((props) => {
  const { List = [] } = props

  return (
    <view className='Page buildingTakeLook'>
      <ScrollView scroll-y>
        <view className='Content'>

          {/* 轮播图 or 主图 */}
          <view className='Banner'>
            <view>
              <Swiper autoplay interval={2000} indicator-dots>
                {
                  List.map((item, index) => (
                    <SwiperItem key={`Banner-${index}`}>
                      <view className='swiper-item'>
                        <Image mode='aspectFill' className='centerLabel' onClick={() => handleBannerClick(item)} src={getImgURL(item.image)} />
                      </view>
                    </SwiperItem>
                  ))
                }
              </Swiper>
            </view>
          </view>

          {/* 楼盘信息 */}
          <view className='BuildingInfo'>

            <view className='flex-h Title'>
              <view className='flex-item'>
                <text className='Name'>句容·恒大养生谷</text>
                <view className='Address flex-h'>
                  <text className='iconfont icon-dingwei'></text>
                  <view className='flex-item'>
                    <text>江苏省南京市奥体大厦1楼</text>
                  </view>
                  <text className='Price'>价格待定</text>
                </view>
                <text className='Time'>时间：2019/10/20 10:00 - 2019/10/22 10:00</text>
              </view>
              <view className='Option'>
                <view>
                  <text className='iconfont icon-fenxiang1'></text>
                  <text>分享</text>
                </view>
                <view>
                  <text className='iconfont icon-pengyouquan1'></text>
                  <text>朋友圈</text>
                </view>
              </view>
            </view>

            <view className='CountDown'>
              <text>距离结束还有</text>
              <text className='Red'>7</text>
              <text>天</text>
              <text className='Number' style={{ marginLeft: '40rpx' }}>7</text>
              <text className='active'>时</text>
              <text className='Number'>59</text>
              <text className='active'>分</text>
              <text className='Number'>28</text>
              <text className='active'>秒</text>
            </view>

            <view className='Apply flex-h'>
              <view className='Collect'>
                <text className='iconfont icon-shoucang'></text>
                <text>收藏</text>
              </view>
              <text className='iconfont icon-baoming'></text>
              <view className='flex-item'>
                <text>17人已报名</text>
              </view>
              <text className='Btn'>立即报名</text>
            </view>

          </view>

          {/* 详情介绍 */}
          <view className='Desc'>
            <view className='Title'>
              <text>活动介绍</text>
            </view>
            <view className='DescContent'></view>
          </view>

          <view className='Bottom'>
            <view>
              <view>
                <text className='iconfont icon-shengming'></text>
                <text>免责声明</text>
              </view>
              <view>
                <text>&emsp;&emsp;以上价格仅供参考,具体一房一价的信息以售楼处展示为准。房屋位置交通、医疗、教育、商业等配套信息，来源于第三方不作为要约,仅供参考,双方具体权利义务应以法律规定及买卖合同约定为准。本平台对项目周边文化教育的介绍旨在提供相关信息1 意味着信息发布方对就学安排作出承诺。相关教育资首页信息存在调整的可能,应以政府教育主管部门门及办学颁布的政策规定为准。详情请仔细阅读</text>
                <text className='active'>《新联家使用免责条款》</text>
              </view>
            </view>
          </view>

        </view>
      </ScrollView>
    </view>
  )
})
