fix:移动和pc自适应菜单

src/layouts/modules/global-footer/index.vue

@@ -1,4 +1,8 @@
 <script setup lang="ts">
+import {ProfileOutlined,UserOutlined,HomeOutlined} from "@ant-design/icons-vue";
+import {useRouterPush} from "@/hooks/common";
+
+const { routerPushByKey } = useRouterPush();
 defineOptions({
   name: 'GlobalFooter'
 });
@@ -6,10 +10,34 @@ defineOptions({
 
 <template>
   <DarkModeContainer class="h-full flex-center">
-    <a href="#" target="_blank" rel="noopener noreferrer">
-      Copyright © 2024 WANFi
-    </a>
+    <div class="flex-item">
+      <ButtonIcon class="text-icon-large" @click="routerPushByKey('home')">
+        <HomeOutlined />
+      </ButtonIcon>
+    </div>
+    <div class="flex-item">
+      <ButtonIcon>
+        <ProfileOutlined class="text-icon-large" @click="routerPushByKey('billing_billservice')"/>
+      </ButtonIcon>
+    </div>
+    <div class="flex-item">
+      <ButtonIcon  class="text-icon-large" @click="routerPushByKey('user-info/usercard')">
+        <UserOutlined />
+      </ButtonIcon>
+    </div>
   </DarkModeContainer>
 </template>
 
-<style scoped></style>
+<style scoped>
+.flex-center {
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+
+.flex-item {
+  flex-basis: 33.33%; /* 每个子元素占据三分之一的宽度 */
+  display: flex;
+  justify-content: center; /* 在各自的空间内居中 */
+}
+</style>