feat: 添加通知功能，集成模拟数据并更新通知视图

src/views/notify/index.vue

@@ -1,6 +1,10 @@
 <script setup lang="ts">
+import IcBaselineNotificationsNone from "~icons/ic/baseline-notifications-none";
 import IconParkOutlineClearFormat from "~icons/icon-park-outline/clear-format";
 import MaterialSymbolsAndroidContacts from "~icons/material-symbols/android-contacts";
+import { mockClient } from "@/api";
+
+const { data } = mockClient("notify.list");
 </script>
 
 <template>
@@ -18,6 +22,27 @@ import MaterialSymbolsAndroidContacts from "~icons/material-symbols/android-cont
     </IonHeader>
     <IonContent :fullscreen="true">
       <ion-searchbar placeholder="Search" />
+
+      <ion-list lines="none">
+        <ion-item v-for="item in data" :key="item.id" class="py-3">
+          <div slot="start" class="bg-text-900 p-2.5 rounded-full">
+            <IcBaselineNotificationsNone class="text-2xl text-(--ion-color-success-tint)" />
+          </div>
+          <div class="pl-3 w-full">
+            <div class="flex items-center justify-between mb-1">
+              <div class="text-md font-semibold">
+                {{ item.title }}
+              </div>
+              <ion-note slot="end" class="text-xs">
+                {{ useDateFormat(item.date, 'MM/DD HH:mm') }}
+              </ion-note>
+            </div>
+            <div class="text-xs overflow-hidden text-ellipsis">
+              {{ item.content }}
+            </div>
+          </div>
+        </ion-item>
+      </ion-list>
     </IonContent>
   </IonPage>
 </template>