作者 小范

转关运抵

  1 +import axios from 'axios'
  2 +import http from './http.js'
  3 +
  4 +
  5 +let base = 'wlpt-nmms-manage/trans/log/getByAutoid';
  6 +
  7 +
  8 +export const getList = params => { return axios.get(`${base}`, { params: params }); };
  1 +<template>
  2 + <div class="app-container">
  3 + <el-dialog
  4 + title="收发明细"
  5 + :visible.sync="dialogVisible"
  6 + width="75%"
  7 + >
  8 + <el-table :data="detailedList" border>
  9 + <el-table-column label="操作人">
  10 + <template slot-scope="scope">
  11 + {{ scope.row.operator}}
  12 + </template>
  13 + </el-table-column>
  14 + <el-table-column label="件数">
  15 + <template slot-scope="scope">
  16 + {{ scope.row.pcs}}
  17 + </template>
  18 + </el-table-column>
  19 + <el-table-column label="重量">
  20 + <template slot-scope="scope">
  21 + {{ scope.row.wgt}}
  22 + </template>
  23 + </el-table-column>
  24 + <el-table-column label="海关回执时间" width="160">
  25 + <template slot-scope="scope">
  26 + {{ scope.row.procdate}}
  27 + </template>
  28 + </el-table-column>
  29 + <el-table-column label="回执接收时间" width="160">
  30 + <template slot-scope="scope">
  31 + {{ scope.row.responsedate}}
  32 + </template>
  33 + </el-table-column>
  34 + <el-table-column label="海关统一编号" width="160">
  35 + <template slot-scope="scope">
  36 + {{ scope.row.seqno}}
  37 + </template>
  38 + </el-table-column>
  39 + <el-table-column label="客户端导入回执状态码">
  40 + <template slot-scope="scope">
  41 + <el-tag type="success" v-if="scope.row.responsecode ==='0'">正常</el-tag>
  42 + <el-tag type="danger" v-if="scope.row.responsecode ==='1'">失败</el-tag>
  43 + </template>
  44 + </el-table-column>
  45 + <el-table-column label="客户端导入回执" show-overflow-tooltip>
  46 + <template slot-scope="scope">
  47 + <span :style="{'color':scope.row.responsecode=='0'?'rgb(103,194,58)'
  48 + :scope.row.responsecode=='1'?'rgb(245,110,110)':'rgb(60,62,66)'}">{{ scope.row.responsemessage }}</span>
  49 + </template>
  50 + </el-table-column>
  51 + <el-table-column label="海关回执代码">
  52 + <template slot-scope="scope">
  53 + <el-tag type="success" v-if="scope.row.procresult ==='S'">成功</el-tag>
  54 + <el-tag type="danger" v-if="scope.row.procresult ==='F'">失败</el-tag>
  55 + </template>
  56 + </el-table-column>
  57 + <el-table-column label="海关回执内容" show-overflow-tooltip>
  58 + <template slot-scope="scope">
  59 + <span :style="{'color':scope.row.procresult=='S'?'rgb(103,194,58)'
  60 + :scope.row.procresult=='F'?'rgb(245,110,110)':'rgb(60,62,66)'}">{{ scope.row.note }}</span>
  61 + </template>
  62 + </el-table-column>
  63 + </el-table>
  64 + </el-dialog>
  65 + </div>
  66 +</template>
  67 +
  68 +<script>
  69 + import {
  70 + getList
  71 + } from '../../api/detailed'
  72 +
  73 + export default {
  74 + name: "DetailedLog",
  75 + props: {
  76 + visible: {
  77 + type: Boolean,
  78 + default: false
  79 + },
  80 + messageId: {
  81 + type: String,
  82 + default: false
  83 + }
  84 + },
  85 + data() {
  86 + return {
  87 + detailedList: []
  88 + }
  89 + },
  90 + computed: {
  91 + dialogVisible: {
  92 + get() {
  93 + return this.visible
  94 + },
  95 + set(val) {
  96 + // 当visible改变的时候,触发父组件的 updateVisible方法,在该方法中更改传入子组件的 centerDialogVisible的值
  97 + this.$emit('updateVisible', val)
  98 + }
  99 + }
  100 + },
  101 + created() {
  102 + },
  103 + methods: {
  104 + check(id) {
  105 + let _this = this
  106 + const para = {
  107 + autoid: id
  108 + }
  109 + getList(para).then(res => {
  110 + let response = res.data
  111 + if (response.code === '200') {
  112 + _this.detailedList = response.data
  113 + }
  114 + })
  115 + },
  116 + handleClose() {
  117 +
  118 + }
  119 + }
  120 + }
  121 +</script>
  122 +
  123 +<style scoped>
  124 + .filter-container {
  125 + margin-bottom: 20px;
  126 + }
  127 + .el-tooltip_popper{
  128 + max-width: 60%;
  129 + }
  130 + .table-p {
  131 + font-size: 20px;
  132 + text-align: center;
  133 + background-color: #efefef;
  134 + height: 45px;
  135 + line-height: 45px;
  136 + width: 100%;
  137 + margin-top: 0px;
  138 + }
  139 +</style>
