vue2server7 7.0.13 → 7.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -0,0 +1,400 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<section class="page position-report-page">
|
|
3
|
+
<h1 class="title">头寸报备信息</h1>
|
|
4
|
+
|
|
5
|
+
<el-form
|
|
6
|
+
ref="formRef"
|
|
7
|
+
:model="form"
|
|
8
|
+
:rules="rules"
|
|
9
|
+
label-width="140px"
|
|
10
|
+
label-suffix=":"
|
|
11
|
+
class="report-form"
|
|
12
|
+
>
|
|
13
|
+
<!-- 第一行 -->
|
|
14
|
+
<el-row :gutter="24">
|
|
15
|
+
<el-col :span="8">
|
|
16
|
+
<el-form-item label="头寸报备编号" prop="reportNo">
|
|
17
|
+
<el-input v-model="form.reportNo" placeholder="系统自动生成" disabled />
|
|
18
|
+
</el-form-item>
|
|
19
|
+
</el-col>
|
|
20
|
+
<el-col :span="8">
|
|
21
|
+
<el-form-item label="业务类型" prop="bizType">
|
|
22
|
+
<el-input v-model="form.bizType" disabled />
|
|
23
|
+
</el-form-item>
|
|
24
|
+
</el-col>
|
|
25
|
+
<el-col :span="8">
|
|
26
|
+
<el-form-item label="客户分类" prop="customerType">
|
|
27
|
+
<el-select v-model="form.customerType" placeholder="请选择" style="width: 100%">
|
|
28
|
+
<el-option label="对公" value="对公" />
|
|
29
|
+
<el-option label="对私" value="对私" />
|
|
30
|
+
</el-select>
|
|
31
|
+
</el-form-item>
|
|
32
|
+
</el-col>
|
|
33
|
+
</el-row>
|
|
34
|
+
|
|
35
|
+
<!-- 第二行 -->
|
|
36
|
+
<el-row :gutter="24">
|
|
37
|
+
<el-col :span="8">
|
|
38
|
+
<el-form-item label="是否集团" prop="isGroup">
|
|
39
|
+
<el-select v-model="form.isGroup" placeholder="请选择" style="width: 100%">
|
|
40
|
+
<el-option label="是" value="是" />
|
|
41
|
+
<el-option label="否" value="否" />
|
|
42
|
+
</el-select>
|
|
43
|
+
</el-form-item>
|
|
44
|
+
</el-col>
|
|
45
|
+
<el-col :span="8">
|
|
46
|
+
<el-form-item label="对公组织架构代码" prop="orgCode">
|
|
47
|
+
<el-input v-model="form.orgCode" placeholder="请输入" />
|
|
48
|
+
</el-form-item>
|
|
49
|
+
</el-col>
|
|
50
|
+
<el-col :span="8">
|
|
51
|
+
<el-form-item label="客户名称" prop="customerName">
|
|
52
|
+
<el-input v-model="form.customerName" placeholder="请输入" />
|
|
53
|
+
</el-form-item>
|
|
54
|
+
</el-col>
|
|
55
|
+
</el-row>
|
|
56
|
+
|
|
57
|
+
<!-- 第三行 -->
|
|
58
|
+
<el-row :gutter="24">
|
|
59
|
+
<el-col :span="8">
|
|
60
|
+
<el-form-item label="投付款币种金额" prop="currency">
|
|
61
|
+
<div style="display: flex; gap: 8px; width: 100%">
|
|
62
|
+
<el-select v-model="form.currency" placeholder="币种" style="width: 140px; flex-shrink: 0">
|
|
63
|
+
<el-option label="CNY - 人民币" value="CNY" />
|
|
64
|
+
<el-option label="USD - 美元" value="USD" />
|
|
65
|
+
<el-option label="EUR - 欧元" value="EUR" />
|
|
66
|
+
<el-option label="HKD - 港币" value="HKD" />
|
|
67
|
+
</el-select>
|
|
68
|
+
<el-input v-model="form.amount" placeholder="金额" />
|
|
69
|
+
</div>
|
|
70
|
+
</el-form-item>
|
|
71
|
+
</el-col>
|
|
72
|
+
<el-col :span="8">
|
|
73
|
+
<el-form-item label="汇款起息日" prop="valueDate">
|
|
74
|
+
<el-date-picker
|
|
75
|
+
v-model="form.valueDate"
|
|
76
|
+
type="date"
|
|
77
|
+
placeholder="请选择日期"
|
|
78
|
+
format="YYYY-MM-DD"
|
|
79
|
+
value-format="YYYY-MM-DD"
|
|
80
|
+
style="width: 100%"
|
|
81
|
+
/>
|
|
82
|
+
</el-form-item>
|
|
83
|
+
</el-col>
|
|
84
|
+
<el-col :span="8">
|
|
85
|
+
<el-form-item label="账户名称" prop="accountName">
|
|
86
|
+
<el-input v-model="form.accountName" placeholder="请输入" />
|
|
87
|
+
</el-form-item>
|
|
88
|
+
</el-col>
|
|
89
|
+
</el-row>
|
|
90
|
+
|
|
91
|
+
<!-- 第四行 -->
|
|
92
|
+
<el-row :gutter="24">
|
|
93
|
+
<el-col :span="8">
|
|
94
|
+
<el-form-item label="计划汇/收日期" prop="planDate">
|
|
95
|
+
<el-date-picker
|
|
96
|
+
v-model="form.planDate"
|
|
97
|
+
type="date"
|
|
98
|
+
placeholder="请选择日期"
|
|
99
|
+
format="YYYY-MM-DD"
|
|
100
|
+
value-format="YYYY-MM-DD"
|
|
101
|
+
style="width: 100%"
|
|
102
|
+
/>
|
|
103
|
+
</el-form-item>
|
|
104
|
+
</el-col>
|
|
105
|
+
<el-col :span="8">
|
|
106
|
+
<el-form-item label="预备日期" prop="prepareDate">
|
|
107
|
+
<el-date-picker
|
|
108
|
+
v-model="form.prepareDate"
|
|
109
|
+
type="date"
|
|
110
|
+
placeholder="请选择日期"
|
|
111
|
+
format="YYYY-MM-DD"
|
|
112
|
+
value-format="YYYY-MM-DD"
|
|
113
|
+
style="width: 100%"
|
|
114
|
+
/>
|
|
115
|
+
</el-form-item>
|
|
116
|
+
</el-col>
|
|
117
|
+
<el-col :span="8">
|
|
118
|
+
<el-form-item label="报备创号" prop="createNo">
|
|
119
|
+
<el-input v-model="form.createNo" placeholder="请输入" />
|
|
120
|
+
</el-form-item>
|
|
121
|
+
</el-col>
|
|
122
|
+
</el-row>
|
|
123
|
+
|
|
124
|
+
<!-- 第五行 -->
|
|
125
|
+
<el-row :gutter="24">
|
|
126
|
+
<el-col :span="8">
|
|
127
|
+
<el-form-item label="是否议叙" prop="isNegotiate">
|
|
128
|
+
<el-select v-model="form.isNegotiate" placeholder="请选择" style="width: 100%">
|
|
129
|
+
<el-option label="是" value="是" />
|
|
130
|
+
<el-option label="否" value="否" />
|
|
131
|
+
</el-select>
|
|
132
|
+
</el-form-item>
|
|
133
|
+
</el-col>
|
|
134
|
+
<el-col :span="8">
|
|
135
|
+
<el-form-item label="原银行业务编号" prop="origBizNo">
|
|
136
|
+
<el-input v-model="form.origBizNo" placeholder="请输入" />
|
|
137
|
+
</el-form-item>
|
|
138
|
+
</el-col>
|
|
139
|
+
<el-col :span="8">
|
|
140
|
+
<el-form-item label="联户行" prop="linkedBank">
|
|
141
|
+
<el-select v-model="form.linkedBank" placeholder="请选择" filterable style="width: 100%">
|
|
142
|
+
<el-option label="CIPSCNSHXXX" value="CIPSCNSHXXX" />
|
|
143
|
+
<el-option label="BKCHCNBJXXX" value="BKCHCNBJXXX" />
|
|
144
|
+
</el-select>
|
|
145
|
+
</el-form-item>
|
|
146
|
+
</el-col>
|
|
147
|
+
</el-row>
|
|
148
|
+
|
|
149
|
+
<!-- 第六行 -->
|
|
150
|
+
<el-row :gutter="24">
|
|
151
|
+
<el-col :span="8">
|
|
152
|
+
<el-form-item label="收款银行" prop="receivingBank">
|
|
153
|
+
<el-input v-model="form.receivingBank" placeholder="请输入" />
|
|
154
|
+
</el-form-item>
|
|
155
|
+
</el-col>
|
|
156
|
+
<el-col :span="8">
|
|
157
|
+
<el-form-item label="收款银行开户行" prop="receivingBankCode">
|
|
158
|
+
<el-input v-model="form.receivingBankCode" placeholder="请输入" />
|
|
159
|
+
</el-form-item>
|
|
160
|
+
</el-col>
|
|
161
|
+
<el-col :span="8">
|
|
162
|
+
<el-form-item label="收款银行开户行名" prop="receivingBankName">
|
|
163
|
+
<el-input v-model="form.receivingBankName" placeholder="请输入" />
|
|
164
|
+
</el-form-item>
|
|
165
|
+
</el-col>
|
|
166
|
+
</el-row>
|
|
167
|
+
|
|
168
|
+
<!-- 第七行 -->
|
|
169
|
+
<el-row :gutter="24">
|
|
170
|
+
<el-col :span="8">
|
|
171
|
+
<el-form-item label="邮件通知覆盖产品" prop="emailProduct">
|
|
172
|
+
<el-select v-model="form.emailProduct" placeholder="请选择" style="width: 100%">
|
|
173
|
+
<el-option label="产品A" value="A" />
|
|
174
|
+
<el-option label="产品B" value="B" />
|
|
175
|
+
</el-select>
|
|
176
|
+
</el-form-item>
|
|
177
|
+
</el-col>
|
|
178
|
+
<el-col :span="8">
|
|
179
|
+
<el-form-item label="多币种汇款产品" prop="multiCurrencyProduct">
|
|
180
|
+
<el-select v-model="form.multiCurrencyProduct" placeholder="请选择" style="width: 100%">
|
|
181
|
+
<el-option label="产品A" value="A" />
|
|
182
|
+
<el-option label="产品B" value="B" />
|
|
183
|
+
</el-select>
|
|
184
|
+
</el-form-item>
|
|
185
|
+
</el-col>
|
|
186
|
+
<el-col :span="8">
|
|
187
|
+
<el-form-item label="自贸区标识" prop="ftzFlag">
|
|
188
|
+
<el-checkbox v-model="form.ftzFlag" />
|
|
189
|
+
</el-form-item>
|
|
190
|
+
</el-col>
|
|
191
|
+
</el-row>
|
|
192
|
+
|
|
193
|
+
<!-- 第八行 -->
|
|
194
|
+
<el-row :gutter="24">
|
|
195
|
+
<el-col :span="8">
|
|
196
|
+
<el-form-item label="报备人" prop="reporter">
|
|
197
|
+
<el-input v-model="form.reporter" placeholder="请输入" />
|
|
198
|
+
</el-form-item>
|
|
199
|
+
</el-col>
|
|
200
|
+
<el-col :span="8">
|
|
201
|
+
<el-form-item label="联系电话" prop="phone">
|
|
202
|
+
<el-input v-model="form.phone" placeholder="请输入" />
|
|
203
|
+
</el-form-item>
|
|
204
|
+
</el-col>
|
|
205
|
+
<el-col :span="8">
|
|
206
|
+
<el-form-item label="报备部门" prop="department">
|
|
207
|
+
<el-input v-model="form.department" placeholder="请输入" />
|
|
208
|
+
</el-form-item>
|
|
209
|
+
</el-col>
|
|
210
|
+
</el-row>
|
|
211
|
+
|
|
212
|
+
<!-- 第九行 -->
|
|
213
|
+
<el-row :gutter="24">
|
|
214
|
+
<el-col :span="16">
|
|
215
|
+
<el-form-item label="报备说明" prop="remark">
|
|
216
|
+
<el-input v-model="form.remark" type="textarea" :rows="2" placeholder="请输入" />
|
|
217
|
+
</el-form-item>
|
|
218
|
+
</el-col>
|
|
219
|
+
<el-col :span="8">
|
|
220
|
+
<el-form-item label="登记" prop="register">
|
|
221
|
+
<el-input v-model="form.register" placeholder="请输入" />
|
|
222
|
+
</el-form-item>
|
|
223
|
+
</el-col>
|
|
224
|
+
</el-row>
|
|
225
|
+
|
|
226
|
+
<!-- 第十行 -->
|
|
227
|
+
<el-row :gutter="24">
|
|
228
|
+
<el-col :span="8">
|
|
229
|
+
<el-form-item label="使用状态" prop="useStatus">
|
|
230
|
+
<el-select v-model="form.useStatus" placeholder="请选择" style="width: 100%">
|
|
231
|
+
<el-option label="未使用" value="未使用" />
|
|
232
|
+
<el-option label="已使用" value="已使用" />
|
|
233
|
+
</el-select>
|
|
234
|
+
</el-form-item>
|
|
235
|
+
</el-col>
|
|
236
|
+
<el-col :span="8">
|
|
237
|
+
<el-form-item label="当前状态" prop="currentStatus">
|
|
238
|
+
<el-input v-model="form.currentStatus" placeholder="请输入" disabled />
|
|
239
|
+
</el-form-item>
|
|
240
|
+
</el-col>
|
|
241
|
+
<el-col :span="8">
|
|
242
|
+
<el-form-item label="业务大区" prop="bizRegion">
|
|
243
|
+
<el-input v-model="form.bizRegion" placeholder="请输入" />
|
|
244
|
+
</el-form-item>
|
|
245
|
+
</el-col>
|
|
246
|
+
</el-row>
|
|
247
|
+
</el-form>
|
|
248
|
+
|
|
249
|
+
<div class="footer">
|
|
250
|
+
<el-button type="danger" @click="onFlowLog">操作流水</el-button>
|
|
251
|
+
<div class="footer-right">
|
|
252
|
+
<el-button type="danger" @click="onSubmit">提交</el-button>
|
|
253
|
+
<el-button type="danger" @click="onSave">保存</el-button>
|
|
254
|
+
<el-button type="danger" @click="onClose">关闭</el-button>
|
|
255
|
+
</div>
|
|
256
|
+
</div>
|
|
257
|
+
</section>
|
|
258
|
+
</template>
|
|
259
|
+
|
|
260
|
+
<script setup lang="ts">
|
|
261
|
+
import { reactive, ref } from 'vue'
|
|
262
|
+
import { useRouter } from 'vue-router'
|
|
263
|
+
import { ElMessage } from 'element-plus'
|
|
264
|
+
import type { FormInstance, FormRules } from 'element-plus'
|
|
265
|
+
|
|
266
|
+
const router = useRouter()
|
|
267
|
+
const formRef = ref<FormInstance>()
|
|
268
|
+
|
|
269
|
+
interface ReportForm {
|
|
270
|
+
reportNo: string
|
|
271
|
+
bizType: string
|
|
272
|
+
customerType: string
|
|
273
|
+
isGroup: string
|
|
274
|
+
orgCode: string
|
|
275
|
+
customerName: string
|
|
276
|
+
currency: string
|
|
277
|
+
amount: string
|
|
278
|
+
valueDate: string
|
|
279
|
+
accountName: string
|
|
280
|
+
planDate: string
|
|
281
|
+
prepareDate: string
|
|
282
|
+
createNo: string
|
|
283
|
+
isNegotiate: string
|
|
284
|
+
origBizNo: string
|
|
285
|
+
linkedBank: string
|
|
286
|
+
receivingBank: string
|
|
287
|
+
receivingBankCode: string
|
|
288
|
+
receivingBankName: string
|
|
289
|
+
emailProduct: string
|
|
290
|
+
multiCurrencyProduct: string
|
|
291
|
+
ftzFlag: boolean
|
|
292
|
+
reporter: string
|
|
293
|
+
phone: string
|
|
294
|
+
department: string
|
|
295
|
+
remark: string
|
|
296
|
+
register: string
|
|
297
|
+
useStatus: string
|
|
298
|
+
currentStatus: string
|
|
299
|
+
bizRegion: string
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
const form = reactive<ReportForm>({
|
|
303
|
+
reportNo: '',
|
|
304
|
+
bizType: '跨境人民币业务(进口)',
|
|
305
|
+
customerType: '对公',
|
|
306
|
+
isGroup: '',
|
|
307
|
+
orgCode: '5903887-5',
|
|
308
|
+
customerName: '长期应收长期预收客户(5927)',
|
|
309
|
+
currency: 'CNY',
|
|
310
|
+
amount: '100,000,000.00',
|
|
311
|
+
valueDate: '',
|
|
312
|
+
accountName: '',
|
|
313
|
+
planDate: '2026-03-23',
|
|
314
|
+
prepareDate: '2026-03-23',
|
|
315
|
+
createNo: '183423',
|
|
316
|
+
isNegotiate: '否',
|
|
317
|
+
origBizNo: '',
|
|
318
|
+
linkedBank: 'CIPSCNSHXXX',
|
|
319
|
+
receivingBank: '',
|
|
320
|
+
receivingBankCode: 'BKCHCNBJXXX',
|
|
321
|
+
receivingBankName: '中国银行国际金融有限公司',
|
|
322
|
+
emailProduct: '',
|
|
323
|
+
multiCurrencyProduct: '',
|
|
324
|
+
ftzFlag: false,
|
|
325
|
+
reporter: '0601bx',
|
|
326
|
+
phone: '13051636/66',
|
|
327
|
+
department: 'HGS1:利率及外汇业务处',
|
|
328
|
+
remark: '',
|
|
329
|
+
register: '登记(后端周四)',
|
|
330
|
+
useStatus: '未使用',
|
|
331
|
+
currentStatus: '自行撤区',
|
|
332
|
+
bizRegion: '报关系统'
|
|
333
|
+
})
|
|
334
|
+
|
|
335
|
+
const rules: FormRules<ReportForm> = {
|
|
336
|
+
customerType: [{ required: true, message: '请选择客户分类', trigger: 'change' }],
|
|
337
|
+
orgCode: [{ required: true, message: '请输入对公组织架构代码', trigger: 'blur' }],
|
|
338
|
+
customerName: [{ required: true, message: '请输入客户名称', trigger: 'blur' }],
|
|
339
|
+
currency: [{ required: true, message: '请选择币种', trigger: 'change' }],
|
|
340
|
+
planDate: [{ required: true, message: '请选择计划日期', trigger: 'change' }],
|
|
341
|
+
reporter: [{ required: true, message: '请输入报备人', trigger: 'blur' }],
|
|
342
|
+
phone: [{ required: true, message: '请输入联系电话', trigger: 'blur' }]
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
function onFlowLog() {
|
|
346
|
+
ElMessage.info('查看操作流水')
|
|
347
|
+
}
|
|
348
|
+
|
|
349
|
+
function onSubmit() {
|
|
350
|
+
formRef.value?.validate((valid) => {
|
|
351
|
+
if (!valid) return
|
|
352
|
+
ElMessage.success('提交成功')
|
|
353
|
+
})
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
function onSave() {
|
|
357
|
+
ElMessage.success('保存成功')
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
function onClose() {
|
|
361
|
+
router.back()
|
|
362
|
+
}
|
|
363
|
+
</script>
|
|
364
|
+
|
|
365
|
+
<style scoped>
|
|
366
|
+
.position-report-page {
|
|
367
|
+
padding: 20px;
|
|
368
|
+
}
|
|
369
|
+
|
|
370
|
+
.title {
|
|
371
|
+
font-size: 18px;
|
|
372
|
+
margin-bottom: 20px;
|
|
373
|
+
padding-bottom: 12px;
|
|
374
|
+
border-bottom: 1px solid #ebeef5;
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
.report-form {
|
|
378
|
+
max-width: 1400px;
|
|
379
|
+
}
|
|
380
|
+
|
|
381
|
+
.report-form :deep(.el-form-item__label) {
|
|
382
|
+
font-weight: normal;
|
|
383
|
+
white-space: nowrap;
|
|
384
|
+
}
|
|
385
|
+
|
|
386
|
+
.footer {
|
|
387
|
+
display: flex;
|
|
388
|
+
justify-content: space-between;
|
|
389
|
+
align-items: center;
|
|
390
|
+
margin-top: 24px;
|
|
391
|
+
padding-top: 16px;
|
|
392
|
+
border-top: 1px solid #ebeef5;
|
|
393
|
+
max-width: 1400px;
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
.footer-right {
|
|
397
|
+
display: flex;
|
|
398
|
+
gap: 8px;
|
|
399
|
+
}
|
|
400
|
+
</style>
|
|
@@ -2,6 +2,7 @@ import TablePage from '../pages/TablePage.vue'
|
|
|
2
2
|
import CascaderPage from '../pages/CascaderPage.vue'
|
|
3
3
|
import ExportExcelPage from '../pages/ExportExcelPage.vue'
|
|
4
4
|
import ImportTablePage from '../pages/ImportTablePage.vue'
|
|
5
|
+
import PositionReportPage from '../pages/PositionReportPage.vue'
|
|
5
6
|
|
|
6
7
|
export const routes = [
|
|
7
8
|
{
|
|
@@ -43,5 +44,14 @@ export const routes = [
|
|
|
43
44
|
title: '导入表格',
|
|
44
45
|
showInMenu: true
|
|
45
46
|
}
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
path: '/position-report',
|
|
50
|
+
name: 'PositionReport',
|
|
51
|
+
component: PositionReportPage,
|
|
52
|
+
meta: {
|
|
53
|
+
title: '头寸报备',
|
|
54
|
+
showInMenu: true
|
|
55
|
+
}
|
|
46
56
|
}
|
|
47
57
|
]
|