|
|
|
<template>
|
|
|
|
<div class="bg">
|
|
|
|
<el-container>
|
|
|
|
<!-- 主要区域-->
|
|
|
|
<el-main>
|
|
|
|
<!-- 空运查询内容-->
|
|
|
|
<el-row style="margin-top: 30px">
|
|
|
|
<el-col :span="10" style="margin-right: 10px;background-color: #FFF;">
|
|
|
|
<div style="height: 600px;">
|
|
|
|
<div style="width: 100%;height: 80px;border-bottom: solid 2px #29A1F7;">
|
|
|
|
<el-col :span="15" style="margin-left: 0px;margin-top: 20px;">
|
|
|
|
<span style="font-size: 25px;margin-left: 50px">空运查询</span>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="8" style="margin-top: 23px;">
|
|
|
|
<span style="font-size: 17px">约计3000条航线数据</span>
|
|
|
|
</el-col>
|
|
|
|
</div>
|
|
|
|
<el-row>
|
|
|
|
<el-form ref="form" :model="form" label-width="80px" style="font-size: 50px;" >
|
|
|
|
<el-form-item label="航程方向" >
|
|
|
|
<el-radio-group v-model="form.airLine">
|
|
|
|
<el-radio style="padding-left: 20px" label="出口"></el-radio>
|
|
|
|
<el-radio label="进口"></el-radio>
|
|
|
|
</el-radio-group>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="起运地">
|
|
|
|
<el-select style="width: 320px" v-model="form.originStation" placeholder="起运地">
|
|
|
|
<el-option label="CGO" value="shanghai"></el-option>
|
|
|
|
<el-option label="LUX" value="beijing"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="目的地">
|
|
|
|
<el-select style="width: 320px" v-model="form.deliveryAddress" placeholder="目的地">
|
|
|
|
<el-option label="CGO" value="shanghai"></el-option>
|
|
|
|
<el-option label="LUX" value="beijing"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="货物重量">
|
|
|
|
<el-input style="width: 320px" v-model="form.weight" placeholder="单位：KG"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<div style="padding-left: 150px">
|
|
|
|
<el-button style="background-color: #F18F4C;color: #FFF">查价下单</el-button>
|
|
|
|
</div>
|
|
|
|
</el-form>
|
|
|
|
<div style="width: 100%;height: 200px;margin-top: 30px;padding-left: 50px;border-top: dashed 2px #D5D5D5;">
|
|
|
|
<p>
|
|
|
|
<span><i class="el-icon-phone" style="color: #29A1F7;padding-right: 5px"></i>一键订舱，方便快捷</span>
|
|
|
|
</p>
|
|
|
|
<p>
|
|
|
|
<span><i class="el-icon-edit-outline" style="color: #29A1F7;padding-right: 5px"></i>数据准确，专有团队维护</span>
|
|
|
|
</p>
|
|
|
|
<span><i class="el-icon-location-information" style="color: #29A1F7;padding-right: 5px"></i>货物在线跟踪</span>
|
|
|
|
</div>
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
<!-- 广告位-->
|
|
|
|
<el-col :span="13" style="margin-right: 0px;background-color: rgba(41,161,247,0.1);float: right;">
|
|
|
|
<div style="height: 600px;width: 500px">
|
|
|
|
<img src="./air.jpg" width="700px" height="600px"/>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
<!-- 优价航线标题栏-->
|
|
|
|
<el-row style="margin-top: 30px">
|
|
|
|
<span style="font-size: 25px">优价航线</span>
|
|
|
|
</el-row>
|
|
|
|
<!-- 优价航线内容-->
|
|
|
|
<el-row style="background-color: #FFF;height: 300px;">
|
|
|
|
<el-table
|
|
|
|
:data="tableData"
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航行路线">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="运输时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="deliveryAddress"
|
|
|
|
label="交货地">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="航班周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="最低价格">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label=""
|
|
|
|
width="120">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
size="small" plain
|
|
|
|
type="warning"
|
|
|
|
@click="open">订舱</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-row>
|
|
|
|
<!-- 热门航线标题栏-->
|
|
|
|
<el-row style="margin-top: 30px">
|
|
|
|
<span style="font-size: 25px">热门航线</span>
|
|
|
|
</el-row>
|
|
|
|
<!-- 热门航线内容-->
|
|
|
|
<el-row style="background-color: #FFF;height: 680px;">
|
|
|
|
<el-col :span="24">
|
|
|
|
<el-tabs type="border-card" style="width: 100%;height: 680px" stretch="true">
|
|
|
|
<el-tab-pane>
|
|
|
|
<span slot="label"><i class="el-icon-right"></i>出口航线</span>
|
|
|
|
<el-row style="height: 300px;margin-top: 0px">
|
|
|
|
<el-col :span="8"
|
|
|
|
style="border-right:solid 1px #F5F5F5;border-bottom:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">
|
|
|
|
<h2>CV</h2>
|
|
|
|
<el-table
|
|
|
|
:data="tableData1"
|
|
|
|
:header-cell-style="headClass"
|
|
|
|
:cell-style="rowClass"
|
|
|
|
style="width: 100%;background-color: #F5F5F5">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航段">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="航运价">
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>
|
|
|
|
<div style="text-align: center;margin-top: 6px">
|
|
|
|
<el-button type="warning" plain style="width: 120px" >订舱</el-button>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="8"
|
|
|
|
style="border-right:solid 1px #F5F5F5;border-bottom:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">
|
|
|
|
<h2>CV</h2>
|
|
|
|
<el-table
|
|
|
|
:data="tableData2"
|
|
|
|
:header-cell-style="headClass"
|
|
|
|
:cell-style="rowClass"
|
|
|
|
style="width: 100%;background-color: #F5F5F5">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航段">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="航运价">
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>
|
|
|
|
<div style="text-align: center;margin-top: 6px">
|
|
|
|
<el-button type="warning" plain style="width: 120px" >订舱</el-button>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="8"
|
|
|
|
style="border-bottom:solid 1px #F5F5F5;height: 300px;width: 32%">
|
|
|
|
<h2>CV</h2>
|
|
|
|
<el-table
|
|
|
|
:data="tableData3"
|
|
|
|
:header-cell-style="headClass"
|
|
|
|
:cell-style="rowClass"
|
|
|
|
style="width: 100%;background-color: #F5F5F5">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航段">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="航运价">
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>
|
|
|
|
<div style="text-align: center;margin-top: 6px">
|
|
|
|
<el-button type="warning" plain style="width: 120px">订舱</el-button>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
<el-row style="height: 300px;margin-top: 0px">
|
|
|
|
<el-col :span="8"
|
|
|
|
style="border-right:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">
|
|
|
|
<h2>CZ</h2>
|
|
|
|
<el-table
|
|
|
|
:data="tableData4"
|
|
|
|
:header-cell-style="headClass"
|
|
|
|
:cell-style="rowClass"
|
|
|
|
style="width: 100%;background-color: #F5F5F5">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航段">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="航运价">
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>
|
|
|
|
<div style="text-align: center;margin-top: 6px">
|
|
|
|
<el-button type="warning" plain style="width: 120px" >订舱</el-button>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="8"
|
|
|
|
style="border-right:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">
|
|
|
|
<h2>CZ</h2>
|
|
|
|
<el-table
|
|
|
|
:data="tableData5"
|
|
|
|
:header-cell-style="headClass"
|
|
|
|
:cell-style="rowClass"
|
|
|
|
style="width: 100%;background-color: #F5F5F5">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航段">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="航运价">
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>
|
|
|
|
<div style="text-align: center;margin-top: 6px">
|
|
|
|
<el-button type="warning" plain style="width: 120px" >订舱</el-button>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="8"
|
|
|
|
style="height: 300px;width: 32%">
|
|
|
|
<h2>CZ</h2>
|
|
|
|
<el-table
|
|
|
|
:data="tableData6"
|
|
|
|
:header-cell-style="headClass"
|
|
|
|
:cell-style="rowClass"
|
|
|
|
style="width: 100%;background-color: #F5F5F5">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航段">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportPrice"
|
|
|
|
label="航运价">
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>
|
|
|
|
<div style="text-align: center;margin-top: 6px">
|
|
|
|
<el-button type="warning" plain style="width: 120px" >订舱</el-button>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="进口航线">
|
|
|
|
<span slot="label"><i class="el-icon-back"></i>进口航线</span>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="空运专线">
|
|
|
|
<span slot="label"><i class="el-icon-star-off"></i>空运专线</span>
|
|
|
|
</el-tab-pane>
|
|
|
|
</el-tabs>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
<!-- 热门港口标题栏-->
|
|
|
|
<el-row style="margin-top: 30px">
|
|
|
|
<span style="font-size: 25px">热门港口</span>
|
|
|
|
</el-row>
|
|
|
|
<!-- 热门港口内容-->
|
|
|
|
<el-row style="background-color: #FFF;height: 300px;padding: 25px">
|
|
|
|
<el-col :span="24">
|
|
|
|
<el-tabs :tab-position="tabPosition" style="width: 100%;height: 280px;">
|
|
|
|
<el-tab-pane label="北京">
|
|
|
|
<el-table
|
|
|
|
:data="tableData7"
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航行路线">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="运输时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="deliveryAddress"
|
|
|
|
label="交货地">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="航班周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label=""
|
|
|
|
width="120">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
size="small" plain
|
|
|
|
type="warning"
|
|
|
|
@click="">订舱</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="上海">
|
|
|
|
<el-table
|
|
|
|
:data="tableData8"
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航行路线">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="运输时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="deliveryAddress"
|
|
|
|
label="交货地">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="航班周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label=""
|
|
|
|
width="120">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
size="small" plain
|
|
|
|
type="warning"
|
|
|
|
@click="">订舱</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="深圳">
|
|
|
|
<el-table
|
|
|
|
:data="tableData9"
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航行路线">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="运输时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="deliveryAddress"
|
|
|
|
label="交货地">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="航班周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label=""
|
|
|
|
width="120">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
size="small" plain
|
|
|
|
type="warning"
|
|
|
|
@click="">订舱</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="广州">
|
|
|
|
<el-table
|
|
|
|
:data="tableData10"
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航行路线">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="运输时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="deliveryAddress"
|
|
|
|
label="交货地">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="航班周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label=""
|
|
|
|
width="120">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
size="small" plain
|
|
|
|
type="warning"
|
|
|
|
@click="">订舱</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="宁波">
|
|
|
|
<el-table
|
|
|
|
:data="tableData11"
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="airLine"
|
|
|
|
label="航行路线">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="transportLimitation"
|
|
|
|
label="运输时效">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="deliveryAddress"
|
|
|
|
label="交货地">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="flightCycle"
|
|
|
|
label="航班周期">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label=""
|
|
|
|
width="120">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
size="small" plain
|
|
|
|
type="warning"
|
|
|
|
@click="">订舱</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-tab-pane>
|
|
|
|
</el-tabs>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
<!-- 查询工具-->
|
|
|
|
<el-row style="background-color: #FFF;height: 180px;margin-top: 60px">
|
|
|
|
<el-col :span="24">
|
|
|
|
<el-tabs :tab-position="tabPositions" style="width: 80%;height: 280px;margin: 20px">
|
|
|
|
<el-tab-pane label="机场代码查询">
|
|
|
|
<span style="font-size: 25px">机场代码查询</span>
|
|
|
|
<span style="font-size: 15px">（收录2016年IATA最新机场三字代码、城市三字代码。）</span>
|
|
|
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="商品编码查询">
|
|
|
|
<span style="font-size: 25px">商品编码查询</span>
|
|
|
|
<span style="font-size: 15px">（提供海关HScode编码、对应税率、申报要素查询服务，根据海关最新政策实时更新。）</span>
|
|
|
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="全球港口查询">
|
|
|
|
<span style="font-size: 25px">全球港口查询</span>
|
|
|
|
<span style="font-size: 15px">（收录2016年IATA最新机场三字代码、城市三字代码。）</span>
|
|
|
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="空运货物查询">
|
|
|
|
<span style="font-size: 25px">空运货物查询</span>
|
|
|
|
<span style="font-size: 15px">（提供世界各国航空公司货物追踪、货物查询服务，实时追踪最新货况。）</span>
|
|
|
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
|
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="快件跟踪查询">
|
|
|
|
<span style="font-size: 25px">快件跟踪查询</span>
|
|
|
|
<span style="font-size: 15px"></span>
|
|
|
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
|
|
|
</el-tab-pane>
|
|
|
|
</el-tabs>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</el-main>
|
|
|
|
</el-container>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<!--<template>-->
|
|
|
|
<!-- <div class="bg">-->
|
|
|
|
<!-- <el-container>-->
|
|
|
|
<!--<!– 主要区域–>-->
|
|
|
|
<!-- <el-main>-->
|
|
|
|
<!--<!– 空运查询内容–>-->
|
|
|
|
<!-- <el-row style="margin-top: 30px">-->
|
|
|
|
<!-- <el-col :span="10" style="margin-right: 10px;background-color: #FFF;">-->
|
|
|
|
<!-- <div style="height: 600px;">-->
|
|
|
|
<!-- <div style="width: 100%;height: 80px;border-bottom: solid 2px #29A1F7;">-->
|
|
|
|
<!-- <el-col :span="15" style="margin-left: 0px;margin-top: 20px;">-->
|
|
|
|
<!-- <span style="font-size: 25px;margin-left: 50px">空运查询</span>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- <el-col :span="8" style="margin-top: 23px;">-->
|
|
|
|
<!-- <span style="font-size: 17px">约计3000条航线数据</span>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- <el-row>-->
|
|
|
|
<!-- <el-form ref="form" :model="form" label-width="80px" style="font-size: 50px;" >-->
|
|
|
|
<!-- <el-form-item label="航程方向" >-->
|
|
|
|
<!-- <el-radio-group v-model="form.airLine">-->
|
|
|
|
<!-- <el-radio style="padding-left: 20px" label="出口"></el-radio>-->
|
|
|
|
<!-- <el-radio label="进口"></el-radio>-->
|
|
|
|
<!-- </el-radio-group>-->
|
|
|
|
<!-- </el-form-item>-->
|
|
|
|
<!-- <el-form-item label="起运地">-->
|
|
|
|
<!-- <el-select style="width: 320px" v-model="form.originStation" placeholder="起运地">-->
|
|
|
|
<!-- <el-option label="CGO" value="shanghai"></el-option>-->
|
|
|
|
<!-- <el-option label="LUX" value="beijing"></el-option>-->
|
|
|
|
<!-- </el-select>-->
|
|
|
|
<!-- </el-form-item>-->
|
|
|
|
<!-- <el-form-item label="目的地">-->
|
|
|
|
<!-- <el-select style="width: 320px" v-model="form.deliveryAddress" placeholder="目的地">-->
|
|
|
|
<!-- <el-option label="CGO" value="shanghai"></el-option>-->
|
|
|
|
<!-- <el-option label="LUX" value="beijing"></el-option>-->
|
|
|
|
<!-- </el-select>-->
|
|
|
|
<!-- </el-form-item>-->
|
|
|
|
<!-- <el-form-item label="货物重量">-->
|
|
|
|
<!-- <el-input style="width: 320px" v-model="form.weight" placeholder="单位：KG"></el-input>-->
|
|
|
|
<!-- </el-form-item>-->
|
|
|
|
<!-- <div style="padding-left: 150px">-->
|
|
|
|
<!-- <el-button style="background-color: #F18F4C;color: #FFF">查价下单</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-form>-->
|
|
|
|
<!-- <div style="width: 100%;height: 200px;margin-top: 30px;padding-left: 50px;border-top: dashed 2px #D5D5D5;">-->
|
|
|
|
<!-- <p>-->
|
|
|
|
<!-- <span><i class="el-icon-phone" style="color: #29A1F7;padding-right: 5px"></i>一键订舱，方便快捷</span>-->
|
|
|
|
<!-- </p>-->
|
|
|
|
<!-- <p>-->
|
|
|
|
<!-- <span><i class="el-icon-edit-outline" style="color: #29A1F7;padding-right: 5px"></i>数据准确，专有团队维护</span>-->
|
|
|
|
<!-- </p>-->
|
|
|
|
<!-- <span><i class="el-icon-location-information" style="color: #29A1F7;padding-right: 5px"></i>货物在线跟踪</span>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!--<!– 广告位–>-->
|
|
|
|
<!-- <el-col :span="13" style="margin-right: 0px;background-color: rgba(41,161,247,0.1);float: right;">-->
|
|
|
|
<!-- <div style="height: 600px;width: 500px">-->
|
|
|
|
<!-- <img src="./air.jpg" width="700px" height="600px"/>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 优价航线标题栏–>-->
|
|
|
|
<!-- <el-row style="margin-top: 30px">-->
|
|
|
|
<!-- <span style="font-size: 25px">优价航线</span>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 优价航线内容–>-->
|
|
|
|
<!-- <el-row style="background-color: #FFF;height: 300px;">-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData"-->
|
|
|
|
<!-- style="width: 100%">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航行路线">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="运输时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="deliveryAddress"-->
|
|
|
|
<!-- label="交货地">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="航班周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="最低价格">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- fixed="right"-->
|
|
|
|
<!-- label=""-->
|
|
|
|
<!-- width="120">-->
|
|
|
|
<!-- <template slot-scope="scope">-->
|
|
|
|
<!-- <el-button-->
|
|
|
|
<!-- size="small" plain-->
|
|
|
|
<!-- type="warning"-->
|
|
|
|
<!-- @click="open">订舱</el-button>-->
|
|
|
|
<!-- </template>-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 热门航线标题栏–>-->
|
|
|
|
<!-- <el-row style="margin-top: 30px">-->
|
|
|
|
<!-- <span style="font-size: 25px">热门航线</span>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 热门航线内容–>-->
|
|
|
|
<!-- <el-row style="background-color: #FFF;height: 680px;">-->
|
|
|
|
<!-- <el-col :span="24">-->
|
|
|
|
<!-- <el-tabs type="border-card" style="width: 100%;height: 680px" stretch="true">-->
|
|
|
|
<!-- <el-tab-pane>-->
|
|
|
|
<!-- <span slot="label"><i class="el-icon-right"></i>出口航线</span>-->
|
|
|
|
<!-- <el-row style="height: 300px;margin-top: 0px">-->
|
|
|
|
<!-- <el-col :span="8"-->
|
|
|
|
<!-- style="border-right:solid 1px #F5F5F5;border-bottom:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">-->
|
|
|
|
<!-- <h2>CV</h2>-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData1"-->
|
|
|
|
<!-- :header-cell-style="headClass"-->
|
|
|
|
<!-- :cell-style="rowClass"-->
|
|
|
|
<!-- style="width: 100%;background-color: #F5F5F5">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航段">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="航运价">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">-->
|
|
|
|
<!-- <el-button type="warning" plain style="width: 120px" >订舱</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- <el-col :span="8"-->
|
|
|
|
<!-- style="border-right:solid 1px #F5F5F5;border-bottom:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">-->
|
|
|
|
<!-- <h2>CV</h2>-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData2"-->
|
|
|
|
<!-- :header-cell-style="headClass"-->
|
|
|
|
<!-- :cell-style="rowClass"-->
|
|
|
|
<!-- style="width: 100%;background-color: #F5F5F5">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航段">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="航运价">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">-->
|
|
|
|
<!-- <el-button type="warning" plain style="width: 120px" >订舱</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- <el-col :span="8"-->
|
|
|
|
<!-- style="border-bottom:solid 1px #F5F5F5;height: 300px;width: 32%">-->
|
|
|
|
<!-- <h2>CV</h2>-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData3"-->
|
|
|
|
<!-- :header-cell-style="headClass"-->
|
|
|
|
<!-- :cell-style="rowClass"-->
|
|
|
|
<!-- style="width: 100%;background-color: #F5F5F5">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航段">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="航运价">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">-->
|
|
|
|
<!-- <el-button type="warning" plain style="width: 120px">订舱</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!-- <el-row style="height: 300px;margin-top: 0px">-->
|
|
|
|
<!-- <el-col :span="8"-->
|
|
|
|
<!-- style="border-right:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">-->
|
|
|
|
<!-- <h2>CZ</h2>-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData4"-->
|
|
|
|
<!-- :header-cell-style="headClass"-->
|
|
|
|
<!-- :cell-style="rowClass"-->
|
|
|
|
<!-- style="width: 100%;background-color: #F5F5F5">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航段">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="航运价">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">-->
|
|
|
|
<!-- <el-button type="warning" plain style="width: 120px" >订舱</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- <el-col :span="8"-->
|
|
|
|
<!-- style="border-right:solid 1px #F5F5F5;height: 300px;width: 32%;margin-right: 15px">-->
|
|
|
|
<!-- <h2>CZ</h2>-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData5"-->
|
|
|
|
<!-- :header-cell-style="headClass"-->
|
|
|
|
<!-- :cell-style="rowClass"-->
|
|
|
|
<!-- style="width: 100%;background-color: #F5F5F5">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航段">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="航运价">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">-->
|
|
|
|
<!-- <el-button type="warning" plain style="width: 120px" >订舱</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- <el-col :span="8"-->
|
|
|
|
<!-- style="height: 300px;width: 32%">-->
|
|
|
|
<!-- <h2>CZ</h2>-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData6"-->
|
|
|
|
<!-- :header-cell-style="headClass"-->
|
|
|
|
<!-- :cell-style="rowClass"-->
|
|
|
|
<!-- style="width: 100%;background-color: #F5F5F5">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航段">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportPrice"-->
|
|
|
|
<!-- label="航运价">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">交货地:GUANGZHOU AIRPORT 广州</div>-->
|
|
|
|
<!-- <div style="text-align: center;margin-top: 6px">-->
|
|
|
|
<!-- <el-button type="warning" plain style="width: 120px" >订舱</el-button>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="进口航线">-->
|
|
|
|
<!-- <span slot="label"><i class="el-icon-back"></i>进口航线</span>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="空运专线">-->
|
|
|
|
<!-- <span slot="label"><i class="el-icon-star-off"></i>空运专线</span>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- </el-tabs>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 热门港口标题栏–>-->
|
|
|
|
<!-- <el-row style="margin-top: 30px">-->
|
|
|
|
<!-- <span style="font-size: 25px">热门港口</span>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 热门港口内容–>-->
|
|
|
|
<!-- <el-row style="background-color: #FFF;height: 300px;padding: 25px">-->
|
|
|
|
<!-- <el-col :span="24">-->
|
|
|
|
<!-- <el-tabs :tab-position="tabPosition" style="width: 100%;height: 280px;">-->
|
|
|
|
<!-- <el-tab-pane label="北京">-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData7"-->
|
|
|
|
<!-- style="width: 100%">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航行路线">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="运输时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="deliveryAddress"-->
|
|
|
|
<!-- label="交货地">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="航班周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- fixed="right"-->
|
|
|
|
<!-- label=""-->
|
|
|
|
<!-- width="120">-->
|
|
|
|
<!-- <template slot-scope="scope">-->
|
|
|
|
<!-- <el-button-->
|
|
|
|
<!-- size="small" plain-->
|
|
|
|
<!-- type="warning"-->
|
|
|
|
<!-- @click="">订舱</el-button>-->
|
|
|
|
<!-- </template>-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="上海">-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData8"-->
|
|
|
|
<!-- style="width: 100%">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航行路线">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="运输时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="deliveryAddress"-->
|
|
|
|
<!-- label="交货地">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="航班周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- fixed="right"-->
|
|
|
|
<!-- label=""-->
|
|
|
|
<!-- width="120">-->
|
|
|
|
<!-- <template slot-scope="scope">-->
|
|
|
|
<!-- <el-button-->
|
|
|
|
<!-- size="small" plain-->
|
|
|
|
<!-- type="warning"-->
|
|
|
|
<!-- @click="">订舱</el-button>-->
|
|
|
|
<!-- </template>-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="深圳">-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData9"-->
|
|
|
|
<!-- style="width: 100%">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航行路线">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="运输时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="deliveryAddress"-->
|
|
|
|
<!-- label="交货地">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="航班周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- fixed="right"-->
|
|
|
|
<!-- label=""-->
|
|
|
|
<!-- width="120">-->
|
|
|
|
<!-- <template slot-scope="scope">-->
|
|
|
|
<!-- <el-button-->
|
|
|
|
<!-- size="small" plain-->
|
|
|
|
<!-- type="warning"-->
|
|
|
|
<!-- @click="">订舱</el-button>-->
|
|
|
|
<!-- </template>-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="广州">-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData10"-->
|
|
|
|
<!-- style="width: 100%">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航行路线">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="运输时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="deliveryAddress"-->
|
|
|
|
<!-- label="交货地">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="航班周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- fixed="right"-->
|
|
|
|
<!-- label=""-->
|
|
|
|
<!-- width="120">-->
|
|
|
|
<!-- <template slot-scope="scope">-->
|
|
|
|
<!-- <el-button-->
|
|
|
|
<!-- size="small" plain-->
|
|
|
|
<!-- type="warning"-->
|
|
|
|
<!-- @click="">订舱</el-button>-->
|
|
|
|
<!-- </template>-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="宁波">-->
|
|
|
|
<!-- <el-table-->
|
|
|
|
<!-- :data="tableData11"-->
|
|
|
|
<!-- style="width: 100%">-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="airLine"-->
|
|
|
|
<!-- label="航行路线">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="transportLimitation"-->
|
|
|
|
<!-- label="运输时效">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="deliveryAddress"-->
|
|
|
|
<!-- label="交货地">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- prop="flightCycle"-->
|
|
|
|
<!-- label="航班周期">-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- <el-table-column-->
|
|
|
|
<!-- fixed="right"-->
|
|
|
|
<!-- label=""-->
|
|
|
|
<!-- width="120">-->
|
|
|
|
<!-- <template slot-scope="scope">-->
|
|
|
|
<!-- <el-button-->
|
|
|
|
<!-- size="small" plain-->
|
|
|
|
<!-- type="warning"-->
|
|
|
|
<!-- @click="">订舱</el-button>-->
|
|
|
|
<!-- </template>-->
|
|
|
|
<!-- </el-table-column>-->
|
|
|
|
<!-- </el-table>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- </el-tabs>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!--<!– 查询工具–>-->
|
|
|
|
<!-- <el-row style="background-color: #FFF;height: 180px;margin-top: 60px">-->
|
|
|
|
<!-- <el-col :span="24">-->
|
|
|
|
<!-- <el-tabs :tab-position="tabPositions" style="width: 80%;height: 280px;margin: 20px">-->
|
|
|
|
<!-- <el-tab-pane label="机场代码查询">-->
|
|
|
|
<!-- <span style="font-size: 25px">机场代码查询</span>-->
|
|
|
|
<!-- <span style="font-size: 15px">（收录2016年IATA最新机场三字代码、城市三字代码。）</span>-->
|
|
|
|
<!-- <el-input v-model="input" placeholder="请输入内容"></el-input>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="商品编码查询">-->
|
|
|
|
<!-- <span style="font-size: 25px">商品编码查询</span>-->
|
|
|
|
<!-- <span style="font-size: 15px">（提供海关HScode编码、对应税率、申报要素查询服务，根据海关最新政策实时更新。）</span>-->
|
|
|
|
<!-- <el-input v-model="input" placeholder="请输入内容"></el-input>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="全球港口查询">-->
|
|
|
|
<!-- <span style="font-size: 25px">全球港口查询</span>-->
|
|
|
|
<!-- <span style="font-size: 15px">（收录2016年IATA最新机场三字代码、城市三字代码。）</span>-->
|
|
|
|
<!-- <el-input v-model="input" placeholder="请输入内容"></el-input>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="空运货物查询">-->
|
|
|
|
<!-- <span style="font-size: 25px">空运货物查询</span>-->
|
|
|
|
<!-- <span style="font-size: 15px">（提供世界各国航空公司货物追踪、货物查询服务，实时追踪最新货况。）</span>-->
|
|
|
|
<!-- <el-input v-model="input" placeholder="请输入内容"></el-input>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- <el-tab-pane label="快件跟踪查询">-->
|
|
|
|
<!-- <span style="font-size: 25px">快件跟踪查询</span>-->
|
|
|
|
<!-- <span style="font-size: 15px"></span>-->
|
|
|
|
<!-- <el-input v-model="input" placeholder="请输入内容"></el-input>-->
|
|
|
|
<!-- </el-tab-pane>-->
|
|
|
|
<!-- </el-tabs>-->
|
|
|
|
<!-- </el-col>-->
|
|
|
|
<!-- </el-row>-->
|
|
|
|
<!-- </el-main>-->
|
|
|
|
<!-- </el-container>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!--</template>-->
|
|
|
|
|
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
<!--<script>-->
|
|
|
|
<!-- export default {-->
|
|
|
|
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
// 空运查询
|
|
|
|
form: {
|
|
|
|
airLine:undefined,
|
|
|
|
originStation:undefined,
|
|
|
|
deliveryAddress:undefined,
|
|
|
|
weight:undefined,
|
|
|
|
},
|
|
|
|
// 优价航线表格
|
|
|
|
tableData:[
|
|
|
|
{
|
|
|
|
airLine:'CGO-LUX',
|
|
|
|
transportLimitation:'2021-01-17-01-00',
|
|
|
|
deliveryAddress:'LUX',
|
|
|
|
flightCycle:'2',
|
|
|
|
transportPrice:'180',
|
|
|
|
}
|
|
|
|
],
|
|
|
|
<!-- data() {-->
|
|
|
|
<!-- return {-->
|
|
|
|
<!-- // 空运查询-->
|
|
|
|
<!-- form: {-->
|
|
|
|
<!-- airLine:undefined,-->
|
|
|
|
<!-- originStation:undefined,-->
|
|
|
|
<!-- deliveryAddress:undefined,-->
|
|
|
|
<!-- weight:undefined,-->
|
|
|
|
<!-- },-->
|
|
|
|
<!-- // 优价航线表格-->
|
|
|
|
<!-- tableData:[-->
|
|
|
|
<!-- {-->
|
|
|
|
<!-- airLine:'CGO-LUX',-->
|
|
|
|
<!-- transportLimitation:'2021-01-17-01-00',-->
|
|
|
|
<!-- deliveryAddress:'LUX',-->
|
|
|
|
<!-- flightCycle:'2',-->
|
|
|
|
<!-- transportPrice:'180',-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- ],-->
|
|
|
|
|
|
|
|
// 热门航线表格
|
|
|
|
tableData1:[
|
|
|
|
{
|
|
|
|
airLine:'CGO-LUX',
|
|
|
|
transportLimitation:'2021-01-17-01-00',
|
|
|
|
deliveryAddress:'LUX',
|
|
|
|
flightCycle:'2',
|
|
|
|
transportPrice:'180',
|
|
|
|
}
|
|
|
|
],
|
|
|
|
tableData2:[
|
|
|
|
{
|
|
|
|
airLine:'LUX-CGO',
|
|
|
|
transportLimitation:'2021-01-18-12-00 ',
|
|
|
|
deliveryAddress:'CGO ',
|
|
|
|
flightCycle:'2',
|
|
|
|
transportPrice:'180',
|
|
|
|
}
|
|
|
|
],
|
|
|
|
tableData3:[
|
|
|
|
{
|
|
|
|
airLine:'CGO-LUX',
|
|
|
|
transportLimitation:'2021-01-17-01-00',
|
|
|
|
deliveryAddress:'LUX',
|
|
|
|
flightCycle:'2',
|
|
|
|
transportPrice:'180',
|
|
|
|
}
|
|
|
|
],
|
|
|
|
tableData4:[],
|
|
|
|
tableData5:[],
|
|
|
|
tableData6:[],
|
|
|
|
// 热门港口表格
|
|
|
|
tableData7:[],
|
|
|
|
tableData8:[],
|
|
|
|
tableData9:[],
|
|
|
|
tableData10:[],
|
|
|
|
tableData11:[],
|
|
|
|
<!-- // 热门航线表格-->
|
|
|
|
<!-- tableData1:[-->
|
|
|
|
<!-- {-->
|
|
|
|
<!-- airLine:'CGO-LUX',-->
|
|
|
|
<!-- transportLimitation:'2021-01-17-01-00',-->
|
|
|
|
<!-- deliveryAddress:'LUX',-->
|
|
|
|
<!-- flightCycle:'2',-->
|
|
|
|
<!-- transportPrice:'180',-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- ],-->
|
|
|
|
<!-- tableData2:[-->
|
|
|
|
<!-- {-->
|
|
|
|
<!-- airLine:'LUX-CGO',-->
|
|
|
|
<!-- transportLimitation:'2021-01-18-12-00 ',-->
|
|
|
|
<!-- deliveryAddress:'CGO ',-->
|
|
|
|
<!-- flightCycle:'2',-->
|
|
|
|
<!-- transportPrice:'180',-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- ],-->
|
|
|
|
<!-- tableData3:[-->
|
|
|
|
<!-- {-->
|
|
|
|
<!-- airLine:'CGO-LUX',-->
|
|
|
|
<!-- transportLimitation:'2021-01-17-01-00',-->
|
|
|
|
<!-- deliveryAddress:'LUX',-->
|
|
|
|
<!-- flightCycle:'2',-->
|
|
|
|
<!-- transportPrice:'180',-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- ],-->
|
|
|
|
<!-- tableData4:[],-->
|
|
|
|
<!-- tableData5:[],-->
|
|
|
|
<!-- tableData6:[],-->
|
|
|
|
<!-- // 热门港口表格-->
|
|
|
|
<!-- tableData7:[],-->
|
|
|
|
<!-- tableData8:[],-->
|
|
|
|
<!-- tableData9:[],-->
|
|
|
|
<!-- tableData10:[],-->
|
|
|
|
<!-- tableData11:[],-->
|
|
|
|
|
|
|
|
tabPosition: 'left',
|
|
|
|
tabPositions: 'bottom',
|
|
|
|
}
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
headClass () {
|
|
|
|
return 'text-align: center;background:#F5F5F5;'
|
|
|
|
},
|
|
|
|
rowClass () {
|
|
|
|
return 'text-align: center;background:#F5F5F5;'
|
|
|
|
},
|
|
|
|
open() {
|
|
|
|
this.$alert('确认订舱？', '', {
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
callback: action => {
|
|
|
|
this.$message({
|
|
|
|
type: 'info',
|
|
|
|
message: `action: ${ action }`
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
<!-- tabPosition: 'left',-->
|
|
|
|
<!-- tabPositions: 'bottom',-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- },-->
|
|
|
|
<!-- methods: {-->
|
|
|
|
<!-- headClass () {-->
|
|
|
|
<!-- return 'text-align: center;background:#F5F5F5;'-->
|
|
|
|
<!-- },-->
|
|
|
|
<!-- rowClass () {-->
|
|
|
|
<!-- return 'text-align: center;background:#F5F5F5;'-->
|
|
|
|
<!-- },-->
|
|
|
|
<!-- open() {-->
|
|
|
|
<!-- this.$alert('确认订舱？', '', {-->
|
|
|
|
<!-- confirmButtonText: '确定',-->
|
|
|
|
<!-- callback: action => {-->
|
|
|
|
<!-- this.$message({-->
|
|
|
|
<!-- type: 'info',-->
|
|
|
|
<!-- message: `action: ${ action }`-->
|
|
|
|
<!-- });-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- });-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- },-->
|
|
|
|
<!-- }-->
|
|
|
|
<!--</script>-->
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
.bg{
|
|
|
|
background-color: #F2F2F2;
|
|
|
|
width: 100%;
|
|
|
|
height: 850px;
|
|
|
|
overflow: auto;
|
|
|
|
<!--<style scoped>-->
|
|
|
|
<!-- .bg{-->
|
|
|
|
<!-- background-color: #F2F2F2;-->
|
|
|
|
<!-- width: 100%;-->
|
|
|
|
<!-- height: 850px;-->
|
|
|
|
<!-- overflow: auto;-->
|
|
|
|
|
|
|
|
}
|
|
|
|
.header{
|
|
|
|
font-size: 20px;
|
|
|
|
line-height: 120px;
|
|
|
|
color:#FFF;
|
|
|
|
}
|
|
|
|
.el-header{
|
|
|
|
background-color: #29A1F7;
|
|
|
|
}
|
|
|
|
.el-tabs{
|
|
|
|
width: 250px;
|
|
|
|
}
|
|
|
|
.el-menu{
|
|
|
|
background-color: #29A1F7;
|
|
|
|
font-size: 20px;
|
|
|
|
border-bottom-color: #29A1F7;
|
|
|
|
}
|
|
|
|
</style> |
|
|
|
<!-- }-->
|
|
|
|
<!-- .header{-->
|
|
|
|
<!-- font-size: 20px;-->
|
|
|
|
<!-- line-height: 120px;-->
|
|
|
|
<!-- color:#FFF;-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- .el-header{-->
|
|
|
|
<!-- background-color: #29A1F7;-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- .el-tabs{-->
|
|
|
|
<!-- width: 250px;-->
|
|
|
|
<!-- }-->
|
|
|
|
<!-- .el-menu{-->
|
|
|
|
<!-- background-color: #29A1F7;-->
|
|
|
|
<!-- font-size: 20px;-->
|
|
|
|
<!-- border-bottom-color: #29A1F7;-->
|
|
|
|
<!-- }-->
|
|
|
|
<!--</style>--> |
...
|
...
|
|
