前端：增加测试数据模式切换

shierfeng-fastapi-frontend/src/layout/components/Navbar.vue

@@ -9,6 +9,7 @@
     </template>
 
     <div class="right-menu">
+      <test-batch-mode-switch class="right-menu-item test-batch-mode" aria-label="测试数据模式" />
       <template v-if="appStore.device !== 'mobile'">
         <header-search id="header-search" class="right-menu-item" />
 
@@ -59,6 +60,7 @@ import Hamburger from '@/components/Hamburger'
 import Screenfull from '@/components/Screenfull'
 import SizeSelect from '@/components/SizeSelect'
 import HeaderSearch from '@/components/HeaderSearch'
+import TestBatchModeSwitch from '@/components/TestBatchModeSwitch'
 import useAppStore from '@/store/modules/app'
 import useUserStore from '@/store/modules/user'
 import useSettingsStore from '@/store/modules/settings'
@@ -205,6 +207,9 @@ async function toggleTheme(event) {
     display: flex;
     align-items: center;
     margin-left: auto;
+    min-width: 0;
+    flex-shrink: 1;
+    overflow: hidden;
 
     &:focus {
       outline: none;
@@ -277,6 +282,25 @@ async function toggleTheme(event) {
         }
       }
     }
+
+    .test-batch-mode {
+      display: flex;
+      align-items: center;
+      min-width: 0;
+      font-size: 14px;
+    }
+  }
+}
+
+@media screen and (max-width: 767px) {
+  .navbar .right-menu {
+    .avatar-container .avatar-wrapper .user-nickname {
+      display: none;
+    }
+
+    .avatar-container .avatar-wrapper .user-avatar {
+      margin-right: 0;
+    }
   }
 }
 </style>