|
|
@@ -16,7 +16,7 @@
|
|
|
</el-menu>
|
|
|
</div>
|
|
|
<div class="outermost">
|
|
|
- <div v-if="selection === '1'">
|
|
|
+ <div v-if="activeIndex2 === '1'">
|
|
|
<el-input placeholder="请输入发货地址">
|
|
|
<template slot="prepend">发货地址</template>
|
|
|
<el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">
|
|
|
@@ -41,7 +41,7 @@
|
|
|
<button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
<button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
</div>
|
|
|
- <div v-if="selection === '2'">
|
|
|
+ <div v-if="activeIndex2 === '2'">
|
|
|
<el-input placeholder="请输入发货地址">
|
|
|
<template slot="prepend">发货地址</template>
|
|
|
<el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">
|
|
|
@@ -63,7 +63,7 @@
|
|
|
<button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
<button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
</div>
|
|
|
- <div v-if="selection === '3'">
|
|
|
+ <div v-if="activeIndex2 === '3'">
|
|
|
<el-input placeholder="请输入起运港口">
|
|
|
<template slot="prepend">起运港口</template>
|
|
|
</el-input>
|
|
|
@@ -85,9 +85,12 @@
|
|
|
<button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
<button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
</div>
|
|
|
- <div v-if="selection === '4'">
|
|
|
+ <div v-if="activeIndex2 === '4'">
|
|
|
<div style="width: 400px;align-items: center;display: flex;">
|
|
|
- <el-button disabled style="border: 1px solid #DCDFE6;color:#95989d;background-color: #f5f7fa;border-top-right-radius:0;border-bottom-right-radius:0">起运港口</el-button>
|
|
|
+ <el-button disabled
|
|
|
+ style="border: 1px solid #DCDFE6;color:#95989d;background-color: #f5f7fa;border-top-right-radius:0;border-bottom-right-radius:0">
|
|
|
+ 起运港口
|
|
|
+ </el-button>
|
|
|
<el-select
|
|
|
v-model="portToPort.fPortofloadid"
|
|
|
filterable
|
|
|
@@ -110,15 +113,17 @@
|
|
|
</div>
|
|
|
|
|
|
<div style="width: 400px;align-items: center;display: flex;">
|
|
|
- <el-button disabled style="border: 1px solid #DCDFE6;color:#95989d;background-color: #f5f7fa;border-top-right-radius:0;border-bottom-right-radius:0">目的港口</el-button>
|
|
|
+ <el-button disabled
|
|
|
+ style="border: 1px solid #DCDFE6;color:#95989d;background-color: #f5f7fa;border-top-right-radius:0;border-bottom-right-radius:0">
|
|
|
+ 目的港口
|
|
|
+ </el-button>
|
|
|
<el-select
|
|
|
- v-model="portToPort.fPortofloadid"
|
|
|
+ v-model="portToPort.fDistinationid"
|
|
|
filterable
|
|
|
remote
|
|
|
@change="handleQuery"
|
|
|
style="width: 100%;"
|
|
|
class="elSelect"
|
|
|
- :remote-method="handleQuery"
|
|
|
placeholder="请输入模糊查找目的港口"
|
|
|
>
|
|
|
<el-scrollbar>
|
|
|
@@ -131,9 +136,9 @@
|
|
|
</el-scrollbar>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
-<!-- <el-input placeholder="请输入目的港口" v-model="portToPort.fDistinationid">-->
|
|
|
-<!-- <template slot="prepend">目的港口</template>-->
|
|
|
-<!-- </el-input>-->
|
|
|
+ <!-- <el-input placeholder="请输入目的港口" v-model="portToPort.fDistinationid">-->
|
|
|
+ <!-- <template slot="prepend">目的港口</template>-->
|
|
|
+ <!-- </el-input>-->
|
|
|
<el-input placeholder="请输入货物名称">
|
|
|
<template slot="prepend">货物名称</template>
|
|
|
</el-input>
|
|
|
@@ -144,7 +149,9 @@
|
|
|
<button class="stealthbutton"></button>
|
|
|
</div>
|
|
|
<div>
|
|
|
- <el-button type="primary" v-if="activeIndex2 === '1'||activeIndex2 === '2'||activeIndex2 === '3'" disabled>船期查询</el-button>
|
|
|
+ <el-button type="primary" v-if="activeIndex2 === '1'||activeIndex2 === '2'||activeIndex2 === '3'" disabled>
|
|
|
+ 船期查询
|
|
|
+ </el-button>
|
|
|
<el-button type="primary" @click="schedule" v-else>船期查询</el-button>
|
|
|
</div>
|
|
|
<el-divider>查询船期</el-divider>
|
|
|
@@ -154,11 +161,11 @@
|
|
|
</div>
|
|
|
<div style="width: 100%;" v-for="(item,index) in detailedList" :key="index">
|
|
|
<div
|
|
|
- style="width: 100%;padding: 10px;margin-left: -10px;display: flex;justify-content: space-around;border: 1px solid #E8E8E8;box-shadow: 0 2px 7px 0 rgba(71,71,71,.2);">
|
|
|
+ style="width: 100%;padding: 10px;margin-left: -10px;display: flex;justify-content: space-around;border: 1px solid #E8E8E8;box-shadow: 0 2px 7px 0 rgba(71,71,71,.2);">
|
|
|
<div style="width: 50%;line-height: 40px;">
|
|
|
<div
|
|
|
style="background-color: #f10724;width: 80px;margin-top: 15px;margin-right: 5px;margin-left: 5px;height: 30px;line-height: 30px;border-radius: 20px;color: #ffffff;float: left">
|
|
|
- {{item.portofloadidName}}
|
|
|
+ {{ item.portofloadidName }}
|
|
|
</div>
|
|
|
<div style="width: 40px;height: 60px;float: left">
|
|
|
<div style="width: 100%;height: 30px;">
|
|
|
@@ -170,7 +177,7 @@
|
|
|
</div>
|
|
|
<div
|
|
|
style="background-color: #f10724;width: 80px;margin-top: 15px;margin-right: 5px;margin-left: 5px;height: 30px;line-height: 30px;border-radius: 20px;color: #ffffff;float: left">
|
|
|
- {{item.portoftransshipmentName}}
|
|
|
+ {{ item.portoftransshipmentName }}
|
|
|
</div>
|
|
|
<div style="width: 40px;height: 60px;float: left">
|
|
|
<div style="width: 100%;height: 30px;">
|
|
|
@@ -182,17 +189,17 @@
|
|
|
</div>
|
|
|
<div
|
|
|
style="background-color: #f10724;width: 80px;margin-top: 15px;margin-right: 5px;margin-left: 5px;height: 30px;line-height: 30px;border-radius: 20px;color: #ffffff;float: left">
|
|
|
- {{item.portofdischargeidName}}
|
|
|
+ {{ item.portofdischargeidName }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div
|
|
|
style="width: 25%;margin: 0 auto;display: flex;align-items: center;justify-content: center;border-left: 1px solid #E8E8E8">
|
|
|
<div>
|
|
|
<span style="color: #999999">全程运输时长：</span>
|
|
|
- <span style="font-weight:bold">{{item.fDays}}天</span>
|
|
|
+ <span style="font-weight:bold">{{ item.fDays }}天</span>
|
|
|
<br>
|
|
|
<span style="color: #999999">单证有效时间：</span>
|
|
|
- <span style="font-weight:bold">{{item.closing}}天</span>
|
|
|
+ <span style="font-weight:bold">{{ item.closing }}天</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="width: 30%;border-left: 1px solid #E8E8E8;display:flex;justify-content: space-around">
|
|
|
@@ -200,7 +207,7 @@
|
|
|
<div>20GP</div>
|
|
|
<div style="color:#bc1920 ">
|
|
|
<span>￥</span>
|
|
|
- <span style="font-size: 20px;">{{item.twenty}}</span>
|
|
|
+ <span style="font-size: 20px;">{{ item.twenty }}</span>
|
|
|
<span>起</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -222,12 +229,14 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="query">
|
|
|
- <el-button type="primary" @click="item.introduction = !item.introduction">{{item.introduction === false?'查看船期':'关闭列表'}}</el-button>
|
|
|
+ <el-button type="primary" @click="item.introduction = !item.introduction">
|
|
|
+ {{ item.introduction === false ? '查看船期' : '关闭列表' }}
|
|
|
+ </el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="width: 98%;background-color: #99a9bf;margin: 0 auto" v-if="item.introduction === true">
|
|
|
<div style="float: left;padding: 5px;color:#ffffff;">
|
|
|
- <span>{{item.portofloadidName}}</span>
|
|
|
+ <span>{{ item.portofloadidName }}</span>
|
|
|
→
|
|
|
<span>{{ item.portofdischargeidName }}</span>
|
|
|
</div>
|
|
|
@@ -267,7 +276,7 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="操作">
|
|
|
- <el-button type="primary">订舱</el-button>
|
|
|
+ <el-button type="primary" @click="placeAnOrder">订舱</el-button>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
@@ -285,14 +294,14 @@ export default {
|
|
|
name: 'inquiryAndOrder',
|
|
|
data() {
|
|
|
return {
|
|
|
- fMblnoOptions:[],
|
|
|
- portToPort:{
|
|
|
- fPortofloadid:'',
|
|
|
- fDistinationid:'',
|
|
|
- fEta:'',
|
|
|
- portofloadidName:''
|
|
|
+ fMblnoOptions: [],
|
|
|
+ portToPort: {
|
|
|
+ fPortofloadid: '',
|
|
|
+ fDistinationid: '',
|
|
|
+ fEta: '',
|
|
|
+ portofloadidName: ''
|
|
|
},
|
|
|
- detailedList:[],
|
|
|
+ detailedList: [],
|
|
|
value1: '',
|
|
|
selection: '1',
|
|
|
whether: false,
|
|
|
@@ -304,18 +313,18 @@ export default {
|
|
|
region: '',
|
|
|
type: ''
|
|
|
},
|
|
|
- list:[],
|
|
|
+ list: [],
|
|
|
tableData: []
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
handleSelect(key, keyPath) {
|
|
|
this.whether = false;
|
|
|
- this.activeIndex2 = key
|
|
|
+ this.activeIndex2 = key;
|
|
|
console.log(key, keyPath);
|
|
|
this.selection = key;
|
|
|
},
|
|
|
- schedule(){
|
|
|
+ schedule() {
|
|
|
console.log(this.detailedList);
|
|
|
// v-if="selection === '1'"
|
|
|
// switch (this.selection){
|
|
|
@@ -330,22 +339,43 @@ export default {
|
|
|
// default:
|
|
|
// break
|
|
|
// }
|
|
|
+ request({
|
|
|
+ url: '/shipping/voyage/freightList',
|
|
|
+ method: 'get',
|
|
|
+ params: this.portToPort
|
|
|
+ }).then(res => {
|
|
|
+ // console.log(res);
|
|
|
+ this.detailedList = [];
|
|
|
+ this.list = res.data.rows;
|
|
|
+ res.data.rows.map(((item, index) => {
|
|
|
+ this.detailedList.push(Object.assign({}, item, { introduction: false }));
|
|
|
+ }));
|
|
|
+ // console.log(this.detailedList);
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
},
|
|
|
- handleQuery(){
|
|
|
+ placeAnOrder(){
|
|
|
+ this.$router.push({ path: '/contractPlacing/index'});
|
|
|
+ },
|
|
|
+ handleQuery() {
|
|
|
// this.fMblnoOptions
|
|
|
request({
|
|
|
url: '/shipping/address/selectPortName',
|
|
|
method: 'get',
|
|
|
params: {
|
|
|
- fName:this.portToPort.fPortofloadid
|
|
|
+ fName: this.portToPort.fPortofloadid
|
|
|
}
|
|
|
- }).then(res => {
|
|
|
- console.log(res);
|
|
|
- this.fMblnoOptions = res.data.rows
|
|
|
- console.log(this.fMblnoOptions);
|
|
|
- }).catch(err => {
|
|
|
- console.log(err);
|
|
|
})
|
|
|
+ .then(res => {
|
|
|
+ console.log(res);
|
|
|
+ this.fMblnoOptions = res.data.rows;
|
|
|
+ console.log(this.fMblnoOptions);
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
};
|
caojunjie
