From c81e3c41d0ca89d842f4aa4fbec90dd51d0cf3b4 Mon Sep 17 00:00:00 2001
From: sankeyangshu <1260323835@qq.com>
Date: Tue, 10 Dec 2024 18:14:22 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E8=A1=A8=E5=A4=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/styles/element.scss                       |  3 ---
 src/views/Boat/components/BoatTable.vue       | 19 +++++++------------
 src/views/Boat/components/HistoryTable.vue    | 13 ++++++-------
 src/views/Boat/components/LoadMap.vue         |  7 +++++--
 src/views/History/components/HistoryTable.vue | 12 ++++++------
 src/views/Send/components/HistoryTable.vue    | 12 ++++++------
 src/views/Send/components/SendTable.vue       | 19 +++++++------------
 7 files changed, 37 insertions(+), 48 deletions(-)

diff --git a/src/styles/element.scss b/src/styles/element.scss
index 672f7e1..d297eb3 100644
--- a/src/styles/element.scss
+++ b/src/styles/element.scss
@@ -2,9 +2,6 @@
   --el-table-border-color: rgb(127 127 127 / 100%);
   --el-table-current-row-bg-color: #ffc;
 }
-.el-table .cell {
-  white-space: pre;
-}
 .el-table__header th {
   font-weight: bold;
   color: #fff;
diff --git a/src/views/Boat/components/BoatTable.vue b/src/views/Boat/components/BoatTable.vue
index 765c50a..478efe6 100644
--- a/src/views/Boat/components/BoatTable.vue
+++ b/src/views/Boat/components/BoatTable.vue
@@ -25,24 +25,14 @@
         >
           <el-table-column prop="ship.name" label="船名" align="center" />
           <el-table-column prop="voyage" label="航次" align="center" />
-          <el-table-column align="center">
-            <template #header>
-              <el-tooltip effect="dark" :content="'装货港 / 装货码头'" placement="top">
-                <span>装货港 / 装货码头</span>
-              </el-tooltip>
-            </template>
+          <el-table-column align="center" label="装货港/装货码头" width="130">
             <template #default="scope">
               <div class="goods-name">
                 {{ scope.row.loadPort.name }} / {{ scope.row.loadWharf.name }}
               </div>
             </template>
           </el-table-column>
-          <el-table-column label="卸货港 / 卸货码头" align="center">
-            <template #header>
-              <el-tooltip effect="dark" content="卸货港 / 卸货码头" placement="top">
-                <span>卸货港 / 卸货码头</span>
-              </el-tooltip>
-            </template>
+          <el-table-column label="卸货港/卸货码头" width="130" align="center">
             <template #default="scope">
               <div class="goods-name">
                 {{ scope.row.dischargePort.name }} / {{ scope.row.dischargeWharf.name }}
@@ -252,6 +242,11 @@ const onClickCellOpenDetail = (row: BoatInfoType) => {
     }
     .footer-table {
       position: relative;
+      .goods-name {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
       .update-btn {
         display: flex;
         align-items: center;
diff --git a/src/views/Boat/components/HistoryTable.vue b/src/views/Boat/components/HistoryTable.vue
index e26fd60..a0cea0e 100644
--- a/src/views/Boat/components/HistoryTable.vue
+++ b/src/views/Boat/components/HistoryTable.vue
@@ -54,12 +54,7 @@
         <el-table-column prop="deck" label="舱层" align="center" />
         <el-table-column prop="cabin" label="舱段" align="center" />
         <el-table-column prop="billNo" label="提单号" align="center" />
-        <el-table-column label="货名/品牌/型号" align="center">
-          <template #header>
-            <el-tooltip effect="dark" content="货名/品牌/型号" placement="top">
-              <span>货名/品牌/型号</span>
-            </el-tooltip>
-          </template>
+        <el-table-column label="货名/品牌/型号" width="130" align="center">
           <template #default="scope">
             <div class="goods-name">
               {{ scope.row.goodsName }}/{{ scope.row.brand.name }}/{{ scope.row.model }}
@@ -83,7 +78,6 @@
             </el-tooltip>
           </template>
         </el-table-column>
-        <!-- TODO:港口没有 -->
         <el-table-column prop="consigner" label="发货人" align="center" />
         <el-table-column prop="consignee" label="收货人" align="center" />
         <el-table-column prop="goodsStatus" label="货物状态" align="center" />
@@ -424,6 +418,11 @@ const onClickExportManifestDetail = () => {
         color: #aaa;
       }
     }
+    .goods-name {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
   }
 }
 </style>
diff --git a/src/views/Boat/components/LoadMap.vue b/src/views/Boat/components/LoadMap.vue
index 6eec4e7..07d07c4 100644
--- a/src/views/Boat/components/LoadMap.vue
+++ b/src/views/Boat/components/LoadMap.vue
@@ -440,8 +440,11 @@ const onClickReturn = () => {
       border-radius: 13px;
       .map-content {
         display: flex;
-        flex-direction: row-reverse;
+        flex-flow: row-reverse nowrap;
         width: 100%;
+        max-width: 100%;
+        overflow-x: auto;
+        white-space: nowrap;
         .triangle-right {
           width: 0;
           height: 0;
@@ -453,8 +456,8 @@ const onClickReturn = () => {
           width: 258px;
           height: 300px;
           margin-right: 3px;
-          overflow: hidden;
           .map-deck-title {
+            width: 100%;
             height: 30px;
             font-weight: 700;
             line-height: 30px;
diff --git a/src/views/History/components/HistoryTable.vue b/src/views/History/components/HistoryTable.vue
index a9b7cb6..96959d3 100644
--- a/src/views/History/components/HistoryTable.vue
+++ b/src/views/History/components/HistoryTable.vue
@@ -32,12 +32,7 @@
         <el-table-column prop="deck" label="舱层" align="center" />
         <el-table-column prop="cabin" label="舱段" align="center" />
         <el-table-column prop="billNo" label="提单号" align="center" />
-        <el-table-column label="货名/品牌/型号" align="center">
-          <template #header>
-            <el-tooltip effect="dark" content="货名/品牌/型号" placement="top">
-              <span>货名/品牌/型号</span>
-            </el-tooltip>
-          </template>
+        <el-table-column label="货名/品牌/型号" width="130" align="center">
           <template #default="scope">
             <div class="goods-name">
               {{ scope.row.goodsName }}/{{ scope.row.brand.name }}/{{ scope.row.model }}
@@ -222,5 +217,10 @@ const onClickOpenManifestDetail = async (row: ManifestType) => {
       }
     }
   }
+  .goods-name {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
 }
 </style>
diff --git a/src/views/Send/components/HistoryTable.vue b/src/views/Send/components/HistoryTable.vue
index bcd5e59..e81cd1e 100644
--- a/src/views/Send/components/HistoryTable.vue
+++ b/src/views/Send/components/HistoryTable.vue
@@ -57,12 +57,7 @@
         <el-table-column prop="deck" label="舱层" align="center" />
         <el-table-column prop="cabin" label="舱段" align="center" />
         <el-table-column prop="billNo" label="提单号" align="center" />
-        <el-table-column label="货名/品牌/型号" align="center">
-          <template #header>
-            <el-tooltip effect="dark" content="货名/品牌/型号" placement="top">
-              <span>货名/品牌/型号</span>
-            </el-tooltip>
-          </template>
+        <el-table-column label="货名/品牌/型号" width="130" align="center">
           <template #default="scope">
             <div class="goods-name">
               {{ scope.row?.goodsName }}/{{ scope.row.brand?.name }}/{{ scope.row?.model }}
@@ -390,6 +385,11 @@ const endManifestDetail = () => {
         box-shadow: 5px 5px 5px rgb(0 0 0 / 34.9%);
       }
     }
+    .goods-name {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
   }
 }
 </style>
diff --git a/src/views/Send/components/SendTable.vue b/src/views/Send/components/SendTable.vue
index 9e950cf..dd4e4f2 100644
--- a/src/views/Send/components/SendTable.vue
+++ b/src/views/Send/components/SendTable.vue
@@ -17,24 +17,14 @@
         >
           <el-table-column prop="ship.name" label="船名" align="center" />
           <el-table-column prop="voyage" label="航次" align="center" />
-          <el-table-column label="装货港 / 装货码头" align="center">
-            <template #header>
-              <el-tooltip effect="dark" :content="'装货港 / 装货码头'" placement="top">
-                <span>装货港 / 装货码头</span>
-              </el-tooltip>
-            </template>
+          <el-table-column label="装货港/装货码头" width="130" align="center">
             <template #default="scope">
               <div class="goods-name">
                 {{ scope.row.loadPort?.name }} / {{ scope.row.loadWharf?.name }}
               </div>
             </template>
           </el-table-column>
-          <el-table-column label="卸货港 / 卸货码头" align="center">
-            <template #header>
-              <el-tooltip effect="dark" content="卸货港 / 卸货码头" placement="top">
-                <span>卸货港 / 卸货码头</span>
-              </el-tooltip>
-            </template>
+          <el-table-column label="卸货港/卸货码头" width="130" align="center">
             <template #default="scope">
               <div class="goods-name">
                 {{ scope.row.dischargePort?.name }} / {{ scope.row.dischargeWharf?.name }}
@@ -185,6 +175,11 @@ const onClickOpenDetail = async (row: BoatInfoType) => {
     .footer-table {
       position: relative;
       flex: 1;
+      .goods-name {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
       .update-btn {
         display: flex;
         align-items: center;