<!-- 基本信息 -->
<template>
  <list-item :item-height="44">
    <div>
      <div slot="name" class="section-title" style="">基本信息</div>
      <item v-for="(ele, i) of formdata" :key="ele.title">
        <div slot="name" class="font-color">{{ ele.title }}</div>
        <span v-if="ele.type === 'date'" slot="content">{{ baseInfo[ele.prop] | dateFormat }}</span>
        <span v-else-if="ele.type === 'currency'" slot="content">{{ baseInfo[ele.prop] | currency }}</span>
        <span v-else-if="ele.type === 'bool'" slot="content">{{ baseInfo[ele.prop] === 'Y' ? '是' : '否' }}</span>
        <span v-else slot="content">{{ baseInfo[ele.prop] }}</span>
      </item>
      <Field
        v-model="baseInfo.customer_nature_n"
        :required="true" :is-link="true" input-align="right"
        label="客户性质选择" @click="showPicker()" placeholder="请选择"/>
    </div>

    <div>
      <div slot="name" class="section-title" style="">配偶信息</div>
      <item v-for="(ele, i) of formdata_sp" :key="ele.title">
        <div slot="name" class="font-color">{{ ele.title }}</div>
        <span v-if="ele.type === 'date'" slot="content">{{ baseInfo[ele.prop] | dateFormat }}</span>
        <span v-else-if="ele.type === 'currency'" slot="content">{{ baseInfo[ele.prop] | currency }}</span>
        <span v-else-if="ele.type === 'bool'" slot="content">{{ baseInfo[ele.prop] === 'Y' ? '是' : '否' }}</span>
        <span v-else slot="content">{{ baseInfo[ele.prop] }}</span>
      </item>
    </div>
    <div v-if="['TENANT', 'GUTA'].indexOf(baseInfo.bp_type)!==-1">
      <div slot="name" class="section-title" style="">资质信息</div>
      <item v-for="(ele, i) of formdata_quality" :key="ele.title">
        <div slot="name" class="font-color">{{ ele.title }}</div>
        <span v-if="ele.type === 'date'" slot="content">{{ baseInfo[ele.prop] | dateFormat }}</span>
        <span v-else-if="ele.type === 'currency'" slot="content">{{ baseInfo[ele.prop] | currency }}</span>
        <span v-else-if="ele.type === 'bool'" slot="content">{{ baseInfo[ele.prop] === 'Y' ? '是' : '否' }}</span>
        <span v-else slot="content">{{ baseInfo[ele.prop] }}</span>
      </item>
    </div>
    <div class="foot-bottom">
      <button class="success" @click="save">保存</button>
    </div>
    <ActionSheet
      v-model="picker_show" :actions="actions" :close-on-click-action="true" :closeable="false"
      title="客户性质选择" @select="onSelect" />
  </list-item>
</template>

