@model  Neo.LegitimateLicences.Applications.UnassignedReceiptsModel
@using Neo.Afx.ComponentModel
@using Neo.Afx.Security
@using Neo.Afx.Mvc
@using Neo.LegitimateLicences.Common;


@{
    var userSecurables = (Profile != null && ((Neo.Afx.Security.UserProfile)Profile).Securables != null) ? ((Neo.Afx.Security.UserProfile)Profile).Securables.ToList() : null;
}

<script type="text/javascript">
@Html.Raw("function ViewModel" + Model.AjaxRequestTicket + "() { }")

@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
    {
        UnassignedReceipts: ko.mapping.fromJSON('@Html.Raw(Model.UnassignedReceipts.ToJson(JsonSerializerOptions.FormatDateTime | JsonSerializerOptions.EscapeBackSlash))'),
        lookups: @Html.Raw(Model.Lookups.ToJson(JsonSerializerOptions.EscapeBackSlash | JsonSerializerOptions.FormatDateTime)),
        userEmail: '@(((Neo.Afx.Security.UserProfile)Profile).Email)'
    });
</script>

<script type="text/javascript">
@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
{
        GetReceiptItemValue: function (receiptItems, field) {

            var fieldData = '';

            try {
                fieldData = receiptItems.split(',');
            }
            catch (ex) {
                fieldData = receiptItems().split(',');
            }

            if (fieldData.length >= 8) {
                if (field == 'idnumber') {
                    return fieldData[1];
                }
                else if (field == 'registrationnumber') {
                    return fieldData[7];
                }
                else if (field == 'chassisnumber') {
                    return fieldData[8];
                }
            }
        },

        @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_CancelReceipt))
        {
            <text>
        CancelReceipt: function (receiptDetailID) {
            app.dialogs.requestValue.fire({
                title: 'Why do you need to cancel the receipt?',
                confirmButtonText: 'Cancel Receipt',
                inputValidator: function(value) {
                    if (!value || value.length < 10) {
                        return 'You need to specify a valid reason.'
                    }
                }
            }).then(function(dialogResult) {
                if (dialogResult.value) {
                    var data = {
                        receiptDetailID: receiptDetailID,
                        reason: dialogResult.value
                    };
                    app.dataManager.post("Applications", "CancelReceipt", data, function (result) {
                        if (result != null) {
                            if (result.ErrorMessage == '') {
                                window.location.reload();
                            }
                            else {
                                app.dialogs.showError.fire({ html: result.ErrorMessage });                                
                            }
                        }
                    }, null);
                }
            });
        },
            </text>
        }

        @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_ReprintReceipt))
        {
            <text>
        ReprintReceipt: function (receiptDetailID) {            
            app.dialogs.requestValue.fire({
                title: 'Enter the reason for the reprint:',
                confirmButtonText: 'Start Reprint',
                inputValidator: function(value) {
                    if (!value || value.length < 10) {
                        return 'You need to specify a valid reason.'
                    }
                }
            }).then(function(dialogResult) {
                if (dialogResult.value) {
                    viewModel.CreatePrintRequest(receiptDetailID, true /*isReprint*/, dialogResult.value);
                }
            });
        },

        CreatePrintRequest: function(receiptDetailID, isReprint, reprintReason) {
            var s = viewModel;
            var pushData = {
                entityID: 1001 /*receipt details*/,
                itemID: receiptDetailID,
                printoutTypeID: 1 /*Receipt*/,
                isReprint: isReprint,
                reprintReason: reprintReason,
                isTestPrint: false
            };

            app.dataManager.post("Applications", "StartReceiptPrintout", pushData,
                function (result) {
                    if (result != null) {
                        if (result.ErrorMessage == "") {
                            var w = (window.parent) ? window.parent : window
                            w.location.assign('LegitimateDesktop:print_' + s.userEmail + '_' + result.Result.PrintoutToken);
                        }
                        else {
                            app.dialogs.showError.fire({ html: result.ErrorMessage });
                        }
                    }
                }, null);
        },
            </text>
        }


        @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_Createreceipt))
        {
            <text>
            ShowCreateReceipt: function () {
                $("#CreateReceiptDialog").dialog("open");
            },
            </text>
        }
        //OpenCashupUser: function (data) {

        //    var queryString = 'userID=' + data.UserID();

        //    viewModel.loadConsole("Applications", "CashupUserPage", queryString, true);
        //}

    });
</script>

