298 lines
9.3 KiB
HTML
298 lines
9.3 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; }
|
|
@page :first { margin: 0; }
|
|
|
|
@font-face { font-family: 'Noto Kufi Arabic'; font-style: normal; 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-style: normal; font-weight: 700; src: url('vendor/fonts/noto-kufi-arabic/files/noto-kufi-arabic-full-bold.ttf') format('truetype'); }
|
|
|
|
:root {
|
|
--blue: #005696;
|
|
--blue-light: #007bbd;
|
|
--ink: #1e293b;
|
|
--body: #334155;
|
|
--muted: #64748b;
|
|
--border: #cbd5e1;
|
|
--surface: #f1f5f9;
|
|
--white: #ffffff;
|
|
--font: 'Noto Kufi Arabic', sans-serif;
|
|
}
|
|
|
|
* { box-sizing: border-box; margin: 0; padding: 0; font-family: var(--font); }
|
|
body { background: var(--white); color: var(--ink); }
|
|
|
|
.page {
|
|
width: 210mm;
|
|
height: 297mm;
|
|
position: relative;
|
|
overflow: hidden;
|
|
page-break-after: always;
|
|
}
|
|
.page:last-child { page-break-after: auto; }
|
|
|
|
/* === Header === */
|
|
.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;
|
|
object-fit: contain;
|
|
}
|
|
.header-hospital-name {
|
|
font-size: 14px;
|
|
font-weight: 700;
|
|
color: var(--blue);
|
|
}
|
|
.header-branch {
|
|
font-size: 10px;
|
|
color: var(--muted);
|
|
}
|
|
.header-cr {
|
|
font-size: 9px;
|
|
font-weight: 700;
|
|
color: var(--blue);
|
|
text-align: center;
|
|
}
|
|
.header-line {
|
|
height: 2px;
|
|
background: var(--blue);
|
|
margin: 8px 15mm 0 15mm;
|
|
}
|
|
|
|
/* === Watermark === */
|
|
.watermark {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
opacity: 0.04;
|
|
pointer-events: none;
|
|
z-index: 0;
|
|
}
|
|
.watermark img {
|
|
width: 300px;
|
|
height: auto;
|
|
}
|
|
|
|
/* === Footer === */
|
|
.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;
|
|
}
|
|
.footer-ar {
|
|
direction: rtl;
|
|
}
|
|
.footer-en {
|
|
direction: ltr;
|
|
}
|
|
|
|
/* === Form Body === */
|
|
.form-body {
|
|
padding: 8mm 15mm;
|
|
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-top: 12px;
|
|
}
|
|
.data-table th {
|
|
background: var(--surface);
|
|
color: var(--blue);
|
|
font-size: 12px;
|
|
padding: 6px 12px;
|
|
border-right: 3px solid var(--blue);
|
|
border-left: 1px solid var(--border);
|
|
border-top: 1px solid var(--border);
|
|
text-align: right;
|
|
}
|
|
.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%;
|
|
}
|
|
.data-table .text-cell {
|
|
padding: 12px;
|
|
line-height: 2;
|
|
text-align: justify;
|
|
}
|
|
|
|
.signature-block {
|
|
margin-top: 24px;
|
|
padding-top: 16px;
|
|
border-top: 1px solid var(--border);
|
|
text-align: center;
|
|
}
|
|
.signature-label {
|
|
font-size: 11px;
|
|
color: var(--blue);
|
|
}
|
|
.signature-line {
|
|
width: 200px;
|
|
border-bottom: 1px solid var(--border);
|
|
margin: 30px auto 0 auto;
|
|
height: 1px;
|
|
}
|
|
.signature-stamp-text {
|
|
font-size: 9px;
|
|
color: var(--muted);
|
|
margin-top: 8px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Page 1: Complaint Forwarding Form -->
|
|
<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|default:"—" }}</td>
|
|
<td class="lbl">الاسم</td>
|
|
<td class="val">{{ complainant_name|default:"—" }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="lbl">جهة الادعاء</td>
|
|
<td class="val">{{ source_name|default:"—" }}</td>
|
|
<td class="lbl">تاريخ التقديم</td>
|
|
<td class="val">{{ submission_date }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="lbl">تاريخ الحادثة</td>
|
|
<td class="val">{{ incident_date }}</td>
|
|
<td class="lbl">رقم الحالة</td>
|
|
<td class="val">{{ complaint.reference_number|default:"—" }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="lbl">القسم</td>
|
|
<td class="val">{{ department_name|default:"—" }}</td>
|
|
<td class="lbl">الموظف المشكو عليه</td>
|
|
<td class="val">{{ accused_staff_name|default:"—" }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="lbl">الوظيفة</td>
|
|
<td class="val">{{ accused_staff_title|default:"—" }}</td>
|
|
<td class="lbl">تاريخ الإرسال</td>
|
|
<td class="val">{{ sent_to_dept_date }}</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="data-table">
|
|
<tr><th colspan="4">مختصر الشكوى</th></tr>
|
|
<tr>
|
|
<td colspan="4" class="text-cell">{{ content_summary }}</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
{% include "complaints/partials/pdf_letterhead_footer.html" %}
|
|
</div>
|
|
|
|
<!-- Page 2: Complaint Response Form -->
|
|
<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">{{ accused_staff_name|default:"—" }}</td>
|
|
<td class="lbl">الوظيفة</td>
|
|
<td class="val">{{ accused_staff_title|default:"—" }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="lbl">القسم</td>
|
|
<td class="val">{{ department_name|default:"—" }}</td>
|
|
<td class="lbl">تاريخ الرد</td>
|
|
<td class="val">{{ response_date }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="lbl">تاريخ الإرسال</td>
|
|
<td class="val">{{ sent_to_dept_date }}</td>
|
|
<td class="lbl"></td>
|
|
<td class="val"></td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="data-table">
|
|
<tr><th colspan="4">مختصر الرد</th></tr>
|
|
<tr>
|
|
<td colspan="4" class="text-cell">{% if dept_response_summary %}{{ dept_response_summary }}{% else %}لم يتم تسجيل رد من القسم بعد.{% endif %}</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
{% include "complaints/partials/pdf_letterhead_footer.html" %}
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|