Fedex / EcomWeb

Go to a project
Toggle navigation Toggle navigation pinning
zihan.wu
75051215 1 parent c3e05d99

feat(customerConfig): 重构客户配置对话框 

- 重新设计了客户配置对话框的布局和逻辑
- 新增了口岸选择功能
- 优化了表单验证和数据处理流程
- 改进了文件上传和证书管理
- 统一了样式和组件使用
Inline Side-by-side
Showing 3 changed files with 303 additions and 225 deletions
...@@ -24,7 +24,7 @@ router.beforeEach((to, from, next) => { ...@@ -24,7 +24,7 @@ router.beforeEach((to, from, next) => {
24 store.dispatch('GetInfo').then((res) => { 24 store.dispatch('GetInfo').then((res) => {
25 // if (res.success) { 25 // if (res.success) {
26 store.dispatch('GenerateRoutes').then(accessRoutes => { 26 store.dispatch('GenerateRoutes').then(accessRoutes => {
27 - store.dispatch("GetDict", ['DECLARE_F_FLAG', 'MEASUREMENT_UNIT','TEMPLATE_TYPE','PACKAGE_TYPE_CODE', 'RECEIPT_STATUS', 'DECLARE_APPTYPE', 'CURRENCY','COUNTRY_REGION_CODE', 'DECLARE_STATISTICS_FLAG', 'ORDER_DECLARATION_PARTY','APP_STATUS','METHOD_OF_SIGNATURE']); 27 + store.dispatch("GetDict", ['DECLARE_F_FLAG', 'MEASUREMENT_UNIT','TEMPLATE_TYPE','PACKAGE_TYPE_CODE', 'RECEIPT_STATUS', 'DECLARE_APPTYPE', 'CURRENCY','COUNTRY_REGION_CODE', 'DECLARE_STATISTICS_FLAG', 'ORDER_DECLARATION_PARTY','APP_STATUS','METHOD_OF_SIGNATURE','METHOD_OF_SIGNATURE']);
28 // 根据roles权限生成可访问的路由表 28 // 根据roles权限生成可访问的路由表
29 router.addRoutes(accessRoutes) // 动态添加可访问路由表 29 router.addRoutes(accessRoutes) // 动态添加可访问路由表
30 next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 30 next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
......
...@@ -85,13 +85,35 @@ ...@@ -85,13 +85,35 @@
85 </el-select> 85 </el-select>
86 </Formitem> 86 </Formitem>
87 </el-col> 87 </el-col>
88 + <!-- 口岸选择-->
89 + <el-col :span="8" v-if="formData.orderRequester === '2'">
90 + <Formitem label="申报地区" prop="choosePortCode" type="edit">
91 + <el-select
92 + type="text"
93 + id="inputInner-edit-choosePortCode"
94 + v-model="choosePortCode"
95 + clearable
96 + multiple
97 + maxlength="4"
98 + placeholder=""
99 + >
100 + <el-option
101 + v-for="(item, index) in portCodeList"
102 + :key="index"
103 + :label="item"
104 + :value="item"
105 + ></el-option>
106 + </el-select>
107 + </Formitem>
108 + </el-col>
88 </el-row> 109 </el-row>
89 - <div v-if="formData.orderRequester=='2'"> 110 + <div v-if="choosePortCode.includes('TAO')">
90 - <div class="checkTitle"> 111 + <div class="dlTitle">
91 - <el-checkbox v-model="formData.qdCheck" @change="changeQDCheckBox()"></el-checkbox>青岛 112 + <!-- <el-checkbox v-model="formData.qdCheck" @change="changeQDCheckBox()"></el-checkbox>-->
113 + 青岛
92 </div> 114 </div>
93 <el-row :gutter="5"> 115 <el-row :gutter="5">
94 -<!-- <div v-if="isCipherMachine">--> 116 + <!-- <div v-if="isCipherMachine">-->
95 <!-- 公服DXPID --> 117 <!-- 公服DXPID -->
96 <el-col :span="8"> 118 <el-col :span="8">
97 <Formitem label="公服DXPID" prop="qingdaoUserDxpid" type="edit"> 119 <Formitem label="公服DXPID" prop="qingdaoUserDxpid" type="edit">
...@@ -100,10 +122,9 @@ ...@@ -100,10 +122,9 @@
100 class="inputShadow" 122 class="inputShadow"
101 id="inputInner-edit-qingdaoUserDxpid" 123 id="inputInner-edit-qingdaoUserDxpid"
102 resize="none" 124 resize="none"
103 - v-model="formData.qingdaoUserDxpid" 125 + v-model="portConfig.TAO.dxpId"
104 clearable 126 clearable
105 placeholder="" 127 placeholder=""
106 - :disabled="!formData.qdCheck"
107 ></el-input> 128 ></el-input>
108 </Formitem> 129 </Formitem>
109 </el-col> 130 </el-col>
...@@ -115,10 +136,9 @@ ...@@ -115,10 +136,9 @@
115 class="inputShadow" 136 class="inputShadow"
116 id="inputInner-edit-qingdaoUserId" 137 id="inputInner-edit-qingdaoUserId"
117 resize="none" 138 resize="none"
118 - v-model="formData.qingdaoUserId" 139 + v-model="portConfig.TAO.userId"
119 clearable 140 clearable
120 placeholder="" 141 placeholder=""
121 - :disabled="!formData.qdCheck"
122 ></el-input> 142 ></el-input>
123 </Formitem> 143 </Formitem>
124 </el-col> 144 </el-col>
...@@ -130,14 +150,13 @@ ...@@ -130,14 +150,13 @@
130 class="inputShadow" 150 class="inputShadow"
131 id="inputInner-edit-qingdaoKey" 151 id="inputInner-edit-qingdaoKey"
132 resize="none" 152 resize="none"
133 - v-model="formData.qingdaoKey" 153 + v-model="portConfig.TAO.key"
134 clearable 154 clearable
135 placeholder="" 155 placeholder=""
136 - :disabled="!formData.qdCheck"
137 ></el-input> 156 ></el-input>
138 </Formitem> 157 </Formitem>
139 </el-col> 158 </el-col>
140 -<!-- </div>--> 159 + <!-- </div>-->
141 <el-col :span="8"> 160 <el-col :span="8">
142 <Formitem label="山电DXPID" prop="qingdaoDanyiUserDxpid" type="edit"> 161 <Formitem label="山电DXPID" prop="qingdaoDanyiUserDxpid" type="edit">
143 <el-input 162 <el-input
...@@ -145,10 +164,9 @@ ...@@ -145,10 +164,9 @@
145 class="inputShadow" 164 class="inputShadow"
146 id="inputInner-edit-qingdaoDanyiUserDxpid" 165 id="inputInner-edit-qingdaoDanyiUserDxpid"
147 resize="none" 166 resize="none"
148 - v-model="formData.qingdaoDanyiUserDxpid" 167 + v-model="portConfig.TAO.danyiDxpId"
149 clearable 168 clearable
150 placeholder="" 169 placeholder=""
151 - :disabled="!formData.qdCheck"
152 ></el-input> 170 ></el-input>
153 </Formitem> 171 </Formitem>
154 </el-col> 172 </el-col>
...@@ -159,10 +177,9 @@ ...@@ -159,10 +177,9 @@
159 class="inputShadow" 177 class="inputShadow"
160 id="inputInner-edit-qingdaoUserName" 178 id="inputInner-edit-qingdaoUserName"
161 resize="none" 179 resize="none"
162 - v-model="formData.qingdaoUserName" 180 + v-model="portConfig.TAO.userName"
163 clearable 181 clearable
164 placeholder="" 182 placeholder=""
165 - :disabled="!formData.qdCheck"
166 ></el-input> 183 ></el-input>
167 </Formitem> 184 </Formitem>
168 </el-col> 185 </el-col>
...@@ -173,10 +190,9 @@ ...@@ -173,10 +190,9 @@
173 class="inputShadow" 190 class="inputShadow"
174 id="inputInner-edit-qingdaoUserPassword" 191 id="inputInner-edit-qingdaoUserPassword"
175 resize="none" 192 resize="none"
176 - v-model="formData.qingdaoUserPassword" 193 + v-model="portConfig.TAO.password"
177 clearable 194 clearable
178 placeholder="" 195 placeholder=""
179 - :disabled="!formData.qdCheck"
180 ></el-input> 196 ></el-input>
181 </Formitem> 197 </Formitem>
182 </el-col> 198 </el-col>
...@@ -198,26 +214,21 @@ ...@@ -198,26 +214,21 @@
198 :auto-upload="true" 214 :auto-upload="true"
199 :show-file-list="false" 215 :show-file-list="false"
200 :data="{}" 216 :data="{}"
201 - :before-upload="qingdaoBeforeUpload"
202 - :on-remove="qingdaoHandleRemove"
203 - :on-success="qingdaoHandleSuccess"
204 - :on-change="qingdaoFileChange"
205 :file-list="qingdaoFileList" 217 :file-list="qingdaoFileList"
206 - @clearFiles="clearqingdaoFile"
207 > 218 >
208 </el-upload> 219 </el-upload>
209 </div> 220 </div>
210 - <div class="fileList" v-if="formData.qingdaoFile != null || formData.qingdaoCertificatePath"> 221 + <div class="fileList" v-if="portConfig.TAO.certificateBase64 != '' || portConfig.TAO.certificateName">
211 <div class="fileList-item"> 222 <div class="fileList-item">
212 - <div class="uploadbox-fileName" > 223 + <div class="uploadbox-fileName">
213 <svg-icon 224 <svg-icon
214 class="el-icon-user-solid" 225 class="el-icon-user-solid"
215 icon-class="exl" 226 icon-class="exl"
216 style="font-size: 18px; color: #de002e" 227 style="font-size: 18px; color: #de002e"
217 /> 228 />
218 <Tooltip 229 <Tooltip
219 - :content="formData.qingdaoFile ? formData.qingdaoFile.name : formData.qingdaoCertificatePath.split('/').pop()" 230 + :content="portConfig.TAO.certificateName"
220 - :refName="formData.qingdaoFile ? formData.qingdaoFile.name : formData.qingdaoCertificatePath.split('/').pop()" 231 + :refName="portConfig.TAO.certificateName"
221 /> 232 />
222 </div> 233 </div>
223 <div class="uploadbox-option"> 234 <div class="uploadbox-option">
...@@ -227,37 +238,61 @@ ...@@ -227,37 +238,61 @@
227 > 238 >
228 <el-button slot="reference" type="text">{{ 239 <el-button slot="reference" type="text">{{
229 $t("entry.upload.del") 240 $t("entry.upload.del")
230 - }}</el-button> 241 + }}
242 + </el-button>
231 </el-popconfirm> 243 </el-popconfirm>
232 </div> 244 </div>
233 </div> 245 </div>
234 </div> 246 </div>
235 </div> 247 </div>
236 </el-col> 248 </el-col>
249 + <!-- 加签方式 -->
250 + <el-col :span="8">
251 + <Formitem label="加签方式" prop="methodOfSignature" type="edit">
252 + <el-select
253 + type="text"
254 + id="inputInner-edit-methodOfSignature"
255 + v-model="portConfig.TAO.methodOfSignature"
256 + clearable
257 + maxlength="4"
258 + placeholder=""
259 + >
260 + <el-option
261 + v-for="(item, index) in $store.getters.dict.METHOD_OF_SIGNATURE"
262 + :key="index"
263 + :label="item.itemChineseName"
264 + :value="item.itemValue"
265 + ></el-option>
266 + </el-select>
267 + </Formitem>
268 + </el-col>
237 <!-- 加密方式 --> 269 <!-- 加密方式 -->
238 -<!-- <el-col :span="8">--> 270 + <!-- <el-col :span="8">-->
239 -<!-- <Formitem label="加密方式" prop="methodOfSignature" type="edit">--> 271 + <!-- <Formitem label="加密方式" prop="methodOfSignature" type="edit">-->
240 -<!-- <el-select--> 272 + <!-- <el-select-->
241 -<!-- type="text"--> 273 + <!-- type="text"-->
242 -<!-- id="inputInner-edit-methodOfSignature"--> 274 + <!-- id="inputInner-edit-methodOfSignature"-->
243 -<!-- v-model="formData.methodOfSignature"--> 275 + <!-- v-model="formData.methodOfSignature"-->
244 -<!-- clearable--> 276 + <!-- clearable-->
245 -<!-- maxlength="4"--> 277 + <!-- maxlength="4"-->
246 -<!-- :disabled="!formData.qdCheck"--> 278 + <!-- :disabled="!formData.qdCheck"-->
247 -<!-- placeholder=""--> 279 + <!-- placeholder=""-->
248 -<!-- >--> 280 + <!-- >-->
249 -<!-- <el-option--> 281 + <!-- <el-option-->
250 -<!-- v-for="(item, index) in $store.getters.dict.METHOD_OF_SIGNATURE"--> 282 + <!-- v-for="(item, index) in $store.getters.dict.METHOD_OF_SIGNATURE"-->
251 -<!-- :key="index"--> 283 + <!-- :key="index"-->
252 -<!-- :label="item.itemChineseName"--> 284 + <!-- :label="item.itemChineseName"-->
253 -<!-- :value="item.itemValue"--> 285 + <!-- :value="item.itemValue"-->
254 -<!-- ></el-option>--> 286 + <!-- ></el-option>-->
255 -<!-- </el-select>--> 287 + <!-- </el-select>-->
256 -<!-- </Formitem>--> 288 + <!-- </Formitem>-->
257 -<!-- </el-col>--> 289 + <!-- </el-col>-->
258 </el-row> 290 </el-row>
259 - <div class="checkTitle"> 291 + </div>
260 - <el-checkbox v-model="formData.bjCheck" @change="changeBJCheckBox()"></el-checkbox>北京 292 + <div v-if="choosePortCode.includes('PEK')">
293 + <div class="dlTitle">
294 + <!-- <el-checkbox v-model="formData.bjCheck" @change="changeBJCheckBox()"></el-checkbox>-->
295 + 北京
261 </div> 296 </div>
262 <el-row :gutter="5"> 297 <el-row :gutter="5">
263 <!-- DXPID --> 298 <!-- DXPID -->
...@@ -268,15 +303,14 @@ ...@@ -268,15 +303,14 @@
268 class="inputShadow" 303 class="inputShadow"
269 id="inputInner-edit-beijingDxpid" 304 id="inputInner-edit-beijingDxpid"
270 resize="none" 305 resize="none"
271 - v-model="formData.beijingDxpid" 306 + v-model="portConfig.PEK.dxpId"
272 clearable 307 clearable
273 placeholder="" 308 placeholder=""
274 - :disabled="!formData.bjCheck"
275 ></el-input> 309 ></el-input>
276 </Formitem> 310 </Formitem>
277 </el-col> 311 </el-col>
278 </el-row> 312 </el-row>
279 - 313 + </div>
280 314
281 <section class="dlTitle"> 315 <section class="dlTitle">
282 <h3>密码机管理</h3> 316 <h3>密码机管理</h3>
...@@ -326,19 +360,14 @@ ...@@ -326,19 +360,14 @@
326 :auto-upload="true" 360 :auto-upload="true"
327 :show-file-list="false" 361 :show-file-list="false"
328 :data="{}" 362 :data="{}"
329 - :before-upload="beforeUpload"
330 - :on-remove="handleRemove"
331 - :on-success="handleSuccess"
332 - :on-change="fileChange"
333 :file-list="fileList" 363 :file-list="fileList"
334 - @clearFiles="clearFile"
335 > 364 >
336 </el-upload> 365 </el-upload>
337 </div> 366 </div>
338 <!-- 1{{ formData.file }} --> 367 <!-- 1{{ formData.file }} -->
339 <div class="fileList" v-if="formData.file != null || formData.certificare"> 368 <div class="fileList" v-if="formData.file != null || formData.certificare">
340 <div class="fileList-item"> 369 <div class="fileList-item">
341 - <div class="uploadbox-fileName" > 370 + <div class="uploadbox-fileName">
342 <svg-icon 371 <svg-icon
343 class="el-icon-user-solid" 372 class="el-icon-user-solid"
344 icon-class="exl" 373 icon-class="exl"
...@@ -356,7 +385,8 @@ ...@@ -356,7 +385,8 @@
356 > 385 >
357 <el-button slot="reference" type="text">{{ 386 <el-button slot="reference" type="text">{{
358 $t("entry.upload.del") 387 $t("entry.upload.del")
359 - }}</el-button> 388 + }}
389 + </el-button>
360 </el-popconfirm> 390 </el-popconfirm>
361 </div> 391 </div>
362 </div> 392 </div>
...@@ -365,7 +395,6 @@ ...@@ -365,7 +395,6 @@
365 </el-col> 395 </el-col>
366 396
367 </el-row> 397 </el-row>
368 - </div>
369 </el-form> 398 </el-form>
370 </div> 399 </div>
371 <div class="dialogOption entrySave"> 400 <div class="dialogOption entrySave">
...@@ -373,13 +402,15 @@ ...@@ -373,13 +402,15 @@
373 class="entrySaveButton" 402 class="entrySaveButton"
374 :disabled="loadings.submitLoading" 403 :disabled="loadings.submitLoading"
375 @click="submit" 404 @click="submit"
376 - >确 定</el-button 405 + >确 定
406 + </el-button
377 > 407 >
378 <el-button 408 <el-button
379 class="entrySaveButton" 409 class="entrySaveButton"
380 :disabled="loadings.uploadLoading" 410 :disabled="loadings.uploadLoading"
381 @click="close" 411 @click="close"
382 - >关 闭</el-button 412 + >关 闭
413 + </el-button
383 > 414 >
384 </div> 415 </div>
385 </el-dialog> 416 </el-dialog>
...@@ -394,6 +425,7 @@ import { ...@@ -394,6 +425,7 @@ import {
394 delCertificate, 425 delCertificate,
395 delQingdaoCertificate 426 delQingdaoCertificate
396 } from "@/api/system/customer-ai.js"; 427 } from "@/api/system/customer-ai.js";
428 +
397 export default { 429 export default {
398 props: { 430 props: {
399 outerVisible: { 431 outerVisible: {
...@@ -412,6 +444,7 @@ export default { ...@@ -412,6 +444,7 @@ export default {
412 type: Object, 444 type: Object,
413 default: null, 445 default: null,
414 }, 446 },
447 + portCodeList: []
415 // dict: { 448 // dict: {
416 // type: Array, 449 // type: Array,
417 // default() { 450 // default() {
...@@ -421,28 +454,36 @@ export default { ...@@ -421,28 +454,36 @@ export default {
421 }, 454 },
422 data() { 455 data() {
423 return { 456 return {
457 + //配置模板
458 + portConfig: {
459 + PEK: {
460 + dxpId: '',
461 + },
462 + TAO: {
463 + dxpId: '',
464 + userId: '',
465 + key: '',
466 + danyiDxpId: '',
467 + userName: '',
468 + password: '',
469 + certificateName: '',
470 + certificateBase64: '',
471 + methodOfSignature: ''
472 + }
473 + },
474 + choosePortCode: [],
424 formData: { 475 formData: {
476 + config: {},
425 id: null, 477 id: null,
426 - beijingDxpid: "",
427 certificare: "", 478 certificare: "",
428 - qingdaoCertificare: "",
429 clientId: "", 479 clientId: "",
430 ecomEntCode: "", 480 ecomEntCode: "",
431 ecomEntEmail: "", 481 ecomEntEmail: "",
432 ecomEntName: "", 482 ecomEntName: "",
433 orderRequester: "", 483 orderRequester: "",
434 - //methodOfSignature: this.getDefaultMethodOfSignature(), // 设置默认值
435 certificateSerialNumber: "", 484 certificateSerialNumber: "",
436 certificateIndexNumber: "", 485 certificateIndexNumber: "",
437 - qingdaoKey: "",
438 - qingdaoUserDxpid: "",
439 - qingdaoDanyiUserDxpid:"",
440 - qingdaoUserId: "",
441 - qdCheck: false,
442 - bjCheck: false,
443 - checkboxState:"",//后端要求 北京 和青岛 用这种方式传 第一个是青岛 第二个是北京
444 file: null, 486 file: null,
445 - qingdaoFile: null,
446 }, 487 },
447 rules: { 488 rules: {
448 ecomEntCode: [ 489 ecomEntCode: [
...@@ -463,7 +504,7 @@ export default { ...@@ -463,7 +504,7 @@ export default {
463 orderRequester: [ 504 orderRequester: [
464 { 505 {
465 required: true, 506 required: true,
466 - trigger: "change", 507 + trigger: "blur",
467 message: "订单申报方不能为空！", 508 message: "订单申报方不能为空！",
468 }, 509 },
469 ], 510 ],
...@@ -534,17 +575,23 @@ export default { ...@@ -534,17 +575,23 @@ export default {
534 if (this.type == "update") { 575 if (this.type == "update") {
535 this.formData = this.active; 576 this.formData = this.active;
536 // this.formData.file=null; 577 // this.formData.file=null;
537 - this.parseCheckboxState(this.active.checkboxState); 578 + // this.parseCheckboxState(this.active.checkboxState);
538 - }else{ 579 + } else {
539 - this.formData.orderRequester="1"; 580 + // this.formData.orderRequester = "1";
540 } 581 }
541 } 582 }
542 - }, 583 + if (this.active?.config != null) {
543 - type(newVal) { 584 + this.choosePortCode = Object.keys(this.active.config)
544 - if (newVal === "add") { 585 + Object.keys(this.active.config).forEach(key => {
545 - this.setDefaultMethodOfSignature(); // 确保默认值被设置 586 + this.portConfig[key] = this.active.config[key]
587 + })
546 } 588 }
547 }, 589 },
590 + // type(newVal) {
591 + // if (newVal === "add") {
592 + // this.setDefaultMethodOfSignature(); // 确保默认值被设置
593 + // }
594 + // },
548 }, 595 },
549 // computed: { 596 // computed: {
550 // isCipherMachine() { 597 // isCipherMachine() {
...@@ -554,47 +601,47 @@ export default { ...@@ -554,47 +601,47 @@ export default {
554 601
555 created() { 602 created() {
556 // 确保字典数据已加载 603 // 确保字典数据已加载
557 - if (this.$store.getters.dict.METHOD_OF_SIGNATURE.length > 0) { 604 + // if (this.$store.getters.dict.METHOD_OF_SIGNATURE.length > 0) {
558 - this.setDefaultMethodOfSignature(); 605 + // this.setDefaultMethodOfSignature();
559 - } else { 606 + // } else {
560 - // 监听字典数据变化 607 + // // 监听字典数据变化
561 - this.$store.watch( 608 + // this.$store.watch(
562 - (state) => state.dict.METHOD_OF_SIGNATURE, 609 + // (state) => state.dict.METHOD_OF_SIGNATURE,
563 - (newVal) => { 610 + // (newVal) => {
564 - if (newVal.length > 0) { 611 + // if (newVal.length > 0) {
565 - this.setDefaultMethodOfSignature(); 612 + // this.setDefaultMethodOfSignature();
566 - } 613 + // }
567 - } 614 + // }
568 - ); 615 + // );
569 - } 616 + // }
570 }, 617 },
571 methods: { 618 methods: {
572 - getDefaultMethodOfSignature() { 619 + // getDefaultMethodOfSignature() {
573 - const methodOfSignatureDict = this.$store.getters.dict.METHOD_OF_SIGNATURE; 620 + // const methodOfSignatureDict = this.$store.getters.dict.METHOD_OF_SIGNATURE;
574 - if (methodOfSignatureDict.length > 0) { 621 + // if (methodOfSignatureDict.length > 0) {
575 - return methodOfSignatureDict[0].itemValue; 622 + // return methodOfSignatureDict[0].itemValue;
576 - } 623 + // }
577 - return ""; 624 + // return "";
578 - }, 625 + // },
579 - setDefaultMethodOfSignature() { 626 + // setDefaultMethodOfSignature() {
580 - this.formData.methodOfSignature = this.getDefaultMethodOfSignature(); 627 + // this.formData.methodOfSignature = this.getDefaultMethodOfSignature();
581 - }, 628 + // },
582 - changeQDCheckBox(){ 629 + // changeQDCheckBox() {
583 - this.$forceUpdate() 630 + // this.$forceUpdate()
584 - if(!this.formData.qdCheck){ 631 + // if (!this.formData.qdCheck) {
585 - this.formData.qingdaoDanyiUserDxpid=""; 632 + // this.formData.qingdaoDanyiUserDxpid = "";
586 - this.formData.qingdaoKey=""; 633 + // this.formData.qingdaoKey = "";
587 - this.formData.qingdaoUserDxpid=""; 634 + // this.formData.qingdaoUserDxpid = "";
588 - this.formData.qingdaoUserId=""; 635 + // this.formData.qingdaoUserId = "";
589 - } 636 + // }
590 - }, 637 + // },
591 - changeBJCheckBox(){ 638 + // changeBJCheckBox() {
592 - this.$forceUpdate() 639 + // this.$forceUpdate()
593 - if(!this.formData.bjCheck){ 640 + // if (!this.formData.bjCheck) {
594 - this.formData.beijingDxpid=""; 641 + // this.formData.beijingDxpid = "";
595 - this.formData.changeBJCheckBox=""; 642 + // this.formData.changeBJCheckBox = "";
596 - } 643 + // }
597 - }, 644 + // },
598 uploadFile() { 645 uploadFile() {
599 this.$refs.uploadFile.$refs["upload-inner"].handleClick(); 646 this.$refs.uploadFile.$refs["upload-inner"].handleClick();
600 }, 647 },
...@@ -602,21 +649,21 @@ export default { ...@@ -602,21 +649,21 @@ export default {
602 this.$refs.qingdaoUploadFile.$refs["upload-inner"].handleClick(); 649 this.$refs.qingdaoUploadFile.$refs["upload-inner"].handleClick();
603 }, 650 },
604 //文件校验 651 //文件校验
605 - beforeUpload(val) { 652 + // beforeUpload(val) {
606 - // if ( 653 + // // if (
607 - // val.type != 654 + // // val.type !=
608 - // "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" 655 + // // "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
609 - // ) { 656 + // // ) {
610 - // this.alertWarningMsg("请上传Excel文件！"); 657 + // // this.alertWarningMsg("请上传Excel文件！");
611 - // return false; 658 + // // return false;
612 - // } else { 659 + // // } else {
613 - return true; 660 + // return true;
614 - // } 661 + // // }
615 - }, 662 + // },
616 - qingdaoBeforeUpload(val) { 663 + // qingdaoBeforeUpload(val) {
617 - return true; 664 + // return true;
618 - }, 665 + // },
619 - fileUpload({ file }) { 666 + fileUpload({file}) {
620 667
621 const reader = new FileReader(); 668 const reader = new FileReader();
622 reader.readAsDataURL(file); 669 reader.readAsDataURL(file);
...@@ -624,38 +671,47 @@ export default { ...@@ -624,38 +671,47 @@ export default {
624 console.log(e); 671 console.log(e);
625 let obj = { 672 let obj = {
626 file: e.target.result, 673 file: e.target.result,
627 - name:file.name, 674 + name: file.name,
628 }; 675 };
629 this.formData.file = obj; 676 this.formData.file = obj;
630 }; 677 };
631 678
632 }, 679 },
633 - qingdaoFileUpload({ file }) { 680 + qingdaoFileUpload({file}) {
634 681
635 const reader = new FileReader(); 682 const reader = new FileReader();
636 reader.readAsDataURL(file); 683 reader.readAsDataURL(file);
684 + console.log(file);
637 reader.onload = (e) => { 685 reader.onload = (e) => {
638 console.log(e); 686 console.log(e);
639 - let obj = { 687 + this.portConfig.TAO.certificateName = file.name
640 - file: e.target.result, 688 + this.portConfig.TAO.certificateBase64 = e.target.result
641 - name:file.name, 689 + // let obj = {
642 - }; 690 + // file: e.target.result,
643 - this.formData.qingdaoFile = obj; 691 + // name: file.name,
692 + // };
693 + // this.formData.qingdaoFile = obj;
644 }; 694 };
645 695
646 }, 696 },
647 - fileChange(val) {}, 697 + // fileChange(val) {
648 - qingdaoFileChange(val) {}, 698 + // },
649 - handleSuccess() {}, 699 + // qingdaoFileChange(val) {
650 - qingdaoHandleSuccess() {}, 700 + // },
651 - clearFile() {}, 701 + // handleSuccess() {
652 - clearqingdaoFile() {}, 702 + // },
653 - handleRemove() { 703 + // qingdaoHandleSuccess() {
654 - this.fileList = []; 704 + // },
655 - }, 705 + // clearFile() {
656 - qingdaoHandleRemove() { 706 + // },
657 - this.qingdaoFileList = []; 707 + // clearqingdaoFile() {
658 - }, 708 + // },
709 + // handleRemove() {
710 + // this.fileList = [];
711 + // },
712 + // qingdaoHandleRemove() {
713 + // this.qingdaoFileList = [];
714 + // },
659 //删除文件 715 //删除文件
660 delTypeDFile() { 716 delTypeDFile() {
661 this.delCertificate(); 717 this.delCertificate();
...@@ -665,50 +721,52 @@ export default { ...@@ -665,50 +721,52 @@ export default {
665 }, 721 },
666 722
667 //删除证书 723 //删除证书
668 - delCertificate(){ 724 + delCertificate() {
669 - if(this.formData.id && this.formData.certificare){ 725 + if (this.formData.id && this.formData.certificare) {
670 - delCertificate(this.formData.id,this.formData.certificare).then((res)=>{ 726 + delCertificate(this.formData.id, this.formData.certificare).then((res) => {
671 - if(res.code==200){ 727 + if (res.code == 200) {
672 this.formData.file = null; 728 this.formData.file = null;
673 - this.formData.certificare=""; 729 + this.formData.certificare = "";
674 // this.msgSuccess("证书删除成功！"); 730 // this.msgSuccess("证书删除成功！");
675 - }else{ 731 + } else {
676 this.alertErrorMsg("证书删除失败，请联系管理员！"); 732 this.alertErrorMsg("证书删除失败，请联系管理员！");
677 } 733 }
678 - }).catch((err)=>{ 734 + }).catch((err) => {
679 console.log(err); 735 console.log(err);
680 this.alertErrorMsg("证书删除失败，请联系管理员！"); 736 this.alertErrorMsg("证书删除失败，请联系管理员！");
681 }) 737 })
682 - }else{ 738 + } else {
683 this.formData.file = null; 739 this.formData.file = null;
684 - this.formData.certificare=""; 740 + this.formData.certificare = "";
685 } 741 }
686 }, 742 },
687 743
688 //删除青岛证书 744 //删除青岛证书
689 - delQingdaoCertificate(){ 745 + delQingdaoCertificate() {
690 - if(this.formData.id && this.formData.qingdaoCertificatePath){ 746 + // if (this.formData.id && this.formData.qingdaoCertificatePath) {
691 - delQingdaoCertificate(this.formData.id,this.formData.qingdaoCertificatePath).then((res)=>{ 747 + // delQingdaoCertificate(this.formData.id, this.formData.qingdaoCertificatePath).then((res) => {
692 - if(res.code==200){ 748 + // if (res.code == 200) {
693 - this.formData.qingdaoFile = null; 749 + // this.formData.qingdaoFile = null;
694 - this.formData.qingdaoCertificatePath=""; 750 + // this.formData.qingdaoCertificatePath = "";
695 - // this.msgSuccess("证书删除成功！"); 751 + // // this.msgSuccess("证书删除成功！");
696 - }else{ 752 + // } else {
697 - this.alertErrorMsg("证书删除失败，请联系管理员！"); 753 + // this.alertErrorMsg("证书删除失败，请联系管理员！");
698 - } 754 + // }
699 - }).catch((err)=>{ 755 + // }).catch((err) => {
700 - console.log(err); 756 + // console.log(err);
701 - this.alertErrorMsg("证书删除失败，请联系管理员！"); 757 + // this.alertErrorMsg("证书删除失败，请联系管理员！");
702 - }) 758 + // })
703 - }else{ 759 + // } else {
704 - this.formData.qingdaoFile = null; 760 + // this.formData.qingdaoFile = null;
705 - this.formData.qingdaoCertificatePath=""; 761 + // this.formData.qingdaoCertificatePath = "";
706 - } 762 + // }
763 + this.portConfig.TAO.certificateBase64 = null;
764 + this.portConfig.TAO.certificateName = null;
707 }, 765 },
708 //查询用户信息详情 766 //查询用户信息详情
709 searchUserData(id) { 767 searchUserData(id) {
710 this.loadings.dialogLoading = true; 768 this.loadings.dialogLoading = true;
711 - getUserDetailData({ id: id }) 769 + getUserDetailData({id: id})
712 .then((res) => { 770 .then((res) => {
713 if (res.code === "200") { 771 if (res.code === "200") {
714 this.formData = res.data; 772 this.formData = res.data;
...@@ -724,9 +782,10 @@ export default { ...@@ -724,9 +782,10 @@ export default {
724 }, 782 },
725 //数据保存 783 //数据保存
726 submit() { 784 submit() {
785 + this.handlePortConfigJson()
727 this.loadings.dialogLoading = true; 786 this.loadings.dialogLoading = true;
728 let obj = {}; 787 let obj = {};
729 - this.formData.checkboxState=this.checkboxState(); 788 + // this.formData.checkboxState = this.checkboxState();
730 if (this.type == "add") { 789 if (this.type == "add") {
731 this.$refs.formData.validate((valid) => { 790 this.$refs.formData.validate((valid) => {
732 if (valid) { 791 if (valid) {
...@@ -742,7 +801,7 @@ export default { ...@@ -742,7 +801,7 @@ export default {
742 obj = this.formData; 801 obj = this.formData;
743 this.clearData(); //清除值 802 this.clearData(); //清除值
744 this.updateapi(obj); 803 this.updateapi(obj);
745 - if(this.formData.orderRequester==1){ 804 + if (this.formData.orderRequester == 1) {
746 this.delCertificate(); //删除证书 805 this.delCertificate(); //删除证书
747 } 806 }
748 } else { 807 } else {
...@@ -751,15 +810,21 @@ export default { ...@@ -751,15 +810,21 @@ export default {
751 }); 810 });
752 } 811 }
753 }, 812 },
813 + handlePortConfigJson() {
814 + this.formData.config = {}
815 + this.choosePortCode.forEach(portCode => {
816 + this.formData.config[portCode] = JSON.stringify(this.portConfig[portCode])
817 + })
818 + },
754 addApi(val) { 819 addApi(val) {
755 addCustomerData(val) 820 addCustomerData(val)
756 .then((res) => { 821 .then((res) => {
757 if (res.code === "200") { 822 if (res.code === "200") {
758 if (this.formData.file) { 823 if (this.formData.file) {
759 - this.uploadCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.file.file,this.formData.file.name)); 824 + this.uploadCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.file.file, this.formData.file.name));
760 } 825 }
761 if (this.formData.qingdaoFile) { 826 if (this.formData.qingdaoFile) {
762 - this.uploadQingdaoCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.qingdaoFile.file,this.formData.qingdaoFile.name)); 827 + this.uploadQingdaoCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.qingdaoFile.file, this.formData.qingdaoFile.name));
763 } 828 }
764 this.msgSuccess("客户添加成功！"); 829 this.msgSuccess("客户添加成功！");
765 this.close(); 830 this.close();
...@@ -817,10 +882,10 @@ export default { ...@@ -817,10 +882,10 @@ export default {
817 // this.msgSuccess(res.message); 882 // this.msgSuccess(res.message);
818 // this.close(); 883 // this.close();
819 if (this.formData.file) { 884 if (this.formData.file) {
820 - this.uploadCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.file.file,this.formData.file.name)); 885 + this.uploadCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.file.file, this.formData.file.name));
821 } 886 }
822 if (this.formData.qingdaoFile) { 887 if (this.formData.qingdaoFile) {
823 - this.uploadQingdaoCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.qingdaoFile.file,this.formData.qingdaoFile.name)); 888 + this.uploadQingdaoCertificate(val.ecomEntCode, this.base64ConvertFile(this.formData.qingdaoFile.file, this.formData.qingdaoFile.name));
824 } 889 }
825 this.msgSuccess("客户修改成功！"); 890 this.msgSuccess("客户修改成功！");
826 this.close(); 891 this.close();
...@@ -836,63 +901,69 @@ export default { ...@@ -836,63 +901,69 @@ export default {
836 }); 901 });
837 }, 902 },
838 //后端要求的 903 //后端要求的
839 - checkboxState() { 904 + // checkboxState() {
840 - return `${this.formData.qdCheck},${this.formData.bjCheck}`; 905 + // return `${this.formData.qdCheck},${this.formData.bjCheck}`;
841 - }, 906 + // },
842 //后端要求的 907 //后端要求的
843 - parseCheckboxState(checkboxStateString) { 908 + // parseCheckboxState(checkboxStateString) {
844 - if(checkboxStateString){ 909 + // if (checkboxStateString) {
845 - let checkboxStateArray = checkboxStateString.split(','); 910 + // let checkboxStateArray = checkboxStateString.split(',');
846 - let checkboxStateBooleans = checkboxStateArray.map(value => value === 'true'); 911 + // let checkboxStateBooleans = checkboxStateArray.map(value => value === 'true');
847 - this.formData.qdCheck=checkboxStateBooleans[0]; 912 + // this.formData.qdCheck = checkboxStateBooleans[0];
848 - this.formData.bjCheck=checkboxStateBooleans[1]; 913 + // this.formData.bjCheck = checkboxStateBooleans[1];
849 - } 914 + // }
850 - 915 + //
851 - }, 916 + // },
852 close() { 917 close() {
853 this.formData = { 918 this.formData = {
854 id: null, 919 id: null,
855 - beijingDxpid: "",
856 certificare: "", 920 certificare: "",
857 clientId: "", 921 clientId: "",
858 ecomEntCode: "", 922 ecomEntCode: "",
859 ecomEntEmail: "", 923 ecomEntEmail: "",
860 ecomEntName: "", 924 ecomEntName: "",
861 orderRequester: "", 925 orderRequester: "",
862 - //methodOfSignature: this.getDefaultMethodOfSignature(), // 重置默认值
863 certificateSerialNumber: "", 926 certificateSerialNumber: "",
864 certificateIndexNumber: "", 927 certificateIndexNumber: "",
865 - qingdaoKey: "",
866 - qingdaoUserDxpid: "",
867 - qingdaoDanyiUserDxpid:"",
868 - qingdaoUserId: "",
869 - qdCheck: false,
870 - bjCheck: false,
871 file: null, 928 file: null,
872 }; 929 };
873 - this.handleRemove(); 930 + this.choosePortCode = []
931 + this.clearPortConfig(this.portConfig)
932 + // this.handleRemove();
874 this.$emit("close"); 933 this.$emit("close");
875 }, 934 },
876 - clearData(){ 935 + clearPortConfig(obj) {
877 - if(this.formData.orderRequester==1){ 936 + for (let key in obj) {
878 - this.formData.beijingDxpid=""; 937 + if (obj.hasOwnProperty(key)) {
879 - this.formData.bjCheck=""; 938 + if (typeof obj[key] === 'object' && obj[key] !== null) {
880 - this.formData.checkboxState=""; 939 + this.clearPortConfig(obj[key]); // 递归处理嵌套对象
881 - this.formData.qingdaoKey=""; 940 + } else {
882 - this.formData.qingdaoUserDxpid=""; 941 + obj[key] = ''; // 设置为一个空字符串
883 - this.formData.qingdaoDanyiUserDxpid=""; 942 + }
884 - this.formData.qingdaoUserId="";
885 - this.formData.qdCheck="";
886 - this.formData.file=null;
887 - // this.delCertificate(); //删除证书
888 } 943 }
889 } 944 }
890 }, 945 },
946 + clearData() {
947 + // if (this.formData.orderRequester == 1) {
948 + // this.formData.beijingDxpid = "";
949 + // this.formData.bjCheck = "";
950 + // this.formData.checkboxState = "";
951 + // this.formData.qingdaoKey = "";
952 + // this.formData.qingdaoUserDxpid = "";
953 + // this.formData.qingdaoDanyiUserDxpid = "";
954 + // // this.formData.qingdaoUserId="";
955 + // this.formData.qdCheck = "";
956 + // this.formData.file = null;
957 + // // this.delCertificate(); //删除证书
958 + // }
959 + }
960 + },
891 }; 961 };
892 </script> 962 </script>
893 963
894 <style lang="scss" scoped> 964 <style lang="scss" scoped>
895 @import "@/assets/styles/variables.scss"; 965 @import "@/assets/styles/variables.scss";
966 +
896 .uploadItem { 967 .uploadItem {
897 margin-bottom: 5px; 968 margin-bottom: 5px;
898 969
...@@ -960,16 +1031,19 @@ export default { ...@@ -960,16 +1031,19 @@ export default {
960 font-size: 14px; 1031 font-size: 14px;
961 color: #333 !important; 1032 color: #333 !important;
962 margin: 5px; 1033 margin: 5px;
1034 +
963 .el-checkbox { 1035 .el-checkbox {
964 display: inline-block; 1036 display: inline-block;
965 margin-right: 10px; 1037 margin-right: 10px;
966 } 1038 }
967 } 1039 }
968 -.dlTitle{ 1040 +
1041 +.dlTitle {
969 border-bottom: 2px solid #000000; 1042 border-bottom: 2px solid #000000;
970 - color:#000000; 1043 + color: #000000;
971 margin-bottom: 12px; 1044 margin-bottom: 12px;
972 - h3{ 1045 +
1046 + h3 {
973 margin-bottom: 8px; 1047 margin-bottom: 8px;
974 font-weight: 500; 1048 font-weight: 500;
975 } 1049 }
......
...@@ -156,6 +156,7 @@ ...@@ -156,6 +156,7 @@
156 :title="dialogTitle" 156 :title="dialogTitle"
157 :type="editType" 157 :type="editType"
158 :active="activeData" 158 :active="activeData"
159 + :portCodeList="dict.port"
159 @close="dialogClose" 160 @close="dialogClose"
160 /> 161 />
161 </div> 162 </div>
...@@ -248,6 +249,9 @@ export default { ...@@ -248,6 +249,9 @@ export default {
248 align: "left", 249 align: "left",
249 }, 250 },
250 ], 251 ],
252 + dict:{
253 + port:[]
254 + },
251 // dict: { 255 // dict: {
252 // orderRequester: [ 256 // orderRequester: [
253 // { name: "企业", code: "ENTERPRISE_DECLARATION", value: "1" }, 257 // { name: "企业", code: "ENTERPRISE_DECLARATION", value: "1" },
......