@using PantheonRA.BackOffice.Enums
@using PAW.Contracts.Enums
@model PantheonRA.BackOffice.Models.FixedAssetsGridFilterModel
@{
    ViewBag.Title = Loc.FixedAssets;
    var userCanAccessFaCud = PantheonRA.BackOffice.CurrentUser.CanAccess(PantheonRA.WebApi.Contracts.Enums.Permissions.PARTNER_CUD);
}

<div class="wrapper wrapper-content">
    <div class="tabs-container">
        @Html.Partial("~/Views/Products/_CodeListTabNavigation.cshtml")
        <div class="row buttons-tabbed">
            @if (userCanAccessFaCud)
            {
                <a href="@Url.Action("Create", "FixedAssets")" id="createFixedAssetButton" class="btn btn-primary btn-outline" title="@Loc.Create">
                    <i class="fa fa-plus"></i><span class="bold hidden-xs m-l-xs">@Loc.AddFixedAsset</span>
                </a>
            }
        </div>

        <div class="row document-head">
            <div class="col-md-3">
                <div class="form-group">
                    <label class="control-label">@Loc.SearchFilter</label>
                    @Html.TextBoxFor(model => model.Keywords, new { @id = "Keywords", @class = "form-control search-input", @placeholder = Loc.Search, autocomplete = "off" })
                </div>
            </div>
            <div class="col-md-2 col-xs-6">
                <div class="form-group">
                    <label class="control-label">@Loc.Status</label>
                    @Html.DropDownListFor(model => model.Status, new SelectList(ViewBag.ActiveStatuses != null ? ViewBag.ActiveStatuses : new List<string>(), "Value", "Text"),
                    HtmlAttributesHelper.CreateInputAttributes("form-control search-addon custom-select", "Status", false))
                </div>
            </div>
            <div class="col-md-2 col-xs-6">
                <div class="form-group">
                    <label class="control-label">@Loc.Subtype</label>
                    @Html.DropDownListFor(model => model.Type, new SelectList(ViewBag.TypeSpecs != null ? ViewBag.TypeSpecs : new List<string>(), "Value", "Text"),
                    HtmlAttributesHelper.CreateInputAttributes("form-control search-addon custom-select", "Type", false))
                </div>
            </div>
            <div class="col-md-5 col-xs-6">

            </div>
        </div>

        <div class="project-list">
            <div class="document-list document-list-no-footer">
                <table id="grid-data" data-grid-id="fixedAssets" data-url="@Url.Action("FixedAssetsList", "FixedAssets")" class="list-table">
                    <thead>
                        <tr>
                            <th width="5%">@Loc.Active</th>
                            <th width="5%" data-url="@Url.Action("Edit", "FixedAssets")?id=">@Loc.FaInventNumber</th>
                            <th width="15%">@Loc.Name</th>
                            <th width="5%">@Loc.Quantity</th>
                            <th width="15%">@Loc.Subtype</th>
                            <th width="5%">@Loc.CarRegNo</th>
                            <th width="5%">@Loc.DateOfAcq</th>
                            <th width="5%">@Loc.DateOfActivation</th>
                            <th width="5%">@Loc.AmountAcq</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>

<input type="hidden" id="openFixedAssetUrl" value="@Url.Action("Edit", "FixedAssets")" />
<input type="hidden" id="userCanAccessFaCud" value="@userCanAccessFaCud.ToString()" />


@section pageScripts{
    @Scripts.Render("~/bundles/product")
    <script>
        $(document).ready(function () {
            initalizeFixedAssets();
        });

        function initalizeFixedAssets() {
            var userCanAccessFaCud = $('#userCanAccessFaCud').val() === 'True';

            var acKey = decodeURI(url.searchParams.get("acKey"));

            $dataTable = $('#grid-data');
            $dataTable.DataTable({
                ajax: {
                    url: $dataTable.attr('data-url'),
                    data: function (d) {
                        d.Keywords = $("#Keywords").val();
                        d.Status = $("#Status").val();
                        d.Type = $("#Type").val();
                    }
                },
                columns: [
                    {
                        data: "Active", name: "Active",
                        render: $.fn.dataTable.render.toggle(true, true),
                        className: "dt-body-center"
                    },
                    { data: "InventNum", name: "InventNum", filtertype: "text", render: $.fn.dataTable.render.link("InventNum") },
                    { data: "Name", name: "Name", filtertype: "text" },
                    { data: "Quantity", name: "Quantity", filtertype: "number", render: $.fn.dataTable.render.number('.', ',', 2), className: 'dt-body-right' },
                    { data: "TypeSpecName", name: "TypeSpecName", filtertype: "text" },
                    { data: "CarRegNo", name: "CarRegNo", filtertype: "text" },
                    {
                        data: "DateOfAcq", name: "DateOfAcq",
                        filtertype: "dateTime",
                        className: 'dt-body-left',
                        render: function (data) {
                            if (data === null) {
                                return "";
                            } else {
                                return moment(data).format('DD.MM.YYYY');
                            }
                        }
                    },
                    {
                        data: "DateOfActivation", name: "DateOfActivation",
                        filtertype: "dateTime",
                        className: 'dt-body-left',
                        render: function (data) {
                            if (data === null) {
                                return "";
                            } else {
                                return moment(data).format('DD.MM.YYYY');
                            }
                        }
                    },
                    { data: "AmountAcq", name: "AmountAcq", filtertype: "number", render: $.fn.dataTable.render.number('.', ',', 2), className: 'dt-body-right' },
                ],
                createdRow: function (row, data, dataIndex) {
                    if (data.Id == acKey) {
                        $(row).addClass('side-menu-item-active').children(":first").addClass('side-menu-item-active');
                    }
                }
            });

            $("select").off("change");
            $("select").on("change", function () {
                $.fn.dataTable.reload($dataTable);
            });

            var typingTimer;
            var doneTypingInterval = 600;
            $('#Keywords').off('keyup');
            $('#Keywords').on('keyup', function () {
                clearTimeout(typingTimer);
                typingTimer = setTimeout(function () { $.fn.dataTable.reload($dataTable); }, doneTypingInterval);
            });
        }
    </script>
}
