vue2server7 7.0.27 → 7.0.29

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.
@@ -1,36 +1,38 @@
1
1
  <template>
2
2
  <div class="date-range" :class="{ 'is-disabled': disabled }">
3
- <el-date-picker
4
- v-model="startVal"
5
- class="date-range__picker"
6
- :class="{ 'is-error': showError }"
7
- :type="pickerType"
8
- :placeholder="startPlaceholder"
9
- :disabled="disabled"
10
- :disabled-date="disabledStartDate"
11
- :value-format="valueFormat"
12
- :format="displayFormat"
13
- clearable
14
- @change="onStartChange"
15
- @focus="onStartFocus"
16
- @blur="onStartBlur"
17
- />
18
- <span class="date-range__separator">{{ separator }}</span>
19
- <el-date-picker
20
- v-model="endVal"
21
- class="date-range__picker"
22
- :class="{ 'is-error': showError }"
23
- :type="pickerType"
24
- :placeholder="endPlaceholder"
25
- :disabled="disabled"
26
- :disabled-date="disabledEndDate"
27
- :value-format="valueFormat"
28
- :format="displayFormat"
29
- clearable
30
- @change="onEndChange"
31
- @focus="onEndFocus"
32
- @blur="onEndBlur"
33
- />
3
+ <div class="date-range__row">
4
+ <el-date-picker
5
+ v-model="startVal"
6
+ class="date-range__picker"
7
+ :class="{ 'is-error': showError }"
8
+ :type="pickerType"
9
+ :placeholder="startPlaceholder"
10
+ :disabled="disabled"
11
+ :disabled-date="disabledStartDate"
12
+ :value-format="valueFormat"
13
+ :format="displayFormat"
14
+ clearable
15
+ @change="onStartChange"
16
+ @focus="onStartFocus"
17
+ @blur="onStartBlur"
18
+ />
19
+ <span class="date-range__separator">{{ separator }}</span>
20
+ <el-date-picker
21
+ v-model="endVal"
22
+ class="date-range__picker"
23
+ :class="{ 'is-error': showError }"
24
+ :type="pickerType"
25
+ :placeholder="endPlaceholder"
26
+ :disabled="disabled"
27
+ :disabled-date="disabledEndDate"
28
+ :value-format="valueFormat"
29
+ :format="displayFormat"
30
+ clearable
31
+ @change="onEndChange"
32
+ @focus="onEndFocus"
33
+ @blur="onEndBlur"
34
+ />
35
+ </div>
34
36
  <span v-if="showError" class="date-range__error">{{ activeErrorMessage }}</span>
35
37
  </div>
36
38
  </template>
