Spaces:
Paused
Paused
| """ | |
| مكون الشريط الجانبي المحسن | |
| """ | |
| import streamlit as st | |
| from datetime import datetime | |
| # استيراد ملف التكوين الحالي | |
| from config import APP_TITLE, UI_THEME, DEFAULT_MODULE, STATIC_DIR | |
| from streamlit_option_menu import option_menu | |
| def render_sidebar(): | |
| """ | |
| عرض وإدارة الشريط الجانبي بتصميم احترافي | |
| الإرجاع: | |
| اسم الوحدة المحددة | |
| """ | |
| # تحديد الألوان بناءً على سمة واجهة المستخدم | |
| if UI_THEME == "dark": | |
| primary_color = "#3498db" | |
| secondary_color = "#ff9a3c" | |
| bg_color = "#1e1e1e" | |
| text_color = "#ffffff" | |
| sidebar_bg = "#2d2d2d" | |
| else: | |
| primary_color = "#2c3e50" | |
| secondary_color = "#ff9a3c" | |
| bg_color = "#f8f9fa" | |
| text_color = "#333333" | |
| sidebar_bg = "#f0f2f6" | |
| # تطبيق CSS مخصص لتحسين مظهر الشريط الجانبي | |
| st.markdown(f""" | |
| <style> | |
| /* تنسيق الشريط الجانبي بالكامل */ | |
| section[data-testid="stSidebar"] {{ | |
| background-color: {bg_color}; | |
| direction: rtl; | |
| }} | |
| /* تنسيق حاوية اللوجو */ | |
| .logo-container {{ | |
| display: flex; | |
| justify-content: center; | |
| margin-bottom: 10px; | |
| padding: 15px 0; | |
| }} | |
| /* تنسيق عنوان التطبيق */ | |
| .app-title {{ | |
| text-align: center; | |
| color: {primary_color}; | |
| font-weight: bold; | |
| font-size: 1.2rem; | |
| margin-bottom: 15px; | |
| padding-bottom: 10px; | |
| border-bottom: 1px solid #e0e0e0; | |
| }} | |
| /* تنسيق القوائم */ | |
| .css-1544g2n {{ | |
| padding-right: 0 !important; | |
| }} | |
| /* تنسيق عناصر القائمة */ | |
| .nav-link {{ | |
| text-align: right !important; | |
| padding: 10px 15px !important; | |
| margin: 5px 0 !important; | |
| border-radius: 5px !important; | |
| transition: all 0.3s ease !important; | |
| }} | |
| /* تنسيق الأيقونات */ | |
| .nav-link i {{ | |
| margin-left: 10px !important; | |
| margin-right: 0 !important; | |
| }} | |
| /* تنسيق القائمة المحددة */ | |
| .nav-link-selected {{ | |
| background-color: {secondary_color} !important; | |
| color: white !important; | |
| font-weight: bold !important; | |
| }} | |
| /* تنسيق معلومات المشروع */ | |
| .project-info {{ | |
| background-color: {sidebar_bg}; | |
| padding: 10px; | |
| border-radius: 5px; | |
| margin-top: 10px; | |
| margin-bottom: 10px; | |
| }} | |
| /* تنسيق معلومات المستخدم */ | |
| .user-info {{ | |
| background-color: {sidebar_bg}; | |
| padding: 10px; | |
| border-radius: 5px; | |
| margin-top: 10px; | |
| }} | |
| /* تنسيق الفواصل */ | |
| hr {{ | |
| margin: 15px 0; | |
| border-color: #e0e0e0; | |
| }} | |
| /* تنسيق الأزرار */ | |
| .stButton button {{ | |
| width: 100%; | |
| background-color: {primary_color}; | |
| color: white; | |
| border: none; | |
| padding: 8px 0; | |
| border-radius: 5px; | |
| transition: all 0.3s ease; | |
| }} | |
| .stButton button:hover {{ | |
| background-color: {primary_color}dd; | |
| }} | |
| </style> | |
| """, unsafe_allow_html=True) | |
| with st.sidebar: | |
| # إضافة اللوجو بتنسيق مخصص | |
| st.markdown('<div class="logo-container">', unsafe_allow_html=True) | |
| st.image("static/images/logo.png", width=180) | |
| st.markdown('</div>', unsafe_allow_html=True) | |
| # إضافة عنوان التطبيق | |
| st.markdown(f'<div class="app-title">{APP_TITLE.split("-")[0].strip()}</div>', unsafe_allow_html=True) | |
| # إنشاء قائمة الخيارات باستخدام مكتبة streamlit_option_menu | |
| selected_module = option_menu( | |
| "", # إزالة العنوان لأننا أضفناه بشكل منفصل أعلاه | |
| [ | |
| "الرئيسية", | |
| "إدارة المشاريع", | |
| "التسعير المتكاملة", | |
| "الموارد والتكاليف", | |
| "تحليل المستندات", | |
| "تحليل المخاطر", | |
| "التقارير والتحليلات", | |
| "المساعد الذكي" | |
| ], | |
| icons=[ | |
| 'house-fill', | |
| 'folder-fill', | |
| 'calculator-fill', | |
| 'tools', | |
| 'file-earmark-text-fill', | |
| 'exclamation-triangle-fill', | |
| 'bar-chart-fill', | |
| 'robot' | |
| ], | |
| menu_icon=None, # إزالة أيقونة القائمة | |
| default_index=0, | |
| styles={ | |
| "container": {"padding": "0px", "background-color": "transparent"}, | |
| "icon": {"color": primary_color, "font-size": "18px"}, | |
| "nav-link": {"font-size": "14px", "text-align": "right", "margin": "5px 0px", "padding": "10px 15px"}, | |
| "nav-link-selected": {"background-color": secondary_color, "color": "white", "font-weight": "bold"}, | |
| } | |
| ) | |
| # إضافة فاصل | |
| st.markdown("<hr>", unsafe_allow_html=True) | |
| # إضافة معلومات المشروع الحالي | |
| if 'current_project' in st.session_state and st.session_state.current_project: | |
| project = st.session_state.current_project | |
| st.markdown('<div class="project-info">', unsafe_allow_html=True) | |
| st.markdown("### المشروع الحالي") | |
| st.markdown(f"**{project['name']}**") | |
| st.markdown(f"رقم المناقصة: {project['number']}") | |
| st.markdown(f"الجهة المالكة: {project['client']}") | |
| st.markdown('</div>', unsafe_allow_html=True) | |
| # إضافة زر للتبديل بين المشاريع | |
| if st.button("تبديل المشروع"): | |
| # لتنفيذ في مرحلة لاحقة | |
| pass | |
| # إضافة معلومات المستخدم | |
| if 'user_info' in st.session_state and st.session_state.user_info: | |
| user = st.session_state.user_info | |
| st.markdown("<hr>", unsafe_allow_html=True) | |
| st.markdown('<div class="user-info">', unsafe_allow_html=True) | |
| st.markdown("### معلومات المستخدم") | |
| st.markdown(f"**{user['full_name']}**") | |
| st.markdown(f"الدور: {user['role']}") | |
| st.markdown('</div>', unsafe_allow_html=True) | |
| # إضافة زر لتسجيل الخروج | |
| if st.button("تسجيل الخروج"): | |
| st.session_state.is_authenticated = False | |
| st.session_state.user_info = None | |
| st.rerun() | |
| # إضافة معلومات النسخة | |
| st.markdown("<hr>", unsafe_allow_html=True) | |
| st.markdown(f"الإصدار: 1.0.0") | |
| st.markdown(f"تاريخ الإصدار: 2025-03-15") | |
| st.markdown(f"© 2025 شركة شبه الجزيرة للمقاولات") | |
| return selected_module | |