enterprise.vue

<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-09-19 09:31:19
 * @LastEditTime: 2019-10-12 09:42:44
 * @LastEditors: Please set LastEditors
 -->
<template>
  <h-view id="base-info" class="public-style" title="基本信息">
    <h-header :proportion="[5,1,1]" class="header">
      <div slot="left" class="h-header-btn" @click="$routeGo()">
        <img src="@/assets/userBind/arrow.png" >
        <span>用户绑定</span>
      </div>
    </h-header>
    <Tab :tabNum="tabNum" @getTabNum="getTabNum" />
    <h-content class="content">
      <div v-show="tabNum==0">
        <list-item :item-height="44">
          <item :showArrow="true">
            <div slot="name" class="font-color required">客户类型</div>
            <input
              slot="content"
              v-model="baseInfo.bp_type_n"
              placeholder="请选择"
              type="text"
              readonly
              @click="selectIdType()"
            >
          </item>
          <item v-if="bp_type_flag">
            <div slot="name">{{ typeName }}</div>
            <input
              v-if="bpClass_flag"
              slot="content"
              :placeholder="type"
              v-model="baseInfo.agent_username"
            >
            <!-- <input v-if="!bpClass_flag" slot="content" :placeholder="type" v-model="baseInfo.business_license_num" > -->
          </item>
        </list-item>
        <div class="userInfo martop">企业信息</div>
        <div class="upload-id-card">
          <span class="font-color">营业执照照片上传</span>
          <div class="upload-box1">
            <div v-if="!licenseImg" @click="ocrShow('license', '')">
              <img src="@/assets/userBind/camera.png" >
            </div>
            <div
              v-if="licenseImg && !isApproved"
              style="width: 100%;height: 100%"
              @click="ocrShow('license', '')"
            >
              <img :src="licenseImg" style="width: 100%;height: 100%;margin: 0" >
            </div>
          </div>
        </div>

        <!-- 营业执照识别信息 -->

        <list-item :item-height="44" class="second-part">
          <item>
            <div slot="name" class="font-color required">公司名称</div>
            <input
              slot="content"
              v-model="baseInfo.bp_name"
              readonly
              placeholder="上传营业执照自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">企业类型</div>
            <input
              slot="content"
              v-model="baseInfo.enterprise_type"
              readonly
              placeholder="上传营业执照自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">统一社会信用代码</div>
            <input
              slot="content"
              v-model="baseInfo.organization_code"
              readonly
              placeholder="上传营业执照自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">注册资本</div>
            <input
              slot="content"
              v-model="baseInfo.registered_capital"
              readonly
              placeholder="上传营业执照自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">法定代表人</div>
            <input
              slot="content"
              v-model="baseInfo.legal_person"
              readonly
              placeholder="上传营业执照自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">注册地址</div>
            <textarea
              slot="content"
              ref="myTestarea"
              v-model="baseInfo.registered_place"
              cols="30"
              rows="1"
              readonly
              class="auto"
              placeholder="上传营业执照自动填充"
              @input="addRows(baseInfo.registered_place)"
            />
          </item>
          <item :showArrow="true">
            <div slot="name" class="required">省份</div>
            <input
              slot="content"
              v-model="baseInfo.province_name"
              placeholder="请选择"
              type="text"
              readonly
              onfocus="this.blur()"
              @click="selectProvince()"
            >
          </item>
          <item :showArrow="true">
            <div slot="name" class="required">城市</div>
            <input
              slot="content"
              v-model="baseInfo.city_name"
              placeholder="请选择"
              type="text"
              readonly
              onfocus="this.blur()"
              @click="selectCity()"
            >
          </item>
          <item :showArrow="true">
            <div slot="name" class="required">区县</div>
            <input
              slot="content"
              v-model="baseInfo.district_name"
              placeholder="请选择"
              type="text"
              readonly
              onfocus="this.blur()"
              @click="selectDistrict()"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">经营地址</div>
            <textarea
              slot="content"
              ref="myTestareaLive"
              v-model="baseInfo.business_address"
              cols="34"
              rows="1"
              placeholder="请输入经营地址"
              @input="addRowsLive(baseInfo.business_address)"
            />
          </item>
          <item>
            <div slot="name" class="font-color required">固定电话</div>
            <input slot="content" v-model="baseInfo.phone" placeholder="请输入固定电话" >
          </item>
        </list-item>

        <!-- 授权切换 -->

        <div class="authorize">
          <p class="authorize-select font-color">是否授权</p>
          <div class="authorize-checklist" @click="authorizeChange">
            <div v-if="flag" />
            <img v-if="!flag" src="@/assets/userBind/org/checklist.png" alt >
          </div>
        </div>
        <div class="userInfo types">{{ text }}</div>
        <div class="upload-id-cards">
          <span>身份证照片上传</span>
          <div class="upload-box">
            <div v-if="!idCardFront" @click="ocrShow('idCard', 'front')">
              <img src="@/assets/userBind/org/front.png" >
              <p>正面</p>
            </div>
            <div v-if="idCardFront && !isApproved" @click="ocrShow('idCard', 'front')">
              <img :src="idCardFront" style="width: 100%;height: 100%;margin: 0" >
            </div>
            <div v-if="!idCardBack" @click="ocrShow('idCard', 'back')">
              <img src="@/assets/userBind/org/back.png" >
              <p>反面</p>
            </div>
            <div v-if="idCardBack && !isApproved" @click="ocrShow('idCard', 'back')">
              <img :src="idCardBack" style="width: 100%;height: 100%;margin: 0" >
            </div>
          </div>
        </div>

        <!-- 已授权 -->

        <list-item v-if="!flag" :item-height="44" class="second-part">
          <item>
            <div slot="name" class="font-color required">姓名</div>
            <input
              slot="content"
              v-model="authMsg.auth_person_name"
              readonly
              placeholder="上传身份证自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">身份证号</div>
            <input
              slot="content"
              v-model="authMsg.auth_person_id_card"
              readonly
              placeholder="上传身份证自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">公司职务</div>
            <input slot="content" v-model="authMsg.auth_person_position" placeholder="请输入公司职务" >
          </item>
          <item>
            <div slot="name" class="font-color required">授权事项</div>
            <input slot="content" v-model="authMsg.auth_person_matter" placeholder="请输入授权事项" >
          </item>
        </list-item>

        <!-- 未授权 -->

        <list-item v-if="flag" :item-height="44" class="second-part">
          <item>
            <div slot="name" class="font-color required">姓名</div>
            <input
              slot="content"
              v-model="baseInfo.legal_person"
              readonly
              placeholder="上传身份证自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">身份证号</div>
            <input
              slot="content"
              v-model="legal_personMsg.id_card_no"
              readonly
              placeholder="上传身份证自动填充"
              class="auto"
            >
          </item>
          <item>
            <div slot="name" class="font-color required">手机号</div>
            <input slot="content" v-model="legal_personMsg.cell_phone" placeholder="请输入手机号" >
          </item>
          <item>
            <div slot="name" class="font-color required">居住地址</div>
            <textarea
              ref="address"
              slot="content"
              v-model="legal_personMsg.living_address"
              cols="30"
              rows="1"
              placeholder="请输入居住地址"
              @input="addAddressRows(legal_personMsg.living_address)"
            />
          </item>
        </list-item>
        <div v-if="!flag" class="upload-id-card">
          <span>授权书证件上传</span>
          <div class="upload-box1">
            <!-- <div> -->
            <img src="@/assets/userBind/camera.png" >
            <!-- </div> -->
          </div>
        </div>

        <!-- 资产信息 -->

        <div :class="{martop: flag,types:!flag}" class="userInfo">资产信息</div>
        <div class="card2">
          <span>房产证件</span>
          <div class="img-content">
            <div class="card-upload">
              <img src="@/assets/userBind/camera.png" >
            </div>
          </div>
        </div>
        <div class="card2">
          <span>车辆证件</span>
          <div class="img-content">
            <div class="card-upload">
              <img src="@/assets/userBind/camera.png" >
            </div>
          </div>
        </div>
        <div class="card2">
          <span>其他资产证件</span>
          <div class="img-content">
            <div class="card-upload">
              <img src="@/assets/userBind/camera.png" >
            </div>
          </div>
        </div>
      </div>
      <!-- <BankInfo v-show="tabNum==1" :bp_id="bp_id" @getInfo="getInfo" /> -->
      <BankInfo v-show="tabNum==1" :getBankList="getBankList" @getInfo="getInfo" />
      <InvoiceInfo
        v-show="tabNum==2"
        :tabNum="tabNum"
        :baseInfo="baseInfo"
        :orgCode="baseInfo.organization_code"
        @getinvoiceList="getinvoiceList"
      />
    </h-content>
    <bottom-tab class="footer-button">
      <tab-button :class="[isApproved?'put-approved':'put']" @click.native="handSubmit">提交</tab-button>
      <tab-button v-if="!isApproved" class="save" @click.native="verified">保存</tab-button>
    </bottom-tab>
    <h-modal ref="modal" v-model="showModalValue" position="bottom">
      <h-view>
        <div class="modal-content">
          <div class="modal-content-add-top">
            <span>添加银行卡</span>
            <img src="@/assets/userBind/close.png" @click="hideModal" >
          </div>
          <img
            v-if="!bankImg"
            src="@/assets/userBind/addBack.png"
            class="addBack"
            @click="ocrShow('bankCard', '')"
          >
          <img
            v-if="bankImg && !isApproved"
            :src="bankImg"
            class="addBack"
            style="height: 38%;"
            @click="ocrShow('bankCard', '')"
          >
          <list-item :item-height="44" class="card-Info">
            <item>
              <div slot="name">银行卡卡号</div>
              <input
                slot="content"
                v-model="bank_lists.bank_account_num"
                readonly
                placeholder="识别银行卡自动填充"
              >
            </item>
            <item>
              <div slot="name">账户姓名</div>
              <input slot="content" v-model="bank_lists.bank_account_name" placeholder="请输入账户名称" >
            </item>
            <item>
              <div slot="name">银行名称</div>
              <input
                slot="content"
                v-model="bank_lists.bank_full_name"
                readonly
                placeholder="识别银行卡自动填充"
              >
            </item>
            <item>
              <div slot="name">支行名称</div>
              <input slot="content" v-model="bank_lists.bank_branch_name" placeholder="请输入支行名称" >
            </item>
          </list-item>
        </div>
      </h-view>
      <bottom-tab class="add-box">
        <tab-button class="add-card" @click.native="addBankInfo">添加</tab-button>
      </bottom-tab>
    </h-modal>
  </h-view>
