朱兆平 / vue_cli · 提交

转到一个项目

作者 小范
提交 4bf9545de91b445a242d58de79706e0f050dd3b4 1 个父辈 b463128d

转关运抵弹框界面优化

内嵌 并排对比
正在显示 1 个修改的文件 包含 49 行增加 和 39 行删除
@@ -314,10 +314,10 @@ @@ -314,10 +314,10 @@
314 :visible.sync="trn_dialog.addDialog" 314 :visible.sync="trn_dialog.addDialog"
315 style="margin-top: -50px" 315 style="margin-top: -50px"
316 text-align="center" 316 text-align="center"
317 - width="80%" 317 + width="85%"
318 @close="trn_addDialogClosed" 318 @close="trn_addDialogClosed"
319 > 319 >
320 - <el-form ref="form" :inline="true" :model="form" class="demo-form-inline" label-width="100px" style="margin-top: -20px;label:right" :rules="rules" > 320 + <el-form ref="form" :inline="true" :model="form" class="demo-form-inline" label-width="110px" style="margin-top: -20px;" label-position="right" :rules="rules" >
321 <el-divider></el-divider> 321 <el-divider></el-divider>
322 <el-row> 322 <el-row>
323 <el-col :span="24"> 323 <el-col :span="24">
@@ -325,18 +325,18 @@ @@ -325,18 +325,18 @@
325 </el-col> 325 </el-col>
326 </el-row> 326 </el-row>
327 <el-row> 327 <el-row>
328 - <el-col :span="6"> 328 + <el-col :span="8">
329 <el-form-item label="海关申报序号" prop="seqno"> 329 <el-form-item label="海关申报序号" prop="seqno">
330 - <el-input v-model="form.seqno" placeholder="" disabled></el-input> 330 + <el-input v-model="form.seqno" placeholder="" disabled suffix-icon=“xxxx”></el-input>
331 </el-form-item> 331 </el-form-item>
332 </el-col> 332 </el-col>
333 - <el-col :span="6"> 333 + <el-col :span="8">
334 <el-form-item label="海关关区" prop="customscode"> 334 <el-form-item label="海关关区" prop="customscode">
335 - <el-input v-model="customscode" placeholder="" oninput="value=value.replace(/[^\d]/g,'')" 335 + <el-input v-model="customscode" placeholder="" suffix-icon=“xxxx” oninput="value=value.replace(/[^\d]/g,'')"
336 maxLength='4'/> 336 maxLength='4'/>
337 </el-form-item> 337 </el-form-item>
338 </el-col> 338 </el-col>
339 - <el-col :span="6"> 339 + <el-col :span="8">
340 <el-form-item label="转关方式" prop="trnmode"> 340 <el-form-item label="转关方式" prop="trnmode">
341 <!-- <el-input v-model="form.trnmode" size="small"/>--> 341 <!-- <el-input v-model="form.trnmode" size="small"/>-->
342 <el-select v-model="form.trnmode" placeholder="请选择" size="mini"> 342 <el-select v-model="form.trnmode" placeholder="请选择" size="mini">
@@ -347,15 +347,8 @@ @@ -347,15 +347,8 @@
347 </el-select> 347 </el-select>
348 </el-form-item> 348 </el-form-item>
349 </el-col> 349 </el-col>
350 - <el-col :span="6">  
351 - <el-tooltip content="运抵编号：北方模式必填；南方模式免填；水运中转模式选填。运抵编号规则：4位申报地海关代码+2位卸货地代码+6位编号生成日期（顺序为年（2位）月（2位)）日（2位））+6位流水号" effect="light">  
352 - <el-form-item label="运抵编号" prop="arriveno">  
353 - <el-input v-model="form.arriveno" :disabled="form.trnmode==1" placeholder=""  
354 - />  
355 - </el-form-item>  
356 - </el-tooltip>  
357 350
358 - </el-col> 351 +
359 352
360 <!-- <el-col :span="6">--> 353 <!-- <el-col :span="6">-->
361 <!-- <el-form-item label="操作员卡号" prop="inputopid">--> 354 <!-- <el-form-item label="操作员卡号" prop="inputopid">-->
@@ -384,13 +377,22 @@ @@ -384,13 +377,22 @@
384 <!-- </el-form-item>--> 377 <!-- </el-form-item>-->
385 <!-- </el-col>--> 378 <!-- </el-col>-->
386 <el-row> 379 <el-row>
387 - <el-col :span="6"> 380 + <el-col :span="8">
  381 + <el-tooltip content="运抵编号：北方模式必填；南方模式免填；水运中转模式选填。运抵编号规则：4位申报地海关代码+2位卸货地代码+6位编号生成日期（顺序为年（2位）月（2位)）日（2位））+6位流水号" effect="light">
  382 + <el-form-item label="运抵编号" prop="arriveno">
  383 + <el-input suffix-icon=“xxxx” v-model="form.arriveno" :disabled="form.trnmode==1" placeholder=""
  384 + />
  385 + </el-form-item>
  386 + </el-tooltip>
  387 +
  388 + </el-col>
  389 + <el-col :span="8">
