<template>
    <!--<div class="app-container">-->
    <div>
        <div>
            <el-row class="row-bg">
                <el-col :span="24">
                    <div class="grid-content content">航班信息</div>
                </el-col>
                <el-col :span="24">
                    <div class="grid-content co">
                        <el-col :span="1">
                            <div class="grid-content"></div>
                        </el-col>
                        <el-col :span="20">
                            <div class="grid-content">
                                <span class="titleSpan">航班号：{{this.preQuery.carrier}}{{this.preQuery.flightno}}</span>
                                <span class="titleSpan">航班日期：{{this.preQuery.flightdate}}</span>
                                <span class="titleSpan">航段：{{this.preQuery.originstation}}-{{this.preQuery.destinationstation}}</span>
                            </div>
                        </el-col>
                    </div>
                </el-col>
                <el-col :span="24">
                    <div class="grid-content content">预配舱单查询</div>
                </el-col>
                <el-col :span="22">
                    <div class="grid-content co">
                        <el-col :span="1">
                            <div class="grid-content"></div>
                        </el-col>
                        <el-col :span="22">
                            <div class="grid-content">
                                <el-col :span="4">
                                    <div class="grid-content">
                                        <el-input v-model="preQuery.awba"  placeholder="请输入主单号" clearable></el-input>
                                    </div>
                                </el-col>
                                <div class="grid-content el-btn">
                                    <el-button type="warning" style="width:150px" size="medium" icon="el-icon-search" @click="handleSerach">查询</el-button>
                                    <el-button v-if="preQuery.flightno === undefined && preData.length<1" type="primary"
                                               style="width:150px" size="medium" icon="el-icon-plus"
                                               @click="handleAddpre">新增预配舱单
                                    </el-button>
                                    <el-upload
                                            style="display: inline; margin-left: 10px;margin-right: 10px;"
                                            action=""
                                            :http-request="uploadFile"
                                            :limit=1
                                            :on-exceed="fileExceed"
                                            accept="application/vnd.ms-excel,application/vnd.ms-excels"
                                            ref="fileupload">
                                        <el-button slot="trigger" style="width:150px" size="medium" icon="el-icon-folder-add" type="success">导入excel</el-button>
                                    </el-upload>
                                </div>
                            </div>
                        </el-col>
                    </div>
                </el-col>
                <el-col :span="24">
                    <div class="grid-content content" style="margin-top: 6px">预配舱单明细</div>
                </el-col>
            </el-row>
        </div>

        <el-table :data="preData" stripe
                  style="border-radius: 10px 10px 0px 0px;line-height: 25px;" stripe
                  :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"
                    @selection-change="handleSelectionChange" v-loading="listLoading"
                  default-expand-all
                  row-key="uuid"
                  border
                  :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column label="运单号" width="200" align="center">
                <template slot-scope="scope">
                    <span class="tableInline" v-if="scope.row.awbh !==''">{{scope.row.awbh}}</span>
                    <span class="tableInline" v-else>{{scope.row.awba}}</span>
                </template>
            </el-table-column>
            <el-table-column label="运单件数/重量" width="100" align="center">
                <template slot-scope="scope">
                   {{scope.row.awbinfo.pcs}}/{{scope.row.awbinfo.weight}}
                </template>
            </el-table-column>
            <el-table-column label="预配件数/重量" width="100" align="center">
                <template slot-scope="scope">
                    {{scope.row.piece}}/{{scope.row.weight}}
                </template>
            </el-table-column>
            <el-table-column label="货物描述" width="120" align="center">
                <template slot-scope="scope">
                    {{scope.row.goodsname}}
                </template>
            </el-table-column>
            <el-table-column label="配载时间" width="140" align="center">
                <template slot-scope="scope">
                    {{scope.row.actime}}
                </template>
            </el-table-column>
            <el-table-column label="状态" width="100" align="center">
                <template slot-scope="scope">
                    <span v-if="scope.row.status ==='01'">接受申报</span>
                    <span v-if="scope.row.status ==='02'">待人工审核</span>
                    <span v-if="scope.row.status ==='03'">退单</span>
                    <span v-if="scope.row.status ==='05'">舱单报退单</span>
                    <span v-if="scope.row.status ==='06'">舱单转人工</span>
                    <span v-if="scope.row.status ==='07'">舱单报申报成功</span>
                    <span v-if="scope.row.status ==='08'">已发舱单删除报</span>
                    <span v-if="scope.row.status ==='09'">舱单删除报退单</span>
                    <span v-if="scope.row.status ==='10'">舱单删除报转人工</span>
                    <span v-if="scope.row.status ==='11'">放行</span>
                    <span v-if="scope.row.status ==='12'">拒装</span>
                    <span v-if="scope.row.status ==='13'">禁卸</span>
                    <span v-if="scope.row.status ==='14'">舱单修改报转人工</span>
                    <span v-if="scope.row.status ==='15'">舱单修改报成功</span>
                    <span v-if="scope.row.status ==='16'">海关已存在</span>
                    <span v-if="scope.row.status ==='21'">可自动发送</span>
                    <span v-if="scope.row.status ==='22'">未发送</span>
                    <span v-if="scope.row.status ==='23'">已发送新增报</span>
                    <span v-if="scope.row.status ==='24'">已发送删除报</span>
                    <span v-if="scope.row.status ==='25'">已发送修改报</span>
                </template>
            </el-table-column>
            <el-table-column prop="receipt" label="回执信息" align="center">
                <template slot-scope="scope">
                    {{scope.row.ext5}}
                </template>
            </el-table-column>
            <el-table-column label="操作" width="450px" fixed="right" align="center">
                <template slot-scope="scope" >
                    <el-row>
                        <el-col :span="5" style="margin-right: 10px">
                            <el-button type="warning" icon="el-icon-view" size="mini"@click="handleSend(scope.row)">收发明细</el-button>
                        </el-col>
                        <el-col :span="4" style="margin-right: 30px">
                            <el-button type="primary" icon="el-icon-edit" style="width: 100px" size="mini" @click="handleEdit(scope.row)" >编辑</el-button>
                        </el-col>
                        <el-col :span="5" style="margin-right: 10px">
                            <el-button type="info" icon="el-icon-edit" size="mini" @click="handleAwbStatus(scope.row)"
                                       :disabled="scope.row.status === '22'">更改状态
                            </el-button>
                        </el-col>
                        <el-col :span="5">
                            <el-button type="success" icon="el-icon-plus" size="mini" v-if="scope.row.awbh ===''"
                                       @click="handleAddAwbh(scope.row)">新增分单
                            </el-button>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="7" style="margin-right: 10px">
                            <el-button type="success" icon="el-icon-plus" size="mini" style="width: 130px"  @click="handleAwbSend(scope.row)"
                                       :disabled="addStatus(scope.row.status)">发送预配舱单报
                            </el-button>
                        </el-col>
                        <el-col :span="7" style="margin-right: 10px">
                            <el-button type="primary" icon="el-icon-plus" size="mini" style="width: 130px"  @click="handleAwbEdit(scope.row)"
                                       :disabled="editStatus(scope.row.status)">发送预配修改报</el-button>
                            <!--                    <el-button size="mini" type="danger" v-if="isAdmin"  @click="handleAwbDelete(scope.row)">删除运单</el-button>-->
                        </el-col>
                        <el-col :span="7">
                            <el-button type="danger" icon="el-icon-delete" size="mini" style="width: 130px;margin-bottom: 10px"  @click="handleSendDelete(scope.row)"
                                       :disabled="deleteStatus(scope.row.status)">发送预配删除报</el-button>
                        </el-col>
                    </el-row>

                </template>
            </el-table-column>
        </el-table>
        <div class="btnFoot">
            <el-row>
                <el-button type="primary" size="mini" v-if="preQuery.flightno !== undefined | preData.length > 0"
                           @click="handleAddpreInfo">新增预配舱单
                </el-button>
                <el-button type="primary" size="mini" @click="handelBackStep"
                           v-if="preQuery.flightno !== undefined || preData.length >0">返回
                </el-button>
            </el-row>
        </div>

        <pagination background layout="total, prev, pager, next" v-show="total>0" :total="total" :page.sync="preQuery.pageSize" :limit.sync="preQuery.limitSize"
                    @pagination="getList"/>

        <el-dialog  top="5vh" :title="dialogMap[dialogStatus]" :visible.sync="dialogFormVisible" width="90%">
            <el-form ref="preFormData" :model="preModel"  :rules="preRoles" label-position="right"
                     label-width="80px" size="mini" class="el-dialog-div">
                <div class="grid-content content" style="font-size: 10px">
                    运单信息
                </div>
                <el-row>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="awba">
                            <el-input :disabled="dialogStatus !== 'create'" v-model="awba" clearable>
                            <template  slot="prepend" >主单号</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5" v-if="fenStatus === 'addAwbh'">
                        <el-form-item label="" prop="awbh">
                            <el-input v-model="awbh" clearable>
                                <template  slot="prepend" >分单号</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <div class="grid-content content" style="font-size: 10px">
                    航班信息
                </div>
                <el-row>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="carrier">
                            <el-input v-model="carrier" :disabled="fenStatus === 'addAwbh'" clearable>
                            <template  slot="prepend" >承运人</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="flightno">
                            <el-input v-model="flightno" :disabled="fenStatus === 'addAwbh'" clearable>
                                <template  slot="prepend" >航班号</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="flightdate">
                            <el-date-picker :disabled="fenStatus === 'addAwbh'"
                                            value-format="yyyy-MM-dd" style="width: 270px"
                                            v-model="preModel.flightdate" align="right"
                                            type="date" placeholder="请输入航班日期" clearable/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="originstation">
                            <el-select
                                    filterable
                                    clearable
                                    placeholder="请选择起始站"
                                    :remote-method="remoteMethodAirport"
                                    allow-create remote
                                    v-model="originstation"
                                    :loading="airportLoading"
                            style="width: 270px">
                                <el-option v-for="item in airportCode"
                                           :key="item.airportid" :label="item.airportid"
                                           :value="item.airportid" :disabled="fenStatus === 'addAwbh'">
                                    <span style="float: left">{{ item.airportdescchn }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.airportid }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="destinationstation">
                            <el-select filterable clearable placeholder="请选择目的站" allow-create remote
                                       v-model="destinationstation" :remote-method="remoteMethodAirport" style="width: 270px">
                                <el-option v-for="item in airportCode"
                                           :key="item.airportid" :label="item.airportid"
                                           :value="item.airportid" :disabled="fenStatus === 'addAwbh'" >
                                    <span style="float: left">{{ item.airportdescchn }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.airportid }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <div class="grid-content content" style="font-size: 10px">
                    航程信息
                </div>
                <div>
                    <el-row>
                        <el-col :span="5">
                            <el-form-item label="" prop="carrier">
                                <el-input v-model="carrier" disabled clearable>
                                <template  slot="prepend" >承运人</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5">
                            <el-form-item label="" prop="destinationstation">
                                <el-input v-model="destinationstation" disabled clearable>
                                    <template  slot="prepend" >到达航站</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5">
                            <el-form-item label="">
                                <el-input v-model="by1" clearable>
                                    <template  slot="prepend" >承运人1</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5">
                            <el-form-item label="">
                                <el-input v-model="dest1" clearable>
                                    <template  slot="prepend" >到达航站1</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5">
                            <el-form-item label="">
                                <el-input v-model="by2" clearable>
                                    <template  slot="prepend" >承运人2</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5">
                            <el-form-item label="">
                                <el-input v-model="dest2" clearable>
                                    <template  slot="prepend" >到达航站2</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
                <div class="grid-content content" style="font-size: 10px">
                    货物信息
                </div>
                <el-row>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.pcs">
                            <el-input v-model="preModel.awbinfo.pcs" clearable>
                                <template  slot="prepend" >运单件数</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.weight">
                            <el-input v-model="preModel.awbinfo.weight" clearable>
                                <template  slot="prepend" >运单重量</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="goodsname">
                            <el-input v-model="goodsname" clearable>
                                <template  slot="prepend" >货物描述</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5" v-if="fenStatus !=='addAwbh'">
                        <el-form-item label="" prop="piece">
                            <el-input v-model="preModel.piece" clearable>
                                <template  slot="prepend" >预配件数</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5" v-if="fenStatus ==='addAwbh'">
                            <el-form-item label="" prop="piece">
                                <el-input v-model="preModel.piece" clearable>
                                    <template  slot="prepend" >预配件数</template>
                                </el-input>
                            </el-form-item>
                    </el-col>
                    <el-col :span="5" v-if="fenStatus !=='addAwbh'">
                        <el-form-item label="" prop="weight">
                            <el-input v-model="preModel.weight" clearable>
                                <template  slot="prepend" >预配重量</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5" v-if="fenStatus ==='addAwbh'">
                        <el-form-item label="" prop="weight">
                            <el-input v-model="preModel.weight" clearable>
                                <template  slot="prepend" >预配重量</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="actime">
                            <el-date-picker value-format="yyyy-MM-dd HH:mm:ss"
                                            v-model="preModel.actime" align="right" style="width: 180px"
                                            type="datetime" placeholder="请选择预配时间"/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item  label="" prop="customcode">
                            <el-select  v-model="preModel.customcode"  placeholder="请选择关区代码"
                                       filterable clearable :remote-method="remoteMethodCustomCode" :loading="customLoading" remote
                                       :disabled="fenStatus === 'addAwbh'">
                                <el-option v-for="item in customCodeList" :key="item.customcode" :label="item.customcode"
                                           :value="item.customcode">
                                    <span style="float: left">{{ item.customcode }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.customname }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="">
                            <el-select v-model="preModel.awbinfo.awbtype" class="filter-item" placeholder="请录入货物类型">
                                <el-option v-for="item in customTypes" :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.paymodel">
                            <el-select v-model="preModel.awbinfo.paymodel" class="filter-item" placeholder="请选择付费方式">
                                <el-option
                                        v-for="item in payTypes"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="">
                            <el-input v-model="specopeid" clearable>
                                <template  slot="prepend" >卸货地</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item  label="" prop="">
                            <el-input v-model="preModel.awbinfo.shpcustomerid" clearable>
                                <template  slot="prepend" >代理人代码</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="">
                                <el-input v-model="preModel.awbinfo.shpcustomerid" clearable>
                                    <template  slot="prepend" >代理人名称</template>
                                </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row style="margin-bottom: 10px">
                    <el-col :span="7"  v-if="fenStatus ==='addAwbh'">
                        <span>
                            货物剩余信息：
                        </span>
                    </el-col>
                    <el-col :span="7" v-if="fenStatus ==='addAwbh'">
                        <span>剩余件数:{{awbPiece}}</span>
                    </el-col>
                    <el-col :span="7" v-if="fenStatus ==='addAwbh'">
                        <span>剩余重量:{{awbWeight}}</span>
                    </el-col>
                </el-row>
                <div class="grid-content content" style="font-size: 10px">
                    发货人信息
                    <el-button type="primary" size="mini" @click="consignerSelect()">选择发货人信息</el-button>
                </div>
                <el-row>
                    <el-col :span="5">
                        <el-form-item  label="" prop="awbinfo.shprname">
                            <el-input v-model="shprname" clearable>
                                <template  slot="prepend" >发货人名称</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.shpraddress">
                            <el-input  v-model="shpraddress" clearable>
                                <template  slot="prepend" >地址</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="">
                            <el-input v-model="scityid" maxlength="5" clearable>
                                <template  slot="prepend" >城市代码</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="">
                            <el-input v-model="preModel.awbinfo.shprmobiletype" clearable>
                                <template  slot="prepend" >传真</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.shprcountyr">
                            <el-select
                                    :remote-method="remoteMethod"
                                    :loading="listLoading"
                                    v-model="shprcountyr"
                                    filterable
                                    allow-create
                                    remote
                                    placeholder="请选择国家代码" clearable>目的站
                                <el-option
                                        v-for="item in countryOption"
                                        :key="item.value"
                                        :label="item.value"
                                        :value="item.value">
                                    <span style="float: left">{{ item.label }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="awbinfo.shprtel">
                            <el-input  v-model="preModel.awbinfo.shprtel" clearable>
                                <template  slot="prepend" >电话</template>
                            </el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="7.5">
                        <el-form-item label="" prop="awbinfo.shpaeocode">
                            <el-input v-model="shpaeocode" clearable style="width: 270px">
                                <template  slot="prepend" >发货人AEO编码</template>
                            </el-input>
                        </el-form-item>
                    </el-col>

                    <!--<el-col :span="7.5">-->
                    <!--<el-form-item label="企业代码类型" prop="awbinfo.shpcomidpre">-->
                    <!--<el-select-->
                    <!--v-model="shpcomidpre"-->
                    <!--filterable-->
                    <!--placeholder="请选择企业代码类型" style="width: 200px;">-->
                    <!--<el-option-->
                    <!--v-for="item in shpCompnyTypeOption"-->
                    <!--:key="item.value"-->
                    <!--:label="item.label"-->
                    <!--:value="item.value"/>-->
                    <!--</el-select>-->
                    <!--</el-form-item>-->
                    <!--</el-col>-->
                    <!--<el-col :span="7.5">-->
                    <!--<el-form-item prop="awbinfo.shpcomidpno" label-width="10px">-->
                    <!--<el-input v-model="shpcomidpno" placeholder="企业代码"/>-->
                    <!--</el-form-item>-->
                    <!--</el-col>-->
                </el-row>
                <div class="grid-content content" style="font-size: 10px">
                    收货人信息
                    <el-button type="primary" size="mini" @click="consigneeSelect()">选择收货人信息</el-button>
                </div>
                <el-row>
                    <el-col :span="5">
                        <el-form-item  label="" prop="awbinfo.cnsnname">
                            <el-input v-model="cnsnname" clearable>
                                <template  slot="prepend" >收货人名称</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.cnsnaddress">
                            <el-input  v-model="cnsnaddress" clearable>
                                <template  slot="prepend" >地址</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="">
                            <el-input  v-model="ecityid" clearable maxlength="5">
                                <template  slot="prepend" >城市代码</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="">
                            <el-input v-model="preModel.awbinfo.cnsrmobiletype" clearable>
                                <template  slot="prepend" >传真</template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item label="" prop="awbinfo.cnscountyr">
                            <el-select
                                    :remote-method="remoteMethod"
                                    :listLoading="listLoading"
                                    v-model="cnscountyr"
                                    filterable
                                    allow-create
                                    remote
                                    placeholder="请选择国家代码" clearable>
                                <el-option
                                        v-for="item in countryOption"
                                        :key="item.value"
                                        :label="item.value"
                                        :value="item.value">
                                    <span style="float: left">{{ item.label }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7.5">
                        <el-form-item label="" prop="awbinfo.cnsntel">
                            <el-input  v-model="preModel.awbinfo.cnsntel" clearable>
                                <template  slot="prepend" >电话</template>
                            </el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="7.5">
                        <el-form-item  label="" prop="awbinfo.cnsaeocode">
                            <el-input v-model="cnsaeocode" clearable style="width: 270px">
                                <template  slot="prepend" >收货人AEO编码</template>
                            </el-input>
                        </el-form-item>
                    </el-col>

                </el-row>
                <el-row>
                        <el-col :span="6">
                            <el-form-item label="" prop="awbinfo.cnsrctcname">
                                <el-input v-model="cnsrctcname" clearable>
                                    <template  slot="prepend" >收货人名称</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="" prop="awbinfo.cnsrctctel">
                                <el-input v-model="preModel.awbinfo.cnsrctctel" clearable style="width: 270px">
                                    <template  slot="prepend" >收货人电话</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <!--<el-col :span="7.5">-->
                    <!--<el-form-item label="企业代码类型" prop="awbinfo.csgcustomerid">-->
                    <!--<el-select-->
                    <!--v-model="cnscomidpre"-->
                    <!--filterable-->
                    <!--placeholder="请选择企业代码类型" style="width: 200px;">-->
                    <!--<el-option-->
                    <!--v-for="item in shpCompnyTypeOption"-->
                    <!--:key="item.value"-->
                    <!--:label="item.label"-->
                    <!--:value="item.value"/>-->
                    <!--</el-select>-->
                    <!--</el-form-item>-->
                    <!--</el-col>-->
                    <!--<el-col :span="7.5">-->
                    <!--<el-form-item prop="awbinfo.cnscomidno" label-width="10px">-->
                    <!--<el-input v-model="cnscomidno" placeholder="企业代码"/>-->
                    <!--</el-form-item>-->
                    <!--</el-col>-->
                <div v-if="dialogStatus === 'sendUpdate'">
                    <div class="grid-content content">
                        运单信息
                    </div>
                    <el-row>
                        <el-col :span="6">
                            <el-form-item label="" prop="reason">
                                <el-input v-model="preModel.reason" clearable>
                                    <template  slot="prepend" >修改原因</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="" prop="contactName">
                                <el-input v-model="preModel.contactName" clearable>
                                    <template  slot="prepend" >修改人</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="" prop="contactTel">
                                <el-input v-model="preModel.contactTel" clearable maxlength="5">
                                    <template  slot="prepend" >修改人Tel</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>

            </el-form>
            <div slot="footer" class="dialog-footer" style="text-align: center">
                <el-button @click="dialogFormVisible = false" size="medium"
                           style="width: 100px;background-color: #6F8294;color: #ffffff">取消</el-button>
                <el-button type="success" size="medium" style="width: 100px" v-show="dialogStatus!=='sendUpdate'"
                           @click="dialogStatus ==='create'? createData():updateData()">保存</el-button>
                <el-button type="primary" size="medium" style="width: 100px" v-show="dialogStatus==='sendUpdate'" @click="sendUpdate()">发送</el-button>
            </div>
        </el-dialog>
        <el-dialog title="收发明细" :visible.sync="dialogTableVisible" width="70%">
            <el-table :data="detailData" border :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}"
                      style="border-radius: 10px 10px 0px 0px;line-height: 25px;width: 100%" size="small" >
                <el-table-column label="操作时间" width="150">
                    <template slot-scope="scope">
                        {{scope.row.busdate}}
                    </template>
                </el-table-column>
                <el-table-column label="航班号" width="80">
                    <template slot-scope="scope">
                        {{scope.row.carrier}}{{scope.row.flightno}}
                    </template>
                </el-table-column>
                <el-table-column label="航班日期" width="100">
                    <template slot-scope="scope">
                        {{scope.row.flightdate}}
                    </template>
                </el-table-column>
                <el-table-column label="件数" width="70">
                    <template slot-scope="scope">
                        {{scope.row.buspiece}}
                    </template>
                </el-table-column>
                <el-table-column label="重量" width="70">
                    <template slot-scope="scope">
                        {{scope.row.busweight}}
                    </template>
                </el-table-column>
                <el-table-column label="回执信息" width="">
                    <template slot-scope="scope">
                        {{scope.row.cusrestext}}
                    </template>
                </el-table-column>
                <el-table-column label="操作类型" width="100">
                    <template slot-scope="scope">
                        {{scope.row.opertype}}
                    </template>
                </el-table-column>
                <el-table-column label="操作人" width="100">
                    <template slot-scope="scope">
                        {{scope.row.operusername}}
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>
        <el-dialog title="删除原因" :visible.sync="dialogDeleteVisble" width="50%">
        <el-form ref="sendDeleteForm" :model="respModel" :rules="sendDeleteRules" label-width="120px"
                 style="margin-right:50px;">
            <el-form-item label="" prop="reason">
                <el-input v-model="respModel.reason" placeholder="删除原因">
                    <template  slot="prepend" >删除&nbsp;&nbsp;&nbsp;&nbsp;原因</template>
                </el-input>
            </el-form-item>
            <el-form-item label="" prop="contactName">
                <el-input v-model="respModel.contactName" placeholder="操作人姓名">
                    <template  slot="prepend" >删除操作人</template>
                </el-input>
            </el-form-item>
            <el-form-item label="" prop="contactTel">
                <el-input v-model="respModel.contactTel" placeholder="删除操作人联系方式">
                    <template  slot="prepend" >操作人&nbsp;&nbsp; &nbsp;Tel</template>
                </el-input>
            </el-form-item>
            <el-form-item label="">
                <el-input v-model="respModel.content" type="textarea" placeholder="请输入备注">
                </el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogDeleteVisble = false" size="medium"
                       style="width: 100px;background-color: #6F8294;color: #ffffff">取消</el-button>
            <el-button type="primary" size="medium" style="width: 100px" @click="sendDelete()">发送</el-button>
        </div>
    </el-dialog>

        <el-dialog title="发货人信息" :visible.sync="dialogSelectVisible" width="70%">
            <!--工具条-->
            <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
                <el-form :inline="true" :model="consignerQuery">
                    <el-form-item>
                        <el-input v-model="consignerQuery.companyName" placeholder="关键字查询" size="small"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" size="small" v-on:click="consignerSelect()">查询</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
            <el-table v-loading="listLoading" :data="consignerList" stripe
                      :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}"
                      style="border-radius: 10px 10px 0px 0px;line-height: 25px;width: 100%" size="small"
                      border >
                <el-table-column type="selection" width="55">
                </el-table-column>
                <el-table-column label="序号" type="index">
                </el-table-column>
                <el-table-column prop="companyName" label="发货人公司"  >
                </el-table-column>
                <el-table-column prop="conCity" label="发货人城市"  >
                </el-table-column>
                <el-table-column prop="country" label="发货人国家代码"  >
                </el-table-column>
                <el-table-column prop="conPhone" label="发货人电话"  >
                </el-table-column>
                <el-table-column prop="enterprise" label="发货人企业代码"  >
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button type="success" size="mini" @click="consignerClick(scope.row)">选择</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination background layout="total, prev, pager, next" v-show="consignerQuery.total>0" :total="consignerQuery.total" :page.sync="consignerQuery.pageSize" :limit.sync="consignerQuery.limitSize"
                        @pagination="consignerSelect()"/>
        </el-dialog>
        <el-dialog title="收货人信息" :visible.sync="dialogNeeVisible" width="70%">
            <!--工具条-->
            <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
                <el-form :inline="true" :model="consignerQuery">
                    <el-form-item>
                        <el-input v-model="consigneeQuery.companyName" placeholder="关键字查询" size="small"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" v-on:click="consigneeSelect()" size="small">查询</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
            <el-table v-loading="listLoading" :data="consigneeList" stripe
                      :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}"
                      style="border-radius: 10px 10px 0px 0px;line-height: 25px;width: 100%" size="small"
                      border >
                <el-table-column type="selection" width="55">
                </el-table-column>
                <el-table-column label="序号" type="index">
                </el-table-column>
                <el-table-column prop="companyName" label="收货人公司"  >
                </el-table-column>
                <el-table-column prop="conCity" label="收货人城市"  >
                </el-table-column>
                <el-table-column prop="country" label="收货人国家代码"  >
                </el-table-column>
                <el-table-column prop="conPhone" label="收货人电话"  >
                </el-table-column>
                <el-table-column prop="enterprise" label="收货人企业代码"  >
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button type="success" @click="consigneeClick(scope.row)" size="small">选择</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination background layout="total, prev, pager, next" v-show="consigneeQuery.total>0" :total="consigneeQuery.total" :page.sync="consigneeQuery.pageSize" :limit.sync="consigneeQuery.limitSize"
                        @pagination="consignerSelect()"/>
        </el-dialog>

    </div>
