🐛 Fixed the bug of obtaining the operating system

This commit is contained in:
2025-06-09 14:18:25 +08:00
parent 5203784b63
commit ceb177114d
9 changed files with 171 additions and 93 deletions

View File

@@ -1,46 +1,31 @@
<script setup lang="ts">
import { onMounted, ref, computed } from 'vue';
import { onMounted } from 'vue';
import { useConfigStore } from '@/stores/configStore';
import { useSystemStore } from '@/stores/systemStore';
import { useSystemTheme } from '@/composables/useSystemTheme';
import WindowTitleBar from '@/components/titlebar/WindowTitleBar.vue';
import * as runtime from '@wailsio/runtime';
const configStore = useConfigStore();
const systemStore = useSystemStore();
const { setTheme } = useSystemTheme();
// 操作系统检测
const isWindows = ref(false);
const isMacOS = ref(false);
// 根据操作系统计算标题栏高度
const titleBarHeight = computed(() => {
if (isWindows.value) return '32px';
if (isMacOS.value) return '28px';
return '34px'; // Linux 默认
});
// 应用启动时加载配置和检测操作系统
// 应用启动时加载配置和初始化系统信息
onMounted(async () => {
await configStore.initConfig();
// 并行初始化配置和系统信息
await Promise.all([
configStore.initConfig(),
systemStore.initializeSystemInfo()
]);
await configStore.initializeLanguage();
setTheme(configStore.config.appearance.systemTheme);
// 检测操作系统
try {
isWindows.value = runtime.System.IsWindows();
isMacOS.value = runtime.System.IsMac();
} catch (error) {
console.error('检测操作系统失败:', error);
// 默认使用 Windows
isWindows.value = true;
}
});
</script>
<template>
<div class="app-container">
<WindowTitleBar />
<div class="app-content" :style="{ marginTop: titleBarHeight }">
<div class="app-content" :style="{ marginTop: systemStore.titleBarHeight }">
<router-view/>
</div>
</div>

View File

@@ -111,11 +111,11 @@ onMounted(async () => {
await checkMaximizedState();
});
onUnmounted(() => {
runtime.Events.Off('window:maximised');
runtime.Events.Off('window:unmaximised');
runtime.Events.Off('window:focus');
});
});
onUnmounted(() => {
runtime.Events.Off('window:maximised');
runtime.Events.Off('window:unmaximised');
runtime.Events.Off('window:focus');
});
</script>

View File

@@ -116,11 +116,11 @@ onMounted(async () => {
await checkMaximizedState();
});
onUnmounted(() => {
runtime.Events.Off('window:maximised');
runtime.Events.Off('window:unmaximised');
runtime.Events.Off('window:focus');
});
});
onUnmounted(() => {
runtime.Events.Off('window:maximised');
runtime.Events.Off('window:unmaximised');
runtime.Events.Off('window:focus');
});
</script>

View File

@@ -1,29 +1,16 @@
<template>
<WindowsTitleBar v-if="isWindows" />
<MacOSTitleBar v-else-if="isMacOS" />
<WindowsTitleBar v-if="systemStore.isWindows" />
<MacOSTitleBar v-else-if="systemStore.isMacOS" />
<LinuxTitleBar v-else />
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import * as runtime from '@wailsio/runtime';
import { useSystemStore } from '@/stores/systemStore';
import WindowsTitleBar from './WindowsTitleBar.vue';
import MacOSTitleBar from './MacOSTitleBar.vue';
import LinuxTitleBar from './LinuxTitleBar.vue';
// 操作系统检测
const isWindows = ref(false);
const isMacOS = ref(false);
onMounted(async () => {
try {
isWindows.value = runtime.System.IsWindows();
isMacOS.value = runtime.System.IsMac();
} catch (error) {
// 默认使用 Windows 风格
isWindows.value = true;
}
});
const systemStore = useSystemStore();
</script>
<style scoped lang="scss">

View File

@@ -1,33 +1,34 @@
<template>
<div class="windows-titlebar" style="--wails-draggable:drag" @contextmenu.prevent @mouseenter="checkMaximizedState" @mouseup="checkMaximizedState">
<div class="windows-titlebar" style="--wails-draggable:drag" @contextmenu.prevent @mouseenter="checkMaximizedState"
@mouseup="checkMaximizedState">
<div class="titlebar-content" @dblclick="toggleMaximize" @contextmenu.prevent>
<div class="titlebar-icon">
<img src="/appicon.png" alt="voidraft" />
<img src="/appicon.png" alt="voidraft"/>
</div>
<div class="titlebar-title">voidraft</div>
</div>
<div class="titlebar-controls" style="--wails-draggable:no-drag" @contextmenu.prevent>
<button
class="titlebar-button minimize-button"
@click="minimizeWindow"
:title="t('titlebar.minimize')"
class="titlebar-button minimize-button"
@click="minimizeWindow"
:title="t('titlebar.minimize')"
>
<span class="titlebar-icon">&#xE921;</span>
</button>
<button
class="titlebar-button maximize-button"
@click="toggleMaximize"
:title="isMaximized ? t('titlebar.restore') : t('titlebar.maximize')"
class="titlebar-button maximize-button"
@click="toggleMaximize"
:title="isMaximized ? t('titlebar.restore') : t('titlebar.maximize')"
>
<span class="titlebar-icon" v-html="maximizeIcon"></span>
</button>
<button
class="titlebar-button close-button"
@click="closeWindow"
:title="t('titlebar.close')"
class="titlebar-button close-button"
@click="closeWindow"
:title="t('titlebar.close')"
>
<span class="titlebar-icon">&#xE8BB;</span>
</button>
@@ -36,11 +37,11 @@
</template>
<script setup lang="ts">
import { ref, onMounted, onUnmounted, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import {computed, onMounted, onUnmounted, ref} from 'vue';
import {useI18n} from 'vue-i18n';
import * as runtime from '@wailsio/runtime';
const { t } = useI18n();
const {t} = useI18n();
const isMaximized = ref(false);
// 计算属性用于图标,减少重复渲染
@@ -108,11 +109,12 @@ onMounted(async () => {
await checkMaximizedState();
});
onUnmounted(() => {
runtime.Events.Off('window:maximised');
runtime.Events.Off('window:unmaximised');
runtime.Events.Off('window:focus');
});
});
onUnmounted(() => {
runtime.Events.Off('window:maximised');
runtime.Events.Off('window:unmaximised');
runtime.Events.Off('window:focus');
});
</script>

