93 lines
4.5 KiB
HTML
93 lines
4.5 KiB
HTML
<section class="grid gap-6">
|
|
<header class="flex items-center justify-between flex-wrap gap-3 print:hidden">
|
|
<h1 class="text-2xl font-bold">Department / Store Info</h1>
|
|
{% if current_user.role == 'admin' %}
|
|
<a href="{{ url_for('admin_info_console') }}" class="px-3 py-2 rounded-lg border border-slate-700 hover:border-slate-500 text-sm">Admin Console</a>
|
|
{% endif %}
|
|
<button onclick="window.print()" class="px-3 py-2 rounded-lg border border-slate-700 hover:border-slate-500 text-sm">
|
|
Print / PDF
|
|
</button>
|
|
</header>
|
|
|
|
<!-- Quick Contacts -->
|
|
<div class="rounded-2xl border border-slate-800 bg-slate-900/60 print-block">
|
|
<div class="flex items-center justify-between p-4 border-b border-slate-800">
|
|
<h2 class="text-lg font-semibold">Quick Contacts</h2>
|
|
<input id="q" placeholder="Filter by name…" class="px-3 py-2 rounded-lg bg-slate-950 border border-slate-700 text-sm" oninput="filterContacts(this.value)">
|
|
</div>
|
|
<div id="contactsGrid" class="p-4 grid gap-3" style="grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));">
|
|
{% for c in contacts %}
|
|
<article class="contact-card rounded-xl border border-slate-800 bg-slate-950/60 p-3" data-key="{{ (c.name ~ ' ' ~ (c.role or '') ~ ' ' ~ (c.phone or '')) | lower }}">
|
|
<div class="flex items-center justify-between">
|
|
<h3 class="font-semibold">{{ c.name }}</h3>
|
|
{% if c.priority == 1 %}<span class="text-xs px-2 py-0.5 rounded-full border border-amber-600 text-amber-200">Priority</span>{% endif %}
|
|
</div>
|
|
{% if c.role %}<p class="text-xs text-slate-400">{{ c.role }}</p>{% endif %}
|
|
{% if c.phone %}<p class="mt-1 text-sm font-mono">{{ c.phone }}</p>{% endif %}
|
|
</article>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Department Extensions -->
|
|
<div class="rounded-2xl border border-slate-800 bg-slate-900/60 overflow-x-auto print-block">
|
|
<div class="p-4 border-b border-slate-800">
|
|
<h2 class="text-lg font-semibold">Department Extensions</h2>
|
|
</div>
|
|
<table class="min-w-full text-sm">
|
|
<thead class="text-slate-300"><tr><th class="py-2 px-3 text-left font-medium">Extension</th><th class="py-2 px-3 text-left font-medium">Department</th></tr></thead>
|
|
<tbody class="divide-y divide-slate-800">
|
|
{% for d in exts %}
|
|
<tr><td class="py-2 px-3 font-mono">{{ d.ext }}</td><td class="py-2 px-3">{{ d.dept }}</td></tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- Support Items -->
|
|
<div class="rounded-2xl border border-slate-800 bg-slate-900/60 print-block">
|
|
<div class="p-4 border-b border-slate-800"><h2 class="text-lg font-semibold">Support & Escalation</h2></div>
|
|
<div class="p-4 grid gap-3" style="grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));">
|
|
{% for s in supports %}
|
|
<article class="rounded-xl border border-slate-800 bg-slate-950/60 p-4">
|
|
<h3 class="font-semibold">{{ s.category }}</h3>
|
|
{% if s.email %}<p class="text-sm text-slate-300 mt-1"><span class="text-slate-400">Email:</span> {{ s.email }}</p>{% endif %}
|
|
{% if s.phone %}<p class="text-sm text-slate-300"><span class="text-slate-400">Phone:</span> {{ s.phone }}</p>{% endif %}
|
|
{% if s.note %}<p class="text-xs text-slate-400 mt-2">{{ s.note }}</p>{% endif %}
|
|
{% if s.issues() %}
|
|
<ul class="mt-3 text-sm list-disc pl-5 space-y-1">
|
|
{% for it in s.issues() %}<li>{{ it }}</li>{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
</article>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
{% if admin_secrets %}
|
|
<div class="rounded-2xl border border-slate-800 bg-slate-900/60 print-block">
|
|
<div class="p-4 border-b border-slate-800 flex items-center justify-between ">
|
|
<h2 class="text-lg font-semibold">Admin Quick Notes</h2>
|
|
<span class="text-xs text-slate-400">Visible to admins only</span>
|
|
</div>
|
|
<div class="p-4 grid gap-3" style="grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));">
|
|
{% for s in admin_secrets %}
|
|
<article class="rounded-xl border border-slate-800 bg-slate-950/60 p-4">
|
|
<h3 class="font-semibold">{{ s.label }}</h3>
|
|
<p class="mt-1 font-mono text-sm">{{ s.value }}</p>
|
|
{% if s.notes %}<p class="text-xs text-slate-400 mt-2 whitespace-pre-wrap">{{ s.notes }}</p>{% endif %}
|
|
</article>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</section>
|
|
|
|
<script>
|
|
function filterContacts(q){
|
|
q = (q||'').toLowerCase();
|
|
document.querySelectorAll('.contact-card').forEach(c=>{
|
|
c.style.display = (c.getAttribute('data-key')||'').includes(q) ? '' : 'none';
|
|
});
|
|
}
|
|
</script> |