10/13 导航栏上显示小区名称，用户名称

src/layout/components/Navbar.vue

@@ -8,6 +8,7 @@
       @toggle-click="toggleSideBar"
     >
     </hamburger>
+    <div style="color: grey; margin-right: 20px">{{ currentVillageInfo.villageName }}</div>
     <div class="flex-1 h-full"></div>
     <div class="right-menu flex align-center">
       <template v-if="appStore.device !== 'mobile'">
@@ -30,6 +31,7 @@
         <el-dropdown class="right-menu-item hover-effect" trigger="click" @command="handleCommand">
           <div class="avatar-wrapper">
             <img :src="userStore.avatar" alt="头像" class="user-avatar" />
+            <div class="username">{{ userStore.nickname }}</div>
             <el-icon><caret-bottom /></el-icon>
           </div>
           <template #dropdown>
@@ -69,7 +71,7 @@ const props = defineProps({
     default: true
   }
 });
-
+const currentVillageInfo = JSON.parse(localStorage.getItem('villageInfo') || '{}');
 const appStore = useAppStore();
 const userStore = useUserStore();
 const settingsStore = useSettingsStore();
@@ -170,7 +172,6 @@ watch(
   height: 50px;
   overflow: hidden;
   position: relative;
-  background: #dfedff;
   background: transparent;
   //border-bottom: 1px solid #dfedff;
 
@@ -229,8 +230,7 @@ watch(
       padding: 0 8px;
       height: 100%;
       font-size: 18px;
-      color: #fff;
-      color: #c0c4cc;
+      color: grey;
 
       vertical-align: text-bottom;
 
@@ -245,9 +245,14 @@ watch(
 
       .avatar-wrapper {
         margin-top: 5px;
-        // margin-left: 20px;
         position: relative;
-
+        display: flex;
+        align-items: center;
+        .username {
+          font-size: 12px;
+          margin-top: 10px;
+          margin-left: 10px;
+        }
         .user-avatar {
           cursor: pointer;
           width: 40px;