diff --git a/components.d.ts b/components.d.ts
index 8af0191..ad4128e 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -19,37 +19,19 @@ declare module 'vue' {
     QiunLoading: typeof import('./src/components/qiun-loading/qiun-loading.vue')['default']
     WdButton: typeof import('wot-design-uni/components/wd-button/wd-button.vue')['default']
     WdCard: typeof import('wot-design-uni/components/wd-card/wd-card.vue')['default']
-    WdCell: typeof import('wot-design-uni/components/wd-cell/wd-cell.vue')['default']
-    WdCellGroup: typeof import('wot-design-uni/components/wd-cell-group/wd-cell-group.vue')['default']
-    WdCollapse: typeof import('wot-design-uni/components/wd-collapse/wd-collapse.vue')['default']
-    WdCollapseItem: typeof import('wot-design-uni/components/wd-collapse-item/wd-collapse-item.vue')['default']
     WdConfigProvider: typeof import('wot-design-uni/components/wd-config-provider/wd-config-provider.vue')['default']
-    WdForm: typeof import('wot-design-uni/components/wd-form/wd-form.vue')['default']
-    WdFormItem: typeof import('wot-design-uni/components/wd-form-item/wd-form-item.vue')['default']
     WdGrid: typeof import('wot-design-uni/components/wd-grid/wd-grid.vue')['default']
     WdGridItem: typeof import('wot-design-uni/components/wd-grid-item/wd-grid-item.vue')['default']
     WdIcon: typeof import('wot-design-uni/components/wd-icon/wd-icon.vue')['default']
-    WdImg: typeof import('wot-design-uni/components/wd-img/wd-img.vue')['default']
-    WdImgCropper: typeof import('wot-design-uni/components/wd-img-cropper/wd-img-cropper.vue')['default']
-    WdInput: typeof import('wot-design-uni/components/wd-input/wd-input.vue')['default']
-    WdLoading: typeof import('wot-design-uni/components/wd-loading/wd-loading.vue')['default']
     WdMessageBox: typeof import('wot-design-uni/components/wd-message-box/wd-message-box.vue')['default']
-    WdNavbar: typeof import('wot-design-uni/components/wd-navbar/wd-navbar.vue')['default']
     WdNoticeBar: typeof import('wot-design-uni/components/wd-notice-bar/wd-notice-bar.vue')['default']
     WdNotify: typeof import('wot-design-uni/components/wd-notify/wd-notify.vue')['default']
-    WdPopup: typeof import('wot-design-uni/components/wd-popup/wd-popup.vue')['default']
-    WdProgress: typeof import('wot-design-uni/components/wd-progress/wd-progress.vue')['default']
     WdRadio: typeof import('wot-design-uni/components/wd-radio/wd-radio.vue')['default']
     WdRadioGroup: typeof import('wot-design-uni/components/wd-radio-group/wd-radio-group.vue')['default']
-    WdStatusTip: typeof import('wot-design-uni/components/wd-status-tip/wd-status-tip.vue')['default']
     WdSwiper: typeof import('wot-design-uni/components/wd-swiper/wd-swiper.vue')['default']
-    WdSwitch: typeof import('wot-design-uni/components/wd-switch/wd-switch.vue')['default']
     WdTabbar: typeof import('wot-design-uni/components/wd-tabbar/wd-tabbar.vue')['default']
     WdTabbarItem: typeof import('wot-design-uni/components/wd-tabbar-item/wd-tabbar-item.vue')['default']
     WdTag: typeof import('wot-design-uni/components/wd-tag/wd-tag.vue')['default']
-    WdText: typeof import('wot-design-uni/components/wd-text/wd-text.vue')['default']
-    WdTextarea: typeof import('wot-design-uni/components/wd-textarea/wd-textarea.vue')['default']
     WdToast: typeof import('wot-design-uni/components/wd-toast/wd-toast.vue')['default']
-    WdUpload: typeof import('wot-design-uni/components/wd-upload/wd-upload.vue')['default']
   }
 }
