Browse Source

style: system message中milestone update的消息卡片新增插入时间展示

zhouyuhao 6 months ago
parent
commit
0877f3f732

+ 12 - 0
src/components/NotificationMessageCard/src/NotificationMessageCard.vue

@@ -6,6 +6,7 @@ import { useNotificationMessage } from '@/stores/modules/notificationMessage'
 import { cloneDeep } from 'lodash'
 import { DynamicScroller, DynamicScrollerItem } from 'vue3-virtual-scroller'
 import 'vue3-virtual-scroller/dist/vue3-virtual-scroller.css'
+import { formatTimezone } from '@/utils/tools'
 
 const notificationMsgStore = useNotificationMessage()
 const props = withDefaults(
@@ -228,6 +229,7 @@ const scrollParentBoxStyle = computed(() => {
             :data="item.info"
           />
           <slot></slot>
+          <div class="insertion-time">{{ formatTimezone(item.info.first_notifiation_date) }}</div>
         </div>
       </DynamicScrollerItem>
     </template>
@@ -242,4 +244,14 @@ const scrollParentBoxStyle = computed(() => {
     padding: 0px 140px 0px 16px;
   }
 }
+.notification-message-card {
+  position: relative;
+  .insertion-time {
+    position: absolute;
+    right: 0;
+    top: 4px;
+    font-size: 12px;
+    color: var(--color-neutral-2);
+  }
+}
 </style>