@model EveryThing.Pages.Notes.IndexModel

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

<div class="card">
    <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>
    <script src="~/js/forms.js" asp-append-version="true"></script>
}