Restyle UI to match Mago4 and add invoicing, warehouse, scadenzario
Rework the demo into a faithful Mago4 look-and-feel and expand it with core ERP modules modelled on the real Mago4 database schema. UI (ispirata a Mago4): - Blue header with logo/search/operation date, desktop-style window tabs - White sidebar with coloured module icons (Anagrafiche, Vendite, Acquisti, Amministrazione, Logistica) - Card-based module landing pages with breadcrumb + tab strip - Document detail forms with left tabs, line grid and totals box Fatturazione (InvoiceMng / MA_SaleDoc): - Document types (Fattura Immediata, DDT, Nota di Credito, ProForma) - Lines with discount/IVA, automatic taxable/tax/total computation - Document states (draft -> printed -> issued / posted_to_inventory) Magazzino (Inventory / MA_InventoryEntries + MA_InventoryReasons): - Inventory movements with load/unload reasons (DebitCreditSign) - Posting a movement actually updates item balances - Causali and stock valuation pages Amministrazione / Scadenzario (AP_AR / MA_PyblsRcvbls): - Open items (receivables/payables) with due date, method, state - Settle action closes the item and recomputes the cash forecast Dashboard riprogettata (focus su scadenze e to-do): - Overdue alert banner, KPI for overdue payables/receivables - Upcoming deadlines table, prioritised "Cose da fare" action list - 30-day cash-flow forecast and customer credit-limit check Adds REST endpoints for invoices, movements, schedules and dashboard data. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+80
-63
@@ -3,81 +3,98 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% block title %}Mago4 Demo - ERP{% endblock %}</title>
|
||||
<title>{% block title %}Mago4 Demo{% endblock %}</title>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap">
|
||||
<link rel="stylesheet" href="{{ url_for('static', path='/css/style.css') }}">
|
||||
{% block extra_css %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="app-container">
|
||||
<!-- Sidebar Navigation -->
|
||||
<!-- Window tabs (stile desktop Mago4) -->
|
||||
<div class="window-tabs">
|
||||
<a href="/" class="window-tab {% if active_module == 'dashboard' %}active{% endif %}">
|
||||
<i class="material-icons">home</i> Home
|
||||
</a>
|
||||
{% block window_tabs %}{% endblock %}
|
||||
</div>
|
||||
|
||||
<!-- Header -->
|
||||
<header class="app-header">
|
||||
<button class="header-burger"><i class="material-icons">menu</i></button>
|
||||
<a href="/" class="logo">
|
||||
<span class="logo-mark">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M2 20 L8 4 L12 14 L16 4 L22 20 L18 20 L15 11 L12 18 L9 11 L6 20 Z" fill="#1577be"/>
|
||||
<path d="M16 14 L20 14 L20 9 L22 9 L22 20 L18 20 Z" fill="#5aa632"/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="logo-text">MAGO</span>
|
||||
</a>
|
||||
|
||||
<div class="header-search">
|
||||
<i class="material-icons">search</i>
|
||||
<input type="text" placeholder="Cerca..." onkeydown="if(event.key==='Enter')globalSearch(this.value)">
|
||||
</div>
|
||||
|
||||
<div class="header-right">
|
||||
<button class="header-icon-btn" title="Lingua"><i class="material-icons">language</i></button>
|
||||
<div class="header-date">
|
||||
<span class="label">Data delle operazioni</span>
|
||||
<span class="value">{{ operation_date }}</span>
|
||||
</div>
|
||||
<button class="header-icon-btn" title="Calendario"><i class="material-icons">event</i></button>
|
||||
<button class="header-icon-btn" title="Profilo"><i class="material-icons">account_circle</i></button>
|
||||
<button class="header-icon-btn" title="Aggiorna" onclick="location.reload()"><i class="material-icons">refresh</i></button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="app-body">
|
||||
<!-- Sidebar -->
|
||||
<aside class="sidebar">
|
||||
<div class="sidebar-header">
|
||||
<div class="logo">
|
||||
<span class="logo-text">Mago4</span>
|
||||
<span class="logo-version">Demo</span>
|
||||
</div>
|
||||
<div class="sidebar-group-title">
|
||||
<span class="gt-left">
|
||||
<span class="gt-mark"><i class="material-icons">apps</i></span>
|
||||
<span class="gt-text">Mago4</span>
|
||||
</span>
|
||||
<i class="material-icons chev">expand_less</i>
|
||||
</div>
|
||||
|
||||
<nav class="sidebar-nav">
|
||||
<a href="/" class="nav-item {% if request.url.path == '/' %}active{% endif %}">
|
||||
<i class="material-icons">dashboard</i>
|
||||
<span>Dashboard</span>
|
||||
</a>
|
||||
<a href="/customers" class="nav-item {% if 'customers' in request.url.path %}active{% endif %}">
|
||||
<i class="material-icons">people</i>
|
||||
<span>Clienti</span>
|
||||
</a>
|
||||
<a href="/suppliers" class="nav-item {% if 'suppliers' in request.url.path %}active{% endif %}">
|
||||
<i class="material-icons">local_shipping</i>
|
||||
<span>Fornitori</span>
|
||||
</a>
|
||||
<a href="/products" class="nav-item {% if 'products' in request.url.path %}active{% endif %}">
|
||||
<i class="material-icons">inventory_2</i>
|
||||
<span>Articoli</span>
|
||||
</a>
|
||||
<a href="/sales-orders" class="nav-item {% if 'sales' in request.url.path %}active{% endif %}">
|
||||
<i class="material-icons">receipt</i>
|
||||
<span>Ordini Vendita</span>
|
||||
</a>
|
||||
<a href="/purchase-orders" class="nav-item {% if 'purchase' in request.url.path %}active{% endif %}">
|
||||
<i class="material-icons">shopping_cart</i>
|
||||
<span>Ordini Acquisto</span>
|
||||
</a>
|
||||
<a href="/warehouse" class="nav-item {% if 'warehouse' in request.url.path %}active{% endif %}">
|
||||
<i class="material-icons">warehouse</i>
|
||||
<span>Magazzino</span>
|
||||
</a>
|
||||
</nav>
|
||||
<a href="/" class="nav-item {% if active_module == 'dashboard' %}active{% endif %}">
|
||||
<i class="material-icons ic-anagrafiche">dashboard</i> Dashboard
|
||||
</a>
|
||||
<a href="/anagrafiche" class="nav-item {% if active_module == 'anagrafiche' %}active{% endif %}">
|
||||
<i class="material-icons ic-anagrafiche">contacts</i> Anagrafiche
|
||||
</a>
|
||||
<a href="/amministrazione" class="nav-item {% if active_module == 'amministrazione' %}active{% endif %}">
|
||||
<i class="material-icons ic-amministrazione">account_balance</i> Amministrazione
|
||||
</a>
|
||||
<a href="/vendite" class="nav-item {% if active_module == 'vendite' %}active{% endif %}">
|
||||
<i class="material-icons ic-vendite">point_of_sale</i> Vendite
|
||||
</a>
|
||||
<a href="/acquisti" class="nav-item {% if active_module == 'acquisti' %}active{% endif %}">
|
||||
<i class="material-icons ic-acquisti">shopping_cart</i> Acquisti
|
||||
</a>
|
||||
<a href="/magazzino" class="nav-item {% if active_module == 'magazzino' %}active{% endif %}">
|
||||
<i class="material-icons ic-logistica">warehouse</i> Logistica
|
||||
</a>
|
||||
<a href="#" class="nav-item disabled">
|
||||
<i class="material-icons ic-produzione">precision_manufacturing</i> Produzione
|
||||
</a>
|
||||
<a href="#" class="nav-item disabled">
|
||||
<i class="material-icons ic-servizi">build</i> Servizi
|
||||
</a>
|
||||
<a href="#" class="nav-item disabled">
|
||||
<i class="material-icons ic-preferenze">settings</i> Preferenze
|
||||
</a>
|
||||
|
||||
<div class="sidebar-footer">
|
||||
<div class="version-info">
|
||||
<span>v1.0.0</span>
|
||||
<span>In-Memory DB</span>
|
||||
</div>
|
||||
<div class="sidebar-sub-group">
|
||||
<span>TaskBuilder Studio</span>
|
||||
<i class="material-icons chev" style="font-size:16px;">expand_more</i>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- Main Content -->
|
||||
<main class="main-content">
|
||||
<header class="top-bar">
|
||||
<div class="top-bar-content">
|
||||
<h1 class="page-title">{% block page_title %}{% endblock %}</h1>
|
||||
<div class="top-bar-actions">
|
||||
<button class="btn-icon" title="Notifiche">
|
||||
<i class="material-icons">notifications</i>
|
||||
</button>
|
||||
<button class="btn-icon" title="Profilo">
|
||||
<i class="material-icons">account_circle</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="content-area">
|
||||
{% block content %}{% endblock %}
|
||||
</section>
|
||||
<!-- Main content -->
|
||||
<main class="main">
|
||||
{% block content %}{% endblock %}
|
||||
</main>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user