@page
@model EveryThing.Pages.Notes.IndexModel

@{
    Layout = "~/Pages/Layouts/_Layout.cshtml";
}

@section Styles {
    <link rel="stylesheet" href="~/vendor/libs/bootstrap-material-datetimepicker/bootstrap-material-datetimepicker.css">
}

<h4 class="d-flex justify-content-between align-items-center w-100 font-weight-bold py-1 mb-4">
    <span>
        <span class="text-muted font-weight-light">Zapiski /</span> Pregled
    </span>
    
    <a asp-page="Create" class="btn  btn-primary"><span class="fa fas fa-plus"></span>&nbsp; Vnos zapiska</a>
</h4>

<div class="card">
    <h6 class="card-header">
        Seznam zapiskov
        @*<div class="card-header-elements ml-md-auto">
            <button class="btn btn-sm btn-primary" data-toggle="ajax-modal" data-url="@Url.Page("/Notes/Create", "Modal")">
                <span class="ion ion-md-add"></span> Vnos novega zapiska
            </button>
        </div>*@
    </h6>
    <table class="table card-table">
        <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].Status)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].DateSubmitted)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].DateReminder)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].Description)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].Employee)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].Vehicle)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Note[0].Company)
            </th>
            <th></th>
        </tr>
        </thead>
        <tbody>
        @foreach (var item in Model.Note)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Status)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DateSubmitted)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DateReminder)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Description)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Employee.BankAccount)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Vehicle.RegistrationNumber)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Company.Ceo)
                </td>
                <td>
                    <a asp-page="./Edit" asp-route-id="@item.IdNote">Edit</a> |
                    <a asp-page="./Details" asp-route-id="@item.IdNote">Details</a> |
                    <a asp-page="./Delete" asp-route-id="@item.IdNote">Delete</a>
                </td>
            </tr>
        }
        </tbody>
    </table>
</div>

<!-- Modal placeholder -->
<div id="modal-placeholder"></div>

@section Scripts {
    <script src="~/vendor/libs/moment/moment.js"></script>
    <script src="~/vendor/libs/bootstrap-material-datetimepicker/bootstrap-material-datetimepicker.js"></script>
}