Files
metona-ollama-desktop/js/components/model-bar.js
T
thzxx 38edaee0f0 refactor: 模块化架构重构
将单文件巨型 IIFE (1608行) 拆分为 14 个 ES Module:

核心层:
- js/state.js          - 轻量级响应式状态管理 (发布-订阅)
- js/utils.js          - 通用工具函数
- js/sanitizer.js      - HTML XSS 净化器
- js/marked-config.js  - Markdown 渲染器配置

组件层:
- js/components/chat-area.js      - 消息渲染/流式更新/导出
- js/components/input-area.js     - 文本输入/图片上传/发送
- js/components/history-modal.js  - 历史记录面板/搜索/分页
- js/components/settings-modal.js - 设置面板/数据管理
- js/components/header.js         - 顶部导航/连接状态
- js/components/model-bar.js      - 模型选择栏
- js/components/toast.js          - Toast 通知
- js/components/lightbox.js       - 图片预览

入口层:
- js/app.js            - 主入口/初始化协调

index.html: 1608行 → 204行纯模板
2026-04-03 11:34:24 +08:00

79 lines
2.0 KiB
JavaScript

/**
* ModelBar - 模型选择栏组件
*/
import { state, KEYS } from '../state.js';
import { formatSize } from '../utils.js';
import { showToast } from './toast.js';
let modelSelectEl, toggleThinkEl;
export function initModelBar() {
modelSelectEl = document.querySelector('#modelSelect');
toggleThinkEl = document.querySelector('#toggleThink');
// 模型选择变化 → 保存到设置
modelSelectEl.addEventListener('change', async () => {
const db = state.get(KEYS.DB);
if (db) await db.saveSetting('selectedModel', modelSelectEl.value);
});
}
/**
* 加载模型列表
*/
export async function loadModels() {
const api = state.get(KEYS.API);
const db = state.get(KEYS.DB);
const currentSession = state.get(KEYS.CURRENT_SESSION);
if (!api) return;
try {
const data = await api.listModels();
modelSelectEl.innerHTML = '';
if (!data.models || data.models.length === 0) {
modelSelectEl.innerHTML = '<option value="">未安装任何模型</option>';
return;
}
data.models.forEach(m => {
const opt = document.createElement('option');
opt.value = m.name;
opt.textContent = `${m.name} (${formatSize(m.size)})`;
modelSelectEl.appendChild(opt);
});
// 恢复上次选择的模型
if (currentSession && currentSession.model) {
modelSelectEl.value = currentSession.model;
}
if (db) await db.saveSetting('selectedModel', modelSelectEl.value);
} catch (err) {
console.error('[ModelBar] 加载模型失败:', err);
modelSelectEl.innerHTML = '<option value="">加载失败 - 检查连接</option>';
}
}
/**
* 获取当前选择的模型
*/
export function getSelectedModel() {
return modelSelectEl.value;
}
/**
* 设置选中的模型
*/
export function setSelectedModel(modelName) {
modelSelectEl.value = modelName;
}
/**
* Think 模式是否开启
*/
export function isThinkEnabled() {
return toggleThinkEl.checked;
}