Migliorie al form schede

.gitignore

@@ -33,6 +33,8 @@ bld/
 # Visual Studo 2015 cache/options directory
 .vs/
 
+.idea
+
 # MSTest test Results
 [Tt]est[Rr]esult*/
 [Bb]uild[Ll]og.*

SteUp.Maui/App.xaml

@@ -2,12 +2,12 @@
 <Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              xmlns:android="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.AndroidSpecific;assembly=Microsoft.Maui.Controls"
-             android:Application.WindowSoftInputModeAdjust="Resize"
+             android:Application.WindowSoftInputModeAdjust="Pan"
              x:Class="SteUp.Maui.App">
     <Application.Resources>
         <ResourceDictionary>
 
-            <Color x:Key="PageBackgroundColor">#dff2ff</Color>
+            <Color x:Key="PageBackgroundColor">#FDECEA</Color>
             <Color x:Key="PrimaryTextColor">White</Color>
 
             <Style TargetType="Label">
@@ -18,7 +18,7 @@
             <Style TargetType="Button">
                 <Setter Property="TextColor" Value="{DynamicResource PrimaryTextColor}" />
                 <Setter Property="FontFamily" Value="OpenSansRegular" />
-                <Setter Property="BackgroundColor" Value="#dff2ff" />
+                <Setter Property="BackgroundColor" Value="#FDECEA" />
                 <Setter Property="Padding" Value="14,10" />
             </Style>
 

SteUp.Maui/Core/CoreModule.cs

@@ -36,6 +36,7 @@ public static class CoreModule
     public static void RegisterSystemService(this MauiAppBuilder builder)
     {
         builder.Services.AddSingleton<INetworkService, NetworkService>();
+        builder.Services.AddSingleton<IAttachedService, AttachedService>();
     }
 
     public static void AddAuthorizationCore(this MauiAppBuilder builder)

SteUp.Shared/Components/SingleElements/Card/InspectionCard.razor

@@ -92,7 +92,7 @@
         var puntoVendita = SteupDataService.PuntiVenditaList.Find(x =>
             x.CodMdep != null && x.CodMdep.EqualsIgnoreCase(Ispezione.CodMdep)
         );
-        await Task.Delay(750);
+        await Task.Delay(500);
 
         PuntoVendita = puntoVendita ?? throw new Exception("Punto vendita non trovato");
         OnLoading = false;

SteUp.Shared/Components/SingleElements/Card/InspectionCard.razor.css

@@ -24,6 +24,11 @@
     line-height: normal;
 }
 
