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
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
<template>
<div class="app-container">
<div slot="header" class="card-title">开票</div>
<!-- 搜索工作栏 -->
<el-form
:model="invoiceData"
ref="queryForm"
size="small"
:inline="true"
label-width="120px"
class="card"
>
<el-card class="card">
<el-form-item label="发票号码:" prop="invoiceNumber" :rules="{ required: true, trigger: ['blur'], message: '发票号码不能为空' }">
<el-input v-model="invoiceData.invoiceNumber"></el-input>
</el-form-item>
<el-form-item label="开票类型:" prop="invoicingTypeId" :rules="{ required: true, trigger: ['blur', 'change'], message: '开票类型不能为空' }">
<dict-selector
:type="DICT_TYPE.ECW_INVOICING_TYPE"
v-model="invoiceData.invoicingTypeId"
/>
</el-form-item>
</el-card>
<el-card class="card">
<div slot="header" class="card-title">开票资料</div>
<el-descriptions title="" direction="vertical" :column="6" border>
<el-descriptions-item label="发票抬头">{{ invoiceData.invoice }}</el-descriptions-item>
<el-descriptions-item label="纳税人识别号">{{ invoiceData.taxpayer }}</el-descriptions-item>
<el-descriptions-item label="地址">{{ invoiceData.addressPhone }}</el-descriptions-item>
<el-descriptions-item label="开户行">{{ invoiceData.accountBank }}</el-descriptions-item>
<el-descriptions-item label="税率%">
<el-form-item label="">
<el-input v-model="invoiceData.taxRate"></el-input>
</el-form-item>
</el-descriptions-item>
<el-descriptions-item label="项目">
<el-form-item label="">
<el-input v-model="invoiceData.projectName"></el-input>
</el-form-item>
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="card">
<el-table
v-loading="loading"
:data="list"
border
class="card"
show-summary
:summary-method="getSummaries"
>
<el-table-column label="订单号" align="center" prop="orderNo" />
<el-table-column label="品名" align="center" prop="titleZh">
<template slot-scope="scope">
{{ scope.row.titleZh || scope.row.titleEn ? scope.row.titleZh + "(" + scope.row.titleEn + ")" : '' }}
</template>
</el-table-column>
<el-table-column label="箱数" align="center" prop="num" />
<el-table-column label="体积/重量" align="center" prop="weight"></el-table-column>
<el-table-column label="收入类型" align="center" prop="feeType">
<template slot-scope="scope">
<dict-tag
:type="DICT_TYPE.FEE_TYPE"
:value="scope.row.feeType"
></dict-tag>
</template>
</el-table-column>
<el-table-column label="单价金额" align="center" prop="unitPrice">
<template slot-scope="scope">
<span>{{ scope.row.unitPrice }}</span>
<dict-tag :type="DICT_TYPE.BOX_SHIPPING_PRICE_UNIT" :value="scope.row.currencyId" />
</template>
</el-table-column>
<el-table-column label="总金额" align="center" prop="totalAmount">
<template slot-scope="scope">
<span>{{ scope.row.totalAmount }}</span>
<dict-tag :type="DICT_TYPE.BOX_SHIPPING_PRICE_UNIT" :value="scope.row.currencyId" />
</template>
</el-table-column>
<el-table-column label="税额" align="center" prop="tax">
<template slot-scope="scope">
<span>{{ scope.row.tax }}</span>
<dict-tag :type="DICT_TYPE.BOX_SHIPPING_PRICE_UNIT" :value="scope.row.currencyId" />
</template>
</el-table-column>
<el-table-column label="价税合计" align="center" prop="taxAndTotalAmount">
<template slot-scope="scope">
<span>{{ scope.row.taxAndTotalAmount }}</span>
<dict-tag :type="DICT_TYPE.BOX_SHIPPING_PRICE_UNIT" :value="scope.row.currencyId" />
</template>
</el-table-column>
</el-table>
</el-card>
<el-descriptions class="card" style="width: 50%">
<el-descriptions-item label="备注">
<el-input
v-model="invoiceData.invoicingRemark"
type="text"
placeholder=""
clearable
></el-input>
</el-descriptions-item>
</el-descriptions>
</el-form>
<div slot="footer" class="card">
<el-button type="primary" @click="submitForm">确定</el-button>
</div>
</div>
</template>
<script>
import { DICT_TYPE } from "@/utils/dict";
import { getReceiptInvoicing, getInvoicingItem, updateReceiptInvoicing } from "@/api/ecw/financial";
import NP from 'number-precision'
export default {
name: "OpenInvoice",
components: {},
data() {
return {
loading: false,
invoiceData: {},
id: 0,
list: []
};
},
created() {
if (this.$route.query.id) {
this.id = this.$route.query.id;
this.getData();
}
},
methods: {
async getData() {
this.loading = true;
await getReceiptInvoicing(this.id).then((res) => {
this.invoiceData = res.data;
this.invoiceData.invoicingTypeId = this.invoiceData.invoicingTypeId || ''
// if (!this.invoiceData.info || this.invoiceData.info.length == 0) {
// this.$modal.msgError("客户开票资料不能为空，请完善客户开票信息");
// }
this.loading = false;
});
getInvoicingItem({ id: this.id }).then(res => {
res.data.map(v => {
v.tax = NP.times(v.totalAmount, this.invoiceData.taxRate/100)
v.taxAndTotalAmount = NP.plus(v.totalAmount, NP.times(v.totalAmount, this.invoiceData.taxRate/100))
})
const t = {
orderNo: '合计',
totalAmount: res.data.reduce((total, curr) => NP.plus(total, curr.totalAmount), 0),
tax: res.data.reduce((total, curr) => NP.plus(total, curr.tax), 0),
taxAndTotalAmount: res.data.reduce((total, curr) => NP.plus(total, curr.taxAndTotalAmount), 0)
}
this.list = [...res.data, t]
})
},
submitForm() {
this.$refs.queryForm.validate(valid => {
if (valid) {
updateReceiptInvoicing(this.invoiceData).then(res => {
this.open = false;
this.$modal.msgSuccess("操作成功");
this.$router.back();
})
}
})
},
getSummaries(param) {
const t = this.list[this.list.length - 1].taxAndTotalAmount
return ['收款人', this.invoiceData.payeeName, '核销人', this.invoiceData.writeOffName, '开票人', this.invoiceData.issuerName, '', '价税合计大写', this.convertCurrency(t)];
},
convertCurrency(money) {
//汉字的数字
var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖');
//基本单位
var cnIntRadice = new Array('', '拾', '佰', '仟');
//对应整数部分扩展单位
var cnIntUnits = new Array('', '万', '亿', '兆');
//对应小数部分单位
var cnDecUnits = new Array('角', '分', '毫', '厘');
//整数金额时后面跟的字符
var cnInteger = '整';
//整型完以后的单位
var cnIntLast = '元';
//最大处理的数字
var maxNum = 999999999999999.9999;
//金额整数部分
var integerNum;
//金额小数部分
var decimalNum;
//输出的中文金额字符串
var chineseStr = '';
//分离金额后用的数组，预定义
var parts;
// 传入的参数为空情况
if(money === '') {
return '';
}
money = parseFloat(money)
if(money >= maxNum){
return ''
}
// 传入的参数为0情况
if (money === 0) {
chineseStr = cnNums[0] + cnIntLast + cnInteger;
return chineseStr
}
// 转为字符串
money = money.toString();
// indexOf 检测某字符在字符串中首次出现的位置 返回索引值（从0 开始） -1 代表无
if (money.indexOf('.') == -1) {
integerNum = money;
decimalNum = ''
}else{
parts = money.split('.');
integerNum = parts[0];
decimalNum = parts[1].substr(0,4);
}
//转换整数部分
if(parseInt(integerNum,10) > 0){
let zeroCount = 0;
let IntLen = integerNum.length
for(let i = 0; i < IntLen; i++){
let n = integerNum.substr(i,1);
let p = IntLen - i - 1;
let q = p / 4;
let m = p % 4;
if( n == '0'){
zeroCount ++ ;
}else{
if(zeroCount > 0){
chineseStr += cnNums[0]
}
zeroCount = 0;
chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
}
if(m == 0 && zeroCount < 4){
chineseStr += cnIntUnits[q];
}
}
// 最后+ 元
chineseStr += cnIntLast;
}
// 转换小数部分
if(decimalNum != ''){
let decLen = decimalNum.length;
for(let i = 0; i <decLen; i++){
let n = decimalNum.substr(i,1);
if(n != '0'){
chineseStr += cnNums[Number(n)] + cnDecUnits[i]
}
}
}
if(chineseStr == ''){
chineseStr += cnNums[0] + cnIntLast + cnInteger;
}else if(decimalNum == ''){
chineseStr += cnInteger;
}
return chineseStr
}
},
};
</script>
<style scoped lang="scss">
.card {
margin-top: 20px;
}
.dialog-footer {
padding: 30px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
height: 160px;
}
.card-title {
font-size: 18px;
font-weight: bold;
}
.lastRow {
border-top: 1px solid #dfe6ec;
display: flex;
width: 100%;
height: 44px;
text-align: center;
align-items: center;
}
.lastRow div {
flex: 1;
height: 44px;
line-height: 44px;
border-right: 1px solid #dfe6ec;
}
::v-deep .el-form-item--small.el-form-item {
margin-bottom: 0;
}
</style>