feat: 开发中...

blog-frontend/src/components/HeaderComponent.vue

@@ -0,0 +1,72 @@
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+
+import { RouterLink } from 'vue-router'
+import { UserInfoResponseVORoleEnum } from "@/swagger";
+import { api, globalStore, siteSetting } from "@/api"
+import { updateCurrentUserInfo } from '@/utils';
+
+const currentUserInfo = globalStore.currentUserInfo
+const navigationMenu = siteSetting.customNavigationMenu
+
+const menuIndex = ref<string>(document.location.pathname)
+
+onMounted(() => {
+    // 获取站点标题
+    api.SettingController.getSettingContent("site.title")
+        .then(response => {
+            let vo = response.data;
+            if (vo.code === 200) {
+                let title = vo.data ?? "网站标题"
+                siteSetting.title.value = title
+                document.title = title
+            }
+        })
+    // 获取站点页脚
+    api.SettingController.getSettingContent("site.footer")
+        .then(response => {
+            let vo = response.data;
+            if (vo.code === 200) {
+                let title = vo.data ?? ""
+                siteSetting.footer.value = title
+            }
+        })
+    if (!currentUserInfo.value.id) {
+        // 获取当前登录的用户信息
+        updateCurrentUserInfo();
+    }
+})
+</script>
+
+<template>
+    <el-menu :default-active="menuIndex" mode="horizontal" :ellipsis="false">
+        <el-menu-item index="/">
+            <router-link to="/">{{ siteSetting.title.value }}</router-link>
+        </el-menu-item>
+        <el-menu-item index="/tags">
+            <router-link to="/tags">标签</router-link>
+        </el-menu-item>
+        <el-menu-item v-for="customMenu in navigationMenu">
+            <router-link :to="customMenu.url">{{ customMenu.text }}</router-link>
+        </el-menu-item>
+
+        <div class="flex-grow" />
+
+        <el-menu-item index="/login" v-if="!currentUserInfo.id">
+            <router-link to="/login">登录</router-link>
+        </el-menu-item>
+        <el-menu-item index="/register" v-if="!currentUserInfo.id">
+            <router-link to="/register">注册</router-link>
+        </el-menu-item>
+        <el-menu-item index="/manage" v-if="currentUserInfo?.role === UserInfoResponseVORoleEnum.ADMIN">
+            <router-link to="/manage">管理面板</router-link>
+        </el-menu-item>
+    </el-menu>
+</template>
+
+<style scoped>
+.flex-grow {
+    flex-grow: 1;
+}
+</style>