@@ -283,20 +285,42 @@ watch(
283
285
  <style scoped>
284
286
  .date-range {
285
287
  display: flex;
288
+ flex-direction: column;
289
+ width: 100%;
290
+ min-width: 0;
291
+ box-sizing: border-box;
292
+ }
293
+
294
+ .date-range__row {
295
+ display: flex;
296
+ flex-direction: row;
297
+ flex-wrap: nowrap;
286
298
  align-items: center;
287
299
  gap: 8px;
288
- flex-wrap: wrap;
300
+ width: 100%;
301
+ min-width: 0;
289
302
  }
290
303
 
291
304
  .date-range__picker {
292
- flex: 1;
305
+ flex: 1 1 0;
293
306
  min-width: 0;
294
307
  }
295
308
 
309
+ /* class 往往挂在 .el-date-editor 根上,用行容器做 :deep 更稳 */
310
+ .date-range__row :deep(.el-date-editor) {
311
+ width: 100%;
312
+ max-width: 100%;
313
+ }
314
+
315
+ .date-range__row :deep(.el-date-editor .el-input__wrapper) {
316
+ width: 100%;
317
+ }
318
+
296
319
  .date-range__separator {
297
320
  color: var(--el-text-color-primary);
298
321
  font-size: 14px;
299
322
  flex-shrink: 0;
323
+ white-space: nowrap;
300
324
  }
301
325
 
302
326
  .date-range.is-disabled .date-range__separator {
@@ -308,10 +332,12 @@ watch(
308
332
  }
309
333
 
310
334
  .date-range__error {
335
+ display: block;
311
336
  width: 100%;
337
+ min-width: 0;
312
338
  color: var(--el-color-danger);
313
339
  font-size: 12px;
314
- line-height: 1;
340
+ line-height: 1.4;
315
341
  padding-top: 4px;
316
342
  }
317
343
  </style>
@@ -1,71 +1,100 @@
1
1
  <template>
2
2
  <section class="page position-report-page">
3
- <h1 class="title">头寸报备信息</h1>
3
+ <header class="page-header">
4
+ <h1 class="title">头寸报备信息</h1>
5
+ <span class="header-badge" aria-hidden="true" />
6
+ </header>
4
7
 
5
8
  <el-form
6
9
  ref="formRef"
7
10
  :model="form"
8
11
  :rules="rules"
9
- label-width="140px"
12
+ label-width="168px"
10
13
  label-suffix=":"
11
14
  class="report-form"
12
15
  >
13
- <!-- 第一行 -->
14
- <el-row :gutter="24">
16
+ <!-- 按截图三列对齐 -->
17
+ <el-row :gutter="20">
15
18
  <el-col :span="8">
16
- <el-form-item label="头寸报备编号" prop="reportNo">
17
- <el-input v-model="form.reportNo" placeholder="系统自动生成" disabled />
19
+ <el-form-item label="头寸报备编号" prop="id">
20
+ <el-input v-model="form.id" placeholder="" clearable :disabled="isReadonlyField('id')" />
18
21
  </el-form-item>
19
22
  </el-col>
20
23
  <el-col :span="8">
21
- <el-form-item label="业务类型" prop="bizType">
22
- <el-input v-model="form.bizType" disabled />
24
+ <el-form-item label="业务类型" prop="forecastType">
25
+ <el-select
26
+ v-model="form.forecastType"
27
+ placeholder="请选择"
28
+ style="width: 100%"
29
+ :disabled="isReadonlyField('forecastType')"
30
+ >
31
+ <el-option
32
+ v-for="o in forecastTypeOptions"
33
+ :key="o.value"
34
+ :label="o.label"
35
+ :value="o.value"
36
+ />
37
+ </el-select>
23
38
  </el-form-item>
24
39
  </el-col>
25
40
  <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>
41
+ <el-form-item label="客户分类" prop="clientType">
42
+ <el-input v-model="clientTypeLabel" disabled />
31
43
  </el-form-item>
32
44
  </el-col>
33
45
  </el-row>
34
46
 
35
- <!-- 第二行 -->
36
- <el-row :gutter="24">
47
+ <el-row :gutter="20">
37
48
  <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="否" />
49
+ <el-form-item label="证件类型" prop="priIdCardType">
50
+ <el-select
51
+ v-model="form.priIdCardType"
52
+ placeholder="请选择"
53
+ style="width: 100%"
54
+ :disabled="isReadonlyField('priIdCardType')"
55
+ >
56
+ <el-option
57
+ v-for="o in priIdCardTypeOptions"
58
+ :key="o.value"
59
+ :label="o.label"
60
+ :value="o.value"
61
+ />
42
62
  </el-select>
43
63
  </el-form-item>
44
64
  </el-col>
45
65
  <el-col :span="8">
46
- <el-form-item label="对公组织架构代码" prop="orgCode">
47
- <el-input v-model="form.orgCode" placeholder="请输入" />
66
+ <el-form-item label="对公组织机构代码" prop="pubOrgCode">
67
+ <el-input v-model="form.pubOrgCode" clearable :disabled="isReadonlyField('pubOrgCode')" />
48
68
  </el-form-item>
49
69
  </el-col>
50
70
  <el-col :span="8">
51
- <el-form-item label="客户名称" prop="customerName">
52
- <el-input v-model="form.customerName" placeholder="请输入" />
71
+ <el-form-item label="客户名称" prop="custName">
72
+ <el-input v-model="form.custName" disabled />
53
73
  </el-form-item>
54
74
  </el-col>
55
75
  </el-row>
56
76
 
57
- <!-- 第三行 -->
58
- <el-row :gutter="24">
77
+ <el-row :gutter="20">
59
78
  <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">
79
+ <el-form-item label="拟付款币种/金额" prop="currency">
80
+ <div class="currency-amt">
81
+ <el-select
82
+ v-model="form.currency"
83
+ placeholder="币种"
84
+ class="currency-amt__cur"
85
+ :disabled="isReadonlyField('currency')"
86
+ >
63
87
  <el-option label="CNY - 人民币" value="CNY" />
64
88
  <el-option label="USD - 美元" value="USD" />
65
89
  <el-option label="EUR - 欧元" value="EUR" />
66
90
  <el-option label="HKD - 港币" value="HKD" />
67
91
  </el-select>
68
- <el-input v-model="form.amount" placeholder="金额" />
92
+ <el-input
93
+ v-model="form.forecastAmt"
94
+ class="currency-amt__amt"
95
+ clearable
96
+ :disabled="isReadonlyField('forecastAmt')"
97
+ />
69
98
  </div>
70
99
  </el-form-item>
71
100
  </el-col>
@@ -78,20 +107,18 @@
78
107
  format="YYYY-MM-DD"
79
108
  value-format="YYYY-MM-DD"
80
109
  style="width: 100%"
110
+ :disabled="isReadonlyField('valueDate')"
81
111
  />
82
112
  </el-form-item>
83
113
  </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>
114
+ <el-col :span="8" class="form-col--spacer">
115
+ <div class="form-col-placeholder" aria-hidden="true" />
88
116
  </el-col>
89
117
  </el-row>
90
118
 
91
- <!-- 第四行 -->
92
- <el-row :gutter="24">
119
+ <el-row :gutter="20">
93
120
  <el-col :span="8">
94
- <el-form-item label="计划汇/收日期" prop="planDate">
121
+ <el-form-item label="计划汇款日期" prop="planDate">
95
122
  <el-date-picker
96
123
  v-model="form.planDate"
97
124
  type="date"
@@ -99,166 +126,339 @@
99
126
  format="YYYY-MM-DD"
100
127
  value-format="YYYY-MM-DD"
101
128
  style="width: 100%"
129
+ :disabled="isReadonlyField('planDate')"
102
130
  />
103
131
  </el-form-item>
104
132
  </el-col>
105
133
  <el-col :span="8">
106
- <el-form-item label="预备日期" prop="prepareDate">
134
+ <el-form-item label="报备日期" prop="bigForDate">
107
135
  <el-date-picker
108
- v-model="form.prepareDate"
136
+ v-model="form.bigForDate"
109
137
  type="date"
110
138
  placeholder="请选择日期"
111
139
  format="YYYY-MM-DD"
112
140
  value-format="YYYY-MM-DD"
113
141
  style="width: 100%"
142
+ :disabled="isReadonlyField('bigForDate')"
114
143
  />
115
144
  </el-form-item>
116
145
  </el-col>
117
146
  <el-col :span="8">
118
- <el-form-item label="报备创号" prop="createNo">
119
- <el-input v-model="form.createNo" placeholder="请输入" />
147
+ <el-form-item label="报备时间" prop="bigForTime">
148
+ <el-input
149
+ v-model="form.bigForTime"
150
+ placeholder="HHmmss"
151
+ clearable
152
+ :disabled="isReadonlyField('bigForTime')"
153
+ />
120
154
  </el-form-item>
121
155
  </el-col>
122
156
  </el-row>
123
157
 
124
- <!-- 第五行 -->
125
- <el-row :gutter="24">
158
+ <el-row :gutter="20">
126
159
  <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="否" />
160
+ <el-form-item label="是否退汇" prop="rtnFlag">
161
+ <el-select
162
+ v-model="form.rtnFlag"
163
+ placeholder="请选择"
164
+ style="width: 100%"
165
+ :disabled="isReadonlyField('rtnFlag')"
166
+ >
167
+ <el-option label="否" value="01" />
168
+ <el-option label="是" value="02" />
131
169
  </el-select>
132
170
  </el-form-item>
133
171
  </el-col>
134
172
  <el-col :span="8">
135
- <el-form-item label="原银行业务编号" prop="origBizNo">
136
- <el-input v-model="form.origBizNo" placeholder="请输入" />
173
+ <el-form-item label="原银行业务编号" prop="oriInnerRefNo">
174
+ <el-input
175
+ v-model="form.oriInnerRefNo"
176
+ maxlength="16"
177
+ show-word-limit
178
+ placeholder="退汇为「是」时必填,16 位"
179
+ clearable
180
+ :disabled="isReadonlyField('oriInnerRefNo')"
181
+ />
137
182
  </el-form-item>
138
183
  </el-col>
139
184
  <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>
185
+ <el-form-item label="账户行" prop="nostro">
186
+ <el-input v-model="form.nostro" clearable :disabled="isReadonlyField('nostro')" />
145
187
  </el-form-item>
146
188
  </el-col>
147
189
  </el-row>
148
190
 
149
- <!-- 第六行 -->
150
- <el-row :gutter="24">
191
+ <el-row :gutter="20">
151
192
  <el-col :span="8">
152
- <el-form-item label="收款银行" prop="receivingBank">
153
- <el-input v-model="form.receivingBank" placeholder="请输入" />
193
+ <el-form-item label="收款银行" prop="swiftCode">
194
+ <el-input
195
+ v-model="form.swiftCode"
196
+ placeholder="最终收款行 SWIFT"
197
+ clearable
198
+ :disabled="isReadonlyField('swiftCode')"
199
+ />
154
200
  </el-form-item>
155
201
  </el-col>
156
202
  <el-col :span="8">
157
- <el-form-item label="收款银行开户行" prop="receivingBankCode">
158
- <el-input v-model="form.receivingBankCode" placeholder="请输入" />
203
+ <el-form-item label="收款银行开户行" prop="pyeAcctBicSCode">
204
+ <el-input
205
+ v-model="form.pyeAcctBicSCode"
206
+ clearable
207
+ :disabled="isReadonlyField('pyeAcctBicSCode')"
208
+ />
159
209
  </el-form-item>
160
210
  </el-col>
161
211
  <el-col :span="8">
162
- <el-form-item label="收款银行开户行名" prop="receivingBankName">
163
- <el-input v-model="form.receivingBankName" placeholder="请输入" />
212
+ <el-form-item label="收款银行开户行名称" prop="pyeAcctBicName">
213
+ <el-input v-model="form.pyeAcctBicName" :disabled="isReadonlyField('pyeAcctBicName')" />
164
214
  </el-form-item>
165
215
  </el-col>
166
216
  </el-row>
167
217
 
168
- <!-- 第七行 -->
169
- <el-row :gutter="24">
218
+ <el-row :gutter="20">
170
219
  <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" />
220
+ <el-form-item label="邮件通知服务产品" prop="mailFlag">
221
+ <el-select
222
+ v-model="form.mailFlag"
223
+ placeholder="请选择"
224
+ style="width: 100%"
225
+ :disabled="isReadonlyField('mailFlag')"
226
+ >
227
+ <el-option label="否" value="0" />
228
+ <el-option label="是" value="1" />
175
229
  </el-select>
176
230
  </el-form-item>
177
231
  </el-col>
178
232
  <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" />
233
+ <el-form-item label="多币种汇款产品" prop="mulCurFlag">
234
+ <el-select
235
+ v-model="form.mulCurFlag"
236
+ placeholder="请选择"
237
+ style="width: 100%"
238
+ :disabled="isReadonlyField('mulCurFlag')"
239
+ >
240
+ <el-option label="否" value="0" />
241
+ <el-option label="是" value="1" />
183
242
  </el-select>
184
243
  </el-form-item>
185
244
  </el-col>
186
245
  <el-col :span="8">
187
246
  <el-form-item label="自贸区标识" prop="ftzFlag">
188
- <el-checkbox v-model="form.ftzFlag" />
247
+ <el-select
248
+ v-model="form.ftzFlag"
249
+ placeholder="请选择"
250
+ style="width: 100%"
251
+ :disabled="isReadonlyField('ftzFlag')"
252
+ >
253
+ <el-option label="否" value="0" />
254
+ <el-option label="是" value="1" />
255
+ </el-select>
189
256
  </el-form-item>
190
257
  </el-col>
191
258
  </el-row>
192
259
 
193
- <!-- 第八行 -->
194
- <el-row :gutter="24">
260
+ <el-row :gutter="20">
195
261
  <el-col :span="8">
196
- <el-form-item label="报备人" prop="reporter">
197
- <el-input v-model="form.reporter" placeholder="请输入" />
262
+ <el-form-item label="报备人" prop="linkMan">
263
+ <el-input v-model="form.linkMan" clearable :disabled="isReadonlyField('linkMan')" />
198
264
  </el-form-item>
199
265
  </el-col>
200
266
  <el-col :span="8">
201
- <el-form-item label="联系电话" prop="phone">
202
- <el-input v-model="form.phone" placeholder="请输入" />
267
+ <el-form-item label="联系电话" prop="linkWay">
268
+ <el-input v-model="form.linkWay" clearable :disabled="isReadonlyField('linkWay')" />
203
269
  </el-form-item>
204
270
  </el-col>
205
271
  <el-col :span="8">
206
- <el-form-item label="报备部门" prop="department">
207
- <el-input v-model="form.department" placeholder="请输入" />
272
+ <el-form-item label="报备机构" prop="orgId">
273
+ <el-select
274
+ v-model="form.orgId"
275
+ filterable
276
+ allow-create
277
+ default-first-option
278
+ placeholder="请选择或输入"
279
+ style="width: 100%"
280
+ :disabled="isReadonlyField('orgId')"
281
+ >
282
+ <el-option label="00301-和平里支行营业部" value="00301" />
283
+ </el-select>
208
284
  </el-form-item>
209
285
  </el-col>
210
286
  </el-row>
211
287
 
212
- <!-- 第九行 -->
213
- <el-row :gutter="24">
214
- <el-col :span="16">
288
+ <el-row :gutter="20">
289
+ <el-col :span="8">
215
290
  <el-form-item label="报备说明" prop="remark">
216
- <el-input v-model="form.remark" type="textarea" :rows="2" placeholder="请输入" />
291
+ <el-input
292
+ v-model="form.remark"
293
+ type="textarea"
294
+ :rows="2"
295
+ placeholder=""
296
+ :disabled="isReadonlyField('remark')"
297
+ />
217
298
  </el-form-item>
218
299
  </el-col>
300
+ <el-col :span="8" class="form-col--spacer">
301
+ <div class="form-col-placeholder" aria-hidden="true" />
302
+ </el-col>
219
303
  <el-col :span="8">
220
- <el-form-item label="登记" prop="register">
221
- <el-input v-model="form.register" placeholder="请输入" />
304
+ <el-form-item label="备注(拒绝原因)" prop="rejectRemark">
305
+ <el-input v-model="form.rejectRemark" clearable :disabled="isReadonlyField('rejectRemark')" />
222
306
  </el-form-item>
223
307
  </el-col>
224
308
  </el-row>
225
309
 
226
- <!-- 第十行 -->
227
- <el-row :gutter="24">
310
+ <el-row :gutter="20">
228
311
  <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="已使用" />
312
+ <el-form-item label="使用状态" prop="isUsedFlg">
313
+ <el-select
314
+ v-model="form.isUsedFlg"
315
+ placeholder="请选择"
316
+ style="width: 100%"
317
+ :disabled="isReadonlyField('isUsedFlg')"
318
+ >
319
+ <el-option label="未使用" value="0" />
320
+ <el-option label="已使用" value="1" />
233
321
  </el-select>
234
322
  </el-form-item>
235
323
  </el-col>
236
324
  <el-col :span="8">
237
- <el-form-item label="当前状态" prop="currentStatus">
238
- <el-input v-model="form.currentStatus" placeholder="请输入" disabled />
325
+ <el-form-item label="当前队列" prop="forecastStatus">
326
+ <el-select
327
+ v-model="form.forecastStatus"
328
+ placeholder="请选择"
329
+ style="width: 100%"
330
+ :disabled="isReadonlyField('forecastStatus')"
331
+ >
332
+ <el-option
333
+ v-for="o in forecastStatusOptions"
334
+ :key="o.value"
335
+ :label="o.label"
336
+ :value="o.value"
337
+ />
338
+ </el-select>
339
+ </el-form-item>
340
+ </el-col>
341
+ <el-col :span="8">
342
+ <el-form-item label="业务渠道" prop="businessChannel">
343
+ <el-input v-model="form.businessChannel" :disabled="isReadonlyField('businessChannel')" />
344
+ </el-form-item>
345
+ </el-col>
346
+ </el-row>
347
+
348
+ <el-divider content-position="left">授权 / 复核及其他</el-divider>
349
+
350
+ <el-row :gutter="20">
351
+ <el-col :span="8">
352
+ <el-form-item label="授权人" prop="author">
353
+ <el-input v-model="form.author" clearable :disabled="isReadonlyField('author')" />
354
+ </el-form-item>
355
+ </el-col>
356
+ <el-col :span="8">
357
+ <el-form-item label="授权日期" prop="authorDate">
358
+ <el-input
359
+ v-model="form.authorDate"
360
+ placeholder="YYYY-MM-DD"
361
+ clearable
362
+ :disabled="isReadonlyField('authorDate')"
363
+ />
364
+ </el-form-item>
365
+ </el-col>
366
+ <el-col :span="8">
367
+ <el-form-item label="授权时间" prop="authorTime">
368
+ <el-input
369
+ v-model="form.authorTime"
370
+ placeholder="HHmmss"
371
+ clearable
372
+ :disabled="isReadonlyField('authorTime')"
373
+ />
374
+ </el-form-item>
375
+ </el-col>
376
+ </el-row>
377
+
378
+ <el-row :gutter="20">
379
+ <el-col :span="8">
380
+ <el-form-item label="复核人" prop="supervisor">
381
+ <el-input v-model="form.supervisor" clearable :disabled="isReadonlyField('supervisor')" />
382
+ </el-form-item>
383
+ </el-col>
384
+ <el-col :span="8">
385
+ <el-form-item label="复核日期" prop="checkDate">
386
+ <el-input
387
+ v-model="form.checkDate"
388
+ placeholder="YYYY-MM-DD"
389
+ clearable
390
+ :disabled="isReadonlyField('checkDate')"
391
+ />
392
+ </el-form-item>
393
+ </el-col>
394
+ <el-col :span="8">
395
+ <el-form-item label="复核时间" prop="checkTime">
396
+ <el-input
397
+ v-model="form.checkTime"
398
+ placeholder="HHmmss"
399
+ clearable
400
+ :disabled="isReadonlyField('checkTime')"
401
+ />
402
+ </el-form-item>
403
+ </el-col>
404
+ </el-row>
405
+
406
+ <el-row :gutter="20">
407
+ <el-col :span="8">
408
+ <el-form-item label="大额授权码" prop="posForecastNo">
409
+ <el-input v-model="form.posForecastNo" clearable :disabled="isReadonlyField('posForecastNo')" />
410
+ </el-form-item>
411
+ </el-col>
412
+ <el-col :span="8">
413
+ <el-form-item label="中间行 SWIFT" prop="interBk">
414
+ <el-input v-model="form.interBk" clearable :disabled="isReadonlyField('interBk')" />
415
+ </el-form-item>
416
+ </el-col>
417
+ <el-col :span="8">
418
+ <el-form-item label="收款人名称" prop="pyeName">
419
+ <el-input v-model="form.pyeName" clearable :disabled="isReadonlyField('pyeName')" />
420
+ </el-form-item>
421
+ </el-col>
422
+ </el-row>
423
+
424
+ <el-row :gutter="20">
425
+ <el-col :span="8">
426
+ <el-form-item label="实际付款金额" prop="usedAmt">
427
+ <el-input v-model="form.usedAmt" clearable :disabled="isReadonlyField('usedAmt')" />
239
428
  </el-form-item>
240
429
  </el-col>
241
430
  <el-col :span="8">
242
- <el-form-item label="业务大区" prop="bizRegion">
243
- <el-input v-model="form.bizRegion" placeholder="请输入" />
431
+ <el-form-item label="可操作标志" prop="isOperateFlag">
432
+ <el-select
433
+ v-model="form.isOperateFlag"
434
+ placeholder="请选择"
435
+ style="width: 100%"
436
+ :disabled="isReadonlyField('isOperateFlag')"
437
+ >
438
+ <el-option label="不可操作" value="0" />
439
+ <el-option label="可以操作" value="1" />
440
+ </el-select>
244
441
  </el-form-item>
245
442
  </el-col>
443
+ <el-col :span="8" class="form-col--spacer">
444
+ <div class="form-col-placeholder" aria-hidden="true" />
445
+ </el-col>
246
446
  </el-row>
247
447
  </el-form>
248
448
 
249
449
  <div class="footer">
250
- <el-button type="danger" @click="onFlowLog">操作流水</el-button>
450
+ <el-button type="danger" plain @click="onFlowLog">操作流水</el-button>
251
451
  <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>
452
+ <el-button type="danger" @click="onPass">通过</el-button>
453
+ <el-button type="danger" plain @click="onReject">驳回</el-button>
454
+ <el-button type="danger" plain @click="onBack">返回</el-button>
255
455
  </div>
256
456
  </div>
257
457
  </section>
258
458
  </template>
259
459
 
260
460
  <script setup lang="ts">
261
- import { reactive, ref } from 'vue'
461
+ import { computed, ref } from 'vue'
262
462
  import { useRouter } from 'vue-router'
263
463
  import { ElMessage } from 'element-plus'
264
464
  import type { FormInstance, FormRules } from 'element-plus'
@@ -266,135 +466,246 @@ import type { FormInstance, FormRules } from 'element-plus'
266
466
  const router = useRouter()
267
467
  const formRef = ref<FormInstance>()
268
468
 
269
- interface ReportForm {
270
- reportNo: string
271
- bizType: string
272
- customerType: string
273
- isGroup: string
274
- orgCode: string
275
- customerName: string
469
+ /** 与接口字典一致的表单模型(均为 string,便于直接提交 JSON) */
470
+ interface PositionForecastForm {
471
+ id: string
472
+ author: string
473
+ authorDate: string
474
+ authorTime: string
475
+ bigForDate: string
476
+ bigForTime: string
477
+ checkDate: string
478
+ checkTime: string
479
+ clientType: string
276
480
  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
481
+ custName: string
295
482
  remark: string
296
- register: string
297
- useStatus: string
298
- currentStatus: string
299
- bizRegion: string
483
+ forecastAmt: string
484
+ forecastStatus: string
485
+ forecastType: string
486
+ interBk: string
487
+ isOperateFlag: string
488
+ isUsedFlg: string
489
+ linkMan: string
490
+ linkWay: string
491
+ mailFlag: string
492
+ mulCurFlag: string
493
+ nostro: string
494
+ orgId: string
495
+ oriInnerRefNo: string
496
+ planDate: string
497
+ posForecastNo: string
498
+ priIdCardType: string
499
+ pubOrgCode: string
500
+ pyeAcctBicName: string
501
+ pyeAcctBicSCode: string
502
+ pyeName: string
503
+ rtnFlag: string
504
+ supervisor: string
505
+ swiftCode: string
506
+ usedAmt: string
507
+ valueDate: string
508
+ /** 界面专用:驳回说明(若后端与 remark 共用,可在提交时合并) */
509
+ rejectRemark: string
510
+ /** 界面专用:自贸区,字典未给码表时 0/1 */
511
+ ftzFlag: string
512
+ businessChannel: string
300
513
  }
301
514
 
302
- const form = reactive<ReportForm>({
303
- reportNo: '',
304
- bizType: '跨境人民币业务(进口)',
305
- customerType: '对公',
306
- isGroup: '',
307
- orgCode: '5903887-5',
308
- customerName: '长期应收长期预收客户(5927)',
515
+ const priIdCardTypeOptions = [
516
+ { value: '0', label: '无证件' },
517
+ { value: '1', label: '居民身份证' },
518
+ { value: '2', label: '户口簿' },
519
+ { value: '3', label: '护照/永久居留证' },
520
+ { value: '4', label: '军人证' },
521
+ { value: '5', label: '港澳台通行证' },
522
+ { value: '6', label: '武警身份证' },
523
+ { value: '7', label: '边民出入境通行证' }
524
+ ]
525
+
526
+ const forecastTypeOptions = [
527
+ { value: '10', label: '跨境人民币直参(客户)' },
528
+ { value: '11', label: '跨境人民币直参(同业)' }
529
+ ]
530
+
531
+ const forecastStatusOptions = [
532
+ { value: '00', label: '已授权' },
533
+ { value: '01', label: '待修改' },
534
+ { value: '02', label: '待授权' },
535
+ { value: '05', label: '已核销' },
536
+ { value: '06', label: '待复核' },
537
+ { value: '07', label: '总行授权' },
538
+ { value: '98', label: '已失效' },
539
+ { value: '99', label: '已删除' }
540
+ ]
541
+
542
+ const clientTypeLabels: Record<string, string> = {
543
+ '01': '对公',
544
+ '02': '对私居民',
545
+ '03': '对私非居民'
546
+ }
547
+
548
+ const form = ref<PositionForecastForm>({
549
+ id: '',
550
+ author: '',
551
+ authorDate: '',
552
+ authorTime: '',
553
+ bigForDate: '2026-03-23',
554
+ bigForTime: '100053',
555
+ checkDate: '',
556
+ checkTime: '',
557
+ clientType: '01',
309
558
  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:利率及外汇业务处',
559
+ custName: '北京广联顺和科技有限公司SFD(脱敏)',
328
560
  remark: '',
329
- register: '登记(后端周四)',
330
- useStatus: '未使用',
331
- currentStatus: '自行撤区',
332
- bizRegion: '报关系统'
561
+ forecastAmt: '200,000,000.00',
562
+ forecastStatus: '07',
563
+ forecastType: '10',
564
+ interBk: '',
565
+ isOperateFlag: '1',
566
+ isUsedFlg: '0',
567
+ linkMan: '0001tx',
568
+ linkWay: '15631312',
569
+ mailFlag: '',
570
+ mulCurFlag: '',
571
+ nostro: 'CIPSCNSHXXX',
572
+ orgId: '00301',
573
+ oriInnerRefNo: '',
574
+ planDate: '2026-03-23',
575
+ posForecastNo: '',
576
+ priIdCardType: '',
577
+ pubOrgCode: '20489952-1',
578
+ pyeAcctBicName: '中国银行股份有限公司',
579
+ pyeAcctBicSCode: 'BKCHCNBJXXX',
580
+ pyeName: '',
581
+ rtnFlag: '01',
582
+ supervisor: '',
583
+ swiftCode: '',
584
+ usedAmt: '',
585
+ valueDate: '',
586
+ rejectRemark: '',
587
+ ftzFlag: '0',
588
+ businessChannel: '柜面系统'
333
589
  })
334
590
 
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' }]
591
+ const clientTypeLabel = computed(
592
+ () => clientTypeLabels[form.value.clientType] ?? form.value.clientType
593
+ )
594
+
595
+ /** 仅以下字段可编辑,其余只读 */
596
+ const EDITABLE_FORM_KEYS = new Set([
597
+ 'valueDate',
598
+ 'nostro',
599
+ 'rejectRemark',
600
+ 'pyeAcctBicName'
601
+ ])
602
+
603
+ function isReadonlyField(prop: string): boolean {
604
+ return !EDITABLE_FORM_KEYS.has(prop)
605
+ }
606
+
607
+ const rules: FormRules<PositionForecastForm> = {
608
+ valueDate: [{ required: true, message: '起息日不能为空', trigger: 'change' }]
343
609
  }
344
610
 
345
611
  function onFlowLog() {
346
- ElMessage.info('查看操作流水')
612
+ ElMessage.info('操作流水(可对接流水查询)')
347
613
  }
348
614
 
349
- function onSubmit() {
615
+ function onPass() {
350
616
  formRef.value?.validate((valid) => {
351
617
  if (!valid) return
352
- ElMessage.success('提交成功')
618
+ ElMessage.success('通过')
353
619
  })
354
620
  }
355
621
 
356
- function onSave() {
357
- ElMessage.success('保存成功')
622
+ function onReject() {
623
+ ElMessage.warning('驳回:可将「备注(拒绝原因)」写入接口后提交')
358
624
  }
359
625
 
360
- function onClose() {
626
+ function onBack() {
361
627
  router.back()
362
628
  }
363
629
  </script>
364
630
 
365
631
  <style scoped>
366
632
  .position-report-page {
367
- padding: 20px;
633
+ padding: 20px 24px 32px;
634
+ background: #fff;
635
+ }
636
+
637
+ .page-header {
638
+ display: flex;
639
+ align-items: center;
640
+ justify-content: space-between;
641
+ margin-bottom: 8px;
642
+ padding-bottom: 12px;
643
+ border-bottom: 1px solid #e4e7ed;
368
644
  }
369
645
 
370
646
  .title {
647
+ margin: 0;
371
648
  font-size: 18px;
372
- margin-bottom: 20px;
373
- padding-bottom: 12px;
374
- border-bottom: 1px solid #ebeef5;
649
+ font-weight: 600;
650
+ color: #303133;
651
+ }
652
+
653
+ .header-badge {
654
+ width: 12px;
655
+ height: 12px;
656
+ border-radius: 50%;
657
+ background: #c00;
658
+ flex-shrink: 0;
375
659
  }
376
660
 
377
661
  .report-form {
378
- max-width: 1400px;
662
+ max-width: 1440px;
663
+ margin-top: 8px;
379
664
  }
380
665
 
381
666
  .report-form :deep(.el-form-item__label) {
382
667
  font-weight: normal;
383
- white-space: nowrap;
668
+ color: #606266;
669
+ }
670
+
671
+ .currency-amt {
672
+ display: flex;
673
+ gap: 8px;
674
+ width: 100%;
675
+ }
676
+
677
+ .currency-amt__cur {
678
+ width: 150px;
679
+ flex-shrink: 0;
680
+ }
681
+
682
+ .currency-amt__amt {
683
+ flex: 1;
684
+ min-width: 0;
685
+ }
686
+
687
+ /* 第三行第三列:空白占位,撑开与同行表单项相近高度 */
688
+ .form-col--spacer {
689
+ min-height: 51px;
690
+ }
691
+
692
+ .form-col-placeholder {
693
+ width: 100%;
694
+ min-height: 32px;
384
695
  }
385
696
 
386
697
  .footer {
387
698
  display: flex;
388
699
  justify-content: space-between;
389
700
  align-items: center;
390
- margin-top: 24px;
701
+ margin-top: 28px;
391
702
  padding-top: 16px;
392
- border-top: 1px solid #ebeef5;
393
- max-width: 1400px;
703
+ border-top: 1px solid #e4e7ed;
704
+ max-width: 1440px;
394
705
  }
395
706
 
396
707
  .footer-right {
397
708
  display: flex;
398
- gap: 8px;
709
+ gap: 10px;
399
710
  }
400
711
  </style>
@@ -51,7 +51,7 @@ export const routes = [
51
51
  name: 'PositionReport',
52
52
  component: PositionReportPage,
53
53
  meta: {
54
- title: '头寸报备',
54
+ title: '头寸报备信息',
55
55
  showInMenu: true
56
56
  }
57
57
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vue2server7",
3
- "version": "7.0.27",
3
+ "version": "7.0.29",
4
4
  "description": "",
5
5
  "scripts": {
6
6
  "dev": "nodemon --watch src --ext ts --exec \"ts-node src/app.ts\"",