<template>
  <div class="assignment">
    <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-position="top" class="rule-form-orange">
      <cy-info-title>应收转让</cy-info-title>
      <el-form-item v-if="disabled" label="确认书编号" prop="confirmationNo">
        <el-input v-model="ruleForm.confirmationNo" :disabled="disabled" placeholder="请输入确认书编号" clearable />
      </el-form-item>
      <el-form-item v-if="disabled" label="通知书编号" prop="noticeNo">
        <el-input v-model="ruleForm.noticeNo" :disabled="disabled" placeholder="请输入通知书编号" clearable />
      </el-form-item>
      <el-form-item label="转让方" prop="transferor">
        <el-input v-model="ruleForm.transferor" disabled placeholder="请输入转让方" clearable />
      </el-form-item>
      <el-form-item label="受让方" prop="transferee">
        <el-input v-model="ruleForm.transferee" disabled placeholder="请输入受让方" clearable />
      </el-form-item>
      <el-form-item label="是否确权" prop="confirm">
        <el-radio-group v-model="ruleForm.confirm" :disabled="disabled">
          <el-radio :label="true">是</el-radio>  
          <el-radio :label="false">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="ruleForm.confirm" label="确权方式" prop="receiptConfirm" class="one-form-item">
        <el-checkbox-group v-model="ruleForm.confirmMethodList" :disabled="disabled">
          <el-checkbox label="confirmMethod">回执确认</el-checkbox>
          <el-checkbox label="tripartiteAgreementConfirm">三方协议确认</el-checkbox>
          <el-checkbox label="otherConfirm">其他</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
    </el-form>
    <tripartite-agreement v-if="ruleForm.confirm && ruleForm.confirmMethodList.includes('tripartiteAgreementConfirm')" ref="tripartiteAgreement" :disabled="disabled" :details-info="detailsInfo"></tripartite-agreement>
  </div>

</template>

<script>
export default {
  components: {
    TripartiteAgreement: () => import('./TripartiteAgreement')
  },
  props: {
    disabled: {
      type: Boolean,
      default: false
    },
    detailsInfo: {
      type: Object,
      default: () => {}
    }
  },

  data() {
    return {
      ruleForm: {
        confirmationNo: '',
        noticeNo: '',
        transferor: '',
        transferee: '',
        confirm: '',
        confirmMethodList: []
      },
      rules: {}
    }
  },
  watch: {
    detailsInfo: {
      handler(newV) {
        if (newV === undefined) return
        const { reviewTransferReceivable } = JSON.parse(JSON.stringify(newV))
        this.$set(this, 'ruleForm', {
          ...reviewTransferReceivable,
          confirmMethodList: reviewTransferReceivable?.confirmMethodList || []
        })
      },
      immediate: true,
      deep: true
    }
  },
  methods: {
    getParams() {
      const parmas = {
        reviewTransferReceivable: {  
          ...this.ruleForm
        }
      }
      if (this.ruleForm.confirm && this.ruleForm.confirmMethodList.includes('tripartiteAgreementConfirm')) {
        parmas.reviewBasicContractList = this.$refs.tripartiteAgreement.tableData
      }
      return parmas
    }
  }

}
</script>

<style lang="scss" scoped>

</style>
