@page "/Session"



<div class="card">
    <div class="card-header d-flex justify-content-between">
        <div class="col-6">
            <h3>Sessione</h3>
        </div>
        <div class="col-6">
            <div class="input-group input-group-sm">
                <div class="input-group-text">
                    <span class="me-1">In corso</span>
                    <div class="form-check form-check-sm form-switch py-1" title="Parameter View Mode (RealTime / LogData)">
                        <input class="form-check-input" type="checkbox" id="mySwitch" name="setupAlarms" @onclick="() => toggle()">
                    </div>
                    <span class="">Concluse</span>
                </div>
            </div>
        </div>
    </div>

    <div class="card-body">
        @if (isLoading)
        {
            <LoadingData></LoadingData>
        }
        else
        {

            <table class="table">
                <thead>
                    <tr>
                        <th scope="col">QR</th>
                        <th scope="col">Description</th>
                        <th scope="col">Operatore</th>
                        <th scope="col">Data inizio</th>
                        <th scope="col">Data fine</th>
                        <th scope="col">Trasferita</th>
                    </tr>
                </thead>
                <tbody>
                    @if (elencoSessioni != null)
                    {
                        @foreach (var item in elencoSessioni)
                        {
                            <tr>
                                <td>
                                    <!-- Button trigger modal -->
                                    <button type="button" class="btn btn-dark" data-bs-toggle="modal" data-bs-target="#exampleModal" @onclick="()=> getCurrSess(item.InveSessID)" title="Apri qr per connettersi alla sessione">
                                        <i class="fa-solid fa-qrcode"></i>
                                    </button>
                                </td>
                                <td>
                                    @item.Description
                                </td>
                                <td>
                                    @item.UserCrea
                                </td>
                                <td>
                                    @item.DtStart
                                </td>
                                @if (item.DtEnd != null)
                                {
                                    <td>
                                        @item.DtEnd
                                    </td>
                                }
                                else
                                {
                                    <td>
                                        In corso...
                                    </td>
                                }
                                <td>
                                    @item.Transferred
                                </td>
                            </tr>

                        }
                    }
                </tbody>
            </table>
        }

    </div>
    <div class="card-footer py-1">
        <DataPager />
    </div>
</div>


<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">CONNETTERSI ALLA SESSIONE: <b>@currIdSess</b></h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="card-body text-center">
                    <div class="img-fluid" id="qrCodeImg_101"></div>
                </div>
            </div>
            <div class="modal-footer">
                <span>
                    Matricola Operatore: <b>@idOperatore</b>
                </span>
            </div>
        </div>
    </div>
</div>