+.inspection-info{
+    display: flex;
+    flex-direction: column;
+}
+
 .info-title {
     color: var(--mud-palette-text-primary);
     font-weight: 800;
@@ -40,7 +45,6 @@
 
 .info-title.compactView{
     font-size: medium;
-    font-weight: 600;
 }
 
 .section-info {

SteUp.Shared/Components/SingleElements/Card/ModalForm/CardFormModal.razor

@@ -0,0 +1,23 @@
+<div class="card-form-modal">
+    <div class="card-form-modal-title @ClassTitle">
+        <MudText Style="font-weight: 800" Typo="Typo.subtitle1">@Title</MudText>
+    </div>
+    <div class="card-form-modal-body @ClassBody">
+        @if (Loading)
+        {
+            <MudSkeleton/>
+        }
+        else
+        {
+            @ChildContent
+        }
+    </div>
+</div>
+
+@code {
+    [Parameter] public string Title { get; set; } = "";
+    [Parameter] public bool Loading { get; set; }
+    [Parameter] public RenderFragment? ChildContent { get; set; }
+    [Parameter] public string ClassTitle { get; set; } = "";
+    [Parameter] public string ClassBody { get; set; } = "";
+}

SteUp.Shared/Components/SingleElements/Card/ModalForm/CardFormModal.razor.css

@@ -0,0 +1,23 @@
+.card-form-modal {
+    background: var(--mud-palette-table-striped);
+    border-radius: 1em;
+    padding: .5rem 1rem;
+    width: -webkit-fill-available;
+}
+
+.is-dark .card-form-modal {
+    background: var(--mud-palette-background); !important;
+}
+
+.card-form-modal-body ::deep .file-upload-input {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    z-index: 10;
+    opacity: 0;
+}
+
+small ::deep {
+    color: var(--mud-palette-text-primary) !important;
+}

SteUp.Shared/Components/SingleElements/Modal/ModalAddAttached.razor

@@ -3,7 +3,7 @@
 @using SteUp.Shared.Core.Interface.System
 @inject IAttachedService AttachedService
 
-<MudDialog Class="customDialog-form disable-safe-area">
+<MudDialog Class="disable-safe-area">
     <DialogContent>
         <HeaderLayout SmallHeader="true" Cancel="true" OnCancel="@(() => MudDialog.Cancel())" Title="@TitleModal"/>
 

SteUp.Shared/Components/SingleElements/Modal/ModalFormScheda.razor

@@ -1,5 +1,6 @@
 @using SteUp.Shared.Components.Layout
 @using SteUp.Shared.Components.Layout.Overlay
+@using SteUp.Shared.Components.SingleElements.Card.ModalForm
 @using SteUp.Shared.Core.Dto
 @using SteUp.Shared.Core.Entities
 @using SteUp.Shared.Core.Interface.IntegryApi
@@ -10,58 +11,35 @@
 
 <MudDialog Class="customDialog-form">
     <DialogContent>
+        
         <HeaderLayout Cancel="true" OnCancel="@(() => MudDialog.Cancel())" LabelSave="@LabelSave"
                       OnSave="Save" Title="Scheda"/>
 
         <div class="content">
-            <div class="input-card">
-                <div class="form-container">
-                    <span class="disable-full-width">Reparto</span>
 
-                    @if (SteupDataService.Reparti.IsNullOrEmpty())
+            <CardFormModal Title="Reparto" Loading="SteupDataService.Reparti.IsNullOrEmpty()">
+                <MudSelectExtended ReadOnly="IsView" T="JtbFasiDto?" Variant="Variant.Text"
+                                   @bind-Value="Scheda.Reparto" ToStringFunc="@(x => x?.Descrizione)"
+                                   @bind-Value:after="OnAfterChangeValue">
+                    @foreach (var fasi in SteupDataService.Reparti)
                     {
-                        <MudSkeleton/>
+                        <MudSelectItemExtended Class="custom-item-select" Value="@fasi">
+                            @fasi.Descrizione
+                        </MudSelectItemExtended>
                     }
-                    else
+                </MudSelectExtended>
-                    {
+            </CardFormModal>
-                        <MudSelectExtended ReadOnly="IsView" FullWidth="true" T="JtbFasiDto?" Variant="Variant.Text"
-                                           @bind-Value="Scheda.Reparto" AdornmentIcon="@Icons.Material.Filled.Code"
-                                           ToStringFunc="@(x => x?.Descrizione)"
-                                           @bind-Value:after="OnAfterChangeValue" Class="customIcon-select">
-                            @foreach (var fasi in SteupDataService.Reparti)
-                            {
-                                <MudSelectItemExtended Class="custom-item-select" Value="@fasi">
-                                    @fasi.Descrizione
-                                </MudSelectItemExtended>
-                            }
-                        </MudSelectExtended>
-                    }
-                </div>
 
-                <div class="divider"></div>
+            <CardFormModal Title="Motivo" Loading="SteupDataService.TipiAttività.IsNullOrEmpty()">
-
+                <MudSelectExtended ReadOnly="IsView" T="string?" Variant="Variant.Text"
-                <div class="form-container">
+                                   @bind-Value="Scheda.ActivityTypeId" @bind-Value:after="OnAfterChangeValue">
-                    <span class="disable-full-width">Motivo</span>
+                    @foreach (var type in SteupDataService.TipiAttività)
-
-                    @if (SteupDataService.TipiAttività.IsNullOrEmpty())
                     {
-                        <MudSkeleton/>
+                        <MudSelectItemExtended Class="custom-item-select"
+                                               Value="@type.ActivityTypeId">@type.ActivityTypeId</MudSelectItemExtended>
                     }
-                    else
+                </MudSelectExtended>
-                    {
+            </CardFormModal>
-                        <MudSelectExtended ReadOnly="IsView" FullWidth="true" T="string?" Variant="Variant.Text"
-                                           @bind-Value="Scheda.ActivityTypeId" Class="customIcon-select"
-                                           AdornmentIcon="@Icons.Material.Filled.Code"
-                                           @bind-Value:after="OnAfterChangeValue">
-                            @foreach (var type in SteupDataService.TipiAttività)
-                            {
-                                <MudSelectItemExtended Class="custom-item-select"
-                                                       Value="@type.ActivityTypeId">@type.ActivityTypeId</MudSelectItemExtended>
-                            }
-                        </MudSelectExtended>
-                    }
-                </div>
-            </div>
 
             @* <div class="container-chip-attached"> *@
             @*     @if (!AttachedList.IsNullOrEmpty()) *@
@@ -114,37 +92,32 @@
                                Size="Size.Medium"
                                OnClick="@OpenAddAttached"
                                Variant="Variant.Outlined">
-                        Aggiungi allegati
+                        Aggiungi foto
                     </MudButton>
                 </div>
             }
-
+            
-            <div class="input-card">
+            <CardFormModal Title="Scadenza">
-                <div class="form-container">
+                <MudSelectExtended FullWidth="true" ReadOnly="@IsView" T="int" Variant="Variant.Text"
-                    <span class="disable-full-width">Scadenza</span>
+                                   @bind-Value="@Scheda.Scadenza" @bind-Value:after="OnAfterChangeValue">
-
+                    <MudSelectItemExtended Class="custom-item-select" Text="24H" Value="24"/>
-                    <MudSelectExtended FullWidth="true" ReadOnly="@IsView" T="int" Variant="Variant.Text" 
+                    <MudSelectItemExtended Class="custom-item-select" Text="1 Settimana" Value="168"/>
-                                       @bind-Value="@Scheda.Scadenza" @bind-Value:after="OnAfterChangeValue"
+                    <MudSelectItemExtended Class="custom-item-select" Text="1 Mese" Value="730"/>
-                                       Class="customIcon-select" AdornmentIcon="@Icons.Material.Filled.Code">
+                    <MudSelectItemExtended Class="custom-item-select" Text="2 Mesi" Value="1460"/>
-                        <MudSelectItemExtended Class="custom-item-select" Text="24H" Value="24" />
+                </MudSelectExtended>
-                        <MudSelectItemExtended Class="custom-item-select" Text="1 Settimana" Value="168" />
+            </CardFormModal>
-                        <MudSelectItemExtended Class="custom-item-select" Text="1 Mese" Value="730" />
+            
-                        <MudSelectItemExtended Class="custom-item-select" Text="2 Mesi" Value="1460" />
+            <CardFormModal Title="Responsabile">
-                    </MudSelectExtended>
+                <MudTextField FullWidth="true" ReadOnly="IsView" T="string?" Variant="Variant.Text"
-                </div>
-
-                <div class="divider"></div>
-                
-                <MudTextField ReadOnly="IsView" T="string?" Placeholder="Responsabile" Variant="Variant.Text"
                               @bind-Value="Scheda.Responsabile" @bind-Value:after="OnAfterChangeValue"
                               DebounceInterval="500" OnDebounceIntervalElapsed="OnAfterChangeValue"/>
-
+            </CardFormModal>
-                <div class="divider"></div>
+            
-
+            <CardFormModal Title="Note">
-                <MudTextField ReadOnly="IsView" T="string?" Placeholder="Note" Variant="Variant.Text" Lines="3"
+                <MudTextField ReadOnly="IsView" T="string?" Variant="Variant.Text" Lines="3"
                               @bind-Value="Scheda.Note" @bind-Value:after="OnAfterChangeValue"
                               DebounceInterval="500" OnDebounceIntervalElapsed="OnAfterChangeValue"/>
-            </div>
+            </CardFormModal>
 
             <div class="container-button">
                 <MudButton Class="button-settings blue-icon"

SteUp.Shared/Components/SingleElements/Modal/ModalFormScheda.razor.css

@@ -4,8 +4,7 @@
 }
 
 .container-button {
-    background: var(--mud-palette-background-gray) !important;
+    margin-bottom: unset !important;
-    box-shadow: unset;
 }
 
 .input-card {

SteUp.Shared/wwwroot/css/app.css

@@ -220,7 +220,7 @@ h1:focus { outline: none; }
 }
 
 .customDialog-form .mud-dialog-content {
-    padding: 0 .75rem;
+    padding: 0 0;
     margin: 0;
     overflow: hidden;
 }

