Files

SmartRootsSrl a5e30f152e docs: add implementation plan for gvScostamentoPerformance grid layout

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

2026-03-27 12:35:23 +01:00

9.7 KiB

Raw Blame History

gvScostamentoPerformance Grid Layout — Implementation Plan

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (- [ ]) syntax for tracking.

Goal: Migliorare la leggibilità e la presentazione visiva della griglia gvScostamentoPerformance in ScostamentoPerformance.aspx — colonne fisse in px, scroll orizzontale, colonne bloccate, tema Aqua uniforme e CSS override mirati.

Architecture: Tutte le modifiche sono confinate al solo file ScostamentoPerformance.aspx. Il markup ASPX viene aggiornato inline (attributi DevExpress + blocco <style>). Nessuna modifica al code-behind né al datasource.

Tech Stack: ASP.NET Web Forms 4.7.2, DevExpress ASPxGridView v23.2, tema Aqua, CSS inline override.

File coinvolti

Operazione	File
Modify	`OlympiaIntranet/ScostamentoPerformance.aspx`

Nessun file creato. Nessun file di test (il progetto non ha suite di test — verifica visiva via IIS Express).

Task 1: Tema Aqua e scroll orizzontale

Modificare gli attributi radice di gvScostamentoPerformance per cambiare tema e abilitare lo scroll orizzontale.

Files:

Modify: OlympiaIntranet/ScostamentoPerformance.aspx:64-77
Step 1: Cambiare Theme da Office2010Blue ad Aqua

Nel tag di apertura <dx:ASPxGridView ID="gvScostamentoPerformance" alla riga 64, sostituire:

Theme="Office2010Blue"

con:

Theme="Aqua"

Step 2: Aggiungere HorizontalScrollBarMode al blocco Settings

Sostituire il blocco <Settings ... /> esistente (riga 77):

<Settings ShowFilterRow="True" ShowHeaderFilterButton="True" ShowFilterBar="Visible" VerticalScrollBarMode="Visible" VerticalScrollableHeight="750" />

con:

<Settings ShowFilterRow="True" ShowHeaderFilterButton="True" ShowFilterBar="Visible" VerticalScrollBarMode="Visible" VerticalScrollableHeight="750" HorizontalScrollBarMode="Visible" />

Step 3: Verifica rapida in Visual Studio

Aprire il file in VS2022 e controllare che non ci siano errori di markup (il designer dovrebbe caricare senza errori). Se HorizontalScrollBarMode non è un attributo valido su <Settings> per questa versione di DevExpress, rimuoverlo — lo scroll orizzontale verrà gestito dal CSS nel Task 3.

Step 4: Commit

git add OlympiaIntranet/ScostamentoPerformance.aspx
git commit -m "style: change gvScostamentoPerformance theme to Aqua, enable horizontal scroll"

Task 2: Colonne bloccate e larghezze in pixel fissi

Aggiornare ogni colonna: Fixed="True" sulle prime 4, larghezza in px su tutte.

Files:

Modify: OlympiaIntranet/ScostamentoPerformance.aspx:88-139
Step 1: Bloccare la colonna Command (riga 88)

Sostituire:

<dx:GridViewCommandColumn ShowEditButton="True" VisibleIndex="0" Width="50px" Caption=" " />

con:

<dx:GridViewCommandColumn ShowEditButton="True" VisibleIndex="0" Width="50px" Caption=" " Fixed="True" />

Step 2: Bloccare e fissare la colonna Gestore (riga 90)

Sostituire:

<dx:GridViewDataTextColumn FieldName="Gestore" Caption="Gestore" VisibleIndex="2" ReadOnly="true" Width="6%" />

con:

<dx:GridViewDataTextColumn FieldName="Gestore" Caption="Gestore" VisibleIndex="2" ReadOnly="true" Width="90px" Fixed="True" />

Step 3: Bloccare e fissare la colonna Portafoglio (riga 91)

Sostituire:

<dx:GridViewDataTextColumn FieldName="Portafoglio" Caption="Portafoglio" VisibleIndex="3" ReadOnly="true" Width="6%" />

