@model  Neo.LegitimateLicences.OperatingLicenceConsole.VehicleModel
@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;
    var canUpdate = false;
    if (SecurityHelper.UserHasRole(((UserProfile)Profile).Roles, Neo.LegitimateLicences.Common.RoleEnum.DataPurification))
    {
        foreach (var e in Model.OperatingLicence.LicenceExceptions)
        {
            if (e.Exception == "Not all the vehicle details have been specified")
            {
                canUpdate = true;
            }
        }
    }
}

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

@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
{
        OperatingLicenceDetail: ko.mapping.fromJSON('@Html.Raw(Model.OperatingLicence.ToJson(JsonSerializerOptions.FormatDateTime | JsonSerializerOptions.EscapeBackSlash))'),        
            lookups: @Html.Raw(Model.Lookups.ToJson(JsonSerializerOptions.EscapeBackSlash | JsonSerializerOptions.FormatDateTime)),
        entityID: ko.mapping.fromJSON('@Html.Raw(Model.entityID.ToJson(JsonSerializerOptions.None))'),
        itemID: ko.mapping.fromJSON('@Html.Raw(Model.itemID.ToJson(JsonSerializerOptions.None))'),
        documentStoreLocationID: ko.observable(@Model.DocumentStoreLocationID),
        CanUpdateVehicleDetails: ko.observable(@canUpdate.ToString().ToLower()),
        VehicleDocuments: @Html.Raw(Model.VehicleDocuments.ToJson(JsonSerializerOptions.FormatDateTime | JsonSerializerOptions.EscapeBackSlash))
});
</script>

<script type="text/javascript">
@Html.Raw("$.extend(ViewModel" + Model.AjaxRequestTicket + ".prototype,")
{
        SaveVehicle: function (data) {
            var s = viewModel;

            var data = s.OperatingLicenceDetail;

            app.dataManager.post("OperatingLicenceConsole", "SaveVehicleDetails", data, function (result) {
                if (result != null) {
                    if (result.Success) {
                        location.reload();
                    }
                    else {
                        alert(result.ErrorMessage);
                    }
                }
            }, null);
        },

        FlagVinAsCorrect: function (data) {
            var s = viewModel;

            if (confirm('Are you sure you want to flag the VIN number as correct, and as per the vehicle logbook?')) {
                var data = s.OperatingLicenceDetail;
                app.dataManager.post("OperatingLicenceConsole", "FlagvehicleVinAsCorrect", data, function (result) {
                    if (result != null) {
                        if (result.Success) {
                            location.reload();
                        }
                        else {
                            alert(result.ErrorMessage);
                        }
                    }
                }, null);
            }

        },
        DelinkVehicle: function () {

            var reason = prompt("What is the reason for Delinking the Vehicle?", '');
            if (reason != null && reason != '') {
                var s = viewModel;
                var licenceId = s.OperatingLicenceDetail.LicenceID();

                var data =
                {
                    licenceId: licenceId,
                    reason: reason
                };
                app.dataManager.post("OperatingLicenceConsole", "DelinkVehicle", data,
                    function (result) {
                        if (result != null) {
                            if (result.Success) {
                                location.reload();
                            }
                            else {
                                alert(result.ErrorMessage);
                            }
                        }
                    },
                    null);
            };
        },

        GetLookupValues: function (listName) {
            var s = this;
            var lookups = s.lookups;

            for (var l = 0; l < lookups.length; l++) {
                if (lookups[l].ListName == listName) {
                    return app.utils.cleanIntegrationLookup(lookups[l].List);
                }
            }
        }
});
</script>

