343 lines
10 KiB
Plaintext
343 lines
10 KiB
Plaintext
|
أريد إضافة Module جديد داخل النظام الحالي بدون تخريب أي وظائف موجودة، وبدون إعادة بناء النظام من الصفر.
|
||
|
|
|
||
|
|
اسم التطبيق:
|
||
|
|
إدارة الاجتماعات التنفيذية
|
||
|
|
Executive Meetings Management
|
||
|
|
|
||
|
|
مهم جدًا:
|
||
|
|
- لا تغيّر النظام الحالي أو الصلاحيات الحالية إلا بإضافة ما يلزم لهذا التطبيق.
|
||
|
|
- لا تحذف أي صفحات أو جداول أو مكونات موجودة.
|
||
|
|
- نفّذ التطبيق كـ Module مستقل داخل النظام.
|
||
|
|
- استخدم الصورة المرفقة كمرجع أساسي لتصميم جدول الاجتماعات اليومي.
|
||
|
|
- المطلوب تصميم iPad First ثم Responsive للجوال والمتصفح.
|
||
|
|
- الواجهة عربية RTL مع دعم English لاحقًا.
|
||
|
|
|
||
|
|
فكرة التطبيق:
|
||
|
|
النظام يدير جدول اجتماعات الرئيس التنفيذي يوميًا بشكل حي بدل PDF ثابت وتعديلات واتساب.
|
||
|
|
|
||
|
|
مسار العمل:
|
||
|
|
الرئيس التنفيذي
|
||
|
|
↓
|
||
|
|
مدير المكتب التنفيذي
|
||
|
|
↓
|
||
|
|
إدارة التنسيق والتوثيق
|
||
|
|
↓
|
||
|
|
تحديث الجدول
|
||
|
|
↓
|
||
|
|
الرئيس يشاهد التحديث من الآيباد
|
||
|
|
|
||
|
|
الأدوار:
|
||
|
|
1. الرئيس التنفيذي:
|
||
|
|
- يشاهد جدول اليوم.
|
||
|
|
- يشاهد الاجتماع القادم.
|
||
|
|
- يشاهد الوقت المتبقي.
|
||
|
|
- يشاهد الحضور والمكان والرابط والملاحظات والمرفقات والحالة.
|
||
|
|
- لا يعدل مباشرة.
|
||
|
|
- يستطيع فقط إرسال طلب:
|
||
|
|
- طلب تعديل
|
||
|
|
- طلب إلغاء
|
||
|
|
- طلب تأجيل
|
||
|
|
- إضافة ملاحظة
|
||
|
|
- طلب إضافة حضور
|
||
|
|
- طلب حذف حضور
|
||
|
|
|
||
|
|
2. مدير المكتب التنفيذي:
|
||
|
|
- يستقبل طلبات الرئيس أولًا.
|
||
|
|
- يراجع الطلب.
|
||
|
|
- يستطيع:
|
||
|
|
- اعتماد
|
||
|
|
- رفض
|
||
|
|
- تعديل التوجيه
|
||
|
|
- تحويل الطلب لنوع آخر
|
||
|
|
- إرسال الطلب لإدارة التنسيق
|
||
|
|
- تعديل الاجتماع عند الحاجة
|
||
|
|
|
||
|
|
3. إدارة التنسيق والتوثيق:
|
||
|
|
- تنفذ التوجيهات.
|
||
|
|
- تعدل وقت الاجتماع.
|
||
|
|
- تعدل الحضور.
|
||
|
|
- تعدل القاعة أو رابط الاجتماع.
|
||
|
|
- ترفع المرفقات.
|
||
|
|
- توثق التعديلات.
|
||
|
|
- تحدث الحالة.
|
||
|
|
- تصدر PDF عند الحاجة.
|
||
|
|
|
||
|
|
4. رئيس التنسيق:
|
||
|
|
- يعتمد النشر اليومي للجدول.
|
||
|
|
|
||
|
|
5. مشاهد:
|
||
|
|
- عرض فقط.
|
||
|
|
|
||
|
|
6. مدير النظام:
|
||
|
|
- إدارة المستخدمين والصلاحيات.
|
||
|
|
|
||
|
|
أضف في القائمة الجانبية Module باسم:
|
||
|
|
Executive Meetings
|
||
|
|
|
||
|
|
ويحتوي على الصفحات التالية:
|
||
|
|
- جدول الاجتماعات
|
||
|
|
- إدارة الاجتماعات
|
||
|
|
- طلبات التعديل
|
||
|
|
- موافقات مدير المكتب
|
||
|
|
- مهام فريق التنسيق
|
||
|
|
- التنبيهات
|
||
|
|
- سجل التعديلات
|
||
|
|
- PDF Export
|
||
|
|
- Font Settings
|
||
|
|
|
||
|
|
الواجهة الرئيسية:
|
||
|
|
اسم الصفحة:
|
||
|
|
جدول الاجتماعات اليومية
|
||
|
|
|
||
|
|
Header:
|
||
|
|
في أعلى الصفحة من اليسار:
|
||
|
|
- شعار الجهة الرسمي Logo
|
||
|
|
- بجانبه:
|
||
|
|
إدارة الاجتماعات التنفيذية
|
||
|
|
Executive Meetings Management
|
||
|
|
|
||
|
|
في أعلى الصفحة من اليمين:
|
||
|
|
- زر تصدير PDF
|
||
|
|
- اختيار نوع الخط
|
||
|
|
- حجم الخط: 12 / 14 / 16 / 18
|
||
|
|
- سماكة الخط: Regular / Medium / Bold
|
||
|
|
- تغيير نمط العرض
|
||
|
|
- اللغة عربي / English
|
||
|
|
- الوضع الليلي اختياري
|
||
|
|
|
||
|
|
الجدول الرئيسي:
|
||
|
|
يجب أن يكون بنفس أسلوب الصورة المرفقة رسمي وواضح.
|
||
|
|
|
||
|
|
الأعمدة فقط 4:
|
||
|
|
| # | اسم الاجتماع | الحضور | الوقت |
|
||
|
|
|
||
|
|
مهم:
|
||
|
|
- العمود # صغير.
|
||
|
|
- عمود اسم الاجتماع متوسط.
|
||
|
|
- عمود الحضور هو الأكبر.
|
||
|
|
- عمود الوقت واضح.
|
||
|
|
- رأس الجدول باللون الأزرق الداكن.
|
||
|
|
- حدود الجدول رسمية وواضحة.
|
||
|
|
- الخط واضح ومناسب للطباعة والآيباد.
|
||
|
|
- أضف خيار رفع Logo لاحقًا واستخدامه في رأس الصفحة و PDF.
|
||
|
|
|
||
|
|
تفاصيل الأعمدة:
|
||
|
|
|
||
|
|
1. عمود #:
|
||
|
|
يعرض رقم الاجتماع اليومي:
|
||
|
|
1
|
||
|
|
2
|
||
|
|
3
|
||
|
|
4
|
||
|
|
|
||
|
|
2. عمود اسم الاجتماع:
|
||
|
|
يعرض اسم الاجتماع الرسمي.
|
||
|
|
أمثلة:
|
||
|
|
- اجتماع الإدارة
|
||
|
|
- اجتماع تحضيري
|
||
|
|
- اجتماع اعتماد البرامج
|
||
|
|
- اتصال مرئي عبر Webex
|
||
|
|
|
||
|
|
إذا كان الاجتماع مهم أو ملغي أو يحتاج تنبيه، يمكن تمييزه بلون رسمي بدون مبالغة.
|
||
|
|
|
||
|
|
3. عمود الحضور:
|
||
|
|
هذا أهم عمود.
|
||
|
|
|
||
|
|
طريقة العرض المطلوبة:
|
||
|
|
الحضور يكون:
|
||
|
|
- مرتب
|
||
|
|
- مرقم
|
||
|
|
- موزع أفقيًا داخل الخانة
|
||
|
|
- ليس قائمة عمودية طويلة
|
||
|
|
|
||
|
|
مثال صحيح:
|
||
|
|
1- أحمد 2- محمد 3- خالد
|
||
|
|
4- عبدالله 5- فهد
|
||
|
|
|
||
|
|
مثال خاطئ:
|
||
|
|
1- أحمد
|
||
|
|
2- محمد
|
||
|
|
3- خالد
|
||
|
|
4- عبدالله
|
||
|
|
5- فهد
|
||
|
|
|
||
|
|
نفّذ هذا تقنيًا باستخدام:
|
||
|
|
CSS Grid أو Flex Wrap
|
||
|
|
|
||
|
|
بحيث تتوزع الأسماء تلقائيًا داخل الخانة.
|
||
|
|
|
||
|
|
إذا كان الاجتماع يحتوي حضور عن بعد:
|
||
|
|
Webex / Teams / Zoom
|
||
|
|
|
||
|
|
قسّم الحضور داخل نفس الخانة إلى أقسام:
|
||
|
|
|
||
|
|
الحضور عبر الاتصال المرئي:
|
||
|
|
1- أحمد 2- محمد 3- خالد
|
||
|
|
|
||
|
|
الحضور الداخلي:
|
||
|
|
1- عبدالله 2- فهد 3- سالم
|
||
|
|
|
||
|
|
يجب أن يظهر العنوان الفرعي داخل الخانة بلون أزرق رسمي وبخط واضح كما في الصورة المرفقة.
|
||
|
|
|
||
|
|
4. عمود الوقت:
|
||
|
|
يعرض البداية والنهاية بشكل واضح ويفضل رأسيًا:
|
||
|
|
10:00
|
||
|
|
10:30
|
||
|
|
|
||
|
|
أو:
|
||
|
|
10:00 AM
|
||
|
|
10:30 AM
|
||
|
|
|
||
|
|
حالات الاجتماع:
|
||
|
|
أضف status لكل اجتماع:
|
||
|
|
- scheduled = مجدول
|
||
|
|
- confirmed = مؤكد
|
||
|
|
- needs_confirmation = يحتاج تأكيد
|
||
|
|
- modified = معدل
|
||
|
|
- postponed = مؤجل
|
||
|
|
- cancelled = ملغي
|
||
|
|
- completed = مكتمل
|
||
|
|
|
||
|
|
طلبات التعديل:
|
||
|
|
كل طلب تعديل له دورة حياة:
|
||
|
|
- new = جديد
|
||
|
|
- under_office_review = قيد مراجعة مدير المكتب
|
||
|
|
- approved = معتمد
|
||
|
|
- sent_to_coordination = مرسل للتنسيق
|
||
|
|
- in_progress = قيد التنفيذ
|
||
|
|
- completed = تم التنفيذ
|
||
|
|
- rejected = مرفوض
|
||
|
|
- closed = مغلق
|
||
|
|
|
||
|
|
أنواع طلبات الرئيس:
|
||
|
|
- تعديل وقت
|
||
|
|
- إلغاء
|
||
|
|
- تأجيل
|
||
|
|
- إضافة ملاحظة
|
||
|
|
- إضافة حضور
|
||
|
|
- حذف حضور
|
||
|
|
- تعديل مكان
|
||
|
|
- تعديل رابط اجتماع
|
||
|
|
|
||
|
|
التنبيهات:
|
||
|
|
أضف نظام تنبيهات قابل للإعداد من مدير المكتب:
|
||
|
|
- قبل الاجتماع بـ 15 دقيقة
|
||
|
|
- قبل الاجتماع بـ 5 دقائق
|
||
|
|
- عند طلب تعديل من الرئيس
|
||
|
|
- عند اعتماد مدير المكتب
|
||
|
|
- عند تنفيذ التعديل
|
||
|
|
- عند تغيير وقت الاجتماع
|
||
|
|
- عند إلغاء الاجتماع
|
||
|
|
|
||
|
|
Font Settings:
|
||
|
|
أضف صفحة إعدادات الخط داخل التطبيق:
|
||
|
|
- اختيار نوع الخط
|
||
|
|
- دعم رفع خط مخصص لاحقًا
|
||
|
|
- حجم الخط 12 / 14 / 16 / 18
|
||
|
|
- السماكة Regular / Medium / Bold
|
||
|
|
- محاذاة النص
|
||
|
|
- حفظ الإعدادات وتطبيقها على الجدول و PDF
|
||
|
|
|
||
|
|
PDF:
|
||
|
|
رغم أن الهدف تقليل الاعتماد على PDF، أريد:
|
||
|
|
- Export PDF
|
||
|
|
- Download PDF
|
||
|
|
- Send PDF placeholder فقط إذا لا يوجد نظام إرسال
|
||
|
|
- Archive PDF by date
|
||
|
|
- PDF يستخدم نفس تصميم الجدول
|
||
|
|
- PDF يحتوي Logo Header
|
||
|
|
- PDF يدعم العربية RTL
|
||
|
|
|
||
|
|
Database:
|
||
|
|
أضف الجداول أو الموديلات اللازمة بدون كسر الموجود:
|
||
|
|
- executive_meetings
|
||
|
|
- executive_meeting_attendees
|
||
|
|
- executive_meeting_requests
|
||
|
|
- executive_meeting_tasks
|
||
|
|
- executive_meeting_notifications
|
||
|
|
- executive_meeting_audit_logs
|
||
|
|
- executive_meeting_pdf_archives
|
||
|
|
- executive_meeting_font_settings
|
||
|
|
|
||
|
|
البيانات المطلوبة للاجتماع:
|
||
|
|
- id
|
||
|
|
- dailyNumber
|
||
|
|
- titleAr
|
||
|
|
- titleEn
|
||
|
|
- date
|
||
|
|
- startTime
|
||
|
|
- endTime
|
||
|
|
- location
|
||
|
|
- meetingUrl
|
||
|
|
- platform: none/webex/teams/zoom/other
|
||
|
|
- status
|
||
|
|
- notes
|
||
|
|
- attachments
|
||
|
|
- createdBy
|
||
|
|
- updatedBy
|
||
|
|
- timestamps
|
||
|
|
|
||
|
|
الحضور:
|
||
|
|
- meetingId
|
||
|
|
- name
|
||
|
|
- title optional
|
||
|
|
- attendanceType: internal / virtual / external
|
||
|
|
- sortOrder
|
||
|
|
|
||
|
|
طلبات التعديل:
|
||
|
|
- meetingId
|
||
|
|
- requestedBy
|
||
|
|
- requestType
|
||
|
|
- requestDetails
|
||
|
|
- status
|
||
|
|
- reviewedBy
|
||
|
|
- reviewDecision
|
||
|
|
- reviewNotes
|
||
|
|
- assignedTo
|
||
|
|
- timestamps
|
||
|
|
|
||
|
|
المهام:
|
||
|
|
- requestId
|
||
|
|
- assignedTo
|
||
|
|
- taskType
|
||
|
|
- status
|
||
|
|
- dueAt
|
||
|
|
- completedAt
|
||
|
|
- notes
|
||
|
|
|
||
|
|
Audit Log:
|
||
|
|
أي تعديل على اجتماع أو طلب يجب تسجيله:
|
||
|
|
- action
|
||
|
|
- entityType
|
||
|
|
- entityId
|
||
|
|
- oldValue
|
||
|
|
- newValue
|
||
|
|
- performedBy
|
||
|
|
- performedAt
|
||
|
|
|
||
|
|
متطلبات الواجهة:
|
||
|
|
- تصميم رسمي جدًا.
|
||
|
|
- مناسب للآيباد أولًا.
|
||
|
|
- Responsive للجوال والمتصفح.
|
||
|
|
- دعم RTL ممتاز.
|
||
|
|
- لا تستخدم تصميم كروت للجدول الرئيسي؛ الجدول الرسمي هو الأساس.
|
||
|
|
- استخدم الصورة المرفقة كمرجع للشكل النهائي.
|
||
|
|
- لا تجعل الحضور عموديًا إلا إذا ضاق العرض جدًا في الجوال.
|
||
|
|
|
||
|
|
المطلوب في التنفيذ الأول:
|
||
|
|
1. إنشاء Module Executive Meetings في القائمة.
|
||
|
|
2. إنشاء صفحة جدول الاجتماعات اليومية بنفس تصميم الصورة.
|
||
|
|
3. إضافة بيانات تجريبية مشابهة للصورة.
|
||
|
|
4. تنفيذ عرض الحضور الأفقي باستخدام flex-wrap أو grid.
|
||
|
|
5. إضافة Header فيه Logo + اسم التطبيق.
|
||
|
|
6. إضافة أزرار PDF و Font Settings.
|
||
|
|
7. إنشاء صفحات Placeholder لباقي الأقسام.
|
||
|
|
8. تجهيز قاعدة البيانات والـ API الأساسية.
|
||
|
|
9. عدم كسر أي شيء موجود في النظام الحالي.
|
||
|
|
|
||
|
|
بعد التنفيذ اشرح لي:
|
||
|
|
- الملفات التي تم تعديلها.
|
||
|
|
- الملفات التي تم إنشاؤها.
|
||
|
|
- الجداول التي أضيفت.
|
||
|
|
- كيف أختبر الصفحة.
|
||
|
|
- ما الذي لم يتم تنفيذه بعد.
|