con:

<dx:GridViewDataTextColumn FieldName="Portafoglio" Caption="Portafoglio" VisibleIndex="3" ReadOnly="true" Width="90px" Fixed="True" />

Step 4: Bloccare e fissare la colonna Intestazione (riga 92)

Sostituire:

<dx:GridViewDataTextColumn FieldName="Intestazione" Caption="Intestazione" VisibleIndex="4" ReadOnly="true" Width="10%" />

con:

<dx:GridViewDataTextColumn FieldName="Intestazione" Caption="Intestazione" VisibleIndex="4" ReadOnly="true" Width="150px" Fixed="True" />

Step 5: Aggiornare larghezze delle colonne restanti

Sostituire le colonne seguenti (solo attributo Width, nessun altro cambiamento):

<!-- Linea: 6% → 90px -->
<dx:GridViewDataTextColumn FieldName="Linea" Caption="Linea" VisibleIndex="5" ReadOnly="true" Width="90px" />

<!-- Patrimonio: 6% → 110px -->
<dx:GridViewDataTextColumn FieldName="Patrimonio" Caption="Patrimonio" VisibleIndex="6" ReadOnly="true" Width="110px">
    <PropertiesTextEdit DisplayFormatString="N0" />
</dx:GridViewDataTextColumn>

<!-- DataApertura: 5% → 90px -->
<dx:GridViewDataTextColumn FieldName="DataApertura" Caption="Data Ap." VisibleIndex="7" ReadOnly="true" Width="90px">
    <PropertiesTextEdit DisplayFormatString="dd/MM/yyyy" />
</dx:GridViewDataTextColumn>

<!-- PerfTWRPtf: 4% → 85px -->
<dx:GridViewDataTextColumn FieldName="PerfTWRPtf" Caption="TWR Ptf" VisibleIndex="8" ReadOnly="true" Width="85px">
    <PropertiesTextEdit DisplayFormatString="N2" />
</dx:GridViewDataTextColumn>

<!-- PerfTWRLinea: 5% → 95px -->
<dx:GridViewDataTextColumn FieldName="PerfTWRLinea" Caption="TWR Linea" VisibleIndex="9" ReadOnly="true" Width="95px">
    <PropertiesTextEdit DisplayFormatString="N2" />
</dx:GridViewDataTextColumn>

<!-- DeltaTWR: 4% → 80px -->
<dx:GridViewDataTextColumn FieldName="DeltaTWR" Caption="Delta" VisibleIndex="10" ReadOnly="true" Width="80px">
    <PropertiesTextEdit DisplayFormatString="N2" />
</dx:GridViewDataTextColumn>

<!-- Benchmark: 4% → 90px -->
<dx:GridViewDataTextColumn FieldName="Benchmark" Caption="Benchmark" VisibleIndex="10" ReadOnly="true" Width="90px">
    <PropertiesTextEdit DisplayFormatString="N2" />
</dx:GridViewDataTextColumn>

<!-- Apporti: 5% → 95px -->
<dx:GridViewDataTextColumn FieldName="Apporti" Caption="Apporti" VisibleIndex="11" ReadOnly="true" Width="95px">
    <PropertiesTextEdit DisplayFormatString="N0" />
</dx:GridViewDataTextColumn>

<!-- Prelievi: 5% → 95px -->
<dx:GridViewDataTextColumn FieldName="Prelievi" Caption="Prelievi" VisibleIndex="12" ReadOnly="true" Width="95px">
    <PropertiesTextEdit DisplayFormatString="N0" />
</dx:GridViewDataTextColumn>

<!-- Addebiti: 5% → 95px -->
<dx:GridViewDataTextColumn FieldName="Addebiti" Caption="Addebiti" VisibleIndex="13" ReadOnly="true" Width="95px">
    <PropertiesTextEdit DisplayFormatString="N0" />
</dx:GridViewDataTextColumn>

<!-- Commento: 16% → 210px -->
<dx:GridViewDataComboBoxColumn FieldName="Commento" Caption="Commento" VisibleIndex="14" Width="210px">
    <!-- PropertiesComboBox invariato -->
