<template>
  <div class="base-info">
    <cy-info-title>基础信息</cy-info-title>
    <el-form
      ref="ruleFormRef"
      :model="ruleForm"
      :rules="rules"
      label-position="top"
      label-width="120px"
      class="rule-form-orange"
    >
      <el-form-item label="客户类型" prop="customerType">
        <el-select
          v-model="ruleForm.customerType"
          placeholder="请选择客户类型"
          :disabled="disabled"
        >
          <el-option
            v-for="item in constant.customerTypeList"
            :key="item.code"
            :label="item.name"
            :value="item.code"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="供应商名称" prop="supplierInfoId">
        <el-select
          v-model="ruleForm.supplierInfoId"
          placeholder="请选择供应商名称"
          :disabled="disabled"
          @change="supplierChange"
        >
          <el-option
            v-for="item in supplierList"
            :key="item.id"
            :label="item.enterprise.corporateName"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="统一社会信用代码" prop="socialCreditCode">
        <el-input v-model="ruleForm.socialCreditCode" :disabled="disabled" placeholder="请输入统一社会信用代码" />
      </el-form-item>
      <el-form-item label="资方" prop="refinancingManagementId">
        <el-select
          v-model="ruleForm.refinancingManagementId"
          placeholder="请选择资方"
          :disabled="disabled"
        >
          <el-option
            v-for="item in capitalList"
            :key="item.institutionName"
            :label="item.institutionName"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { getFinancialableSuppiler, queryCapitalList } from '@/api/capitalFinancialManage/index'

export default {
  props: {
    disabled: {
      type: Boolean,
      default: false
    },
    detailsInfo: {
      type: [Object, Array],
      default: () => {}
    }
  },
  data() {
    return {
      customerList: [
        // {
        //   name: '个人',
        //   code: 1
        // },
        {
          name: '企业',
          code: 2
        }
      ],
      supplierList: [], // 供应商列表
      capitalList: [], // 资方列表-默认是苏商银行
      ruleForm: {
        customerType: 0,
        supplierInfoId: '',
        socialCreditCode: '',
        refinancingManagementName: '',
        refinancingManagementId: ''
      },
      rules: {
        customerType: [{ required: true, message: '请选择客户类型', trigger: 'blur' }],
        socialCreditCode: [{ required: true, message: '请输入统一社会信用代码', trigger: 'blur' }],
        refinancingManagementId: [{ required: true, message: '请选择资方', trigger: 'blur' }],
        supplierInfoId: [{ required: true, message: '请选择供应商', trigger: 'blur' }]
      }
    }
  },
  computed: {
    ...mapGetters(['constant'])
  },
  watch: {
    detailsInfo: {
      handler(val) {
        console.log('baseinfo-------')
        console.log(val)
        if (val && Object.keys(val).length) {
          this.ruleForm.customerType = 0
          this.ruleForm.supplierInfoId = val.supplierInfoId
          this.ruleForm.socialCreditCode = val.socialCreditCode
        }
      },
      immediate: true
    }
  },
  mounted() {
    this.getSuppilerList()
    this.getCapticalList()
  },
  methods: {
    // 获取可融资的供应商
    async getSuppilerList() {
      const res = await getFinancialableSuppiler()

      if (res.success) {
        this.supplierList = res.data
      }
    },
    // 获取资方列表
    async getCapticalList() {
      const res = await queryCapitalList({ fastSearch: '江苏苏商银行股份有限公司' })

      if (res.success) {
        this.capitalList = res.rows

        if (this.capitalList.length === 1) {
          this.ruleForm.refinancingManagementName = this.capitalList[0].institutionName
          this.ruleForm.refinancingManagementId = this.capitalList[0].id
        }
      }
    },
    supplierChange(val) {
      const find = this.supplierList.find(el => val === el.id)
      if (find && find.enterprise) {
        this.$emit('enterpriseInfoBack', find.enterprise, find)
        this.ruleForm.socialCreditCode = find.enterprise.socialCreditCode
      }

      this.$emit('supplierCallBack', val)
    },
    getParams(type) {
      return new Promise((resolve, reject) => {
        const params = {
          ...this.ruleForm
        }
        if (type === 'temp') {
          resolve(params)
        } else {
          this.$refs.ruleFormRef.validate((valid) => {
            if (valid) {
              resolve(params)
            } else {
              reject(params)
            }
          })
        }
      })
    }
  }
}
</script>
