Merge branch 'test_zyh' of United_Software/k_online_ui into test

src/views/DestinationDelivery/src/components/CreateNewBooking/src/components/NewbookingTable.vue

@@ -30,7 +30,7 @@ const tableData = ref<VxeGridProps<any>>({
     backgroundColor: 'var(--color-table-header-bg)'
   },
   columnConfig: { resizable: true, useKey: true },
-  rowConfig: { isHover: true, isCurrent: true },
+  rowConfig: { isHover: true, isCurrent: true }
 })
 
 const tableRef = ref<VxeGridInstance | null>(null)
@@ -48,7 +48,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' }
@@ -57,7 +57,7 @@ const handleColumns = (columns: any) => {
       curColumn = {
         ...curColumn,
         formatter: ({ cellValue }: any) => {
-          const array = cellValue.split("-")
+          const array = cellValue.split('-')
           return `${formatTimezone(array[0])} - ${formatTimezone(array[1])}`
         }
       }
@@ -71,15 +71,13 @@ const getTableColumns = async () => {
   tableLoadingColumn.value = true
   await $api.BookingTableColumn().then((res: any) => {
     if (res.code === 200) {
-      if(a == undefined) {
+      if (a == undefined) {
         tableData.value.columns = [
           { type: 'checkbox', width: 50, fixed: 'left' },
           ...handleColumns(res.data.TrackingTableColumns)
         ]
-      }else {
-        tableData.value.columns = [
-          ...handleColumns(res.data.TrackingTableColumns)
-        ]
+      } else {
+        tableData.value.columns = [...handleColumns(res.data.TrackingTableColumns)]
       }
     }
   })
@@ -96,15 +94,15 @@ const getTableData = (val: any) => {
 const searchTableData = (val: any) => {
   tableLoadingTable.value = true
   $api
-  .BookingTableSearch({
-    ...val
-  })
-  .then((res: any) => {
-    if (res.code === 200) {
-      tableLoadingTable.value = false
-      tableData.value.data = res.data.data
-    }
-  })
+    .BookingTableSearch({
+      ...val
+    })
+    .then((res: any) => {
+      if (res.code === 200) {
+        tableLoadingTable.value = false
+        tableData.value.data = res.data.data
+      }
+    })
 }
 
 const emits = defineEmits(['selectChangeEvent'])
@@ -116,78 +114,100 @@ let checkShipmentsdata = []
 let checkShipmentsInfo = {}
 let checkShipmentsSubmitInfo = {}
 const checkUniformArray = (arrary: Array<{ consignee_id: any; country: any }>) => {
-  if (arrary.length === 0) return false;
-  const first = arrary[0];
+  if (arrary.length === 0) return false
+  const first = arrary[0]
   for (let i = 1; i < arrary.length; i++) {
     if (arrary[i].consignee_id !== first.consignee_id) {
-        return false;
+      return false
     }
   }
-  return [first];
+  return [first]
 }
-const selectChangeEvent = () => {
+
+// 将具有相同same_mbol的行选中或取消选中
+const selectRowsWithSameMbol = ({ row, checked }) => {
+  const key = row.same_mbol
+  if (!key) return
+  const tableRowData = tableRef.value?.getTableData().fullData || []
+  tableRowData.forEach((item, index) => {
+    if (item.same_mbol === key) {
+      tableRef.value?.setCheckboxRow(item, checked)
+    }
+  })
+}
+const selectChangeEvent = (selectItem) => {
+  selectRowsWithSameMbol(selectItem)
   const $grid = tableRef.value
   if ($grid) {
     const records = $grid.getCheckboxRecords()
-    checkShipments = records.map(item => ({ consignee_id: item.consignee_id, country: item.dc_country }))
-    checkRecommend = records.map(item => ({ date_range: item.date_range.split('-'), Hbol: item.h_bol  }))
+    checkShipments = records.map((item) => ({
+      consignee_id: item.consignee_id,
+      country: item.dc_country
+    }))
+    checkRecommend = records.map((item) => ({
+      date_range: item.date_range.split('-'),
+      Hbol: item.h_bol
+    }))
     const array = checkUniformArray(checkShipments)
-    if(array != false) {
+    if (array != false) {
       checkShipmentsdata = Object.keys(checkUniformArray(checkShipments)?.[0])
       checkShipmentsSubmit = Object.keys(records?.[0])
       checkShipmentsdata.forEach((item) => {
         Object.assign(checkShipmentsInfo, {
-          [item]: array.map((row) => row[item] )
+          [item]: array.map((row) => row[item])
         })
       })
       checkShipmentsSubmit.forEach((item) => {
         Object.assign(checkShipmentsSubmitInfo, {
           [item]: records.map((row) => {
-            if(row[item] == null){
+            if (row[item] == null) {
               return ''
             } else {
               return row[item]
             }
-          } )
+          })
         })
       })
     } else {
       checkShipmentsSubmitInfo = {}
       checkShipmentsInfo = {}
     }
-    emits('selectChangeEvent',checkShipmentsInfo, checkRecommend,checkShipmentsSubmitInfo)
+    emits('selectChangeEvent', checkShipmentsInfo, checkRecommend, checkShipmentsSubmitInfo)
   }
 }
 // 全选
-const selectAllChangeEvent= () => {
+const selectAllChangeEvent = () => {
   const $grid = tableRef.value
   if ($grid) {
     const records = $grid.getCheckboxRecords()
-    checkShipments = records.map(item => ({ consignee_id: item.consignee_id }))
-    checkRecommend = records.map(item => ({ date_range: item.date_range.split('-'), Hbol: item.h_bol }))
-    if(checkShipments.length != 0) {
+    checkShipments = records.map((item) => ({ consignee_id: item.consignee_id }))
+    checkRecommend = records.map((item) => ({
+      date_range: item.date_range.split('-'),
+      Hbol: item.h_bol
+    }))
+    if (checkShipments.length != 0) {
       checkShipmentsdata = Object.keys(checkShipments?.[0])
       checkShipmentsSubmit = Object.keys(records?.[0])
       checkShipmentsdata.forEach((item) => {
         Object.assign(checkShipmentsInfo, {
-          [item]: checkShipments.map((row) => row[item] )
+          [item]: checkShipments.map((row) => row[item])
         })
       })
       checkShipmentsSubmit.forEach((item) => {
         Object.assign(checkShipmentsSubmitInfo, {
           [item]: records.map((row) => {
-            if(row[item] == null){
+            if (row[item] == null) {
               return ''
             } else {
               return row[item]
             }
-          } )
+          })
         })
       })
     } else {
       checkShipmentsSubmitInfo = {}
     }
-    emits('selectChangeEvent',checkShipmentsInfo, checkRecommend,checkShipmentsSubmitInfo)
+    emits('selectChangeEvent', checkShipmentsInfo, checkRecommend, checkShipmentsSubmitInfo)
   }
 }
 
@@ -201,7 +221,6 @@ defineExpose({
   getTableData,
   searchTableData
 })
-
 </script>
 
 <template>
@@ -218,9 +237,7 @@ defineExpose({
         <div v-if="isNotActivated" class="empty-text">
           This service isn't activated yet. Please contact our team to enable it.
         </div>
-        <div v-else class="empty-text">
-          No eligible shipments found to create a new booking.
-        </div>
+        <div v-else class="empty-text">No eligible shipments found to create a new booking.</div>
       </template>
     </vxe-grid>
   </div>

src/views/Tracking/src/components/DownloadAttachment/src/DownloadAttachment.vue

@@ -8,9 +8,12 @@ const userStore = useUserStore()
 const router = useRouter()
 const trackingDownloadData = useTrackingDownloadData()
 const attachmentData = ref([])
+const bodyLoading = ref(false)
+const pageLoading = ref(false)
 
 // const shipments = ref(attachmentData)
 const getAttachmentData = () => {
+  pageLoading.value = true
   $api
     .getDownloadAttachmentData({
       serial_no_arr: trackingDownloadData.serialNoArr,
@@ -21,6 +24,9 @@ const getAttachmentData = () => {
         attachmentData.value = res.data
       }
     })
+    .finally(() => {
+      pageLoading.value = false
+    })
 }
 onMounted(() => {
   getAttachmentData()
@@ -196,6 +202,7 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
     ElMessage.warning('Please select at least one file to download.')
     return
   }
+  bodyLoading.value = true
 
   $api
     .downloadAttachment({
@@ -237,11 +244,21 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
       window.URL.revokeObjectURL(downloadUrl)
       document.body.removeChild(a)
     })
+    .finally(() => {
+      bodyLoading.value = false
+    })
 }
 </script>
 
 <template>
-  <div class="tracking-download-attachment">
+  <div
+    class="tracking-download-attachment"
+    v-loading.fullscreen.lock="bodyLoading"
+    element-loading-text="Loading..."
+    element-loading-custom-class="element-loading"
+    element-loading-background="rgb(43, 47, 54, 0.7)"
+    v-vloading="pageLoading"
+  >
     <div class="left-select-section">
       <div class="header-select-all">
         <el-checkbox v-model="isAllSelected"><span>Select All</span></el-checkbox>
@@ -331,7 +348,7 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
                 :key="attItem.name"
               >
                 <v-ellipsis-tooltip
-                  :max-width="246"
+                  :max-width="276"
                   :max-height="32"
                   :line-clamp="1"
                   :content="attItem.name"
@@ -370,7 +387,7 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
   :deep(.el-checkbox__inner) {
     &::after {
       top: 1px;
-      left: 4.5px;
+      left: 4px;
       height: 9px;
       width: 4px;
       border-width: 2px;
@@ -380,11 +397,9 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
     width: 340px;
     height: 100%;
     border: 1px solid var(--color-border);
-    margin-left: 24px;
     min-height: 400px;
     background-color: var(--color-attchment-summary-bg);
     .empty-file-data {
-      height: calc(100% - 4px);
       padding-top: 68px;
       text-align: center;
     }
@@ -410,6 +425,7 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
     grid-template-rows: 320px;
     gap: 8px;
     padding-bottom: 36px;
+    padding-right: 24px;
     height: calc(100% - 64px);
     overflow: auto;
     :deep(.el-checkbox__label) {
@@ -517,8 +533,10 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
     border-bottom: 1px solid var(--color-border);
   }
   .summary-content {
-    height: calc(100% - 84px);
+    height: calc(100% - 64px);
     padding: 16px 8px;
+    padding-bottom: 20px;
+    overflow: auto;
   }
 
   .el-collapse {
@@ -562,6 +580,7 @@ const handleDownloadAllSelectedFiles = (label?: string) => {
       line-height: 18px;
       text-align: center;
       span {
+        height: 17px;
         color: var(--color-white);
         font-weight: 700;
       }