
<style>

    .inputIcon{
        width:30px;}

    .HideMe{

        display:none
    }
</style>
<div class="modal fade" data-backdrop="static" id="assignVehicleDriver" tabindex="-1" role="dialog" aria-hidden="true"style="width:70%;margin:0 auto">
    <div class="modal-dialog ">
        <div class="modal-content">
            <div class="modal-header clearfix text-left">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="pg-close fs-14"></i></button>
                <h5><span class="semi-bold title"></span></h5>
            </div>
            <div class="modal-body">
                <form id="assignVehicleDriverPostForm" method="POST" onsubmit="return false">
                    <div class="row">
                        <div class="col-md-12 Hide" style="margin:15px;">
                            <div class="col-md-6">
                                <div><label><?php print CommonLanguage::getMessage('vehicle_usage_type'); ?></label></div>
                                <div class="input-group m-b"><span class="input-group-btn">
                                        <button type="button" class="btn btn-bg-success-darker"><i class="fa fa-certificate"></i> </button> </span>
                                    <select required id="Usage_Type" name="Usage_Type" class="full-width " data-init-plugin="select2">
<?php foreach ($all_usageTypes as $type): ?>
                                            <option value="<?php echo $type['Usage_Type_ID']; ?>"><?php echo $type['Usage_Type_Name']; ?></option>
<?php endforeach; ?>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div><label><?php print CommonLanguage::getMessage('reg_nb'); ?></label></div>
                                <div class="input-group m-b"><span class="input-group-btn">
                                        <button type="button" class="btn btn-bg-success-darker"><i class="fa fa-certificate"></i> </button> </span>
                                    <select required id="Assign_Vehicle_Code" name="Assign_Vehicle_Code" class="full-width Assign_Vehicle_Code" data-init-plugin="select2">
<?php foreach ($all_vehicles as $vehicle): ?>
                                            <option value="<?php echo $vehicle['Vehicle_ID']; ?>"><?php echo $vehicle['Vehicle_Registration_Number']; ?></option>
<?php endforeach; ?>

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

                        </div>
                        <div class="col-md-12" style="margin:10px;">
                            <div class="col-md-6">
                                <div><label><?php print CommonLanguage::getMessage('driver'); ?></label></div>
                                <div class="input-group m-b"><span class="input-group-btn">
                                        <button type="button" class="btn btn-bg-success-darker"><i class="fa fa-certificate"></i> </button> </span>
                                    <select required id="Vehicle_Driver" name="Vehicle_Driver" class="full-width " data-init-plugin="select2">
                                        <option value="0" selected><?php print CommonLanguage::getMessage('select_driver'); ?></option>
<?php foreach ($all_drivers as $driver): ?>
                                            <option value="<?php echo $driver['Employee_ID']; ?>"><?php echo $driver['Employee_Name']; ?></option>
<?php endforeach; ?>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div><label><?php print CommonLanguage::getMessage('salesman'); ?></label></div>
                                <div class="input-group m-b"><span class="input-group-btn">
                                        <button type="button" class="btn btn-bg-success-darker"><i class="fa fa-certificate"></i> </button> </span>
                                    <select required id="Vehicle_Sales_Man" name="Vehicle_Sales_Man" class="full-width " data-init-plugin="select2">
                                        <option value="0" selected><?php print CommonLanguage::getMessage('select_salesman'); ?></option>
<?php foreach ($all_salesman as $sales): ?>
                                            <option value="<?php echo $sales['Employee_ID']; ?>"><?php echo $sales['Employee_Name']; ?></option>
<?php endforeach; ?>

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

                        </div>
                        <div class="col-md-12" style="margin:10px;">
                            <div class="col-md-6">
                                <div><label><?php print CommonLanguage::getMessage('zone'); ?></label></div>
                                <div class="input-group m-b"><span class="input-group-btn">
                                        <button type="button" class="btn btn-bg-success-darker"><i class="fa fa-certificate"></i> </button> </span>
                                    <select required id="Vehicle_Zone_ID" name="Vehicle_Zone_ID" class="full-width " data-init-plugin="select2">
                                        <option value="0" selected><?php print CommonLanguage::getMessage('select_zone'); ?></option>
<?php foreach ($all_zones as $zone): ?>
                                            <option value="<?php echo $zone['Zone_ID']; ?>"><?php echo $zone['Zone_Name']; ?></option>
<?php endforeach; ?>
                                        <option value="more"><?php print CommonLanguage::getMessage('More'); ?>...</option>

                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <div class="pull-right">
                            <button class="btn btn-default" id="CloseAssignTruck"> <?php print CommonLanguage::getMessage('Close'); ?> </button>
                            <button class="btn btn-bg-success-darker" id="SubmitAssignTruck"  > <?php print CommonLanguage::getMessage('Save'); ?>   </button>
                        </div>
                    </div>
                </form>
            </div>

            <!-- end of modal-body -->
<?php echo Forms::ModalLoader('EditVehicleDriverList_Disabler'); ?>
        </div><!-- end of modal-content -->
    </div><!-- end of modal-dialog -->
