نظام التصميم
مرجع مكوّنات منصة مهاد لإدارة مرافق إسكان الحجاج · الإصدار 1.0
موسم الحج 1446هـ مباشر
01

الهوية والألوان

لوحة الألوان الرسمية للمنصة مستخرجة من الموك آب المعتمد. تُستخدم جميعها عبر متغيّرات CSS (Design Tokens) لضمان الاتساق. لكل لون أساسي تدرّجات مشتقة للحالات (تمرير / ضغط / معطّل).

ألوان الهوية والأزرار
#002E2C
خلفية القائمة الجانبية
--sidebar-bg
خلفية الشريط الجانبي الداكن في كل البوابات.
#055636
العنصر النشط
--sidebar-active
خلفية عنصر القائمة المحدد حالياً.
#02623D
اللون الأساسي (Primary)
--primary
أزرار الإجراء الرئيسية مثل «إضافة عقار جديد».
أساسي
تمرير
ضغط
معطّل
#168E5B
نجاح / ممتثل
--success
الحالات المكتملة والمقبولة والامتثال الكامل.
أساسي
تمرير
خلفية
#F4A20E
تحذير / قيد التنفيذ
--warning
قيد التنفيذ، نجوم التقييم، أشرطة التقدم الكهرمانية (#EC9F33).
أساسي
تمرير
كهرماني
خلفية
#FF1E2D
خطر / غير مطابق
--danger
الأخطاء، المخالفات، الحالات غير المقبولة.
أساسي
تمرير
ضغط
خلفية
شارات دورة حياة العقار
#E2D4F8
قيد التفاوض
--pill-negotiation
بنفسجي فاتح، نص غامق.
#FEE6BA
قيد الترخيص
--pill-licensing
أصفر فاتح، نص غامق.
#FCBC7C
قيد التأهيل
--pill-qualifying
برتقالي فاتح، نص غامق.
#527E69
جاهز للتسويق
--pill-ready
أخضر رمادي، نص أبيض.
الأسطح والحياد
#F7F8F9
خلفية الصفحة
--bg
#FFFFFF
البطاقات
--card
حواف 12–16px + ظل خفيف جداً.
#B49A6A
ذهبي الهوية
--gold
لمسات تمييز مشتقة من الشعار.
#14251F
النص الأساسي
--text
/* الاستخدام عبر المتغيّرات */
.btn--primary { background: var(--primary); }
.card        { background: var(--card); border-radius: 14px; }
02

التايبوغرافي

خط واحد في كامل المنصة: IBM Plex Sans Arabic (أوزان 400 / 500 / 600 / 700). ارتفاع السطر لا يقل عن 1.7 للنصوص. الأرقام الإحصائية تستخدم أرقاماً جدولية (tabular-nums) لمحاذاة الأعمدة.

السلّم النصي

إدارة مرافق إسكان الحجاج

H1 · 34/700

لوحة تحكم المفتش الميداني

H2 · 26/700

تقرير الامتثال لحي العزيزية

H3 · 21/700

قائمة المرافق المرخصة موسمياً

H4 · 18/600
بيانات المالك والتواصل
H5 · 15/600
نص أساسي (Body): يتم تقييم كل مرفق وفق معايير الجهات التنظيمية الأربع قبل إصدار الترخيص الموسمي، ويُحدَّث كشف الجاهزية تلقائياً عند رفع مستندات الأهلية.
Body · 15/400 · lh 1.75
نص مساعد (Caption): آخر تحديث قبل 12 دقيقة · مصدر البيانات: قاعدة البيانات المركزية
Caption · 12.5/400
أرقام الإحصائيات (tabular-nums)
2,769
إجمالي العقارات
1,293
مرخصة سنوياً
73.4٪
متوسط الامتثال
487
غير مرخصة
.num { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.stat-xl { font-size: 44px; font-weight: 700; }
03

الأزرار

أنواع الأزرار وحالاتها وأحجامها. كل زر له حالة تمرير وضغط، ولا يوجد أي زر «ديكوري» - جرّب النقر.

الأنواع
.btn.btn--primary   /* الإجراء الأساسي */
.btn.btn--secondary /* حد أخضر شفاف */
.btn.btn--danger · .btn--success · .btn--link · .btn--icon
الحالات والأحجام
حالات خاصة
الأحجام
04

الشارات والحالات

مفردات الحالة الموحّدة في كل البوابات. تُستخدم بنفس المسميات والألوان بلا استثناء لتجنّب أي تناقض بين الشاشات.

دورة حياة العقار
قيد التفاوض قيد الترخيص قيد التأهيل جاهز للتسويق
حالة الطلب · حالة الامتثال
حالة الطلب (موحّدة)
مقبول قيد المراجعة غير مقبول
حالة الامتثال
ممتثل امتثال جزئي مخالف غير مرخص مقرر هدمه
حالة المتطلب (بأيقونة) - كما في جداول التأهيل
قيد التنفيذ مكتمل غير مطابق
الأولوية
عالية متوسطة منخفضة
المخالفات · الحسابات · الموسم
حالة المخالفة
مفتوحة قيد المعالجة مغلقة
حالة الحساب
نشط موقوف
شارة الموسم (تظهر في هيدر كل الداشبوردات)
موسم الحج 1446هـ مباشر
.pill.pill--accepted  /* مقبول */
.pill.pill--review    /* قيد المراجعة */
.pill.pill--rejected  /* غير مقبول */
05

بطاقات الإحصائيات

البطاقة القياسية للمؤشرات: عنوان بأيقونة في المنتصف + رقم كبير + سطر مقارنة، كلها متمركزة. وتتوفر نسخة بحالة ملوّنة (أخضر/كهرماني/أحمر) لمراحل المسار.

صف الإحصاء (كما في شاشات التأهيل والترخيص)
جاهزية السلامة
75٪
9 / 12
قيد التنفيذ
الحالة العامة
قيد التنفيذ
3 ملاحظات تحتاج إلى معالجة
آخر تقييم
20 مايو 2025
تقييم مبدئي · فريق مهاد
المتطلب التالي
تقرير سلامة معتمد
متبقٍّ 7 أيام · 10 يونيو 2025
بطاقة مؤشر أفقية (كما في شاشة «مباني الحج»)
إجمالي المباني
4
مبانٍ تديرها المنشأة
البطاقة القياسية
إجمالي العقارات
2,769
في قاعدة البيانات المركزية
المرافق المرخّصة
1,293
▲ 127 عن موسم 1445هـ
متوسط الامتثال
73.4٪
▼ 11.6 دون هدف 85٪
أيام متبقية
47
متوسط الترخيص 18 يوم
بطاقة مؤشر بحالة ملوّنة (بديل عصري للحد الجانبي)
مرخّص جاهز
847
65.5٪ من مسار الترخيص
قيد المراجعة
312
تفتيشات منجزة: 1,087
مرفوض / ناقص
134
يتطلب استكمال مستندات
06

أشرطة التقدم والحلقات

أشرطة خطية وحلقات دائرية لنسب الجاهزية والامتثال. اللون يتبع الحالة: أخضر ≥ 85٪، كهرماني 60–84٪، أحمر أقل من 60٪. مع نجوم التقييم الكهرمانية.

أشرطة التقدم الخطية
برج الساعة بلازا - امتثال91٪
شقق الزمزم - امتثال72٪
نزل الأمل - امتثال46٪
الحلقات الدائرية (Donut) - لون حسب الحالة
91٪
جاهزية
كبير · أخضر
73٪
متوسط · كهرماني
46٪
صغير · أحمر
.ring { background: conic-gradient(var(--rc) calc(var(--p)*3.6deg), var(--ring-track) 0); }
/* --p = النسبة · --rc = لون الحالة · --hole = سماكة الحلقة */
نجوم التقييم الكهرمانية
07

الجداول

الجدول القياسي بترقيم صفحات حقيقي (10 صفوف/صفحة) وعدّاد نتائج وبحث فوري وشريط امتثال داخل الخلية. جرّب البحث والتنقّل بين الصفحات وتحديد الصفوف.

جدول المرافق - 14 صفاً
رقم الرخصةالمرفقالحيالتصنيفالأسرّةالامتثالالحالةإجراءات
LIC-2219برج الساعة بلازاالحرم المكي51,200
91٪
ممتثل
LIC-6605أبراج مكة الملكيةالحرم المكي51,500
93٪
ممتثل
LIC-3120فندق دار التوحيدالحرم المكي5900
88٪
ممتثل
LIC-1176فندق المسفلة جراندالمسفلة4610
86٪
ممتثل
LIC-5471فندق النخيلأجياد4520
85٪
ممتثل
LIC-2044نزل السلامالمسفلة-160
83٪
جزئي
LIC-8834فندق قريشأجياد4450
80٪
جزئي
LIC-9002نزل أجياد الحرمأجياد3310
77٪
جزئي
LIC-9917شقق الزمزمالمسفلة-280
72٪
جزئي
LIC-7788فندق العزيزية بلازاالعزيزية3240
68٪
جزئي
LIC-5290دار الرحمةالعزيزية3200
63٪
جزئي
LIC-4782نزل الأملالعزيزية-120
46٪
مخالف
LIC-8321نزل الفجرالمعابدة-90
41٪
مخالف
- بلا رخصةمبنى الشبيكة 7الشبيكة-70
29٪
غير مرخص
LIC-1088دار المعابدةالمعابدة-140
52٪
مخالف
عرض 1–10 من 14
جدول المتطلبات + تبويبات التصفية (كما في شاشة السلامة)
المتطلبالحالةالأولويةآخر تحديثالإجراء
تقرير سلامة معتمد من الدفاع المدني
قيد التنفيذعالية20 مايو 2025
مخطط الإخلاء معتمد
مكتملعالية18 مايو 2025
أنظمة الإنذار والحريق
قيد التنفيذعالية17 مايو 2025
طفايات الحريق وصيانتها
مكتملمتوسطة10 مايو 2025
إنارة الطوارئ
غير مطابقعالية19 مايو 2025
لوحات الإرشاد والسلامة
مكتملمنخفضة12 مايو 2025
تدريب العاملين على السلامة
قيد التنفيذمتوسطة16 مايو 2025
فحص السلامة الإنشائية الدوري
لم يبدأمتوسطة-
حالة الجدول الفارغ (Empty State)

لا توجد نتائج مطابقة

لم نعثر على أي مرفق يطابق عوامل التصفية الحالية. جرّب توسيع نطاق البحث أو مسح عوامل التصفية.

08

النماذج

حقول الإدخال بكل حالاتها. رسائل الخطأ محددة بدقة وتظهر أسفل الحقل الناقص. القوائم المنسدلة معبأة بخيارات حقيقية. اضغط «تحقّق» لرؤية التحقق الحي، وجرّب رفع ملف.

الحقول النصية والقوائم
رابط خرائط جوجل مطلوب
حقل تلقائي غير قابل للتعديل
+966
وزارة السياحة الدفاع المدني
نوع المرفق (Radio)
إقرارات (Checkbox)
حالة الحساب (Toggle)
رفع الملفات
اسحب الملف هنا أو تصفّح جهازك
PDF أو صورة · الحد الأقصى 3MB
أضف صوراً للواجهة والغرف تصفّح
JPG / PNG · معرض مصغّرات
09

التبويبات

تبويبات رئيسية أفقية، وتبويبات فرعية (Pills)، وتبويبات نموذج العقار الخمسة مع مؤشر إكمال لكل تبويب. كلها تعمل - جرّب التنقّل.

تبويبات رئيسية + فرعية
نظرة عامة على المرفق: 1,200 سرير · 600 غرفة · تصنيف 5 نجوم · على بُعد 200م من الحرم · نسبة الجاهزية 91٪.
تبويبات فرعية (Pills)
تفتيشات اليوم: 23 مرفقاً · 4 مخالفات جديدة.
تبويبات نموذج العقار الخمسة - مع مؤشر الإكمال
✔ اكتملت البيانات الأساسية: الاسم، الحي، التصنيف، عدد الأسرّة والغرف، بُعد المرفق عن الحرم.
10

المكونات المركبة

مكوّنات جاهزة تجمع العناصر الأساسية: بطاقة العقار، المحادثات، الإشعارات، الأكورديون، النوافذ المنبثقة، مسار الخطوات وغيرها.

بطاقة العقار الكاملة
قيد التفاوض
سكن الروضة
المنطقة المركزية – مكة
1,480
سرير
4.2
تقييم
الترخيص
75٪
الجاهزية
88٪
التعاقدات
2
بعثة
قيد الترخيص
برج النور
العزيزية – مكة
650
سرير
3.8
تقييم
الترخيص
81٪
الجاهزية
81٪
التعاقدات
1
بعثة
قيد التأهيل
دار الضيافة
العزيزية – مكة
300
سرير
3.6
تقييم
الترخيص
40٪
الجاهزية
63٪
التعاقدات
0
بعثة
جاهز للتسويق
فندق السلام
المنطقة المركزية – مكة
420
سرير
4.6
تقييم
الترخيص
90٪
الجاهزية
92٪
التعاقدات
2
بعثة
المحادثات وفقاعات الشات
م ع
مالك برج الساعة
تم رفع شهادة الدفاع المدني المحدّثة
2
ف ن
مفتش القطاع الأول
بانتظار موعد إعادة التفتيش
ب إ
بعثة إندونيسيا
شكراً، تم تأكيد التعاقد على 1,200 سرير
السلام عليكم، هل اكتمل رفع مستندات الأهلية لبرج الساعة؟
وعليكم السلام، نعم تم رفع رخصة البلدية وشهادة الدفاع المدني.
10:22 ص
ممتاز، سنجدول التفتيش الميداني خلال 48 ساعة.
تمام، بانتظاركم.
10:24 ص
الإشعارات
مخالفة جديدة - نزل الأمل
تم تسجيل مخالفة VIO-1446-0031 (مخارج طوارئ غير مطابقة) بحي العزيزية.
قبل 14 دقيقة
تم اعتماد الترخيص - فندق النخيل
صدر الترخيص الموسمي LIC-5471 بنجاح بعد اكتمال المراجعة.
قبل ساعتين
طلب قيد المراجعة - فندق قريش
الطلب REQ-2026-0147 بانتظار مراجعة مستندات الأهلية المتقدمة.
أمس · 4:10 م
الأكورديون · النوافذ · التنبيهات · المسار · الفتات
Accordion - جرّب الفتح
ما معايير الجهات التنظيمية الأربع؟
يُقيَّم كل مرفق وفق أربع جهات: وزارة السياحة، الدفاع المدني (الكود السعودي)، البلدية/الأمانة، ووزارة الحج والعمرة - ويُحسب متوسط الامتثال العام منها.
كيف تُحتسب نسبة الجاهزية؟
تُحسب تلقائياً بعد اكتمال تبويبات نموذج العقار الخمسة، وتأخذ الحلقة الدائرية لونها حسب النسبة.
متى يتحول المرفق إلى «جاهز للتسويق»؟
عند صدور الترخيص الموسمي واكتمال كشف الجاهزية بنسبة امتثال لا تقل عن 85٪.
النوافذ المنبثقة والتنبيهات
مسار التنقّل (Breadcrumb)
مسار الخطوات (Stepper)
التسجيل
رفع المستندات
3المراجعة
4الاعتماد
لوحة تفاصيل المتطلب · قائمة المستندات · قائمة النصائح
إنارة الطوارئ
غير مطابق
الوضع الحالي
تم رصد نقص في إنارة الممرات في الطابق الثاني.
الوضع المطلوب
توفير إنارة طوارئ في جميع الممرات والمخارج.
الفجوة
عدد وحدات الإنارة أقل من المطلوب في 12 موقعاً.
الإجراء المطلوب
تركيب وحدات إنارة طوارئ إضافية وفق المتطلبات.
المسؤولالمشغّل
الموعد المستهدف10 يونيو 2025 · متبقٍّ 7 أيام
مستندات السلامة
PDF
تقرير السلامة
تم الرفع 20 مايو 2025
PDF
شهادة تركيب أنظمة الحريق
تم الرفع 15 مايو 2025
PDF
مخطط الإخلاء
تم الرفع 18 مايو 2025
نصائح وتحسينات
إعداد جدول صيانة دوري لأنظمة السلامة.
تدريب العاملين على الإخلاء بشكل منتظم.
التأكد من وضوح مخارج الطوارئ دائماً.
بطاقة الرحلة (Stepper أفقي)
رحلة الحصول على التصنيف
البيانات الأساسية
المتطلبات
3التقييم
4التصنيف
أنت في مرحلة التقييم
سيتم مراجعة المتطلبات من قبل فريق وزارة السياحة.
11

مخطط Pipeline

مسار الترخيص كمكوّن قابل لإعادة الاستخدام - دوائر ملوّنة متصلة تمثّل مراحل الطلبات من التقديم حتى الترخيص الجاهز.

مسار الترخيص · موسم 1446هـ
446
لم يتقدّم بعد
312
قيد المراجعة
134
مرفوض / ناقص
154
موافقة مبدئية
847
مرخّص جاهز
65.5٪
12

الخريطة التخطيطية

خريطة امتثال أحياء مكة المكرمة مبنية بالكامل بـ HTML/CSS (بدون مكتبات خارجية). حجم كل بلوك يعكس عدد المرافق، ولونه يعكس نسبة الامتثال. انقر أي حي لعرض تفاصيله.

خريطة أحياء مكة - حية وتفاعلية
توزيع مرافق إسكان الحجاج حسب الحيالحجم = عدد المرافق · اللون = نسبة الامتثال
ممتثل (≥ 85٪) جزئي (60–84٪) مخالف (أقل من 60٪)
خريطة المملكة - توزيع المرافق حسب المنطقة
المرافق المسجلة بقاعدة البيانات المركزية - 2,769 مرفقاًاللون يتدرّج مع العدد · انقر أي منطقة
أقل أكثر - مكة المكرمة 2,145
13

القائمة الجانبية والهيدر

هيكل البوابة الكامل: القائمة الجانبية الداكنة على اليمين (شعار مهاد، عناصر بأيقونات، مجموعات قابلة للطي، شارات عدّاد، بطاقة المستخدم، تسجيل الخروج) والهيدر العلوي (أيقونات الإشعارات والرسائل والمساعدة، شارة الموسم، منتقي المنشأة). كل العناصر تعمل - جرّب الطي والتنقل.

هيكل البوابة (Sidebar + Header)
فندق السلام
موسم الحج 1446هـ
منطقة المحتوى الرئيسية
تُعرض هنا شاشات كل دور: لوحة التحكم، العقارات، التفتيش، التراخيص، التقارير…