@page "/tickets"
@using HeartTrack.Models


<PageTitle>Tickets</PageTitle>

<h1>Tickets list</h1>

This is the ticket list of users.

<div>

    <MudButtonGroup Color="Color.Primary" Variant="Variant.Filled" Style="margin-top:50px; margin-bottom:5px;">
        <MudButton OnClick="OnNavigateOnAddClicked">Add</MudButton>
    </MudButtonGroup>
</div>


<DataGrid @ref="dataGrid"
          TItem="Ticket"
          Data="@tickets"
          ReadData="@OnReadData"
          TotalItems="@totalTicket"
          PageSize="10"
          ShowPager
          Responsive
          Sortable
          SortMode="DataGridSortMode.Single">
    <DataGridColumn TItem="Ticket" Field="@nameof(Ticket.Username)" Caption="Username" Width="200px"/>
    <DataGridColumn TItem="Ticket" Field="@nameof(Ticket.Contexte)" Caption="Context" />
     <DataGridColumn TItem="Ticket" Field="@nameof(Ticket.isCheck)" Caption="Status" SortField="@nameof( Ticket.isCheck )" SortDirection="Blazorise.SortDirection.Ascending" Width="150px" Editable>
        <DisplayTemplate>
            @if (context.isCheck)
                {
                <MudChip Variant="Variant.Outlined" Color="Color.Success">Closed</MudChip>

            } else
            {
                <MudChip Variant="Variant.Outlined" Color="Color.Error">Open</MudChip>

            }
        </DisplayTemplate>
    </DataGridColumn>
    <DataGridColumn TItem="Ticket" Field="@nameof(Ticket.Id)" Caption="Actions" Sortable="false" Width="150px">
        <DisplayTemplate>
            @if (context.isCheck)
            {
                <MudFab Color="Color.Tertiary" StartIcon="@Icons.Material.Filled.RemoveRedEye" Size="Size.Small" @onclick="(() => OnView(context.Id))"/>
                <MudFab Color="Color.Secondary" StartIcon="@Icons.Material.Filled.Delete" Size="Size.Small" @onclick="() => OnDelete(context)" />
            }
            else
            {
                <MudFab Color="Color.Tertiary" StartIcon="@Icons.Material.Filled.RemoveRedEye" Size="Size.Small" @onclick="() => OnView(context.Id)" />
                <MudFab Color="Color.Secondary" StartIcon="@Icons.Material.Filled.Close" Size="Size.Small" @onclick="() => OnClose(context.Id)" />
                <MudFab Color="Color.Secondary" StartIcon="@Icons.Material.Filled.Delete" Size="Size.Small" @onclick="() => OnDelete(context)" />
            }
        </DisplayTemplate>
    </DataGridColumn>
</DataGrid>