Merge pull request #30 from qianmoQ/dev-25.0.1

fix (core): 修复编辑器修改后配置未更新

Author: qianmoQ

docs/content/download.md

@@ -0,0 +1,18 @@
+---
+title: 下载 CodeForge
+
+config:
+    sidebar: false
+    toc: false
+---
+
+当前的 CodeForge 版本是 <img class="inline-flex" src="https://img.shields.io/github/v/release/devlive-community/codeforge.svg" />。有关详细信息，请参阅 [发行说明](/release/25.0.0.html)。
+
+<br />
+
+::: grid
+- 适配 Windows
+- 适配 macOS
+:::
+
+!btn[点我立即下载](https://github.com/devlive-community/codeforge/releases/){w-96 my-24 text-center text-white bg-green-500 hover:bg-green-600}

docs/content/index.md

@@ -13,7 +13,7 @@ hero:
     url: /download.html
     text: 立即下载
   secondaryCta:
-    url: /<%= pageData.language %>/usage/href.html
+    url: https://github.com/devlive-community/codeforge
     text: 了解更多
 
 features:
@@ -47,13 +47,13 @@ stats:
   description: 我们取得的成就
   items:
     - label: GitHub Stars
-      value: 0+
-    - label: Gitee Stars
-      value: 0+
-    - label: 正常运行时间
-      value: 99.99%
+      value: 5+
+    - label: 跨平台性(Windows、macOS)
+      value: 3+
+    - label: 支持的语言
+      value: 5+
     - label: 客户满意度
-      value: 0%
+      value: 100%
 
 cta:
   title: 准备好开始了吗？

docs/pageforge.yaml

@@ -13,6 +13,27 @@ repo:
   url: https://github.com/devlive-community/codeforge
   branch: dev
 
+banner:
+  content: 💗 <a href="https://github.com/devlive-community/codeforge" target="_blank">CodeForge <em>2025.0.0</em> 已经发布, 如果喜欢我们的软件，请点击这里支持我们</a> ❤️
+
+feature:
+  lucide:
+    enable: true
+  grid:
+    enable: true
+  share:
+    enable: true
+    options:
+      qq: true
+      wechat: true
+      weibo: true
+  sitemap:
+    enable: true
+  fontSize:
+    enable: true
+  button:
+    enable: true
+
 footer:
   copyright: © 2025 CodeForge All Rights Reserved.
   social:

src/App.vue

@@ -21,7 +21,7 @@
           </div>
         </div>
         <div class="flex-1 overflow-hidden">
-          <CodeEditor v-model="code" class="h-full" :language="currentLanguage"/>
+          <CodeEditor v-model="code" class="h-full" :language="currentLanguage" :editor-config="editorConfig" :key="editorConfigKey"/>
         </div>
       </div>
 
@@ -44,7 +44,7 @@
     <About v-if="showAbout" @close="closeAbout"/>
 
     <!-- 设置组件 -->
-    <Settings v-if="showSettings" @close="closeSettings"/>
+    <Settings v-if="showSettings" @close="closeSettings" @settings-changed="handleSettingsChanged"/>
 
     <!-- 更新组件 -->
     <Update v-if="showUpdate" @close="closeUpdate"/>
@@ -55,7 +55,7 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, onUnmounted } from 'vue'
+import { onMounted, onUnmounted, ref, watch } from 'vue'
 import AppHeader from './components/AppHeader.vue'
 import CodeEditor from './components/CodeEditor.vue'
 import OutputPanel from './components/OutputPanel.vue'
@@ -70,6 +70,7 @@ import { useCodeExecution } from './composables/useCodeExecution'
 import { useLanguageManager } from './composables/useLanguageManager'
 import { useEventManager } from './composables/useEventManager'
 import { useAppState } from './composables/useAppState'
+import { useEditorConfig } from './composables/useEditorConfig'
 import Update from './components/Update.vue'
 
 const toast = useToast()
@@ -109,6 +110,34 @@ const {
   closeUpdate
 } = useAppState()
 
