fix: 通知使用自定义导航

pages.config.ts

@@ -196,8 +196,7 @@ export default defineUniPages({
       layout: 'default',
       needLogin: true,
       style: {
-        navigationBarTitleText: '%notifications.title%',
-        navigationBarBackgroundColor: '#fff',
+        navigationStyle: 'custom',
       },
     },
     {

src/pages.json

@@ -184,8 +184,7 @@
       "layout": "default",
       "needLogin": true,
       "style": {
-        "navigationBarTitleText": "%notifications.title%",
-        "navigationBarBackgroundColor": "#fff"
+        "navigationStyle": "custom"
       }
     },
     {

src/pages/notifications/notifications.vue

@@ -3,8 +3,7 @@
   layout: 'default',
   needLogin: true,
   style: {
-    navigationBarTitleText: '%notifications.title%',
-    navigationBarBackgroundColor: '#fff',
+    navigationStyle: 'custom',
   },
 }
 </route>
@@ -17,7 +16,7 @@ import useZPaging from 'z-paging/components/z-paging/js/hooks/useZPaging.js'
 
 import { noticeDel, noticeList, noticeRead, readAllNotice } from '@/api/common'
 import { t } from '@/locale'
-import { toPage } from '@/utils/page'
+import { goBack, toPage } from '@/utils/page'
 import { toast } from '@/utils/toast'
 
 defineOptions({
@@ -284,14 +283,22 @@ async function clearAllNotifications() {
 <template>
   <z-paging ref="paging" v-model="dataList" use-page-scroll @query="queryList">
     <template #top>
+      <wd-navbar
+        :bordered="false"
+        placeholder
+        :title="t('notifications.title')"
+      >
+        <template #left>
+          <wd-icon name="thin-arrow-left" size="32rpx" @click="() => goBack()" />
+        </template>
+        <template #right>
+          <image src="/static/icons/cl.png" class="h-40rpx w-40rpx" @click="clearAllNotifications" />
+        </template>
+      </wd-navbar>
       <wd-tabs v-model="tab" :auto-line-width="true" custom-class="bg-transparent!" slidable="always" @click="() => queryList(1, 20)">
         <wd-tab v-for="tabItem in tabs" :key="tabItem.value" :name="tabItem.value" :title="tabItem.title" />
       </wd-tabs>
     </template>
-    <!-- 清理按钮 -->
-    <view class="flex items-center justify-end pr-20rpx pt-14rpx" @click="clearAllNotifications">
-      <image src="/static/icons/cl.png" class="h-40rpx w-40rpx" />
-    </view>
     <view class="py-14rpx">
       <wd-swipe-action v-for="item in dataList" :key="item.id" class="mb-20rpx">
         <view
@@ -324,7 +331,7 @@ async function clearAllNotifications() {
           </view>
           <view class="flex items-center justify-between text-22rpx">
             <view
-              class="flex-1 truncate"
+              class="line-clamp-2 flex-1 break-all"
               :class="item.readFlag ? 'text-#BBBBBB' : 'text-#3A444C'"
             >
               {{ getNoticeContent(item) }}