feat: 合并master_zyh分支代码

src/styles/vxeTable.scss

@@ -38,6 +38,10 @@
   }
 }
 
+.vxe-table--body-inner-wrapper {
+  min-height: 40px !important;
+}
+
 .vxe-table--render-default .vxe-body--column.col--ellipsis,
 .vxe-table--render-default .vxe-footer--column.col--ellipsis,
 .vxe-table--render-default .vxe-header--column.col--ellipsis,

src/views/AIApiLog/src/components/TableView/src/TableView.vue

@@ -166,6 +166,12 @@ const tableData = ref<VxeGridProps<any>>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   sortConfig: {
     sortMethod: (params) => {
       const { data, sortList } = params

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

@@ -43,6 +43,12 @@ const tableData = ref<VxeGridProps<any>>({
       slots: { default: 'action' }
     }
   ],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   data: [],
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',

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

@@ -436,7 +436,9 @@ defineExpose({
                   {{ allData.marksAndDescription[1].content }}
                 </div>
                 <template #reference>
-                  <el-button class="description-see-all el-button--text">See All</el-button>
+                  <el-button class="description-see-all el-button--text">
+                    <span>See All</span>
+                  </el-button>
                 </template>
               </el-popover>
             </div>
@@ -600,7 +602,12 @@ defineExpose({
       right: 0;
       padding-right: 90px;
       padding-left: 17px;
-      background: linear-gradient(to right, transparent, rgb(255, 255, 250) 17px, white 40px);
+      background: linear-gradient(
+        to right,
+        transparent,
+        var(--color-mode) 17px,
+        var(--color-mode) 40px
+      );
     }
   }
 }
@@ -642,7 +649,11 @@ defineExpose({
     .description-see-all {
       position: absolute;
       top: 40px;
-      right: 26px;
+      right: 32px;
+      span {
+        font-size: 12px;
+        color: var(--color-theme);
+      }
     }
   }
 

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

@@ -14,6 +14,12 @@ const tableData = ref<VxeGridProps<any>>({
   round: true,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
   showHeaderOverflow: true,

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

@@ -200,6 +200,12 @@ const bookingTable = ref<VxeGridProps<any>>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   menuConfig: {
     body: {
       options: [

src/views/ChatLog/src/components/TableView/src/TableView.vue

@@ -168,6 +168,12 @@ const tableData = ref<VxeGridProps<any>>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   sortConfig: {
     sortMethod: (params) => {
       const { data, sortList } = params

src/views/OperationLog/src/components/BookingTable/src/BookingTable.vue

@@ -165,6 +165,12 @@ const bookingTable = ref<VxeGridProps<any>>({
   emptyText: ' ',
   showHeaderOverflow: true,
   showOverflow: true,
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },

src/views/SystemSettings/src/components/MonitoringTable/src/MonitoringTable.vue

@@ -49,6 +49,12 @@ const tableData = ref<VxeGridProps<any>>({
   maxHeight: 660,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   stripe: true,
   emptyText: ' ',
@@ -76,7 +82,7 @@ const handleColumns = (columns: any) => {
         ...curColumn,
         formatter: ({ cellValue }: any) => formatTimezone(cellValue)
       }
-    }  else if (item.type === 'link') {
+    } else if (item.type === 'link') {
       curColumn = {
         ...curColumn,
         slots: { default: 'trackingNo' }
@@ -196,10 +202,7 @@ onMounted(() => {
       </template>
       <!-- Tracking No字段的插槽 -->
       <template #trackingNo="{ row, column }">
-        <span
-          style="color: var(--color-theme); cursor: pointer"
-          @click="handleedittow(row)"
-        >
+        <span style="color: var(--color-theme); cursor: pointer" @click="handleedittow(row)">
           {{ row[column.field] }}
         </span>
       </template>

src/views/SystemSettings/src/components/SettingTable/src/SettingTable.vue

@@ -28,6 +28,12 @@ const tableData = ref<VxeGridProps<any>>({
   maxHeight: 500,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   stripe: true,
   emptyText: ' ',
@@ -55,7 +61,7 @@ const handleColumns = (columns: any) => {
         ...curColumn,
         formatter: ({ cellValue }: any) => formatTimezone(cellValue)
       }
-    }  else if (item.type === 'link') {
+    } else if (item.type === 'link') {
       curColumn = {
         ...curColumn,
         slots: { default: 'trackingNo' }
@@ -152,10 +158,7 @@ const getpaginationTableData = () => {
       </template>
       <!-- Tracking No字段的插槽 -->
       <template #trackingNo="{ row, column }">
-        <span
-          style="color: var(--color-theme); cursor: pointer"
-          @click="handleLinkClick(row)"
-        >
+        <span style="color: var(--color-theme); cursor: pointer" @click="handleLinkClick(row)">
           {{ row[column.field] }}
         </span>
       </template>

src/views/Tracking/src/TrackingView.vue

@@ -164,7 +164,7 @@ const TransportSearch = (val: any) => {
 // defaultTransport
 const defaultTransport = (val: any, value: any) => {
   filterData.transportData = []
-  if (val.data.length !=0) {
+  if (val.data.length != 0) {
     let str = `${val.title}:${val.data}`
     filterData.transportData.push(str)
   }
@@ -188,6 +188,7 @@ const defaultDate = (val: any, value: any, data: any) => {
       filterData.daterangeData.push(str)
     }
   }
+
   if (sessionStorage.getItem('searchTableQeuryTracking') == null) {
     if (
       sessionStorage.getItem('clickParams') === null ||
@@ -201,13 +202,6 @@ const defaultDate = (val: any, value: any, data: any) => {
         searchTableQeuryTracking.etd_start = value[key].data[0]
         searchTableQeuryTracking.etd_end = value[key].data[1]
       }
-      const trackingData = JSON.parse(localStorage.getItem('searchData'))
-      if (trackingData) {
-        // 根据顶部搜索框的搜索结果赋值
-        initDataByHeaderSearch()
-      } else {
-        Gettrackingdata()
-      }
     }
     // else {
     //   for (const key in value) {
@@ -220,8 +214,17 @@ const defaultDate = (val: any, value: any, data: any) => {
     if (searchTableQeuryTracking._textSearch) {
       TrackingSearch.value = searchTableQeuryTracking._textSearch
     }
+  }
+
+  const rawData = localStorage.getItem('searchData')
+  const trackingData = rawData ? JSON.parse(rawData) : null
+  if (trackingData) {
+    // 根据顶部搜索框的搜索结果赋值
+    initDataByHeaderSearch()
+  } else {
     Gettrackingdata()
   }
+
   renderTagsData()
 }
 //DateRangeSearch

src/views/Tracking/src/components/PublicTracking/src/components/MilestonesTable.vue

@@ -24,6 +24,12 @@ const tableData = ref<VxeGridProps<any>>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   columnConfig: { resizable: true, useKey: true },
   rowConfig: { isHover: true }
 })

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

@@ -74,6 +74,12 @@ const AMSTableData = ref<VxeGridProps<any>>({
   data: [],
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   showHeaderOverflow: true,
   showOverflow: true,
   headerRowStyle: {
@@ -103,6 +109,12 @@ const ISFTableData = ref<VxeGridProps<any>>({
   maxHeight: 500,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
   showHeaderOverflow: true,

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

@@ -44,6 +44,12 @@ const tableData = ref<VxeGridProps<any>>({
     }
   ],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
   showHeaderOverflow: true,

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

@@ -14,6 +14,12 @@ const tableData = ref<VxeGridProps<any>>({
   round: true,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
   showHeaderOverflow: true,

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

@@ -425,7 +425,9 @@ defineExpose({
                   {{ allData.marksAndDescription[1].content }}
                 </div>
                 <template #reference>
-                  <el-button class="description-see-all el-button--text">See All</el-button>
+                  <el-button class="description-see-all el-button--text">
+                    <span>See All</span>
+                  </el-button>
                 </template>
               </el-popover>
             </div>
@@ -589,7 +591,12 @@ defineExpose({
       right: 0;
       padding-right: 90px;
       padding-left: 17px;
-      background: linear-gradient(to right, transparent, rgb(255, 255, 250) 17px, white 40px);
+      background: linear-gradient(
+        to right,
+        transparent,
+        var(--color-mode) 17px,
+        var(--color-mode) 40px
+      );
     }
   }
 }
@@ -631,7 +638,11 @@ defineExpose({
     .description-see-all {
       position: absolute;
       top: 40px;
-      right: 26px;
+      right: 32px;
+      span {
+        font-size: 12px;
+        color: var(--color-theme);
+      }
     }
   }
 

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

@@ -14,6 +14,16 @@ const tableData = ref<VxeGridProps<any>>({
   round: true,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
+  expandConfig: {
+    expandAll: false,
+    expandRowKeys: []
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
   showHeaderOverflow: true,
@@ -48,7 +58,7 @@ const handleColumns = (columns: any) => {
     }
     return curColumn
   })
-  return newColumns
+  return [{ type: 'expand', width: 40, slots: { content: 'expand_content' } }, ...newColumns]
 }
 watch(
   () => props.data,
@@ -57,9 +67,17 @@ watch(
     if (containers && containers.container_column) {
       tableData.value.columns = handleColumns(containers.container_column)
       tableData.value.data = containers.container_data
-      // nextTick(() => {
-      //   tableRef.value && autoWidth(tableData.value, tableRef.value)
-      // })
+      tableRef.value?.reloadData(containers.container_data)
+      setTimeout(() => {
+        // tableRef.value && autoWidth(tableData.value, tableRef.value)
+        tableRef.value?.reloadData(containers.container_data)
+        if (
+          tableData.value.data?.length > 0 &&
+          tableData.value.data[0].containerStatusData.length > 0
+        ) {
+          tableRef.value?.toggleRowExpand(tableData.value.data[0])
+        }
+      }, 100)
     }
   },
   {
@@ -75,6 +93,30 @@ useRowClickStyle(tableRef)
 <template>
   <div class="containers">
     <vxe-grid ref="tableRef" v-bind="tableData">
+      <template #expand_content="{ row }">
+        <div class="container-table-status">
+          <div class="step-item" v-for="(item, index) in row.containerStatusData" :key="item.title">
+            <div class="step-data">
+              <div class="step-dot-icon"></div>
+              <div class="info">
+                <div class="left-info">
+                  <div class="title">{{ item.title }}</div>
+                  <div class="date value-color">{{ formatTimezone(item.date, item.timezone) }}</div>
+                </div>
+                <div class="center-code">
+                  <span>Location Code: </span>
+                  <span class="value-color">{{ item.code }}</span>
+                </div>
+                <div class="right-city">
+                  <span>Location City: </span>
+                  <span class="value-color">{{ item.uncity }}</span>
+                </div>
+              </div>
+            </div>
+            <div class="line" v-if="index + 1 !== row.containerStatusData.length"></div>
+          </div>
+        </div>
+      </template>
       <template #empty>
         <div class="empty">No data</div>
       </template>
@@ -87,4 +129,128 @@ useRowClickStyle(tableRef)
   padding: 8px 16px 16px;
 }
 </style>
-<style lang="scss"></style>
+<style lang="scss" scoped>
+.container-table-status {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  overflow: auto;
+  .container {
+    flex: 1;
+    padding-bottom: 8px;
+    overflow: auto;
+  }
+  .empty-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    height: 358px;
+    padding-top: 140px;
+
+    .empty-text {
+      margin-top: 8px;
+      color: #b5b9bf;
+    }
+  }
+  .footer {
+    // line-height: 38px;
+    padding: 12px 0;
+    color: #999;
+    font-size: 12px;
+    text-align: center;
+    border-top: 1px solid var(--color-border);
+    overflow: hidden;
+    .link {
+      text-decoration: none;
+      color: var(--color-theme);
+    }
+  }
+}
+</style>
+<style lang="scss">
+.container-table-status {
+  max-height: 300px;
+  padding: 40px 20px;
+  overflow: auto;
+  box-sizing: border-box;
+  .el-collapse {
+    height: auto;
+    border-bottom: 0;
+  }
+  .el-collapse-item__content {
+    padding: 30px 16px 38px;
+    border-top: 1px solid var(--color-border);
+  }
+  .el-collapse-item__header {
+    height: 40px;
+    padding-left: 16px;
+    padding-right: 8px;
+    line-height: 50px;
+    & > .title {
+      font-size: 16px;
+      color: var(--color-neutral-2);
+      span {
+        margin-left: 4px;
+        font-weight: 700;
+        color: var(--color-neutral-1);
+      }
+    }
+  }
+  .step-data {
+    display: flex;
+    gap: 8px;
+    height: 8px;
+    width: 100%;
+    .step-dot-icon {
+      height: 8px;
+      width: 8px;
+      background-color: var(--color-neutral-1);
+      border-radius: 50%;
+    }
+    .info {
+      flex: 1;
+      display: flex;
+      height: 57px;
+      margin-top: -22px;
+      background-color: var(--color-container-status-node-bg);
+      border: 1px solid var(--color-border);
+      border-radius: 6px;
+      color: var(--color-neutral-1);
+      .left-info {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        max-width: 360px;
+        padding: 10px 10px;
+        .title {
+          font-size: 14px;
+          line-height: 18px;
+          font-weight: 700;
+        }
+        .date {
+          font-size: 12px;
+        }
+      }
+      .center-code {
+        min-width: 320px;
+        line-height: 57px;
+      }
+      .right-city {
+        min-width: 320px;
+        line-height: 57px;
+      }
+      .value-color {
+        color: var(--color-neutral-2);
+      }
+    }
+  }
+  .line {
+    height: 60px;
+    width: 0;
+    margin-left: 3px;
+    border-left: 1px solid var(--color-neutral-1);
+  }
+}
+</style>

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

@@ -22,6 +22,12 @@ const tableData = ref<VxeGridProps<any>>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   columnConfig: { resizable: true, useKey: true },
   rowConfig: { isHover: true }
 })

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

@@ -266,6 +266,12 @@ const trackingTable = ref<any>({
   border: true,
   round: true,
   columns: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   data: [],
   scrollY: { enabled: true, oSize: 20, gt: 20, scrollToTopOnChange: true },
   scrollX: { enabled: true, gt: 2, scrollToLeftOnChange: true },
@@ -275,7 +281,6 @@ const trackingTable = ref<any>({
   headerRowStyle: {
     backgroundColor: 'var(--color-table-header-bg)'
   },
-  // action栏特殊的样式
   // cellStyle: ({ column }) => {
   //   if (column.title === 'Action' && themeStore.theme === 'dark') {
   //     return {
@@ -639,7 +644,7 @@ defineExpose({
       </template>
       <!-- action操作的插槽 -->
       <template #action="{ row }">
-        <el-tooltip class="box-item" effect="dark" content="Subscribe" placement="top">
+        <el-tooltip effect="dark" content="Subscribe" placement="top">
           <el-button class="recent_button el-button--blue" @click="SubscribeShipments(row)">
             <span v-if="row.is_subscribe" style="color: 'red'" class="iconfont_icon">
               <svg class="iconfont" aria-hidden="true" style="fill: var(--color-theme)">

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

@@ -66,6 +66,12 @@ const tableData = ref<VxeGridProps<any>>({
   round: true,
   columns: [],
   data: [],
+  cellConfig: {
+    height: 40
+  },
+  headerCellConfig: {
+    height: 40
+  },
   scrollY: { enabled: true, oSize: 20, gt: 30 },
   emptyText: ' ',
   showHeaderOverflow: true,