SteUp.Shared/wwwroot/css/form.css

@@ -5,28 +5,42 @@
     margin-bottom: 1rem;
 }
 
-.customDialog-form.disable-safe-area .mud-dialog-content { margin-top: unset !important; }
+.customDialog-form.disable-safe-area .mud-dialog-content {
+    margin-top: unset !important;
+}
 
-.customDialog-form.disable-safe-area .content { height: 100% !important; }
+.customDialog-form.disable-safe-area .content {
+    height: 100% !important;
+}
+
+.customDialog-form.mud-dialog {
+    border-radius: unset !important;
+}
 
 .customDialog-form .content {
     height: calc(100vh - (.6rem + 40px));
     overflow: auto;
-    -ms-overflow-style: none;
+    gap: 1.5rem;
-    scrollbar-width: none;
+    padding: 0 .75rem 2rem 75rem !important;
 }
 
 @supports (-webkit-touch-callout: none) {
-    .customDialog-form .content { height: calc(100vh - (.6rem + 40px) - env(safe-area-inset-top)) !important; }
+    .customDialog-form .content {
+        height: calc(100vh - (.6rem + 40px) - env(safe-area-inset-top)) !important;
+    }
 
-    .customDialog-form.disable-safe-area .content { height: 100% !important; }
+    .customDialog-form.disable-safe-area .content {
+        height: 100% !important;
+    }
 
-    .customDialog-form.disable-safe-area .mud-dialog-content { margin-top: unset !important; }
+    .customDialog-form.disable-safe-area .mud-dialog-content {
+        margin-top: unset !important;
+    }
 }
 
