import Taro, { Component } from '@tarojs/taro'
import { View } from '@tarojs/components'
import { AtTabs, AtTabsPane } from 'taro-ui'
import LFormGroup from '@/c/lform/formGroup'
import './loanCalc.scss'

class Index extends Component {
  onShareAppMessage() {
    return {
      title: `房贷税费计算工具`,
    }
  }
  onShareTimeline () {
    return {
      title: '让买房，更省心！',
    }
  }

  constructor (props) {
    super(props)
    this.state = {
      curNav: 0,
      formObj: {},
    }
  }
  config = {
    navigationBarTitleText: '房贷税费计算工具',
  }

  componentWillMount () {
    Taro.showLoading({
      mask: true,
      title: '加载中..'
    })
    setTimeout(() => {
      Taro.hideLoading()
    }, 1000)
  }

  saveHandle () {
    const { feedback_count, formObj, imgArr } = this.state
    if (feedback_count && formObj.feedback_type) {
      Taro.api.base.apifeedbackadd({
        feedback_type: formObj.feedback_type,
        contact: formObj.contact,
        feedback_count: feedback_count,
        images: imgArr.join(','),
      }).then(res => {
        Taro.$msgConfirm('反馈成功~感谢您的宝贵建议', () => {
          Taro.navigateBack({
            delta: 1
          })
        }, () => {
          Taro.navigateBack({
            delta: 1
          })
        })
      })
    } else {
      Taro.$msg('请输入提问的类型和内容')
    }
  }

  baseFormChange (key, val) {
    let { formObj } = this.state
    formObj[key] = val
    this.setState({
      formObj
    })
  }

  navClick (value) {
    this.setState({
      curNav: value,
    })
  }

  render () {
    // const dictData = Taro.getStorageSync('dictData')
    // const startRateMoreOptions = {arr: [{key: '20%', val: 0.2}, {key: '30%', val: 0.3}, {key: '35%', val: 0.35}, {key: '40%', val: 0.4}, {key: '50%', val: 0.5}, {key: '60%', val: 0.6}, {key: '70%', val: 0.7}, {key: '80%', val: 0.8}, {key: '90%', val: 0.9}]}
    // const loanDateMoreOptions = {arr: [{key: '30年', val: 30}, {key: '20年', val: 20}, {key: '10年', val: 10}, {key: '5年', val: 5},]}
    // const tabList = [{ title: '商业贷款' }, { title: '公积金贷款' }, { title: '组合贷款' }]
    // const { curNav, formObj } = this.state
    return (
      <View className="l-box">
        <WebView src="https://houseloan.honglounews.com"/>
        {/* <AtTabs className="scoped-fixed" current={curNav} tabList={tabList} onClick={this.navClick.bind(this)}>
          <AtTabsPane current={curNav} index={0} >
            <View className="l-floor-pos">
              <LFormGroup
                val={formObj.totalPrice}
                valStr="totalPrice"
                keyStr="房屋总价"
                typeStr="inputFont"
                inputFont="万"
                bc={this.baseFormChange.bind(this)}
              />
              <LFormGroup
                val={formObj.startRate}
                valStr="startRate"
                keyStr="首付比例"
                typeStr="select"
                moreOptions={startRateMoreOptions}
                bc={this.baseFormChange.bind(this)}
              />
              <LFormGroup
                val={formObj.loanPrice}
                valStr="loanPrice"
                keyStr="商贷金额"
                typeStr="inputFont"
                inputFont="万"
                bc={this.baseFormChange.bind(this)}
              />
              <LFormGroup
                val={formObj.loanDate}
                valStr="loanDate"
                keyStr="商贷年限"
                typeStr="select"
                moreOptions={loanDateMoreOptions}
                bc={this.baseFormChange.bind(this)}
              />
              <LFormGroup
                val={formObj.loanInterestRate}
                valStr="loanInterestRate"
                keyStr="商贷利率"
                typeStr="inputFont"
                inputFont="%"
                bc={this.baseFormChange.bind(this)}
              />
            </View>
          </AtTabsPane>
          <AtTabsPane current={curNav} index={1} >
            2
          </AtTabsPane>
          <AtTabsPane current={curNav} index={2} >
            3
          </AtTabsPane>
        </AtTabs>
        <View className="l-floor-footer t2">
          <View className="lff-flex">
            <View className="lff-btn full" onClick={this.saveHandle.bind(this)}>提交</View>
          </View>
        </View> */}
      </View>
    )
  }
}

export default Index
