<?php
// Articles Listing page
include 'header.php';
?>

<div class="row">
    <div class="col-xs-12">
        <div class="card">
            <div class="card-header">
                <h3 class="header-title">Mobile Package</h3>
            </div>
            <div class="card-body no-padding">
                <div class="row button-row" style=" padding-left: 15px; padding-right: 15px; margin-top: 15px;">
                    <div class="col-sm-6">
                        <button type="button" class="btn btn-danger btn-multi-delete" disabled>Delete</button>
                        <button type="button" class="btn btn btn-success btn-add-user"  data-toggle="modal" data-target="#modal-add">Add Package</button>
                    </div>
                </div>
                <table class="datatable1 table table-striped primary list-table" cellspacing="0" width="100%">
                    <thead>
                        <tr>
                            <th class="remove checkbox-td"><input type="checkbox" class="sh-checkbox-all"></th>
                            <th>Provider</th>
							<th>Offer</th>
							<th>TMNs</th>
							<th>Description</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody class="admin-user">
                    </tbody>
                </table>

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

<!--Popup for Delete Single Admin Entry-->
<div class="modal fade" id="modal-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" >
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Delete Entry</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to delete this entry? </p>
                <input type="hidden" id="inp-id-hidden" >
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
                <button type="button" class="btn btn-delete btn-primary">Yes</button>
            </div>
        </div>
    </div>
</div>

<!--Popup for Delete Single Admin Entry-->
<div class="modal fade" id="modal-multi-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Delete Entry</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to delete this multiple entry? </p>
                <input type="hidden" id="inp-id-hidden" >
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
                <button type="button" class="btn btn-multi-delete-yes btn-primary">Yes</button>
            </div>
        </div>
    </div>
</div>


<!-- Modal Large Size -->
<div class="modal fade" id="modal-add" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-md">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">Add Package</h4>
            </div>
			<form role="form" class="add-form">
				<div class="modal-body sh-add-user-body">   
					<input type="hidden" id="inpu-id-hidden" name="id" value="0">
					<div class="form-group mb-20" style="position: relative;">
						<label>Provider: </label>
						<select class="form-control col-sm-12 mb-20" name="operator_id" id="operator_id">
							<option value="0">Select Provider</option>
							<?php include("controllers/get_all_provider_list.php");?>
						</select>
						<span class="error-message">Select Provider</span>
					</div>	
                    <div class="form-group mb-20" style="position: relative;">
                        <label>Package Offer: </label>
                        <input class="form-control" type="text" required name="offer" id="offer" placeholder="Enter Offer">
                        <span class="error-message">Fill this correctly</span>
                    </div>    
					<div class="form-group mb-20" style="position: relative;">
                        <label>Amount of TMN: </label>
                        <input class="form-control" type="text" required name="tmn" id="tmn" placeholder="Enter TMN">
                        <span class="error-message">Fill this correctly</span>
                    </div> 
					<div class="form-group mb-20" style="position: relative;">
                        <label>Description: </label>
                        <textarea class="form-control" type="text" required name="description" id="description" placeholder="Enter Description"></textarea>
                        <span class="error-message">Fill this correctly</span>
                    </div> 					
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
					<button type="submit" class="btn btn-save btn-success">Save</button>
				</div>
			</form>
        </div>
    </div>
</div>

<?php include 'footer.php'; ?>

