|
@@ -100,7 +100,7 @@
|
|
|
</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: 60%;line-height: 40px;">
|
|
|
+ <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>
|
|
@@ -113,7 +113,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width: 20%;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>
|
|
@@ -122,7 +122,7 @@
|
|
|
<span style="font-weight:bold">6天</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width: 25%;border-left: 1px solid #E8E8E8;display:flex;justify-content: space-around">
|
|
|
+ <div style="width: 30%;border-left: 1px solid #E8E8E8;display:flex;justify-content: space-around">
|
|
|
<div>
|
|
|
<div>20GP</div>
|
|
|
<div style="color:#bc1920 ">
|
|
@@ -152,6 +152,52 @@
|
|
|
<el-button type="primary">查看船期</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div style="width: 98%;background-color: #99a9bf;margin: 0 auto">
|
|
|
+ <div style="float: left;padding: 5px;color:#ffffff;">
|
|
|
+ <span>天津</span>
|
|
|
+ →
|
|
|
+ <span>青岛</span>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #EBEEF5">
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="date"
|
|
|
+ label="预计开航"
|
|
|
+ width="180">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{scope.row.date}}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="预计抵港"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="重箱回场截止时间">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="船名航次">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="20GP">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="40HC">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="address"
|
|
|
+ label="40RH">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -171,7 +217,24 @@ export default {
|
|
|
name: '',
|
|
|
region: '',
|
|
|
type: ''
|
|
|
- }
|
|
|
+ },
|
|
|
+ tableData: [{
|
|
|
+ date: '测试数据',
|
|
|
+ name: '测试数据',
|
|
|
+ address: '测试数据',
|
|
|
+ }, {
|
|
|
+ date: '测试数据',
|
|
|
+ name: '测试数据',
|
|
|
+ address: '测试数据'
|
|
|
+ }, {
|
|
|
+ date: '测试数据',
|
|
|
+ name: '测试数据',
|
|
|
+ address: '测试数据',
|
|
|
+ }, {
|
|
|
+ date: '测试数据',
|
|
|
+ name: '测试数据',
|
|
|
+ address: '测试数据'
|
|
|
+ }]
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
@@ -179,7 +242,7 @@ export default {
|
|
|
this.whether = false
|
|
|
console.log(key, keyPath);
|
|
|
this.selection = key;
|
|
|
- }
|
|
|
+ },
|
|
|
}
|
|
|
};
|
|
|
</script>
|