{% extends 'base.html' %}
{% block title %}Révision — Admin OpenCare{% endblock %}

{% block content %}
<div class="admin-layout">
  {% include 'admin/_sidebar.html' %}

  <div class="admin-main">
    <div class="admin-page-header">
      <div>
        <h1 class="admin-page-title">
          <i class="fas fa-inbox me-2 text-accent"></i>File de révision
        </h1>
        <p class="text-muted mb-0">Validez les recommandations extraites par l'IA avant publication</p>
      </div>
    </div>

    <!-- Status filter tabs -->
    <ul class="nav nav-pills mb-4 gap-1">
      <li class="nav-item">
        <a class="nav-link {% if status_filter == 'pending' %}active{% endif %}"
           href="{{ url_for('admin_review', status='pending') }}">
          En attente <span class="badge bg-warning text-dark ms-1">{{ counts.pending }}</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link {% if status_filter == 'approved' %}active{% endif %}"
           href="{{ url_for('admin_review', status='approved') }}">
          Approuvées <span class="badge bg-success ms-1">{{ counts.approved }}</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link {% if status_filter == 'rejected' %}active{% endif %}"
           href="{{ url_for('admin_review', status='rejected') }}">
          Rejetées <span class="badge bg-secondary ms-1">{{ counts.rejected }}</span>
        </a>
      </li>
    </ul>

    {% if recs %}
    <div class="d-flex flex-column gap-3">
      {% for rec in recs %}
      <div class="card border-0 shadow-sm rounded-3 review-card">
        <div class="card-body p-4">
          <div class="d-flex align-items-start gap-3 flex-wrap">
            <!-- Left: content -->
            <div class="flex-grow-1">
              <div class="d-flex align-items-center gap-2 mb-2 flex-wrap">
                <span class="badge admin-domain-badge">
                  {{ domain_labels.get(rec.domain, (rec.domain, ''))[0] }}
                </span>
                <span class="evidence-badge ev-{{ rec.evidence_level }}">Niveau {{ rec.evidence_level }}</span>
                {% if rec.study_type %}
                <span class="badge bg-light text-muted border">{{ rec.study_type }}</span>
                {% endif %}
                <span class="text-muted small ms-auto">{{ rec.created_at.strftime('%d/%m/%Y') }}</span>
              </div>

              <h5 class="fw-bold mb-1">{{ rec.title }}</h5>
              <p class="text-muted mb-2">{{ rec.summary }}</p>

              {% if rec.details %}
              <p class="small mb-2 text-secondary">{{ rec.details[:200] }}{% if rec.details|length > 200 %}…{% endif %}</p>
              {% endif %}

              <!-- Source -->
              {% if rec.source_url or rec.source_title %}
              <div class="source-box mb-2 small">
                <i class="fas fa-book me-1"></i>
                {% if rec.source_title %}<strong>{{ rec.source_title }}</strong>{% endif %}
                {% if rec.source_doi %} — DOI: {{ rec.source_doi }}{% endif %}
                {% if rec.source_url %}
                <a href="{{ rec.source_url }}" target="_blank" rel="noopener" class="ms-1">
                  <i class="fas fa-external-link-alt"></i>
                </a>
                {% endif %}
              </div>
              {% endif %}

              <!-- Targeting summary -->
              <div class="d-flex flex-wrap gap-1 mt-2">
                {% if rec.target_age_min or rec.target_age_max %}
                <span class="tag-pill">
                  <i class="fas fa-user me-1"></i>
                  {{ rec.target_age_min or '?' }}–{{ rec.target_age_max or '∞' }} ans
                </span>
                {% endif %}
                {% if rec.target_sex and rec.target_sex != 'all' %}
                <span class="tag-pill">{{ 'Homme' if rec.target_sex == 'male' else 'Femme' }}</span>
                {% endif %}
                {% if rec.not_for_under_18 %}
                <span class="tag-pill tag-pill-warn">18+</span>
                {% endif %}
                {% if rec.not_for_pregnant %}
                <span class="tag-pill tag-pill-warn">Pas pour grossesse</span>
                {% endif %}
                {% for c in rec.required_conditions %}
                <span class="tag-pill tag-pill-blue">Si: {{ c }}</span>
                {% endfor %}
                {% for c in rec.excluded_conditions %}
                <span class="tag-pill tag-pill-red">Exclu si: {{ c }}</span>
                {% endfor %}
                {% for g in rec.required_health_goals %}
                <span class="tag-pill tag-pill-green">Objectif: {{ g }}</span>
                {% endfor %}
              </div>
            </div>

            <!-- Right: action buttons -->
            <div class="d-flex flex-column gap-2" style="min-width:140px">
              {% if status_filter == 'pending' %}
              <button type="button" class="btn btn-primary btn-sm"
                onclick="openEditModal({{ rec.to_edit_dict()|tojson }})">
                <i class="fas fa-edit me-1"></i>Modifier
              </button>
              <form action="{{ url_for('admin_review_approve', rid=rec.id) }}" method="post">
                <button type="submit" class="btn btn-success btn-sm w-100">
                  <i class="fas fa-check me-1"></i>Approuver
                </button>
              </form>
              <button type="button" class="btn btn-outline-danger btn-sm"
                data-reject-id="{{ rec.id }}"
                data-reject-title="{{ rec.title | e }}"
                onclick="openRejectModal(this.dataset.rejectId, this.dataset.rejectTitle)">
                <i class="fas fa-times me-1"></i>Rejeter
              </button>
              {% elif status_filter == 'approved' %}
              <button type="button" class="btn btn-outline-primary btn-sm"
                onclick="openEditModal({{ rec.to_edit_dict()|tojson }})">
                <i class="fas fa-edit me-1"></i>Modifier
              </button>
              {% endif %}
              {% if rec.admin_notes %}
              <div class="admin-note small text-muted mt-1">
                <i class="fas fa-sticky-note me-1"></i>{{ rec.admin_notes }}
              </div>
              {% endif %}
            </div>
          </div>
        </div>
      </div>
      {% endfor %}
    </div>
    {% else %}
    <div class="text-center py-5 text-muted">
      <i class="fas fa-inbox fa-3x mb-3 opacity-25"></i>
      <p class="mb-0">
        {% if status_filter == 'pending' %}
          Aucune recommandation en attente. Lancez un crawl pour en générer.
        {% elif status_filter == 'approved' %}
          Aucune recommandation approuvée.
        {% else %}
          Aucune recommandation rejetée.
        {% endif %}
      </p>
    </div>
    {% endif %}
  </div>
