<template>
  <div class="basic-info">
    <el-form
      :model="ruleForm"
      label-position="top"
      label-width="150px"
      class="rule-form-orange"
    >
      <el-form-item label="企业名称">
        <el-input v-model="ruleForm.name" disabled placeholder="请输入企业名称" />
      </el-form-item>
      <el-form-item label="统一社会信用代码">
        <el-input v-model="ruleForm.socialCreditCode" disabled placeholder="请输入统一社会信用代码" />
      </el-form-item>
      <el-form-item label="风险经理">
        <el-input v-model="ruleForm.riskManager.name" disabled placeholder="请输入风险经理" />
      </el-form-item>
      <el-form-item label="分配日期">
        <el-input v-model="ruleForm.assignDate" disabled placeholder="请输入分配日期" />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  props: {
    detailsInfo: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      ruleForm: {
        id: '',
        name: '',
        socialCreditCode: '',
        riskManager: {
          name: ''
        },
        assignDate: ''
      }
    }
  },
  watch: {
    detailsInfo: {
      handler(newV) {
        if (newV === undefined || !Object.keys(newV).length) return
        const { id, name, socialCreditCode, riskManager, assignDate } = newV
        this.ruleForm = {
          id,
          name,
          socialCreditCode,
          riskManager: {
            name: riskManager.name
          },
          assignDate
        }
      },
      deep: true,
      immediate: true
    }
  }
}
</script>

<style lang="scss" scoped>
.basic-info {

}

</style>
