Create improved_sidebar.py

utils/components/improved_sidebar.py

@@ -0,0 +1,211 @@
+"""
+مكون الشريط الجانبي المحسن
+"""
+
+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