repaymentPlanModal.vue
3.62 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<template>
<a-modal title="还款计划试算" :width="800" :centered="true" :visible="visible" @cancel="handleCancel" @ok="handleSubmit" :maskClosable="false" style="top:20px;" class="scope-attachment">
<a-table v-if="type==1" ref="table" size="middle" bordered :columns="columns" :rowKey="record => record.id" :dataSource="dataList" :pagination="false" :loading="loading">
<!-- 字符串超长截取省略号显示-->
<span slot="esContent" slot-scope="text">
<j-ellipsis :value="text" :length="10" />
</span>
</a-table>
<a-table v-else ref="table" size="middle" bordered :columns="columnsfenqi" :rowKey="record => record.id" :dataSource="dataList" :pagination="false" :loading="loading">
<!-- 字符串超长截取省略号显示-->
<span slot="esContent" slot-scope="text">
<j-ellipsis :value="text" :length="10" />
</span>
</a-table>
</a-modal>
</template>
<script>
import moment from 'moment'
export default {
name: 'repaymentPlanModal',
data () {
return {
dataList: [],
loading: false,
visible: false,
type: '', // 1、分期 2、非分期
columns: [
{
title: '期数',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: '计划还款日',
align: 'center',
dataIndex: 'planTime',
customRender: function (t, r, index) {
return t.slice(0, 10)
}
},
{
title: '计划还款本金',
align: 'center',
dataIndex: 'dueMoney'
},
{
title: '计划还款利息',
align: 'center',
dataIndex: 'totalInterest'
},
{
title: '服务费',
align: 'center',
dataIndex: 'totalServiceFee'
},
{
title: '计划还款总金额',
align: 'center',
dataIndex: 'totalMoney'
},
],
columnsfenqi: [
{
title: '期数',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: '计划还款日',
align: 'center',
dataIndex: 'planTime',
customRender: function (t, r, index) {
return t.slice(0, 10)
}
},
{
title: '计划还款本金',
align: 'center',
dataIndex: 'userDuePrincipalMoney'
},
{
title: '计划还款利息',
align: 'center',
dataIndex: 'userPlanInterestMoney'
},
{
title: '服务费',
align: 'center',
dataIndex: 'serviceFee'
},
{
title: '计划还款总金额',
align: 'center',
dataIndex: 'userDueSumMoney'
},
],
dateFormat: 'YYYY-MM-DD',
}
},
created () {
},
methods: {
moment,
edit (record, type) {
console.log(record)
this.type = type
this.visible = true
if (Object.prototype.toString.call(record) === '[object Object]') {
this.dataList = []
this.dataList.push(record)
} else {
this.dataList = record
}
},
handleSubmit () {
this.close()
},
handleCancel () {
this.close()
},
close () {
this.$emit('close')
this.visible = false
},
}
}
</script>
<style>
</style>