<template>
  <div class="physical-account">
    <cy-info-title>基础信息</cy-info-title>
    <el-form
      ref="ruleFormRef"
      :model="ruleForm"
      label-position="top"
      class="rule-form-orange"
    >
      <el-form-item label="客户名称">
        <el-input
          v-model="ruleForm.customerName"
          placeholder="请输入客户名称"
          disabled
        />
      </el-form-item>
      <el-form-item label="账户名称">
        <el-input
          v-model="ruleForm.accountName"
          placeholder="请输入账户名称"
          disabled
        />
      </el-form-item>
      <el-form-item label="账号">
        <el-input
          v-model="ruleForm.accountNumber"
          placeholder="请输入账号"
          disabled
        />
      </el-form-item>
    </el-form>
    <bind-card
      :details-info="detailsInfo"
      :customer-type="customerType"
      :account-name="accountName"
      :account-number="accountNumber"
      :operate-id="operateId"
      :basic-info-id="basicInfoId"
      :responsible="responsible"
    />
    <div class="submit-btn">
      <el-button
        @click="() => {
          $router.go(-1)
        }"
      >取消</el-button>
    </div>
  </div>
</template>
<script>
import { queryMemberDetails } from '@/api/accountCenter/cyAccountManage'

export default {
  name: 'MemberUpdateBindAccount',
  components: {
    BindCard: () => import('./components/BindCard.vue')
  },
  data() {
    return {
      ruleForm: {
        customerName: '',
        accountName: '',
        accountNumber: ''
      },
      detailsInfo: [],
      customerType: '',
      accountName: '', // 登记薄上的账户名称
      accountNumber: '', // 登记薄上的账号
      operateId: '', // 主列表id
      basicInfoId: '', // 客户id
      responsible: '' // 负责人姓名
    }
  },
  mounted() {
    this.queryBindInfo()
  },
  methods: {
    async queryBindInfo() {
      const res = await queryMemberDetails({ id: this.$route.query.id })

      console.log('queryBindInfo----', res)
      const {
        customerName,
        accountName,
        accountNumber,
        bindAccountInfoList,
        customerType,
        responsible
      } = res.data
      if (bindAccountInfoList && bindAccountInfoList.length) {
        this.detailsInfo = bindAccountInfoList
      }

      this.ruleForm.customerName = customerName || ''
      this.ruleForm.accountName = accountName || ''
      this.ruleForm.accountNumber = accountNumber || ''
      this.customerType = customerType
      this.responsible = responsible
      this.accountName = accountName
      this.accountNumber = accountNumber
      this.operateId = res.data.id
      this.basicInfoId = res.data.bocomBasicInfoId
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
