diff --git a/public/config.js b/public/config.js index 68f1461..acdaeed 100644 --- a/public/config.js +++ b/public/config.js @@ -5,14 +5,15 @@ window.$$nazhuaConfig = { // buyBtnText: '购买', // 购买按钮文案 // listServerStatusType: 'progress', // 服务器状态类型--列表 // detailServerStatusType: 'progress', // 服务器状态类型--详情页 - // hideNavbarServerCount: false, // 隐藏服务器数量 - // hideNavbarServerStat: false, // 隐藏服务器统计 - // hideListItemStatusDonut: true, // 隐藏列表项的饼图 - // hideListItemStat: true, // 隐藏列表项的统计信息 - // hideListItemBill: false, // 隐藏列表项的账单信息 + // disableSarasaTermSC: false, // 禁用Sarasa Term SC字体 // hideWorldMap: false, // 隐藏地图 // hideHomeWorldMap: false, // 隐藏首页地图 // hideDetailWorldMap: false, // 隐藏详情地图 + // hideNavbarServerCount: false, // 隐藏服务器数量 + // hideNavbarServerStat: false, // 隐藏服务器统计 + // hideListItemStatusDonut: false, // 隐藏列表项的饼图 + // hideListItemStat: false, // 隐藏列表项的统计信息 + // hideListItemBill: false, // 隐藏列表项的账单信息 // hideFilter: false, // 隐藏筛选 // hideTag: false, // 隐藏标签 // customCodeMap: {}, // 自定义的地图点信息 @@ -23,6 +24,10 @@ window.$$nazhuaConfig = { // nezhaV0ConfigType: 'servers', // 哪吒v0数据读取类型 // v1ApiMonitorPath: '/api/v1/service/{id}', // v1WsPath: '/api/v1/ws/server', - // v1GroupPath: '/api/v1/server-group', + // v1ApiGroupPath: '/api/v1/server-group', + // v1ApiSettingPath: '/api/v1/setting', + // v1ApiProfilePath: '/api/v1/profile', + // v1DashboardUrl: '/dashboard', // v1版本控制台地址 + // v1HideNezhaDashboardBtn: true, // v1版本导航栏控制台入口/登录按钮 在nezhaVersion为v1时有效 // routeMode: 'h5', // 路由模式 }; diff --git a/readme.md b/readme.md index 695d437..64ec201 100644 --- a/readme.md +++ b/readme.md @@ -164,25 +164,30 @@ window.$$nazhuaConfig = { buyBtnText: '购买', // 购买按钮文案 listServerStatusType: 'progress', // 服务器状态类型--列表 detailServerStatusType: 'progress', // 服务器状态类型--详情页 - hideNavbarServerCount: false, // 隐藏服务器数量 - hideNavbarServerStat: false, // 隐藏服务器统计 - hideListItemStatusDonut: true, // 隐藏列表项的饼图 - hideListItemStat: true, // 隐藏列表项的统计信息 - hideListItemBill: false, // 隐藏列表项的账单信息 + disableSarasaTermSC: false, // 禁用Sarasa Term SC字体 hideWorldMap: false, // 隐藏地图 hideHomeWorldMap: false, // 隐藏首页地图 hideDetailWorldMap: false, // 隐藏详情地图 + hideNavbarServerCount: false, // 隐藏服务器数量 + hideNavbarServerStat: false, // 隐藏服务器统计 + hideListItemStatusDonut: false, // 隐藏列表项的饼图 + hideListItemStat: false, // 隐藏列表项的统计信息 + hideListItemBill: false, // 隐藏列表项的账单信息 hideFilter: false, // 隐藏筛选 hideTag: false, // 隐藏标签 customCodeMap: {}, // 自定义的地图点信息 - nezhaVersion: 'v0', // 哪吒版本 - apiMonitorPath: '/api/v1/monitor/{id}', // 监控数据API路径，不明白的就不要改 - wsPath: '/ws', // WebSocket路径，不明白的就不要改 - nezhaPath: '/nezha/', // 哪吒主页路径，不明白的就不要改 + nezhaVersion: 'v1', // 哪吒版本 + apiMonitorPath: '/api/v1/monitor/{id}', + wsPath: '/ws', + nezhaPath: '/nezha/', nezhaV0ConfigType: 'servers', // 哪吒v0数据读取类型 - v1ApiMonitorPath: '/api/v1/service/{id}', // v1监控数据API路径，不明白的就不要改 - v1WsPath: '/api/v1/ws/server', // v1WebSocket路径，不明白的就不要改 - v1GroupPath: '/api/v1/server-group', // v1分组数据API路径，不明白的就不要改 + v1ApiMonitorPath: '/api/v1/service/{id}', + v1WsPath: '/api/v1/ws/server', + v1ApiGroupPath: '/api/v1/server-group', + v1ApiSettingPath: '/api/v1/setting', + v1ApiProfilePath: '/api/v1/profile', + v1DashboardUrl: '/dashboard', // v1版本控制台地址 + v1HideNezhaDashboardBtn: true, // v1版本导航栏控制台入口/登录按钮 在nezhaVersion为v1时有效 routeMode: 'h5', // 路由模式 }; ``` diff --git a/src/App.vue b/src/App.vue index 340a04c..4642230 100644 --- a/src/App.vue +++ b/src/App.vue @@ -11,6 +11,8 @@ import { onMounted, } from 'vue'; import { useStore } from 'vuex'; +import { useRoute } from 'vue-router'; +import config from '@/config'; import sleep from '@/utils/sleep'; import LayoutMain from './layout/main.vue'; @@ -21,6 +23,7 @@ import activeWebsocketService, { } from './ws'; const store = useStore(); +const route = useRoute(); const currentTime = ref(0); @@ -36,11 +39,15 @@ function refreshTime() { }, 1000); } -function handleSystem() { - const isWindows = /windows|win32/i.test(navigator.userAgent); - if (isWindows) { - document.body.classList.add('windows'); - } +// 是否为Windows系统 +const isWindows = /windows|win32/i.test(navigator.userAgent); +if (isWindows) { + document.body.classList.add('windows'); +} +// 是否加载Sarasa Term SC字体 +const loadSarasaTermSC = config.nazhua.disableSarasaTermSC !== true; +if (loadSarasaTermSC) { + document.body.classList.add('sarasa-term-sc'); } /** @@ -59,13 +66,14 @@ async function wsReconnect() { } onMounted(async () => { - handleSystem(); refreshTime(); /** * 初始化服务器信息 */ - await store.dispatch('initServerInfo'); + await store.dispatch('initServerInfo', { + route, + }); /** * 初始化WS重连维护 diff --git a/src/assets/scss/base.scss b/src/assets/scss/base.scss index d3c2609..3864fda 100644 --- a/src/assets/scss/base.scss +++ b/src/assets/scss/base.scss @@ -149,7 +149,7 @@ div:focus { font-display: swap; } -body { +body.sarasa-term-sc { font-family: "Sarasa Term SC", 'Microsoft YaHei', diff --git a/src/config/index.js b/src/config/index.js index 1b3a256..cfcd36d 100644 --- a/src/config/index.js +++ b/src/config/index.js @@ -1,3 +1,5 @@ +const defaultNezhaVersion = import.meta.env.VITE_NEZHA_VERSION; + const config = { request: { headers: { @@ -12,14 +14,16 @@ const config = { }, nazhua: { title: '哪吒监控', - nezhaVersion: 'v0', + nezhaVersion: ['v0', 'v1'].includes(defaultNezhaVersion) ? defaultNezhaVersion : 'v0', apiMonitorPath: '/api/v1/monitor/{id}', wsPath: '/ws', nezhaPath: '/nezha/', nezhaV0ConfigType: 'servers', v1ApiMonitorPath: '/api/v1/service/{id}', v1WsPath: '/api/v1/ws/server', - v1GroupPath: '/api/v1/server-group', + v1ApiGroupPath: '/api/v1/server-group', + v1ApiSettingPath: '/api/v1/setting', + v1ApiProfilePath: '/api/v1/profile', // 解构载入自定义配置 ...(window.$$nazhuaConfig || {}), }, diff --git a/src/layout/components/header.vue b/src/layout/components/header.vue index 4ac4e9a..ab4f040 100644 --- a/src/layout/components/header.vue +++ b/src/layout/components/header.vue @@ -97,6 +97,25 @@ +
+ + + {{ userLogin ? '管理后台' : '登录' }} + +
@@ -107,7 +126,6 @@ * LayoutHeader */ import { - ref, computed, onMounted, } from 'vue'; @@ -237,7 +255,15 @@ const serverStat = computed(() => { }; }); -const title = ref(config.nazhua.title); +const title = computed(() => { + if (window.$$nazhuaConfig?.title) { + return window.$$nazhuaConfig.title; + } + if (store.state.setting?.site_name) { + return store.state.setting.site_name; + } + return config.nazhua.title; +}); const headerClass = computed(() => { const classes = []; @@ -261,6 +287,13 @@ function toHome() { } } +const showDashboardBtn = [ + config.nazhua.nezhaVersion === 'v1', + config.nazhua.v1HideNezhaDashboardBtn !== false, +].every((item) => item); +const userLogin = computed(() => store.state.profile?.username); +const dashboardUrl = config.nazhua.v1DashboardUrl || '/dashboard'; + onMounted(() => { title.value = config.nazhua.title; }); @@ -408,5 +441,23 @@ onMounted(() => { } } } + + .nezha-user-info-group { + display: flex; + align-items: center; + gap: 0 20px; + + .login-link { + display: flex; + align-items: center; + gap: 0 5px; + color: #ddd; + cursor: pointer; + + &:hover { + color: #fff; + } + } + } } diff --git a/src/store/index.js b/src/store/index.js index da3e327..a28208b 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -8,6 +8,8 @@ import loadNezhaV0Config, { } from '@/utils/load-nezha-v0-config'; import { loadServerGroup as loadNezhaV1ServerGroup, + loadSetting as loadNezhaV1Setting, + loadProfile as loadNezhaV1Profile, } from '@/utils/load-nezha-v1-config'; import { @@ -23,6 +25,8 @@ const defaultState = () => ({ online: 0, offline: 0, }, + profile: {}, + setting: {}, }); function isOnline(LastActive, currentTime = Date.now()) { @@ -78,20 +82,46 @@ const store = createStore({ state.serverCount = handleServerCount(newServers); state.init = true; }, + SET_PROFILE(state, profile) { + state.profile = profile; + }, + SET_SETTING(state, setting) { + state.setting = setting; + }, }, actions: { /** * 加载服务器列表 */ - async initServerInfo({ commit }) { + async initServerInfo({ commit }, params) { firstSetServers = true; // 如果是v1版本的话，加载v1版本的数据 if (config.nazhua.nezhaVersion === 'v1') { + const { + route, + } = params || {}; loadNezhaV1ServerGroup().then((res) => { if (res) { commit('SET_SERVER_GROUP', res); } }); + loadNezhaV1Setting().then((res) => { + if (res) { + commit('SET_SETTING', res); + // 如果自定义配置没有设置title，使用站点名称 + if (!window.$$nazhuaConfig.title) { + config.nazhua.title = res.site_name; + if (route?.name === 'Home' || !route) { + document.title = config.nazhua.title; + } + } + } + }); + loadNezhaV1Profile().then((res) => { + if (res) { + commit('SET_PROFILE', res); + } + }); return; } // 如果是v0版本的话，加载v0版本的数据 diff --git a/src/utils/load-nezha-v1-config.js b/src/utils/load-nezha-v1-config.js index 1aecae9..95e287e 100644 --- a/src/utils/load-nezha-v1-config.js +++ b/src/utils/load-nezha-v1-config.js @@ -120,10 +120,11 @@ export const handelV1toV0 = (v1Data) => { }; export const loadServerGroup = async () => request({ - url: config.nazhua.v1GroupPath, + // TODO: v1GroupPath 兼容 v1ApiGroupPath 到v0.6.0 + url: config.nazhua.v1GroupPath || config.nazhua.v1ApiGroupPath, type: 'GET', }).then((res) => { - if (res.status === 200) { + if (res.status === 200 && res.data?.success) { const list = res.data?.data || []; return list.map((i) => { const item = { @@ -136,3 +137,31 @@ export const loadServerGroup = async () => request({ } return null; }).catch(() => null); + +/** + * 加载网站配置 + * + * 暂时只使用site_name + */ +export const loadSetting = async () => request({ + url: config.nazhua.v1ApiSettingPath, + type: 'GET', +}).then((res) => { + if (res.status === 200 && res.data?.success) { + return res.data?.data || {}; + } + return null; +}).catch(() => null); + +/** + * 加载个人信息 + */ +export const loadProfile = async () => request({ + url: config.nazhua.v1ApiProfilePath, + type: 'GET', +}).then((res) => { + if (res.status === 200 && res.data?.success) { + return res.data?.data || {}; + } + return null; +}).catch(() => null);