作者 小范

新增转运申请界面

  1 +import axios from 'axios'
  2 +import http from "../http";
  3 +
  4 +
  5 +let baseUrl = 'wlpt-nmms-manage/trans/dom'
  6 +
  7 +export const getList = params => { return http.get(`${baseUrl}`, params);};
  8 +export const remove = params => { return http.del(`${baseUrl}`, params); };
  9 +
  10 +export const add = params => { return http.post(`${baseUrl}`,params)};
  11 +
  12 +export const edit = params => { return http.put(`${baseUrl}`,params)};
  13 +
  14 +
@@ -106,6 +106,8 @@ import Way from './views/nav3/Way.vue' @@ -106,6 +106,8 @@ import Way from './views/nav3/Way.vue'
106 //朱总让做的网页在线客服 106 //朱总让做的网页在线客服
107 import Webdialog from './views/bus/Webdialog.vue' 107 import Webdialog from './views/bus/Webdialog.vue'
108 108
  109 +//国际转运
  110 +import Transport from './views/nav4/Transport.vue'
109 111
110 112
111 113
@@ -388,6 +390,8 @@ let routes = [ @@ -388,6 +390,8 @@ let routes = [
388 children:[ 390 children:[
389 {path:'/consigner',component:Consigner,name:'发货人管理'}, 391 {path:'/consigner',component:Consigner,name:'发货人管理'},
390 {path:'/consignee',component:Consignee,name:'收货人管理'}, 392 {path:'/consignee',component:Consignee,name:'收货人管理'},
  393 + {path:'/transport',component:Transport,name:'转运申请'},
  394 +
391 ] 395 ]
392 }, 396 },
393 // { 397 // {
  1 +<template>
  2 + <el-container style="height: 550px;overflow:auto;">
  3 + <el-main>
  4 + <el-row>
  5 + <el-col :span="24">
  6 + <div class="grid-content content">查询申请信息</div>
  7 + </el-col>
  8 + </el-row>
  9 + <!-- 搜索区域-->
  10 + <el-row>
  11 + <el-form :inline="true" :model="formInline" class="demo-form-inline">
  12 + <el-col :span="6">
  13 + <el-form-item label="航班号">
  14 + <el-input size="small" style="width: 120px" v-model="formInline.originFlightno" placeholder="请输入航班号"></el-input>
  15 + </el-form-item>
  16 + </el-col>
  17 + <el-col :span="7">
  18 + <el-form-item label="航班日期">
  19 + <el-date-picker size="small" type="date" placeholder="选择日期" v-model="formInline.originFlightdate" style="width: 120px;"></el-date-picker>
  20 + </el-form-item>
  21 + </el-col>
  22 + <el-col :span="7">
  23 + <el-form-item label="主单号">
  24 + <el-input size="small" style="width: 140px" v-model="formInline.originMasterwaybill" placeholder="请输入主单号"></el-input>
  25 + </el-form-item>
  26 + </el-col>
  27 + <el-col :span="3">
  28 + <el-form-item>
  29 + <el-button size="small" type="primary" @click="transList">查询</el-button>
  30 + </el-form-item>
  31 + </el-col>
  32 + </el-form>
  33 + </el-row>
  34 + <!-- 表单区域-->
  35 + <el-row>
  36 + <el-col :span="24">
  37 + <div class="grid-content content">国际转运明细</div>
  38 + </el-col>
  39 + </el-row>
  40 + <el-row>
  41 + <el-table
  42 + :data="tableData"
  43 + border size="small"
  44 + style="width: 100%">
  45 + <el-table-column
  46 + fixed
  47 + prop="originMasterwaybill"
  48 + label="运单号"
  49 + width="150">
  50 + </el-table-column>
  51 + <el-table-column
  52 + prop="originHousewaybill"
  53 + label="分单号"
  54 + width="120">
  55 + </el-table-column>
  56 + <el-table-column
  57 + prop="originFlightno"
  58 + label="航班号"
  59 + width="120">
  60 + </el-table-column>
  61 + <el-table-column
  62 + prop="piece"
  63 + label="运单件数"
  64 + width="120">
  65 + </el-table-column>
  66 + <el-table-column
  67 + prop="weight"
  68 + label="运单重量"
  69 + width="300">
  70 + </el-table-column>
  71 + <el-table-column
  72 + prop="goodsdesen"
  73 + label="货物品名"
  74 + width="120">
  75 + </el-table-column>
  76 + <el-table-column
  77 + prop="transFlightno"
  78 + label="转运航班号"
  79 + width="120">
  80 + </el-table-column>
  81 + <el-table-column
  82 + prop="transitType"
  83 + label="转运类型"
  84 + width="300">
  85 + </el-table-column>
  86 + <el-table-column
  87 + prop="status"
  88 + label="状态"
  89 + width="120">
  90 + </el-table-column>
  91 + <el-table-column
  92 + prop=""
  93 + label="放行信息"
  94 + width="120">
  95 + </el-table-column>
  96 + <el-table-column
  97 + fixed="right"
  98 + label="审核"
  99 + width="250">
  100 + <template slot-scope="scope">
  101 + <el-button style="margin-left: 10px" @click="handleClick(scope.row)" type="primary" size="mini">确认</el-button>
  102 + <el-button type="danger" size="mini" @click="trans_remove(scope.$index,scope.row)">删除</el-button>
  103 + <el-button style="margin-top: 10px" type="success" size="mini" @click="trans_toEditDialog(scope.$index,scope.row)">编辑</el-button>
  104 + <el-button type="info" size="mini" @click="dialogFormVisible = true">驳回</el-button>
  105 + <el-button style="margin-top: 10px" type="warning" size="mini" @click="dialogTableVisible = true">审核明细</el-button>
  106 + </template>
  107 + </el-table-column>
  108 + </el-table>
  109 + <!--分页区域-->
  110 + <div class="block">
  111 + <el-pagination
  112 + @size-change="handleSizeChange"
  113 + @current-change="handleCurrentChange"
  114 + :current-page="pageNum"
  115 + :page-sizes="[10, 20, 30, 40]"
  116 + :page-size="pageSize"
  117 + layout="total, sizes, prev, pager, next, jumper"
  118 + :total="total">
  119 + </el-pagination>
  120 + </div>
  121 + <el-button style="margin-top: 20px" type="primary" size="small" @click="trans_toAddDialog">新增国际转运舱单申请</el-button>
  122 +
  123 + </el-row>
  124 +<!-- 新增、修改 弹框-->
  125 + <el-row>
  126 + <el-dialog :title="dialogMap[dialogStatus]" :visible.sync="trans_dialog.addDialog" @close="trans_addDialogClosed"
  127 + style="margin-top: -50px" text-align="center" width="80%"
  128 + >
  129 + <el-form :inline="true" :model="form" class="demo-form-inline" ref="form" style="margin-top: -20px">
  130 + <el-row>
  131 + <el-col :span="24">
  132 + <div class="grid-content content">国际舱单信息</div>
  133 + </el-col>
  134 + </el-row>
  135 + <el-col :span="6">
  136 + <el-form-item label="航班号" prop="originFlightno">
  137 + <el-input size="small" v-model="form.originFlightno" style="width: 140px" placeholder=""></el-input>
  138 + </el-form-item>
  139 + </el-col>
  140 + <el-col :span="6">
  141 + <el-form-item label="航班日期" prop="originFlightdate">
  142 + <el-date-picker size="small" type="date" placeholder="选择日期" style="width: 140px" v-model="form.originFlightdate" ></el-date-picker>
  143 + </el-form-item>
  144 + </el-col>
  145 + <el-col :span="6">
  146 + <el-form-item label="主单号" prop="originMasterwaybill">
  147 + <el-input size="small" v-model="form.originMasterwaybill" style="width: 140px" placeholder=""></el-input>
  148 + </el-form-item>
  149 + </el-col>
  150 + <el-col :span="6">
  151 + <el-form-item label="分单号" prop="originHousewaybill">
  152 + <el-input size="small" v-model="form.originHousewaybill" style="width: 140px" placeholder=""></el-input>
  153 + </el-form-item>
  154 + </el-col>
  155 + <el-row>
  156 + <el-col :span="24">
  157 + <div class="grid-content content">国内舱单信息</div>
  158 + </el-col>
  159 + </el-row>
  160 + <el-col :span="6">
  161 + <el-form-item label="航班号" prop="transFlightno">
  162 + <el-input size="small" v-model="form.transFlightno" style="width: 140px" placeholder=""></el-input>
  163 + </el-form-item>
  164 + </el-col>
  165 + <el-col :span="6">
  166 + <el-form-item label="航班日期" prop="transFlightdate">
  167 + <el-date-picker size="small" type="date" placeholder="选择日期" style="width: 140px" v-model="form.transFlightdate" ></el-date-picker>
  168 + </el-form-item>
  169 + </el-col>
  170 + <el-col :span="6">
  171 + <el-form-item label="主单号" prop="transMasterwaybill">
  172 + <el-input size="small" v-model="form.transMasterwaybill" style="width: 140px" placeholder=""></el-input>
  173 + </el-form-item>
  174 + </el-col>
  175 + <el-col :span="6">
  176 + <el-form-item label="分单号" prop="transHousewaybill">
  177 + <el-input size="small" v-model="form.transHousewaybill" style="width: 140px" placeholder=""></el-input>
  178 + </el-form-item>
  179 + </el-col>
  180 + <el-row>
  181 + <el-col :span="24">
  182 + <div class="grid-content content">运单信息</div>
  183 + </el-col>
  184 + </el-row>
  185 + <el-col :span="6">
  186 + <el-form-item label="品名" prop="goodsdesen">
  187 + <el-input size="small" v-model="form.goodsdesen" style="width: 140px" placeholder=""></el-input>
  188 + </el-form-item>
  189 + </el-col>
  190 + <el-col :span="6">
  191 + <el-form-item label="件数" prop="piece">
  192 + <el-input size="small" v-model="form.piece" style="width: 140px" placeholder=""></el-input>
  193 + </el-form-item>
  194 + </el-col>
  195 + <el-col :span="6">
  196 + <el-form-item label="重量" prop="weight">
  197 + <el-input size="small" v-model="form.weight" style="width: 140px" placeholder=""></el-input>
  198 + </el-form-item>
  199 + </el-col>
  200 + <el-form-item label="包装类型" prop="pack">
  201 + <el-select v-model="form.pack" size="small" placeholder="" style="width: 140px">
  202 + <el-option label="木质" value="1"></el-option>
  203 + <el-option label="铁质" value="2"></el-option>
  204 + <el-option label="玻璃" value="3"></el-option>
  205 + </el-select>
  206 + </el-form-item>
  207 + <el-col :span="6">
  208 + <el-form-item label="出发地" prop="originStation">
  209 + <el-input size="small" v-model="form.originStation" style="width: 140px" placeholder=""></el-input>
  210 + </el-form-item>
  211 + </el-col>
  212 + <el-col :span="6">
  213 + <el-form-item label="目的地" prop="destinationStation">
  214 + <el-input size="small" v-model="form.destinationStation" style="width: 140px" placeholder=""></el-input>
  215 + </el-form-item>
  216 + </el-col>
  217 + <el-row>
  218 + <el-col :span="24">
  219 + <div class="grid-content content">转运类型</div>
  220 + </el-col>
  221 + </el-row>
  222 + <el-col :span="6">
  223 + <el-form-item label="" prop="transitType">
  224 + <el-radio style="margin-left: 30px" v-model="form.transitType" label="imp" value="1">进口</el-radio>
  225 + <el-radio v-model="form.transitType" label="exp" value="2">出口</el-radio>
  226 + </el-form-item>
  227 + </el-col>
  228 + <el-row>
  229 + <el-col :span="24">
  230 + <el-form-item>
  231 + <el-button type="primary" size="small" style="margin-left: 700px;width: 100px" @click="dialogStatus==='create'?trans_add():trans_edit()" >提交</el-button>
  232 + </el-form-item>
  233 + </el-col>
  234 + </el-row>
  235 +
  236 + </el-form>
  237 + </el-dialog>
  238 + </el-row>
  239 +<!-- 审核明细弹框-->
  240 + <el-row>
  241 + <el-dialog title="审核明细" :visible.sync="dialogTableVisible">
  242 + <el-table :data="gridData">
  243 + <el-table-column property="date" label="审核时间" width="150"></el-table-column>
  244 + <el-table-column property="name" label="审核人员" width="200"></el-table-column>
  245 + <el-table-column property="address" label="放行信息"></el-table-column>
  246 + <el-table-column property="address" label="驳回原因"></el-table-column>
  247 + </el-table>
  248 + </el-dialog>
  249 + </el-row>
  250 +<!-- 驳回原因弹框-->
  251 + <el-row>
  252 + <el-dialog title="驳回原因" :visible.sync="dialogFormVisible">
  253 + <el-form :model="form">
  254 + <el-input
  255 + type="textarea"
  256 + :rows="2"
  257 + placeholder="请输入内容"
  258 + v-model="textarea">
  259 + </el-input>
  260 + </el-form>
  261 +
  262 + </el-dialog>
  263 + </el-row>
  264 +
  265 + </el-main>
  266 +
  267 + </el-container>
  268 +
  269 +</template>
  270 +
  271 +<script>
  272 + import { getList, remove, add, edit} from '../../api/consigner/transport';
  273 +
  274 + export default {
  275 + name: "Transport",
  276 +
  277 + data() {
  278 + return {
  279 + formInline: {
  280 + originFlightno: '',
  281 + originFlightdate: '',
  282 + originMasterwaybill: '',
  283 + },
  284 + total:0,
  285 + pageNum: 1,
  286 + pageSize: 10000,
  287 + tableData:[],
  288 + gridData:[],
  289 + dialogMap: {
  290 + update: '编辑',
  291 + create: '新增',
  292 + },
  293 + dialogStatus: 'create',
  294 + trans_dialog: {
  295 + // 添加对话框
  296 + addDialog: false,
  297 + // 编辑对话框
  298 + editDialog: false,
  299 + },
  300 + dialogTableVisible: false,
  301 + dialogFormVisible: false,
  302 + textarea:'',
  303 + form:{
  304 + userName:'ASD',
  305 + originFlightno:'',
  306 + originFlightdate:'',
  307 + originMasterwaybill :'',
  308 + originHousewaybill:'',
  309 + transFlightno :'',
  310 + transFlightdate :'',
  311 + transMasterwaybill:'',
  312 + transHousewaybill :'',
  313 + goodsdesen :'',
  314 + piece :'',
  315 + weight :'',
  316 + pack :'',
  317 + originStation:'',
  318 + destinationStation:'',
  319 + transitType:'',
  320 + }
  321 +
  322 + }
  323 + },
  324 + methods: {
  325 + handleSizeChange(val) {
  326 + this.pageSize=val;
  327 + this.transList();
  328 + },
  329 + handleCurrentChange(val) {
  330 + this.pageNum=val;
  331 + this.transList();
  332 + },
  333 + // 获取消息标签列表
  334 + transList() {
  335 + let _this = this;
  336 + getList(this.formInline).then((response) => {
  337 + let res = response.data;
  338 + if (res.code !== '200') {
  339 + return _this.$message.error('获取消息收发记录,失败!');
  340 + }
  341 + // 获取列表数据
  342 + _this.tableData = res.data.list;
  343 + // 获取列表的总记录数
  344 + _this.total = res.data.total;
  345 + _this.$message.success('获取消息收发记录,成功!');
  346 + }).catch(error => {
  347 + // 关闭加载
  348 + _this.$message.error(error.toString());
  349 + });
  350 + },
  351 + //删除
  352 +
  353 + trans_remove(index,row){
  354 + // 弹框询问是否删除?
  355 + this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
  356 + confirmButtonText: '确定删除',
  357 + cancelButtonText: '取消',
  358 + type: 'warning'
  359 + }
  360 + ).then(() => {
  361 + remove({id:row.id}).then((response) => {
  362 + console.log(row);
  363 + let res = response.data;
  364 + this.$message.success(res.msg);
  365 + this.transList();
  366 + }).catch(error => {
  367 + this.$message.error(res.msg);
  368 + });
  369 + }).catch(() => {
  370 + });
  371 + },
  372 + // trans_remove(index, row) {
  373 + // // 弹框询问是否删除?
  374 + // this.$confirm('此操作永久删除该队列信息, 是否继续?', '警告', {
  375 + // confirmButtonText: '确定删除',
  376 + // cancelButtonText: '取消',
  377 + // type: 'warning'
  378 + // }
  379 + // ).then(() => {
  380 + // remove(row).then((response) => {
  381 + // let res = response.data;
  382 + // if (res.code !== '200') {
  383 + // return this.$message.error(res.msg);
  384 + // }
  385 + // this.$message.success(res.msg);
  386 + // this.transList();
  387 + // }).catch(error => {
  388 + // this.$message.error(error.toString());
  389 + // });
  390 + // }).catch(() => {
  391 + // });
  392 + // },
  393 + //打开新增
  394 + trans_toAddDialog() {
  395 + this.dialogStatus= 'create';
  396 + this.trans_dialog.addDialog = true;
  397 + },
  398 +
  399 + //新增功能
  400 + trans_add() {
  401 + // 进行表单的预验证
  402 + this.$refs.form.validate(valid => {
  403 + // 未通过,表单预校验
  404 + if (!valid) return;
  405 + add(this.form).then((response) => {
  406 + let res = response.data;
  407 + // 添加失败
  408 + if (res.code !== '200') {
  409 + // 关闭加载
  410 + return this.$message.error(res.msg);
  411 + }
  412 + // 添加,成功
  413 + this.$message.success(res.msg);
  414 + // 隐藏对话框
  415 + this.trans_dialog.addDialog = false;
  416 + // 刷新列表
  417 + this.transList();
  418 + }).catch(error => {
  419 + this.$message.error(error.toString());
  420 + });
  421 + })
  422 + },
  423 + //打开编辑
  424 + trans_toEditDialog(index, row) {
  425 + this.trans_dialog.addDialog = true;
  426 + this.dialogStatus= 'update';
  427 + this.$nextTick(() => {
  428 + this.form = Object.assign({}, row);
  429 + });
  430 + },
  431 + //编辑功能
  432 + trans_edit() {
  433 + //进行表单的预验证
  434 + this.$refs.form.validate(valid => {
  435 + // 未通过,表单预校验
  436 + if (!valid) return;
  437 + edit(this.form).then((response) => {
  438 + let res = response.data;
  439 + if (res.code !== '200') {
  440 + return this.$message.error(res.msg);
  441 + }
  442 + this.$message.success(res.msg);
  443 + // 隐藏对话框
  444 + this.trans_dialog.addDialog = false;
  445 + // 刷新列表
  446 + this.transList();
  447 + }).catch(error => {
  448 + this.$message.error(error.toString());
  449 + });
  450 + })
  451 + },
  452 + //关闭对话框
  453 + trans_addDialogClosed() {
  454 +
  455 + // 重置对话框
  456 + this.$refs.form.resetFields();
  457 + },
  458 +
  459 +
  460 + },
  461 + mounted() {
  462 + this.transList();
  463 + },
  464 + }
  465 +</script>
  466 +
  467 +<style scoped>
  468 +
  469 +</style>