.

src/views/inquiryAndOrder/index.vue

@@ -148,6 +148,10 @@
         <el-button type="primary" @click="schedule" v-else>船期查询</el-button>
       </div>
       <el-divider>查询船期</el-divider>
+      <div style="margin: 0 auto;" v-if="detailedList.length === 0">
+        <i class="el-icon-s-release" style="font-size: 100px;color: #b7b7b7"></i>
+        <p>暂无数据</p>
+      </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);">
@@ -218,50 +222,47 @@
             </div>
           </div>
           <div class="query">
-            <el-button type="primary" @click="item.introduction = !item.introduction">查看船期</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>天津</span>
+            <span>{{item.portofloadidName}}</span>
             →
-            <span>青岛</span>
+            <span>{{ item.portofdischargeidName }}</span>
           </div>
           <div style="border: 1px solid #EBEEF5">
             <el-table
-              :data="tableData"
-              style="width: 100%">
+              :data="item.freight"
+              style="width: 100%"
+              :header-cell-style="{textAlign: 'center'}"
+              :cell-style="{ textAlign: 'center' }">
               <el-table-column
-                prop="date"
-                label="预计开航"
-                width="180">
-                <template slot-scope="scope">
-                  {{ scope.row.date }}
-                </template>
+                prop="fEta"
+                label="预计开航">
               </el-table-column>
               <el-table-column
-                prop="name"
-                label="预计抵港"
-                width="180">
+                prop="fEtd"
+                label="预计抵港">
               </el-table-column>
               <el-table-column
-                prop="address"
-                label="重箱回场截止时间">
+                prop="fCutoffdate"
+                label="截港日期">
               </el-table-column>
               <el-table-column
-                prop="address"
+                prop="pidName"
                 label="船名航次">
               </el-table-column>
               <el-table-column
-                prop="address"
+                prop="twenty"
                 label="20GP">
               </el-table-column>
               <el-table-column
-                prop="address"
+                prop="fortyHc"
                 label="40HC">
               </el-table-column>
               <el-table-column
-                prop="address"
+                prop="fortyRh"
                 label="40RH">
               </el-table-column>
               <el-table-column
@@ -304,23 +305,7 @@ export default {
         type: ''
       },
       list:[],
-      tableData: [{
-        date: '测试数据',
-        name: '测试数据',
-        address: '测试数据',
-      }, {
-        date: '测试数据',
-        name: '测试数据',
-        address: '测试数据'
-      }, {
-        date: '测试数据',
-        name: '测试数据',
-        address: '测试数据',
-      }, {
-        date: '测试数据',
-        name: '测试数据',
-        address: '测试数据'
-      }]
+      tableData: []
     };
   },
   methods: {
@@ -345,18 +330,19 @@ export default {
       //   default:
       //     break
       // }
+
       request({
         url: '/shipping/voyage/freightList',
         method: 'get',
         params: this.portToPort
       }).then(res => {
-        console.log(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);
+        // console.log(this.detailedList);
       }).catch(err => {
         console.log(err);
       })