388 <el-form-item label="运单号" prop="billno"> 390 <el-form-item label="运单号" prop="billno">
389 - <el-input v-model="form.billno" placeholder="" /> 391 + <el-input suffix-icon=“xxxx” v-model="form.billno" placeholder="" />
390 </el-form-item> 392 </el-form-item>
391 </el-col> 393 </el-col>
392 - <el-col :span="6">  
393 - <el-form-item label="进出境运输方式" prop="trafmode" label-width="110px"> 394 + <el-col :span="8">
  395 + <el-form-item label="进出境运输方式" prop="trafmode">
394 <!-- <el-input v-model="form.trafmode" placeholder="" />--> 396 <!-- <el-input v-model="form.trafmode" placeholder="" />-->
395 <el-select v-model="form.trafmode" placeholder="请选择" size="mini" > 397 <el-select v-model="form.trafmode" placeholder="请选择" size="mini" >
396 <el-option label="2-江海运输" value="2"></el-option> 398 <el-option label="2-江海运输" value="2"></el-option>
@@ -401,15 +403,18 @@ @@ -401,15 +403,18 @@
401 </el-select> 403 </el-select>
402 </el-form-item> 404 </el-form-item>
403 </el-col> 405 </el-col>
404 - <el-col :span="6"> 406 +
  407 + </el-row>
  408 + <el-row>
  409 + <el-col :span="8">
405 <el-tooltip content="运输工具名称：北方模式选填；南方模式填写@+13位载货清单号；水运中转模式必填：境内水路运输填报驳船船名，境内铁路运输填报车名（主管海关4位关别代码+TRAIN）；境内公路运输填报车名（主管海关4位关别代码+TRUCK）" placement="bottom" effect="light"> 410 <el-tooltip content="运输工具名称：北方模式选填；南方模式填写@+13位载货清单号；水运中转模式必填：境内水路运输填报驳船船名，境内铁路运输填报车名（主管海关4位关别代码+TRAIN）；境内公路运输填报车名（主管海关4位关别代码+TRUCK）" placement="bottom" effect="light">
406 <el-form-item label="运输工具名称" prop="trafname"> 411 <el-form-item label="运输工具名称" prop="trafname">
407 - <el-input v-model="form.trafname" placeholder="" /> 412 + <el-input suffix-icon=“xxxx” v-model="form.trafname" placeholder="" />
408 </el-form-item> 413 </el-form-item>
409 </el-tooltip> 414 </el-tooltip>
410 415
411 </el-col> 416 </el-col>
412 - <el-col :span="6"> 417 + <el-col :span="8">
413 <el-tooltip content="启运时间：北方模式选填；南方模式免填；水运中转模式必填：境内水路运输填报驳船航次号，境内铁路、公路运输填报6位启运日期（顺序为年（2位）月（2位）日（2位））" placement="bottom" effect="light"> 418 <el-tooltip content="启运时间：北方模式选填；南方模式免填；水运中转模式必填：境内水路运输填报驳船航次号，境内铁路、公路运输填报6位启运日期（顺序为年（2位）月（2位）日（2位））" placement="bottom" effect="light">
414 <el-form-item label="启运时间" prop="voyageno"> 419 <el-form-item label="启运时间" prop="voyageno">
415 <!-- <el-input v-model="form.voyageno" placeholder="" />--> 420 <!-- <el-input v-model="form.voyageno" placeholder="" />-->
@@ -425,10 +430,7 @@ @@ -425,10 +430,7 @@
425 </el-tooltip> 430 </el-tooltip>
426 431
427 </el-col> 432 </el-col>
428 - </el-row>  
429 - <el-row>  
430 -  
431 - <el-col :span="6"> 433 + <el-col :span="8">
432 <el-form-item label="境内运输方式" prop="trafway"> 434 <el-form-item label="境内运输方式" prop="trafway">
433 <!-- <el-input v-model="form.trafway" placeholder="" />--> 435 <!-- <el-input v-model="form.trafway" placeholder="" />-->
434 <el-select v-model="form.trafway" placeholder="请选择" size="mini"> 436 <el-select v-model="form.trafway" placeholder="请选择" size="mini">
@@ -440,32 +442,35 @@ @@ -440,32 +442,35 @@
440 </el-select> 442 </el-select>
441 </el-form-item> 443 </el-form-item>
442 </el-col> 444 </el-col>
443 - <el-col :span="6"> 445 +
  446 + </el-row>
  447 + <el-row>
  448 + <el-col :span="8">
