{% extends "base.html" %}
{% import 'components/macros.html' as ui %}

{% block title %}Operational Memory Intelligence{% endblock %}
{% block head_extra %}
<meta name="csrf-token" content="{{ csrf_token() }}">
    
    <link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/hil-pages/operational_memory.css">
{% endblock %}
{% block content %}
<main class="page">
    <header class="topbar">
        <div>
            <h1>Operational Memory Intelligence</h1>
            <div class="muted">Long-term business learning for patterns, strategy memory, continuity history, adaptive recommendations, and operational evolution.</div>
        </div>
        <div class="actions">
            <a class="btn" href="/admin">Admin</a>
            <a class="btn" href="/enterprise/branches">Branch Command</a>
            <a class="btn" href="/organizational-governance">Governance</a>
            {% if can_manage %}
            <button class="primary" type="button" onclick="learnNow()">Learn Now</button>
            <button class="primary" type="button" onclick="regenerateReports()">Reports</button>
            {% endif %}
        </div>
    </header>

    <section class="grid">
        <div class="metric"><span>Maturity</span><strong>{{ snapshot.evolution.operational_maturity_score }}</strong></div>
        <div class="metric"><span>Stage</span><strong>{{ snapshot.evolution.stage|title }}</strong></div>
        <div class="metric"><span>Memory Depth</span><strong>{{ snapshot.evolution.memory_depth }}</strong></div>
        <div class="metric"><span>Patterns</span><strong>{{ snapshot.evolution.pattern_depth }}</strong></div>
        <div class="metric"><span>Open Improvements</span><strong>{{ snapshot.evolution.open_improvement_count }}</strong></div>
    </section>

    <div class="layout">
        <section>
            <div class="panel">
                <h2>Adaptive Recommendations</h2>
                <div class="stack">
                    {% for rec in snapshot.learning.recommendations %}
                        <div class="line">
                            <span><strong>{{ rec.title }}</strong><br><span class="muted">{{ rec.recommendation }}<br>Why: {{ rec.why }}</span></span>
                            <span class="pill {{ rec.priority }}">{{ rec.priority }}</span>
                        </div>
                    {% else %}
                        <div class="muted">No adaptive recommendations yet.</div>
                    {% endfor %}
                </div>
            </div>

            <div class="panel">
                <h2>Business Pattern Recognition</h2>
                <div class="table-wrap">
                    <table>
                        <thead><tr><th>Pattern</th><th>Title</th><th>Severity</th><th>Confidence</th><th>Last Seen</th></tr></thead>
                        <tbody>
                        {% for pattern in snapshot.patterns %}
                            <tr>
                                <td>{{ pattern.pattern_type }}</td>
                                <td>{{ pattern.title }}<br><span class="muted">{{ pattern.description }}</span></td>
                                <td><span class="pill {{ pattern.severity }}">{{ pattern.severity }}</span></td>
                                <td>{{ "%.2f"|format(pattern.confidence or 0) }}</td>
                                <td>{{ pattern.last_seen_at }}</td>
                            </tr>
                        {% else %}
                            <tr><td colspan="5">No recurring patterns detected yet.</td></tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="panel">
                <h2>Operational Memory Records</h2>
                <div class="table-wrap">
                    <table>
                        <thead><tr><th>Memory</th><th>Subject</th><th>Confidence</th><th>Seen</th><th>Summary</th></tr></thead>
                        <tbody>
                        {% for memory in snapshot.memories %}
                            <tr>
                                <td>{{ memory.memory_type }}<br><strong>{{ memory.title }}</strong></td>
                                <td>{{ memory.subject_type or "business" }} {{ memory.subject_id or "" }}</td>
                                <td>{{ "%.2f"|format(memory.confidence or 0) }}</td>
                                <td>{{ memory.occurrence_count }}</td>
                                <td>{{ memory.summary }}</td>
                            </tr>
                        {% else %}
                            <tr><td colspan="5">No memory records yet.</td></tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="panel">
                <h2>Autonomous Improvement Opportunities</h2>
                <div class="stack">
                    {% for item in snapshot.opportunities %}
                        <div class="line">
                            <span><strong>{{ item.title }}</strong><br><span class="muted">{{ item.recommendation }}<br>{{ item.expected_impact }}</span></span>
                            <span class="pill {{ item.priority }}">{{ item.priority }}</span>
                        </div>
                    {% else %}
                        <div class="muted">No open improvement opportunities.</div>
                    {% endfor %}
                </div>
            </div>
        </section>

        <aside>
            <div class="panel">
                <h2>Business Evolution Intelligence</h2>
                <div class="stack">
                    <div class="line"><span>Expansion readiness</span><strong>{{ snapshot.evolution.branch_expansion_readiness }}</strong></div>
                    <div class="line"><span>Inventory sophistication</span><strong>{{ snapshot.evolution.inventory_sophistication }}</strong></div>
                    <div class="line"><span>Workflow evolution</span><strong>{{ snapshot.evolution.workflow_evolution }}</strong></div>
                </div>
            </div>

            <div class="panel">
                <h2>Strategic Business Guidance</h2>
                <div class="stack">
                    {% for item in snapshot.guidance.long_term_direction %}
                        <div class="line"><span>{{ item }}</span></div>
                    {% endfor %}
                </div>
                <p class="muted">{{ snapshot.guidance.next_review }}</p>
            </div>

            <div class="panel">
                <h2>Strategic Operational Memory</h2>
                <div class="stack">
                    {% for strategy in snapshot.strategies[:8] %}
                        <div class="line">
                            <span><strong>{{ strategy.title }}</strong><br><span class="muted">{{ strategy.outcome }}</span></span>
                        </div>
                    {% else %}
                        <div class="muted">No strategic memories preserved yet.</div>
                    {% endfor %}
                </div>
            </div>

            <div class="panel">
                <h2>Continuity Memory</h2>
                <p class="muted">{{ snapshot.continuity_memory.purpose }}</p>
                <p class="muted">{{ snapshot.continuity_memory.principle }}</p>
            </div>

            <div class="panel">
                <h2>Human-Centered Adaptive Intelligence</h2>
                <p class="muted">{{ snapshot.human_centered_intelligence.promise }}</p>
                <p class="muted">{{ snapshot.human_centered_intelligence.stress_reduction }}</p>
                <p class="muted">{{ snapshot.human_centered_intelligence.trust_boundary }}</p>
            </div>
        </aside>
    </div>
</main>

<script>
async function postJson(url, payload) {
  const token = document.querySelector('meta[name="csrf-token"]')?.content || "";
  const res = await fetch(url, {method: "POST", headers: {"Content-Type": "application/json", "X-CSRF-Token": token}, body: JSON.stringify(payload || {})});
  const data = await res.json();
  if (!res.ok || data.error || data.ok === false) throw new Error(data.error || "Request failed");
  return data;
}
async function learnNow() {
  await postJson("/api/operational-memory/learn", {days: 90});
  location.reload();
}
async function regenerateReports() {
  const data = await postJson("/api/operational-memory/reports/regenerate", {});
  alert("Generated " + data.reports.length + " operational memory reports.");
}
</script>
{% endblock %}