<script type="text/javascript">
    var placementFrom = "top";
    var placementAlign = "right";
    var animateEnter = "";
    var animateExit = "";
    var colorName = "bg-green";

    $("body").on('click', '.sh-delete', function () {
        $("#inp-id-hidden").val($(this).parent().attr('data-id'));
        $('#modal-delete').modal('show');

    });

    $("body").on('click', '.btn-multi-delete', function () {
        $('#modal-multi-delete').modal('show');
    });


    initialiseDatatable();

    function initialiseDatatable() {
        $('.datatable1').dataTable().fnDestroy();
        $('.admin-user').html('');
        $.ajax({url: 'controllers/get_packages_list.php',
            data: {
            },
            type: 'post',
            success: function (output) {
                $('.admin-user').html(output);
                enableButton();

                var datatable = $('.datatable1').DataTable({
                    "dom": '<"top"fl<"clear">>rt<"bottom"ip<"clear">>',
                    "oLanguage": {
                        "sSearch": "",
                        "sLengthMenu": "_MENU_"
                    },
                    "initComplete": function initComplete(settings, json) {
                        $('div.dataTables_filter input').attr('placeholder', 'Search...');
                    }
                });
                $('#DataTables_Table_0_filter input').addClass('form-control').addClass('input-sm');
            }
        });
    }


    $('.btn-delete').click(function () {
        $.ajax({url: 'controllers/delete_package.php',
            data: {
                id: $("#inp-id-hidden").val(),
                type: 0
            },
            type: 'post',
            dataType: 'JSON',
            success: function (output) {

                if (output.status == "200") {
                    $('#modal-delete').modal('hide');
                    $('.modal-backdrop').remove();

                    showNotification(colorName, "Deleted successfully ", placementFrom, placementAlign, animateEnter, animateExit);
                    initialiseDatatable();
                }
            }
        });
    });

    $(".sh-checkbox-all").change(function () {
        if (this.checked) {
            $(".sh-checkbox").prop("checked", true);
            $(".btn-multi-delete").attr('disabled', false);
        } else {
            $(".sh-checkbox").prop("checked", false);
            $(".btn-multi-delete").prop('disabled', true);
            $(".sh-checkbox-all").prop("checked", false);
        }
    });

    $("body").on('change', '.sh-checkbox', function () {
        if (!this.checked) {
            $(".sh-checkbox-all").prop("checked", false);
        }
        $(".btn-multi-delete").attr('disabled', true);
        enableButton();
    });


    function enableButton() {
        $(".btn-multi-delete").attr('disabled', true);
        $(".sh-checkbox").each(function () {
            if ($(this).prop("checked") == true) {
                $(".btn-multi-delete").attr('disabled', false);
            }
        });
    }



    $("body").on('click', '.btn-multi-delete-yes', function () {

        var selchDeleteBox = []; // initialize empty array 
        $(".multiDelete:checked").each(function () {
            selchDeleteBox.push($(this).val());
        });

        if (selchDeleteBox.length > 0)
        {
            $.ajax({url: 'controllers/delete_language.php',
                data: {
                    id: selchDeleteBox,
                    type: 1,
                },
                type: 'post',
                dataType: 'JSON',
                success: function (output) {
//                        console.log(output.status);
                    if (output.status == "200") {
                        $('#modal-multi-delete').modal('hide');
                        $('.modal-backdrop').remove();
                        showNotification(colorName, "Deleted successfully", placementFrom, placementAlign, animateEnter, animateExit);
                        initialiseDatatable();
                    }
                }
            });
        }
    });

    $(".add-form").submit(function (e) {
        $(".error-message").css("display", "none");
        var error = 0;
        var filter = /^([a-zA-Z0-9_\.\-]{2,30})+\@(([a-zA-Z0-9\-]{2,40})+\.)+([a-zA-Z0-9]{2,4})+$/;


        if ($("#operator_id").val() == "") {
            $("#operator_id").siblings(".error-message").css("display", "block");
            error = 1;
        }

        if (error == 0) {
			var dataimg = new FormData(this);
            $.ajax({url: 'controllers/add_package.php',
                data: dataimg,
                type: 'post',
				processData: false,
				contentType: false,
                dataType: 'JSON',
                success: function (output) {
                    console.log(output.status);
                    if (output.status == "200") {
                        $('#operator_id').val('');	
						$('#tmn').val('');	
						$('#offer').val('');
						$("#inpu-id-hidden").val(0);
						$('#description').val('');						
						$('#upload-img').val('');
						$("#product-image").attr("src","images/placeholder.jpg");
                        $('#modal-add').modal('hide');
                        $('.modal-backdrop').remove();
                        showNotification(colorName, output.msg, placementFrom, placementAlign, animateEnter, animateExit);
                        initialiseDatatable();
                    } else if (output.status == "400") {
                        showNotification(colorName, output.msg, placementFrom, placementAlign, animateEnter, animateExit);
                    } else if (output.status == "300") {
                        showNotification(colorName, output.msg, placementFrom, placementAlign, animateEnter, animateExit);
                    }
                }
            });
        }
		e.preventDefault();
    });
    $("body").on('click', '.sh-edit', function () {
        $("#inpu-id-hidden").val($(this).parent().attr('data-id'));
		$("#offer").val($(this).parent().attr('data-offer'));
		$("#tmn").val($(this).parent().attr('data-tmn'));
		$("#description").val($(this).parent().attr('data-description'));
        $("#operator_id").val($(this).parent().attr('data-operator_id'));
    });
</script>