import pandas as pd
import streamlit as st
import plotly.express as px

# Carga del archivo CSV
df = pd.read_csv('data/po_excel_original.csv')

def top_5():
    # Ordenar el DataFrame por el total de forma descendente
    df_sorted = df.sort_values("Total", ascending=False)

    # Título para los filtros laterales
    st.sidebar.title("Filtros Ventas Anuales TOP clientes")

    # Crear los controles interactivos para los filtros en la barra lateral
    filtro_x = st.sidebar.slider("Monto mínimo de compras", min_value=0, max_value=int(df_sorted["Total"].max()),
                         value=100, step=1)

    # Aplicar los filtros al DataFrame
    df_filtrado = df_sorted[df_sorted["Total"] >= filtro_x]

    # Control para la cantidad de clientes a mostrar
    filtro_n = st.sidebar.slider("Cantidad de clientes a mostrar", min_value=1,
                         max_value=len(df_filtrado), value=10)

    # Aplicar el segundo filtro al DataFrame
    df_filtrado = df_filtrado.head(filtro_n)

    # Titulo del Grafico
    st.subheader("Ventas Anuales por TOP de clientes")

    # Crear el gráfico interactivo con Plotly
    fig = px.bar(df_filtrado, x="Total", y="Clientes", color="Total",
                 log_x=True, color_continuous_scale="greens")  # Modificar la paleta de colores

    # Personalizar el diseño del gráfico
    fig.update_layout(
        xaxis=dict(categoryorder="total descending"),
        yaxis={'categoryorder':'total ascending'},
        showlegend=False
    )

    # Configurar el tamaño del gráfico para que se muestren todos los nombres
    fig.update_layout(
        autosize=True,
        width=800,
        height=500
    )

    # Mostrar el gráfico en Streamlit
    st.plotly_chart(fig)