File size: 3,505 Bytes
b66240d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 |
import apiClient from './apiClient.js';
class AIAdvisorView {
constructor(section) {
this.section = section;
this.queryForm = section?.querySelector('[data-query-form]');
this.sentimentForm = section?.querySelector('[data-sentiment-form]');
this.queryOutput = section?.querySelector('[data-query-output]');
this.sentimentOutput = section?.querySelector('[data-sentiment-output]');
}
init() {
if (this.queryForm) {
this.queryForm.addEventListener('submit', async (event) => {
event.preventDefault();
const formData = new FormData(this.queryForm);
await this.handleQuery(formData);
});
}
if (this.sentimentForm) {
this.sentimentForm.addEventListener('submit', async (event) => {
event.preventDefault();
const formData = new FormData(this.sentimentForm);
await this.handleSentiment(formData);
});
}
}
async handleQuery(formData) {
const query = formData.get('query') || '';
if (!query.trim()) return;
if (this.queryOutput) {
this.queryOutput.innerHTML = '<p>Processing query...</p>';
}
const result = await apiClient.runQuery({ query });
if (!result.ok) {
if (this.queryOutput) {
this.queryOutput.innerHTML = `<div class="inline-message inline-error">${result.error}</div>`;
}
return;
}
// Backend returns {success: true, type: ..., message: ..., data: ...}
const data = result.data || {};
if (this.queryOutput) {
this.queryOutput.innerHTML = `
<div class="glass-card">
<h4>AI Response</h4>
<p><strong>Type:</strong> ${data.type || 'general'}</p>
<p>${data.message || 'Query processed'}</p>
${data.data ? `<pre>${JSON.stringify(data.data, null, 2)}</pre>` : ''}
</div>
`;
}
}
async handleSentiment(formData) {
const text = formData.get('text') || '';
if (!text.trim()) return;
if (this.sentimentOutput) {
this.sentimentOutput.innerHTML = '<p>Analyzing sentiment...</p>';
}
const result = await apiClient.analyzeSentiment({ text });
if (!result.ok) {
if (this.sentimentOutput) {
this.sentimentOutput.innerHTML = `<div class="inline-message inline-error">${result.error}</div>`;
}
return;
}
// Backend returns {success: true, sentiment: ..., confidence: ..., details: ...}
const data = result.data || {};
const sentiment = data.sentiment || 'neutral';
const confidence = data.confidence || 0;
if (this.sentimentOutput) {
this.sentimentOutput.innerHTML = `
<div class="glass-card">
<h4>Sentiment Analysis</h4>
<p><strong>Label:</strong> <span class="chip">${sentiment}</span></p>
<p><strong>Confidence:</strong> ${(confidence * 100).toFixed(1)}%</p>
${data.details ? `<pre style="font-size: 0.875rem;">${JSON.stringify(data.details, null, 2)}</pre>` : ''}
</div>
`;
}
}
}
export default AIAdvisorView;
|