<div id="@(new HtmlString("koContainer" + Model.AjaxRequestTicket))">
    <div class="page-header flex-lock">
        <h4 class="page-title">Vehicle Details</h4>
        <ul class="breadcrumbs">
            <li class="nav-home">
                <a href="/#OperatingLicences/Default">
                    <i class="flaticon-home"></i>
                </a>
            </li>
            <li class="separator">
                <i class="flaticon-right-arrow"></i>
            </li>
            <li class="nav-item" data-bind="text:OperatingLicenceDetail.OperatingLicenceNumber">
            </li>
        </ul>
    </div>

    <div class="row">
        <div class="col">
            <div id="TabbedCard" class="card">
                <div class="card-header navbar">
                    <ul>
                        <li><h4>Operating Licence Name: <span data-bind="html: OperatingLicenceDetail.NameOnLicence"></span></h4></li>
                        <li><h4>Operating Licence Number: <span data-bind="html: OperatingLicenceDetail.OperatingLicenceNumber"></span></h4></li>
                        <li><h4>Operating Licence Status: <span data-bind="html: OperatingLicenceDetail.Status.Title"></span></h4></li>
                    </ul>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Reference</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.ReferenceNumber, enable: false" maxlength="50" class="form-control" />
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Vehicle Registration Number</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.RegistrationNumber, enable: false" maxlength="50" class="form-control" />
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Issue Number</label>
                                <input type="text"  data-bind="value: OperatingLicenceDetail.IssueNumber, enable: false" maxlength="50" class="form-control" />
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">VIN / Chassis Number</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.VIN, enable: false" maxlength="50" class="form-control" />
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Engine Number</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.EngineNumber, enable: false" maxlength="50" class="form-control" />
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Make</label>
                                <select id="VehicleMakeID" data-bind="options: GetLookupValues('VehicleMakes'), optionsCaption: 'Please select a Vehicle Make', optionsText: 'Title', optionsValue: 'Key', value: OperatingLicenceDetail.Vehicle.VehicleMakeID, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.VehicleMakeID()==null" class="form-control"></select>
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Year of Manufatcure</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.YearOfManufacture, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.YearOfManufacture()==null" maxlength="4" class="form-control" />
                            </div>
                        </div>
                    </div>


                    <div class="row">
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Vehicle Type</label>
                                <select id="VehicleTypes" data-bind="options: GetLookupValues('VehicleTypes'), optionsCaption: 'Please select a Vehicle Type', optionsText: 'Title', optionsValue: 'Key', value: OperatingLicenceDetail.Vehicle.VehicleTypeID, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.VehicleTypeID()==null" class="form-control"></select>
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Carrying Capacity</label>
                                <select id="CarryingCapacities" data-bind="options: GetLookupValues('CarryingCapacities'), optionsCaption: 'Please select a Carrying Capacity', optionsText: 'Title', optionsValue: 'Key', value: OperatingLicenceDetail.Vehicle.CarryingCapacityID, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.CarryingCapacityID()==null" class="form-control"></select>
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Seated Capacity</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.SeatedCapacity, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.SeatedCapacity()==null" maxlength="50" class="form-control" />
                            </div>
                        </div>
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Standing Capacity</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.StandingCapacity, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.StandingCapacity()==null" class="form-control" />
                            </div>
                        </div>
                    </div>


                    <div class="row">
                        <div class="col-sm-12 col-lg-4 col-xl-3">
                            <div class="form-group bmd-form-group">
                                <label class="bmd-label-floating">Gross Mass</label>
                                <input type="text" data-bind="value: OperatingLicenceDetail.Vehicle.GrossMass, enable: CanUpdateVehicleDetails() && OperatingLicenceDetail.Vehicle.GrossMass()==null" maxlength="50" class="form-control" />
                            </div>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="card-footer">
                    @if (SecurityHelper.UserHasAccessToSecurable(userSecurables.ToList(), SecurableEnum.OperatingLicencesModule_LicenceConsole_UpdateVerifiedVehicleDetalis))
                    {
                        <text>
                            <button class="btn btn-primary btn-round float-right" data-bind="click: function() { viewModel.SaveVehicle(); }">
                                <i class="fa fa-save"></i>&nbsp;Save
                            </button>
                        </text>
                    }

                    @if (SecurityHelper.UserHasAccessToSecurable(userSecurables.ToList(), SecurableEnum.OperatingLicencesModule_DelinkVehicle))
                    {
                        if (!Model.IsVehicleDelinked)
                        {
                            <text>
                                <button class="btn btn-primary btn-round float-right" data-bind="click: function() { viewModel.DelinkVehicle(); }">
                                    <i class="fa fa-save"></i>&nbsp;Delink Vehicle
                                </button>&nbsp;
                            </text>
                        }
                    }

                    @if (SecurityHelper.UserHasAccessToSecurable(userSecurables.ToList(), SecurableEnum.OperatingLicencesModule_LicenceConsole_FlagVINasCorrect))
                    {
                        if (Model.ShowFlagVinAsCorrectButton)
                        {
                            <text>
                                <button class="btn btn-primary btn-round float-right" data-bind="click: function() { viewModel.FlagVinAsCorrect(); }">
                                    <i class="fa fa-save"></i>&nbsp;Flag VIN as correct
                                </button>&nbsp;
                            </text>
                        }
                    }
                </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]);

    });

</script>