@model Neo.LegitimateLicences.LicenceIssueRequest.LicenceIssueRequestDashboardModel
@using Neo.Afx.ComponentModel
@using Neo.Afx.Security
@using Neo.Afx.Mvc
@using Neo.LegitimateLicences.Common;

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

@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
{
    licenceIssue: ko.mapping.fromJSON('@Html.Raw(Model.LicenceIssueView.ToJson(JsonSerializerOptions.EscapeBackSlash | JsonSerializerOptions.FormatDateTime))'),    
    comments: ko.observable(@Html.Raw(Model.Comments.ToJson(JsonSerializerOptions.FormatDateTime | JsonSerializerOptions.EscapeBackSlash))),
    data: ko.mapping.fromJSON('@Html.Raw(Model.Data.ToJson(JsonSerializerOptions.EscapeBackSlash | JsonSerializerOptions.FormatDateTime))'),    
    wf: @Html.Raw(Model.WorkflowInstance.ToJson(JsonSerializerOptions.None)),
   licenceIssuingStatusSummary: @Html.Raw(Model.LicenceIssuingStatusSummary.ToJson(JsonSerializerOptions.None)),

});
</script>

<script type="text/javascript">
@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
{
    RecalculateExceptions: function() {
        var s = viewModel;
        var pushData = {
            licenceID: s.licenceIssue.VerifiedLicenceID()
        };
        $("#RecalculateExceptions").addClass("is-loading");

        app.dataManager.post("LicenceIssueRequest", 'RecalculateExceptions', pushData,
            function (result) {
                if (result != null) {
                    $("#RecalculateExceptions").removeClass("is-loading");
                    if (result.Success) {
                        app.reload();
                    }
                    else {
                        app.dialogs.showError.fire({ title: 'Error', html: result.Error });
                    }
                }
            }, function (errorObj, errorStatus, errorText) {
                app.dialogs.showError.fire({ title: 'Error', html: errorText });
            });
    }
});
</script>

<div id="@(new HtmlString("koContainer" + Model.AjaxRequestTicket))">
    @Html.Partial("Console.PageHeader")

    <div class="row">
        <div class="col">
            <div class="card">
                <div class="card-header navbar">
                    <h4 class="card-title" data-bind="text:wf.Description"></h4>
                </div>
                <div class="card-body">
                    <div class="row" data-bind="foreach:licenceIssuingStatusSummary">
                        <div class="item col-sm-12 col-lg-4">
                            <div class="card card-round card-clickable d-flex" style="/*height:75px;*/ text-align:center;"
                                 data-bind="css: { statusComplete: (Status=='Complete'), statusInProgress: (Status=='In Progress'), statusNotRequired:(Status=='Not Required'), statusNotStarted:(Status=='Not Started') }">
                                <div class="card-body align-items-center d-flex justify-content-center">
                                    <h4 data-bind="text:Title + '(' + Status + ')'"></h4>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="card-body">

                        <div class="card-title">Exceptions</div>
                        <div class="card-content">
                            <span data-bind="visible: data.Exceptions().length == 0">There are no exceptions on this licence.</span>
                            <ul data-bind="foreach: data.Exceptions(), visible: data.Exceptions().length > 0">
                                <li data-bind="text:Exception()"></li>
                            </ul>
                        </div>
                        <div class="card-footer">
                            <button data-bind="click: RecalculateExceptions, visible: data.Exceptions().length > 0" class="btn btn-primary pull-right">Recalculate Exceptions</button>
                        </div>

                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-3 col-lg-3" data-bind="visible: comments().length > 0">
            <div id="MainCard" class="card">
                <div class="card-header navbar">
                    <h4 class="card-title">
                        Latest Comments
                    </h4>
                </div>
                <div class="card-body">
                    <div data-bind="foreach: comments">
                        <div style="padding-bottom:15px;" class="row">
                            <div class="item col-sm-12 col-lg-12">
                                <div>
                                    <label class="bmd-label-floating" data-bind="text:Comments"></label><br />
                                    <span style="font-weight:bold;" data-bind="text:UserCreatedBy.FullName + ' @@ ' + CreatedDate"></span>
                                </div>
                            </div>
                        </div>
                    </div>

                </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]);

        SetActiveMenu("#Dashboard");
    });
    </script>