pi-farm/PiDoBot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

templates/index.html aktualisiert

Browse Source
This commit is contained in:
info@pi-farm.de
2026-03-05 17:05:09 +00:00
parent b325dfa516
commit d837909136
1 changed files with 48 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
templates/index.html
View File

@@ -81,14 +81,26 @@
font-size: 1.2em; font-size: 1.2em;
} }
/* Schriftfarbe und Hintergrund für Dropdowns und Eingabefelder korrigieren */
.toolbar-controls select, .toolbar-controls select,
.toolbar-controls input, .toolbar-controls input,
.toolbar-controls button { .toolbar-controls button {
padding: 5px 10px; padding: 5px 10px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #bdc3c7; border: 1px solid #bdc3c7;
color: #333; /* Dunkle Schrift erzwingen */ color: #2c3e50; /* Dunkle Schriftfarbe! */
background-color: #fff; /* Weißen Hintergrund erzwingen */ background-color: white; /* Weißer Grund! */
font-size: 14px;
}
/* Der Container für die URL (standardmäßig versteckt) */
#ollama-url-container {
display: none;
align-items: center;
gap: 10px;
margin-left: 10px;
border-left: 1px solid #7f8c8d;
padding-left: 10px;
} }
/* WICHTIG: Den Speichern-Button überschreiben wir wieder, damit er grün mit weißer Schrift bleibt */ /* WICHTIG: Den Speichern-Button überschreiben wir wieder, damit er grün mit weißer Schrift bleibt */
@@ -125,27 +137,27 @@
</head> </head>
<body class="bg-slate-950 text-white overflow-hidden"> <body class="bg-slate-950 text-white overflow-hidden">
<div class="top-toolbar"> <div class="top-toolbar">
<div class="toolbar-title">🤖 KI-Orchestrator</div> <div class="toolbar-title">🤖 KI-Orchestrator</div>
<div class="toolbar-controls"> <div class="toolbar-controls">
<label for="ai-provider">Provider:</label> <label for="ai-provider">Provider:</label>
<select id="ai-provider" onchange="updateModelDropdown()"> <select id="ai-provider" onchange="updateModelDropdown(false)">
<option value="google">Google Gemini</option> <option value="google">Google Gemini</option>
<option value="openai">OpenAI</option> <option value="openai">OpenAI</option>
<option value="ollama">Ollama (Lokal)</option> <option value="ollama">Ollama (Lokal)</option>
</select>
<label for="ai-model">Modell:</label>
<select id="ai-model">
</select> </select>
<span id="ollama-url-container" style="display: none; align-items: center; gap: 5px; margin-left: 10px;"> <label for="ai-model">Modell:</label>
<label for="ollama-url">URL:</label> <select id="ai-model"></select>
<input type="text" id="ollama-url" placeholder="http://127.0.0.1:11434/v1" style="width: 200px;">
</span>
<button class="save-btn" onclick="saveSettings()">Speichern</button> <div id="ollama-url-container">
<span id="settings-status"></span> <label for="ollama-url">API-URL:</label>
<input type="text" id="ollama-url" placeholder="http://IP:11434/v1">
</div>
<button class="save-btn" onclick="saveSettings()">Speichern</button>
<span id="settings-status"></span>
</div>
</div> </div>
</div> </div>
<div class="flex h-screen"> <div class="flex h-screen">
@@ -376,8 +388,7 @@
currentSettings = await res.json(); currentSettings = await res.json();
document.getElementById('ai-provider').value = currentSettings.provider; document.getElementById('ai-provider').value = currentSettings.provider;
// NEU: Ollama URL laden document.getElementById('ollama-url').value = currentSettings.ollama_base_url || "http://127.0.0.1:11434/v1";
document.getElementById('ollama-url').value = currentSettings.ollama_url || "http://127.0.0.1:11434/v1";
updateModelDropdown(true); updateModelDropdown(true);
} catch (e) { } catch (e) {
@@ -388,37 +399,32 @@
function updateModelDropdown(isInitialLoad = false) { function updateModelDropdown(isInitialLoad = false) {
const provider = document.getElementById('ai-provider').value; const provider = document.getElementById('ai-provider').value;
const modelSelect = document.getElementById('ai-model'); const modelSelect = document.getElementById('ai-model');
const ollamaContainer = document.getElementById('ollama-url-container'); // NEU const urlContainer = document.getElementById('ollama-url-container');
// NEU: URL-Feld nur anzeigen, wenn Ollama gewählt ist
if (provider === 'ollama') {
ollamaContainer.style.display = 'flex';
} else {
ollamaContainer.style.display = 'none';
}
// Dropdown leeren und neu befüllen
modelSelect.innerHTML = ''; modelSelect.innerHTML = '';
modelOptions[provider].forEach(m => {
const opt = document.createElement('option');
opt.value = m;
opt.textContent = m;
modelSelect.appendChild(opt);
});
// Modelle des gewählten Providers einfügen // Zeige das URL-Feld NUR bei Ollama an
if(modelOptions[provider]) { if (provider === "ollama") {
modelOptions[provider].forEach(m => { urlContainer.style.display = "flex";
const opt = document.createElement('option'); } else {
opt.value = m; urlContainer.style.display = "none";
opt.textContent = m;
modelSelect.appendChild(opt);
});
} }
if (isInitialLoad) { if (isInitialLoad) {
const savedModel = currentSettings[`${provider}_model`]; const savedModel = currentSettings[`${provider}_model`];
if (savedModel && !modelOptions[provider].includes(savedModel)) { if (savedModel && !modelOptions[provider].includes(savedModel)) {
const opt = document.createElement('option'); const opt = document.createElement('option');
opt.value = savedModel; opt.value = savedModel;
opt.textContent = savedModel; opt.textContent = savedModel;
modelSelect.appendChild(opt); modelSelect.appendChild(opt);
} }
if (savedModel) modelSelect.value = savedModel; if (savedModel) modelSelect.value = savedModel;
} }
} }
@@ -457,7 +463,6 @@
setTimeout(() => statusEl.textContent = "", 3000); setTimeout(() => statusEl.textContent = "", 3000);
} }
// Einstellungen beim Laden der Seite abrufen // Einstellungen beim Laden der Seite abrufen
window.addEventListener('DOMContentLoaded', loadSettings); window.addEventListener('DOMContentLoaded', loadSettings);
}); });