添加配置文件浏览选择功能

- 在主进程添加文件选择对话框,支持选择 settings.json 配置文件
- 更新类型定义和预加载脚本,添加 selectConfigFile API
- 在界面底部配置路径区域添加"浏览"按钮
- 优化样式布局,使配置路径和浏览按钮水平排列
- 修复 React 导入警告,移除未使用的 React 导入
This commit is contained in:
farion1231
2025-08-05 20:30:18 +08:00
parent c74069ba57
commit 3df40def1e
5 changed files with 59 additions and 4 deletions

View File

@@ -1,4 +1,4 @@
import { app, BrowserWindow, ipcMain } from 'electron'
import { app, BrowserWindow, ipcMain, dialog } from 'electron'
import path from 'path'
import Store from 'electron-store'
import { Provider, AppConfig } from '../shared/types'
@@ -99,3 +99,23 @@ ipcMain.handle('switchProvider', async (_, providerId: string) => {
ipcMain.handle('getClaudeCodeConfigPath', () => {
return getClaudeCodeConfig().path
})
ipcMain.handle('selectConfigFile', async () => {
if (!mainWindow) return null
const result = await dialog.showOpenDialog(mainWindow, {
properties: ['openFile'],
title: '选择 Claude Code 配置文件',
filters: [
{ name: 'JSON 文件', extensions: ['json'] },
{ name: '所有文件', extensions: ['*'] }
],
defaultPath: 'settings.json'
})
if (result.canceled || result.filePaths.length === 0) {
return null
}
return result.filePaths[0]
})

View File

@@ -9,5 +9,6 @@ contextBridge.exposeInMainWorld('electronAPI', {
updateProvider: (provider: Provider) => ipcRenderer.invoke('updateProvider', provider),
checkStatus: (provider: Provider) => ipcRenderer.invoke('checkStatus', provider),
switchProvider: (providerId: string) => ipcRenderer.invoke('switchProvider', providerId),
getClaudeCodeConfigPath: () => ipcRenderer.invoke('getClaudeCodeConfigPath')
getClaudeCodeConfigPath: () => ipcRenderer.invoke('getClaudeCodeConfigPath'),
selectConfigFile: () => ipcRenderer.invoke('selectConfigFile')
})

View File

@@ -69,4 +69,23 @@
border-radius: 4px;
font-size: 0.9rem;
color: #7f8c8d;
display: flex;
justify-content: space-between;
align-items: center;
}
.browse-btn {
padding: 0.5rem 1rem;
border: none;
border-radius: 4px;
background: #3498db;
color: white;
cursor: pointer;
font-size: 0.9rem;
transition: all 0.2s;
margin-left: 1rem;
}
.browse-btn:hover {
background: #2980b9;
}

View File

@@ -1,4 +1,4 @@
import React, { useState, useEffect } from 'react'
import { useState, useEffect } from 'react'
import { Provider, ProviderStatus } from '../shared/types'
import ProviderList from './components/ProviderList'
import AddProviderModal from './components/AddProviderModal'
@@ -99,6 +99,13 @@ function App() {
}
}
const handleSelectConfigFile = async () => {
const selectedPath = await window.electronAPI.selectConfigFile()
if (selectedPath) {
setConfigPath(selectedPath)
}
}
return (
<div className="app">
<header className="app-header">
@@ -133,7 +140,14 @@ function App() {
{configPath && (
<div className="config-path">
: {configPath}
<span>: {configPath}</span>
<button
className="browse-btn"
onClick={handleSelectConfigFile}
title="浏览选择配置文件"
>
</button>
</div>
)}
</main>

View File

@@ -29,6 +29,7 @@ declare global {
checkStatus: (provider: Provider) => Promise<ProviderStatus>
switchProvider: (providerId: string) => Promise<boolean>
getClaudeCodeConfigPath: () => Promise<string>
selectConfigFile: () => Promise<string | null>
}
}
}