106 lines
5.5 KiB
HTML
106 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ar" dir="rtl">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>مراجعة الردود - {{ complaint.reference_number }}</title>
|
|
<style>
|
|
@page { size: A4; margin: 0; }
|
|
@font-face { font-family: 'Noto Kufi Arabic'; font-weight: 400; src: url('vendor/fonts/noto-kufi-arabic/files/noto-kufi-arabic-full-regular.ttf') format('truetype'); }
|
|
@font-face { font-family: 'Noto Kufi Arabic'; font-weight: 700; src: url('vendor/fonts/noto-kufi-arabic/files/noto-kufi-arabic-full-bold.ttf') format('truetype'); }
|
|
:root { --blue: #005696; --ink: #1e293b; --body: #334155; --muted: #64748b; --border: #cbd5e1; --surface: #f1f5f9; --font: 'Noto Kufi Arabic', sans-serif; }
|
|
* { box-sizing: border-box; margin: 0; padding: 0; font-family: var(--font); }
|
|
body { background: #fff; color: var(--ink); }
|
|
.page { width: 210mm; min-height: 297mm; position: relative; overflow: hidden; padding-bottom: 30mm; }
|
|
.page-header { position: relative; height: 22mm; margin: 8mm 20mm 0 20mm; }
|
|
.header-ar { position: absolute; left: 0; top: 4mm; text-align: left; }
|
|
.header-logo-wrap { position: absolute; left: 50%; top: 0; transform: translateX(-50%); text-align: center; }
|
|
.header-en { position: absolute; right: 0; top: 4mm; text-align: right; }
|
|
.header-logo { width: 55px; height: auto; }
|
|
.header-hospital-name { font-size: 14px; font-weight: 700; color: var(--blue); }
|
|
.header-cr { font-size: 9px; font-weight: 700; color: var(--blue); text-align: center; }
|
|
.header-line { height: 2px; background: var(--blue); margin: 8px 20mm 0 20mm; }
|
|
.watermark { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0.04; pointer-events: none; z-index: 0; }
|
|
.watermark img { width: 300px; }
|
|
.page-footer { position: absolute; bottom: 0; left: 0; right: 0; }
|
|
.footer-line { height: 2px; background: var(--blue); margin: 0 15mm; }
|
|
.footer-content { padding: 6px 15mm 10mm 15mm; text-align: center; font-size: 8px; color: var(--muted); line-height: 1.8; }
|
|
.form-body { padding: 8mm 20mm; position: relative; z-index: 1; }
|
|
.form-title { text-align: center; font-size: 16px; color: var(--blue); padding: 10px 0 16px 0; }
|
|
.data-table { width: 100%; border-collapse: collapse; margin-bottom: 8mm; }
|
|
.data-table td { border: 1px solid var(--border); font-size: 11px; padding: 8px 12px; }
|
|
.data-table .lbl { background: var(--surface); color: var(--body); font-weight: 700; width: 15%; }
|
|
.data-table .val { color: var(--ink); width: 35%; }
|
|
.staff-section { margin-bottom: 6mm; }
|
|
.staff-header { background: var(--surface); color: var(--blue); font-size: 12px; font-weight: 700; padding: 6px 12px; border: 1px solid var(--border); border-bottom: none; }
|
|
.qa-table { width: 100%; border-collapse: collapse; }
|
|
.qa-table td { border: 1px solid var(--border); font-size: 10px; padding: 6px 10px; }
|
|
.qa-table .q-lbl { background: var(--surface); font-weight: 700; width: 30%; }
|
|
.qa-table .q-val { width: 70%; }
|
|
.status-badge { display: inline-block; padding: 2px 8px; border-radius: 3px; font-size: 9px; font-weight: 700; }
|
|
.status-yes { background: #dcfce7; color: #166534; }
|
|
.status-no { background: #fee2e2; color: #991b1b; }
|
|
.status-pending { background: #fef9c3; color: #854d0e; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="page">
|
|
{% include "complaints/partials/pdf_letterhead_header.html" %}
|
|
<div class="watermark"><img src="{{ logo_path }}" alt=""></div>
|
|
|
|
<div class="form-body">
|
|
<div class="form-title">مراجعة ردود الموظفين</div>
|
|
|
|
<table class="data-table">
|
|
<tr>
|
|
<td class="lbl">رقم الشكوى</td>
|
|
<td class="val">{{ complaint.reference_number }}</td>
|
|
<td class="lbl">العنوان</td>
|
|
<td class="val">{{ complaint.title }}</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="data-table">
|
|
<tr>
|
|
<td colspan="4" class="lbl" style="width:auto">{{ complaint.description }}</td>
|
|
</tr>
|
|
</table>
|
|
|
|
{% for sd in staff_data %}
|
|
<div class="staff-section">
|
|
<div class="staff-header">
|
|
{{ sd.staff.get_full_name }}
|
|
{% if sd.is_completed %}
|
|
<span class="status-badge status-yes">تم الرد</span>
|
|
{% else %}
|
|
<span class="status-badge status-pending">بانتظار الرد</span>
|
|
{% endif %}
|
|
</div>
|
|
{% if sd.qa_pairs %}
|
|
<table class="qa-table">
|
|
{% for qa in sd.qa_pairs %}
|
|
<tr>
|
|
<td class="q-lbl">{{ qa.question }}</td>
|
|
<td class="q-val">
|
|
{% if qa.question_type == 'yes_no' %}
|
|
{% if qa.answer == 'yes' %}<span class="status-badge status-yes">نعم</span>
|
|
{% elif qa.answer == 'no' %}<span class="status-badge status-no">لا</span>
|
|
{% else %}—{% endif %}
|
|
{% else %}
|
|
{{ qa.answer|default:"—" }}
|
|
{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{% include "complaints/partials/pdf_letterhead_footer.html" %}
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|