diff --git a/ui/src/App.vue b/ui/src/App.vue
index e85295dea..2d41c794a 100644
--- a/ui/src/App.vue
+++ b/ui/src/App.vue
@@ -1,14 +1,9 @@
 <template>
-  <n-config-provider
-    :locale="zhCN"
-    :date-locale="dateZhCN"
-    class="provider"
-    :theme="theme == 'dark' ? darkTheme : undefined"
-    :hljs="hljs"
-  >
+  <n-config-provider :locale="zhCN" :date-locale="dateZhCN" class="provider"
+    :theme="theme == 'dark' ? darkTheme : undefined" :hljs="hljs">
     <n-global-style />
     <n-dialog-provider>
-      <n-layout has-sider>
+      <n-layout has-sider v-if="!mobilemode">
         <n-layout-sider
           bordered
           collapse-mode="width"
@@ -31,6 +26,9 @@
           <router-view />
         </n-layout-content>
       </n-layout>
+      <n-layout v-else><router-view />
+        <n-menu :options="menuOptions" mode="horizontal"  :collapsed="true" />
+      </n-layout>
     </n-dialog-provider>
   </n-config-provider>
 </template>
@@ -52,13 +50,14 @@ import {
   Flash
 } from '@vicons/ionicons5'
 import { DiceD20 } from '@vicons/fa'
-const collapsed = ref(true)
+const collapsed = ref(false);
+const mobilemode = ref(true);
 function renderIcon(icon) {
   return () => h(NIcon, null, { default: () => h(icon) })
 }
 
 import { RouterLink } from 'vue-router'