</template>
<script>
    import treeTable from '@/components/TreeTable'
    import treeToArray from '@/utils/customEval'
    import Pagination from '@/components/Pagination'
    import util from '@/common/js/util'
    import {getCountry, getByCountryCode, getByCountryCodeForName,getCustomCode,getAirportCode} from "@/api/country";
    import {
        getMt2201ListForParam,
        deleteByIsDelete,
        updateStatus,
        updateMT2201,
        addMt2201,
        sendCreateMt2201,
        sendDeleteMt2201,
        sendUpdateMt2201,
        uploadFileExcel
    } from '@/api/exitPre'
    import {Message} from "element-ui";
    import {getResponseForParam} from '@/api/responseDetail'
    import { getList} from '../../api/consigner/consigner';
    import { getList as neeList} from '../../api/consigner/consignee';
    import {
        validAwb,
        validAlphabets,
        validAlphabetsAndNum,
        validAlphabetsAndSpanceKey,
        validatorNum
    } from "@/utils/validate"

    export default {
        name: "ExitPre",
        components: {treeTable, Pagination},
        inject: ['reload'],
        data() {
            const validatorAwb = (rule, value, callback) => {
                if (!validAwb(value)) {
                    callback("请正确书写主单号")
                }
                callback()
            }
            const validatorAwbh = (rule, value, callback) => {
                if (!validAlphabetsAndNum(value)) {
                    callback("只能输入字母和数字")
                }
                callback()
            }
            const validatorAlphabets = (rule, value, callback) => {
                if (!validAlphabets(value)) {
                    callback("只能输入字母")
                }
                callback()
            }
            const validAlphabetsSpanceKey = (rule, value, callback) => {
                if (!validAlphabetsAndSpanceKey(value)) {
                    callback("只能输入字母、数字、空格")
                }
                callback()
            }
            const validatorNums = (rule, value, callback) => {
                if (!validatorNum(value)) {
                    callback("只能输入数字，并且小数位最多两位")
                }
                callback()
            }
            return {
                func: treeToArray,
                total: 1,
                isAdmin: false,
                consignerList: [],
                dialogNeeVisible: false,
                consigneeList: [],
                consignerQuery: {
                    companyName: '',
                    total: 0,
                    pageSize: 1,
                    limitSize: 5,
                },
                consigneeQuery: {
                    companyName: '',
                    total: 0,
                    pageSize: 1,
                    limitSize: 5,
                },
                dialogSelectVisible: false,
                preQuery: {
                    pageSize: 1,
                    limitSize: 30,
                    awba: undefined,
                    carrier: undefined,
                    flightno: undefined,
                    flightdate: undefined,
                    originstation: undefined,
                    destinationstation: undefined,
                    messageType: undefined
                },
                dialogMap: {
                    update: '编辑预配舱单',
                    create: '添加预配舱单',
                    addAwbh: '添加分单'
                },
                customTypes: [
                    {label: '普通货物', value: '001'},
                    {label: '国际转运货物', value: '002'},
                    {label: '国内转关', value: '003'},
                    {label: '空箱', value: '004'},
                    {label: '快件', value: '005'}],
                payTypes: [{label: '预付', value: '0'}, {label: '到付', value: '1'}],
                splitcodes: [{label: '是', value: 'T'}, {label: '否', value: 'P'}],
                customCodeList: [],
                airportCode:[],
                dialogStatus: undefined,
                fenStatus:undefined,
                dialogTableVisible: false,
                dialogDeleteVisble: false,
                listLoading: false,
                customLoading:false,
                airportLoading:false,
                disabledStatus: false,
                dialogFormVisible: false,
                countryOption: [],
                countryList: [],
                countryResultList: [],
                awbPiece: undefined,
                awbWeight: undefined,
                preRoles: {
                    weight: [{required: true, trigger: 'change', validator: validatorNums}],
                    piece: [{required: true, trigger: 'change', validator: validatorNums}],
                    destinationstation: [{required: true, trigger: 'blur', validator: validatorAlphabets}],
                    originstation: [{required: true, trigger: 'blur', validator: validatorAlphabets}],
                    flightdate: [{required: true, message: '航班日期必须输入', trigger: 'change'}],
                    carrier: [{required: true, trigger: 'blur', validator: validatorAwbh}],
                    flightno: [{required: true, trigger: 'blur', validator: validatorAwbh}],
                    actime: [{required: true, trigger: 'blur', message: '预配时间不能为空'}],
                    customcode: [{required: true, message: '关区代码必须选择', trigger: 'change'}],
                    awba: [{required: true, trigger: 'blur', validator: validatorAwb}],
                    awbh: [{required: true, trigger: 'blur', validator: validatorAwbh}],
                    'awbinfo.paymodel': [{required: true, message: '付款方式必选', trigger: 'change'}],
                    goodsname: [{required: true, trigger: 'change', validator: validAlphabetsSpanceKey}],
                    ex5: [{required: true, message: '货物描述不能为空', trigger: 'blur'}],
                    reason:[{required: true, message: '修改原因不能为空', trigger: 'blur'}],
                    contactName:[{required: true, message: '修改操作人不能为空', trigger: 'blur'}],
                    contactTel:[{required: true, message: '修改操作人联系方式不能为空', trigger: 'blur'}],
                    'awbinfo.sairportid': [{required: true, message: '起始航站不能为空', trigger: 'change'}],
                    'awbinfo.shprname': [{required: true, message: '发货人不能为空', trigger: 'change'}],
                    'awbinfo.shprtel': [{required: true, message: '发货电话不能为空', trigger: 'change'}],
                    'awbinfo.shpraddress': [{required: true, message: '发货地址不能为空', trigger: 'change'}],
                    'awbinfo.shprcountyr': [{required: true, message: '国家代码不能为空', trigger: 'change'}],
                    'awbinfo.cnsnname': [{required: true, message: '收货人不能为空', trigger: 'change'}],
                    'awbinfo.cnsntel': [{required: true, message: '收货电话不能为空', trigger: 'change'}],
                    'awbinfo.cnsnaddress': [{required: true, message: '收获地址不能为空', trigger: 'change'}],
                    'awbinfo.cnscountyr': [{required: true, message: '国家代码不能为空', trigger: 'change'}],
                    'awbinfo.weight': [{required: true, trigger: 'change', validator: validatorNums}],
                    'awbinfo.pcs': [{required: true, trigger: 'change', validator: validatorNums}],
                },
                preModel: {
                    uuid: undefined,
                    awba: undefined,
                    awbh: undefined,
                    customcode: undefined,
                    flightno: undefined,
                    carrier: undefined,
                    flightdate: undefined,
                    originstation: undefined,
                    destinationstation: undefined,
                    piece: undefined,
                    weight: undefined,
                    actime: undefined,
                    goodsname: undefined,
                    splitcode: undefined,
                    uldType: undefined,
                    uldNo: undefined,
                    status: undefined,
                    ex5: undefined,
                    reason: undefined,
                    contactName: undefined,
                    contactTel: undefined,
                    awbinfo: {
                        pcs: undefined,
                        weight: undefined,
                        scityid: undefined,
                        ecityid: undefined,
                        specopeid: undefined,
                        shprname: undefined,
                        shprmobiletype: undefined,
                        shprtel: undefined,
                        shpraddress: undefined,
                        shprcountyr: undefined,
                        shpcomidpre: undefined,
                        shpaeocode: undefined,
                        shpcomidpno: undefined,
                        shpcitycode: undefined,
                        shpcustomerid: undefined,
                        cnsnname: undefined,
                        cnsrmobiletype: undefined,
                        cnsntel: undefined,
                        cnsnaddress: undefined,
                        cnscountyr: undefined,
                        cnsrctcname: undefined,
                        cnsaeocode: undefined,
                        cnsrctctel: undefined,
                        cnscitycode: undefined,
                        cargonm: undefined,
                        sairportid: undefined,
                        dest1city: undefined,
                        by1: '',
                        dest1: undefined,
                        by2: undefined,
                        dest2: undefined,
                        by3: undefined,
                        dest3: undefined,
                        eairportid: undefined,
                        csgcustomerid: undefined,
                        paymodel: '0',
                        awbtype: undefined
                    },
                    user: {
                        username: this.username
                    }
                },
                respModel: {
                    uuid: undefined,
                    reason: undefined,
                    contactName: undefined,
                    contactTel: undefined,
                    content: '',
                    flightNo: undefined,
                    awba: undefined,
                    customCode: undefined,
                    flightDate: undefined,
                    awbh: ''
                },
                sendDeleteRules:{
                    reason:[{required:true,message:'删除原因不能为空',trigger:'blur'}],
                    contactName:[{required:true,message:'删除操作人不能为空',trigger:'blur'}],
                    contactTel:[{required:true,message:'操作人联系方式不能为空',trigger:'blur'}]
                },
                preData: [],
                detailData: [],
                rows:[]
            }
        },
        mounted() {
            // 延迟加载，否则会出错
            setTimeout(() => {
                this.countryResultList = this.countryList.map(item => {
                    return {value: item.countryCode, label: item.countryNameCn}
                })
            }, 1000)
        },
        created() {
            if (this.$route.params.flightData !== undefined) {
                this.preQuery.carrier = this.$route.params.flightData.flightno.substring(0, 2)
                this.preQuery.flightno = this.$route.params.flightData.flightno.substring(2)
                this.preQuery.flightdate = this.$route.params.flightData.flightdate
                this.preQuery.originstation = this.$route.params.flightData.originstation
                this.preQuery.destinationstation = this.$route.params.flightData.destinationstation
                if (this.$route.params.flightData.awba !== undefined && this.$route.params.flightData.awba !== '') {
                    this.preQuery.awba = this.$route.params.flightData.awba.substring(0, 3) + "-" + this.$route.params.flightData.awba.substring(3)
                }
                this.getList()
            }
            this.getCountryList()
            let username = JSON.parse(sessionStorage.getItem('user')).username
            if (username === 'admin') {
                this.isAdmin = true
            }
        },

        // 验证
        computed: {
            awba: {
                get: function () {
                    return this.preModel.awba
                },
                set: function (val) {
                    if (val.length == 3) {
                        val = val + "-"
                    }
                    this.preModel.awba = val.trim()
                }
            },
            awbh: {
                get: function () {
                    return this.preModel.awbh
                },
                set: function (val) {
                    this.preModel.awbh = val.toUpperCase().trim()
                }
            },
            flightno: {
                get: function () {
                    return this.preModel.flightno
                },
                set: function (val) {
                    this.preModel.flightno = val.toUpperCase().trim()
                }
            },
            carrier: {
                get: function () {
                    return this.preModel.carrier
                },
                set: function (val) {
                    this.preModel.carrier = val.toUpperCase().trim()
                }
            },
            originstation: {
                get: function () {
                    return this.preModel.originstation
                },
                set: function (val) {
                    this.preModel.originstation = val.toUpperCase().trim()
                }
            },
            destinationstation: {
                get: function () {
                    return this.preModel.destinationstation
                },
                set: function (val) {
                    this.preModel.destinationstation = val.toUpperCase().trim()
                }
            },

            goodsname: {
                get: function () {
                    return this.preModel.goodsname
                },
                set: function (val) {
                    this.preModel.goodsname = val.toUpperCase()
                }
            },
            specopeid: {
                get: function () {
                    return this.preModel.awbinfo.specopeid
                },
                set: function (val) {
                    this.preModel.awbinfo.specopeid = val.toUpperCase().trim()
                }
            },
            shprname: {
                get: function () {
                    return this.preModel.awbinfo.shprname
                },
                set: function (val) {
                    this.preModel.awbinfo.shprname = val.toUpperCase()
                }
            },
            shpraddress: {
                get: function () {
                    return this.preModel.awbinfo.shpraddress
                },
                set: function (val) {
                    this.preModel.awbinfo.shpraddress = val.toUpperCase()
                }
            },
            shprcountyr: {
                get: function () {
                    return this.preModel.awbinfo.shprcountyr
                },
                set: function (val) {
                    this.preModel.awbinfo.shprcountyr = val.toUpperCase().trim()
                }
            },
            shpaeocode: {
                get: function () {
                    return this.preModel.awbinfo.shpaeocode
                },
                set: function (val) {
                    this.preModel.awbinfo.shpaeocode = val.toUpperCase()
                }
            },
            scityid: {
                get: function () {
                    return this.preModel.awbinfo.scityid
                },
                set: function (val) {
                    this.preModel.awbinfo.scityid = val.toUpperCase().trim()
                }
            },
            ecityid: {
                get: function () {
                    return this.preModel.awbinfo.ecityid
                },
                set: function (val) {
                    this.preModel.awbinfo.ecityid = val.toUpperCase().trim()
                }
            },
            cnsnname: {
                get: function () {
                    return this.preModel.awbinfo.cnsnname
                },
                set: function (val) {
                    this.preModel.awbinfo.cnsnname = val.toUpperCase()
                }
            },
            cnsnaddress: {
                get: function () {
                    return this.preModel.awbinfo.cnsnaddress
                },
                set: function (val) {
                    this.preModel.awbinfo.cnsnaddress = val.toUpperCase()
                }
            },
            cnscountyr: {
                get: function () {
                    return this.preModel.awbinfo.cnscountyr
                },
                set: function (val) {
                    this.preModel.awbinfo.cnscountyr = val.toUpperCase()
                }
            },
            cnsrctcname: {
                get: function () {
                    return this.preModel.awbinfo.cnsrctcname
                },
                set: function (val) {
                    this.preModel.awbinfo.cnsrctcname = val.toUpperCase().trim()
                }
            },
            cnsaeocode: {
                get: function () {
                    return this.preModel.awbinfo.cnsaeocode
                },
                set: function (val) {
                    this.preModel.awbinfo.cnsaeocode = val.toUpperCase().trim()
                }
            },
            by1: {
                get: function () {
                    return util.checkNull(this.preModel.awbinfo.by1)?this.preModel.awbinfo.by1:''
                },
                set: function (val) {
                    this.preModel.awbinfo.by1 = util.checkNull(val)?val.toUpperCase().trim():''
                }
            },
            dest1: {
                get: function () {
                    return this.preModel.awbinfo.dest1
                },
                set: function (val) {
                    this.preModel.awbinfo.dest1 = val.toUpperCase().trim()
                }
            },
            by2: {
                get: function () {
                    return this.preModel.awbinfo.by2
                },
                set: function (val) {
                    this.preModel.awbinfo.by2 = val.toUpperCase().trim()
                }
            },
            dest2: {
                get: function () {
                    return this.preModel.awbinfo.dest2
                },
                set: function (val) {
                    this.preModel.awbinfo.dest2 = val.toUpperCase().trim()
                }
            },
            by3: {
                get: function () {
                    return this.preModel.awbinfo.by3
                },
                set: function (val) {
                    this.preModel.awbinfo.by3 = val.toUpperCase().trim()
                }
            },
            dest3: {
                get: function () {
                    return this.preModel.awbinfo.dest3
                },
                set: function (val) {
                    this.preModel.awbinfo.dest3 = val.toUpperCase().trim()
                }
            },
        },
        methods: {
            // >>>>>>>>>>>>>>>>获取list集合<<<<<<<<<<<<<<<<<<
            getList() {
                this.listLoading = true
                if (this.preQuery.awba !== undefined && this.preQuery.awba !== '') {
                    getMt2201ListForParam(this.preQuery).then(res => {
                        this.preData = res.data.data.list
                        this.total = res.data.data.total
                        if (res.data.data.list.length > 0) {
                            this.preQuery.carrier = this.preData[0].carrier
                            this.preQuery.flightno = this.preData[0].flightno
                            this.preQuery.flightdate = this.preData[0].flightdate
                            this.preQuery.originstation = this.preData[0].originstation
                            this.preQuery.destinationstation = this.preData[0].destinationstation
                            this.preQuery.customcode = this.preData[0].customcode
                        }
                        setTimeout(() => {
                            this.listLoading = false
                        }, 1500)
                    })
                } else {
                    getMt2201ListForParam(this.preQuery).then(res => {
                        this.preData = res.data.data.list

                        this.total = res.data.data.total
                        setTimeout(() => {
                            this.listLoading = false
                        }, 1500)
                    })
                }
            },
            // >>>>>>>>>>>>>>>>重置实体<<<<<<<<<<<<<<<<<<
            restModel() {
                this.preModel = {
                    awba: undefined,
                    awbh: undefined,
                    customcode: undefined,
                    flightno: undefined,
                    carrier: undefined,
                    flightdate: undefined,
                    originstation: undefined,
                    destinationstation: undefined,
                    piece: undefined,
                    weight: undefined,
                    goodsname: undefined,
                    splitcode: undefined,
                    uldType: undefined,
                    uldNo: undefined,
                    status: undefined,
                    ex5: undefined,
                    awbinfo: {
                        pcs: undefined,
                        weight: undefined,
                        specopeid: undefined,
                        scityid: undefined,
                        ecityid: undefined,
                        shprname: undefined,
                        shprmobiletype: undefined,
                        shprtel: undefined,
                        shpraddress: undefined,
                        shprcountyr: undefined,
                        shpcomidpre: undefined,
                        shpaeocode: undefined,
                        shpcomidpno: undefined,
                        shpcitycode: undefined,
                        shpcustomerid: undefined,
                        cnsnname: undefined,
                        cnsrmobiletype: undefined,
                        cnsntel: undefined,
                        cnsnaddress: undefined,
                        cnscountyr: undefined,
                        cnscomidpre: undefined,
                        cnscomidno: undefined,
                        cnsrctcname: undefined,
                        cnsaeocode: undefined,
                        cnsrctctel: undefined,
                        cnscitycode: undefined,
                        cargonm: undefined,
                        sairportid: undefined,
                        dest1city: undefined,
                        by1: undefined,
                        dest1: undefined,
                        by2: undefined,
                        dest2: undefined,
                        by3: undefined,
                        dest3: undefined,
                        eairportid: undefined,
                        csgcustomerid: undefined,
                        paymodel: '0',
                    },
                    user: {
                        username : JSON.parse(sessionStorage.getItem('user')).username
                    }
                }
            },
            // >>>>>>>>>>>>>>>>新增主单<<<<<<<<<<<<<<<<<<
            handleAddpreInfo() {

                this.fenStatus=undefined;
                this.restModel()
                this.preModel.carrier = this.preQuery.carrier
                this.preModel.flightno = this.preQuery.flightno
                this.preModel.flightdate = this.preQuery.flightdate
                this.preModel.originstation = this.preQuery.originstation
                this.preModel.destinationstation = this.preQuery.destinationstation
                this.preModel.customcode = this.preQuery.customcode
                this.dialogStatus = 'create'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs.preFormData.clearValidate()
                })
            },
            createData() {
                this.$refs.preFormData.validate(valid => {
                    if (valid) {
                        addMt2201(this.preModel).then(res => {
                            if (res.data.count > 0) {
                                Message.success("新增成功")
                                this.dialogFormVisible = false
                                this.getList()
                            } else {
                                Message.error("新增失败，请检查数据")
                            }
                        })
                    }
                })
            },
            // >>>>>>>>>>>>>>>>多选<<<<<<<<<<<<<<<<<<
            handleSelectionChange() {

            },
            // 远程获取发货人信息
            consignerSelect(){
                this.dialogSelectVisible = true;
                this.listLoading = true;
                let para = {
                    pageSize: this.consignerQuery.pageSize,
                    limitSize: this.consignerQuery.limitSize,
                    companyName: this.consignerQuery.companyName
                };
                getList(para).then((res) => {
                    this.consignerQuery.total = res.data.data.total;
                    this.consignerList = res.data.data.list;
                    this.listLoading = false;
                }).catch((error) => {
                    this.listLoading = false;
                    if(null!= error.response && error.response!==undefined){
                        let status= error.response.status;
                        let msg = error.response.statusText;
                        alert(status+msg);
                    }else {
                        alert(error);
                    }

                });
            },
            // 远程获取收货人信息
            consigneeSelect(){
                this.dialogNeeVisible = true;
                this.listLoading = true;
                let para = {
                    pageSize: this.consigneeQuery.pageSize,
                    limitSize: this.consigneeQuery.limitSize,
                    companyName: this.consigneeQuery.companyName
                };
                neeList(para).then((res) => {
                    this.consigneeQuery.total = res.data.data.total;
                    this.consigneeList = res.data.data.list;
                    this.listLoading = false;
                }).catch((error) => {
                    this.listLoading = false;
                    if(null!= error.response && error.response!==undefined){
                        let status= error.response.status;
                        let msg = error.response.statusText;
                        alert(status+msg);
                    }else {
                        alert(error);
                    }

                });
            },
            // 发货人信息赋值
            consignerClick(val){
                this.preModel.awbinfo.shprname=val.conName;
                this.preModel.awbinfo.shpraddress=val.conAddress;
                this.preModel.awbinfo.scityid=val.conCity;
                this.preModel.awbinfo.shprtel=val.conPhone;
                this.preModel.awbinfo.shpaeocode=val.conAeo;
                this.preModel.awbinfo.shprcountyr=val.country;
                this.dialogSelectVisible = false;
            },
            // 收货人信息赋值
            consigneeClick(val){
                console.log(val);
                this.preModel.awbinfo.cnsnname=val.conName;
                this.preModel.awbinfo.cnsnaddress=val.conAddress;
                this.preModel.awbinfo.ecityid=val.conCity;
                this.preModel.awbinfo.cnsntel=val.conPhone;
                this.preModel.awbinfo.cnsaeocode=val.conAeo;
                this.preModel.awbinfo.cnscountyr=val.country;
                this.dialogNeeVisible = false;
            },
            // >>>>>>>>>>>>>>>>搜索<<<<<<<<<<<<<<<<<<
            handleSerach() {
                // this.preQuery.flightno = undefined
                // this.preQuery.carrier = undefined
                // this.preQuery.originstation = undefined
                // this.preQuery.flightdate = undefined
                // this.preQuery.destinationstation = undefined
                this.getList()
            },
            // >>>>>>>>>>>>>>>>收发明细<<<<<<<<<<<<<<<<<<
            handleSend(row) {
                const resQuery = {
                    carrier: row.carrier,
                    flightno: row.flightno,
                    flightdate: row.flightdate,
                    orpertype: row.orpertype,
                    awba: row.awba,
                    awbh: row.awbh,
                    messageType: 'MT2201'
                }
                this.dialogTableVisible = true
                getResponseForParam(resQuery).then(res => {
                    this.detailData = res.data
                })
            },
            // >>>>>>>>>>>>>>>>发送舱单报<<<<<<<<<<<<<<<<<<
            handleAwbSend(row) {
                delete row.parent
                delete row.children
                this.rows = row;
                this.$confirm("是否发送", "确认消息", {
                    distinguishCancelAndClose: true,
                    confirmButtonText: '发送',
                    cancelButtonText: '取消'
                }).then(() => {
                    if (row.awbh === null) {
                        row.awbh = ''
                    }
                    row.user = {
                        username : JSON.parse(sessionStorage.getItem('user')).username
                    }
                    sendCreateMt2201(row).then(res => {
                        if (res.data.count > 0) {
                            Message.success(res.data.respMessage)
                            this.rows.status="23";
                            this.rows.ext5="新增报发送成功";
                        } else {
                            Message.error(res.data.respMessage)
                        }
                    })
                })
            },
            // 发送舱单报 按钮自灰
            addStatus(status){
                if(status=='23' || status=='24'||status=='25'){
                    return true;
                }else if(status=='22' ) {
                    return false;
                }
            },
            // >>>>>>>>>>>>>>>>更新运单数据<<<<<<<<<<<<<<<<<<
            handleEdit(row) {
                this.dialogStatus = undefined;
                this.fenStatus = undefined;
                this.preModel = Object.assign({}, row)
                this.dialogStatus = 'update'
                if (row.awbh !== undefined && row.awbh !== ""){
                    this.fenStatus = 'addAwbh'
                }

                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs.preFormData.clearValidate()
                })
            },
            updateData() {
                let _this = this;
                this.$refs.preFormData.validate(valid => {
                    if (valid) {
                        delete this.preModel.parent
                        delete this.preModel.children
                        _this.preModel.user= {
                            username : JSON.parse(sessionStorage.getItem('user')).username
                        }

                        updateMT2201(_this.preModel).then(res => {
                            if (res.data.count > 0) {
                                Message.success("修改成功")
                                this.dialogFormVisible = false
                                this.getList()
                            } else {
                                Message.error("修改失败，请检查数据")
                            }
                        })
                    }
                })
            },
            // >>>>>>>>>>>>>>>>发送修改报<<<<<<<<<<<<<<<<<<
            handleAwbEdit(row) {
                delete row.parent
                delete row.children
                this.rows = row;
                this.preModel = Object.assign({}, row)
                this.dialogStatus = 'sendUpdate'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs.preFormData.clearValidate()
                })
            },
            // 发送修改报自灰
            editStatus(status){
                if(status=='23' || status=='24'||status=='25'){
                    return true;
                }else if(status=='25' ) {
                    return false;
                }
            },
            sendUpdate(){
                this.respModel.reason = this.preModel.reason
                this.respModel.contactName = this.preModel.contactName
                this.respModel.contactTel = this.preModel.contactTel
                //
                delete this.preModel._expanded
                delete this.preModel._level
                delete this.preModel._marginLeft
                delete this.preModel._show
                delete this.preModel._width

                const reason = this.preModel.reason
                const contactName = this.preModel.contactName
                const contactTel = this.preModel.contactTel
                const username = JSON.parse(sessionStorage.getItem('user')).username


                this.$refs.preFormData.validate(valid =>{
                    if(valid){
                        delete this.preModel.reason
                        delete this.preModel.contactName
                        delete this.preModel.contactTel
                        const map = {
                            'mt2201': this.preModel,
                            'reason' : reason,
                            'contactName': contactName,
                            'contactTel':  contactTel,
                            'username': username,
                        }
                        sendUpdateMt2201(map).then(res =>{
                            if(res.data.count >0){
                                Message.success(res.data.respMessage)
                                this.rows.status="25";
                                this.rows.ext5="修改报发送成功";
                                this.dialogFormVisible = false
                            }else {
                                Message.error(res.data.respMessage)
                            }
                        })
                    }
                })
            },

            // >>>>>>>>>>>>>>>>发送删除报<<<<<<<<<<<<<<<<<<
            handleSendDelete(row) {
                this.respModel = {
                    carrier: undefined,
                    reason: undefined,
                    contactName: undefined,
                    contactTel: undefined,
                    content: '',
                    flightNo: undefined,
                    awba: undefined,
                    customCode: undefined,
                    flightDate: undefined,
                    awbh: '',
                    username: JSON.parse(sessionStorage.getItem('user')).username,
                }
                this.rows = row;
                this.dialogDeleteVisble = true
                this.respModel.awba = row.awba
                this.respModel.flightNo = row.flightno
                this.respModel.customCode = row.customcode
                this.respModel.awbh = row.awbh
                this.respModel.flightDate = row.flightdate
                this.respModel.carrier = row.carrier
                this.$nextTick(()=>{
                    this.$refs.sendDeleteForm.clearValidate()
                })
            },
            // 发送删除报按钮自灰
            deleteStatus(status){
                if(status=='23' || status=='24'||status=='25'){
                    return true;
                }else if(status=='24' ) {
                    return false;
                }
            },
            sendDelete() {
                this.$refs.sendDeleteForm.validate(valid =>{
                    if(valid){
                        sendDeleteMt2201(this.respModel).then(res => {
                            if(res.data.count>0){
                                Message.success(res.data.respMessage)
                                this.dialogDeleteVisble = false
                                this.rows.status="24";
                                this.rows.ext5="删除报发送成功";
                            }else {
                                Message.error(res.data.respMessage)
                            }
                        })
                    }
                })
            },
            //>>>>>>>>>>>>>>>>删除运单<<<<<<<<<<<<<<<<<<
            handleAwbDelete(row) {
                delete row.parent
                delete row.children
                this.$confirm("是否删除", "确认消息", {
                    distinguishCancelAndClose: true,
                    confirmButtonText: '删除',
                    cancelButtonText: '取消'
                }).then(() => {
                    deleteByIsDelete(row).then(res => {
                        if (res.data.count > 0) {
                            this.$message({
                                type: 'success',
                                message: '删除成功'
                            })
                            this.getList()
                        } else {
                            this.$message({
                                type: 'danger',
                                message: '删除异常，请稍后重试'
                            })
                        }
                    })
                }).catch(action => {
                    this.$message({
                        type: 'info',
                        message: action === 'cancel'
                            ? '取消删除'
                            : '删除取消'
                    })
                })
            },
            // >>>>>>>>>>>>>>>>更改运单状态<<<<<<<<<<<<<<<<<<
            handleAwbStatus(row) {
                this.$confirm("是否发送更改状态", "确认消息", {
                    distinguishCancelAndClose: true,
                    confirmButtonText: '确认更改',
                    cancelButtonText: '取消更改'
                }).then(() => {
                    if (row.status!==22){
                        row.status =22;
                    }
                    // updateStatus(row).then(res => {
                    //     if (res.data.count > 0) {
                    //         this.$message({
                    //             type: 'success',
                    //             message: '当前运单状态已更改'
                    //         })
                    //         this.getList()
                    //     } else {
                    //         this.$message({
                    //             type: 'error',
                    //             message: '状态更改失败，请稍后重试'
                    //         })
                    //     }
                    // })

                }).catch(action => {
                    this.$message({
                        type: 'info',
                        message: action === 'cancel'
                            ? '取消状态更改'
                            : '状态更改取消'
                    })
                })
            },
            // >>>>>>>>>>>>>>>>新增分单<<<<<<<<<<<<<<<<<<
            handleAddAwbh(row) {
                this.restModel()
                const template = Object.assign({}, row) // copy obj
                this.preModel.uuid = template.uuid
                this.preModel.awba = template.awba
                this.preModel.flightdate = template.flightdate
                this.preModel.flightno = template.flightno
                this.preModel.destinationstation = template.destinationstation
                this.preModel.customcode = template.customcode
                this.preModel.carrier = template.carrier
                this.preModel.awbinfo.shprcountyr = template.awbinfo.shprcountyr
                this.preModel.originstation = template.originstation
                this.preModel.awbinfo.paymodel = template.awbinfo.paymodel
                this.preModel.awbinfo.sairportid = template.awbinfo.sairportid
                this.preModel.awbinfo.eairportid = template.awbinfo.eairportid
                this.preModel.awbinfo.ex5 = template.awbinfo.ex5
                this.preQuery.awba = template.awba
                this.preQuery.flightdate = template.flightdate
                this.preQuery.flightno = template.flightno
                this.preQuery.originstation = template.originstation
                this.preQuery.destinationstation = template.destinationstation
                this.preQuery.customcode = template.customcode
                this.preQuery.carrier = template.carrier
                getMt2201ListForParam(this.preQuery).then(res => {
                    this.awbPiece = 0
                    this.awbWeight = 0
                    let residuePiece = 0
                    let residueWeight = 0
                    const childrenList = res.data.dataList[0].children

                    if (childrenList.length < 1) {
                        this.awbPiece = res.data.dataList[0].piece
                        this.awbWeight = res.data.dataList[0].weight
                    } else {
                        for (var i = 0; i < childrenList.length; i++) {
                            residuePiece += childrenList[i].piece
                            residueWeight += childrenList[i].weight
                        }
                        this.awbPiece = res.data.dataList[0].piece - residuePiece
                        this.awbWeight = res.data.dataList[0].weight - residueWeight
                    }
                })
                this.dialogStatus = 'create'
                this.fenStatus = 'addAwbh'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs.preFormData.clearValidate()
                })
            },
            //获取国家列表
            getCountryList() {
                getCountry().then(res => {
                    this.countryList = res.data.dataList
                })
            },
            remoteMethod(query) {
                if (query !== '') {
                    this.listLoading = true
                    setTimeout(() => {
                        this.listLoading = false
                        this.countryOption = this.countryResultList.filter(item => {
                            return item.value.toUpperCase().trim()
                                .indexOf(query.toUpperCase()) > -1
                        })
                    }, 200)
                } else {
                    this.countryOption = []
                }
            },
            remoteMethodAirport(query){
                this.airportCode = []
                if (query !== '') {
                    this.airportLoading = true
                    getAirportCode({airportid: query}).then(res => {
                        if(res !== null){
                            setTimeout(() => {
                                this.airportLoading = false
                                this.airportCode = res.data.data
                            }, 200)
                        }
                    })
                } else {
                    this.airportCode = []
                }
            },

            remoteMethodCustomCode(query){
                this.customCodeList = []
                if (query !== '') {
                    this.customLoading = true
                    getCustomCode({customcode: query}).then(res => {
                        if(res !== null){
                            setTimeout(() => {
                                this.customLoading = false
                                this.customCodeList = res.data.data
                            }, 200)
                        }
                    })
                } else {
                    this.airportCode = []
                }
            },

            handleAddpre() {
                const row = {
                    'messageType': 'MT2201'
                }
                this.$router.push({name: "出港航班信息", params: {scopeRow: row}})
            },

            handelBackStep() {
                this.preQuery.messageType = 'MT2201'
                this.$router.push({name: '出港航班信息', params: {scopeRow: this.preQuery}})
            },
            // 导入excel
            fileExceed(){
                this.$message.error('别贪心！一次只能上传一个哦~');
            },
            // 自定义上传
            uploadFile (item) {
                const form = new FormData()
                form.append('file', item.file)
                form.append("username", JSON.parse(sessionStorage.getItem('user')).username);
                uploadFileExcel(form).then(res =>{
                    if(res.data.count >0){
                        Message.success(res.data.respMessage)
                        this.getList();
                    }else {
                        Message.error(res.data.respMessage)
                    }
                })
            },
        }
    }

</script>
<style>
    .grid-content {
        height: 36px;
        line-height: 36px;
    }

    .content {
        border-left: 4px #409EFF solid;
        padding-left: 10px;
        background-color: #f9fafc;
        margin-bottom: 2px
    }

    .row-bg, .co {
        background-color: white;
    }

    .titlespan {
        font-weight: bold;
        margin-right: 35px;
    }

    .el-row {
        margin-top: 10px;
        margin-bottom: 0px;
    }

    .btnFoot {
        margin-top: 10px;
    }

    .el-btn {
        margin-left: 10px;
        display: inline-block;
    }

    .el-dialog-div {
        height: 60vh;
        overflow: auto;
    }

    .tableInline {
        line-height: 8px;
    }
</style>