ADD css, config.toml

.streamlit/config.toml

@@ -0,0 +1,7 @@
+[theme]
+base="dark"
+primaryColor="#1abc9c"
+backgroundColor="#2c3e50"
+secondaryBackgroundColor="#34495e"
+textColor="#ffffff"
+font="sans serif"

main.py

@@ -8,6 +8,16 @@ from dotenv import load_dotenv
 # Load environment variables from .env file
 load_dotenv()
 
+# Set Page Name
+st.set_page_config(page_title="Reporting")
+
+
+# Load custom CSS
+def load_css(file_name):
+    with open(file_name) as f:
+        st.markdown(f'<style>{f.read()}</style>', unsafe_allow_html=True)
+
+load_css('style.css')
 
 # Function to get filtered data from the database
 def get_filtered_data(customer_id, service_id, start_date, end_date):
@@ -68,6 +78,7 @@ def get_initial_data():
     date_query = """
         SELECT MIN(reportingdate) AS min_date, MAX(reportingdate) AS max_date 
         FROM Kunden.`services.reporting`
+        WHERE customer_ID = 5
     """
     date_range = pd.read_sql_query(date_query, mydb)
     mydb.close()
@@ -75,10 +86,16 @@ def get_initial_data():
     return service_ids, customers, date_range
 
 
+# Define page functions
+def home():
+    st.title("Home Page")
+    st.write("Welcome to the Home Page!")
+
+
+def services_reporting():
+    st.title("Reporting :mag_right:")
     # Get initial data for widgets
     initial_service_ids, customers, initial_date_range = get_initial_data()
-
-
     # Combine service_ID and name for display
     service_options = initial_service_ids.apply(lambda row: f"{row['service_ID']} - {row['name']}", axis=1)
 
@@ -129,3 +146,22 @@ if st.button('Apply Filters'):
             st.bar_chart(filtered_data.set_index('month')['count'])
         else:
             st.write("No data available for the selected filters.")
+
+
+
+
+if 'page' not in st.session_state:
+    st.session_state.page = 'Home'
+
+# Sidebar navigation
+st.sidebar.title("Navigation")
+if st.sidebar.button('Home'):
+    st.session_state.page = 'Home'
+if st.sidebar.button('Services Reporting'):
+    st.session_state.page = 'Services Reporting'
+
+# Page display logic
+if st.session_state.page == 'Home':
+    home()
+elif st.session_state.page == 'Services Reporting':
+    services_reporting()

style.css

@@ -0,0 +1,35 @@
+/* style.css */
+.sidebar .sidebar-content {
+    background-color: #f8f9fa;
+}
+
+.stButton>button {
+    color: white;
+    background-color: #00000000;
+    border-bottom-color: #fcbb2e;
+    border-radius: 5px;
+    padding: 10px 20px;
+    font-size: 16px;
+    cursor: pointer;
+}
+
+.stButton>button:hover {
+    color: white;
+    background-color: #00000029;
+    border-color: #00000029;
+}
+
+.stButton>button:focus:not(:active) {
+    color: white;
+    background-color: #00000000;
+    border-bottom-color: #fcbb2e;
+    border-color: unset;
+    border-radius: 5px;
+    padding: 10px 20px;
+    font-size: 16px;
+    cursor: pointer;
+
+}
+.st-d7 , .st-d6 ,.st-d5 ,.st-d4 {
+    border-color: #fcbb2e;
+}