@model PantheonRA.BackOffice.Models.CashTransactions.CashReportViewModel
@using PantheonRA.BackOffice.Models
@using PantheonRA.WebApi.Contracts
@{
    Layout = null;
}

@Html.Hidden("SubjectDDW", CashReportDDW.Subject)

<div class="row buttons-tabbed">
    @Html.Partial("_FormButtons", new FormButtonsViewModel
    {
        PrintButtonGroup = new FormButtonGroup
        {
            Buttons = new List<FormButton>
             {
             new FormButton { OnClick = "document.getElementById('cash-report-form').submit();" }
             }
        }

    })
</div>

<div>
    <form id="cash-report-form" action="@Url.Action("PrintReport", "CashTransactions")" method="post" target="_blank">
        <div class="row document-head margin-left-0">
            <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">
                    <!-- Document Type -->
                    @Html.LabelFor(model => model.DocumentType, Loc.DocumentType, new { @class = "control-label" })
                    <select name="DocumentType"
                            data-placeholder="@Loc.DocType"
                            class="form-control select2withAPI"
                            data-url="@Url.Action("GetReportDocumentTypes", "CashTransactions", new { setOf = "B", type1 = "P", type2 = "I" })"
                            data-column-names="@Loc.DocType,@Loc.Name"
                            data-bootstrap-columns="col-md-4,col-md-8"
                            data-selector-separator=" - "
                            data-allow-clear="true"
                            data-search-width="500"
                            id="DocType">
                        <option value="@Model.DocumentType" selected>@Model.DocumentType</option>
                    </select>
                </div>
            </div>
            <div class="col-md-2 col-xs-6">
                <div class="form-group">
                    <!-- DDW -->
                    @Html.LabelFor(model => model.DDW, Loc.PrintoutType, new { @class = "control-label" })
                    <select id="DDW"
                            name="DDW"
                            class="form-control select2"
                            data-column-names="@Loc.DDW"
                            data-bootstrap-columns="col-md-12"
                            onchange="firstColumnName('@Loc.PaymentMethod', '@Loc.Subject');">
                        <option value="@CashReportDDW.PaymentMethod" @(Model.DDW == CashReportDDW.PaymentMethod ? "selected" : string.Empty)>@Loc.CashAccountingByPaymentMethod</option>
                        <option value="@CashReportDDW.Subject" @(Model.DDW == CashReportDDW.Subject ? "selected" : string.Empty)>@Loc.CashAccountingBySubjects</option>
                    </select>
                </div>
            </div>
            <div class="col-md-2 col-xs-6">
                <div class="form-group">
                    <!-- Subject -->
                    @Html.LabelFor(model => model.SubjectId, Loc.Subject, new { @class = "control-label" })
                    <select name="SubjectId"
                            data-placeholder="@Loc.Subject"
                            class="form-control select2withAPI"
                            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-allow-clear="true"
                            data-search-width="700"
                            data-url="@Url.Action("SearchSubjects", "TravelOrdersDistances")"
                            id="SubjectId">
                        <option value="@Model.SubjectId" selected>@Model.SubjectId</option>
                    </select>
                </div>
            </div>
            <div class="col-md-2 col-xs-6">
                <div class="form-group">
                    <!-- DateFrom -->
                    @Html.LabelFor(model => model.DateFrom, Loc.DateFrom, new { @class = "control-label" })
                    <div class="input-group">
                        <span class="input-group-addon"><i class="far fa-calendar alt"></i></span>
                        @Html.TextBoxFor(model => model.DateFrom, Model.DateFrom != null ? Model.DateFrom.ToString("dd.MM.yyyy") : "",
                                       HtmlAttributesHelper.CreateInputAttributes("form-control custom-datepicker", "DateFrom", false))
                    </div>
                </div>
            </div>
            <div class="col-md-2 col-xs-6">
                <div class="form-group">
                    <!-- Date To -->
                    @Html.LabelFor(model => model.DateTo, Loc.DateTo, new { @class = "control-label" })
                    <div class="input-group">
                        <span class="input-group-addon"><i class="far fa-calendar alt"></i></span>
                        @Html.TextBoxFor(model => model.DateTo, Model.DateTo != null ? Model.DateTo.ToString("dd.MM.yyyy") : "",
                                       HtmlAttributesHelper.CreateInputAttributes("form-control custom-datepicker", "DateTo", false))
                    </div>
                </div>
            </div>
        </div>

        <div class="project-list">
            <div class="document-list po-fixed-doc">
                <table id="cashreport" data-grid-id="cash-report" data-url="@Url.Action("CashReportList", "CashTransactions")" class="list-table">
                    <thead>
                        <tr>
                            <th id="th-payment-or-subject" style="width: 60%">@Loc.PaymentMethod</th>
                            <th style="width: 12%" class="text-right mr-1">@Loc.Receipt</th>
                            <th style="width: 12%" class="text-right mr-1">@Loc.Expenditure</th>
                            <th style="width: 16%" class="text-right mr-1">@Loc.Balance</th>
                        </tr>
                    </thead>
                </table>
            </div>

            <div class="row document-footer document-footer-sm">
                <div class="col-md-5 hidden-xs hidden-sm">
                </div>
                <div class="col-md-2 col-xs-6">
                    <div class="form-group m-tb-0">
                        <span>@Loc.Receipt:</span>
                        <span id="ReceiptSum" class="font-bold"></span>
                    </div>
                </div>
                <div class="col-md-2 col-xs-6">
                    <div class="form-group m-tb-0">
                        <span>@Loc.Expenditure:</span>
                        <span id="ExpenditureSum" class="font-bold"></span>
                    </div>
                </div>
                <div class="col-md-3 col-xs-12 document-head-highlight-input">
                    <div class="form-group text-center m-tb-0">
                        <span>@Loc.Total: </span>
                        <span id="TotalSum" class="font-bold"></span>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>