@model Neo.LegitimateLicences.ApplicationRequest.ApplicationRequestFormModel
@using Neo.Afx.Mvc
@using Neo.Afx.ComponentModel
@using Neo.LegitimateLicences.Common;

@{
    Layout = "~/Views/Shared/_LayoutBlank.cshtml";
}

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

    @Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
    {
        application: ko.mapping.fromJSON('@Html.Raw(Model.ApplicationView.ToJson(JsonSerializerOptions.EscapeBackSlash | JsonSerializerOptions.FormatDateTime))'),
        data: ko.mapping.fromJSON('@Html.Raw(Model.Data.ToJson(JsonSerializerOptions.EscapeBackSlash | JsonSerializerOptions.FormatDateTime))'),
        wf: @Html.Raw(Model.WorkflowInstance.ToJson(JsonSerializerOptions.None)),
        documentStoreLocationID: ko.observable(3),
        entityID: ko.observable(@((short)EntityEnum.ApplicationLicences)),
        itemID: ko.observable(@(((dynamic)Model.Data).ApplicationLicenceID)),
        isUnscheduledService: ko.observable('@Html.Raw(Model.IsUnscheduledService.ToString().ToLower())'),
        divisionTypeID: ko.observable(@(((dynamic)Model.ApplicationView).DivisionTypeID))
    });
</script>

<div id="@(new HtmlString("koContainer" + Model.AjaxRequestTicket))" class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title">Vehicle Documents</h4>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-sm-12 col-lg-4">
                        <div class="form-group bmd-form-group">
                            <label class="bmd-label-floating">Roadworthy Certificate :</label>
                            <span id="RoadworthyCertificateDocID" data-fileuploader-bind="documentID:data.RoadworthyCertificateDocID, itemID: itemID, entityID: entityID, documentTypeID: @((short)DocumentTypeEnum.VehicleRoadworthyCertificate), documentStoreLocationID: documentStoreLocationID, scanEnabled: false, enabled: false, scanPreviewEnabled: true, fileTextBoxVisible: false, verificationStatusVisible:true, floatButtons:left, viewModelName:dialogViewModel" />
                        </div>
                    </div>

                    <div class="col-sm-12 col-lg-4" data-bind="visible: divisionTypeID()!='2'">
                        <div class="form-group bmd-form-group">
                            <label class="bmd-label-floating">Professional Driver’s Permit :</label>
                            <span id="ProfessionalDriversPermitDocID" data-fileuploader-bind="documentID:data.ProfessionalDriversPermitDocID, itemID: itemID, entityID: entityID, documentTypeID: @((short)DocumentTypeEnum.ProfessionalDriversPermit), documentStoreLocationID: documentStoreLocationID, scanEnabled: false, enabled: false, scanPreviewEnabled: true, fileTextBoxVisible: false, verificationStatusVisible:true, floatButtons:left, viewModelName:dialogViewModel" />
                        </div>
                    </div>

                    <div class="col-sm-12 col-lg-4">
                        <div class="form-group bmd-form-group">
                            <label class="bmd-label-floating">Certificate Of Registration :</label>
                            <span id="CertificateOfRegistrationDocID" data-fileuploader-bind="documentID:data.CertificateOfRegistrationDocID, itemID: itemID, entityID: entityID, documentTypeID: @((short)DocumentTypeEnum.VehicleCertificateOfRegistration), documentStoreLocationID: documentStoreLocationID, scanEnabled: false, enabled: false, scanPreviewEnabled: true, fileTextBoxVisible: false, verificationStatusVisible:true, floatButtons:left, viewModelName:dialogViewModel" />
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm-12 col-lg-4" data-bind="visible: divisionTypeID()=='2'">
                        <div class="form-group bmd-form-group">
                            <label class="bmd-label-floating">Service Records : </label>
                            <span id="CertifiedServiceRecordsDocID" data-fileuploader-bind="documentID:data.CertifiedServiceRecordsDocID, itemID: itemID, entityID: entityID, documentTypeID: @((short)DocumentTypeEnum.CertifiedServiceRecords), documentStoreLocationID: documentStoreLocationID, scanEnabled: false, enabled: false, scanPreviewEnabled: true, fileTextBoxVisible: false, verificationStatusVisible:true, floatButtons:left, viewModelName:dialogViewModel" />
                        </div>
                    </div>
                    <div class="col-sm-12 col-lg-4" data-bind="visible: divisionTypeID()=='2'">
                        <div class="form-group bmd-form-group">
                            <label class="bmd-label-floating">Public Passanger Liability : </label>
                            <span id="CertifiedPublicPassangerLiabilityDocID" data-fileuploader-bind="documentID:data.CertifiedPublicPassangerLiabilityDocID, itemID: itemID, entityID: entityID, documentTypeID: @((short)DocumentTypeEnum.CertifiedPublicPassangerLiability), documentStoreLocationID: documentStoreLocationID, scanEnabled: false, enabled: false, scanPreviewEnabled: true, fileTextBoxVisible: false, verificationStatusVisible:true, floatButtons:left, viewModelName:dialogViewModel" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            @if (Model.CanEditNewVehicleDocuments)
            {
                <button id="saveButton" class="btn btn-primary" data-bind="click: function() { dialogViewModel.SaveVehicle(); } ">Save</button>
            }
        </div>
    </div>
