repayMsg.vue 5.36 KB
<template>
  <div>
    <a-card title="还款记录" :bordered="false">
      <div style="text-align:right;font-size:18px;padding-bottom:10px;">还款成功总计(元):{{successRepayTotalMoney}}</div>
      <a-table ref="table" size="middle" bordered :columns="columns" :rowKey="record => record.id" :dataSource="dataList" :pagination="false" :loading="loading" :scroll="{x:1100}" style="padding-bottom:30px;">
        <!-- 字符串超长截取省略号显示-->
        <span slot="esContent" slot-scope="text">
          <j-ellipsis :value="text" :length="10" />
        </span>
        <span slot="action" slot-scope="text, record">
          <a-button
            type="link"
            size="small"
            @click="handleDetailLook(record)"
            icon="search"
            style="font-size: 12px"
            >查看</a-button
          >
        </span>
      </a-table>
    </a-card>
    <repay-msg-detail-modal ref="repayMsgDetailModal"></repay-msg-detail-modal>
  </div>
</template>

<script>
import { getRepaymentRecords, queryRepaymentRecordDetail, repaymentDetail,getRepaymentRecord } from '@/api/makeLoan'
import repayMsgDetailModal from './repayMsgDetailModal';
export default {
  name: 'repayMsg',
  props: {
    billNo: {
      type: String,
      default: null
    },
    userType: {
      type: Number,
      default: null
    }
  },
  components: {
    repayMsgDetailModal
  },
  data () {
    return {
      dbRepayChannel: JSON.parse(sessionStorage.getItem('DB_REPAY_CHANNEL')), // 还款方式
      dbRepayPayStatus: JSON.parse(sessionStorage.getItem('DB_REPAY_PAY_STATUS')), // 还款状态
      dbRepaySource: JSON.parse(sessionStorage.getItem('DB_REPAY_SOURCE')), // 还款类型
      dataList: [],
      successRepayTotalMoney: '', // 还款总金额
      loading: false,
      columns: [
        {
          title: '还款订单号',
          align: 'center',
          dataIndex: 'billNo'
        },
        // {
        //   title: '还款次数',
        //   align: 'center',
        //   dataIndex: 'paymentTime'
        // },
        {
          title: '还款日期',
          align: 'center',
          dataIndex: 'actualTime',
        },
        {
          title: '还款金额',
          align: 'center',
          dataIndex: 'userActualSumMoney'
        },
        {
          title: '还款状态',
          align: 'center',
          dataIndex: 'payStatus',
          customRender: (t, r, index) => {
            for (var i = 0; i < this.dbRepayPayStatus.length; i++) {
              if (t === this.dbRepayPayStatus[i].name) {
                return this.dbRepayPayStatus[i].title
              }
            }
          }
        },
        {
          title: '还款类型',
          align: 'center',
          dataIndex: 'source',
          customRender: (t, r, index) => {
            for (var i = 0; i < this.dbRepaySource.length; i++) {
              if (t === Number(this.dbRepaySource[i].name)) {
                return this.dbRepaySource[i].title
              }
            }
          }
        },
        {
          title: '还款方式',
          align: 'center',
          dataIndex: 'repayChannel',
          customRender: (t, r, index) => {
            for (var i = 0; i < this.dbRepayChannel.length; i++) {
              if (t === Number(this.dbRepayChannel[i].name)) {
                return this.dbRepayChannel[i].title
              }
            }
          }
        },
        {
          title: '还款账号',
          align: 'center',
          dataIndex: 'bindAccountNoView',
        },
        {
          title: '备注',
          align: 'center',
          dataIndex: 'remark'
        },
        {
          title: '操作',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' },
          align: 'center',
          width: 120,
          fixed: 'right'
        }
      ],
    }
  },
  created () {
    console.log(this.userType)
  },
  methods: {
    loadData () {
      let _p = { "billNo": this.billNo }
      getRepaymentRecord(_p).then(res => {
        if (res.status.statusCode == 0) {
          this.successRepayTotalMoney = res.result.successRepayTotalMoney
          this.dataList = res.result.repaymentRecordList
        } else {
          this.$message.warning(res.status.statusReason)
        }
      })
    },
    handleDetailLook (record) {
      console.log(record)
      if (this.userType == 1 || this.userType == 2) { // 个人 企业
        let _p = { "repaymentFlowNo": record.repaymentFlowNo, 'billNo': record.billNo }
        queryRepaymentRecordDetail(_p).then(res => {
          console.log(res)
          if (res.status.statusCode == 0) {
            this.$refs.repayMsgDetailModal.edit(res.result)
            this.$refs.repayMsgDetailModal.disableSubmit = true
          } else {
            this.$message.warning(res.status.statusReason)
          }
        })
      } else if (this.userType == 3) { // 法人
        let _p = { "repaymentFlowNo": record.repaymentFlowNo }
        repaymentDetail(_p).then(res => {
          if (res.status.statusCode == 0) {
            this.$refs.repayMsgDetailModal.edit(res.result)
            this.$refs.repayMsgDetailModal.disableSubmit = true
          } else {
            this.$message.warning(res.status.statusReason)
          }
        })
      }

      this.$refs.repayMsgDetailModal.edit(1)
      this.$refs.repayMsgDetailModal.disableSubmit = true
    }
  }
}
</script>
<style>
</style>