-.customDialog-form .header { padding: 0 !important; }
+.customDialog-form .header {
-
+    padding: 0 .75rem !important;
-.customDialog-form .content::-webkit-scrollbar { display: none; }
+}
 
 .input-card {
     width: 100%;
@@ -42,9 +56,13 @@
     padding: .4rem 1rem !important;
 }
 
-.input-card.clearButton.custom-border-bottom { border-bottom: .1rem solid var(--card-border-color); }
+.input-card.clearButton.custom-border-bottom {
+    border-bottom: .1rem solid var(--card-border-color);
+}
 
-.input-card > .divider { margin: 0 !important; }
+.input-card > .divider {
+    margin: 0 !important;
+}
 
 .form-container {
     display: flex;
@@ -81,22 +99,34 @@
 
 /*Custom mudBlazor*/
 
-.form-container .mud-input.mud-input-underline:before { border-bottom: none !important; }
+.form-container .mud-input.mud-input-underline:before {
+    border-bottom: none !important;
+}
 
-.form-container .mud-input.mud-input-underline:after { border-bottom: none !important; }
+.form-container .mud-input.mud-input-underline:after {
+    border-bottom: none !important;
+}
 
-.form-container.text-align-end .mud-input-slot { text-align: end; }
+.form-container.text-align-end .mud-input-slot {
+    text-align: end;
+}
 
-.input-card .mud-input.mud-input-underline:before { border-bottom: none !important; }
+.input-card .mud-input.mud-input-underline:before {
+    border-bottom: none !important;
+}
 
-.input-card .mud-input.mud-input-underline:after { border-bottom: none !important; }
+.input-card .mud-input.mud-input-underline:after {
+    border-bottom: none !important;
+}
 
 .form-container .customIcon-select .mud-icon-root.mud-svg-icon {
     rotate: 90deg !important;
     font-size: 1.1rem;
 }
 
-.form-container .customIcon-select .mud-input-slot { text-align: end; }
+.form-container .customIcon-select .mud-input-slot {
+    text-align: end;
+}
 
 .input-card .mud-input {
     width: 100%;
@@ -105,7 +135,7 @@
 
 .container-button {
     width: 100%;
-    background: var(--light-card-background);
+    background: var(--mud-palette-table-striped);
     padding: .5rem 0;
     border-radius: 12px;
     margin-bottom: 2rem;
@@ -116,7 +146,9 @@
     width: unset;
 }
 
-.container-button .button-settings { border: none !important; }
+.container-button .button-settings {
+    border: none !important;
+}
 
 .container-button .button-settings .mud-icon-root {
     border-radius: 6px;
@@ -160,7 +192,9 @@
     font-size: 1rem;
 }
 
-.container-button .button-settings.exit { padding: 0; }
+.container-button .button-settings.exit {
+    padding: 0;
+}
 
 .container-button .button-settings.exit .mud-button-label {
     justify-content: center;