riyadhafraa
771cfb5611
Update PDF rendering logic to correctly handle bidirectional text, cell merging, and text wrapping for meeting tables. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 77cfe984-2c65-4152-bb7a-0df28274fe66 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 36ae937b-a1fc-4edb-8901-b07ed7713220 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/c3c252e4-c83d-40ca-9fff-99a3ea60701e/77cfe984-2c65-4152-bb7a-0df28274fe66/Zh9QhRk Replit-Helium-Checkpoint-Created: true
151 lines
4.2 KiB
Plaintext
151 lines
4.2 KiB
Plaintext
أريد إصلاح تصدير PDF لجدول الاجتماعات بشكل نهائي.
|
|
|
|
⚠️ مهم:
|
|
التصميم الخارجي للـPDF ثابت (العنوان + الفوتر + حجم الصفحة + الخط DIN Next LT Arabic).
|
|
التعديل فقط داخل الجدول.
|
|
|
|
==================================
|
|
أولاً: إصلاح المشاكل الحالية
|
|
==================================
|
|
|
|
1. لا يوجد أي فراغات بين الصفوف:
|
|
- لا padding عمودي
|
|
- لا margin
|
|
- ارتفاع الصف = حجم المحتوى فقط
|
|
|
|
2. كل اجتماع يجب أن يكون صف واحد:
|
|
- الرقم + اسم الاجتماع + الحضور + الوقت في نفس الصف
|
|
- لا يظهر الوقت في صف منفصل أبداً
|
|
|
|
3. إصلاح الترقيم:
|
|
- لا يبدأ من 4 أو رقم خاطئ
|
|
- استخدم رقم الاجتماع الحقيقي من البيانات
|
|
|
|
4. إصلاح ترتيب الحضور:
|
|
- لا يظهر بشكل مقلوب مثل:
|
|
-5 سالم -4 علي
|
|
- الترتيب يكون:
|
|
1- محمد 2- علي 3- طارق
|
|
|
|
5. الدمج:
|
|
- أي merge في النظام (rowSpan / colSpan) يجب أن يظهر نفسه في PDF
|
|
- لا تعيد بناء الجدول بدون الدمج
|
|
|
|
==================================
|
|
ثانياً: تنسيق الحضور
|
|
==================================
|
|
|
|
- الحضور في نفس السطر (inline)
|
|
- كل سطر يحتوي 3 إلى 4 أسماء تقريباً
|
|
- إذا زاد العدد → ينزل سطر جديد تلقائياً
|
|
- لا تجعل كل اسم في سطر مستقل
|
|
|
|
مثال:
|
|
1- محمد 2- علي 3- طارق
|
|
4- سالم 5- عبدالله
|
|
|
|
==================================
|
|
ثالثاً: محاذاة المحتوى
|
|
==================================
|
|
|
|
- عمود "الاجتماع" في المنتصف (center)
|
|
- عمود "الحضور" في المنتصف
|
|
- عمود "الوقت" في المنتصف
|
|
- vertical-align: middle
|
|
|
|
==================================
|
|
رابعاً: عكس تنسيق المستخدم (مهم جداً)
|
|
==================================
|
|
|
|
داخل الجدول فقط:
|
|
|
|
- Bold → يظهر Bold في PDF
|
|
- Center / Right / Left → يظهر نفس المحاذاة
|
|
- لون الخط → يظهر نفسه
|
|
- لون الخلفية → يظهر نفسه
|
|
- حجم الخط → يظهر نفسه
|
|
|
|
⚠️ لا تجعل CSS العام يلغي تنسيقات الخلايا
|
|
|
|
الحل:
|
|
- استخدم inline style لكل خلية
|
|
- مثال:
|
|
|
|
<td
|
|
rowspan="..."
|
|
colspan="..."
|
|
style="
|
|
font-weight: bold;
|
|
text-align: center;
|
|
color: #000;
|
|
background-color: #f2f2f2;
|
|
font-size: 13px;
|
|
vertical-align: middle;
|
|
"
|
|
>
|
|
المحتوى
|
|
</td>
|
|
|
|
==================================
|
|
خامساً: CSS المطلوب
|
|
==================================
|
|
|
|
@media print {
|
|
table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
table-layout: fixed;
|
|
border-spacing: 0;
|
|
}
|
|
|
|
th, td {
|
|
padding: 0 4px !important;
|
|
margin: 0 !important;
|
|
line-height: 1.05 !important;
|
|
vertical-align: middle !important;
|
|
text-align: center;
|
|
}
|
|
|
|
.attendees-inline {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 0 10px;
|
|
direction: rtl;
|
|
}
|
|
|
|
.attendee-item {
|
|
white-space: nowrap;
|
|
unicode-bidi: isolate;
|
|
}
|
|
|
|
.time-cell {
|
|
direction: ltr;
|
|
white-space: nowrap;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
==================================
|
|
سادساً: شرط مهم جداً
|
|
==================================
|
|
|
|
لا تبنِ PDF من DOM مكسور.
|
|
|
|
- استخدم نفس بيانات الجدول في النظام
|
|
- طبّق rowSpan و colSpan كما هي
|
|
- كل صف في PDF = صف حقيقي في النظام
|
|
|
|
==================================
|
|
النتيجة المطلوبة:
|
|
==================================
|
|
|
|
PDF مطابق للنظام من حيث:
|
|
- بدون فراغات
|
|
- الحضور inline
|
|
- الترقيم صحيح
|
|
- الدمج صحيح
|
|
- الوقت داخل الصف
|
|
- المحاذاة في المنتصف
|
|
- جميع التنسيقات (Bold / Color / Alignment) تنعكس |