<script>
import { Field, ActionSheet } from 'vant'
import 'vant/lib/field/style'
import 'vant/lib/action-sheet/style'
export default {
  components: {
    Field,
    ActionSheet,
  },
  props: ['baseInfo'],
  data () {
    return {
      actions: [], // 下拉框
      customerType: [], // 客户性质下拉框
      picker_show: false,
    }
  },
  computed: {
    formdata () {
      return this.createForm()
    },
    formdata_sp () {
      return this.createForm_SP()
    },
    formdata_quality () {
      return this.createForm_quality()
    },
  },
  created () {
    this.getDropBox()
  },
  methods: {
    onSelect (value) {
      let val = value.name
      this.$set(this.baseInfo, 'customer_nature_n', val)
      let arr = this.customerType.filter(item => item.code_name === val)
      this.$set(this.baseInfo, 'customer_nature', arr[0].code)
    },
    showPicker () {
      this.actions = this.customerType.map(item => ({name: item.code_name}))
      this.picker_show = true
    },
    // 下拉框数据获取
    async  getDropBox () {
      let url = process.env.basePath + 'app_get_syscode'
      let param = {
        'CUSTOMER_NATURE': 'CUSTOMER_NATURE',
      }
      // hlsPopup.showLoading('请稍候')
      let res = await this.$post(url, param)
      // this.hlsPopup.hideLoading()
      if (res.return_status === 'S') {
        this.customerType = res.CUSTOMER_NATURE
      }
    },
    async save () {
      let flag = false
      let obj = {
        'bp_id': this.baseInfo['bp_id'],
      }
      obj['customer_nature_n'] = this.baseInfo['customer_nature_n']
      obj['customer_nature'] = this.baseInfo['customer_nature']

      Object.keys(obj).map(key => {
        if (obj[key] === undefined || obj[key] === null || obj[key] === '') {
          flag = true
        }
      })
      console.log(obj)
      if (flag) {
        hlsPopup.showLongCenter('请将必填字段填写完整')
        return
      }
      let url = process.env.basePath + 'bp_access_info_save'
      let param = {
        'master': obj,
      }

      hlsPopup.showLoading('请稍候')
      let res = await this.$post(url, param)
      this.hlsPopup.hideLoading()
      if (res.result === 'S') {
        hlsPopup.showLongCenter('保存成功')
      } else {
        hlsPopup.showLongCenter('保存失败')
      }
    },
    factory (arr) {
      let outArr = []
      if (arr.length) {
        arr.forEach(ele => {
          let [title, prop, type] = ele
          outArr.push({
            title: title || '',
            prop: prop || 'fdf',
            type: type || 'text',
          })
        })
      }
      return outArr
    },
    createForm () {
      let baseInfo_A = [// 承租人/担保人
        ['姓名', 'bp_name', 'text'],
        ['学历', 'academic_background_n', 'text'],
        ['婚姻状况', 'marital_status_n', 'text'],
        ['身份证', 'id_card_no', 'text'],
        ['证件有效期从', 'id_card_date_from', 'date'],
        ['证件有效期到', 'id_card_date_to', 'date'],
        ['业务办理地（省）', 'province_n', 'text'],
        ['业务办理地（市）', 'city_n', 'text'],
        ['业务办理地（区/县）', 'district_n', 'text'],
        ['邮政编码', 'post_code', 'text'],
        ['所属机构名称', 'agent_name', 'text'],
        ['所属机构代码', 'business_license_num', 'text'],
        ['手机号', 'cell_phone', 'text'],
        ['QQ号', 'qq_code', 'text'],
        ['微信号', 'wechat_code', 'text'],
        ['户籍地址', 'address_on_resident_booklit', 'text'],
        ['联系地址', 'living_address', 'text'],
        ['资产', 'capital', 'text'],
        ['驾照类型', 'driving_license_type_n', 'text'],
        
      ]

      let baseInfo_B = [// 经销商/主机厂/办事处
        ['姓名', 'bp_name', 'text'],
        ['学历', 'academic_background_n', 'text'],
        ['婚姻状况', 'marital_status_n', 'text'],
        ['身份证', 'id_card_no', 'text'],
        ['年份', 'id_card_no_yy', 'text'],
        ['月份', 'id_card_no_mm', 'text'],
        ['证件有效期从', 'id_card_date_from', 'date'],
        ['证件有效期到', 'id_card_date_to', 'date'],
        ['业务办理地（省）', 'province_n', 'text'],
        ['业务办理地（市）', 'city_n', 'text'],
        ['业务办理地（区/县）', 'district_n', 'text'],
        ['手机号', 'cell_phone', 'text'],
        ['QQ号', 'qq_code', 'text'],
        ['微信号', 'wechat_code', 'text'],
        ['所属机构证件号', 'business_license_num', 'text'],
        ['所属机构名称', 'agent_name', 'text'],
        ['户籍地址', 'address_on_resident_booklit', 'text'],
        ['联系地址', 'living_address', 'text'],
      ]

      let newForm = ['TENANT', 'GUTA'].indexOf(this.baseInfo.bp_type) !== -1 ? baseInfo_A : baseInfo_B

      return this.factory(newForm)
    },
    createForm_SP () {
      let mateInfo = [// 配偶信息
        ['姓名', 'bp_name_sp', 'text'],
        ['身份证号码', 'id_card_no_sp', 'text'],
        ['证件有效期从', 'id_card_date_from_sp', 'date'],
        ['证件有效期到', 'id_card_date_to_sp', 'date'],
        ['手机号', 'spouse_phone', 'text'],
        ['工作单位', 'working_place_sp', 'text'],
        ['联系地址', 'address_sp', 'text'],
      ]
      return this.factory(mateInfo)
    },
    createForm_quality () {
      let qualificationInfo = [// 资质信息
        ['是否黑名单', 'blackList_flag', 'text'],
        ['征信是否异常', 'credit_normal_flag', 'text'],
        ['评级结果', 'rating_result', 'text'],
      ]
      return this.factory(qualificationInfo)
    },
  },
}
</script>

  <style lang="less" scoped>
  .section-title{
    padding: 0 0 0 0.3rem;
    font-size: 0.3rem;
    color: #385880;
    line-height: 0.5rem;
    margin-top: 12px;
  }
  /deep/ #contract-details .van-cell{
    background-color: white;
  }
</style>
