Bankist

نظرة عامة:

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

HTML5 + CSS + JavaScript ES6 وواجهة مرنة تعتمد على نظام Grid + Flexbox. الوظائف الأساسية:

1. نظام تسجيل الدخول (Login System):

المستخدم يمكنه تسجيل الدخول باستخدام اسم مستخدم وكلمة مرور (PIN).

يتم التحقق من بيانات الحساب عبر البحث في بيانات مخزنة مسبقًا (mocked data).

عند الدخول، يتم تحديث الواجهة بالكامل وعرض اسم المستخدم الحالي والبيانات المالية الخاصة به.

2. عرض الرصيد الحالي (Current Balance):

يتم حساب الرصيد تلقائيًا من سجل الحركات المالية.

يتم عرض التاريخ الحالي بتنسيق محلي (Locale Based Formatting) باستخدام Intl.DateTimeFormat.

3. سجل الحركات (Transactions Movements):

عرض تفصيلي لكل عمليات الإيداع (deposit) والسحب (withdrawal).

يتم تمييز كل حركة بلون وتاريخ منفصل.

يمكن فرز الحركات تصاعديًا / تنازليًا باستخدام زر "SORT".

4. التحويل البنكي (Money Transfer):

يمكن للمستخدم تحويل مبلغ إلى مستخدم آخر داخل النظام.

التحقق من الرصيد الكافي ورفض التحويل إن لم تتوفر الشروط.

5. طلب قرض (Loan Request):

المستخدم يستطيع طلب قرض.

يتم قبول القرض فقط إذا كانت هناك حركة سابقة بقيمة 10% على الأقل من القرض.

القرض يُضاف بعد تأخير محاكي (simulate async) باستخدام setTimeout.

6. إغلاق الحساب (Close Account):

يمكن للمستخدم حذف حسابه من النظام عبر إدخال اسم المستخدم وكلمة المرور.

7. تسجيل الخروج التلقائي (Auto Logout Timer):

يتم تسجيل الخروج تلقائيًا بعد 5 دقائق من عدم النشاط.

العد التنازلي يظهر بشكل حي في الركن السفلي. البيانات ١: pin:1111 user:ay d البيانات ٢: pin:2222 user: jd