@using InventoryManager.Tools;
@model IEnumerable<InventoryManager.Models.Materials>

@{
    string currentModel = ModelHelper.GetModelName(Model.GetType().ToString());
    ViewData["Title"] = currentModel;
    SortModel sortModel = (SortModel)ViewData["sortModel"];
    PagerModel pager = ViewBag.Pager;
}

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" />

<div class="container mainDiv">
    <div class="categoryContainer">
        <div class="container-fluid btn-group">
            <div class="col-8">
                <h2>@ViewData["Title"]</h2>
            </div>
            <div class="col-4 d-flex justify-content-end">
                <p>
                    <a asp-action="Create" class="btn btn-success font-weight-bold text-white" style="border-radius:10px; color:white; background-color:black!important; border-color:black;">Create New</a>
                </p>
            </div>
        </div>
        <br />
        <div class="row">
            <div class="col-12">
                <partial name="_topBar" model="@pager"/>
            </div>
        </div>
        <table class="table">
            <thead>
                <tr>
                    <th>
                        <i class="@sortModel.GetColumn("name").SortIcon" arial-hidden="true"></i>
                        <a asp-action="Index" style="color:black" asp-route-sortExpression="@sortModel.GetColumn("name").SortExpression">
                        @Html.DisplayNameFor(model => model.Name)
                        </a>
                    </th>
                    <th>
                        <i class="@sortModel.GetColumn("description").SortIcon" arial-hidden="true"></i>
                        <a asp-action="Index" style="color:black" asp-route-sortExpression="@sortModel.GetColumn("description").SortExpression">
                        @Html.DisplayNameFor(model => model.Description)
                        </a>
                    </th>
                    <th>
                        <i class="@sortModel.GetColumn("unit").SortIcon" arial-hidden="true"></i>
                        <a asp-action="Index" style="color:black" asp-route-sortExpression="@sortModel.GetColumn("unit").SortExpression">
                            @Html.DisplayNameFor(model => model.Unit)
                        </a>
                    </th>
                    <th>
                        <i class="@sortModel.GetColumn("supplier").SortIcon" arial-hidden="true"></i>
                        <a asp-action="Index" style="color:black" asp-route-sortExpression="@sortModel.GetColumn("supplier").SortExpression">
                            @Html.DisplayNameFor(model => model.Supplier)
                        </a>
                    </th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
        @foreach (var item in Model) {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Description)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Units.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Suppliers.Name)
                    </td>
                    <td>
                        <a asp-action="Edit" asp-route-id="@item.Id">
                            <span class="btn btn-sm btn-outline-primary">
                                <i class=" fa fa-edit" aria-hidden="true"></i>
                            </span>
                        </a>
                        <a asp-action="Details" asp-route-id="@item.Id">
                            <span class="btn btn-sm btn-outline-dark">
                                <i class=" fa fa-eye" aria-hidden="true"></i>
                            </span>
                        </a> 
                        <a asp-action="Delete" asp-route-id="@item.Id">
                            <span class="btn btn-sm btn-outline-danger">
                                <i class=" fa fa-trash" aria-hidden="true"></i>
                            </span>
                        </a>
                    </td>
                </tr>
        }
            </tbody>
        </table>
        <div class="row">
            <div class="col-12">
                <partial name="_bottomBar" model="@pager" />
            </div>
        </div>
    </div>
</div>

@section Scripts{
    <script type="text/javascript">
    function openSuccessModal(strMessage){
        var myDiv = document.getElementById("MyModalSuccessAlertBody");
        myDiv.innerHTML = strMessage;
        $('#myModalSuccess').modal('show');
    }

    $(document).ready(function()
    {
        var msg = "@TempData["SuccessMessage"]"
        if(msg)
        openSuccessModal(msg);
    })

</script>
}