<template>
  <div class="price-rules">
    <el-form
      ref="ruleFormRef"
      :model="ruleForm"
      :rules="rules"
      label-position="top"
      label-width="150px"
      class="rule-form-orange"
    >
      <el-form-item
        label="利差计算方式"
        prop="accrualMarginCalcMethod"
        class="industry"
      >
        <el-radio-group v-model="ruleForm.accrualMarginCalcMethod" disabled>
          <el-radio :label="0">固定利率</el-radio>
          <el-radio :label="1">固定差额</el-radio>
        </el-radio-group>
      </el-form-item>
      <!-- <el-form-item label="贸易平台报价/年" prop="tradePlatformOffer" v-if="ruleForm.accrualMarginCalcMethod != 1">
        <el-input v-model="ruleForm.tradePlatformOffer" placeholder="请输入贸易平台报价" disabled>
          <template slot="append">%</template>
        </el-input>
      </el-form-item>
      <el-form-item label="保理报价/年" prop="factoringOffer">
        <el-input v-model="ruleForm.factoringOffer" placeholder="请输入保理报价" disabled>
          <template slot="append">%</template>
        </el-input>
      </el-form-item> -->
      <el-form-item label="预估保理融资期限" prop="factoringFinanceDeadline">
        <el-input v-model="ruleForm.factoringFinanceDeadline" placeholder="请输入预估保理融资期限" disabled>
          <template slot="append">天</template>
        </el-input>
      </el-form-item>
      <el-form-item label="月利率" prop="monthlyInterestRate" v-if="ruleForm.accrualMarginCalcMethod != 1">
        <el-input v-model="ruleForm.monthlyInterestRate" placeholder="请输入月利率" disabled>
          <template slot="append">%</template>
        </el-input>
      </el-form-item>
      <el-form-item label="差额" prop="differAmount" v-if="ruleForm.accrualMarginCalcMethod == 1">
        <cy-amount-input
          v-model="ruleForm.differAmount"
          placeholder="请输入差额（元）"
          unit-name="CNY"
          is-unit 
          disabled
        />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  props: {
    info: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      ruleForm: {
        accrualMarginCalcMethod: '',
        // tradePlatformOffer: '',
        // factoringOffer: '',
        factoringFinanceDeadline: '',
        differAmount: '',
        monthlyInterestRate: '',
        id: ''
      },
      rules: {
        accrualMarginCalcMethod: [{ required: true, message: '请选择利差计算方式', trigger: 'change' }],
        // tradePlatformOffer: [{ required: true, message: '请输入贸易平台报价', trigger: 'blur' }],
        // factoringOffer: [{ required: true, message: '请输入保理报价', trigger: 'blur' }],
        factoringFinanceDeadline: [{ required: true, message: '请输入预估保理融资期限', trigger: 'blur' }],
        differAmount: [{ required: true, message: '请输入差额', trigger: 'blur' }],
        monthlyInterestRate: [{ required: true, message: '请输入月利率', trigger: 'blur' }]
      }
    }
  },
  watch: {
    'info.mathId': {
      handler(newV) {
        if (newV) {
          Object.keys(this.ruleForm).forEach(key => {
            this.ruleForm[key] = this.info.purchContractPriceRule[key]
          })
        }
      },
      immediate: true
    }
  }
}
</script>

<style lang="scss" scoped>
.price-rules {
}
</style>
