添加供应商编辑功能和密码显示切换
- 为供应商列表添加启用和编辑按钮 - 创建EditProviderModal组件支持编辑供应商信息 - 实现updateProvider API接口 - 为API Key输入框添加密码显示/隐藏功能,使用SVG图标 - 更新预设供应商配置为YesCode和PackyCode - 移除model字段,简化供应商配置
This commit is contained in:
@@ -11,9 +11,9 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({ onAdd, onClose }) =
|
||||
const [formData, setFormData] = useState({
|
||||
name: '',
|
||||
apiUrl: '',
|
||||
apiKey: '',
|
||||
model: 'claude-3-opus-20240229'
|
||||
apiKey: ''
|
||||
})
|
||||
const [showPassword, setShowPassword] = useState(false)
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
@@ -36,14 +36,12 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({ onAdd, onClose }) =
|
||||
// 预设的供应商配置
|
||||
const presets = [
|
||||
{
|
||||
name: '官方 Anthropic',
|
||||
apiUrl: 'https://api.anthropic.com',
|
||||
model: 'claude-3-opus-20240229'
|
||||
name: 'YesCode',
|
||||
apiUrl: 'https://co.yes.vg'
|
||||
},
|
||||
{
|
||||
name: 'OpenRouter',
|
||||
apiUrl: 'https://openrouter.ai/api/v1',
|
||||
model: 'anthropic/claude-3-opus'
|
||||
name: 'PackyCode',
|
||||
apiUrl: 'https://api.packycode.com'
|
||||
}
|
||||
]
|
||||
|
||||
@@ -51,8 +49,7 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({ onAdd, onClose }) =
|
||||
setFormData({
|
||||
...formData,
|
||||
name: preset.name,
|
||||
apiUrl: preset.apiUrl,
|
||||
model: preset.model
|
||||
apiUrl: preset.apiUrl
|
||||
})
|
||||
}
|
||||
|
||||
@@ -106,27 +103,36 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({ onAdd, onClose }) =
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="apiKey">API Key *</label>
|
||||
<input
|
||||
type="password"
|
||||
id="apiKey"
|
||||
name="apiKey"
|
||||
value={formData.apiKey}
|
||||
onChange={handleChange}
|
||||
placeholder="sk-ant-..."
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="model">模型名称</label>
|
||||
<input
|
||||
type="text"
|
||||
id="model"
|
||||
name="model"
|
||||
value={formData.model}
|
||||
onChange={handleChange}
|
||||
placeholder="claude-3-opus-20240229"
|
||||
/>
|
||||
<div className="password-input-wrapper">
|
||||
<input
|
||||
type={showPassword ? "text" : "password"}
|
||||
id="apiKey"
|
||||
name="apiKey"
|
||||
value={formData.apiKey}
|
||||
onChange={handleChange}
|
||||
placeholder={formData.name === 'YesCode' ? 'cr_...' : 'sk-...'}
|
||||
required
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
className="password-toggle"
|
||||
onClick={() => setShowPassword(!showPassword)}
|
||||
tabIndex={-1}
|
||||
title={showPassword ? "隐藏密码" : "显示密码"}
|
||||
>
|
||||
{showPassword ? (
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor">
|
||||
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" />
|
||||
<circle cx="12" cy="12" r="3" />
|
||||
</svg>
|
||||
) : (
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor">
|
||||
<path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" />
|
||||
<line x1="1" y1="1" x2="23" y2="23" />
|
||||
</svg>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="form-actions">
|
||||
|
||||
Reference in New Issue
Block a user