@if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts))
{
    <div id="@(new HtmlString("koContainer" + Model.AjaxRequestTicket))">
        <div class="page-header flex-lock">
            <h4 class="page-title">Payment</h4>
            <ul class="breadcrumbs">
                <li class="nav-home">
                    <a href="/#Dashboards/Default">
                        <i class="flaticon-home"></i>
                    </a>
                </li>
                <li class="separator">
                    <i class="flaticon-right-arrow"></i>
                </li>
                <li class="nav-item">
                    Payment
                </li>
            </ul>
        </div>

        <div class="row">
            <div class="col">
                <div id="TabbedCard" class="card">
                    <div class="card-header navbar">
                        <h4 class="card-title">Unassigned Receipts</h4>
                    </div>
                    <div class="card-body">
                        <div data-bind="visible: UnassignedReceipts().length > 0" id="unassignedReceipts"></div>
                        <div data-bind="visible: UnassignedReceipts().length == 0">No outstanding cash ups</div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="card-footer">
                        @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_Createreceipt))
                        {
                            <a href="#" class="btn btn-primary float-right" style="color:white;" data-toggle="modal" data-target="#blankModal" data-title="Create Receipt" data-url="/Applications/CreateUnassignedReceipt">Create Receipt</a>
                        }
                    </div>
                </div>
            </div>
        </div>


    </div>
}

    <script type="text/javascript">
    @Html.Raw("var viewModel = new ViewModel" + Model.AjaxRequestTicket + "();")

    $().ready(function () {
        var mainDiv = $("#@(new HtmlString("koContainer" + Model.AjaxRequestTicket))");
        ko.cleanNode(mainDiv[0]);
        ko.applyBindings(viewModel, mainDiv[0]);

        $("#unassignedReceipts").on("ReceiptCreated", function (event, newReceipt) {
            viewModel.CreatePrintRequest(newReceipt.ReceiptDetailID, 0, '');
            viewModel.UnassignedReceipts.push(ko.mapping.fromJS(newReceipt));
            $('#unassignedReceipts').dxDataGrid('instance').option('dataSource', viewModel.UnassignedReceipts());
        });

        $("#unassignedReceipts").dxDataGrid(
            {
                dataSource: viewModel.UnassignedReceipts,
                showColumnLines: false,
                showRowLines: true,
                rowAlternationEnabled: true,
                showBorders: true,
                allowColumnReordering: false,
                allowColumnResizing: true,
                filterRow: { visible: true },
                columns: [
                    {
                        dataField: "ReceiptNumber",
                        caption: "Receipt Number"
                    },
                    {
                        dataField: "ApplicantData",
                        caption: "Applicant"
                    },
                    {
                        caption: "ID Number",
                        cellTemplate: function (container, options) {
                            var rowData = options.row.data;
                            var text = viewModel.GetReceiptItemValue(rowData.ReceiptItems,'idnumber');
                            $('<span">' + text + '</span>').appendTo(container);

                        }
                    },
                    {
                        caption: "Registration Number",
                        cellTemplate: function (container, options) {
                            var rowData = options.row.data;
                            var text = viewModel.GetReceiptItemValue(rowData.ReceiptItems, 'registrationnumber');
                            $('<span>' + text + '</span>').appendTo(container);

                        }
                    },
                    {
                        caption: "Chassis Number",
                        cellTemplate: function (container, options) {
                            var rowData = options.row.data;
                            var text = viewModel.GetReceiptItemValue(rowData.ReceiptItems, 'chassisnumber');
                            $('<span>' + text + '</span>').appendTo(container);

                        }
                    }
                    @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_CancelReceipt) || SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_ReprintReceipt))
                    {
                    <text>
                    ,
                    {
                        caption: "",
                        cellTemplate: function (container, options) {
                            var rowData = options.row.data;
                            var cancelButton = "";
                            var reprintButton = "";
                            @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_CancelReceipt))
                            {
                                <text>
                                cancelButton = '<button href="#" style="width" class="btn btn-primary btn-sm mr-1" style="float: right;" onclick="viewModel.CancelReceipt(\'' + rowData.ReceiptDetailID() + '\')">' + 'Cancel' + '</button>';
                                </text>
                            }

                            @if (SecurityHelper.UserHasAccessToSecurable(userSecurables, SecurableEnum.ApplicationsModule_Receipts_ReprintReceipt))
                            {
                                <text>
                            reprintButton = '<button href="#" style="width" class="btn btn-primary btn-sm mr-1" style="float: right;" onclick="viewModel.ReprintReceipt(\'' + rowData.ReceiptDetailID() + '\')">' + 'Reprint' + '</button>';
                                </text>
                            }

                            $(cancelButton + reprintButton).appendTo(container);
                        }
                    }
                    </text>                        
                    }
                ],
                paging: {
                    enabled: true,
                    pageSize: 20
                },
                selection: {
                    mode: "single"
                }
            });
    });

    </script>