|
|
@@ -19,7 +19,9 @@
|
|
|
<div v-if="selection === '1'">
|
|
|
<el-input placeholder="请输入发货地址">
|
|
|
<template slot="prepend">发货地址</template>
|
|
|
- <el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">{{whether === false?'指定港口':'取消指定港口'}}</el-button>
|
|
|
+ <el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">
|
|
|
+ {{ whether === false ? '指定港口' : '取消指定港口' }}
|
|
|
+ </el-button>
|
|
|
</el-input>
|
|
|
<el-input placeholder="请输入货物名称">
|
|
|
<template slot="prepend">货物名称</template>
|
|
|
@@ -42,7 +44,9 @@
|
|
|
<div v-if="selection === '2'">
|
|
|
<el-input placeholder="请输入发货地址">
|
|
|
<template slot="prepend">发货地址</template>
|
|
|
- <el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">{{whether === false?'指定港口':'取消指定港口'}}</el-button>
|
|
|
+ <el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">
|
|
|
+ {{ whether === false ? '指定港口' : '取消指定港口' }}
|
|
|
+ </el-button>
|
|
|
</el-input>
|
|
|
<el-input placeholder="请输入货物名称">
|
|
|
<template slot="prepend">货物名称</template>
|
|
|
@@ -71,7 +75,9 @@
|
|
|
</el-input>
|
|
|
<el-input placeholder="请输入收货地址">
|
|
|
<template slot="prepend">收货地址</template>
|
|
|
- <el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">{{whether === false?'指定港口':'取消指定港口'}}</el-button>
|
|
|
+ <el-button slot="append" icon="el-icon-d-caret" @click="whether = !whether">
|
|
|
+ {{ whether === false ? '指定港口' : '取消指定港口' }}
|
|
|
+ </el-button>
|
|
|
</el-input>
|
|
|
<el-input placeholder="请输入预计装货时间">
|
|
|
<template slot="prepend">预计装货时间</template>
|
|
|
@@ -92,16 +98,18 @@
|
|
|
<el-input placeholder="请输入预计装货时间">
|
|
|
<template slot="prepend">预计装货时间</template>
|
|
|
</el-input>
|
|
|
- <button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
- <button style="width: 400px;height: 0;border: none;padding: 0;"></button>
|
|
|
+ <button class="stealthbutton"></button>
|
|
|
+ <button class="stealthbutton"></button>
|
|
|
</div>
|
|
|
<div>
|
|
|
<el-button type="primary">船期查询</el-button>
|
|
|
</div>
|
|
|
<el-divider>查询船期</el-divider>
|
|
|
- <div style="width: 100%;padding: 10px;display: flex;justify-content: space-around;border: 1px solid #E8E8E8;box-shadow: 0 2px 7px 0 rgb(71 71 71 / 20%);">
|
|
|
+ <div
|
|
|
+ style="width: 100%;padding: 10px;display: flex;justify-content: space-around;border: 1px solid #E8E8E8;box-shadow: 0 2px 7px 0 rgb(71 71 71 / 20%);">
|
|
|
<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">
|
|
|
+ <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">
|
|
|
丹东
|
|
|
</div>
|
|
|
<div style="width: 40px;height: 60px;float: left">
|
|
|
@@ -113,7 +121,8 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width: 25%;margin: 0 auto;display: flex;align-items: center;justify-content: center;border-left: 1px solid #E8E8E8">
|
|
|
+ <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">9天</span>
|
|
|
@@ -148,7 +157,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width: 15%;margin: 0 auto;display: flex;align-items: center;justify-content: center;border-left: 1px solid #E8E8E8">
|
|
|
+ <div class="query">
|
|
|
<el-button type="primary">查看船期</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -167,7 +176,7 @@
|
|
|
label="预计开航"
|
|
|
width="180">
|
|
|
<template slot-scope="scope">
|
|
|
- {{scope.row.date}}
|
|
|
+ {{ scope.row.date }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
@@ -209,7 +218,7 @@ export default {
|
|
|
return {
|
|
|
value1: '',
|
|
|
selection: '1',
|
|
|
- whether:false,
|
|
|
+ whether: false,
|
|
|
activeIndex: '1',
|
|
|
activeIndex2: '1',
|
|
|
labelPosition: 'right',
|
|
|
@@ -239,7 +248,7 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
handleSelect(key, keyPath) {
|
|
|
- this.whether = false
|
|
|
+ this.whether = false;
|
|
|
console.log(key, keyPath);
|
|
|
this.selection = key;
|
|
|
},
|
|
|
@@ -248,6 +257,15 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
+.query {
|
|
|
+ width: 15%;
|
|
|
+ margin: 0 auto;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ border-left: 1px solid #E8E8E8
|
|
|
+}
|
|
|
+
|
|
|
.outermost {
|
|
|
width: 80%;
|
|
|
margin: auto auto 100px auto;
|
|
|
@@ -257,6 +275,13 @@ export default {
|
|
|
flex-wrap: wrap;
|
|
|
}
|
|
|
|
|
|
+.stealthbutton {
|
|
|
+ width: 400px;
|
|
|
+ height: 0;
|
|
|
+ border: none;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
.outermost > div:nth-child(1) {
|
|
|
width: 80%;
|
|
|
display: flex;
|
|
|
@@ -273,6 +298,7 @@ export default {
|
|
|
align-items: center;
|
|
|
justify-content: center
|
|
|
}
|
|
|
+
|
|
|
.outermost > div:nth-child(1) > .el-input {
|
|
|
width: 400px;
|
|
|
margin-top: 5px;
|
caojunjie