朱兆平 / vue_cli · 提交

转到一个项目

作者 小范
提交 ea062c86da6969de4f29184d2be769e5334da20f 1 个父辈 791945cc

新增预、确报申报配置界面

内嵌 并排对比
正在显示 3 个修改的文件 包含 1242 行增加 和 2 行删除
@@ -15,13 +15,33 @@ let baseUrlDynamics = 'air-server-transport/transport/aircraftStaying' @@ -15,13 +15,33 @@ let baseUrlDynamics = 'air-server-transport/transport/aircraftStaying'
15 let baseUrlCancel = 'air-server-transport/transport/prediction' 15 let baseUrlCancel = 'air-server-transport/transport/prediction'
16 let baseUrlBillcountry = 'air-server-transport/transport/country' 16 let baseUrlBillcountry = 'air-server-transport/transport/country'
17 let baseUrlBillcreden = 'air-server-transport/transport/creden' 17 let baseUrlBillcreden = 'air-server-transport/transport/creden'
  18 +//确报
  19 +let baseUrlExact = 'air-server-transport/exactPlanConfig'
  20 +//预报
  21 +let baseUrlConfig = 'air-server-transport/prePlanConfig'
  22 +
  23 +
  24 +
  25 +// 确保申报配置
  26 +export const addExact = params => { return http.post(`${baseUrlExact}/addExact`, params); };
  27 +export const ediExact = params => { return http.post(`${baseUrlExact}/ediExact`, params); };
  28 +export const delExact = params => { return http.post(`${baseUrlExact}/delExact`, params); };
  29 +export const selectExact = params => { return http.get(`${baseUrlExact}/selectExact`, params); };
  30 +//预报申报配置
  31 +export const addPrePlanConfig = params => { return http.post(`${baseUrlConfig}/addPrePlanConfig`, params); };
  32 +export const ediPrePlanConfig = params => { return http.post(`${baseUrlConfig}/ediPrePlanConfig`, params); };
  33 +export const delPrePlanConfig = params => { return http.post(`${baseUrlConfig}/delPrePlanConfig`, params); };
  34 +export const selectPrePlanConfig = params => { return http.get(`${baseUrlConfig}/selectPrePlanConfig`, params); };
18 35
19 36
20 37
21 -//进港预报 取消申报原因  
22 -export const cancelPrediction = params => { return http.post(`${baseUrlCancel}/cancelPrediction`, params); };  
23 38
24 39
  40 +
  41 +
  42 +
  43 +//进港预报 取消申报原因
  44 +export const cancelPrediction = params => { return http.post(`${baseUrlCancel}/cancelPrediction`, params); };