</div>

<script>
@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
{
    VDValidate: function () {
        var s = this;
        var e = [];
        var v = s.data;
        var _v = app.utils.validator;
        var currentYear = new Date().getFullYear();
        app.utils.validator.autoColorElement(true);

        _v.isModelFieldEmpty("dialogViewModel.data.RoadworthyCertificateDocID", "Roadworthy Certificate", e);
        _v.isModelFieldEmpty("dialogViewModel.data.CertificateOfRegistrationDocID", "Certificate Of Registration", e);

        // Check if PDP is required based on division type AND service type
        // PDP is NOT required for scholar service (ServiceTypeID = 6)
        if (s.divisionTypeID() != 2 && s.application.ServiceTypeID() != 6) {
            _v.isModelFieldEmpty("dialogViewModel.data.ProfessionalDriversPermitDocID", "Professional Drivers Permit", e);
        }

        if (s.divisionTypeID() == 2) {
            _v.isModelFieldEmpty("dialogViewModel.data.CertifiedServiceRecordsDocID", "Certified Service Records", e);
            _v.isModelFieldEmpty("dialogViewModel.data.CertifiedPublicPassangerLiabilityDocID", "Certified Public Passanger Liability", e);
        }

        if (e.length > 0) {
            app.dialogs.showValidationErrors.fire({ title: 'Validation Error', html: e.join("<br/>") });
        }

        return (e.length == 0)
    },

    SaveVehicle: function ()
    {
        var self = this;
        if (self.VDValidate()) {
            $(".modal-dialog.modal-lg").addClass("is-loading");

            var data = {
                applicationDetailID: viewModel.data.ApplicationDetailID(),
                value: self.data
            };

            app.dataManager.post(
                'ApplicationRequest',
                'SaveLicenceVehicleDocuments',
                data,
                function (result) {
                    if (result.Success) {
                        $(".close").click()
                        $("#licenceDetails").trigger("LicenceVehicleUpdated", self.data);
                    }
                    else {
                        $(".modal-dialog.modal-lg").removeClass("is-loading");
                        app.dialogs.showError.fire({title: 'Save error', html: result.Error });
                    }
                }, function (errorObj, errorStatus, errorText) {
                    $(".modal-dialog.modal-lg").removeClass("is-loading");
                    app.dialogs.showError.fire({title: 'Save error', html: errorText });
                });
        }
    },

    VehicleModels: function () {
        return ko.utils.arrayFilter(app.lookups.GetLookupValues(dialogViewModel, 'VehicleModels'), function (vm) {
            if (vm.Properties.vehiclemakeid == dialogViewModel.data.VehicleMakeID()) {
                return true;
            }
            else {
                return false;
            }
        });
    }
});
</script>

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

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

        widgets.applyFileUploaderBindingsElement($('#RoadworthyCertificateDocID'));
        widgets.applyFileUploaderBindingsElement($('#ProfessionalDriversPermitDocID'));
        widgets.applyFileUploaderBindingsElement($('#CertificateOfRegistrationDocID'));
        widgets.applyFileUploaderBindingsElement($('#CertifiedServiceRecordsDocID'));
        widgets.applyFileUploaderBindingsElement($('#CertifiedPublicPassangerLiabilityDocID'));

    });
</script>