148 lines
6.4 KiB
HTML
148 lines
6.4 KiB
HTML
{% extends "base.html" %}
|
|
{% block content %}
|
|
<section class="max-w-7xl mx-auto py-10">
|
|
|
|
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4 mb-6">
|
|
<h1 class="text-3xl font-bold">Quote Requests</h1>
|
|
<div class="flex items-center gap-3">
|
|
<input id="q" placeholder="Search name/email/notes…" class="w-64" oninput="filterCards(this.value)" />
|
|
<nav class="text-sm space-x-2">
|
|
{% for key,label in [('active','Active'),('open','Open'),('completed','Completed'),('deleted','Deleted'),('all','All')] %}
|
|
<a class="px-3 py-1 rounded border {{ 'bg-white/10' if show==key else 'border-white/10 hover:border-white/30' }}"
|
|
href="{{ url_for('admin', show=key) }}">{{ label }}</a>
|
|
{% endfor %}
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div id="cardGrid" class="grid sm:grid-cols-2 lg:grid-cols-3 gap-5">
|
|
{% for r in rows %}
|
|
<article class="card glass p-5 flex flex-col gap-4 {{ 'opacity-60' if r.deleted_at }}">
|
|
<header class="flex items-start justify-between gap-3">
|
|
<div>
|
|
<div class="text-xs text-white/60">#{{ r.id }} • {{ (r.created_at or '')[:19].replace('T',' ') }}</div>
|
|
<h2 class="text-lg font-semibold">{{ r.name }}</h2>
|
|
<a class="text-sm underline text-white/80" href="mailto:{{ r.email }}">{{ r.email }}</a>
|
|
</div>
|
|
<div class="flex flex-wrap gap-1 justify-end">
|
|
{% set tl = (r.urgency or '-') %}
|
|
{% set st = r.status if r.status else 'open' %}
|
|
<span class="px-2 py-0.5 rounded text-[11px] border
|
|
{% if st == 'completed' %} border-emerald-400 text-emerald-200
|
|
{% else %} border-sky-400 text-sky-200 {% endif %}">{{ st }}</span>
|
|
<span class="px-2 py-0.5 rounded text-[11px] border
|
|
{% if tl in ['critical','rush'] %} border-red-400 text-red-200
|
|
{% elif tl == 'soon' %} border-yellow-400 text-yellow-200
|
|
{% else %} border-emerald-400 text-emerald-200 {% endif %}">{{ tl }}</span>
|
|
</div>
|
|
</header>
|
|
|
|
<dl class="grid grid-cols-2 gap-x-4 gap-y-2 text-sm">
|
|
<div>
|
|
<dt class="text-white/60">What they need</dt>
|
|
<dd class="font-medium">{{ r.project_type or '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-white/60">Scope</dt>
|
|
<dd class="font-medium">{{ r.complexity or '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-white/60">Extras</dt>
|
|
<dd class="font-medium">{{ r.features or '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-white/60">Budget</dt>
|
|
<dd class="font-medium">{{ r.budget_range or '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-white/60">Est. Hours</dt>
|
|
<dd class="font-medium">{{ r.est_hours }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-white/60">Est. Cost</dt>
|
|
<dd class="font-medium">${{ '%.2f'|format(r.est_cost or 0) }}</dd>
|
|
</div>
|
|
</dl>
|
|
|
|
<div class="text-sm bg-black/30 rounded border border-white/10 p-3 max-h-28 overflow-auto">
|
|
<div class="text-white/60 text-xs mb-1">Client notes</div>
|
|
<div class="line-clamp-3">{{ (r.description or '—') }}</div>
|
|
</div>
|
|
|
|
<div class="mt-auto flex items-center justify-between gap-2">
|
|
<button class="btn text-xs" type="button"
|
|
data-notes="{{ (r.description or '') | e }}"
|
|
data-json='{{ (r.json_payload or "{}") | e }}'
|
|
data-meta='{{ (r.name ~ " • " ~ (r.email or "") ~ " • #" ~ r.id) | e }}'
|
|
onclick="openNotes(this)">View notes</button>
|
|
|
|
<div class="flex gap-2">
|
|
{% if not r.deleted_at and (r.status or 'open') != 'completed' %}
|
|
<form method="post" action="{{ url_for('mark_complete', rid=r.id, show=show) }}">
|
|
<input type="hidden" name="_csrf" value="{{ csrf }}">
|
|
<button class="btn bg-emerald-600/70 text-xs" onclick="return confirm('Mark #{{r.id}} as completed?')">Complete</button>
|
|
</form>
|
|
{% endif %}
|
|
{% if not r.deleted_at %}
|
|
<form method="post" action="{{ url_for('delete_request', rid=r.id, show=show) }}">
|
|
<input type="hidden" name="_csrf" value="{{ csrf }}">
|
|
<button class="btn bg-red-600/70 text-xs" onclick="return confirm('Move #{{r.id}} to Deleted?')">Delete</button>
|
|
</form>
|
|
{% else %}
|
|
<span class="text-xs text-white/50">Deleted</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</article>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Modal for notes -->
|
|
<dialog id="notesModal" class="backdrop:bg-black/70 rounded-xl w-[min(90vw,760px)]">
|
|
<form method="dialog" class="glass card p-0 overflow-hidden">
|
|
<header class="flex items-center justify-between px-5 py-3 border-b border-white/10">
|
|
<h2 id="modalTitle" class="font-semibold">Notes</h2>
|
|
<button class="btn" value="close">Close</button>
|
|
</header>
|
|
<div class="p-5 space-y-5">
|
|
<section>
|
|
<h3 class="text-sm font-semibold text-white/70 mb-2">Client notes</h3>
|
|
<pre id="notesText" class="whitespace-pre-wrap text-sm bg-black/40 p-3 rounded border border-white/10"></pre>
|
|
</section>
|
|
<section>
|
|
<h3 class="text-sm font-semibold text-white/70 mb-2">Raw submission (JSON)</h3>
|
|
<pre id="jsonText" class="overflow-auto text-xs bg-black/40 p-3 rounded border border-white/10 max-h-64"></pre>
|
|
</section>
|
|
</div>
|
|
<footer class="px-5 py-3 border-t border-white/10 text-right">
|
|
<button class="btn bg-accent font-semibold" value="close">Done</button>
|
|
</footer>
|
|
</form>
|
|
</dialog>
|
|
|
|
</section>
|
|
|
|
<script>
|
|
function openNotes(btn) {
|
|
const modal = document.getElementById('notesModal');
|
|
const notes = btn.getAttribute('data-notes') || '';
|
|
const raw = btn.getAttribute('data-json') || '{}';
|
|
const meta = btn.getAttribute('data-meta') || 'Notes';
|
|
document.getElementById('modalTitle').textContent = meta;
|
|
document.getElementById('notesText').textContent = notes.trim() || '—';
|
|
try { document.getElementById('jsonText').textContent = JSON.stringify(JSON.parse(raw), null, 2) }
|
|
catch { document.getElementById('jsonText').textContent = raw; }
|
|
modal.showModal();
|
|
}
|
|
|
|
function filterCards(q) {
|
|
q = (q || '').toLowerCase();
|
|
document.querySelectorAll('#cardGrid article').forEach(card => {
|
|
card.style.display = card.innerText.toLowerCase().includes(q) ? '' : 'none';
|
|
});
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
|