44 lines
1.1 KiB
Vue
44 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import {UserOutlined,HomeOutlined,MoneyCollectOutlined} from "@ant-design/icons-vue";
|
|
import {useRouterPush} from "@/hooks/common";
|
|
|
|
const { routerPushByKey } = useRouterPush();
|
|
defineOptions({
|
|
name: 'GlobalFooter'
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<DarkModeContainer class="h-full flex-center">
|
|
<div class="flex-item">
|
|
<ButtonIcon >
|
|
<HomeOutlined class="text-icon-large" @click="routerPushByKey('home')"/>
|
|
</ButtonIcon>
|
|
</div>
|
|
<div class="flex-item">
|
|
<ButtonIcon>
|
|
<MoneyCollectOutlined class="text-icon-large" @click="routerPushByKey('billing_billservice')"/>
|
|
</ButtonIcon>
|
|
</div>
|
|
<div class="flex-item">
|
|
<ButtonIcon >
|
|
<UserOutlined class="text-icon-large" @click="routerPushByKey('user-info/usercard')"/>
|
|
</ButtonIcon>
|
|
</div>
|
|
</DarkModeContainer>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.flex-center {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.flex-item {
|
|
flex-basis: 25%; /* 修改为25%，使每个子元素占据四分之一的宽度 */
|
|
display: flex;
|
|
justify-content: center; /* 在各自的空间内居中 */
|
|
}
|
|
</style>
|