diff --git a/pages.config.ts b/pages.config.ts
index e7a2291..913d4b4 100644
--- a/pages.config.ts
+++ b/pages.config.ts
@@ -14,26 +14,33 @@ export default defineUniPages({
     },
   ],
   globalStyle: {
-    navigationStyle: "custom",
-    navigationBarTextStyle: "black",
-    navigationBarTitleText: "youlai-mall-app",
-    navigationBarBackgroundColor: "#F8F8F8",
-    backgroundColor: "#F8F8F8",
+    navigationBarBackgroundColor: "@navBgColor",
+    navigationBarTextStyle: "@navTxtStyle",
+    navigationBarTitleText: "Wot-Demo",
+    backgroundColor: "@bgColor",
+    backgroundTextStyle: "@bgTxtStyle",
+    backgroundColorTop: "@bgColorTop",
+    backgroundColorBottom: "@bgColorBottom",
+    enablePullDownRefresh: false,
+    onReachBottomDistance: 50,
+    animationType: "pop-in",
+    animationDuration: 300,
   },
 
   tabBar: {
     custom: true,
-    height: "0px",
-    color: "#00000000",
-    selectedColor: "#00000000",
-    backgroundColor: "#00000000",
+    customize: true,
+    overlay: true,
+    height: "0",
+    color: "@tabColor",
+    selectedColor: "@tabSelectedColor",
+    backgroundColor: "@tabBgColor",
+    borderStyle: "@tabBorderStyle",
     list: [
       {
-        text: "首页",
         pagePath: "pages/index/index",
       },
       {
-        text: "我的",
         pagePath: "pages/mine/index",
       },
     ],
diff --git a/src/layouts/tabbar.vue b/src/layouts/tabbar.vue
index e3311d7..ff26e34 100644
--- a/src/layouts/tabbar.vue
+++ b/src/layouts/tabbar.vue
@@ -25,6 +25,11 @@
 </template>
 
 <script setup lang="ts">
+import { useRoute } from "vue-router";
+import { useTheme } from "@/composables/useTheme";
+import { useTabbar } from "@/composables/useTabbar";
+import { useRouter } from "uni-mini-router";
+
 const router = useRouter();
 const route = useRoute();
 const { themeVars, theme } = useTheme();
@@ -42,8 +47,11 @@ onMounted(() => {
   uni.hideTabBar();
   // #endif
   nextTick(() => {
-    if (route.name && route.name !== activeTabbar.value.name) {
-      setTabbarItemActive(route.name);
+    if (route.name) {
+      const routeName = typeof route.name === "string" ? route.name : "";
+      if (routeName !== activeTabbar.value.name) {
+        setTabbarItemActive(routeName);
+      }
     }
   });
 });
diff --git a/src/manifest.json b/src/manifest.json
index 9421bd5..9fec0a2 100644
--- a/src/manifest.json
+++ b/src/manifest.json
@@ -54,7 +54,9 @@
     "setting": {
       "urlCheck": false
     },
-    "usingComponents": true
+    "usingComponents": true,
+    "darkMode": true,
+    "themeLocation": "theme.json"
   },
   "mp-alipay": {
     "usingComponents": true
@@ -68,5 +70,9 @@
   "uniStatistics": {
     "enable": false
   },
-  "vueVersion": "3"
+  "vueVersion": "3",
+  "h5": {
+    "darkmode": true,
+    "themeLocation": "theme.json"
+  }
 }
diff --git a/src/pages.json b/src/pages.json
index abe91ae..73be4a0 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -79,25 +79,32 @@
     }
   ],
   "globalStyle": {
-    "navigationStyle": "custom",
-    "navigationBarTextStyle": "black",
-    "navigationBarTitleText": "youlai-mall-app",
-    "navigationBarBackgroundColor": "#F8F8F8",
-    "backgroundColor": "#F8F8F8"
+    "navigationBarBackgroundColor": "@navBgColor",
+    "navigationBarTextStyle": "@navTxtStyle",
+    "navigationBarTitleText": "Wot-Demo",
+    "backgroundColor": "@bgColor",
+    "backgroundTextStyle": "@bgTxtStyle",
+    "backgroundColorTop": "@bgColorTop",
+    "backgroundColorBottom": "@bgColorBottom",
+    "enablePullDownRefresh": false,
+    "onReachBottomDistance": 50,
+    "animationType": "pop-in",
+    "animationDuration": 300
   },
   "tabBar": {
     "custom": true,
-    "height": "0px",
-    "color": "#00000000",
-    "selectedColor": "#00000000",
-    "backgroundColor": "#00000000",
+    "customize": true,
+    "overlay": true,
+    "height": "0",
+    "color": "@tabColor",
+    "selectedColor": "@tabSelectedColor",
+    "backgroundColor": "@tabBgColor",
+    "borderStyle": "@tabBorderStyle",
     "list": [
       {
-        "text": "首页",
         "pagePath": "pages/index/index"
       },
       {
-        "text": "我的",
         "pagePath": "pages/mine/index"
       }
     ]
diff --git a/src/router/index.ts b/src/router/index.ts
index fb2edd7..fea8636 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,5 +1,7 @@
 import { pages, subPackages } from "virtual:uni-pages";
 import { isLoggedIn } from "@/utils/auth";
+
+import { createRouter } from "uni-mini-router";
 // 生成路由配置
 function generateRoutes() {
   const routes = pages.map((page: { path: string; [key: string]: any }) => {
diff --git a/src/theme.json b/src/theme.json
new file mode 100644
index 0000000..2c2ef36
--- /dev/null
+++ b/src/theme.json
@@ -0,0 +1,26 @@
+{
+  "light": {
+    "bgColor": "#F8F8F8",
+    "bgColorBottom": "#F8F8F8",
+    "bgColorTop": "#F8F8F8",
+    "bgTxtStyle": "dark",
+    "navBgColor": "#FFF",
+    "navTxtStyle": "black",
+    "tabBgColor": "#ffffff",
+    "tabBorderStyle": "black",
+    "tabColor": "#bfbfbf",
+    "tabSelectedColor": "#0165FF"
+  },
+  "dark": {
+    "bgColor": "#000",
+    "bgColorBottom": "#000",
+    "bgColorTop": "#000",
+    "bgTxtStyle": "light",
+    "navBgColor": "#000000",
+    "navTxtStyle": "white",
+    "tabBgColor": "#1a1a1a",
+    "tabBorderStyle": "white",
+    "tabColor": "#bfbfbf",
+    "tabSelectedColor": "#0165FF"
+  }
+}