✨ Add window pinning

frontend/bindings/voidraft/internal/models/models.ts

@@ -128,6 +128,11 @@ export class EditorConfig {
      */
     "language": LanguageType;
 
+    /**
+     * 窗口是否置顶
+     */
+    "alwaysOnTop": boolean;
+
     /** Creates a new EditorConfig instance. */
     constructor($$source: Partial<EditorConfig> = {}) {
         if (!("fontSize" in $$source)) {
@@ -145,6 +150,9 @@ export class EditorConfig {
         if (!("language" in $$source)) {
             this["language"] = ("" as LanguageType);
         }
+        if (!("alwaysOnTop" in $$source)) {
+            this["alwaysOnTop"] = false;
+        }
 
         Object.assign(this, $$source);
     }

frontend/package.json

@@ -40,30 +40,30 @@
     "@codemirror/lint": "^6.8.5",
     "@codemirror/search": "^6.5.10",
     "@codemirror/state": "^6.5.2",
-    "@codemirror/view": "^6.36.6",
+    "@codemirror/view": "^6.36.7",
     "@lezer/highlight": "^1.2.1",
     "@types/uuid": "^10.0.0",
     "@vueuse/core": "^13.1.0",
     "codemirror": "^6.0.1",
     "pinia": "^3.0.2",
-    "sass": "^1.87.0",
+    "sass": "^1.88.0",
     "uuid": "^11.1.0",
     "vue": "^3.5.13",
     "vue-i18n": "^11.1.3",
-    "vue-router": "^4.5.0"
+    "vue-router": "^4.5.1"
   },
   "devDependencies": {
-    "@eslint/js": "^9.25.1",
-    "@types/node": "^22.15.2",
-    "@vitejs/plugin-vue": "^5.2.3",
+    "@eslint/js": "^9.26.0",
+    "@types/node": "^22.15.17",
+    "@vitejs/plugin-vue": "^5.2.4",
     "@wailsio/runtime": "latest",
-    "eslint": "^9.25.1",
-    "eslint-plugin-vue": "^10.0.0",
-    "globals": "^16.0.0",
+    "eslint": "^9.26.0",
+    "eslint-plugin-vue": "^10.1.0",
+    "globals": "^16.1.0",
     "typescript": "^5.8.3",
-    "typescript-eslint": "^8.31.0",
+    "typescript-eslint": "^8.32.0",
     "unplugin-vue-components": "^28.5.0",
-    "vite": "^6.3.3",
+    "vite": "^6.3.5",
     "vue-eslint-parser": "^10.1.3",
     "vue-tsc": "^2.2.10"
   }

frontend/src/components/toolbar/Toolbar.vue

@@ -3,9 +3,9 @@ import {useEditorStore} from '@/stores/editorStore';
 import {useConfigStore} from '@/stores/configStore';
 import {useLogStore} from '@/stores/logStore';
 import { useI18n } from 'vue-i18n';
-import { ref } from 'vue';
+import { ref, onMounted, watch } from 'vue';
 import {SUPPORTED_LOCALES, setLocale, SupportedLocaleType} from '@/i18n';
-
+import * as wails from '@wailsio/runtime';
 const editorStore = useEditorStore();
 const configStore = useConfigStore();
 const logStore = useLogStore();
@@ -25,8 +25,39 @@ const toggleLanguageMenu = () => {
   showLanguageMenu.value = !showLanguageMenu.value;
 };
 
+// 窗口置顶控制
+const toggleAlwaysOnTop = () => {
+  configStore.toggleAlwaysOnTop();
+  // 使用Window.SetAlwaysOnTop方法设置窗口置顶状态
+  try {
+    wails.Window.SetAlwaysOnTop(configStore.config.alwaysOnTop);
+  } catch (error) {
+    console.error('Failed to set window always on top:', error);
+    logStore.error(t('config.alwaysOnTopFailed'));
+  }
+};
 
+// 在组件挂载时根据配置设置窗口置顶状态
+onMounted(() => {
+  if (configStore.configLoaded && configStore.config.alwaysOnTop) {
+    try {
+      wails.Window.SetAlwaysOnTop(true);
+    } catch (error) {
+      console.error('Failed to set window always on top:', error);
+    }
+  }
+});
 
+// 监听配置加载完成，加载后检查并设置窗口置顶状态
+watch(() => configStore.configLoaded, (isLoaded) => {
+  if (isLoaded && configStore.config.alwaysOnTop) {
+    try {
+      wails.Window.SetAlwaysOnTop(true);
+    } catch (error) {
+      console.error('Failed to set window always on top:', error);
+    }
+  }
+});
 </script>
 
 <template>
@@ -64,6 +95,12 @@ const toggleLanguageMenu = () => {
           <button class="tab-btn" @click="configStore.increaseTabSize" :disabled="configStore.config.tabSize >= configStore.MAX_TAB_SIZE">+</button>
         </span>
       </span>
+
+      <!-- 窗口置顶选择框 -->
+      <label class="always-on-top-toggle" :title="t('toolbar.alwaysOnTop')">
+        <input type="checkbox" :checked="configStore.config.alwaysOnTop" @change="toggleAlwaysOnTop" />
+        <span>{{ t('toolbar.alwaysOnTop') }}</span>
+      </label>
       
       <!-- 语言切换按钮 -->
       <div class="selector-dropdown">
@@ -203,6 +240,24 @@ const toggleLanguageMenu = () => {
       }
     }
     
+    /* 窗口置顶选择框样式 */
+    .always-on-top-toggle {
+      display: flex;
+      align-items: center;
+      gap: 3px;
+      cursor: pointer;
+      color: var(--text-muted);
+      font-size: 11px;
+      
+      input {
+        cursor: pointer;
+      }
+      
+      &:hover {
+        color: var(--text-primary);
+      }
+    }
+    
     /* 通用下拉选择器样式 */
     .selector-dropdown {
       position: relative;

frontend/src/i18n/locales/en-US.ts

@@ -13,7 +13,8 @@ export default {
       tab: 'Tab'
     },
     encoding: 'UTF-8',
-    settings: 'Settings'
+    settings: 'Settings',
+    alwaysOnTop: 'Always on Top'
   },
   config: {
     loadSuccess: 'Configuration loaded successfully',
@@ -24,7 +25,8 @@ export default {
     resetFailed: 'Failed to reset configuration',
     fontSizeFixed: 'Font size ({value}) has been corrected to {fixed}',
     tabSizeFixed: 'Tab size ({value}) has been corrected to {fixed}',
-    tabTypeFixed: 'Tab type ({value}) is invalid, corrected to spaces'
+    tabTypeFixed: 'Tab type ({value}) is invalid, corrected to spaces',
+    alwaysOnTopFailed: 'Failed to set window always on top'
   },
   languages: {
     'zh-CN': '简体中文',

frontend/src/i18n/locales/zh-CN.ts

@@ -13,7 +13,8 @@ export default {
       tab: '制表符'
     },
     encoding: 'UTF-8',
-    settings: '设置'
+    settings: '设置',
+    alwaysOnTop: '窗口置顶'
   },
   config: {
     loadSuccess: '配置加载成功',
@@ -24,7 +25,8 @@ export default {
     resetFailed: '重置配置失败',
     fontSizeFixed: '字体大小值({value})已被修正为{fixed}',
     tabSizeFixed: 'Tab大小值({value})已被修正为{fixed}',
-    tabTypeFixed: 'Tab类型({value})不合法，已修正为空格'
+    tabTypeFixed: 'Tab类型({value})不合法，已修正为空格',
+    alwaysOnTopFailed: '无法设置窗口置顶状态'
   },
   languages: {
     'zh-CN': '简体中文',

frontend/src/stores/configStore.ts

@@ -158,6 +158,11 @@ export const useConfigStore = defineStore('config', () => {
             : TabType.TabTypeSpaces;
     }
 
+    // 切换窗口置顶状态
+    function toggleAlwaysOnTop() {
+        updateConfig('alwaysOnTop', val => !val);
+    }
+
     // 重置为默认配置
     async function resetToDefaults() {
         try {
@@ -197,6 +202,9 @@ export const useConfigStore = defineStore('config', () => {
         toggleTabIndent: () => updateConfig('enableTabIndent', val => !val),
         increaseTabSize: () => adjustTabSize(1),
         decreaseTabSize: () => adjustTabSize(-1),
-        toggleTabType
+        toggleTabType,
+        
+        // 窗口置顶操作
+        toggleAlwaysOnTop
     };
 });