</div>

<!-- ── Edit Modal ───────────────────────────────────────────────────────────── -->
<div class="modal fade" id="editModal" tabindex="-1">
  <div class="modal-dialog modal-xl modal-dialog-scrollable">
    <div class="modal-content">
      <div class="modal-header border-0 pb-0">
        <h5 class="modal-title fw-bold">
          <i class="fas fa-edit me-2 text-accent"></i>Modifier la recommandation
        </h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <form id="editForm" method="post">
        <div class="modal-body px-4">
          <div class="row g-3">
            <!-- Domain & Evidence -->
            <div class="col-md-4">
              <label class="form-label fw-medium">Domaine</label>
              <select name="domain" id="edit_domain" class="form-select">
                {% for key, (label, icon) in domain_labels.items() %}
                <option value="{{ key }}">{{ icon }} {{ label }}</option>
                {% endfor %}
              </select>
            </div>
            <div class="col-md-4">
              <label class="form-label fw-medium">Niveau de preuve</label>
              <select name="evidence_level" id="edit_evidence_level" class="form-select">
                <option value="A">A — Méta-analyse / RCT solide</option>
                <option value="B">B — Observationnel / RCT limité</option>
                <option value="C">C — Expert / Anecdote</option>
              </select>
            </div>
            <div class="col-md-4">
              <label class="form-label fw-medium">Type d'étude</label>
              <select name="study_type" id="edit_study_type" class="form-select">
                <option value="meta-analysis">Méta-analyse</option>
                <option value="RCT">RCT</option>
                <option value="observational">Observationnel</option>
                <option value="expert_opinion">Avis expert</option>
                <option value="anecdote">Anecdote</option>
              </select>
            </div>

            <!-- Title -->
            <div class="col-12">
              <label class="form-label fw-medium">Titre</label>
              <input type="text" name="title" id="edit_title" class="form-control" maxlength="256" required>
            </div>

            <!-- Summary -->
            <div class="col-12">
              <label class="form-label fw-medium">Résumé</label>
              <textarea name="summary" id="edit_summary" class="form-control" rows="2"></textarea>
            </div>

            <!-- Details -->
            <div class="col-12">
              <label class="form-label fw-medium">Détails</label>
              <textarea name="details" id="edit_details" class="form-control" rows="3"></textarea>
            </div>

            <!-- Intervention / Effect -->
            <div class="col-md-6">
              <label class="form-label fw-medium">Intervention concrète</label>
              <input type="text" name="intervention" id="edit_intervention" class="form-control">
            </div>
            <div class="col-md-6">
              <label class="form-label fw-medium">Effet attendu</label>
              <input type="text" name="effect" id="edit_effect" class="form-control">
            </div>

            <!-- Source -->
            <div class="col-md-6">
              <label class="form-label fw-medium">Titre de la source</label>
              <input type="text" name="source_title" id="edit_source_title" class="form-control">
            </div>
            <div class="col-md-3">
              <label class="form-label fw-medium">DOI</label>
              <input type="text" name="source_doi" id="edit_source_doi" class="form-control" placeholder="10.xxx/...">
            </div>
            <div class="col-md-3">
              <label class="form-label fw-medium">Priorité (1–10)</label>
              <input type="number" name="priority" id="edit_priority" class="form-control" min="1" max="10">
            </div>
            <div class="col-12">
              <label class="form-label fw-medium">URL source</label>
              <input type="url" name="source_url" id="edit_source_url" class="form-control">
            </div>

            <div class="col-12"><hr class="my-1"></div>

            <!-- Targeting -->
            <div class="col-md-3">
              <label class="form-label fw-medium">Sexe cible</label>
              <select name="target_sex" id="edit_target_sex" class="form-select">
                <option value="all">Tous</option>
                <option value="male">Hommes</option>
                <option value="female">Femmes</option>
              </select>
            </div>
            <div class="col-md-2">
              <label class="form-label fw-medium">Âge min</label>
              <input type="number" name="target_age_min" id="edit_target_age_min" class="form-control" placeholder="—">
            </div>
            <div class="col-md-2">
              <label class="form-label fw-medium">Âge max</label>
              <input type="number" name="target_age_max" id="edit_target_age_max" class="form-control" placeholder="—">
            </div>
            <div class="col-md-5 d-flex align-items-end gap-3 pb-1">
              <div class="form-check">
                <input class="form-check-input" type="checkbox" name="not_for_under_18" id="edit_under18">
                <label class="form-check-label" for="edit_under18">Déconseillé -18 ans</label>
              </div>
              <div class="form-check">
                <input class="form-check-input" type="checkbox" name="not_for_pregnant" id="edit_pregnant">
                <label class="form-check-label" for="edit_pregnant">Déconseillé grossesse</label>
              </div>
            </div>

            <!-- Conditions -->
            <div class="col-md-6">
              <label class="form-label fw-medium">Déclenché si l'utilisateur a une de ces conditions</label>
              <div class="d-flex flex-wrap gap-1" id="edit_required_conditions">
                {% for c in ['hypertension','diabetes_risk','cardiovascular_risk','anxiety','digestive_issues','back_pain','osteoporosis_risk','metabolic_syndrome','thyroid','sleep_apnea'] %}
                <label class="admin-check-pill">
                  <input type="checkbox" name="required_conditions" value="{{ c }}"> {{ c.replace('_', ' ') }}
                </label>
                {% endfor %}
              </div>
            </div>
            <div class="col-md-6">
              <label class="form-label fw-medium">Ne pas afficher si l'utilisateur a</label>
              <div class="d-flex flex-wrap gap-1" id="edit_excluded_conditions">
                {% for c in ['hypertension','diabetes_risk','cardiovascular_risk','anxiety','digestive_issues','back_pain','osteoporosis_risk','metabolic_syndrome','thyroid','sleep_apnea'] %}
                <label class="admin-check-pill">
                  <input type="checkbox" name="excluded_conditions" value="{{ c }}"> {{ c.replace('_', ' ') }}
                </label>
                {% endfor %}
              </div>
            </div>

            <!-- Goals -->
            <div class="col-md-6">
              <label class="form-label fw-medium">Objectifs de santé associés</label>
              <div class="d-flex flex-wrap gap-1">
                {% for g in ['weight_loss','muscle_gain','longevity','energy','better_sleep','stress_reduction','metabolic_health','cardiovascular_health','cognitive_health'] %}
                <label class="admin-check-pill">
                  <input type="checkbox" name="required_health_goals" value="{{ g }}" class="edit_goals"> {{ g.replace('_', ' ') }}
                </label>
                {% endfor %}
              </div>
            </div>

            <!-- Diet & Activity -->
            <div class="col-md-3">
              <label class="form-label fw-medium">Types de régime ciblés</label>
              <div class="d-flex flex-wrap gap-1">
                {% for d in ['omnivore','flexitarian','vegetarian','vegan','paleo','keto','other'] %}
                <label class="admin-check-pill">
                  <input type="checkbox" name="required_diet_types" value="{{ d }}" class="edit_diets"> {{ d }}
                </label>
                {% endfor %}
              </div>
            </div>
            <div class="col-md-3">
              <label class="form-label fw-medium">Niveaux d'activité ciblés</label>
              <div class="d-flex flex-wrap gap-1">
                {% for a in ['sedentary','light','moderate','intense','athlete'] %}
                <label class="admin-check-pill">
                  <input type="checkbox" name="required_activity_levels" value="{{ a }}" class="edit_activity"> {{ a }}
                </label>
                {% endfor %}
              </div>
            </div>

            <!-- Notes -->
            <div class="col-12">
              <label class="form-label fw-medium">Notes admin (privées)</label>
              <input type="text" name="admin_notes" id="edit_admin_notes" class="form-control" placeholder="Remarques internes…">
            </div>
          </div>
        </div>

        <div class="modal-footer border-0 pt-0 gap-2">
          <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Annuler</button>
          <button type="submit" name="action" value="save" class="btn btn-outline-primary">
            <i class="fas fa-save me-1"></i>Enregistrer
          </button>
          <button type="submit" name="action" value="approve" class="btn btn-success">
            <i class="fas fa-check me-1"></i>Enregistrer & Approuver
          </button>
        </div>
      </form>
    </div>
  </div>
