✨ Add i18n support

frontend/src/stores/configStore.ts

@@ -1,5 +1,5 @@
 import {defineStore} from 'pinia';
-import {ref, watch} from 'vue';
+import {ref, watch, inject} from 'vue';
 import {useDebounceFn} from '@vueuse/core';
 import {
     GetEditorConfig,
@@ -7,6 +7,8 @@ import {
     UpdateEditorConfig
 } from '@/../bindings/voidraft/internal/services/configservice';
 import {EditorConfig, TabType} from '@/../bindings/voidraft/internal/models/models';
+import {useLogStore} from './logStore';
+import { useI18n } from 'vue-i18n';
 
 // 字体大小范围
 const MIN_FONT_SIZE = 12;
@@ -19,6 +21,10 @@ const MIN_TAB_SIZE = 2;
 const MAX_TAB_SIZE = 8;
 
 export const useConfigStore = defineStore('config', () => {
+    // 获取日志store
+    const logStore = useLogStore();
+    const { t } = useI18n();
+    
     // 配置状态
     const config = ref<EditorConfig>(new EditorConfig({
         fontSize: DEFAULT_FONT_SIZE,
@@ -34,11 +40,66 @@ export const useConfigStore = defineStore('config', () => {
     // 从后端加载配置
     async function loadConfigFromBackend() {
         try {
-            const editorConfig = await GetEditorConfig();
-            config.value = editorConfig;
+            config.value = await GetEditorConfig();
+            
+            // 验证并纠正配置
+            validateAndFixConfig();
+            
             configLoaded.value = true;
+            logStore.info(t('config.loadSuccess'));
         } catch (error) {
             console.error('Failed to load configuration:', error);
+            logStore.error(t('config.loadFailed'));
+        }
+    }
+    
+    // 验证配置是否在合理范围内，并修正无效值
+    function validateAndFixConfig() {
+        let hasChanges = false;
+        
+        // 验证字体大小
+        if (config.value.fontSize < MIN_FONT_SIZE || config.value.fontSize > MAX_FONT_SIZE) {
+            const oldValue = config.value.fontSize;
+            config.value.fontSize = oldValue < MIN_FONT_SIZE ? MIN_FONT_SIZE : 
+                                   oldValue > MAX_FONT_SIZE ? MAX_FONT_SIZE : 
+                                   DEFAULT_FONT_SIZE;
+            
+            logStore.warning(t('config.fontSizeFixed', {
+                value: oldValue,
+                fixed: config.value.fontSize
+            }));
+            
+            hasChanges = true;
+        }
+        
+        // 验证Tab大小
+        if (config.value.tabSize < MIN_TAB_SIZE || config.value.tabSize > MAX_TAB_SIZE) {
+            const oldValue = config.value.tabSize;
+            config.value.tabSize = oldValue < MIN_TAB_SIZE ? MIN_TAB_SIZE : 
+                                  oldValue > MAX_TAB_SIZE ? MAX_TAB_SIZE : 
+                                  DEFAULT_TAB_SIZE;
+            
+            logStore.warning(t('config.tabSizeFixed', {
+                value: oldValue,
+                fixed: config.value.tabSize
+            }));
+            
+            hasChanges = true;
+        }
+        
+        // 验证TabType是否合法
+        const validTabTypes = [TabType.TabTypeSpaces, TabType.TabTypeTab];
+        if (!validTabTypes.includes(config.value.tabType)) {
+            const oldValue = config.value.tabType;
+            config.value.tabType = TabType.TabTypeSpaces;
+            
+            logStore.warning(t('config.tabTypeFixed', { value: oldValue }));
+            hasChanges = true;
+        }
+        
+        // 如果配置被修正，保存回后端
+        if (hasChanges && configLoaded.value) {
+            saveConfigToBackend();
         }
     }
 
@@ -46,8 +107,10 @@ export const useConfigStore = defineStore('config', () => {
     const saveConfigToBackend = useDebounceFn(async () => {
         try {
             await UpdateEditorConfig(config.value);
+            logStore.info(t('config.saveSuccess'));
         } catch (error) {
             console.error('Failed to save configuration:', error);
+            logStore.error(t('config.saveFailed'));
         }
     }, 500); // 500ms防抖
 
@@ -110,8 +173,14 @@ export const useConfigStore = defineStore('config', () => {
 
     // 重置为默认配置
     async function resetToDefaults() {
-        await ResetToDefault();
-        await loadConfigFromBackend();
+        try {
+            await ResetToDefault();
+            await loadConfigFromBackend();
+            logStore.info(t('config.resetSuccess'));
+        } catch (error) {
+            console.error('Failed to reset configuration:', error);
+            logStore.error(t('config.resetFailed'));
+        }
     }
     return {
         // 状态

frontend/src/stores/logStore.ts

@@ -0,0 +1,107 @@
+import { defineStore } from 'pinia';
+import { ref } from 'vue';
+
+// 日志级别定义
+export enum LogLevel {
+  INFO = 'info',
+  WARNING = 'warning',
+  ERROR = 'error'
+}
+
+// 日志项结构
+export interface LogItem {
+  id: number;
+  level: LogLevel;
+  message: string;
+  timestamp: Date;
+}
+
+export const useLogStore = defineStore('log', () => {
+  // 日志列表
+  const logs = ref<LogItem[]>([]);
+  
+  // 最近一条日志，用于在工具栏显示
+  const latestLog = ref<LogItem | null>(null);
+  
+  // 是否显示日志
+  const showLog = ref(true);
+  
+  // 自动隐藏计时器
+  let hideTimer: number | null = null;
+  
+  // 添加日志
+  function addLog(level: LogLevel, message: string, autoHideDelay = 5000) {
+    const id = Date.now();
+    const logItem: LogItem = {
+      id,
+      level,
+      message,
+      timestamp: new Date()
+    };
+    
+    // 添加到日志列表
+    logs.value.push(logItem);
+    
+    // 保持日志列表在合理大小
+    if (logs.value.length > 100) {
+      logs.value = logs.value.slice(-100);
+    }
+    
+    // 设置最新日志
+    latestLog.value = logItem;
+    showLog.value = true;
+    
+    // 设置自动隐藏
+    if (hideTimer) {
+      window.clearTimeout(hideTimer);
+    }
+    
+    if (autoHideDelay > 0) {
+      hideTimer = window.setTimeout(() => {
+        showLog.value = false;
+      }, autoHideDelay);
+    }
+    
+    return id;
+  }
+  
+  // 添加不同级别的日志的便捷方法
+  function info(message: string, autoHideDelay = 5000) {
+    return addLog(LogLevel.INFO, message, autoHideDelay);
+  }
+  
+  function warning(message: string, autoHideDelay = 5000) {
+    return addLog(LogLevel.WARNING, message, autoHideDelay);
+  }
+  
+  function error(message: string, autoHideDelay = 5000) {
+    return addLog(LogLevel.ERROR, message, autoHideDelay);
+  }
+  
+  // 清除日志
+  function clearLogs() {
+    logs.value = [];
+    latestLog.value = null;
+    showLog.value = false;
+  }
+  
+  // 手动隐藏当前日志
+  function hideCurrentLog() {
+    showLog.value = false;
+  }
+  
+  return {
+    // 状态
+    logs,
+    latestLog,
+    showLog,
+    
+    // 方法
+    addLog,
+    info,
+    warning,
+    error,
+    clearLogs,
+    hideCurrentLog
+  };
+});