</div><!-- end of modal -->
<script type="text/javascript">
    var Failed_Submit = <?php echo json_encode(CommonLanguage::getMessage('Failed_Submit')); ?>,
            Required_Fields = <?php echo json_encode(CommonLanguage::getMessage('Required_Fields')); ?>,
            EditTitle = <?php echo json_encode(CommonLanguage::getMessage('Edit')); ?>,
            AddTitle = <?php echo json_encode(CommonLanguage::getMessage('Add')); ?>,
            Data_Exists = <?php echo json_encode(CommonLanguage::getMessage('Data_Exists')); ?>,
            Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully')); ?>;
    var IsEdit =0;
    var CurrentID, Vehicle_ID;

    $(function () {
        $('#tableWithSearch').on("click", '.UpdateVehcile', function () {
            IsEdit = 1;
            $(".title").html(EditTitle)
            value = $(this).parents("tr").find('.Action').attr("data-id")
            CurrentID = value.split("/")[0];
            Vehicle_ID = value.split("/")[1];
            $.ajax({
                url: "GarageAjax/assignVehicleDriverAjax?GetID=" + CurrentID,
                dataType: "json",
                complete: function (v, vv) {
                    if (vv == "success") {
                        console.log(v.responseJSON)
                        if (v.responseJSON.length > 0) {
                            var Content = v.responseJSON[0];
                            $("#Usage_Type").val(Content.Usage_Type_ID).select2()
                            $("#Assign_Vehicle_Code").val(Content.Vehicle_ID).select2()
                            $("#Vehicle_Driver").val(Content.Driver_ID).select2()
                            $("#Vehicle_Sales_Man").val(Content.Sales_Man_ID).select2()
                            $("#Vehicle_Zone_ID").val(Content.Vehicle_Zone_ID).select2()
                        }
                    }
                }
            })
        })


        $("#Vehicle_Zone_ID").on("change", function () {
            var val = $(this).val();
            if (val === "more") {
                $("#Vehicle_Zone_ID").removeAttr('selected').find('option:first').attr('selected', 'selected');
                $("#addZone").modal('show')
            }
        })
        $(".floatingContainer").on("click",function(){
            IsEdit = 0;
            $(".title").html(AddTitle)
        })
        $("#Usage_Type").on("change", function () {
            var Stand = $(this).data("MyStandListTarget"),
                    Depotolder = $("#s2id_" + $(this).attr("id"));
            $("#s2id_Assign_Vehicle_Code").append("<div class='LoadingCities' style='position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(180,180,180,0.5);text-align:center'><img style='height:25px;margin-top:5px;' src='img/demo/progress.svg' /></div>")
            Depotolder.append("<div class='LoadingCities' style='position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(180,180,180,0.5);text-align:center'></div>")

            $.ajax({
                url: "GarageAjax/assignVehicleDriverAjax",
                dataType: "json",
                data: {Usage_Type: $(this).val()},
                complete: function (v, vv) {
                    $("#Assign_Vehicle_Code").select2("destroy").empty()
                    if (vv == "success") {
                        var ToBeAdded = "";
                        for (var x = 0; x < v.responseJSON.length; x++) {
                            ToBeAdded += "<option value='" + v.responseJSON[x]["Vehicle_ID"] + "'>" + v.responseJSON[x]["Vehicle_Registration_Number"] + "</option>"
                        }

                        $("#Assign_Vehicle_Code").html(ToBeAdded);
                    }
                    $("#Assign_Vehicle_Code").select2();
                    $(">.LoadingCities", Depotolder).remove()
                }
            })



        }).data("MyShelfListTarget", "#Assign_Vehicle_Code").trigger("change")








        // $("#AddProductPostForm").validate();
        $("#SubmitAssignTruck").on("click", function () {
            $("#LocationValidationAlert").remove();
            var AlertBox = $('<div id="LocationValidationAlert" class="WizardValidationAlert alert"></div>'), IsValidated = true;
            AlertBox.insertAfter($("#assignVehicleDriver").find(".modal-dialog .modal-header").find("h5"))

            $("#EditVehicleDriverList_Disabler").removeClass('hidden')

            var Data = {
                Assign_Vehicle_Code: $("#Assign_Vehicle_Code").val(),
                Vehicle_Driver: $("#Vehicle_Driver").val(),
                Vehicle_Sales_Man: $("#Vehicle_Sales_Man").val(),
                Vehicle_Zone_ID: $("#Vehicle_Zone_ID").val(),
                

            }

            if(IsEdit == 1){
                Data.Vehicle_Driver_ID= CurrentID
            }
            $.ajax({
                url: "GarageAjax/assignVehicleDriverAjax",
                method: "POST",
                data: Data,
                dataType:"json",
                complete: function (v1, v2) {
                    if (v2 == 'success' && v1.responseJSON =="OK") {
                        
                               $("#LocationValidationAlert").addClass("alert-success").empty().html(Submitted_Successfully);
                        
                        RebuildDataTable(title, [0, 1, 2, 3, 4], 'GarageAjax/VehicleDriverListRequest', 1)
                        setTimeout(function () {
                            $("#LocationValidationAlert").hide()
                            $("#assignVehicleDriver").modal('hide')
                        }, 1500)
                        $("#EditVehicleDriverList_Disabler").addClass('hidden')
                    } else {
                        $("#LocationValidationAlert").addClass("alert-danger").empty().html(v1.responseJSON[0]);
                    }
                    $("#EditVehicleDriverList_Disabler").addClass('hidden')
                }
            })

        });
        $("#CloseAssignTruck").on("click", function () {
            $("#assignVehicleDriver input").val('');
            //$("#AddProductPostForm").validate().resetForm();
            $("#assignVehicleDriver").modal("hide");

        })
        $("#assignVehicleDriver input").val('');


    });


</script>
