@using MP.SPEC.Components
@using MP.SPEC.Data




@if (ListRecords == null)
{
    <LoadingData></LoadingData>
}
else if (totalCount == 0)
{
    <div class="alert alert-warning text-center display-4">Nessun record trovato</div>
}
else
{
    <!--       INIZIO:    MODIFICA FLUSSO            -->
    @if (currFluxLogDto != null)
    {
        <div class="row">
            <div class="col-12">
                <div class="card mb-5">
                    <div class="card-header bg-primary text-light d-flex justify-content-between">
                        <div>
                            Modifica Parametro
                        </div>
                        <div>
                            @if (isEditing)
                            {
                                <span class="text-light">PENDING CHANGES...</span>
                            }
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-3 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm">MACCHINA</span>
                                    <input type="text" class="form-control" disabled aria-label="Art search" aria-describedby="inputGroup-sizing-sm" @bind-value="@currFluxLogDto.IdxMacchina">
                                </div>
                            </div>
                            <div class="col-3 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm">DATA</span>
                                    <input type="text" class="form-control" disabled aria-label="Art search" aria-describedby="inputGroup-sizing-sm" @bind-value="@currFluxLogDto.dtEvento">
                                </div>
                            </div>
                            <div class="col-3 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm">DATA TYPE</span>
                                    <input type="text" class="form-control" disabled aria-label="Art search" aria-describedby="inputGroup-sizing-sm" @bind-value="@currFluxLogDto.CodFlux">
                                </div>
                            </div>
                            <div class="col-3 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm">VALORE</span>
                                    <input type="text" class="form-control" aria-label="Art search" aria-describedby="inputGroup-sizing-sm" @bind-value="@currFluxLogDto.ValoreEdit" @onclick="()=> enableEditing()" @onselect="()=> enableEditing()">
                                </div>
                            </div>
                        </div>
                        <div class="row pt-4" style="visibility: @css()">
                            <div class="col-3 pe-0">
                            </div>
                            <div class="col-3 pe-0">
                            </div>
                            <div class="col-3 pe-0">
                                <div class="d-grid gap-2">
                                    <button @onclick="() => cancel()" class="btn btn-warning">Annulla <i class="bi bi-x-circle"></i></button>
                                </div>
                            </div>
                            <div class="col-3 pe-0">
                                <div class="d-grid gap-2">
                                    <button @onclick="() => update(currFluxLogDto)" class="btn btn-success">Save <i class="bi bi-save"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    }

    <!--       FINE:    MODIFICA FLUSSO            -->
    <!--       INIZIO:    NUOVO DOSSIER            -->
    @if (currRecordClone != null)
    {
        <div class="row">
            <div class="col-12">
                <div class="card mb-5">
                    <div class="card-header bg-primary text-light d-flex justify-content-between">
                        <div>
                            Nuovo Dossier
                        </div>
                    </div>
                    <div class="card-body">
                        <!--INIZIO PRIMA RIGA-->
                        <div class="row">
                            <div class="col-4 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm">MACCHINA</span>
                                    <select @bind="@currRecordClone.IdxMacchina" class="form-select" id="macchina" title="Selezionare la macchina" @onclick="()=> enableEditing()">
                                        @if (ListMacchine != null)
                                        {
                                            foreach (var item in ListMacchine)
                                            {
                                                @if (item.IdxMacchina == currRecordClone.IdxMacchina)
                                                {

                                                    <option value="@item.IdxMacchina" selected>@item.IdxMacchina | @item.Descrizione</option>
                                                }
                                                else
                                                {
                                                    <option value="@item.IdxMacchina">@item.IdxMacchina | @item.Descrizione</option>
                                                }
                                            }
                                        }
                                    </select>
                                </div>
                            </div>
                            <div class="col-4 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm">FASE</span>
                                    <select class="form-select" @bind="@currRecordClone.KeyRichiesta" @onclick="()=> enableEditing()" title="Selezionare la fase">
                                        @if (ListStati != null)
                                        {
                                            foreach (var item in ListStati)
                                            {
                                                @if (item.value == currRecordClone.KeyRichiesta)
                                                {
                                                    <option value="@item.value" selected>@item.label</option>
                                                }
                                                else
                                                {
                                                    <option value="@item.value">@item.label</option>
                                                }
                                            }
                                        }
                                    </select>
                                </div>
                            </div>

                            <div class="col-4 pe-0">
                                <div class="input-group input-group-sm">
                                    <span class="input-group-text" id="inputGroup-sizing-sm" @onclick="()=> enableEditing()">ARTICOLI</span>

                                    <select @bind="@currRecordClone.CodArticolo" class="form-select" id="macchina" title="Selezionare l'articolo">
                                        @if (ListArticoli != null)
                                        {
                                            foreach (var item in ListArticoli)
                                            {
                                                @if (item.CodArticolo == currRecordClone.CodArticolo)
                                                {
                                                    <option value="@item.CodArticolo" selected>@item.CodArticolo | @item.DescArticolo</option>
                                                }
                                                else
                                                {
                                                    <option value="@item.CodArticolo">@item.CodArticolo | @item.DescArticolo</option>
                                                }
                                            }
                                        }
                                    </select>
                                </div>
                            </div>
                        </div>
                        <!--FINE PRIMA RIGA-->


                        <div class="row pt-4">
                            <div class="col-3 pe-0">
                            </div>
                            <div class="col-3 pe-0">
                            </div>
                            <div class="col-3 pe-0">
                                <div class="d-grid gap-2">
                                    <button @onclick="() => cancelNewDoss()" class="btn btn-warning">Annulla <i class="bi bi-x-circle"></i></button>
                                </div>
                            </div>
                            <div class="col-3 pe-0">
                                <div class="d-grid gap-2">
                                    <button @onclick="() => newDossier(currRecordClone)" class="btn btn-success">Save <i class="bi bi-save"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    }


    <!--       FINE:    NUOVO DOSSIER            -->







    <div class="row">
        <div class="d-flex justify justify-content-between">
            <table class="table table-sm table-striped small">
                <thead>
                    <tr>
                        <th>
                            <div class="text-nowrap">

                                @if (currRecord != null)
                                {
                                    <button @onclick="() => closeTableFlux()" class="btn btn-primary btn-sm"><i class="bi bi-arrow-counterclockwise"></i></button>
                                    <button @onclick="()=> cloneRecord(currRecord)" class="btn btn-info btn-sm" title="Duplica Record"><i class="bi bi-clipboard-check"></i></button>
                                }
                            </div>
                        </th>
                        <th><i class="fa-solid fa-file"></i> Articolo</th>
                        <th><i class="fa-solid fa-screwdriver-wrench"></i> Fase</th>
                        <th><i class="fa-solid fa-hard-drive"></i> Macchina</th>
                        <th><i class="fa-regular fa-calendar-days"></i> Data Snap</th>
                        <th><i class="fa-solid fa-sliders"></i> ODL</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var record in ListRecords)
                    {
                        <tr class="@checkSelect(@record)">
                            <td>
                                @if (isEditing == false)
                                {
                                    <!--SEL RECORD PER VISUALIZZAZIONE FLUSSI-->
                                    <button class="btn btn-primary btn-sm" @onclick="() => selRecord(record)"><i class="fa-solid fa-magnifying-glass"></i></button>
                                    <!--SEL RECORD PER CLONA DOSSIER-->
                                    @*<button @onclick="()=> cloneRecord(record)" class="btn btn-info btn-sm" title="Duplica Record"><i class="bi bi-clipboard-check"></i></button>*@
                                }
                                else
                                {
                                    <button class="btn btn-secondary btn-sm disabled"><i class="fa-solid fa-magnifying-glass"></i></button>
                                }
                            </td>
                            <td>
                                @record.CodArticolo
                                <div class="small textConsensed text-secondary">@record.ArticoloNav.DescArticolo</div>
                            </td>
                            <td>
                                @tradFase(record.KeyRichiesta)
                            </td>
                            <td>
                                @record.IdxMacchina
                            </td>
                            <td>
                                @record.DtRif
                            </td>
                            <td>
                                <div>
                                    <div>
                                        @record.IdxODL
                                    </div>
                                    @if (giacenzeConf == "true")
                                    {
                                        @if (record.IdxODL > 0)
                                        {
                                            <div>
                                                <span class="badge bg-primary textConsensed"><a href="Giacenze?IdxOdl=@record.IdxODL" target="_blank" class="text-light text-decoration-none">APRI GIACENZE</a></span>
                                            </div>
                                        }
                                    }
                                </div>
                            </td>
                            <td>
                                @if (isEditing == false)
                                {

                                    <button @onclick="() => deleteRecord(record)" class="btn btn-danger btn-sm"><i class="bi bi-trash-fill"></i></button>
                                }
                                else
                                {
                                    <button class="btn btn-secondary btn-sm disabled"><i class="bi bi-trash-fill"></i></button>

                                }
                            </td>
                        </tr>
                    }
                </tbody>
            </table>

            @if (!visualizzaFlux)
            {
                if (listaFlux == null)
                {
                    <div class="alert alert-warning text-center display-4">Nessun record trovato</div>
                }
                else
                {
                    <div class="table selBlock p-2">
                        <table class="table table-light table-sm table-striped small mb-0">
                            <thead>
                                <tr>
                                    <th>
                                        <button class="btn btn-info" @onclick="() => closeTableFlux()"><i class="fa-solid fa-xmark"></i></button>
                                    </th>
                                    <th><i class="fa-solid fa-hard-drive"></i> Macchina</th>
                                    <th><i class="fa-regular fa-calendar-days"></i> Data</th>
                                    <th><i class="fa-solid fa-sliders"></i> Data Type</th>
                                    <th style="text-align: right;">
                                        <span class="col-11"> Valore </span>
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (var record in listaFlux)
                                {
                                    <tr class="@checkSelPar(@record)">
                                        <td>
                                            <button @onclick="() => editRecord(record)" class="btn btn-primary btn-sm" title="Modifica Record"><i class="bi bi-pencil-square"></i></button>
                                        </td>
                                        <td>
                                            @record.IdxMacchina
                                        </td>
                                        <td>
                                            @record.dtEvento
                                        </td>
                                        <td>
                                            @traduci(record.CodFlux)
                                            <div class="small textConsensed text-secondary" title="Valore Registrato">@record.CodFlux</div>
                                        </td>
                                        <td style="text-align: right;">
                                            @if (record.ValoreEdit != record.Valore)
                                            {
                                                <div title="Valore Modificato"><span class="small text-dark"></span><b>@record.ValoreEdit</b></div>
                                                <div class="small text-secondary" title="Valore Registrato">(<i>@record.Valore</i>)</div>
                                            }
                                            else
                                            {
                                                <div><span class="small text-dark"></span>@record.ValoreEdit</div>
                                            }
                                        </td>
                                    </tr>
                                }
                            </tbody>
                        </table>
                    </div>
                }
            }
        </div>
    </div>
}