</div>

<!-- ── Reject Modal ─────────────────────────────────────────────────────────── -->
<div class="modal fade" id="rejectModal" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header border-0">
        <h5 class="modal-title fw-bold">
          <i class="fas fa-times-circle me-2 text-danger"></i>Rejeter la recommandation
        </h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <form id="rejectForm" method="post">
        <div class="modal-body">
          <p class="text-muted mb-3" id="rejectTitle"></p>
          <label class="form-label">Motif (optionnel)</label>
          <textarea name="notes" class="form-control" rows="2" placeholder="Sources insuffisantes, hors sujet…"></textarea>
        </div>
        <div class="modal-footer border-0">
          <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Annuler</button>
          <button type="submit" class="btn btn-danger">
            <i class="fas fa-times me-1"></i>Confirmer le rejet
          </button>
        </div>
      </form>
    </div>
  </div>
</div>
{% endblock %}

{% block scripts %}
<script>
function openEditModal(rec) {
  const f = document.getElementById('editForm');
  f.action = '/admin/review/' + rec.id + '/update';

  document.getElementById('edit_domain').value = rec.domain || 'other';
  document.getElementById('edit_evidence_level').value = rec.evidence_level || 'C';
  document.getElementById('edit_study_type').value = rec.study_type || 'observational';
  document.getElementById('edit_title').value = rec.title || '';
  document.getElementById('edit_summary').value = rec.summary || '';
  document.getElementById('edit_details').value = rec.details || '';
  document.getElementById('edit_intervention').value = rec.intervention || '';
  document.getElementById('edit_effect').value = rec.effect || '';
  document.getElementById('edit_source_title').value = rec.source_title || '';
  document.getElementById('edit_source_doi').value = rec.source_doi || '';
  document.getElementById('edit_source_url').value = rec.source_url || '';
  document.getElementById('edit_priority').value = rec.priority || 5;
  document.getElementById('edit_target_sex').value = rec.target_sex || 'all';
  document.getElementById('edit_target_age_min').value = rec.target_age_min || '';
  document.getElementById('edit_target_age_max').value = rec.target_age_max || '';
  document.getElementById('edit_under18').checked = !!rec.not_for_under_18;
  document.getElementById('edit_pregnant').checked = !!rec.not_for_pregnant;
  document.getElementById('edit_admin_notes').value = rec.admin_notes || '';

  // Reset all checkboxes first
  f.querySelectorAll('input[type=checkbox]').forEach(cb => cb.checked = false);

  // Re-check required_conditions
  (rec._required_conditions ? JSON.parse(rec._required_conditions) : []).forEach(v => {
    const cb = f.querySelector(`input[name=required_conditions][value="${v}"]`);
    if (cb) cb.checked = true;
  });
  (rec._excluded_conditions ? JSON.parse(rec._excluded_conditions) : []).forEach(v => {
    const cb = f.querySelector(`input[name=excluded_conditions][value="${v}"]`);
    if (cb) cb.checked = true;
  });
  (rec._required_health_goals ? JSON.parse(rec._required_health_goals) : []).forEach(v => {
    const cb = f.querySelector(`input[name=required_health_goals][value="${v}"]`);
    if (cb) cb.checked = true;
  });
  (rec._required_diet_types ? JSON.parse(rec._required_diet_types) : []).forEach(v => {
    const cb = f.querySelector(`input[name=required_diet_types][value="${v}"]`);
    if (cb) cb.checked = true;
  });
  (rec._required_activity_levels ? JSON.parse(rec._required_activity_levels) : []).forEach(v => {
    const cb = f.querySelector(`input[name=required_activity_levels][value="${v}"]`);
    if (cb) cb.checked = true;
  });

  new bootstrap.Modal(document.getElementById('editModal')).show();
}

function openRejectModal(id, title) {
  document.getElementById('rejectForm').action = '/admin/review/' + id + '/reject';
  document.getElementById('rejectTitle').textContent = '« ' + title + ' »';
  new bootstrap.Modal(document.getElementById('rejectModal')).show();
}
</script>
{% endblock %}