Flask + SQLite, in de Van Emous-huisstijl (tokens uit het design system, GSAP-effecten volgens de motion-regels, uit bij prefers-reduced-motion). - Leads en contactpersonen: status, toewijzen, verwachte waarde, omzetten naar klant, tijdlijn, bestanden, taken/opvolging - Relaties (zoals accounts in EspoCRM): klantbundels (huishouden/familie) en partners met type (leverancier, aannemer, ...); leveranciers van producten worden automatisch partners - API voor formulieren (POST /api/leads) met dubbele-leaddetectie, bestanden en configurator-ontwerpen (house-design JSON) - Import van CSV/JSON (leads, relaties, producten) met kolomkoppeling; configurator-formaat - Producten met SKU als vaste sleutel, mutatiehistorie, POST /api/products, CSV-export; offerteregels houden hun eigen prijs - Offertes met btw per tarief en afdrukversie (PDF via de browser) - Inbox via IMAP/SMTP, gekoppeld aan contacten - Gebruikers (beheerder/medewerker) en klantportaal (offertes accepteren, bestanden, berichten) Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
75 lines
3.3 KiB
HTML
75 lines
3.3 KiB
HTML
{% extends 'base.html' %}
|
|
{% block title %}Klantportaal{% endblock %}
|
|
{% block body %}
|
|
<script>document.body.classList.add('portal')</script>
|
|
<header class="portal-top">
|
|
<div class="wrap">
|
|
<img src="{{ url_for('static', filename='logo.svg') }}" alt="{{ s.company_name or 'Van Emous' }}">
|
|
<a href="{{ url_for('portal_logout') }}">Uitloggen</a>
|
|
</div>
|
|
</header>
|
|
<div class="portal-main">
|
|
{% with msgs = get_flashed_messages(with_categories=true) %}
|
|
{% for cat, m in msgs %}<div class="flash {{ cat }}">{{ m }}</div>{% endfor %}
|
|
{% endwith %}
|
|
<div class="head"><div><div class="kicker">Klantportaal</div><h1>Welkom, {{ c.name }}</h1></div></div>
|
|
|
|
<div class="card">
|
|
<h2>Uw offertes</h2>
|
|
{% if quotes %}
|
|
<div class="table-wrap"><table>
|
|
<thead><tr><th>Nummer</th><th>Onderwerp</th><th>Datum</th><th>Status</th><th class="num">Totaal incl. btw</th></tr></thead>
|
|
<tbody>
|
|
{% for qt in quotes %}
|
|
<tr class="link" onclick="location='{{ url_for('portal_quote', qid=qt.id) }}'">
|
|
<td><a href="{{ url_for('portal_quote', qid=qt.id) }}">{{ qt.number }}</a></td>
|
|
<td>{{ qt.title }}</td>
|
|
<td>{{ qt.date|dt('%d-%m-%Y') }}</td>
|
|
<td><span class="chip {{ qt.status }}">{{ 'Wacht op uw reactie' if qt.status == 'verzonden' else QSTATUS.get(qt.status) }}</span></td>
|
|
<td class="num">{{ qt.total|euro }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table></div>
|
|
{% else %}<p class="empty">Er staan nog geen offertes voor u klaar.</p>{% endif %}
|
|
</div>
|
|
|
|
<div class="grid">
|
|
<div class="card">
|
|
<h2>Bestanden</h2>
|
|
{% if files %}
|
|
<div class="files">
|
|
{% for f in files %}
|
|
<div class="file">
|
|
<a href="{{ url_for('portal_file', name=f.stored) }}" target="_blank" class="thumb">
|
|
{% if f.mime.startswith('image/') %}<img src="{{ url_for('portal_file', name=f.stored) }}" alt="{{ f.original }}" loading="lazy">
|
|
{% else %}{{ f.original.rsplit('.', 1)[-1][:4] if '.' in f.original else 'bestand' }}{% endif %}
|
|
</a>
|
|
<div class="name" title="{{ f.original }}">{{ f.original }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
<form method="post" action="{{ url_for('portal_upload') }}" enctype="multipart/form-data">
|
|
<label for="files">Foto's of documenten delen (bijv. van uw tuin of tekeningen)</label>
|
|
<input id="files" type="file" name="files" multiple required>
|
|
<div class="actions"><button class="btn ghost small">Uploaden</button></div>
|
|
</form>
|
|
</div>
|
|
<div class="card">
|
|
<h2>Bericht sturen</h2>
|
|
<form method="post" action="{{ url_for('portal_message') }}">
|
|
<textarea name="body" required aria-label="Bericht" placeholder="Uw vraag of opmerking"></textarea>
|
|
<div class="actions"><button class="btn">Versturen</button></div>
|
|
</form>
|
|
{% for m in messages %}
|
|
<p class="muted" style="margin:.75rem 0 0">{{ m.created_at|dt }}<br><span style="color:var(--ink);white-space:pre-line">{{ m.body[8:] }}</span></p>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% if s.company_phone or s.company_email %}
|
|
<p class="muted">Vragen? Neem contact op: {{ [s.company_phone, s.company_email]|select|join(' · ') }}</p>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|