feat: Vorschläge für Folgesuchen hinzufügen

- CSS-Stile für vorgeschlagene Suchschaltflächen hinzugefügt
- HTML-Container für die Anzeige vorgeschlagener Suchen hinzugefügt
- Logik zur Darstellung und Interaktion mit vorgeschlagenen Suchen implementiert
- OpenRouter-Prompt um Hinweis auf Folgesuchen erweitert
- JSON-Schema um Feld 'suggestedSearches' ergänzt
This commit is contained in:
sebseb7
2026-04-05 00:37:51 +02:00
parent d2920fd39a
commit 5f26029cfe
2 changed files with 50 additions and 6 deletions

View File

@@ -289,6 +289,29 @@
text-decoration: underline;
}
.suggested-searches {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.suggested-search-btn {
padding: 8px 16px;
background: #f0f0f0;
border: 1px solid #ddd;
border-radius: 20px;
cursor: pointer;
font-size: 0.9rem;
transition: all 0.2s;
color: #333;
}
.suggested-search-btn:hover {
background: #667eea;
color: white;
border-color: #667eea;
}
/* Cost Breakdown Styles */
.cost-breakdown-details {
margin-top: 10px;
@@ -556,6 +579,11 @@
<ul class="sources" id="sources"></ul>
</div>
<div class="result-section">
<h2>💡 Suggested Follow-up Searches</h2>
<div class="suggested-searches" id="suggestedSearches"></div>
</div>
<!-- Cost Breakdown Section -->
<div class="result-section">
<details class="cost-breakdown-details" id="costBreakdownDetails">
@@ -607,6 +635,7 @@
const results = document.getElementById('results');
const answerEl = document.getElementById('answer');
const sourcesEl = document.getElementById('sources');
const suggestedSearchesEl = document.getElementById('suggestedSearches');
const errorEl = document.getElementById('error');
const logContainer = document.getElementById('logContainer');
const statusDot = document.getElementById('statusDot');
@@ -893,6 +922,23 @@
sourcesEl.appendChild(li);
}
// Display suggested searches
suggestedSearchesEl.innerHTML = '';
if (data.suggestedSearches && data.suggestedSearches.length > 0) {
data.suggestedSearches.forEach(search => {
const btn = document.createElement('button');
btn.className = 'suggested-search-btn';
btn.textContent = search;
btn.addEventListener('click', () => {
questionInput.value = search;
performSearch();
});
suggestedSearchesEl.appendChild(btn);
});
} else {
suggestedSearchesEl.innerHTML = '<p style="color: #999;">No suggested searches available</p>';
}
// Display cost breakdown
const costTableBody = document.getElementById('costTableBody');
costTableBody.innerHTML = '';

View File

@@ -162,7 +162,7 @@ export async function summarizeFinalAnswer({ openrouter, text, question }) {
You are a search result analyst. Today is the date of ${new Date().toLocaleDateString()}.
Based on the following search results for the query "${question}",
Summarize the search results to answer the original query. Use Emoji and HTML. Tags allowed: <b>, <i>, <u>, <pre>, <ul>, <li>, <span style="color:...">, <p> <div> <hr/>
Also provide the most relevant sources. Answer in the language of the question.
Also provide the most relevant sources. Answer in the language of the question. You may suggest followup searched to the user.
`;
const params = {
@@ -179,13 +179,11 @@ export async function summarizeFinalAnswer({ openrouter, text, question }) {
strict: true,
schema: {
type: 'object',
required: ['fullAnswerHTMLSnippet', 'mostRelevantSources'],
required: ['fullAnswerHTMLSnippet', 'mostRelevantSources', 'suggestedSearches'],
properties: {
fullAnswerHTMLSnippet: { type: 'string' },
mostRelevantSources: {
type: 'array',
items: { type: 'string' },
},
mostRelevantSources: { type: 'array', items: { type: 'string' } },
suggestedSearches: { type: 'array', items: { type: 'string' } },
},
},
},