<template>
  <div class="company-person">
    <cy-comm-table
      ref="commTable"
      style="margin-top: 20px"
      :columns="columns"
      :data="tableData"
    />
    <div class="auditing-box">
      <div>
        <cy-info-title type="center">审核内容</cy-info-title>
      </div>
      <div>
        <cy-info-title type="center">调整内容</cy-info-title>
      </div>
    </div>
    <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-position="top" class="rule-form-orange">
      <el-form-item label="近两年发生过逾期的账户数" prop="numberOfOverdueAccounts" class="one-form-item">
        <el-input v-model="detailsInfo.numberOfOverdueAccounts" disabled placeholder="请输入近两年发生过逾期的账户数" />
      </el-form-item>
      <el-form-item label="近两年发生过逾期的账户数" prop="overdueAccounts" class="one-form-item">
        <el-input v-model="ruleForm.overdueAccounts" placeholder="请输入近两年发生过逾期的账户数" :disabled="disabled" />
      </el-form-item>
      <el-form-item label="近两年发生过逾期的合计金额" prop="totalOverdueAmount" class="one-form-item">
        <el-input v-model="detailsInfo.totalOverdueAmount" disabled placeholder="请输入近两年发生过逾期的合计金额" />
      </el-form-item>
      <el-form-item label="近两年发生过逾期的合计金额" prop="totalOverdueAmountFix" class="one-form-item">
        <el-input v-model="ruleForm.totalOverdueAmountFix" placeholder="请输入近两年发生过逾期的合计金额" :disabled="disabled" />
      </el-form-item>
      <el-form-item label="账户是否发生过90天以上逾期" prop="overdue" class="one-form-item">
        <el-select v-model="detailsInfo.overdue" :disabled="disabled" placeholder="请选择账户是否发生过90天以上逾期">
          <el-option label="是" :value="1"></el-option>
          <el-option label="否" :value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="账户是否发生过90天以上逾期" prop="over90DaysOverdue" class="one-form-item">
        <el-select v-model="ruleForm.over90DaysOverdue" :disabled="disabled" placeholder="请选择账户是否发生过90天以上逾期">
          <el-option label="是" :value="1"></el-option>
          <el-option label="否" :value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="近两年贷款、信用卡连续逾期的月数" prop="consecutiveOverdueMonth" class="one-form-item">
        <el-input v-model="detailsInfo.consecutiveOverdueMonth" disabled placeholder="请输入近两年贷款、信用卡连续逾期的月数" />
      </el-form-item>
      <el-form-item label="近两年贷款、信用卡连续逾期的月数" prop="overdueMonths" class="one-form-item">
        <el-input v-model="ruleForm.overdueMonths" placeholder="请输入近两年贷款、信用卡连续逾期的月数" :disabled="disabled" />
      </el-form-item>
      <el-form-item label="近两年逾期还款记录累计次数" prop="accumulatedOverdueTimes" class="one-form-item">
        <el-input v-model="detailsInfo.accumulatedOverdueTimes" disabled placeholder="请输入近两年逾期还款记录累计次数" />
      </el-form-item>
      <el-form-item label="近两年逾期还款记录累计次数" prop="numberOfOverdueRepayments" class="one-form-item">
        <el-input v-model="ruleForm.numberOfOverdueRepayments" placeholder="请输入近两年逾期还款记录累计次数" :disabled="disabled" />
      </el-form-item>
      <el-form-item label="近半年来贷款审批查询次数" prop="numberOfApprovalQueries" class="one-form-item">
        <el-input v-model="detailsInfo.numberOfApprovalQueries" disabled placeholder="请输入近半年来贷款审批查询次数" />
      </el-form-item>
      <el-form-item label="近半年来贷款审批查询次数" prop="numberOfLoanInquiries" class="one-form-item">
        <el-input v-model="ruleForm.numberOfLoanInquiries" placeholder="请输入近半年来贷款审批查询次数" :disabled="disabled" />
      </el-form-item>
      <el-form-item label="相关还款担保责任金额" prop="amountOfGuaranteeLiability" class="one-form-item">
        <el-input v-model="detailsInfo.amountOfGuaranteeLiability" disabled placeholder="请输入相关还款担保责任金额" />
      </el-form-item>
      <el-form-item label="相关还款担保责任金额" prop="repaymentGuaranteeAmount" class="one-form-item">
        <el-input v-model="ruleForm.repaymentGuaranteeAmount" placeholder="请输入相关还款担保责任金额" :disabled="disabled" />
      </el-form-item>
      <el-form-item label="关注类和不良类贷款记录" prop="badRecords" class="one-form-item">
        <el-select v-model="detailsInfo.badRecords" disabled placeholder="请选择关注类和不良类贷款记录">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="关注类和不良类贷款记录" prop="badRecordsFix" class="one-form-item">
        <el-select v-model="ruleForm.badRecordsFix" placeholder="请选择关注类和不良类贷款记录" :disabled="disabled">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="失信被执行记录" prop="recordOfDishonestyExecution" class="one-form-item">
        <el-select v-model="detailsInfo.recordOfDishonestyExecution" disabled placeholder="请选择失信被执行记录">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="失信被执行记录" prop="recordOfDishonestyExecutionFix" class="one-form-item">
        <el-select v-model="ruleForm.recordOfDishonestyExecutionFix" placeholder="请选择失信被执行记录" :disabled="disabled">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="被执行记录" prop="executedRecord" class="one-form-item">
        <el-select v-model="detailsInfo.executedRecord" disabled placeholder="请选择被执行记录">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="被执行记录" prop="executedRecordFix" class="one-form-item">
        <el-select v-model="ruleForm.executedRecordFix" placeholder="请选择被执行记录" :disabled="disabled">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="限高消费情况（个人）" prop="stCount" class="one-form-item">
        <el-select v-model="detailsInfo.stCount" disabled placeholder="请选择限高消费情况（个人）">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="限高消费情况（个人）" prop="stCountFix" class="one-form-item">
        <el-select v-model="ruleForm.stCountFix" placeholder="请选择限高消费情况（个人）" :disabled="disabled">
          <el-option
            v-for="item in [{ value: 1, label: '有'}, { value: 0, label: '无' }]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item
        label="问题"
        prop="resource"
        style="width: 100%;"
      >
        <el-input v-model="ruleForm.question" type="textarea" placeholder="请输入问题" :disabled="disabled" />
      </el-form-item>
      <el-form-item
        label=" 尽调反馈"
        prop="resource"
        style="width: 100%;"
      >
        <unified-editor :content.sync="ruleForm.feedback" :disabled="disabled" />
        <cy-upload
          ref="fileStorage"
          :upload-params="{}"
          :file-data="fileStorageList"
          :upload-from-orange-status="true"
          placeholder="请上传附件"
          :disabled="disabled"
        />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  components: {
    UnifiedEditor: () => import('@/components/UnifiedEditor/index.vue')
  },
  inject: ['disabled'],
  props: {
    detailsInfo: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      tableData: [],
      columns: [
        {
          label: '序号',
          index: true
        },
        {
          label: '身份类型',
          prop: 'typeStr'
        },
        {
          label: '姓名',
          prop: 'name'
        },
        {
          label: '身份证号码',
          prop: 'socialCreditCode'
        },
        {
          label: '身份证正面',
          prop: 'userTypeName',
          render: (h, row, index) => {
            return <cy-upload
              uploadParams={{ fileType: 'enterprise_idcard_Files' }}
              fileData={row.cardFiles}
              disabled
              defaultDesc='请上传附件'
            />
          }
        },
        {
          label: '征信报告',
          prop: 'creditDetailFiles',
          render: (h, row, index) => {
            return <cy-upload
              uploadParams={{ fileType: 'enterprise_idcard_Files' }}
              fileData={row.creditDetailFiles}
              disabled
              defaultDesc='请上传附件'
            />
          }
        }
      ],
      ruleForm: {
        cCreditInvestigationInfoHistoryId: '',
        overdueAccounts: '',
        totalOverdueAmountFix: '',
        over90DaysOverdue: '',
        overdueMonths: '',
        numberOfOverdueRepayments: '',
        numberOfLoanInquiries: '',
        repaymentGuaranteeAmount: '',
        badRecordsFix: '',
        recordOfDishonestyExecutionFix: '',
        executedRecordFix: '',
        stCountFix: '',
        question: '',
        feedback: '',
        fileIds: []
      },
      fileStorageList: [],
      rules: {
        overdueAccounts: [
          { required: true, message: '请输入近两年发生过逾期的账户数', trigger: 'blur' }
        ],
        totalOverdueAmountFix: [
          { required: true, message: '请输入近两年发生过逾期的合计金额', trigger: 'blur' }
        ],
        over90DaysOverdue: [
          { required: true, message: '请输入账户是否发生过90天以上逾期', trigger: 'blur' }
        ],
        overdueMonths: [
          { required: true, message: '请输入近两年贷款、信用卡连续逾期的月数', trigger: 'blur' }
        ],
        numberOfOverdueRepayments: [
          { required: true, message: '请输入近两年逾期还款记录累计次数', trigger: 'blur' }
        ],
        numberOfLoanInquiries: [
          { required: true, message: '请输入近半年来贷款审批查询次数', trigger: 'blur' }
        ],
        repaymentGuaranteeAmount: [
          { required: true, message: '请输入相关还款担保责任金额', trigger: 'blur' }
        ],
        badRecordsFix: [
          { required: true, message: '请选择关注类和不良类贷款记录', trigger: 'change' }
        ],
        recordOfDishonestyExecutionFix: [
          { required: true, message: '请选择失信被执行记录', trigger: 'change' }
        ],
        executedRecordFix: [
          { required: true, message: '请选择被执行记录', trigger: 'change' }
        ],
        stCountFix: [
          { required: true, message: '请选择限高消费情况（个人）', trigger: 'change' }
        ]
      }
    }
  },
  watch: {
    detailsInfo: {
      handler(newV) {
        const { creditInvestigationInfoHistory, cCreditInvestigationInfoHistoryId, stCount, question, file } = newV
        this.tableData = [creditInvestigationInfoHistory]
        this.ruleForm = newV
        this.ruleForm = {
          ...this.ruleForm,
          stCount,
          question,
          cCreditInvestigationInfoHistoryId
        }
        this.fileStorageList = file || []
      },
      deep: true,
      immediate: true
    }
  },
  methods: {
    getParams(type) {
      return new Promise((resolve, reject) => {
        const fileList = this.$refs.fileStorage.getFileLists
        const params = {
          ...this.ruleForm,
          fileIds: fileList.map(item => item.id)
        }
        if (type === 'temp') {
          resolve(params)
        } else {
          this.$refs.ruleForm.validate(valid => {
            if (valid) {
              resolve(params)
            } else {
              reject()
              return false
            }
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.company-person {
  .auditing-box {
    display: flex;
    justify-content: space-around;
  }
}

</style>
