Maciej Pienczyn
3307d99729
Some checks are pending
NordaBiz Tests / Unit & Integration Tests (push) Waiting to run
NordaBiz Tests / E2E Tests (Playwright) (push) Blocked by required conditions
NordaBiz Tests / Smoke Tests (Production) (push) Blocked by required conditions
NordaBiz Tests / Send Failure Notification (push) Blocked by required conditions
Instead of requiring users to click "Wygeneruj analize AI" every time, the audit pages now automatically fetch cached analysis on DOMContentLoaded. If cache exists, results render instantly; if not, the generate button remains. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
192 lines
7.6 KiB
HTML
192 lines
7.6 KiB
HTML
{#
|
|
Partial: AI Audit Actions Section
|
|
|
|
Variables required:
|
|
company - Company object (with .id, .slug)
|
|
audit_type - 'seo', 'gbp', or 'social'
|
|
|
|
Include this at the bottom of audit templates:
|
|
{% include 'partials/audit_ai_actions.html' %}
|
|
#}
|
|
|
|
<!-- AI Analysis & Actions Section -->
|
|
<div id="aiActionsSection" style="margin-top: var(--spacing-2xl);">
|
|
<h2 class="section-title" style="font-size: var(--font-size-xl); font-weight: 600; color: var(--text-primary); margin-bottom: var(--spacing-md); display: flex; align-items: center; gap: var(--spacing-sm);">
|
|
<svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/>
|
|
</svg>
|
|
Analiza AI i Rekomendacje
|
|
</h2>
|
|
|
|
<!-- Generate Analysis Button -->
|
|
<div id="aiAnalyzePrompt" style="background: var(--surface); padding: var(--spacing-xl); border-radius: var(--radius-lg); box-shadow: var(--shadow); text-align: center;">
|
|
<p style="color: var(--text-secondary); margin-bottom: var(--spacing-md);">
|
|
AI przeanalizuje wyniki audytu i zaproponuje priorytetowane akcje do podjecia.
|
|
</p>
|
|
<button class="btn btn-primary" onclick="runAIAnalysis()" id="aiAnalyzeBtn">
|
|
<svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/>
|
|
</svg>
|
|
Wygeneruj analize AI
|
|
</button>
|
|
</div>
|
|
|
|
<!-- AI Loading Spinner -->
|
|
<div id="aiLoading" style="display: none; background: var(--surface); padding: var(--spacing-xl); border-radius: var(--radius-lg); box-shadow: var(--shadow); text-align: center;">
|
|
<div style="width: 40px; height: 40px; border: 3px solid var(--border); border-top-color: var(--primary); border-radius: 50%; animation: spin 1s linear infinite; margin: 0 auto var(--spacing-md);"></div>
|
|
<p style="color: var(--text-secondary);">
|
|
Analiza AI w toku... (moze potrwac 15-30 sekund)
|
|
<span id="aiTimer" style="font-weight: 600;"></span>
|
|
</p>
|
|
</div>
|
|
|
|
<!-- AI Results Container -->
|
|
<div id="aiResults" style="display: none;">
|
|
<!-- Summary -->
|
|
<div id="aiSummary" style="background: linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%); padding: var(--spacing-lg); border-radius: var(--radius-lg); margin-bottom: var(--spacing-lg); border: 1px solid #bfdbfe;">
|
|
<div style="display: flex; align-items: flex-start; gap: var(--spacing-sm);">
|
|
<svg width="20" height="20" fill="none" stroke="#2563eb" viewBox="0 0 24 24" style="flex-shrink: 0; margin-top: 2px;">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
|
</svg>
|
|
<p id="aiSummaryText" style="color: var(--text-primary); line-height: 1.6; margin: 0;"></p>
|
|
</div>
|
|
<div id="aiCacheInfo" style="display: none; margin-top: var(--spacing-sm); font-size: var(--font-size-xs); color: var(--text-tertiary);">
|
|
Analiza z <span id="aiCacheDate"></span> — <a href="#" onclick="runAIAnalysis(true); return false;" style="color: var(--primary);">Wygeneruj ponownie</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Actions List -->
|
|
<div style="font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); margin-bottom: var(--spacing-md);">
|
|
Priorytetowe akcje
|
|
</div>
|
|
<div id="aiActionsList"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.ai-action-card {
|
|
background: var(--surface);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: var(--shadow-sm);
|
|
padding: var(--spacing-lg);
|
|
margin-bottom: var(--spacing-md);
|
|
border-left: 4px solid var(--border);
|
|
transition: box-shadow 0.2s;
|
|
}
|
|
.ai-action-card:hover {
|
|
box-shadow: var(--shadow);
|
|
}
|
|
.ai-action-card.priority-critical { border-left-color: #ef4444; }
|
|
.ai-action-card.priority-high { border-left-color: #f97316; }
|
|
.ai-action-card.priority-medium { border-left-color: #f59e0b; }
|
|
.ai-action-card.priority-low { border-left-color: #84cc16; }
|
|
|
|
.ai-priority-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
padding: 2px 8px;
|
|
border-radius: var(--radius-sm);
|
|
font-size: var(--font-size-xs);
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
.ai-priority-badge.critical { background: #fee2e2; color: #dc2626; }
|
|
.ai-priority-badge.high { background: #ffedd5; color: #ea580c; }
|
|
.ai-priority-badge.medium { background: #fef3c7; color: #d97706; }
|
|
.ai-priority-badge.low { background: #ecfccb; color: #65a30d; }
|
|
|
|
.ai-score-bar {
|
|
height: 6px;
|
|
border-radius: 3px;
|
|
background: #e2e8f0;
|
|
overflow: hidden;
|
|
}
|
|
.ai-score-bar-fill {
|
|
height: 100%;
|
|
border-radius: 3px;
|
|
transition: width 0.3s;
|
|
}
|
|
.ai-score-bar-fill.impact { background: #3b82f6; }
|
|
.ai-score-bar-fill.effort { background: #f59e0b; }
|
|
|
|
.ai-content-output {
|
|
background: #1e293b;
|
|
color: #e2e8f0;
|
|
padding: var(--spacing-md);
|
|
border-radius: var(--radius);
|
|
margin-top: var(--spacing-md);
|
|
font-family: 'Menlo', 'Monaco', 'Consolas', monospace;
|
|
font-size: var(--font-size-sm);
|
|
white-space: pre-wrap;
|
|
word-break: break-all;
|
|
position: relative;
|
|
max-height: 400px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.ai-copy-btn {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 8px;
|
|
background: rgba(255,255,255,0.1);
|
|
border: 1px solid rgba(255,255,255,0.2);
|
|
color: #e2e8f0;
|
|
padding: 4px 10px;
|
|
border-radius: var(--radius-sm);
|
|
font-size: var(--font-size-xs);
|
|
cursor: pointer;
|
|
transition: background 0.2s;
|
|
}
|
|
.ai-copy-btn:hover {
|
|
background: rgba(255,255,255,0.2);
|
|
}
|
|
|
|
.ai-action-buttons {
|
|
display: flex;
|
|
gap: var(--spacing-sm);
|
|
margin-top: var(--spacing-md);
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.ai-action-card.implemented {
|
|
opacity: 0.6;
|
|
border-left-color: #10b981;
|
|
}
|
|
.ai-action-card.implemented .ai-action-title {
|
|
text-decoration: line-through;
|
|
}
|
|
.ai-action-card.dismissed {
|
|
display: none;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
if (typeof companyId === 'undefined' || typeof auditType === 'undefined') return;
|
|
|
|
fetch('/api/audit/analyze', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRFToken': csrfToken
|
|
},
|
|
body: JSON.stringify({
|
|
company_id: companyId,
|
|
audit_type: auditType,
|
|
force: false
|
|
})
|
|
})
|
|
.then(function(r) { return r.json(); })
|
|
.then(function(data) {
|
|
if (data.success && data.cached) {
|
|
var prompt = document.getElementById('aiAnalyzePrompt');
|
|
if (prompt) prompt.style.display = 'none';
|
|
renderAIResults(data);
|
|
}
|
|
})
|
|
.catch(function() {});
|
|
});
|
|
</script>
|