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

# 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)