Jul 8 - Implement QR code per facility
This commit is contained in:
@@ -0,0 +1,131 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
<title>{{ facility.name }} — Facility Status</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
|
||||
<style>
|
||||
body { background:#f6f8fa; }
|
||||
.wrap { max-width: 640px; margin: 0 auto; padding: 16px; }
|
||||
.hpot { position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
|
||||
.rating-num { font-size: 2.4rem; font-weight: 700; line-height: 1; }
|
||||
.stat { background:#fff; border-radius:.75rem; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
|
||||
{% with messages = get_flashed_messages(with_categories=true) %}
|
||||
{% for category, message in messages %}
|
||||
<div class="alert alert-{{ 'success' if category in ['success','info'] else category }} shadow-sm">
|
||||
{{ message }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endwith %}
|
||||
|
||||
{# ── Header ── #}
|
||||
<div class="text-center mt-2 mb-3">
|
||||
<div class="text-muted small text-uppercase" style="letter-spacing:.08em;">Facility Status</div>
|
||||
<h1 class="h3 fw-bold mb-0">{{ facility.name }}</h1>
|
||||
{% if facility.address %}
|
||||
<div class="text-muted small mt-1"><i class="bi bi-geo-alt"></i> {{ facility.address }}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{# ── Quality rating ── #}
|
||||
<div class="stat shadow-sm p-4 mb-3 text-center">
|
||||
<div class="text-muted small text-uppercase mb-2">Cleaning Quality</div>
|
||||
<span class="badge bg-{{ rating_colour }} fs-6 mb-2">{{ rating_label }}</span>
|
||||
<div class="rating-num text-{{ rating_colour }}">
|
||||
{{ ('%.0f' % avg_score) ~ '%' if avg_score is not none else '—' }}
|
||||
</div>
|
||||
<div class="text-muted small mt-1">Average score, last 90 days</div>
|
||||
</div>
|
||||
|
||||
{# ── Facts ── #}
|
||||
<div class="row g-2 mb-3">
|
||||
<div class="col-6">
|
||||
<div class="stat shadow-sm p-3 h-100">
|
||||
<div class="text-muted small"><i class="bi bi-calendar-check"></i> Last Inspected</div>
|
||||
<div class="fw-semibold">
|
||||
{{ last_inspected.strftime('%b %d, %Y') if last_inspected else 'Not yet' }}
|
||||
</div>
|
||||
{% if last_score is not none %}
|
||||
<div class="text-muted small">Scored {{ '%.0f' % last_score }}%</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="stat shadow-sm p-3 h-100">
|
||||
<div class="text-muted small"><i class="bi bi-exclamation-triangle"></i> Open Issues</div>
|
||||
<div class="fw-semibold fs-4">{{ open_issue_count }}</div>
|
||||
<div class="text-muted small">Currently being tracked</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# ── Report a problem ── #}
|
||||
<div class="stat shadow-sm p-4 mb-4">
|
||||
<h2 class="h5 fw-bold"><i class="bi bi-megaphone"></i> Report a Problem</h2>
|
||||
<p class="text-muted small">
|
||||
Notice something that needs attention? Let the cleaning team know.
|
||||
</p>
|
||||
|
||||
<form method="POST"
|
||||
action="{{ url_for('public.report_problem', token=token) }}"
|
||||
enctype="multipart/form-data" novalidate>
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
{# Honeypot — hidden from humans; bots that fill it are rejected #}
|
||||
<div class="hpot" aria-hidden="true">
|
||||
{{ form.website.label }} {{ form.website(tabindex="-1", autocomplete="off") }}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
{{ form.area_label.label(class="form-label small fw-semibold") }}
|
||||
{{ form.area_label(class="form-control", placeholder="e.g. 2nd floor men's restroom") }}
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
{{ form.description.label(class="form-label small fw-semibold") }}
|
||||
{{ form.description(class="form-control", rows="4",
|
||||
placeholder="Describe what you noticed…") }}
|
||||
{% for e in form.description.errors %}
|
||||
<div class="text-danger small mt-1">{{ e }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="row g-2">
|
||||
<div class="col-sm-6 mb-3">
|
||||
{{ form.reporter_name.label(class="form-label small fw-semibold") }}
|
||||
{{ form.reporter_name(class="form-control") }}
|
||||
</div>
|
||||
<div class="col-sm-6 mb-3">
|
||||
{{ form.reporter_contact.label(class="form-label small fw-semibold") }}
|
||||
{{ form.reporter_contact(class="form-control") }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
{{ form.photo.label(class="form-label small fw-semibold") }}
|
||||
{{ form.photo(class="form-control", accept="image/*") }}
|
||||
{% for e in form.photo.errors %}
|
||||
<div class="text-danger small mt-1">{{ e }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary w-100">
|
||||
<i class="bi bi-send"></i> Submit Report
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="text-center text-muted small mb-4">
|
||||
Janitorial Quality Control
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user