</template>

<script>
import Tab from '@/components/tab'
import InvoiceInfo from './invoiceInfo'
import BankInfo from './bankInfo'

export default {
  name: 'Enterprise',
  components: {
    Tab,
    BankInfo,
    InvoiceInfo,
  },
  data () {
    return {
      tabNum: 0,
      bp_id: '',
      flag: true,
      bpClass: '',
      from: false,
      isApproved: false,
      img_url: {},
      typeList: [],
      backList: [],
      saveInfo: {},
      lastInfo: {},
      msg_flag: false,
      invoiceInfo: {},
      maritalList: [],
      getBankList: [],
      cityList: [],
      provinceList: [],
      districtList: [],
      academic_bg_n: '',
      bpClass_flag: false,
      text: '法人代表信息',
      bp_type_flag: false,
      typeName: '',
      marital_status_n: '',
      bank_card_flag: false,
      showModalValue: false,
      type: '请输入业务经办姓名',
      legal_personMsg: {
        id_card_no: null,
        // legal_person: '',
        cell_phone: null,
        living_address: '',
      },
      baseInfo: {
        district_id: '',
        district_name: '',
        province_name: '',
        province_id: '',
        city_name: '',
        city_id: '',
        bp_type: '',
        bp_type_n: '',
        bp_name: '',
        phone: '',
        auth_flag: '',
        user_phone: window.localStorage.user_phone,
        legal_person: '',
        agent_username: '',
        enterprise_type: '',
        business_address: '',
        registered_place: '',
        organization_code: '',
        registered_capital: '',
        // business_license_num: '',
        bp_class: this.$route.params.bp_class,
      },
      bank_lists: {
        bank_account_num: '',
        bank_account_name: '',
        bank_card_type: '',
        bank_full_name: '',
        bank_branch_name: '',
      },
      authMsg: {
        auth_person_name: '',
        auth_person_matter: '',
        auth_person_id_card: '',
        auth_person_position: '',
      },
      idCardFront: '', // 身份证正面图片
      idCardBack: '', // 身份证反面图片
      licenseImg: '', // 营业执照照片
      bankImg: '', // 银行卡图片
    }
  },
  computed: {},
  watch: {
    'baseInfo.auth_flag' (newVal, oldVal) {
      if (newVal === '是') {
        this.flag = false
      } else if (newVal === '否') {
        this.flag = true
      }
    },
    // 监听客户类型
    'baseInfo.bp_type_n' () {
      let vm = this
      if (vm.baseInfo.bp_type === 'TENANT' || vm.baseInfo.bp_type === 'GUTA') {
        vm.type = '请输入业务经办员工代码'
        vm.typeName = '业务经办人'
        // vm.baseInfo.agent_username = ''
      } else if (
        vm.baseInfo.bp_type === 'AGENT' ||
        vm.baseInfo.bp_type === 'OFFICE' ||
        vm.baseInfo.bp_type === 'FACTORY'
      ) {
        vm.bp_type_flag = false
        // vm.typeName = '营业执照'
        // vm.type = '请输入营业执照号'
        // vm.baseInfo.agent_username = ''
      }
    },
    flag () {
      if (this.flag) {
        this.text = '法人代表信息'
      } else {
        this.text = '授权信息'
      }
    },
    typeName () {
      if (this.typeName === '业务经办人') {
        this.bpClass = this.baseInfo.agent_username
        this.bpClass_flag = true
      } else {
        this.bpClass = this.baseInfo.business_license_num
        this.bpClass_flag = false
      }
    },
    tabNum: function (newVal, oldVal) {
      if (newVal === 1 && !this.bp_id && !this.from) {
        this.hlsPopup.showError('请先保存基本信息')
        this.tabNum = oldVal
      }
    },
  },
  created () {
    this.getBpType()
    this.getProvince()
    if (this.$route.params.status === 'APPROVED') {
      this.isApproved = true
    }
    // this.getBankInfo()
  },
  beforeRouteEnter (to, from, next) {
    if (from.fullPath === '/tab/my-info') {
      next(vm => {
        vm.from = true
        vm.getbaseInfo()
        vm.getBankInfo()
      })
    }
    next()
  },
  methods: {
    getBankInfo () {
      let vm = this
      // let bpId = window.localStorage.getItem('user_id')
      let id = vm.from ? vm.$route.params.bp_id : vm.bp_id
      // let bpId = vm.bp_id
      let url = process.env.basePath + 'bp_bank_query'
      let param = {
        bp_id: id,
      }
      vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.getBankList = res.lists
        }
      })
    },
    addRows (e) {
      let addNum = parseInt(e.length / 16)
      if (addNum === 0) {
        this.$refs.myTestarea.rows = 1
      } else if (addNum >= addNum - 1 && addNum < addNum + 1) {
        this.$refs.myTestarea.rows = addNum + 1
      }
    },
    addRowsLive (e) {
      let addNum = parseInt(e.length / 16)
      if (addNum === 0) {
        this.$refs.myTestareaLive.rows = 1
      } else if (addNum >= addNum - 1 && addNum < addNum + 1) {
        this.$refs.myTestareaLive.rows = addNum + 1
      }
    },
    addAddressRows (e) {
      let addNum = parseInt(e.length / 16)
      if (addNum === 0) {
        this.$refs.address.rows = 1
      } else if (addNum >= addNum - 1 && addNum < addNum + 1) {
        this.$refs.address.rows = addNum + 1
      }
    },
    handSubmit () {
      if (this.bp_id) {
        this.hlsPopup.showConfirm({
          title: '提示',
          content: '您确认提交吗？',
          onConfirm: data => {
            console.log(data)
            if (data) {
              let url = $config.basePath + 'bp_bind_submit'
              let param = {
                master: {
                  // bp_id: window.localStorage.getItem('user_id'),
                  bp_id: this.bp_id,
                  company_id: '2145',
                },
              }
              let vm = this
              this.hlsHttp.post(url, param).then(function (res) {
                console.log('企业信息提交', res)
                if (res.result === 'S') {
                  vm.hlsPopup.showSuccess('提交成功')
                  vm.$router.push({
                    name: 'Home',
                  })
                }
              })
            }
          },
        })
      } else {
        this.hlsPopup.showLongCenter('基本信息未保存！')
      }
    },
    addBankInfo () {
      this.hlsPopup.showConfirm({
        title: '提示',
        content: '您确认添加吗？',
        onConfirm: data => {
          console.log(data)
          if (data) {
            for (var key in this.bank_lists) {
              if (!this.bank_lists[key]) {
                this.bank_card_flag = false
                this.hlsPopup.showLongCenter('银行信息不完整！')
                return
              } else {
                this.bank_card_flag = true
              }
            }
            // 银行卡验证this.hlsUtil.isBankAccount(this.bank.bank_account_num)
            if (this.hlsUtil.isBankAccount(this.bank_lists.bank_account_num)) {
              this.bank_card_flag = false
              this.hlsPopup.showLongCenter('请输入正确银行卡号！')
            }
            // 验证账户名称与承租人名称一致
            if (this.bank_lists.bank_account_name !== this.saveInfo.bp_name) {
              this.bank_card_flag = false
              this.hlsPopup.showLongCenter('企业名称与账户名称不一致')
            }
            if (this.bank_card_flag) {
              this.hlsPopup.showLoading('请稍后')
              let id
              if (this.from) {
                id = this.$route.params.bp_id
              } else {
                id = this.bp_id
              }
              let url = $config.basePath + 'bp_bank_save'
              let param = {
                master: {
                  bp_id: id,
                  bank_lists: [this.bank_lists],
                },
              }
              let vm = this
              vm.hlsHttp.post(url, param).then(function (res) {
                //   console.log(res)
                if (res.result === 'S') {
                  vm.hlsPopup.hideLoading()
                  vm.showModalValue = false
                  vm.hlsPopup.showSuccess('添加成功')
                  let url = $config.basePath + 'bp_bank_query'
                  let param = {
                    bp_id: id,
                  }

                  vm.hlsHttp.post(url, param).then(function (res) {
                    console.log('银行卡查询', res)
                    vm.getBankList = [...vm.getBankList, ...res.lists]
                  })
                }
              })
            }
          }
        },
      })
    },

    verified () {
      // debugger
      if (this.flag) {
        // this.flag = false
        for (let i in this.authMsg) {
          this.authMsg[i] = ''
        }

        this.baseInfo.auth_flag = 'N'
        this.lastInfo = { ...this.baseInfo, ...this.legal_personMsg }
        this.saveInfo = {
          ...this.lastInfo,
          ...this.authMsg,
          ...this.invoiceInfo,
        }
        this.saveInfo.auth_flag = 'N'
      } else {
        // this.flag = false
        for (let i in this.legal_personMsg) {
          this.legal_personMsg[i] = ''
        }

        this.baseInfo.auth_flag = 'Y'
        this.lastInfo = { ...this.baseInfo, ...this.authMsg }
        this.saveInfo = {
          ...this.lastInfo,
          ...this.legal_personMsg,
          ...this.invoiceInfo,
        }
        this.saveInfo.auth_flag = 'Y'
      }
      console.log('last', this.lastInfo, this.invoiceInfo)
      let vm = this

      // 校验基本信息
      if (this.bpClass_flag) {
        delete this.lastInfo.business_license_num
        delete this.lastInfo.id_card_name
        for (var key in vm.lastInfo) {
          if (!vm.lastInfo[key]) {
            console.log('key', key, vm.bpClass)
            switch (key) {
              case 'bp_type':
                vm.hlsPopup.showLongCenter('客户类型未填写')
                break
              case 'bp_name':
                vm.hlsPopup.showLongCenter('公司名称未填写')
                break
              case 'enterprise_type':
                vm.hlsPopup.showLongCenter('企业类型未填写')
                break
              case 'organization_code':
                vm.hlsPopup.showLongCenter('统一社会信用代码未填写')
                break
              case 'registered_capital':
                vm.hlsPopup.showLongCenter('注册资本未填写')
                break
              case 'legal_person':
                vm.hlsPopup.showLongCenter('法定代表人未填写')
                break
              case 'registered_place':
                vm.hlsPopup.showLongCenter('注册地址未填写')
                break
              case 'business_address':
                vm.hlsPopup.showLongCenter('经营地址未填写')
                break
              case 'phone':
                vm.hlsPopup.showLongCenter('固定电话未填写')
                break
              case 'id_card_no':
                vm.hlsPopup.showLongCenter('身份证未填写')
                break
              case 'cell_phone':
                vm.hlsPopup.showLongCenter('手机号未填写')
                break
              case 'living_address':
                vm.hlsPopup.showLongCenter('居住地址未填写')
                break
              case 'auth_person_name':
                vm.hlsPopup.showLongCenter('授权人姓名未填写')
                break
              case 'auth_person_id_card':
                vm.hlsPopup.showLongCenter('身份证号未填写')
                break
              case 'user_phone':
                vm.hlsPopup.showLongCenter('您还未登录')
                break
              case 'auth_person_position':
                vm.hlsPopup.showLongCenter('公司职务未填写')
                break
              case 'auth_person_matter':
                vm.hlsPopup.showLongCenter('授权事项未填写')
                break
            }
            // vm.hlsPopup.showLongCenter('基本信息不完整！')
            vm.msg_flag = false
            return
          } else {
            vm.msg_flag = true
          }
        }
        this.lastInfo.business_license_num = ''
        this.lastInfo.id_card_name = ''
      } else {
        delete this.lastInfo.agent_username
        delete this.lastInfo.id_card_name
        for (var key1 in vm.lastInfo) {
          if (!vm.lastInfo[key1]) {
            console.log('key', key1)
            debugger
            switch (key1) {
              case 'bp_type':
                vm.hlsPopup.showLongCenter('客户类型未填写')
                break
              case 'bp_name':
                vm.hlsPopup.showLongCenter('公司名称未填写')
                break
              case 'enterprise_type':
                vm.hlsPopup.showLongCenter('企业类型未填写')
                break
              case 'organization_code':
                vm.hlsPopup.showLongCenter('统一社会信用代码未填写')
                break
              case 'registered_capital':
                vm.hlsPopup.showLongCenter('注册资本未填写')
                break
              case 'legal_person':
                vm.hlsPopup.showLongCenter('法定代表人未填写')
                break
              case 'registered_place':
                vm.hlsPopup.showLongCenter('注册地址未填写')
                break
              case 'business_address':
                vm.hlsPopup.showLongCenter('经营地址未填写')
                break
              case 'phone':
                vm.hlsPopup.showLongCenter('固定电话未填写')
                break
              case 'id_card_no':
                vm.hlsPopup.showLongCenter('身份证未填写')
                break
              case 'cell_phone':
                vm.hlsPopup.showLongCenter('手机号未填写')
                break
              case 'living_address':
                vm.hlsPopup.showLongCenter('居住地址未填写')
                break
              case 'auth_person_name':
                vm.hlsPopup.showLongCenter('授权人姓名未填写')
                break
              case 'auth_person_id_card':
                vm.hlsPopup.showLongCenter('身份证号未填写')
                break
              case 'user_phone':
                vm.hlsPopup.showLongCenter('您还未登录')
                break
              case 'auth_person_position':
                vm.hlsPopup.showLongCenter('公司职务未填写')
                break
              case 'auth_person_matter':
                vm.hlsPopup.showLongCenter('授权事项未填写')
                break
            }
            // vm.hlsPopup.showLongCenter('基本信息不完整！')
            vm.msg_flag = false
            return
          } else {
            vm.msg_flag = true
          }
        }
        this.lastInfo.agent_username = ''
        this.lastInfo.id_card_name = ''
      }

      // if (!vm.bp_type_flag) {
      // vm.baseInfo.agent_username = ''
      // vm.saveInfo.agent_username = ''
      // }
      // 校验电话号
      let re = this.hlsUtil.phoneNumber(this.saveInfo.cell_phone)
      if (!re && this.baseInfo.auth_flag === 'N') {
        vm.msg_flag = false
        vm.hlsPopup.showLongCenter('请输入正确手机号')
      }
      // 校验身份证号vm.hlsUtil.isCardID(vm.baseInfo.id_card_no)
      if (vm.flag) {
        if (vm.hlsUtil.isCardID(vm.saveInfo.id_card_no)) {
          vm.msg_flag = false
          vm.hlsPopup.showLongCenter('身份证不正确')
        }
      } else {
        if (vm.hlsUtil.isCardID(vm.saveInfo.auth_person_id_card)) {
          vm.msg_flag = false
          vm.hlsPopup.showLongCenter('身份证不正确')
        }
      }

      if (vm.msg_flag) {
        vm.hlsPopup.showLoading('请稍后')
        let url = $config.basePath + 'bp_org_bind_save'
        let param = {
          master: vm.saveInfo,
        }
        vm.hlsHttp.post(url, param).then(function (res) {
          console.log(res)
          if (res.result === 'S') {
            vm.hlsPopup.hideLoading()
            vm.hlsPopup.showSuccess('保存成功')
            // window.localStorage.setItem('user_id', res.bp_id)
            // window.sessionStorage.setItem('user_id', res.bp_id)
            vm.bp_id = res.bp_id
            vm.getBankInfo()
          }
        })
      }
    },
    hideModal () {
      this.showModalValue = false
    },
    getInfo (i) {
      this.showModalValue = i
    },
    getinvoiceList (val) {
      console.log(val)
      this.invoiceInfo = val
      this.baseInfo.organization_code = val.organization_code
    },
    authorizeChange () {
      this.flag = !this.flag
      if (this.flag) {
        this.auth_flag = '未授权'
      } else {
        this.auth_flag = '已授权'
      }
    },
    selectProvince (e) {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.provinceList,
        code: 'bp_type',
        object: {},
        returnItem: function (index, obj) {
          vm.baseInfo.province_id = obj.bp_type
          vm.baseInfo.province_name = obj.bp_type_n
          vm.getCity()
        },
      })
    },
    selectCity (e) {
      let vm = this
      if (vm.baseInfo.province_id === '') {
        hlsPopup.showLongCenter('请先选择省份')
      }
      vm.hlsPopup.selectList({
        list: vm.cityList,
        code: 'bp_type',
        object: {},
        returnItem: function (index, obj) {
          vm.baseInfo.city_id = obj.bp_type
          vm.baseInfo.city_name = obj.bp_type_n
          vm.getDistrict()
        },
      })
    },
    selectDistrict (e) {
      let vm = this
      if (vm.baseInfo.city_id === '' || vm.baseInfo.province_id === '') {
        hlsPopup.showLongCenter('请先选择城市')
      }
      vm.hlsPopup.selectList({
        list: vm.districtList,
        code: 'bp_type',
        object: {},
        returnItem: function (index, obj) {
          vm.baseInfo.district_id = obj.bp_type
          vm.baseInfo.district_name = obj.bp_type_n
        },
      })
    },
    getProvince () {
      let vm = this
      let url = process.env.basePath + 'fnd_province_query'
      let param = {}
      vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.provinceList = res.lists.map(item => {
            return {
              code: item.province_id,
              code_name: item.province_name,
            }
          })
        }
      })
    },
    getCity () {
      let vm = this
      let url = process.env.basePath + 'fnd_city_query'
      let param = {
        province_id: vm.baseInfo.province_id,
      }
      // vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        // vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.cityList = res.lists.map(item => {
            return {
              code: item.city_id,
              code_name: item.city_name,
            }
          })
        }
      })
    },
    getDistrict () {
      let vm = this
      let url = process.env.basePath + 'fnd_district_query'
      let param = {
        city_id: vm.baseInfo.city_id,
      }
      // vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        // vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.districtList = res.lists.map(item => {
            return {
              code: item.district_id,
              code_name: item.district_name,
            }
          })
        }
      })
    },
    // 客户类型下拉框
    selectIdType (e) {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.typeList,
        code: 'bp_type',
        object: {},
        returnItem: function (index, obj) {
          vm.baseInfo.bp_type = obj.bp_type
          vm.baseInfo.bp_type_n = obj.bp_type_n
          if (
            vm.baseInfo.bp_type === 'TENANT' ||
            vm.baseInfo.bp_type === 'GUTA'
          ) {
            vm.bp_type_flag = true
          }
        },
      })
    },
    getTabNum (i) {
      this.tabNum = i
    },
    fileSuccess (fileList, result) {
      this.fileList = fileList
      this.fileList.forEach((itemFile, index) => {
        if (
          result.response &&
          itemFile.file &&
          !itemFile.attachment_id &&
          result.response.fileName === itemFile.file.name
        ) {
          itemFile.attachment_id = result.response.attachment_id
        }
      })
    },

    //  客户类型请求
    getBpType () {
      let vm = this
      let url = process.env.basePath + 'bp_type_select'
      let param = {}
      vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          console.log('客户类型。。。。。。', res.lists)
          vm.typeList = res.lists
            .filter(item => item.bp_type !== 'OFFICE')
            .map(item => {
              return {
                code: item.bp_type,
                code_name: item.bp_type_n,
              }
            })
          // vm.typeList = res.lists.map(item => {
          //   return {
          //     code: item.bp_type,
          //     code_name: item.bp_type_n,
          //   }
          // })
        }
      })
    },
    getbaseInfo () {
      let vm = this
      let url = process.env.basePath + 'bp_org_info_query'
      let param = {
        bp_id: vm.$route.params.bp_id,
      }
      hlsPopup.showLoading('请稍候')
      vm.$post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          delete res.info.bp_id
          vm.baseInfo = { ...res.info }
          vm.authMsg.auth_person_name = res.info.auth_person_name
          vm.authMsg.auth_person_matter = res.info.auth_person_matter
          vm.authMsg.auth_person_id_card = res.info.auth_person_id_card
          vm.authMsg.auth_person_position = res.info.auth_person_position
          // delete res.info.agent_username
          vm.legal_personMsg.id_card_no = res.info.id_card_no
          // vm.legal_personMsg.legal_person = res.info.legal_person
          vm.legal_personMsg.cell_phone = res.info.cell_phone
          vm.legal_personMsg.living_address = res.info.living_address
          Object.assign(vm.saveInfo, res.info)
        } else {
          hlsPopup.showLongCenter(res.message)
        }
      })
    },

    // ocr识别入口
    ocrShow (ocrType, type) {
      let vm = this
      hlsPopup.showActionSheet({
        titleText: '请选择照片',
        buttonArray: ['拍照', '从相册取'],
        callback: index => {
          if (index === 0) {
            vm.openCamera(ocrType, type)
          } else {
            vm.takePicture(ocrType, type)
          }
        },
      })
    },
    openCamera (ocrType, type) {
      let vm = this
      let cameraoptions = {
        quality: 60,
        width: 1843,
        height: 1382,
      }
      let success = function (imgdata) {
        if (ocrType === 'idCard') {
          type === 'front' ? (vm.idCardFront = imgdata, vm.idCardIdentify(imgdata)) : (vm.idCardBack = imgdata)
        } else if (ocrType === 'bankCard') {
          vm.bankImg = imgdata
          vm.bankCardIdentify(imgdata)
        } else if (ocrType === 'license') {
          vm.licenseImg = imgdata
          vm.licenseIdentify(imgdata)
        }
      }
      let error = function () {
        hlsPopup.showLongCenter(error)
      }
      hlsUtil.openCamera(cameraoptions, success, error)
    },
    takePicture (ocrType, type) {
      let vm = this
      var cameraoptions = {
        quality: 70,
        width: 1843,
        height: 1382,
        maxCount: 1,
      }
      let success = function (imgUrl) {
        if (ocrType === 'idCard') {
          type === 'front'
            ? (vm.idCardFront = imgUrl[0])
            : (vm.idCardBack = imgUrl[0])
          vm.idCardIdentify(imgUrl[0])
        } else if (ocrType === 'bankCard') {
          vm.bankImg = imgUrl[0]
          vm.bankCardIdentify(imgUrl[0])
        } else if (ocrType === 'license') {
          vm.licenseImg = imgUrl[0]
          vm.licenseIdentify(imgUrl[0])
        }
      }
      let error = function () {
        hlsPopup.showLongCenter(error)
      }
      vm.hlsUtil.takePicture(cameraoptions, success, error)
    },
    // 身份证识别
    idCardIdentify (fileUrl) {
      let vm = this
      hlsPopup.showLoading('正在识别')
      let url = process.env.ocrPath + '/baidu/ocr/idCard'
      hlsUtil.baiduOcr(fileUrl, url, function (res) {
        hlsPopup.hideLoading()
        let result = res.result.words_result
        if (vm.flag) {
          // 未授权 姓名，身份证号
          vm.baseInfo.legal_person = result.姓名.words
          vm.legal_personMsg.id_card_no = result.公民身份号码.words
        } else {
          // 已授权  姓名，身份证号
          vm.authMsg.auth_person_name = result.姓名.words
          vm.authMsg.auth_person_id_card = result.公民身份号码.words
        }
      })
    },
    // 银行卡识别
    bankCardIdentify (fileUrl) {
      let vm = this
      hlsPopup.showLoading('正在识别')
      let url = process.env.ocrPath + '/baidu/ocr/bankCard'
      hlsUtil.baiduOcr(fileUrl, url, function (res) {
        hlsPopup.hideLoading()
        let result = res.result.result
        vm.bank_lists.bank_account_num = result.bank_card_number
        vm.bank_lists.bank_full_name = result.bank_name
        vm.bank_lists.bank_card_type = result.bank_card_type
      })
    },
    // 营业执照识别
    licenseIdentify (fileUrl) {
      let vm = this
      hlsPopup.showLoading('正在识别')
      let url = process.env.ocrPath + '/baidu/ocr/businessLicense'
      hlsUtil.baiduOcr(fileUrl, url, function (res) {
        hlsPopup.hideLoading()
        let result = res.result.words_result
        vm.baseInfo.bp_name = result.单位名称.words
        vm.baseInfo.enterprise_type = result.类型.words
        vm.baseInfo.registered_capital = result.注册资本.words
        vm.baseInfo.legal_person = result.法人.words
        vm.baseInfo.registered_place = result.地址.words
        vm.baseInfo.organization_code = result.社会信用代码.words
      })
    },
  },
}
</script>
<style lang='less'>
#base-info {
  font-family: PingFangSC-Regular;

  input::placeholder {
    color: #b4b4b5;
  }
  textarea::placeholder {
    color: #b4b4b5;
  }
  textarea {
    // height: 28px;
    text-align: right;
    // padding-top:16px;
  }
  .header {
    background-color: #00469c;
    color: #fff;

    .h-header-btn {
      img {
        width: 16px;
        height: 16px;
        margin-left: 4px;
      }

      span {
        font-family: PingFangSC-Semibold;
        color: #fff;
        margin-left: 16px;
        font-size: 17px;
        letter-spacing: 0.6px;
        line-height: 24px;
      }
    }
  }

  .content {
    margin-top: 3px;
    height: 76%;

    .font-color {
      color: #656464;
    }

    .martop {
      margin-top: -10px;
    }

    .userInfo {
      height: 40px;
      line-height: 40px;
      background-color: #fafafa;
      color: #00469c;
      font-size: 15px;
      margin-left: 16px;
      position: relative;
    }

    .userInfo::before {
      content: "";
      display: block;
      width: 4px;
      height: 20px;
      background-color: #00469c;
      position: absolute;
      left: -15px;
      top: 10px;
    }

    .types {
      margin-top: 0;
    }

    .authorize {
      width: 100%;
      height: 32px;
      display: flex;
      flex-direction: row;
      align-items: center;
      background: rgba(0, 70, 156, 0.03);

      .authorize-select {
        // width: 48px;
        height: 20px;
        font-family: PingFangSC-Regular;
        font-size: 12px;
        color: #656464;
        line-height: 20px;
        margin-left: 16px;
      }

      .authorize-checklist {
        width: 16px;
        height: 16px;
        margin-left: 8px;

        div {
          width: 100%;
          height: 100%;
          border: 1px solid #00469c;
          border-radius: 3px;
        }
      }
    }

    .upload-id-cards {
      height: 176px;
      background-color: #fff;

      span {
        display: block;
        color: #656464;
        margin-left: 16px;
        padding-top: 16px;
        font-size: 13px;
      }

      .upload-box {
        display: flex;
        justify-content: center;
        margin-top: 15px;

        div {
          width: 172px;
          height: 120px;
          border: 1px dashed #dcdcdd;
          text-align: center;
          font-size: 14px;
          color: #b4b4b5;

          .front,
          .back {
            width: 172px;
            height: 120px;
          }
        }

        div:nth-of-type(2) {
          margin-left: 7px;
        }

        img {
          margin-top: 32px;
          width: 58px;
          height: 45px;
        }

        p {
          margin-top: 12px;
          font-size: 13px;
        }
      }
    }

    .upload-id-card {
      height: 122px;
      background-color: #fff;

      span {
        display: block;
        color: #656464;
        margin-left: 16px;
        padding-top: 16px;
        font-size: 13px;
      }

      .upload-box1 {
        width: 80px;
        height: 80px;
        border: 1px dashed #dcdcdd;
        text-align: center;
        margin-top: 8px;
        margin-left: 16px;

        img {
          margin-top: 30px;
          width: 25px;
          height: 25px;
        }
      }
    }

    .second-part {
      margin-top: 9px;

      .auto {
        color: #b4b4b5;
      }
    }
    .card2 {
      padding-bottom: 8px;
      height: auto;
      background-color: #fff;
      margin-bottom: 10px;

      span {
        color: #656464;
        font-size: 13px;
        line-height: 18px;
        padding-top: 8px;
        display: block;
        margin-left: 16px;
      }

      .img-content {
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-start;
        align-items: center;
      }

      .card-upload {
        width: 80px;
        height: 80px;
        border: 1px dashed #dcdcdd;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 12px;
        margin-left: 16px;
        // float: left;
        img {
          width: 24px;
          height: 24px;
        }
      }
    }
  }

  .put {
    width: 175px;
    height: 45px;
    color: #00469c;
    border-radius: 4px;
    border: 1px solid #00469c;
    background-color: #fafafa;
  }
  .put-approved {
    width: 90%;
    height: 45px;
    color: #fff;
    border-radius: 4px;
    background-color: #00469c;
  }
  .save {
    width: 175px;
    height: 45px;
    color: #fff;
    border-radius: 4px;
    background-color: #00469c;
  }

  .footer-button {
    //height: 88px;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .front,
  .photo,
  .backphoto,
  .back {
    display: none;
  }
  .modal-content {
    width: 100%;
    height: 75%;
    position: absolute;
    top: 25%;
    background-color: #fff;
    overflow-y: scroll;

    .modal-content-add-top {
      width: 320px;
      height: 34px;
      line-height: 34px;
      padding-top: 10px;
      background-color: #fff;
      padding-bottom: 40px;
      position: fixed;
      left: 28px;

      span {
        font-family: PingFangSC-Semibold;
        font-size: 15px;
        color: #00469c;
        letter-spacing: 0.47px;
      }

      img {
        width: 34px;
        height: 34px;
        float: right;
      }
    }

    .addBack {
      display: block;
      width: 320px;
      margin: 0 auto;
      margin-top: 50px;
      border-radius: 6px;
      margin-bottom: 17px;
    }

    .card-Info {
      margin-bottom: 220px;
    }
  }

  .add-card {
    width: 358px;
    height: 40px;
    background: #00469c;
    border-radius: 4px;
    color: #fff;
  }
  .modal {
    background-color: rgba(0, 0, 0, 0) !important;
  }
}
</style>