1 /** 1 /**
2 * Created by jiachenpan on 16/11/18. 2 * Created by jiachenpan on 16/11/18.
3 */ 3 */
4 - 4 +Date.prototype.format = function(fmt) {
  5 + var o = {
  6 + 'M+': this.getMonth() + 1, // 月份
  7 + 'd+': this.getDate(), // 日
  8 + 'h+': this.getHours(), // 小时
  9 + 'H+': this.getHours(), // 小时
  10 + 'm+': this.getMinutes(), // 分
  11 + 's+': this.getSeconds(), // 秒
  12 + 'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
  13 + 'S': this.getMilliseconds() // 毫秒
  14 + }
  15 + if (/(y+)/.test(fmt)) {
  16 + fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length))
  17 + }
  18 + for (var k in o) {
  19 + if (new RegExp('(' + k + ')').test(fmt)) {
  20 + fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
  21 + }
  22 + }
  23 + return fmt
  24 +}
5 export function parseTime(time, cFormat) { 25 export function parseTime(time, cFormat) {
6 if (arguments.length === 0) { 26 if (arguments.length === 0) {
7 return null 27 return null
@@ -156,7 +156,7 @@ @@ -156,7 +156,7 @@
156 </el-row> 156 </el-row>
157 </el-form> 157 </el-form>
158 </el-row> 158 </el-row>
159 - <el-row> 159 + <el-row class="rowTwo">
160 <el-table 160 <el-table
161 v-loading="listLoading" 161 v-loading="listLoading"
162 :data="tableData" 162 :data="tableData"
@@ -174,7 +174,7 @@ @@ -174,7 +174,7 @@
174 fixed="left" 174 fixed="left"
175 width="55" 175 width="55"
176 /> 176 />
177 - <el-table-column label="统一编号"> 177 + <el-table-column label="统一编号" width="150">
178 <template slot-scope="scope"> 178 <template slot-scope="scope">
179 <span>{{ scope.row.seqno }}</span> 179 <span>{{ scope.row.seqno }}</span>
180 </template> 180 </template>
@@ -193,36 +193,36 @@ @@ -193,36 +193,36 @@
193 <span>{{ scope.row.customscode }}</span> 193 <span>{{ scope.row.customscode }}</span>
194 </template> 194 </template>
195 </el-table-column> 195 </el-table-column>
196 - <el-table-column label="集装箱(器)编号" width="140">  
197 - <template slot-scope="scope">  
198 - <span>{{ scope.row.contaid }}</span>  
199 - </template>  
200 - </el-table-column> 196 +<!-- <el-table-column label="集装箱(器)编号" width="140">-->
  197 +<!-- <template slot-scope="scope">-->
  198 +<!-- <span>{{ scope.row.contaid }}</span>-->
  199 +<!-- </template>-->
  200 +<!-- </el-table-column>-->
201 <el-table-column label="总提运单号" width="140"> 201 <el-table-column label="总提运单号" width="140">
202 <template slot-scope="scope"> 202 <template slot-scope="scope">
203 <span>{{ scope.row.billno }}</span> 203 <span>{{ scope.row.billno }}</span>
204 </template> 204 </template>
205 </el-table-column> 205 </el-table-column>
206 - <el-table-column label="运输方式代码" width="120">  
207 - <template slot-scope="scope">  
208 - <span v-if="scope.row.trafmode ==='2'">江海运输</span>  
209 - <span v-if="scope.row.trafmode ==='3'">铁路运输</span>  
210 - <span v-if="scope.row.trafmode ==='4'">汽车运输</span>  
211 - <span v-if="scope.row.trafmode ==='5'">航空运输</span>  
212 - <span v-if="scope.row.trafmode ==='6'">邮件运输</span>  
213 -<!-- <span>{{ scope.row.trafmode }}</span>-->  
214 - </template>  
215 - </el-table-column>  
216 - <el-table-column label="境内运输工具名称" width="140">  
217 - <template slot-scope="scope">  
218 - <span>{{ scope.row.trafname }}</span>  
219 - </template>  
220 - </el-table-column>  
221 - <el-table-column label="境内运输工具航(班)次" width="160">  
222 - <template slot-scope="scope">  
223 - <span>{{ scope.row.voyageno }}</span>  
224 - </template>  
225 - </el-table-column> 206 +<!-- <el-table-column label="进出境运输方式代码" width="120">-->
  207 +<!-- <template slot-scope="scope">-->
  208 +<!-- <span v-if="scope.row.trafmode ==='2'">江海运输</span>-->
  209 +<!-- <span v-if="scope.row.trafmode ==='3'">铁路运输</span>-->
  210 +<!-- <span v-if="scope.row.trafmode ==='4'">汽车运输</span>-->
  211 +<!-- <span v-if="scope.row.trafmode ==='5'">航空运输</span>-->
  212 +<!-- <span v-if="scope.row.trafmode ==='6'">邮件运输</span>-->
  213 +<!--&lt;!&ndash; <span>{{ scope.row.trafmode }}</span>&ndash;&gt;-->
  214 +<!-- </template>-->
  215 +<!-- </el-table-column>-->
  216 +<!-- <el-table-column label="境内运输工具名称" width="140">-->
  217 +<!-- <template slot-scope="scope">-->
  218 +<!-- <span>{{ scope.row.trafname }}</span>-->
  219 +<!-- </template>-->
  220 +<!-- </el-table-column>-->
  221 +<!-- <el-table-column label="境内运输工具航(班)次" width="160">-->
  222 +<!-- <template slot-scope="scope">-->
  223 +<!-- <span>{{ scope.row.voyageno }}</span>-->
  224 +<!-- </template>-->
  225 +<!-- </el-table-column>-->
226 <el-table-column label="境内运输方式" width="120"> 226 <el-table-column label="境内运输方式" width="120">
227 <template slot-scope="scope"> 227 <template slot-scope="scope">
228 <span v-if="scope.row.trafway ==='2'">江海运输</span> 228 <span v-if="scope.row.trafway ==='2'">江海运输</span>
@@ -248,28 +248,49 @@ @@ -248,28 +248,49 @@
248 <span>{{ scope.row.unloadcode }}</span> 248 <span>{{ scope.row.unloadcode }}</span>
249 </template> 249 </template>
250 </el-table-column> 250 </el-table-column>
251 - <el-table-column label="到达卸货地时间" width="140"> 251 + <el-table-column label="时间" width="140">
  252 + <template slot-scope="scope">
  253 + <span>{{ scope.row.creattime }}</span>
  254 + </template>
  255 + </el-table-column>
  256 + <el-table-column label="申报状态" width="120">
  257 + <template slot-scope="scope">
  258 + <span v-if="scope.row.dstatus ==='000'">未申报/已暂存</span>
  259 + <span v-if="scope.row.dstatus ==='001'">已申报</span>
  260 + </template>
  261 + </el-table-column>
  262 + <el-table-column label="回执状态" width="120">
252 <template slot-scope="scope"> 263 <template slot-scope="scope">
253 - <span>{{ scope.row.arrivetime }}</span> 264 + <el-tag type="success" v-if="scope.row.customResponseStatus ==='0'">申报成功</el-tag>
  265 + <el-tag type="danger" v-if="scope.row.customResponseStatus ==='1'">申报失败</el-tag>
  266 + <el-tag type="success" v-if="scope.row.customResponseStatus ==='S'">申报成功</el-tag>
  267 + <el-tag type="danger" v-if="scope.row.customResponseStatus ==='F'">申报失败</el-tag>
254 </template> 268 </template>
255 </el-table-column> 269 </el-table-column>
256 - <el-table-column label="回执内容" width="140"> 270 + <el-table-column label="回执内容" width="220">
257 <template slot-scope="scope"> 271 <template slot-scope="scope">
258 - <span>{{ scope.row.customResponseText }}</span> 272 + <span :style="{'color':scope.row.customResponseStatus=='0'?'rgb(103,194,58)'
  273 + :scope.row.customResponseStatus=='1'?'rgb(245,110,110)':scope.row.customResponseStatus=='S'?'rgb(103,194,58)'
  274 + :scope.row.customResponseStatus=='F'?'rgb(245,110,110)':'rgb(60,62,66)'}">{{ scope.row.customResponseText }}</span>
259 </template> 275 </template>
260 </el-table-column> 276 </el-table-column>
261 - <el-table-column label="操作" align="center" width="400" fixed="right"> 277 + <el-table-column label="操作" align="center" width="410" fixed="right">
262 <template slot-scope="scope"> 278 <template slot-scope="scope">
263 - <el-button type="success" size="mini" @click="editTrn(scope.$index,scope.row)">编&nbsp;&nbsp;&nbsp;辑</el-button>  
264 - <el-button type="warning" size="mini" @click="declareTrn(scope.row)">  
265 - 申&nbsp;&nbsp;&nbsp;报  
266 - </el-button>  
267 - <el-button type="info" size="mini" @click="statusTrn(scope.row)">  
268 - 修改状态  
269 - </el-button>  
270 - <el-button type="danger" size="mini" :disabled="scope.row.customResponseText && scope.row.customResponseText !== undefined && scope.row.customResponseText.length>0" @click="delTrn(scope.row)">  
271 - 删&nbsp;&nbsp;&nbsp;除  
272 - </el-button> 279 + <el-row>
  280 + <el-button type="success" size="mini" @click="editTrn(scope.$index,scope.row)">编辑</el-button>
  281 + <el-button type="warning" size="mini" :disabled="scope.row.customResponseText && scope.row.customResponseText !== undefined && scope.row.customResponseText.length>0" @click="declareTrn(scope.row)">
  282 + 申报
  283 + </el-button>
  284 + <el-button type="danger" size="mini" :disabled="scope.row.customResponseText && scope.row.customResponseText !== undefined && scope.row.customResponseText.length>0" @click="delTrn(scope.row)">
  285 + 删除
  286 + </el-button>
  287 + <el-button type="primary" size="mini" @click="check(scope.row)">
  288 + 回执明细
  289 + </el-button>
  290 + <el-button type="info" size="mini" @click="statusTrn(scope.row)">
  291 + 修改状态
  292 + </el-button>
  293 + </el-row>
273 </template> 294 </template>
274 </el-table-column> 295 </el-table-column>
275 </el-table> 296 </el-table>
@@ -299,7 +320,7 @@ @@ -299,7 +320,7 @@
299 <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="100px" style="margin-top: -20px;label:right" :rules="rules" >
300 <el-row> 321 <el-row>
301 <el-col :span="24"> 322 <el-col :span="24">
302 - <div class="grid-content content">信息表单</div> 323 + <div class="grid-content content">信息表单 (id: {{form.autoid}})</div>
303 </el-col> 324 </el-col>
304 </el-row> 325 </el-row>
305 <el-row> 326 <el-row>
@@ -310,7 +331,7 @@ @@ -310,7 +331,7 @@
310 </el-col> 331 </el-col>
311 <el-col :span="6"> 332 <el-col :span="6">
312 <el-form-item label="海关关区" prop="customscode"> 333 <el-form-item label="海关关区" prop="customscode">
313 - <el-input v-model="form.customscode" size="small" placeholder="" oninput="value=value.replace(/[^\d]/g,'')" 334 + <el-input v-model="customscode" size="small" placeholder="" oninput="value=value.replace(/[^\d]/g,'')"
314 maxLength='4'/> 335 maxLength='4'/>
315 </el-form-item> 336 </el-form-item>
316 </el-col> 337 </el-col>
@@ -430,7 +451,7 @@ @@ -430,7 +451,7 @@
430 </el-col> 451 </el-col>
431 <el-col :span="6"> 452 <el-col :span="6">
432 <el-form-item label="卸货地代码" prop="unloadcode"> 453 <el-form-item label="卸货地代码" prop="unloadcode">
433 - <el-input v-model="form.unloadcode" size="small" placeholder="" /> 454 + <el-input v-model="unloadcode" size="small" placeholder="" />
434 </el-form-item> 455 </el-form-item>
435 </el-col> 456 </el-col>
436 </el-row> 457 </el-row>
@@ -449,8 +470,8 @@ @@ -449,8 +470,8 @@
449 <el-date-picker 470 <el-date-picker
450 v-model="form.arrivetime" 471 v-model="form.arrivetime"
451 type="datetime" size="mini" 472 type="datetime" size="mini"
452 - value-format="yyyyMMddhhmmss"  
453 - format="yyyyMMddhhmmss" 473 + value-format="yyyyMMddHHmmss"
  474 + format="yyyyMMddHHmmss"
454 style="width:190px" 475 style="width:190px"
455 placeholder="选择日期时间"> 476 placeholder="选择日期时间">
456 </el-date-picker> 477 </el-date-picker>
@@ -489,16 +510,32 @@ @@ -489,16 +510,32 @@
489 </el-form> 510 </el-form>
490 </el-dialog> 511 </el-dialog>
491 </el-row> 512 </el-row>
  513 +<!-- 回执明细弹框-->
  514 + <DetailedLog
  515 + ref="detailedlog"
  516 + :message-id="detailedlogId"
  517 + :visible="dialogDetailedLogVisible"
  518 + @updateVisible="updateVisible"
  519 + />
492 </section> 520 </section>
493 </template> 521 </template>
494 522
495 <script> 523 <script>
496 import {selectTrans,delTrans,batchSend,ediTrans,send,addTrans} from "../../api/trn"; 524 import {selectTrans,delTrans,batchSend,ediTrans,send,addTrans} from "../../api/trn";
  525 + import DetailedLog from '@/components/detailedDialog'
  526 + import uti from '@/utils'
  527 +
497 528
498 export default { 529 export default {
499 name: "transit", 530 name: "transit",
  531 + components: { DetailedLog },
  532 +
500 data(){ 533 data(){
501 return{ 534 return{
  535 + //组件数据
  536 + detailedlogId: '',
  537 + dialogDetailedLogVisible: false,
  538 + detailedList: [],
502 pickerOptions: { 539 pickerOptions: {
503 shortcuts: [{ 540 shortcuts: [{
504 text: '最近一周', 541 text: '最近一周',
@@ -572,16 +609,16 @@ @@ -572,16 +609,16 @@
572 packno:'', 609 packno:'',
573 grosswt:'', 610 grosswt:'',
574 unloadcode:'', 611 unloadcode:'',
575 - arrivetime:'', 612 + arrivetime: '',
576 contatype:'', 613 contatype:'',
577 - trnmode:'', 614 + trnmode:'2',
578 notes:'', 615 notes:'',
579 - opertype:'1', 616 + opertype:'A',
580 sign:'qwer', 617 sign:'qwer',
581 - signdate:'20220113120000',  
582 - clientseqno:'qwertyuioplkjhgfds',  
583 - hostid:'1137490146@qq.com',  
584 - certno:'11', 618 + signdate:'',
  619 + clientseqno:'',
  620 + hostid:'',
  621 + certno:'',
585 622
586 623
587 }, 624 },
@@ -609,7 +646,50 @@ @@ -609,7 +646,50 @@
609 //获取列表 646 //获取列表
610 this.trnList(); 647 this.trnList();
611 }, 648 },
  649 + computed:{
  650 + customscode: {
  651 + get: function () {
  652 + return this.form.customscode
  653 + },
  654 + set:function (val) {
  655 + this.form.customscode = val;
  656 + let loadcode = ''
  657 + if (this.unloadcode && this.unloadcode.length >= 2) {
  658 + let length = this.unloadcode.length
  659 + loadcode = this.unloadcode.substring(length - 2, length)
  660 + }
  661 + this.form.arriveno = this.customscode + loadcode + new Date().format('yyMMddHHmmss');
  662 + }
  663 + },
  664 + unloadcode: {
  665 + get: function () {
  666 + return this.form.unloadcode
  667 + },
  668 + set:function (val) {
  669 + this.form.unloadcode = val
  670 + let loadcode = ''
  671 + console.log(this.unloadcode.length)
  672 + if (this.unloadcode && this.unloadcode.length >= 2) {
  673 + let length = this.unloadcode.length
  674 + loadcode = this.unloadcode.substring(length - 2, length)
  675 + }
  676 + console.log(loadcode+"aaaa")
  677 + this.form.arriveno = this.customscode + loadcode + new Date().format('yyMMddHHmmss');
  678 + }
  679 + },
  680 +
  681 + },
612 methods:{ 682 methods:{
  683 + //查看回执按钮
  684 + check(row) {
  685 + this.dialogDetailedLogVisible = true
  686 + this.autoid = row.autoid
  687 + this.$refs.detailedlog.check(row.autoid)
  688 + console.log('======'+this.detailedList)
  689 + },
  690 + updateVisible(val) {
  691 + this.dialogDetailedLogVisible = val
  692 + },
613 //分页 693 //分页
614 handleSizeChange(val) { 694 handleSizeChange(val) {
615 this.formTrn.pageSize = val 695 this.formTrn.pageSize = val
@@ -680,6 +760,7 @@ @@ -680,6 +760,7 @@
680 addTrn() { 760 addTrn() {
681 this.dialogStatus = 'create' 761 this.dialogStatus = 'create'
682 this.trn_dialog.addDialog = true 762 this.trn_dialog.addDialog = true
  763 + this.form.arrivetime = new Date().format('yyyyMMddHHmmss')
683 }, 764 },
684 765
685 // 新增功能 766 // 新增功能
@@ -737,13 +818,7 @@ @@ -737,13 +818,7 @@
737 }, 818 },
738 // 申报 819 // 申报
739 declareTrn(row) { 820 declareTrn(row) {
740 - row.clientseqno= "qwertyuioplkjhgfds"  
741 - row.opertype= "1"  
742 - row.sign= "qwer"  
743 - row.signdate= "20220113120000"  
744 - row.hostid= "1137490146@qq.com"  
745 - row.certno= "11"  
746 - 821 + row.opertype= "C"
747 send(row).then((response) => { 822 send(row).then((response) => {
748 const res = response.data 823 const res = response.data
749 if (res.code !== '200') { 824 if (res.code !== '200') {
@@ -816,4 +891,6 @@ @@ -816,4 +891,6 @@
816 padding: 15px 0 0 20px; 891 padding: 15px 0 0 20px;
817 box-shadow: 0px 5px 5px #e5e8eb; 892 box-shadow: 0px 5px 5px #e5e8eb;
818 } 893 }
  894 + .rowTwo{
  895 + }
819 </style> 896 </style>