444 <el-form-item label="托运件数" prop="packno"> 449 <el-form-item label="托运件数" prop="packno">
445 - <el-input v-model="form.packno" placeholder="" /> 450 + <el-input suffix-icon=“xxxx” v-model="form.packno" placeholder="" />
446 </el-form-item> 451 </el-form-item>
447 </el-col> 452 </el-col>
448 - <el-col :span="6"> 453 + <el-col :span="8">
449 <el-form-item label="托运重量" prop="grosswt"> 454 <el-form-item label="托运重量" prop="grosswt">
450 - <el-input v-model="form.grosswt" placeholder="" /> 455 + <el-input suffix-icon=“xxxx” v-model="form.grosswt" placeholder="" />
451 </el-form-item> 456 </el-form-item>
452 </el-col> 457 </el-col>
453 - <el-col :span="6"> 458 + <el-col :span="8">
454 <el-form-item label="卸货地代码" prop="unloadcode"> 459 <el-form-item label="卸货地代码" prop="unloadcode">
455 - <el-input v-model="unloadcode" placeholder="" /> 460 + <el-input suffix-icon=“xxxx” v-model="unloadcode" placeholder="" />
456 </el-form-item> 461 </el-form-item>
457 </el-col> 462 </el-col>
458 </el-row> 463 </el-row>
459 <el-row> 464 <el-row>
460 - <el-col :span="6"> 465 + <el-col :span="8">
461 <el-tooltip content="集装箱(器)编号：集装箱货物必填：4个字母即货主编码、6位数字序列号以及1位检测数字组成；非集装箱货物免填" placement="bottom" effect="light"> 466 <el-tooltip content="集装箱(器)编号：集装箱货物必填：4个字母即货主编码、6位数字序列号以及1位检测数字组成；非集装箱货物免填" placement="bottom" effect="light">
462 <el-form-item label="集装箱编号" prop="contaid"> 467 <el-form-item label="集装箱编号" prop="contaid">
463 - <el-input v-model="form.contaid" placeholder="" /> 468 + <el-input suffix-icon=“xxxx” v-model="form.contaid" placeholder="" />
464 </el-form-item> 469 </el-form-item>
465 </el-tooltip> 470 </el-tooltip>
466 471
467 </el-col> 472 </el-col>
468 - <el-col :span="6"> 473 + <el-col :span="8">
469 <el-form-item label="到达卸货地时间" prop="arrivetime" label-width="110px"> 474 <el-form-item label="到达卸货地时间" prop="arrivetime" label-width="110px">
470 <!-- <el-input v-model="form.arrivetime" size="mini" placeholder="" />--> 475 <!-- <el-input v-model="form.arrivetime" size="mini" placeholder="" />-->
471 <el-date-picker 476 <el-date-picker
@@ -478,10 +483,10 @@ @@ -478,10 +483,10 @@
478 </el-date-picker> 483 </el-date-picker>
479 </el-form-item> 484 </el-form-item>
480 </el-col> 485 </el-col>
481 - <el-col :span="6"> 486 + <el-col :span="8">
482 <el-tooltip content="集装箱(器)尺寸：集装箱货物必填；非集装箱货物免填" placement="bottom" effect="light"> 487 <el-tooltip content="集装箱(器)尺寸：集装箱货物必填；非集装箱货物免填" placement="bottom" effect="light">
483 <el-form-item label="集装器尺寸" prop="contatype"> 488 <el-form-item label="集装器尺寸" prop="contatype">
484 - <el-input v-model="form.contatype" placeholder="" /> 489 + <el-input suffix-icon=“xxxx” v-model="form.contatype" placeholder="" />
485 </el-form-item> 490 </el-form-item>
486 </el-tooltip> 491 </el-tooltip>
487 492
@@ -494,7 +499,7 @@ @@ -494,7 +499,7 @@
494 <el-input 499 <el-input
495 v-model="form.notes" 500 v-model="form.notes"
496 type="textarea" 501 type="textarea"
497 - :rows="1" style="width: 440px" 502 + :rows="1" style="width: 520px"
498 placeholder="请输入内容" 503 placeholder="请输入内容"
499 /> 504 />
500 </el-form-item> 505 </el-form-item>
@@ -503,7 +508,7 @@ @@ -503,7 +508,7 @@
503 <el-row> 508 <el-row>
504 <el-col :span="24"> 509 <el-col :span="24">
505 <el-form-item> 510 <el-form-item>
506 - <el-button style="margin-left: 500px;width: 100px" type="info" @click="trn_dialog.addDialog = false">取消</el-button> 511 + <el-button style="margin-left: 400px;width: 100px" type="info" @click="trn_dialog.addDialog = false">取消</el-button>
507 <el-button type="primary" style="margin-left: 20px;width: 100px" @click="dialogStatus==='create'?trn_add():trn_edit()">提交</el-button> 512 <el-button type="primary" style="margin-left: 20px;width: 100px" @click="dialogStatus==='create'?trn_add():trn_edit()">提交</el-button>
508 </el-form-item> 513 </el-form-item>
509 </el-col> 514 </el-col>
@@ -653,20 +658,25 @@ @@ -653,20 +658,25 @@
653 } 658 }
654 }, 659 },
655 computed:{ 660 computed:{
  661 + //海关关区
656 customscode: { 662 customscode: {
657 get: function () { 663 get: function () {
  664 + //呈现的数据
658 return this.form.customscode 665 return this.form.customscode
659 }, 666 },
660 set:function (val) { 667 set:function (val) {
  668 + //操作的数据
661 this.form.customscode = val; 669 this.form.customscode = val;
662 let loadcode = '' 670 let loadcode = ''
663 if (this.unloadcode && this.unloadcode.length >= 2) { 671 if (this.unloadcode && this.unloadcode.length >= 2) {
664 let length = this.unloadcode.length 672 let length = this.unloadcode.length
665 loadcode = this.unloadcode.substring(length - 2, length) 673 loadcode = this.unloadcode.substring(length - 2, length)
666 } 674 }
  675 + //给运抵编号赋值
667 this.form.arriveno = this.customscode + loadcode + new Date().format('yyMMddHHmmss'); 676 this.form.arriveno = this.customscode + loadcode + new Date().format('yyMMddHHmmss');
668 } 677 }
669 }, 678 },
  679 + //卸货地代码
670 unloadcode: { 680 unloadcode: {
671 get: function () { 681 get: function () {
672 return this.form.unloadcode 682 return this.form.unloadcode