25 //在港动态 45 //在港动态
26 //增删改 46 //增删改
27 export const addAircraftStaying = params => { return http.post(`${baseUrlDynamics}/addAircraftStaying`, params); }; 47 export const addAircraftStaying = params => { return http.post(`${baseUrlDynamics}/addAircraftStaying`, params); };
  1 +<template>
  2 + <el-container>
  3 + <el-main>
  4 + <el-row class="row-bg">
  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 :label-position="labelPosition" :model="queryConfigure" :rules="rules" ref="queryFlight"
  12 + label-width="130px" class="demo-ruleForm">
  13 + <el-row>
  14 + <el-col :span="4" >
  15 + <el-form-item label="承运人" prop="carrier" label-width="70px">
  16 + <el-input v-model="queryConfigure.carrier" style="width:120px"></el-input>
  17 + </el-form-item>
  18 + </el-col>
  19 + <el-col :span="4" >
  20 + <el-form-item label="航班号" prop="flightno" label-width="70px">
  21 + <el-input v-model="queryConfigure.flightno" style="width:120px"></el-input>
  22 + </el-form-item>
  23 + </el-col>
  24 + <el-col :span="5" >
  25 + <el-button type="primary" icon="el-icon-search" @click="submitForm()">查询</el-button>
  26 + <el-button type="success" icon="el-icon-edit" @click="addForm()">新增</el-button>
  27 +
  28 + </el-col>
  29 + </el-row>
  30 +
  31 + </el-form>
  32 + </el-row>
  33 + <!-- 表单区域-->
  34 + <el-row>
  35 + <el-table
  36 + :data="tableData"
  37 + border
  38 + v-loading="tableloading">
  39 + <el-table-column
  40 + prop="carrier"
  41 + label="承运人">
  42 + </el-table-column>
  43 + <el-table-column
  44 + prop="flightno"
  45 + label="航班号">
  46 + </el-table-column>
  47 + <el-table-column
  48 + prop="customscode"
  49 + label="申报关区">
  50 + </el-table-column>
  51 + <el-table-column
  52 + prop="aircraftcode"
  53 + label="航空注册器编号">
  54 + </el-table-column>
  55 + <el-table-column
  56 + prop="aircrafttype"
  57 + label="航空器备案类型"
  58 + show-overflow-tooltip>
  59 + </el-table-column>
  60 + <el-table-column
  61 + prop="originstation"
  62 + label="航班起始站">
  63 + </el-table-column>
  64 + <el-table-column
  65 + prop="destinationstation"
  66 + label="航班目的站">
  67 + </el-table-column>
  68 + <el-table-column
  69 + prop="configstarttime"
  70 + label="配置生效时间">
  71 + </el-table-column>
  72 + <el-table-column
  73 + prop="configendtime"
  74 + label="配置生效生效到期日">
  75 + </el-table-column>
  76 + <el-table-column
  77 + label="配置状态">
  78 + <template slot-scope="scope">
  79 + <span v-if="scope.row.configstatus ==='0'">禁用</span>
  80 + <span v-if="scope.row.configstatus ==='1'">生效</span>
  81 + </template>
  82 + </el-table-column>
  83 + <el-table-column
  84 + label="配置类型">
  85 + <template slot-scope="scope">
  86 + <span v-if="scope.row.type ==='2'">入境</span>
  87 + <span v-if="scope.row.type ==='1'">出境</span>
  88 + </template>
  89 + </el-table-column>
  90 + <el-table-column
  91 + prop="userid"
  92 + label="创建人">
  93 + </el-table-column>
  94 + <el-table-column
  95 + prop="creatdate"
  96 + label="创建时间">
  97 + </el-table-column>
  98 + <el-table-column
  99 + prop="updatedate"
  100 + label="配置更新时间">
  101 + </el-table-column>
  102 + <el-table-column
  103 + prop="entrytime"
  104 + label="入境时间">
  105 + </el-table-column>
  106 + <el-table-column
  107 + prop="departuretime"
  108 + label="出境时间">
  109 + </el-table-column>
  110 + <el-table-column
  111 + prop="stayid"
  112 + label="停机位">
  113 + </el-table-column>
  114 + <el-table-column
  115 + prop="crontask"
  116 + label="定时任务配置时间规则">
  117 + </el-table-column>
  118 + <el-table-column
  119 + prop="customremark"
  120 + label="海关备注">
  121 + </el-table-column>
  122 + <el-table-column
  123 + prop="remark"
  124 + label="配置规则备注">
  125 + </el-table-column>
  126 + <el-table-column
  127 + fixed="right"
  128 + prop=""
  129 + label="报文操作"
  130 + width="280">
  131 + <template slot-scope="scope">
  132 + <el-button
  133 + size="mini"
  134 + type="primary"
  135 + @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
  136 + <el-button
  137 + size="mini"
  138 + type="danger"
  139 + @click="handleDel(scope.row)">删除</el-button>
  140 + </template>
  141 + </el-table-column>
  142 + </el-table>
  143 + </el-row>
  144 + <el-row>
  145 + <div class="block">
  146 + <el-pagination
  147 + @size-change="handleSizeChange"
  148 + @current-change="handleCurrentChange"
  149 + :current-page="pageNum"
  150 + :page-sizes="[10, 20, 30, 40]"
  151 + :page-size="pageSize"
  152 + layout="total, sizes, prev, pager, next, jumper"
  153 + :total="total">
  154 + </el-pagination>
  155 + </div>
  156 + </el-row>
  157 + <!-- 新增编辑弹框-->
  158 + <el-row>
  159 + <el-dialog :title="dialogMap[dialogStatus]" :visible.sync="configure_dialog.addDialog" width="80%" @close="configure_addDialogClosed">
  160 + <el-form :model="configure_editForm" :rules="rules" ref="configure_editForm">
  161 + <el-row>
  162 + <el-col :span="6" style="margin-top: 10px">
  163 + <el-form-item label="承运人" prop="carrier" label-width="130px">
  164 + <el-input v-model.trim="configure_editForm.carrier" @input="e => configure_editForm.carrier=inputMe(e)"
  165 + maxLength='2'></el-input>
  166 + </el-form-item>
  167 + </el-col>
  168 + <el-col :span="6" style="margin-top: 10px">
  169 + <el-form-item label="航班号" prop="flightno" label-width="130px">
  170 + <el-input v-model="configure_editForm.flightno" @input="e => configure_editForm.flightno=inputMe(e)"></el-input>
  171 + </el-form-item>
  172 + </el-col>
  173 +
  174 + <el-col :span="6" style="margin-top: 10px">
  175 + <el-form-item label="申报关区" prop="customscode" label-width="130px">
  176 + <el-input v-model="configure_editForm.customscode" oninput="value=value.replace(/[^\d]/g,'')"
  177 + maxLength='4'></el-input>
  178 + </el-form-item>
  179 + </el-col>
  180 + <el-col :span="6" style="margin-top: 10px">
  181 + <el-form-item label="航空注册器编号" prop="aircraftcode" label-width="130px">
  182 + <el-input v-model="configure_editForm.aircraftcode"></el-input>
  183 + </el-form-item>
  184 + </el-col>
  185 +
  186 + </el-row>
  187 + <el-row>
  188 + <el-col :span="6">
  189 + <el-form-item label="航空器备案类型" prop="aircrafttype" label-width="140px">
  190 + <el-input v-model="configure_editForm.aircrafttype"
  191 + ></el-input>
  192 + </el-form-item>
  193 + </el-col>
  194 + <el-col :span="6">
  195 + <el-form-item label="航班起始站" prop="originstation" label-width="130px">
  196 + <el-input v-model="configure_editForm.originstation" @input="e => configure_editForm.originstation=inputMe(e)"
  197 + maxLength='3'></el-input>
  198 + </el-form-item>
  199 + </el-col>
  200 + <el-col :span="6">
  201 + <el-form-item label="航班目的站" prop="destinationstation" label-width="130px">
  202 + <el-input v-model="configure_editForm.destinationstation" @input="e => configure_editForm.destinationstation=inputMe(e)"
  203 + maxLength='3'></el-input>
  204 + </el-form-item>
  205 + </el-col>
  206 + <el-col :span="6">
  207 + <el-form-item label="配置生效时间" prop="configstarttime" label-width="130px">
  208 + <el-date-picker
  209 + v-model="configure_editForm.configstarttime"
  210 + type="datetime"
  211 + placeholder="选择日期时间"
  212 + value-format="yyyyMMddhhmmss"
  213 + format="yyyyMMddhhmmss"
  214 + style="width: 100%"
  215 + :picker-options="pickerOptions">
  216 + </el-date-picker>
  217 + </el-form-item>
  218 + </el-col>
  219 + <el-col :span="6">
  220 + <el-form-item label="配置生效到期日" prop="configendtime" label-width="140px">
  221 + <el-date-picker
  222 + v-model="configure_editForm.configendtime"
  223 + type="datetime"
  224 + placeholder="选择日期时间"
  225 + value-format="yyyyMMddhhmmss"
  226 + format="yyyyMMddhhmmss"
  227 + style="width: 100%"
  228 + :picker-options="pickerOptions">
  229 + </el-date-picker>
  230 + </el-form-item>
  231 + </el-col>
  232 + <el-col :span="6">
  233 + <el-form-item label="配置状态" prop="configstatus" label-width="130px">
  234 +<!-- <el-input v-model="configure_editForm.configstatus"></el-input>-->
  235 + <el-select v-model="configure_editForm.configstatus" placeholder="请选择" size="mini">
  236 + <el-option label="0-禁用" value="0"></el-option>
  237 + <el-option label="1-生效" value="1"></el-option>
  238 + </el-select>
  239 + </el-form-item>
  240 + </el-col>
  241 + <el-col :span="6">
  242 + <el-form-item label="配置类型" prop="type" label-width="130px">
  243 +<!-- <el-input v-model="configure_editForm.type"></el-input>-->
  244 + <el-select v-model="configure_editForm.type" placeholder="请选择" size="mini">
  245 + <el-option label="2-入境" value="2"></el-option>
  246 + <el-option label="1-出境" value="1"></el-option>
  247 + </el-select>
  248 + </el-form-item>
  249 + </el-col>
  250 + <el-col :span="6">
  251 + <el-form-item label="创建人" prop="userid" label-width="130px">
  252 + <el-input v-model="configure_editForm.userid"></el-input>
  253 + </el-form-item>
  254 + </el-col>
  255 + <el-col :span="6">
  256 + <el-form-item label="创建时间" prop="creatdate" label-width="130px">
  257 + <el-date-picker
  258 + v-model="configure_editForm.creatdate"
  259 + type="datetime"
  260 + placeholder="选择日期时间"
  261 + value-format="yyyyMMddhhmmss"
  262 + format="yyyyMMddhhmmss"
  263 + style="width: 100%"
  264 + :picker-options="pickerOptions">
  265 + </el-date-picker>
  266 + </el-form-item>
  267 + </el-col>
  268 + <el-col :span="6">
  269 + <el-form-item label="配置更新时间" prop="updatedate" label-width="130px">
  270 + <el-date-picker
  271 + v-model="configure_editForm.updatedate"
  272 + type="datetime"
  273 + placeholder="选择日期时间"
  274 + value-format="yyyyMMddhhmmss"
  275 + format="yyyyMMddhhmmss"
  276 + style="width: 100%"
  277 + :picker-options="pickerOptions">
  278 + </el-date-picker>
  279 + </el-form-item>
  280 + </el-col>
  281 + <el-col :span="6">
  282 + <el-form-item label="入境时间" prop="entrytime" label-width="130px">
  283 + <el-date-picker
  284 + v-model="configure_editForm.entrytime"
  285 + type="datetime"
  286 + placeholder="选择日期时间"
  287 + value-format="yyyyMMddhhmmss"
  288 + format="yyyyMMddhhmmss"
  289 + style="width:100%">
  290 + </el-date-picker>
  291 + </el-form-item>
  292 + </el-col>
  293 + <el-col :span="6">
  294 + <el-form-item label="出境时间" prop="departuretime" label-width="130px">
  295 + <el-date-picker
  296 + v-model="configure_editForm.departuretime"
  297 + type="datetime"
  298 + placeholder="选择日期时间"
  299 + value-format="yyyyMMddhhmmss"
  300 + format="yyyyMMddhhmmss"
  301 + style="width:100%">
  302 + </el-date-picker>
  303 + </el-form-item>
  304 + </el-col>
  305 + </el-row>
  306 + <el-col :span="6">
  307 + <el-form-item label="停机位" prop="stayid" label-width="130px">
  308 + <el-input v-model="configure_editForm.stayid"></el-input>
  309 + </el-form-item>
  310 + </el-col>
  311 + <el-col :span="6">
  312 + <el-form-item label="定时任务配置时间规则" prop="crontask" label-width="130px">
  313 + <el-input v-model="configure_editForm.crontask"></el-input>
  314 + </el-form-item>
  315 + </el-col>
  316 + <el-col :span="6">
  317 + <el-form-item label="海关备注" prop="customremark" label-width="130px">
  318 + <el-input v-model="configure_editForm.customremark"></el-input>
  319 + </el-form-item>
  320 + </el-col>
  321 + <el-col :span="6">
  322 + <el-form-item label="配置规则备注" prop="remark" label-width="130px">
  323 + <el-input v-model="configure_editForm.remark"></el-input>
  324 + </el-form-item>
  325 + </el-col>
  326 + </el-form>
  327 + <div slot="footer" class="dialog-footer">
  328 + <el-button @click="configure_dialog.addDialog = false" size="small">取 消</el-button>
  329 + <el-button type="primary" @click="dialogStatus==='create'?configure_add():configure_edit()" size="small">提 交</el-button>
  330 + </div>
  331 + </el-dialog>
  332 + </el-row>
  333 + </el-main>
  334 + </el-container>
  335 +</template>
  336 +
  337 +
  338 +<script>
  339 + import {selectExact,ediExact,addExact,delExact} from "../../api/transport";
  340 +
  341 + export default {
  342 + data(){
  343 + return{
  344 + pickerOptions: {
  345 + shortcuts: [{
  346 + text: '最近一周',
  347 + onClick(picker) {
  348 + const end = new Date();
  349 + const start = new Date();
  350 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  351 + picker.$emit('pick', [start, end]);
  352 + }
  353 + }, {
  354 + text: '最近一个月',
  355 + onClick(picker) {
  356 + const end = new Date();
  357 + const start = new Date();
  358 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  359 + picker.$emit('pick', [start, end]);
  360 + }
  361 + }, {
  362 + text: '最近三个月',
  363 + onClick(picker) {
  364 + const end = new Date();
  365 + const start = new Date();
  366 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  367 + picker.$emit('pick', [start, end]);
  368 + }
  369 + }]
  370 + },
  371 + queryConfigure:{
  372 + flightno:undefined,
  373 + carrier:undefined,
  374 + },
  375 + labelPosition:'left',
  376 + pageNum: 1,
  377 + pageSize:10,
  378 + total:0,
  379 + tableData:[],
  380 + tableloading:false,
  381 + dialogMap: {
  382 + update: '编辑',
  383 + create: '新增'
  384 + },
  385 + dialogStatus: 'create',
  386 + configure_dialog: {
  387 + // 添加对话框
  388 + addDialog: false,
  389 + // 编辑对话框
  390 + editDialog: false
  391 + },
  392 + formLabelWidth: '220px',
  393 + configure_editForm: {
  394 + carrier: '',
  395 + flightno: '',
  396 + customscode: '',
  397 + aircraftcode: '',
  398 + aircrafttype: '',
  399 + originstation: '',
  400 + destinationstation: '',
  401 + configstarttime: '',
  402 + configendtime: '',
  403 + configstatus: '',
  404 + type: '',
  405 + userid: '',
  406 + creatdate: '',
  407 + updatedate: '',
  408 + entrytime: '',
  409 + departuretime: '',
  410 + stayid: '',
  411 + crontask: '',
  412 + customremark: '',
  413 + remark: '',
  414 + },
  415 + rules: {
  416 + carrier: [
  417 + { required: true, message: '请输入', trigger: 'blur' },
  418 + // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  419 + ],
  420 + flightno: [
  421 + { required: true, message: '请输入', trigger: 'change' }
  422 + ],
  423 + configstarttime: [
  424 + { required: true, message: '请输入', trigger: 'change' }
  425 + ],
  426 + configendtime: [
  427 + { required: true, message: '请输入', trigger: 'change' }
  428 + ],
  429 + configstatus: [
  430 + { required: true, message: '请输入', trigger: 'change' }
  431 + ],
  432 + type: [
  433 + { required: true, message: '请输入', trigger: 'change' }
  434 + ],
  435 + creatdate: [
  436 + { required: true, message: '请输入', trigger: 'change' }
  437 + ],
  438 + updatedate: [
  439 + { required: true, message: '请输入', trigger: 'change' }
  440 + ],
  441 + entrytime: [
  442 + { required: true, message: '请输入', trigger: 'change' }
  443 + ],
  444 + departuretime: [
  445 + { required: true, message: '请输入', trigger: 'change' }
  446 + ],
  447 + customscode: [
  448 + { required: true, message: '请输入', trigger: 'change' }
  449 + ],
  450 + aircraftcode: [
  451 + { required: true, message: '请输入', trigger: 'change' }
  452 + ],
  453 + aircrafttype: [
  454 + { required: true, message: '请输入', trigger: 'change' }
  455 + ],
  456 + originstation: [
  457 + { required: true, message: '请输入', trigger: 'change' }
  458 + ],
  459 + destinationstation: [
  460 + { required: true, message: '请输入', trigger: 'change' }
  461 + ],
  462 + userid: [
  463 + { required: true, message: '请输入', trigger: 'change' }
  464 + ],
  465 + stayid: [
  466 + { required: true, message: '请输入', trigger: 'change' }
  467 + ],
  468 + crontask: [
  469 + { required: true, message: '请输入', trigger: 'change' }
  470 + ],
  471 + }
  472 + }
  473 + },
  474 + methods: {
  475 + //分页
  476 + handleSizeChange(val) {
  477 + this.pageSize=val;
  478 + this.submitForm();
  479 + },
  480 + handleCurrentChange(val) {
  481 + this.pageNum=val;
  482 + this.submitForm();
  483 + },
  484 + // 获取消息标签列表
  485 + submitForm() {
  486 + const _this = this
  487 + selectExact(this.queryConfigure).then((response) => {
  488 + const res = response.data
  489 + console.log(response.data)
  490 + if (res.code !== '200') {
  491 + return _this.$message.error('获取消息收发记录，失败！')
  492 + }
  493 + // 获取列表数据
  494 + _this.tableData = res.data.list
  495 + // 获取列表的总记录数
  496 + _this.total = res.data.total
  497 + _this.$message.success('获取消息收发记录，成功！')
  498 + }).catch(error => {
  499 + // 关闭加载
  500 + _this.$message.error(error.toString())
  501 + })
  502 + },
  503 + //新增编辑弹框关闭重置
  504 + configure_addDialogClosed() {
  505 + // 重置对话框
  506 + this.$refs.configure_editForm.resetFields()
  507 + },
  508 + // 打开新增
  509 + addForm() {
  510 + this.dialogStatus = 'create'
  511 + this.configure_dialog.addDialog = true
  512 + },
  513 + // 新增功能
  514 + configure_add() { // 进行表单的预验证
  515 + this.$refs.configure_editForm.validate(valid => {
  516 + // 未通过，表单预校验
  517 + if (!valid) return
  518 + addExact(this.configure_editForm).then((response) => {
  519 + const res = response.data
  520 + // 添加失败
  521 + if (res.code !== '200') {
  522 + // 关闭加载
  523 + return this.$message.error(res.msg)
  524 + }
  525 + // 添加，成功
  526 + this.$message.success(res.msg)
  527 + // 隐藏对话框
  528 + this.configure_dialog.addDialog = false
  529 + // 刷新列表
  530 + this.submitForm()
  531 + }).catch(error => {
  532 + this.$message.error(error.toString())
  533 + })
  534 + })
  535 + },
  536 + // 打开编辑
  537 + handleEdit(index, row) {
  538 + this.configure_editForm = Object.assign({}, row)
  539 + this.configure_dialog.addDialog = true
  540 + this.dialogStatus = 'update'
  541 + this.$nextTick(() => {
  542 + this.form = Object.assign({}, row)
  543 + })
  544 + },
  545 + // 编辑功能
  546 + configure_edit() {
  547 + // 进行表单的预验证
  548 + this.$refs.configure_editForm.validate(valid => {
  549 + // 未通过，表单预校验
  550 + if (!valid) return
  551 + ediExact(this.configure_editForm).then((response) => {
  552 + const res = response.data
  553 + if (res.code !== '200') {
  554 + return this.$message.error(res.msg)
  555 + }
  556 + this.$message.success(res.msg)
  557 + // 隐藏对话框
  558 + this.configure_dialog.addDialog = false
  559 + // 刷新列表
  560 + this.submitForm()
  561 + }).catch(error => {
  562 + this.$message.error(error.toString())
  563 + })
  564 + })
  565 + },
  566 + // 删除
  567 + handleDel(row) {
  568 + // 弹框询问是否删除？
  569 + this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
  570 + confirmButtonText: '确定删除',
  571 + cancelButtonText: '取消',
  572 + type: 'warning'
  573 + }
  574 + ).then(() => {
  575 + delExact(row).then((response) => {
  576 + console.log(row)
  577 + const res = response.data
  578 + if (res.code !== '200') {
  579 + return this.$message.error(res.msg)
  580 + }
  581 + this.$message.success(res.msg)
  582 + // 刷新列表
  583 + this.submitForm()
  584 + }).catch(error => {
  585 + this.$message.error(res.msg)
  586 + })
  587 + }).catch(() => {
  588 + })
  589 + },
  590 + // 过滤中英文
  591 + inputMe(e){
  592 + return e.replace(/[^a-zA-Z0-9.-]/g,'').toUpperCase();
  593 + }
  594 + },
  595 + //渲染方法
  596 + mounted(){
  597 + this.submitForm();
  598 +
  599 + }
  600 + }
  601 +</script>
  602 +
  603 +<style scoped>
  604 +
  605 +</style>
  1 +<template>
  2 + <el-container>
  3 + <el-main>
  4 + <el-row class="row-bg">
  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 :label-position="labelPosition" :model="queryConfigure" :rules="rules" ref="queryFlight"
  12 + label-width="130px" class="demo-ruleForm">
  13 + <el-row>
  14 + <el-col :span="4" >
  15 + <el-form-item label="承运人" prop="awcd" label-width="70px">
  16 + <el-input v-model="queryConfigure.awcd" style="width:120px"></el-input>
  17 + </el-form-item>
  18 + </el-col>
  19 + <el-col :span="4" >
  20 + <el-form-item label="航班号" prop="flightNo" label-width="70px">
  21 + <el-input v-model="queryConfigure.flightNo" style="width:120px"></el-input>
  22 + </el-form-item>
  23 + </el-col>
  24 + <el-col :span="5" >
  25 + <el-button type="primary" icon="el-icon-search" @click="submitForm()">查询</el-button>
  26 + <el-button type="success" icon="el-icon-edit" @click="addForm()">新增</el-button>
  27 +
  28 + </el-col>
  29 + </el-row>
  30 +
  31 + </el-form>
  32 + </el-row>
  33 + <!-- 表单区域-->
  34 + <el-row>
  35 + <el-table
  36 + :data="tableData"
  37 + border
  38 + v-loading="tableloading">
  39 + <el-table-column
  40 + prop="awcd"
  41 + label="承运人">
  42 + </el-table-column>
  43 + <el-table-column
  44 + prop="flightNo"
  45 + label="航班号">
  46 + </el-table-column>
  47 + <el-table-column
  48 + prop="customscode"
  49 + label="申报关区">
  50 + </el-table-column>
  51 + <el-table-column
  52 + prop="aircraftNo"
  53 + label="航空注册器编号">
  54 + </el-table-column>
  55 + <el-table-column
  56 + prop="transportflag"
  57 + label="航空器备案类型"
  58 + show-overflow-tooltip>
  59 + </el-table-column>
  60 + <el-table-column
  61 + prop="aircraftstand"
  62 + label="停机位">
  63 + </el-table-column>
  64 + <el-table-column
  65 + prop="departurePort"
  66 + label="航班起始站">
  67 + </el-table-column>
  68 + <el-table-column
  69 + prop="arrivalPort"
  70 + label="航班目的站">
  71 + </el-table-column>
  72 + <el-table-column
  73 + prop="departuredatetime"
  74 + label="预计出境时间">
  75 + </el-table-column>
  76 + <el-table-column
  77 + prop="arrivaldatetime"
  78 + label="预计入境时间">
  79 + </el-table-column><el-table-column
  80 + prop="validtime"
  81 + label="配置生效到期日">
  82 + </el-table-column>
  83 + <el-table-column
  84 + label="配置状态">
  85 + <template slot-scope="scope">
  86 + <span v-if="scope.row.status ==='0'">禁用</span>
  87 + <span v-if="scope.row.status ==='1'">生效</span>
  88 + </template>
  89 + </el-table-column>
  90 + <el-table-column
  91 + label="配置类型">
  92 + <template slot-scope="scope">
  93 + <span v-if="scope.row.type ==='2'">入境</span>
  94 + <span v-if="scope.row.type ==='1'">出境</span>
  95 + </template>
  96 + </el-table-column>
  97 + <el-table-column
  98 + prop="userid"
  99 + label="创建人">
  100 + </el-table-column>
  101 + <el-table-column
  102 + prop="creatdate"
  103 + label="创建时间">
  104 + </el-table-column>
  105 + <el-table-column
  106 + prop="updatedate"
  107 + label="配置更新时间">
  108 + </el-table-column>
  109 + <el-table-column
  110 + prop="meno"
  111 + label="备注">
  112 + </el-table-column>
  113 + <el-table-column
  114 + fixed="right"
  115 + prop=""
  116 + label="报文操作"
  117 + width="280">
  118 + <template slot-scope="scope">
  119 + <el-button
  120 + size="mini"
  121 + type="primary"
  122 + @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
  123 + <el-button
  124 + size="mini"
  125 + type="danger"
  126 + @click="handleDel(scope.$index, scope.row)">删除</el-button>
  127 + </template>
  128 + </el-table-column>
  129 + </el-table>
  130 + </el-row>
  131 + <el-row>
  132 + <div class="block">
  133 + <el-pagination
  134 + @size-change="handleSizeChange"
  135 + @current-change="handleCurrentChange"
  136 + :current-page="pageNum"
  137 + :page-sizes="[10, 20, 30, 40]"
  138 + :page-size="pageSize"
  139 + layout="total, sizes, prev, pager, next, jumper"
  140 + :total="total">
  141 + </el-pagination>
  142 + </div>
  143 + </el-row>
  144 +<!-- 新增编辑弹框-->
  145 + <el-row>
  146 + <el-dialog :title="dialogMap[dialogApply]" :visible.sync="configure_dialog.addDialog" width="80%" @close="configure_addDialogClosed">
  147 + <el-form :model="configure_addForm" :rules="rules" ref="configure_addForm">
  148 + <el-row>
  149 + <el-col :span="6" style="margin-top: 10px">
  150 + <el-form-item label="承运人" prop="awcd" label-width="120px">
  151 + <el-input v-model.trim="configure_addForm.awcd" @input="e => configure_addForm.awcd=inputMe(e)"
  152 + maxLength='2'></el-input>
  153 + </el-form-item>
  154 + </el-col>
  155 + <el-col :span="6" style="margin-top: 10px">
  156 + <el-form-item label="航班号" prop="flightNo" label-width="120px">
  157 + <el-input v-model="configure_addForm.flightNo" @input="e => configure_addForm.flightNo=inputMe(e)"></el-input>
  158 + </el-form-item>
  159 + </el-col>
  160 +
  161 + <el-col :span="6" style="margin-top: 10px">
  162 + <el-form-item label="申报关区" prop="customscode" label-width="120px">
  163 + <el-input v-model="configure_addForm.customscode" oninput="value=value.replace(/[^\d]/g,'')"
  164 + maxLength='4'></el-input>
  165 + </el-form-item>
  166 + </el-col>
  167 + <el-col :span="6" style="margin-top: 10px">
  168 + <el-form-item label="航空注册器编号" prop="aircraftNo" label-width="130px">
  169 + <el-input v-model="configure_addForm.aircraftNo"></el-input>
  170 + </el-form-item>
  171 + </el-col>
  172 +
  173 + </el-row>
  174 + <el-row>
  175 + <el-col :span="6">
  176 + <el-form-item label="航空器备案类型" prop="transportflag" label-width="140px">
  177 + <el-input v-model="configure_addForm.transportflag"
  178 + ></el-input>
  179 + </el-form-item>
  180 + </el-col>
  181 + <el-col :span="6">
  182 + <el-form-item label="停机位" prop="aircraftstand" label-width="120px">
  183 + <el-input v-model="configure_addForm.aircraftstand"></el-input>
  184 + </el-form-item>
  185 + </el-col>
  186 + <el-col :span="6">
  187 + <el-form-item label="航班起始站" prop="departurePort" label-width="120px">
  188 + <el-input v-model="configure_addForm.departurePort" @input="e => configure_addForm.departurePort=inputMe(e)"
  189 + maxLength='3'></el-input>
  190 + </el-form-item>
  191 + </el-col>
  192 + <el-col :span="6">
  193 + <el-form-item label="航班目的站" prop="arrivalPort" label-width="120px">
  194 + <el-input v-model="configure_addForm.arrivalPort" @input="e => configure_addForm.arrivalPort=inputMe(e)"
  195 + maxLength='3'></el-input>
  196 + </el-form-item>
  197 + </el-col>
  198 + <el-col :span="6">
  199 + <el-form-item label="预计出境时间" prop="departuredatetime" label-width="120px">
  200 + <el-date-picker
  201 + v-model="configure_addForm.departuredatetime"
  202 + type="datetime"
  203 + placeholder="选择日期时间"
  204 + value-format="yyyyMMddhhmmss"
  205 + format="yyyyMMddhhmmss"
  206 + style="width:100%">
  207 + </el-date-picker>
  208 + </el-form-item>
  209 + </el-col>
  210 + <el-col :span="6">
  211 + <el-form-item label="预计入境时间" prop="arrivaldatetime" label-width="120px">
  212 + <el-date-picker
  213 + v-model="configure_addForm.arrivaldatetime"
  214 + type="datetime"
  215 + placeholder="选择日期时间"
  216 + value-format="yyyyMMddhhmmss"
  217 + format="yyyyMMddhhmmss"
  218 + style="width:100%">
  219 + </el-date-picker>
  220 + </el-form-item>
  221 + </el-col>
  222 + <el-col :span="6">
  223 + <el-form-item label="配置生效到期日" prop="validtime" label-width="130px">
  224 + <el-date-picker
  225 + v-model="configure_addForm.validtime"
  226 + type="datetime"
  227 + placeholder="选择日期时间"
  228 + value-format="yyyyMMddhhmmss"
  229 + format="yyyyMMddhhmmss"
  230 + style="width: 100%"
  231 + :picker-options="pickerOptions">
  232 + </el-date-picker>
  233 + </el-form-item>
  234 + </el-col>
  235 + <el-col :span="6">
  236 + <el-form-item label="创建人" prop="userid" label-width="120px">
  237 + <el-input v-model="configure_addForm.userid"></el-input>
  238 + </el-form-item>
  239 + </el-col>
  240 +
  241 + <el-col :span="6">
  242 + <el-form-item label="配置类型" prop="type" label-width="120px">
  243 +<!-- <el-input v-model="configure_addForm.type"></el-input>-->
  244 + <el-select v-model="configure_addForm.type" placeholder="请选择" size="mini">
  245 + <el-option label="2-入境" value="2"></el-option>
  246 + <el-option label="1-出境" value="1"></el-option>
  247 + </el-select>
  248 + </el-form-item>
  249 + </el-col>
  250 + <el-col :span="6">
  251 + <el-form-item label="配置状态" prop="status" label-width="120px">
  252 + <!-- <el-input v-model="configure_addForm.status"></el-input>-->
  253 + <el-select v-model="configure_addForm.status" placeholder="请选择" size="mini">
  254 + <el-option label="0-禁用" value="0"></el-option>
  255 + <el-option label="1-生效" value="1"></el-option>
  256 + </el-select>
  257 + </el-form-item>
  258 + </el-col>
  259 + <el-col :span="6">
  260 + <el-form-item label="创建时间" prop="creatdate" label-width="120px">
  261 + <el-date-picker
  262 + v-model="configure_addForm.creatdate"
  263 + type="datetime"
  264 + placeholder="选择日期时间"
  265 + value-format="yyyyMMddhhmmss"
  266 + format="yyyyMMddhhmmss"
  267 + style="width: 100%"
  268 + :picker-options="pickerOptions">
  269 + </el-date-picker>
  270 + </el-form-item>
  271 + </el-col>
  272 + <el-col :span="6">
  273 + <el-form-item label="配置更新时间" prop="updatedate" label-width="120px">
  274 + <el-date-picker
  275 + v-model="configure_addForm.updatedate"
  276 + type="datetime"
  277 + placeholder="选择日期时间"
  278 + value-format="yyyyMMddhhmmss"
  279 + format="yyyyMMddhhmmss"
  280 + style="width: 100%"
  281 + :picker-options="pickerOptions">
  282 + </el-date-picker>
  283 + </el-form-item>
  284 + </el-col>
  285 + </el-row>
  286 + <el-row>
  287 + <el-col :span="12">
  288 + <el-form-item label="星期日期" prop="schedule.options" label-width="120px">
  289 + <el-select v-model="configure_addForm.schedule.options" multiple placeholder="请选择(可多选)" style="width: 100%">
  290 + <el-option
  291 + v-for="item in options"
  292 + :key="item.value"
  293 + :label="item.label"
  294 + :value="item.value">
  295 + </el-option>
  296 + </el-select>
  297 + </el-form-item>
  298 + </el-col>
  299 + <el-col :span="12">
  300 + <el-form-item label="备注" prop="meno" label-width="120px">
  301 + <el-input v-model="configure_addForm.meno"></el-input>
  302 + </el-form-item>
  303 + </el-col>
  304 + </el-row>
  305 +
  306 + </el-form>
  307 + <div slot="footer" class="dialog-footer">
  308 + <el-button @click="configure_dialog.addDialog = false" size="small">取 消</el-button>
  309 + <el-button type="primary" @click="dialogApply==='create'?configure_add():configure_edit()" size="small">提 交</el-button>
  310 + </div>
  311 + </el-dialog>
  312 + </el-row>
  313 + </el-main>
  314 + </el-container>
  315 +</template>
  316 +
  317 +
  318 +<script>
  319 + import {addPrePlanConfig, delPrePlanConfig, ediPrePlanConfig, selectPrePlanConfig,} from "../../api/transport";
  320 +
  321 + export default {
  322 + data(){
  323 + return{
  324 + pickerOptions: {
  325 + shortcuts: [{
  326 + text: '最近一周',
  327 + onClick(picker) {
  328 + const end = new Date();
  329 + const start = new Date();
  330 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  331 + picker.$emit('pick', [start, end]);
  332 + }
  333 + }, {
  334 + text: '最近一个月',
  335 + onClick(picker) {
  336 + const end = new Date();
  337 + const start = new Date();
  338 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  339 + picker.$emit('pick', [start, end]);
  340 + }
  341 + }, {
  342 + text: '最近三个月',
  343 + onClick(picker) {
  344 + const end = new Date();
  345 + const start = new Date();
  346 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  347 + picker.$emit('pick', [start, end]);
  348 + }
  349 + }]
  350 + },
  351 +
  352 + queryConfigure:{
  353 + flightNo:undefined,
  354 + awcd:undefined,
  355 + },
  356 + labelPosition:'left',
  357 + pageNum: 1,
  358 + pageSize:10,
  359 + total:0,
  360 + tableData:[],
  361 + tableloading:false,
  362 + dialogMap: {
  363 + update: '编辑',
  364 + create: '新增'
  365 + },
  366 + dialogApply: 'create',
  367 + configure_dialog: {
  368 + // 添加对话框
  369 + addDialog: false,
  370 + // 编辑对话框
  371 + editDialog: false
  372 + },
  373 + formLabelWidth: '220px',
  374 + configure_addForm: {
  375 + id:'',
  376 + awcd:'',
  377 + flightNo:'',
  378 + customscode:'',
  379 + aircraftNo:'',
  380 + transportflag:'',
  381 + aircraftstand:'',
  382 + departurePort:'',
  383 + arrivalPort:'',
  384 + departuredatetime:'',
  385 + arrivaldatetime:'',
  386 + validtime:'',
  387 + status:'',
  388 + type:'',
  389 + userid:'',
  390 + creatdate:'',
  391 + updatedate:'',
  392 + schedulelist:[],
  393 + schedule:{
  394 + id:'',
  395 + planconfigid:'',
  396 + //周几
  397 + weekday:'',
  398 + options:[]
  399 + }
  400 + },
  401 + options: [{
  402 + value: '1',
  403 + label: '周一'
  404 + }, {
  405 + value: '2',
  406 + label: '周二'
  407 + }, {
  408 + value: '3',
  409 + label: '周三'
  410 + }, {
  411 + value: '4',
  412 + label: '周四'
  413 + }, {
  414 + value: '5',
  415 + label: '周五'
  416 + }, {
  417 + value: '6',
  418 + label: '周六'
  419 + }, {
  420 + value: '7',
  421 + label: '周日'
  422 + }],
  423 + rules: {
  424 + awcd: [
  425 + { required: true, message: '请输入', trigger: 'change' }
  426 + ],
  427 + flightNo: [
  428 + { required: true, message: '请输入', trigger: 'change' }
  429 + ],
  430 + customscode: [
  431 + { required: true, message: '请输入', trigger: 'change' }
  432 + ],
  433 + aircraftNo: [
  434 + { required: true, message: '请输入', trigger: 'change' }
  435 + ],
  436 + transportflag: [
  437 + { required: true, message: '请输入', trigger: 'change' }
  438 + ],
  439 + aircraftstand: [
  440 + { required: true, message: '请输入', trigger: 'change' }
  441 + ],
  442 + departurePort: [
  443 + { required: true, message: '请输入', trigger: 'change' }
  444 + ],
  445 + arrivalPort: [
  446 + { required: true, message: '请输入', trigger: 'change' }
  447 + ],
  448 + departuredatetime: [
  449 + { required: true, message: '请输入', trigger: 'change' }
  450 + ],
  451 + arrivaldatetime: [
  452 + { required: true, message: '请输入', trigger: 'change' }
  453 + ],
  454 + validtime: [
  455 + { required: true, message: '请输入', trigger: 'change' }
  456 + ],
  457 + userid: [
  458 + { required: true, message: '请输入', trigger: 'change' }
  459 + ],
  460 + type: [
  461 + { required: true, message: '请输入', trigger: 'change' }
  462 + ],
  463 + status: [
  464 + { required: true, message: '请输入', trigger: 'change' }
  465 + ],
  466 + creatdate: [
  467 + { required: true, message: '请输入', trigger: 'change' }
  468 + ],
  469 + updatedate: [
  470 + { required: true, message: '请输入', trigger: 'change' }
  471 + ],
  472 + 'schedule.options': [
  473 + { required: true, message: '请输入', trigger: 'change' }
  474 + ],
  475 + }
  476 +
  477 + }
  478 + },
  479 + methods: {
  480 + //分页
  481 + handleSizeChange(val) {
  482 + this.pageSize=val;
  483 + },
  484 + handleCurrentChange(val) {
  485 + this.pageNum=val;
  486 + this.submitForm();
  487 + },
  488 +// 获取消息标签列表
  489 + submitForm() {
  490 + const _this = this
  491 + selectPrePlanConfig(this.queryConfigure).then((response) => {
  492 + const res = response.data
  493 + console.log(response.data)
  494 + if (res.code !== '200') {
  495 + return _this.$message.error('获取消息收发记录，失败！')
  496 + }
  497 + // 获取列表数据
  498 + _this.tableData = res.data.list
  499 + // 获取列表的总记录数
  500 + _this.total = res.data.total
  501 + _this.$message.success('获取消息收发记录，成功！')
  502 + }).catch(error => {
  503 + // 关闭加载
  504 + _this.$message.error(error.toString())
  505 + })
  506 + },
  507 +//新增编辑弹框关闭重置
  508 + configure_addDialogClosed() {
  509 + // 重置对话框
  510 + this.$refs.configure_addForm.resetFields()
  511 + },
  512 + // 打开新增
  513 + addForm() {
  514 + this.dialogStatus = 'create'
  515 + this.configure_dialog.addDialog = true
  516 + },
  517 + // 新增功能
  518 + configure_add() { // 进行表单的预验证
  519 + this.$refs.configure_addForm.validate(valid => {
  520 + // 未通过，表单预校验
  521 + if (!valid) return
  522 + console.log(this.configure_addForm);
  523 + addPrePlanConfig(this.configure_addForm).then((response) => {
  524 + const res = response.data
  525 + // 添加失败
  526 + if (res.code !== '200') {
  527 + // 关闭加载
  528 + return this.$message.error(res.msg)
  529 + }
  530 + // 添加，成功
  531 + this.$message.success(res.msg)
  532 + // 隐藏对话框
  533 + this.configure_dialog.addDialog = false
  534 + // 刷新列表
  535 + this.submitForm()
  536 + }).catch(error => {
  537 + this.$message.error(error.toString())
  538 + })
  539 + })
  540 + },
  541 + // 打开编辑
  542 + handleEdit(index, row) {
  543 + this.configure_addForm = Object.assign({}, row);
  544 + console.log(this.configure_addForm)
  545 + this.configure_addForm.schedule.options=[];
  546 + for(var obj in row.schedulelist){
  547 + console.log(this.configure_addForm.schedule.options.push(row.schedulelist[obj]['weekday']))
  548 + }
  549 + this.configure_dialog.addDialog = true
  550 + this.dialogApply = 'update'
  551 + this.$nextTick(() => {
  552 + this.configure_addForm = Object.assign({}, row)
  553 + })
  554 + },
  555 + // 编辑功能
  556 + configure_edit() {
  557 + // 进行表单的预验证
  558 + this.$refs.configure_addForm.validate(valid => {
  559 + // 未通过，表单预校验
  560 + if (!valid) return
  561 + ediPrePlanConfig(this.configure_addForm).then((response) => {
  562 + const res = response.data
  563 + if (res.code !== '200') {
  564 + return this.$message.error(res.msg)
  565 + }
  566 + this.$message.success(res.msg)
  567 + // 隐藏对话框
  568 + this.configure_dialog.addDialog = false
  569 + // 刷新列表
  570 + this.submitForm()
  571 + }).catch(error => {
  572 + this.$message.error(error.toString())
  573 + })
  574 + })
  575 + },
  576 + // 删除
  577 + handleDel(index,row) {
  578 + // 弹框询问是否删除？
  579 + this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
  580 + confirmButtonText: '确定删除',
  581 + cancelButtonText: '取消',
  582 + type: 'warning'
  583 + }
  584 + ).then(() => {
  585 + console.log(row)
  586 + delPrePlanConfig(row).then((response) => {
  587 +
  588 + const res = response.data
  589 + if (res.code !== '200') {
  590 + return this.$message.error(res.msg)
  591 + }
  592 + this.$message.success(res.msg)
  593 + // 刷新列表
  594 + this.submitForm()
  595 + }).catch(error => {
  596 + this.$message.error(res.msg)
  597 + })
  598 + }).catch(() => {
  599 + })
  600 + },
  601 + // 过滤中英文
  602 + inputMe(e){
  603 + return e.replace(/[^a-zA-Z0-9.-]/g,'').toUpperCase();
  604 + }
  605 + },
  606 + //渲染方法
  607 + mounted(){
  608 + this.submitForm();
  609 + }
  610 + }
  611 +</script>
  612 +
  613 +<style scoped>
  614 +
  615 +</style>