netgescon-day0/docs/90-UI-interfaccia-unica/90-01-content/01-layout-base.md

📋 LAYOUT BASE OBBLIGATORIO

Template fondamentale per tutti i moduli NetGescon

---

🗂️ STRUTTURA BLADE MASTER

File: resources/views/admin/{modulo}/index.blade.php

@extends('admin.layouts.netgescon')

@section('title', 'Nome Modulo')

@section('content')
<div class="content-wrapper">
    <!-- HEADER BREADCRUMB -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">Nome Modulo</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Home</a></li>
                        <li class="breadcrumb-item active">Nome Modulo</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>

    <!-- SUB-MENU TABS PATTERN -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="card card-primary card-tabs">
                        <div class="card-header p-0 pt-1">
                            <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
                                <!-- TAB ITEMS - PATTERN REPLICABILE -->
                                @yield('menu-tabs')
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- STATISTICHE CARDS PATTERN -->
    <section class="content">
        <div class="container-fluid">
            <!-- STATS ROW - PATTERN REPLICABILE -->
            @yield('stats-cards')
            
            <!-- MAIN CONTENT AREA -->
            @yield('main-content')
        </div>
    </section>
</div>
@endsection

<!-- STYLES PATTERN -->
@push('styles')
@yield('module-styles')
@endpush

<!-- SCRIPTS PATTERN -->
@push('scripts')
@yield('module-scripts')
@endpush

---

🔧 ELEMENTI OBBLIGATORI

✅ 1. Extends Layout

@extends('admin.layouts.netgescon')

Utilizza sempre il layout NetGescon principale

✅ 2. Title Section

@section('title', 'Nome Modulo')

Imposta title per tab browser e header

✅ 3. Content Wrapper

<div class="content-wrapper">

Container principale AdminLTE

✅ 4. Breadcrumb Navigation

<ol class="breadcrumb float-sm-right">
    <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Home</a></li>
    <li class="breadcrumb-item active">Nome Modulo</li>
</ol>

Navigazione contestuale obbligatoria

✅ 5. Menu Tabs Container

<div class="card card-primary card-tabs">
    <div class="card-header p-0 pt-1">
        <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
            @yield('menu-tabs')
        </ul>
    </div>
</div>

Container per menu navigazione

✅ 6. Content Sections

@yield('stats-cards')    <!-- Statistiche -->
@yield('main-content')   <!-- Contenuto principale -->

Aree contenuto standardizzate

---

🎯 VARIABILI DA SOSTITUIRE

Per ogni nuovo modulo sostituisci:

• {modulo} → nome modulo (es: fornitori, gestioni)
• Nome Modulo → nome visualizzato (es: Fornitori, Gestioni)
• admin.{modulo} → route base (es: admin.fornitori)

Esempio Completo per Modulo Fornitori:

@extends('admin.layouts.netgescon')
@section('title', 'Fornitori')

@section('content')
<div class="content-wrapper">
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">Gestione Fornitori</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Home</a></li>
                        <li class="breadcrumb-item active">Fornitori</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <!-- resto del template -->

---

📂 FILE STRUCTURE MODULO

Organizzazione cartelle obbligatoria:

resources/views/admin/{modulo}/
├── index.blade.php      # Lista principale (usa questo layout)
├── show.blade.php       # Dettaglio singolo item
├── create.blade.php     # Form creazione
├── edit.blade.php       # Form modifica
└── _form.blade.php      # Form partial condiviso

Controller corrispondente:

app/Http/Controllers/Admin/
└── {Modulo}Controller.php

Routes nel file:

routes/admin.php

---

⚡ NEXT STEPS

Dopo aver creato il layout base:

1. Implementa menu tabs → Vedi 02-pattern-menu.md
2. Aggiungi cards statistiche → Vedi 03-cards-statistiche.md
3. Crea controller → Vedi 04-controller-standard.md
4. Applica CSS/JS → Vedi 05-css-javascript.md
5. Testa implementazione → Vedi 06-checklist-implementazione.md

📖 Prossimo file: 02-pattern-menu.md