-const menuOptions = ref([
+const menuOptions = computed(() => [
   {
     label: () => h(RouterLink, { to: { path: '/' } }, { default: () => '运行日志' }),
     icon: renderIcon(BookOutline),
@@ -73,6 +72,7 @@ const menuOptions = ref([
     label: () => '设置',
     key: 'go-to-settings',
     icon: renderIcon(Settings),
+    show: !mobilemode.value,
     children: [
       {
         label: () => 'Mower设置',
@@ -82,7 +82,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/mower-setting' } },
+                { to: { path: '/setting/mower-setting' } },
                 { default: () => '基本设置' }
               ),
             key: 'go-to-mowersetting',
@@ -92,7 +92,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/basement-setting' } },
+                { to: { path: '/setting/basement-setting' } },
                 { default: () => '基建设置' }
               ),
             key: 'go-to-basementsetting',
@@ -101,7 +101,7 @@ const menuOptions = ref([
 
           {
             label: () =>
-              h(RouterLink, { to: { path: '/advancedleft/email' } }, { default: () => '邮件设置' }),
+              h(RouterLink, { to: { path: '/setting/email' } }, { default: () => '邮件设置' }),
             key: 'go-to-email',
             icon: renderIcon(MailOpen)
           },
@@ -109,7 +109,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/recruit' } },
+                { to: { path: '/setting/recruit' } },
                 { default: () => '公开招募' }
               ),
             key: 'go-to-recruit',
@@ -126,7 +126,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/maa-basic' } },
+                { to: { path: '/setting/maa-basic' } },
                 { default: () => '连接设置' }
               ),
             icon: renderIcon(Settings),
@@ -136,7 +136,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/maa-weekly' } },
+                { to: { path: '/setting/maa-weekly' } },
                 { default: () => '清理智' }
               ),
             key: 'go-to-maaweekly',
@@ -146,7 +146,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/clue' } },
+                { to: { path: '/setting/clue' } },
                 { default: () => '线索/信用商店' }
               ),
             key: 'go-to-clue',
@@ -156,7 +156,7 @@ const menuOptions = ref([
             label: () =>
               h(
                 RouterLink,
-                { to: { path: '/advancedleft/maahugmission' } },
+                { to: { path: '/setting/maahugmission' } },
                 { default: () => '肉鸽等' }
               ),
             key: 'go-to-maahugmission',
@@ -164,9 +164,16 @@ const menuOptions = ref([
           }
         ]
       }
-      //{ label: () => h(RouterLink, { to: { path: "/advancedleft/sk-land" } }, { default: () => "森空岛签到" }), key: "go-to-skland" },
+      //{ label: () => h(RouterLink, { to: { path: "/setting/sk-land" } }, { default: () => "森空岛签到" }), key: "go-to-skland" },
     ]
   },
+  {
+        label: () =>
+          h(RouterLink, { to: { path: '/setting/allsetting' } }, { default: () => '全部设置' }),
+        icon: renderIcon(Settings),
+        show: mobilemode.value,
+        key: 'go-to-allsetting'
+      },
   {
     label: () => '基建报表',
     key: 'building-report',
@@ -238,7 +245,7 @@ onMounted(async () => {
   })
 
   if (window.innerWidth > 570) {
-    collapsed.value = false
+    mobilemode.value = false
   }
 
   const params = new URLSearchParams(document.location.search)
diff --git a/ui/src/components/BasementSettings.vue b/ui/src/components/BasementSettings.vue
index 8a8a014e2..6dbf9715f 100644
--- a/ui/src/components/BasementSettings.vue
+++ b/ui/src/components/BasementSettings.vue
@@ -28,7 +28,7 @@ const facility_with_empty = computed(() => {
 </script>
 
 <template>
-  <div class="home-container">
+
     <n-card title="基建设置">
       <table class="riic-conf">
         <tr>
@@ -104,7 +104,7 @@ const facility_with_empty = computed(() => {
         </tr>
       </table>
     </n-card>
-  </div>
+
 </template>
 
 <style scoped lang="scss">
diff --git a/ui/src/components/MowerSettings.vue b/ui/src/components/MowerSettings.vue
index a6e1f93f4..35f411535 100644
--- a/ui/src/components/MowerSettings.vue
+++ b/ui/src/components/MowerSettings.vue
@@ -42,7 +42,7 @@ async function select_simulator_folder() {
 </script>
 
 <template>
-  <div class="home-container">
+
     <n-card title="Mower设置">
       <table class="mower-basic">
         <tr>
@@ -164,7 +164,7 @@ async function select_simulator_folder() {
         </tr>
       </table>
     </n-card>
-  </div>
+
 </template>
 
 <style scoped lang="scss">
diff --git a/ui/src/pages/AdvancedLeft.vue b/ui/src/pages/AdvancedLeft.vue
deleted file mode 100644
index 98240aef8..000000000
--- a/ui/src/pages/AdvancedLeft.vue
+++ /dev/null
@@ -1,3 +0,0 @@
-<template>
-  <router-view />
-</template>
diff --git a/ui/src/pages/Doc.vue b/ui/src/pages/Doc.vue
index 9bae220d8..ff393e33e 100644
--- a/ui/src/pages/Doc.vue
+++ b/ui/src/pages/Doc.vue
@@ -3,7 +3,8 @@ const doc_url = 'https://arkmowers.github.io/arknights-mower/'
 </script>
 
 <template>
-  <iframe :src="doc_url" sandbox="allow-popups allow-scripts"></iframe>
+  <iframe :src="doc_url" sandbox="allow-popups allow-scripts"
+    style="width: 100%; height: calc(var(--vh, 1vh) * 100);"></iframe>
 </template>
 
 <style scoped>
diff --git a/ui/src/pages/allsetting.vue b/ui/src/pages/allsetting.vue
new file mode 100644
index 000000000..4e8724b76
--- /dev/null
+++ b/ui/src/pages/allsetting.vue
@@ -0,0 +1,22 @@
+<template>
+  <MowerSettings />
+  <BasementSettings />
+  <Email />
+  <Recruit/>
+
+  <MaaBasic />
+  <MaaWeekly />
+  <Clue />
+  <Maahugmission />
+</template>
+
+<script setup>
+const BasementSettings = defineAsyncComponent(() => import('@/components/BasementSettings.vue'))
+const Clue = defineAsyncComponent(() => import('@/components/Clue.vue'))
+const Email = defineAsyncComponent(() => import('@/components/Email.vue'))
+const MaaBasic = defineAsyncComponent(() => import('@/components/MaaBasic.vue'))
+const Maahugmission = defineAsyncComponent(() => import('@/components/Maahugmission.vue'))
+const MaaWeekly = defineAsyncComponent(() => import('@/components/MaaWeekly.vue'))
+const MowerSettings = defineAsyncComponent(() => import('@/components/MowerSettings.vue'))
+const Recruit = defineAsyncComponent(() => import('@/components/Recruit.vue'))
+</script>
diff --git a/ui/src/router.js b/ui/src/router.js
index ab6dec21f..5af4d960d 100644
--- a/ui/src/router.js
+++ b/ui/src/router.js
@@ -15,11 +15,15 @@ const routes = [
     name: 'plan'
   },
   {
-    path: '/advancedleft',
-    component: () => import('@/pages/AdvancedLeft.vue'),
-    meta: { title: 'Advanced Left Page' },
-    name: 'advancedleft',
+    path: '/setting',
+    meta: { title: '设置' },
     children: [
+      {
+        path: 'allsetting',
+        component: () => import('@/pages/allsetting.vue'),
+        meta: { title: '全部设置' },
+        name: 'allsetting'
+      },
       {
         path: 'mower-setting',
         component: () => import('@/components/MowerSettings.vue'),