merge dev

src/auto-imports.d.ts

@@ -3,6 +3,7 @@
 // @ts-nocheck
 // noinspection JSUnusedGlobalSymbols
 // Generated by unplugin-auto-import
+// biome-ignore lint: disable
 export {}
 declare global {
   const $api: typeof import('@/api/index')['default']
@@ -68,6 +69,6 @@ declare global {
 // for type re-export
 declare global {
   // @ts-ignore
-  export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
+  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
   import('vue')
 }

src/components/ShipmentStatus/src/ShipmentStatus.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import dayjs from 'dayjs'
+import { useOverflow } from '@/hooks/useOverflow'
 
 const props = defineProps({
   data: Object
@@ -36,6 +37,10 @@ const getDateHeight = (index: number) => {
 const formatDate = (date: string) => {
   return date ? dayjs(date).format('MMM-DD-YYYY') : '--'
 }
+
+const pathRef = ref()
+
+const { isOverflow: isPathOverflow } = useOverflow(pathRef, props)
 </script>
 
 <template>
@@ -45,7 +50,7 @@ const formatDate = (date: string) => {
       :class="{
         last: !stepItem.isArrival
       }"
-      v-for="stepItem in simplexData"
+      v-for="(stepItem, index) in simplexData"
       :key="stepItem.index"
     >
       <div class="data">
@@ -53,7 +58,14 @@ const formatDate = (date: string) => {
         <div class="right-info">
           <div class="path">
             <div class="label">{{ stepItem.label }}</div>
-            <div class="detail-path">{{ stepItem.path }}</div>
+            <el-tooltip v-if="isPathOverflow?.[index]" placement="top">
+              <template #content>{{ stepItem.path }}</template>
+
+              <div ref="pathRef" class="detail-path single-line-ellipsis">{{ stepItem.path }}</div>
+            </el-tooltip>
+            <div v-else ref="pathRef" class="detail-path single-line-ellipsis">
+              {{ stepItem.path }}
+            </div>
           </div>
           <div
             class="transport-info"
@@ -202,4 +214,11 @@ const formatDate = (date: string) => {
     }
   }
 }
+.single-line-ellipsis {
+  height: 18px;
+  display: inline-block; /* 或者根据需要使用 inline-block */
+  white-space: nowrap; /* 不换行 */
+  overflow: hidden; /* 隐藏超出部分 */
+  text-overflow: ellipsis; /* 超出部分显示省略号 */
+}
 </style>

src/views/Booking/src/components/BookingDetail/src/components/AddReferenceDialog.vue

@@ -131,6 +131,9 @@ defineExpose({
         <template #refNo="{ row, column }">
           <el-input v-model="row[column.field]" placeholder="Enter Ref No." />
         </template>
+        <template>
+          <div>No data</div>
+        </template>
       </vxe-grid>
     </div>
   </el-dialog>

src/views/Booking/src/components/BookingDetail/src/components/ContainersView.vue

@@ -79,7 +79,11 @@ useRowClickStyle(tableRef)
 
 <template>
   <div class="containers">
-    <vxe-grid ref="tableRef" v-bind="tableData"> </vxe-grid>
+    <vxe-grid ref="tableRef" v-bind="tableData">
+      <template #empty>
+        <div class="empty">No data</div>
+      </template>
+    </vxe-grid>
   </div>
 </template>
 

src/views/Booking/src/components/BookingTable/src/BookingTable.vue

@@ -169,8 +169,8 @@ const bookingTable = ref<VxeGridProps<any>>({
   round: true,
   columns: [],
   data: [],
-  scrollY: { enabled: true, oSize: 20, gt: 30 },
-  scrollX: { enabled: true, gt: 20 },
+  scrollY: { enabled: true, oSize: 20, gt: 20, scrollToTopOnChange: true },
+  scrollX: { enabled: true, gt: 10, scrollToLeftOnChange: true },
   stripe: true,
   emptyText: ' ',
   showHeaderOverflow: true,

src/views/Tracking/src/components/TrackingDetail/src/components/AMS&ISF.vue

@@ -163,6 +163,9 @@ defineExpose({
         :style="{ border: 'none' }"
         v-bind="AMSTableData"
       >
+        <template #empty>
+          <div class="empty">No data</div>
+        </template>
       </vxe-grid>
       <div class="label" v-if="canViewISFLog">
         <span>ISF Log</span>
@@ -177,6 +180,9 @@ defineExpose({
         :style="{ border: 'none' }"
         v-bind="ISFTableData"
       >
+        <template #empty>
+          <div class="empty">No data</div>
+        </template>
       </vxe-grid>
     </div>
   </el-drawer>

src/views/Tracking/src/components/TrackingDetail/src/components/AddReferenceDialog.vue

@@ -131,6 +131,9 @@ defineExpose({
         <template #refNo="{ row, column }">
           <el-input v-model="row[column.field]" placeholder="Enter Ref No." />
         </template>
+        <template #empty>
+          <div class="empty">No data</div>
+        </template>
       </vxe-grid>
     </div>
   </el-dialog>

src/views/Tracking/src/components/TrackingDetail/src/components/AttachmentView.vue

@@ -125,6 +125,9 @@ const openUploadFilesDialog = () => {
           }}</span>
         </div>
       </template>
+      <template #empty>
+        <div class="empty">No data</div>
+      </template>
     </vxe-grid>
     <UploadFilesDialog ref="uploadFilesRef"></UploadFilesDialog>
   </div>

src/views/Tracking/src/components/TrackingDetail/src/components/ContainersView.vue

@@ -80,7 +80,11 @@ useRowClickStyle(tableRef)
 
 <template>
   <div class="containers">
-    <vxe-grid ref="tableRef" v-bind="tableData"> </vxe-grid>
+    <vxe-grid ref="tableRef" v-bind="tableData">
+      <template #empty>
+        <div class="empty">No data</div>
+      </template>
+    </vxe-grid>
   </div>
 </template>
 

src/views/Tracking/src/components/TrackingTable/src/TrackingTable.vue

@@ -221,7 +221,8 @@ const trackingTable = ref<any>({
   round: true,
   columns: [],
   data: [],
-  scrollY: { enabled: true, oSize: 20, gt: 30 },
+  scrollY: { enabled: true, oSize: 20, gt: 20, scrollToTopOnChange: true },
+  scrollX: { enabled: true, gt: 2, scrollToLeftOnChange: true },
   stripe: true,
   emptyText: ' ',
   showHeaderOverflow: true,

src/views/Tracking/src/components/TrackingTable/src/components/VGMView.vue

@@ -519,6 +519,9 @@ const stopScroll = (evt) => {
                 time-format="HH:mm:ss"
               />
             </template>
+            <template #empty>
+              <div class="empty">No data</div>
+            </template>
           </vxe-grid>
         </div>
       </div>