import Taro, { Component } from '@tarojs/taro'
import { View } from '@tarojs/components'
import './index.scss'
import { transferImage } from '@/utils/tools'
import HotBlock from '../../components/HotBlock'

export default class Help extends Component {
  config = {
    navigationBarTitleText: '帮助说明'
  }
  handleChat() {
    const { buildingId } = this.$router.params
    if (buildingId) {
      Taro.navigateTo({
        url: `/pages/card/list/index?buildingId=${buildingId}`
      })
    } else {
      Taro.showToast({ title: '未获取到buildingId', icon: 'none', duration: 2000 })
    }
  }
  render() {
    // const hots = [
    //   {
    //     label: '(0)',
    //     value: 0,
    //   },
    //   {
    //     label: '(1)',
    //     value: 1,
    //   },
    //   {
    //     label: '(2)',
    //     value: 2,
    //   },
    //   {
    //     label: '(3)',
    //     value: 3,
    //   },
    //   {
    //     label: '(4)',
    //     value: 4,
    //   },
    //   {
    //     label: '(5)',
    //     value: 5,
    //   },
    //   {
    //     label: '(6~10)',
    //     value: 8,
    //   },
    //   {
    //     label: '(11~20)',
    //     value: 15,
    //   },
    //   {
    //     label: '(21~30)',
    //     value: 25,
    //   },
    //   {
    //     label: '(31~40)',
    //     value: 35,
    //   },
    //   {
    //     label: '(41~50)',
    //     value: 45,
    //   },
    //   {
    //     label: '(51~100)',
    //     value: 80,
    //   },
    //   {
    //     label: '(101~200)',
    //     value: 150,
    //   },
    //   {
    //     label: '(200以上)',
    //     value: 201,
    //   },
    // ]

    return (
      <View>
      {/* <View className="article"> */}
        {/* <View className="section">
          <View className="title">1.图例解释：</View>
          <View>
            <View className="cell flex">
              <View className="head item-0">1号楼</View>
              <View className="body item-1">楼栋/幢</View>
            </View>
            <View className="cell flex">
              <View className="head item-0">2 单元</View>
              <View className="body item-1">单元</View>
            </View>
            <View className="cell flex">
              <View className="head item-0">3 楼</View>
              <View className="body item-1">楼层</View>
            </View>
            <View className="cell flex">
              <View className="head item-0">
                <View>301 (1人)</View>
                <View>234万</View>
                <View>A户型</View>
              </View>
              <View className="body item-1">
                <View>房号（预选人数）</View>
                <View>价格</View>
                <View>户型名</View>
              </View>
            </View>
          </View>
        </View>
        <View className="section">
          <View className="title">2.预选人数（热度）：</View>
          <View>每有一位客户预选此房源，热度自动增加1，热度越大说明想购买此房源的用户越多，认筹摇号购买难度越大</View>
        </View>
        <View className="section">
          <View className="title">3.热度指标值与颜色关系：</View>
          <View className="flex" style="flex-wrap: wrap">
            {hots.map(b => (<View className="item-0 hot-box" key={b.value}><HotBlock number={b.value}>{b.label}</HotBlock></View>))}
          </View>
        </View>
        <View className="section">
          <View className="title">4.为何需要登录：</View>
          <View>预选房源和认筹房源按相关法律法规需要实名认证，通过手机号授权登录可以实现快捷认证。登录预选认筹后可以登录账号查看预选记录和认筹记录而不会遗失数据。</View>
        </View>
        <View className="section">
          <View className="title">5.楼盘、房源问题：</View>
          <View>和楼盘、房源相关问题可以联系置业顾问->在线置业顾问</View>
        </View>
        <View className="section">
          <View className="title">6.如何按面积或价格筛选房源：</View>
          <View>房源页面点击筛选按钮，选择一个户型或者价格即可查看按户型或价格筛选后的房源。</View>
        </View>
        <View className="section">
          <View className="title">7.如何把在线选房分享我的亲朋好友：</View>
          <View>房源页面点击分享按钮，选择直接分享发送链接给好友或群，选择生成海报保存图片，相册中找海报图片发送给好友或者朋友圈即可。</View>
        </View>
        <View className="section">
          <View className="title">8.为什么房源详情中预选/取消按钮或认筹/取消按钮操作失败：</View>
          <View>
            <View>可能原因：</View>
            <View>1）没有到预选或认筹时间，请关注通知或联系置业顾问</View>
            <View>2）已过预选或认筹时间，请关注通知 或 联系置业顾问</View>
            <View>3）其他原因，请 联系置业顾问</View>
          </View>
        </View>
        <View className="section">
          <View className="title">9.为什么之前看到的房源现在找不到了：</View>
          <View>可能由于线上线下销售工作同步不及时原因，临时取消了此房源的线上预选和销售工作，有疑问请  联系置业顾问</View>
        </View>
        <View className="section">
          <View className="title">10.如何查看我的选房记录：</View>
          <View>房源页面点击下方选房记录按钮进入个人选房记录查看。或直接进入个人中心查看选房记录。</View>
        </View> */}
        <Image mode="widthFix" style="width:100%" src={transferImage('https://njcj.oss-cn-shanghai.aliyuncs.com/miniapp/explain.png')}></Image>
        <Image onClick={() => this.handleChat()} style="width: 110rpx;height: 110rpx;position: fixed;bottom: 40px;right: 20rpx;" src={require('../../assets/consultant.png')}></Image>
      </View>
    )
  }

}
