wip: 临时提交

src/layouts/default.vue

@@ -1,7 +1,57 @@
 <script lang="ts" setup>
 import { useTheme } from "@/composables/useTheme";
+import { onLoad } from "@dcloudio/uni-app";
 
 const { theme, themeVars } = useTheme();
+
+// 页面标题
+const pageTitle = ref("");
+// 是否显示返回按钮
+const showBackButton = ref(false);
+// 是否显示导航栏
+const showNavbar = ref(true);
+
+// 获取当前页面路由信息
+const getCurrentPageRoute = () => {
+  const pages = getCurrentPages();
+  if (pages.length > 0) {
+    const currentPage = pages[pages.length - 1];
+    return currentPage.route || "";
+  }
+  return "";
+};
+
+// 处理返回按钮点击
+const handleBack = () => {
+  uni.navigateBack({
+    fail: () => {
+      uni.switchTab({ url: "/pages/index/index" });
+    },
+  });
+};
+
+// 页面加载时处理导航栏配置
+onLoad(() => {
+  const route = getCurrentPageRoute();
+
+  // 获取当前页面实例
+  const pages = getCurrentPages();
+  if (pages.length > 0) {
+    const currentPage = pages[pages.length - 1];
+
+    // 尝试获取页面的navigationBarTitleText
+    const navigationBarTitleText = currentPage.$page?.style?.navigationBarTitleText || "";
+    pageTitle.value = navigationBarTitleText;
+
+    // 如果是首页或tabbar页面，不显示返回按钮
+    showBackButton.value = pages.length > 1;
+
+    // 某些页面可能不需要显示导航栏
+    if (route.includes("/index/index") || route.includes("/login")) {
+      showNavbar.value = false;
+    }
+  }
+});
 </script>
 
 <script lang="ts">
@@ -21,18 +71,20 @@ export default {
     custom-style="background-color: #f5f5f5;min-height: 100vh"
     :class="{ 'wot-theme-dark': theme === 'dark' }"
   >
+    <!-- 顶部导航栏 -->
+    <wd-navbar :title="pageTitle" :border="false" @click-left="handleBack">
+      <template #left>
+        <wd-icon name="arrow-left" size="20" />
+      </template>
+    </wd-navbar>
+
+    <!-- 内容区域 -->
     <slot />
+
     <wd-notify />
     <wd-toast />
     <wd-message-box />
-    <privacy-popup />
   </wd-config-provider>
 </template>
 
-<style lang="scss" scoped>
-/* 暗黑模式样式 */
-.wot-theme-dark {
-  color: #f5f5f5 !important;
-  background-color: #1a1a1a !important;
-}
-</style>
+<style lang="scss" scoped></style>

src/layouts/tabbar.vue

@@ -23,7 +23,7 @@ interface TabbarItem {
 
 // 根据 pages.json 配置的 tabbar 项目
 const tabbarItems = ref<TabbarItem[]>([
-  { name: "index", value: null, active: true, title: "首页", icon: "home" },
+  { name: "index", value: null, active: true, title: "首页123", icon: "home" },
   { name: "mine", value: null, active: false, title: "我的", icon: "user" },
 ]);
 
@@ -161,14 +161,6 @@ export default {
     custom-style="min-height: 100vh"
     :class="{ 'wot-theme-dark': theme === 'dark' }"
   >
-    <wd-navbar
-      :title="activeTabbar.title"
-      safe-area-inset-top
-      placeholder
-      fixed
-      :bordered="false"
-    />
-
     <slot />
     <wd-tabbar
       :model-value="activeTabbar.name"
@@ -193,20 +185,4 @@ export default {
   </wd-config-provider>
 </template>
 
-<style lang="scss" scoped>
-/* 暗黑模式样式 */
-.wot-theme-dark {
-  color: #f5f5f5;
-  background-color: #1a1a1a;
-
-  :deep(.wd-navbar) {
-    color: #f5f5f5;
-    background-color: #2a2a2a;
-  }
-
-  :deep(.wd-tabbar) {
-    background-color: #2a2a2a;
-    border-top-color: #404040;
-  }
-}
-</style>
+<style lang="scss" scoped></style>