73 lines
3.5 KiB
HTML
73 lines
3.5 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block content %}
|
|
<div class="page-header">
|
|
<div>
|
|
<h1 class="page-title">Appointments <span class="page-count">({{ count }})</span></h1>
|
|
</div>
|
|
<a href="/appointments/new" class="btn btn-primary">+ New Appointment</a>
|
|
</div>
|
|
|
|
<!-- Filters -->
|
|
<div class="filters-bar">
|
|
<a href="/appointments?timeframe=upcoming" class="btn {{ 'btn-primary' if timeframe == 'upcoming' else 'btn-secondary' }} btn-sm">Upcoming</a>
|
|
<a href="/appointments?timeframe=past" class="btn {{ 'btn-primary' if timeframe == 'past' else 'btn-secondary' }} btn-sm">Past</a>
|
|
<a href="/appointments?timeframe=all" class="btn {{ 'btn-primary' if timeframe == 'all' else 'btn-secondary' }} btn-sm">All</a>
|
|
</div>
|
|
|
|
{% if appointments %}
|
|
<div class="card">
|
|
{% set current_date = namespace(value='') %}
|
|
{% for appt in appointments %}
|
|
{% set appt_date = appt.start_at.strftime('%A, %B %-d, %Y') if appt.start_at else 'No Date' %}
|
|
{% if appt_date != current_date.value %}
|
|
{% if not loop.first %}</div>{% endif %}
|
|
<div class="date-group-label" style="padding: 12px 12px 4px; font-size: 0.78rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; {% if not loop.first %}border-top: 1px solid var(--border); margin-top: 4px;{% endif %}">
|
|
{{ appt_date }}
|
|
</div>
|
|
<div>
|
|
{% set current_date.value = appt_date %}
|
|
{% endif %}
|
|
|
|
<div class="list-row">
|
|
<div style="flex-shrink: 0; min-width: 60px;">
|
|
{% if appt.all_day %}
|
|
<span class="status-badge status-active" style="font-size: 0.72rem;">All Day</span>
|
|
{% elif appt.start_at %}
|
|
<span style="font-size: 0.85rem; font-weight: 600; color: var(--text);">{{ appt.start_at.strftime('%-I:%M %p') }}</span>
|
|
{% endif %}
|
|
</div>
|
|
<div class="row-title">
|
|
<a href="/appointments/{{ appt.id }}">{{ appt.title }}</a>
|
|
</div>
|
|
{% if appt.location %}
|
|
<span class="row-meta">{{ appt.location }}</span>
|
|
{% endif %}
|
|
{% if appt.recurrence %}
|
|
<span class="row-tag">{{ appt.recurrence }}</span>
|
|
{% endif %}
|
|
{% if appt.contact_count and appt.contact_count > 0 %}
|
|
<span class="row-meta">
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="vertical-align: -2px;"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
|
|
{{ appt.contact_count }}
|
|
</span>
|
|
{% endif %}
|
|
<div class="row-actions">
|
|
<a href="/appointments/{{ appt.id }}/edit" class="btn btn-ghost btn-xs">Edit</a>
|
|
<form method="POST" action="/appointments/{{ appt.id }}/delete" data-confirm="Delete this appointment?">
|
|
<button type="submit" class="btn btn-ghost btn-xs" style="color: var(--red);">Delete</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="empty-state">
|
|
<div class="empty-state-icon">📅</div>
|
|
<div class="empty-state-text">No appointments {{ 'upcoming' if timeframe == 'upcoming' else 'found' }}</div>
|
|
<a href="/appointments/new" class="btn btn-primary">Schedule an Appointment</a>
|
|
</div>
|
|
{% endif %}
|
|
{% endblock %}
|