+// 编辑器配置管理
+const {
+  editorConfig,
+  loadConfig: loadEditorConfig
+} = useEditorConfig()
+
+// 强制刷新 CodeEditor 组件的 key
+const editorConfigKey = ref(0)
+
+// 处理设置变更
+const handleSettingsChanged = (config: any) => {
+  console.log('主组件接收到设置变更:', config)
+  // 延迟一点点再刷新，减少闪烁
+  setTimeout(() => {
+    editorConfigKey.value++
+  }, 50)
+}
+
+// 监听编辑器配置变化
+watch(editorConfig, (newConfig) => {
+  if (newConfig) {
+    console.log('编辑器配置更新，刷新编辑器组件')
+    setTimeout(() => {
+      editorConfigKey.value++
+    }, 50)
+  }
+}, { deep: true })
+
 const { initializeEventListeners, cleanupEventListeners } = useEventManager({
   showAbout,
   showSettings,
@@ -131,6 +160,7 @@ window.addEventListener('contextmenu', (e) => e.preventDefault(), false)
 
 onMounted(async () => {
   await initialize()
+  await loadEditorConfig()
   await initializeEventListeners()
 
   // 触发 app-ready 事件，通知主进程

src/components/Settings.vue

@@ -13,7 +13,7 @@
 
       <!-- 编辑器配置 -->
       <template #editor>
-        <Editor v-if="activeTab === 'editor'"/>
+        <Editor v-if="activeTab === 'editor'" @settings-changed="handleEditorSettingsChanged" @error="handleEditorError"/>
       </template>
 
       <!-- 语言配置 -->
@@ -25,38 +25,30 @@
 </template>
 
 <script setup lang="ts">
-import { nextTick, onMounted, ref } from 'vue'
-import { BracesIcon, CodeIcon, ShieldIcon } from 'lucide-vue-next'
+import { onMounted } from 'vue'
 import Modal from '../ui/Modal.vue'
 import Tabs from '../ui/Tabs.vue'
 import General from './setting/General.vue'
 import Language from './setting/Language.vue'
 import Editor from './setting/Editor.vue'
-
-const isVisible = ref(false)
-const activeTab = ref('general')
-const tabsData = [
-  { key: 'general', label: '通用', icon: ShieldIcon },
-  { key: 'editor', label: '编辑器', icon: CodeIcon },
-  { key: 'language', label: '语言', icon: BracesIcon }
-]
+import { useSettings } from '../composables/useSettings.ts'
 
 const emit = defineEmits<{
   close: []
+  'settings-changed': [config: any]
 }>()
 
-const closeSettings = () => {
-  isVisible.value = false
-  setTimeout(() => {
-    emit('close')
-  }, 300)
-}
+const {
+  isVisible,
+  activeTab,
+  tabsData,
+  handleEditorSettingsChanged,
+  handleEditorError,
+  closeSettings,
+  initialize
+} = useSettings(emit)
 
 onMounted(async () => {
-  // 延迟显示动画
-  await nextTick()
-  setTimeout(() => {
-    isVisible.value = true
-  }, 50)
+  await initialize()
 })
 </script>

src/components/setting/Editor.vue

@@ -7,8 +7,7 @@
       <div class="flex gap-2">
         <input v-model="editorConfig.indent_with_tab"
                type="checkbox"
-               placeholder="超时时间(秒)，默认 30 秒"
-               class="flex-1 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-transparent text-sm"/>
+               class="px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-transparent text-sm"/>
       </div>
     </div>
 
@@ -17,12 +16,12 @@
         缩进空格数
       </label>
       <div class="flex gap-2">
-        <input v-model="editorConfig.tab_size"
+        <input v-model.number="editorConfig.tab_size"
                type="number"
-               :disabled="!editorConfig.indent_with_tab"
-               placeholder="缩进空格数，默认 2 秒"
-               class="flex-1 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-transparent text-sm"
-               :class="[!editorConfig.indent_with_tab ? 'opacity-50 cursor-not-allowed' : '']"/>
+               min="1"
+               max="8"
+               placeholder="缩进空格数，默认 2"
+               class="flex-1 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-transparent text-sm"/>
       </div>
     </div>
 
@@ -31,10 +30,7 @@
         编辑器主题
       </label>
       <div class="flex gap-2">
-        <Select v-model="editorConfig.theme"
-                class="w-1/4"
-                placeholder="选择编辑器主题"
-                :options="themeOptions"/>
+        <Select v-model="editorConfig.theme" class="w-1/4" placeholder="选择编辑器主题" :options="themeOptions"/>
       </div>
     </div>
   </div>

src/composables/useSettings.ts

@@ -0,0 +1,58 @@
+import { nextTick, ref } from 'vue'
+import { BracesIcon, CodeIcon, ShieldIcon } from 'lucide-vue-next'
+
+export function useSettings(emit: any)
+{
+    // 状态管理
+    const isVisible = ref(false)
+    const activeTab = ref('general')
+
+    // 标签页配置
+    const tabsData = [
+        { key: 'general', label: '通用', icon: ShieldIcon },
+        { key: 'editor', label: '编辑器', icon: CodeIcon },
+        { key: 'language', label: '语言', icon: BracesIcon }
+    ]
+
+    // 处理编辑器设置变更
+    const handleEditorSettingsChanged = (config: any) => {
+        console.log('设置模态框接收到编辑器配置变更:', config)
+        // 向上传递事件到主组件
+        emit('settings-changed', config)
+    }
+
+    // 处理编辑器错误
+    const handleEditorError = (message: string) => {
+        console.error('编辑器设置错误:', message)
+    }
+
+    // 关闭设置
+    const closeSettings = () => {
+        isVisible.value = false
+        setTimeout(() => {
+            emit('close')
+        }, 300)
+    }
+
+    // 初始化模态框
+    const initialize = async () => {
+        // 延迟显示动画
+        await nextTick()
+        setTimeout(() => {
+            isVisible.value = true
+        }, 50)
+    }
+
+    return {
+        // 状态
+        isVisible,
+        activeTab,
+        tabsData,
+
+        // 方法
+        handleEditorSettingsChanged,
+        handleEditorError,
+        closeSettings,
+        initialize
+    }
+}