Merge branch 'test' into dev_zyh

src/components/NotificationMessageCard/src/NotificationMessageCard.vue

@@ -17,6 +17,7 @@ const props = withDefaults(
     updateReadCardsOnChange?: boolean // 是否在数据变化时请求接口更新已读卡片
     topOffset?: number // 应减去高度
     isShowInsertionTime?: boolean // 是否显示插入时间
+    isDrawer?: boolean // 是否在抽屉中使用
   }>(),
   {
     isObserver: true,
@@ -213,7 +214,7 @@ const loadMore = async () => {
 
 const onScroll = () => {
   const el = scrollContainerRef.value
-  if (!el || loading.value || finished.value) return
+  if (!el || loading.value || finished.value || el.scrollTop === 0) return
 
   prevScrollTop.value = el.scrollTop + 50
 
@@ -264,6 +265,7 @@ defineExpose({
             @view-more="handleViewMore"
             v-else-if="item.notificationType === 'feature'"
             :data="item.info"
+            :is-drawer="props.isDrawer"
           />
           <slot></slot>
           <div class="insertion-time" v-if="isShowInsertionTime">
@@ -274,7 +276,9 @@ defineExpose({
     </template>
     <div
       class="footer"
-      v-if="pageData?.[0]?.notificationType !== 'feature' && pageData?.length > 0"
+      v-if="
+        (pageData?.[0]?.notificationType !== 'feature' && pageData?.length > 0) || props.isDrawer
+      "
     >
       <el-divider v-if="loading"> loading... </el-divider>
       <el-divider v-if="finished && pageData.length > 0">

src/components/NotificationMessageCard/src/components/EventCard.vue

@@ -47,14 +47,15 @@ const props = defineProps<{
 }>()
 
 const emit = defineEmits<{ seeAll: []; jumpTracking: [] }>()
-const handleSeeAll = (data: EventCardPropsData) => {
+const handleSeeAll = (data: EventCardPropsData, numData) => {
   emit('seeAll')
   router.push({
     name: 'System Message Detail',
     query: {
       frequency_type: data.frequency_type,
       insert_date_format: data.insert_date_format,
-      rules_type: data.rules_type
+      rules_type: data.rules_type,
+      ...numData
     }
   })
 }
@@ -80,7 +81,14 @@ const jumpTracking = (data: EventCardPropsData) => {
         v-if="(data.type === 'milestone' || data.type === 'container') && data.numericRecords"
       >
         <span>Latest Status Updates ({{ data.numericRecords }}) </span>
-        <el-button @click="handleSeeAll(data)" class="see-all-icon el-button--text">
+        <el-button
+          @click="
+            handleSeeAll(data, {
+              numericRecords: data.numericRecords
+            })
+          "
+          class="see-all-icon el-button--text"
+        >
           See All
           <span class="font_family icon-icon_next_b"></span>
         </el-button>
@@ -101,7 +109,15 @@ const jumpTracking = (data: EventCardPropsData) => {
             }})
           </span>
         </div>
-        <el-button @click="handleSeeAll(data)" class="see-all-icon el-button--text">
+        <el-button
+          @click="
+            handleSeeAll(data, {
+              etdOrdeparturNum: data.info?.etdOrdeparturNum,
+              etaOrarrivalNum: data.info?.etaOrarrivalNum
+            })
+          "
+          class="see-all-icon el-button--text"
+        >
           See All
           <span class="font_family icon-icon_next_b"></span>
         </el-button>

src/components/NotificationMessageCard/src/components/FeatureUpdateCard.vue

@@ -14,6 +14,7 @@ interface FeatureUpdateCardPropsData {
 
 const props = defineProps<{
   data: FeatureUpdateCardPropsData
+  isDrawer?: boolean // 是否在抽屉中使用
 }>()
 
 const emit = defineEmits<{
@@ -30,6 +31,14 @@ const handleViewMore = () => {
   })
   emit('viewMore')
 }
+
+const handleContent = (header) => {
+  if (header === 'New Feature: AI Smart Assistant') {
+    return 'Smart Assistant is live! Ask in natural language, get real-time shipment data with multi-language support.'
+  }else {
+    return 'Smart Notification is here! Four key event alerts with customizable rules and multi-channel delivery.'
+  }
+}
 </script>
 
 <template>
@@ -46,20 +55,31 @@ const handleViewMore = () => {
           <span class="gradient-text">{{ data.header }}</span>
         </div>
         <div class="content-text">
-          <span>{{ data.content }}</span>
+          <pre style="white-space: pre-wrap; line-height: 21px" v-if="props.isDrawer">{{ handleContent(data.header) }}</pre>
+          <pre style="white-space: pre-wrap; line-height: 21px" v-else>{{ data.content }}</pre>
         </div>
-        <div class="feature-img">
-          <el-image :src="data.imgSrc" fit="contain" alt="feature-img"></el-image>
+        <div class="feature-img" style="text-align: center">
+          <img
+            :src="data.imgSrc"
+            style="max-height: 400px; max-width: 100%;object-fit: contain"
+            
+            alt="feature-img"
+          ></img>
+          <!-- <img
+            src="./img/testaa.png"
+            alt=""
+            style="max-height: 400px; max-width: 100%; object-fit: contain"
+          /> -->
         </div>
 
         <div class="change-btn" style="text-align: center">
-          <el-button
+          <!-- <el-button
             @click="handleViewMore"
             class="el-button--main"
             style="height: 40px; padding: 0 32px"
           >
             View more</el-button
-          >
+          > -->
         </div>
       </div>
     </div>
@@ -95,7 +115,7 @@ const handleViewMore = () => {
     }
   }
   .card-content {
-    padding: 16px 16px 24px 8px;
+    padding: 16px 16px 16px 8px;
     background: linear-gradient(
       137deg,
       var(--color-feature-card-first-bg) 12.41%,

src/styles/vxeTable.scss

@@ -18,15 +18,24 @@
 
 // 重置表格stripe样式
 .vxe-table--render-default tr.vxe-body--row.row--stripe {
+  &>.vxe-body--column {
+    background-color: var(--color-table-stripe-bg) !important;
+  }
   background-color: var(--color-table-stripe-bg);
 }
 .vxe-table--render-default tr.vxe-body--row.row--current,
 .vxe-table--render-default tr.vxe-body--row.row--stripe.row--current {
-  background-color: rgba(255, 117, 0, 0.2);
+  background-color: rgba(255, 117, 0, 0.2) ;
+  &>.vxe-body--column {
+  background-color: rgba(255, 117, 0, 0.2) ;
+  }
 }
 .vxe-table--render-default .vxe-body--row.visited-row,
 .vxe-table--render-default .vxe-body--row.row--stripe.visited-row {
   background-color: var(--color-vxe-table-visited-row-bg);
+   &>.vxe-body--column {
+  background-color: var(--color-vxe-table-visited-row-bg);
+  }
 }
 
 .vxe-table--render-default .vxe-body--column.col--ellipsis,
@@ -75,6 +84,9 @@ div.vxe-table--render-default tr.vxe-body--row.row--hover,
 div.vxe-table--render-default tr.vxe-body--row.row--hover.row--current,
 .vxe-table--render-default tr.vxe-body--row.row--stripe.row--hover {
   background-color: var(--color-table-row-hover-bg);
+  &>.vxe-body--column {
+    background-color: var(--color-table-row-hover-bg);
+  }
 }
 div.vxe-table--render-default tr.vxe-body--row.vxe-table-row-clicked-style {
   background-color: var(--border-hover-color);

src/views/Layout/src/components/Header/components/NotificationDrawer.vue

@@ -24,7 +24,7 @@ const pageInfo = ref({
   cp: 1,
   ps: 30
 })
-const getNotificationList = () => {
+const getNotificationList = (isChangeType?: boolean) => {
   loading.value = true
   $api
     .getNotificationList({
@@ -38,9 +38,6 @@ const getNotificationList = () => {
         if (res.data.length === 0 || res.data.length < pageInfo.value.ps) {
           notificationMessageCardRef.value.finished = true
         }
-        // nextTick(() => {
-        //   init()
-        // })
       }
     })
     .finally(() => {
@@ -48,7 +45,7 @@ const getNotificationList = () => {
       pageInfo.value.cp += 1
       notificationMessageCardRef.value.loading = false
 
-      notificationMessageCardRef.value.adjustScrollTop()
+      notificationMessageCardRef.value.adjustScrollTop(isChangeType ? 0 : undefined)
     })
 }
 
@@ -82,9 +79,18 @@ const handleSettingMessage = () => {
   })
 }
 
+const handleChangeNotificationType = async (value: string) => {
+  notificationList.value = []
+  pageInfo.value.cp = 1
+  notificationMessageCardRef.value.adjustScrollTop(0)
+  notificationMessageCardRef.value.finished = false
+  getNotificationList(true)
+}
+
 const closeDrawer = () => {
   notificationList.value = []
   notificationType.value = 'all'
+  notificationMessageCardRef.value.adjustScrollTop(0)
   notificationMsgStore.markMessageAsRead()
   pageInfo.value.cp = 1
 }
@@ -93,7 +99,7 @@ const closeDrawer = () => {
 <template>
   <el-drawer
     ref="drawerRef"
-    @open="getNotificationList"
+    @open="getNotificationList(true)"
     @closed="closeDrawer"
     class="notice-drawer"
     size="432px"
@@ -101,7 +107,7 @@ const closeDrawer = () => {
     <template #header>
       <el-select
         size="large"
-        @change="getNotificationList"
+        @change="handleChangeNotificationType"
         v-model="notificationType"
         class="notification-type"
       >
@@ -146,6 +152,7 @@ const closeDrawer = () => {
             @loading="getNotificationList"
             :data="notificationList"
             :topOffset="185"
+            :isDrawer="true"
             ref="notificationMessageCardRef"
           />
         </div>

src/views/Layout/src/components/Header/components/TrainingCard.vue

@@ -136,6 +136,7 @@ const closeMessage = () => {
       v-if="curCard"
       :data="[curCard]"
       :topOffset="0"
+      :isDrawer="true"
     ></NotificationMessageCard>
   </div>
 </template>

src/views/Layout/src/components/Menu/MenuView.vue

@@ -148,10 +148,17 @@ router.afterEach(() => {
 
 // 路由跳转函数
 const changeRouter = (path: any) => {
+  if (localStorage.getItem('loginAI')) {
+    localStorage.removeItem('loginAI')
+    emitter.emit('login-success')
+  }
   if (path == '/PromptConfiguration') {
     emitter.emit('checkPrompt')
   } else {
-    emitter.emit('checknoPrompt')
+    if (localStorage.getItem('loginAI')) {
+      localStorage.removeItem('loginAI')
+      emitter.emit('checknoPrompt')
+    }
   }
   if (sessionStorage.getItem('searchTableQeury')) {
     sessionStorage.removeItem('searchTableQeury')
@@ -166,10 +173,6 @@ const changeRouter = (path: any) => {
   }
   sessionStorage.removeItem('trackingTablePageInfo')
   sessionStorage.removeItem('bookingTablePageInfo')
-  if (localStorage.getItem('loginAI')) {
-    localStorage.removeItem('loginAI')
-    emitter.emit('login-success')
-  }
   let toPath = path
   if (path === '/tracking' && !userStore.userInfo?.uname) {
     toPath = '/public-tracking'

src/views/SystemMessage/src/components/SystemMessageDetail.vue

@@ -86,9 +86,7 @@ const init = async () => {
     await getNotificationList()
   }
 }
-// onMounted(() => {
-//   init()
-// })
+
 const watchScope = watch(
   () => route.query,
   () => {
@@ -117,25 +115,31 @@ const handleIframeLoaded = () => {
         <div class="status-icon"></div>
         <div class="title">{{ notificationData.title }}</div>
       </div>
-      <div class="total-tips" v-if="notificationData.numericRecords > -1">
-        Latest Status Updates ({{ notificationData.numericRecords }})
+      <div
+        class="total-tips"
+        v-if="route.query.numericRecords && Number(route.query.numericRecords) > -1"
+      >
+        Latest Status Updates ({{ route.query.numericRecords }})
       </div>
       <div
         class="total-tips"
-        v-else-if="notificationData.etdOrdeparturNum > -1 || notificationData.etaOrarrivalNum > -1"
+        v-else-if="
+          (route.query.etdOrdeparturNum && Number(route.query.etdOrdeparturNum) > -1) ||
+          (route.query.etaOrarrivalNum && Number(route.query.etaOrarrivalNum) > -1)
+        "
       >
         <div>
-          <span v-if="notificationData.etdOrdeparturNum"
+          <span v-if="route.query.etdOrdeparturNum"
             >{{ notificationData.type === 'delay' ? 'Departure Delay' : 'ETD Change' }} ({{
-              notificationData.etdOrdeparturNum
+              route.query.etdOrdeparturNum
             }})</span
           >
-          <span v-if="notificationData.etdOrdeparturNum && notificationData.etaOrarrivalNum">
+          <span v-if="route.query.etdOrdeparturNum && route.query.etaOrarrivalNum">
             &nbsp;&nbsp;|&nbsp;&nbsp;</span
           >
-          <span v-if="notificationData.etaOrarrivalNum">
+          <span v-if="route.query.etaOrarrivalNum">
             {{ notificationData.type === 'delay' ? 'Arrival Delay' : 'ETA Change' }} ({{
-              notificationData.etaOrarrivalNum
+              route.query.etaOrarrivalNum
             }})
           </span>
         </div>