View File

@@ -3,7 +3,8 @@ import messages from './locales';
// 创建i18n实例
const i18n = createI18n({
compositionOnly: false,
legacy: false,
compositionOnly: true,
globalInjection: true,
silentTranslationWarn: true,
locale: 'zh-CN',

View File

@@ -0,0 +1,101 @@
import { defineStore } from 'pinia';
import { ref, computed } from 'vue';
import * as runtime from '@wailsio/runtime';
export interface SystemEnvironment {
OS: string;
Arch: string;
Debug: boolean;
OSInfo: {
Name: string;
Branding: string;
Version: string;
ID: string;
};
PlatformInfo?: Record<string, string>;
}
export const useSystemStore = defineStore('system', () => {
// 状态
const environment = ref<SystemEnvironment | null>(null);
const isLoading = ref(false);
const error = ref<string | null>(null);
// 计算属性
const isWindows = computed(() => environment.value?.OS === 'windows');
const isMacOS = computed(() => environment.value?.OS === 'darwin');
const isLinux = computed(() => environment.value?.OS === 'linux');
// 获取操作系统名称
const osName = computed(() => {
if (!environment.value) return 'Unknown';
return environment.value.OSInfo?.Name || environment.value.OS || 'Unknown';
});
// 获取架构信息
const architecture = computed(() => environment.value?.Arch || 'Unknown');
// 获取标题栏高度
const titleBarHeight = computed(() => {
if (isWindows.value) return '32px';
if (isMacOS.value) return '28px';
return '34px'; // Linux 默认
});
// 初始化系统信息
const initializeSystemInfo = async (): Promise<void> => {
if (isLoading.value) return;
isLoading.value = true;
error.value = null;
try {
const env = await runtime.System.Environment();
environment.value = env;
} catch (err) {
error.value = 'Failed to get system environment';
environment.value = null;
} finally {
isLoading.value = false;
}
};
// 获取平台特定信息
const getPlatformInfo = () => {
return environment.value?.PlatformInfo || {};
};
// 检查是否支持某项功能(基于操作系统)
const supportsFeature = (feature: string): boolean => {
switch (feature) {
case 'systemTray':
return true; // 所有平台都支持
case 'globalHotkeys':
return !isLinux.value; // Linux 支持可能有限
case 'transparency':
return isWindows.value || isMacOS.value;
default:
return false;
}
};
return {
// 状态
environment,
isLoading,
error,
// 计算属性
isWindows,
isMacOS,
isLinux,
osName,
architecture,
titleBarHeight,
// 方法
initializeSystemInfo,
getPlatformInfo,
supportsFeature
};
});

1
go.mod
View File

@@ -51,6 +51,7 @@ require (
github.com/leaanthony/u v1.1.1 // indirect
github.com/leodido/go-urn v1.4.0 // indirect
github.com/lmittmann/tint v1.1.1 // indirect
github.com/matryer/is v1.4.1 // indirect
github.com/mattn/go-colorable v0.1.14 // indirect
github.com/mattn/go-isatty v0.0.20 // indirect
github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd // indirect

3
go.sum
View File

@@ -110,8 +110,9 @@ github.com/lmittmann/tint v1.1.1 h1:xmmGuinUsCSxWdwH1OqMUQ4tzQsq3BdjJLAAmVKJ9Dw=
github.com/lmittmann/tint v1.1.1/go.mod h1:HIS3gSy7qNwGCj+5oRjAutErFBl4BzdQP6cJZ0NfMwE=
github.com/lxzan/gws v1.8.9 h1:VU3SGUeWlQrEwfUSfokcZep8mdg/BrUF+y73YYshdBM=
github.com/lxzan/gws v1.8.9/go.mod h1:d9yHaR1eDTBHagQC6KY7ycUOaz5KWeqQtP3xu7aMK8Y=
github.com/matryer/is v1.4.0 h1:sosSmIWwkYITGrxZ25ULNDeKiMNzFSr4V/eqBQP0PeE=
github.com/matryer/is v1.4.0/go.mod h1:8I/i5uYgLzgsgEloJE1U6xx5HkBQpAZvepWuujKwMRU=
github.com/matryer/is v1.4.1 h1:55ehd8zaGABKLXQUe2awZ99BD/PTc2ls+KV/dXphgEQ=
github.com/matryer/is v1.4.1/go.mod h1:8I/i5uYgLzgsgEloJE1U6xx5HkBQpAZvepWuujKwMRU=
github.com/mattn/go-colorable v0.1.14 h1:9A9LHSqF/7dyVVX6g0U9cwm9pG3kP9gSzcuIPHPsaIE=
github.com/mattn/go-colorable v0.1.14/go.mod h1:6LmQG8QLFO4G5z1gPvYEzlUgJ2wF+stgPZH1UqBm1s8=
github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY=