| 90 | |
| 91 | // 创建设置面板 |
| 92 | createSettingsPanel() { |
| 93 | this.settingsPanel = document.createElement('div'); |
| 94 | this.settingsPanel.className = 'bella-settings-panel'; |
| 95 | this.settingsPanel.innerHTML = ` |
| 96 | <div class="bella-settings-header"> |
| 97 | <h4>聊天设置</h4> |
| 98 | <button class="bella-settings-close"> |
| 99 | <i class="fas fa-times"></i> |
| 100 | </button> |
| 101 | </div> |
| 102 | <div class="bella-settings-content"> |
| 103 | <div class="bella-setting-group"> |
| 104 | <label>AI服务提供商</label> |
| 105 | <select class="bella-provider-select"> |
| 106 | <option value="local">本地模型</option> |
| 107 | <option value="openai">OpenAI GPT</option> |
| 108 | <option value="qwen">通义千问</option> |
| 109 | <option value="ernie">文心一言</option> |
| 110 | <option value="glm">智谱AI</option> |
| 111 | </select> |
| 112 | </div> |
| 113 | <div class="bella-setting-group bella-api-key-group" style="display: none;"> |
| 114 | <label>API密钥</label> |
| 115 | <input type="password" class="bella-api-key-input" placeholder="请输入API密钥"> |
| 116 | <button class="bella-api-key-save">保存</button> |
| 117 | </div> |
| 118 | <div class="bella-setting-group"> |
| 119 | <label>聊天模式</label> |
| 120 | <select class="bella-mode-select"> |
| 121 | <option value="casual">轻松聊天</option> |
| 122 | <option value="assistant">智能助手</option> |
| 123 | <option value="creative">创意伙伴</option> |
| 124 | </select> |
| 125 | </div> |
| 126 | <div class="bella-setting-group"> |
| 127 | <button class="bella-clear-history">清除聊天记录</button> |
| 128 | </div> |
| 129 | </div> |
| 130 | `; |
| 131 | |
| 132 | document.body.appendChild(this.settingsPanel); |
| 133 | } |
| 134 | |
| 135 | // 绑定事件 |
| 136 | bindEvents() { |