@model PantheonRA.BackOffice.Models.DebtStructuresFilterModel
@using PantheonRA.WebApi.Contracts
@using PantheonRA.BackOffice.Enums

@Html.Hidden("DebtStatus", DebtStructureStatus.NotYetOverdue)
@Html.Hidden("DebtStucturesPrintUrl", Url.Action("DebtStructurePrintPAAS", "DebtStructures"))
<input type="hidden" id="ConfirmLoc" value="@Loc.Confirm" />

<div class="wrapper wrapper-content">
    <div class="tabs-container">
        @Html.Partial("~/Views/Reports/_ReportsTabNavigation.cshtml")
        <div class="row buttons-tabbed">
           @Html.Partial("~/Views/Shared/Components/_PrintMenuButton.cshtml", new PantheonRA.BackOffice.Models.PrintMenuDropdownViewModel
           {
               PrintButtonGroup = ReportsHelper.FormatReportTree(
                    Model.ReportTree,
                    "printDebtStructures('{0}')",
                    null
                ),
               PrintType = ReportFormName.DebtStructures,
               PrintButtonId = "printButton"
           })
        </div>
        <form id="debt-structures-form" action="@Url.Action("PrintDocument", "DebtStructures")" method="post" target="_blank">
            <div class="row document-head">
                @Html.HiddenFor(model => model.DefaultDecimalPlacesPrice)
                @Html.HiddenFor(model => model.DefaultDecimalPlacesQuantity)
                @Html.HiddenFor(model => model.DefaultDecimalPlacesValue)
                <div class="col-md-2 col-xs-6">
                    <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">
                        @Html.LabelFor(model => model.DateFrom, Loc.DateOfCalculation, new { @class = "control-label" })
                        <div class="input-group">
                            <span class="input-group-addon"><i class="far fa-calendar alt"></i></span>
                            @Html.TextBox("DateFrom", Model.DateFrom.ToString(Loc.DateFormat), new { @id = "DateFrom", @class = "form-control filter-datepicker input-horizontal-small-label", @autocomplete = "off" })
                        </div>
                    </div>
                </div>
                <div class="col-md-2 col-xs-6">
                    <div class="form-group">
                        @Html.Label(Loc.Subject, new { @class = "control-label" })
                        <select id="SubjectId"
                                name="SubjectId"
                                data-placeholder="@Loc.Subject"
                                class="form-control select2withAPI"
                                data-url=@Url.Action("SearchSubjects", "TravelOrdersDistances")
                                data-column-names="@Loc.Company,@Loc.Name,@Loc.Address,@Loc.Post"
                                data-bootstrap-columns="col-md-4,col-md-4,col-md-3,col-md-1"
                                data-splitter=","
                                data-search-width="800"
                                data-allow-clear="true"
                                onchange="ChangeFormValue('@Model.SubjectId', 'Subject');">
                            <option selected="selected">@Model.SubjectId</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-2 col-xs-6">
                    <div class="form-group">
                        @Html.Label(Loc.TypeOfSubject, new { @class = "control-label" })
                        <select name="Type"
                                id="Type"
                                class="form-control select2"
                                data-url="">
                            <option value="@DebtStructureType.BuyersSuppliers" selected>@Loc.All</option>
                            <option value="@DebtStructureType.Buyers">@Loc.Buyers</option>
                            <option value="@DebtStructureType.Suppliers">@Loc.Suppliers</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-2 col-xs-6">
                    <div class="form-group">
                        @Html.Label(Loc.TypeOfView, new { @class = "control-label" })
                        <select name="DetailedByBills" id="DetailedByBills"
                                data-placeholder="@Loc.DetailedByBills"
                                class="form-control select2"
                                data-url="">
                            <option value="Details" selected>@Loc.DetailedByDocument</option>
                            <option value="Summary">@Loc.DetailedByDocumentWithValue</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-2 col-xs-6">
                    <div class="form-group">
                        @Html.Label(Loc.Status, new { @class = "control-label" })
                        <select name="OpenItem" id="OpenItem"
                                data-placeholder="@Loc.OpenItems"
                                class="form-control select2"
                                onchange="changeColumnName('@Loc.OutsItemsDue', '@Loc.OutsItemsNonDue');"
                                data-url="">
                            <option value="@DebtStructureStatus.NotYetOverdue">@Loc.OutsItemsOpen</option>
                            <option value="@DebtStructureStatus.Overdue" selected>@Loc.OutsItemsDue</option>
                        </select>
                    </div>
                </div>
            </div>
        </form>

        <div class="project-list">
            <div class="document-list outstandingitems-list">
                <table id="debtStructures" data-grid-id="debt-structures" data-url="@Url.Action("DebtStructuresList", "DebtStructures")" class="list-table">
                    <thead>
                        <tr>
                            <th>@Loc.Partner</th>
                            <th class="text-right" id="th-open-or-due">@Loc.Due</th>
                            <th class="text-right">@Loc.From 1 @Loc.To.ToLowerInvariant() 14</th>
                            <th class="text-right">@Loc.From 15 @Loc.To.ToLowerInvariant() 29</th>
                            <th class="text-right">@Loc.From 30 @Loc.To.ToLowerInvariant() 59</th>
                            <th class="text-right">@Loc.From 60 @Loc.To.ToLowerInvariant() 89</th>
                            <th class="text-right">@Loc.From 90</th>
                            <th class="text-right">@Loc.Total</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>

<script src="~/Scripts/custom/debtstructures/debtstructures.js"></script>
<script src="~/Scripts/custom/global-helpers.js"></script>

<script>
    $(document).ready(function () {
        initializeDebtStructures();
    });
</script>

@* TODO: remove after refactor *@
@section pageScripts{
    @Scripts.Render("~/bundles/validation")
    <script src="~/Scripts/global-script.js"></script>
}