</dx:GridViewDataComboBoxColumn>

<!-- Note: 12% → 170px -->
<dx:GridViewDataMemoColumn FieldName="Note" Caption="Note" VisibleIndex="14" Width="170px">
    <PropertiesMemoEdit Rows="3" />
</dx:GridViewDataMemoColumn>

<!-- BloccoCommento: 3% → 60px -->
<dx:GridViewDataCheckColumn FieldName="BloccoCommento" Caption="Blocco" VisibleIndex="15" Width="60px" />

Step 6: Commit

git add OlympiaIntranet/ScostamentoPerformance.aspx
git commit -m "style: fix column widths to px and freeze Gestore/Portafoglio/Intestazione columns"

Task 3: CSS override nel blocco `<head>`

Aggiungere gli stili inline che correggono padding, bordo inferiore, filter bar e separatore colonne bloccate.

Files:

Modify: OlympiaIntranet/ScostamentoPerformance.aspx:10-12
Step 1: Aggiungere il blocco CSS dopo lo stile esistente

Il blocco <style> attuale (righe 10–12) contiene:

<style>
    html, body { margin: 0; padding: 0; overflow: hidden; height: 100%; }
</style>

Sostituirlo con:

<style>
    html, body { margin: 0; padding: 0; overflow: hidden; height: 100%; }

    /* Padding celle griglia */
    .dxgvDataRow_Aqua td,
    .dxgvDataRow_Aqua td.dxgvTD_Aqua {
        padding: 6px 8px !important;
    }

    /* Bordo inferiore griglia */
    .dxgvControl_Aqua {
        border-bottom: 2px solid #4a90d9 !important;
    }

    /* Filter bar ("Crea Filtro") visibile */
    .dxgvFilterBar_Aqua {
        background-color: #e0f0fb !important;
        border-top: 1px solid #b0cfe8 !important;
        color: #1a6bb5 !important;
    }

    /* Separatore visivo tra colonne bloccate e scorrevoli */
    .dxgvFixedColumnLeftDivider_Aqua {
        border-right: 2px solid #2a6fb0 !important;
    }
</style>

Nota: I selettori CSS usano i nomi di classe generati da DevExpress per il tema Aqua. Se a runtime le classi effettive differiscono (verificabile con DevTools del browser → Inspect sull'elemento griglia), aggiornare i selettori con quelli reali. Il pattern è sempre dxgv<Elemento>_<Tema>.

Step 2: Verifica visiva in IIS Express

Avviare il progetto (F5 in VS2022), navigare a ScostamentoPerformance.aspx e controllare:

✅ Header griglia in blu Aqua (coerente con il form filtri sopra)
✅ Colonne Gestore/Portafoglio/Intestazione restano visibili durante lo scroll orizzontale
✅ Celle con padding sufficiente (non schiacciate)
✅ Bordo inferiore della griglia visibile
✅ "Crea Filtro" (filter bar) con sfondo azzurro chiaro e testo leggibile

Se uno o più CSS override non producono effetto, aprire DevTools (F12), ispezionare l'elemento e trovare il selettore corretto generato da DevExpress, quindi aggiornarlo nel markup.

Step 3: Commit finale

git add OlympiaIntranet/ScostamentoPerformance.aspx
git commit -m "style: add CSS overrides for Aqua theme — padding, bottom border, filter bar, fixed column divider"

Task 4: Push su remote

Step 1: Push su Gitea

git push origin master

Verifica su https://git.smart-roots.net/glicciardello/OlympiaIntranet che i 3 commit siano visibili nel branch master.

9.7 KiB Raw Blame History Unescape Escape

gvScostamentoPerformance Grid Layout — Implementation Plan

File coinvolti

Task 1: Tema Aqua e scroll orizzontale

Task 2: Colonne bloccate e larghezze in pixel fissi

Task 3: CSS override nel blocco <head>

Task 4: Push su remote

9.7 KiB

Raw Blame History

Task 3: CSS override nel blocco `<head>`