@extends('dashboard.layouts.master')
@section('title', 'Subscription Management | Admin Panel')
@section('content')
    @include('sweetalert::alert')
    @can('subscription.plan.read')
        <link rel="stylesheet"
            href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.min.css" />
        <link rel="stylesheet" href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.min.css" type="text/css" />
        <style>
            .model {
                z-index: 1050 !important;
            }

            .model-backdrop {
                z-index: 1040 !important;
            }
        </style>
        <div class="loader" id="loader"></div>
        <div class="padding website-label">
            <div class="success_message" style="margin-bottom: 10px;"></div>
            <div id="success_file_popup" style="margin-bottom: 10px;"></div>
            <div class="box">
                <div class="box-header">
                    <div class="box-header-left">
                        <h3 class="d-block">{{ __('backend.subscription_mangement') }}</h3>
                        <small class="d-inline-block">
                            <a href="{{ route('adminHome') }}">{{ __('backend.dashboard') }}</a> /
                            <span>{{ __('backend.subscription_mangement') }}</span> /
                            <span>{{ __('backend.subscription') }}</span>
                        </small>
                    </div>
                    @can('subscription.plan.create')
                        <div class="box-header-right">

                            <div class="box-tool">
                                <ul class="nav">
                                    <a class="solid-button" href="{{ route('subscription_plan.create') }}">
                                        <i class="material-icons">&#xe02e;</i>
                                        &nbsp; {{ __('backend.AddSubscription') }}
                                    </a>

                                </ul>
                            </div>

                        </div>
                    @endcan
                </div>
                @if (Gate::check('subscription.plan.update') || Gate::check('subscription.plan.delete'))
                    {{ Form::open(['route' => 'countryUpdateAll', 'method' => 'post', 'id' => 'updateAll']) }}

                    <div class="single-action">
                        <div class="bulk-action">
                            <select name="action" id="action" class="form-control c-select w-sm inline v-middle"
                                required>
                                <option value="no">{{ __('backend.bulkAction') }}</option>
                                @can('subscription.plan.update')
                                    <option value="1">{{ __('backend.activeSelected') }}</option>
                                    <option value="0">{{ __('backend.blockSelected') }}</option>
                                @endcan
                                @can('subscription.plan.delete')
                                    <option value="2">{{ __('backend.deleteSelected') }}</option>
                                @endcan
                            </select>
                            <button type="submit" id="submit_all" class="btn white">{{ __('backend.apply') }}</button>
                        </div>
                    </div>
                @endif

                {{-- Plan Type filter ------------------------------------------------- --}}
                <div class="single-action" style="padding: 10px 15px 0;">
                    <div class="row align-items-end">
                        <div class="col-md-3">
                            <div class="form-group m-b-0">
                                <label class="form-control-label" style="font-size:12px;">Filter by Plan Type</label>
                                <select id="filter_plan_type" class="form-control form-control-sm">
                                    <option value="">All Plan Types</option>
                                    @foreach(\App\Models\SubscriptionPlanType::orderBy('sort_order')->get() as $pt)
                                        <option value="{{ $pt->id }}">{{ $pt->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="table-responsive table_data">
                    <table class="table table-bordered m-a-0" id="label">
                        <thead class="dker">
                            <tr>
                                <th class="width20 dker no-sort">
                                    <label class="ui-check m-a-0">
                                        <input id="checkAll" type="checkbox"><i></i>
                                    </label>
                                </th>
                                <th id="name">Plan Name</th>
                                <th id="name">Plan Type</th>
                                <th id="name">Pricing Model</th>
                                <th>{{ __('backend.status') }}</th>
                                <th id="option_width">{{ __('backend.options') }}</th>
                            </tr>
                        </thead>
                        <tbody id="countryTable"></tbody>
                    </table>

                </div>
                <footer class="dker p-a">
                    <div class="row">
                        <div class="col-sm-3 hidden-xs">
                            <!-- .modal -->
                            <div id="m-all" class="modal fade" data-backdrop="true">
                                <div class="modal-dialog" id="animate">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <h5 class="modal-title">{{ __('backend.confirmation') }}</h5>
                                        </div>
                                        <div class="modal-body text-center p-lg">
                                            <p>
                                                {{ __('backend.confirmationDeleteMsg') }}
                                            </p>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn dark-white p-x-md"
                                                data-dismiss="modal">{{ __('backend.no') }}</button>
                                            <button type="submit"
                                                class="btn danger p-x-md">{{ __('backend.yes') }}</button>
                                        </div>
                                    </div><!-- /.modal-content -->
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6 text-right text-center-xs">

                        </div>
                    </div>
                </footer>
                {{ Form::close() }}
            </div>
        </div>
    @else
        <input type="hidden" value="{{ route('adminHome') }}" id="redirect_url">
        <script type="text/javascript">
            var redirect_url = $('#redirect_url').val();
            window.location.replace(redirect_url);
        </script>
    @endcan
@endsection
@push('after-scripts')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.min.js"></script>
    <script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
    <script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert-dev.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css">
    <script>
        $(document).on('click', '.status_active', function(e) {

            var id = $(this).attr('data-id');

            swal({
                    title: "Deactive",
                    text: "Are you sure you want to deactive this subscription plan?",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#BF0A30",
                    confirmButtonText: "Deactive",
                    closeOnConfirm: false
                },
                function() {
                    $.ajax({

                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        url: "{{ route('subscription_plan.status_active') }}",
                        type: 'POST',
                        data: 'id=' + id,
                        beforeSend: function() {
                            $('.loader').css("visibility", "visible");
                        },
                        success: function(response) {
                            $('.loader').css("visibility", "visible");
                            window.location.href = "{{ route('subscription_plan') }}";
                        },
                        error: function(response) {
                            alert(response.responseText);
                        }
                    });
                }
            );
        });

        $(document).on('click', '.status_inactive', function(e) {

            var id = $(this).attr('data-id');
            swal({
                    title: "Active",
                    text: "Are you sure you want to active this subscription plan?",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#002868",
                    confirmButtonText: "Active",
                    closeOnConfirm: false
                },
                function() {
                    $.ajax({
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        url: "{{ route('subscription_plan.status_inactive') }}",
                        type: 'POST',
                        data: 'id=' + id,
                        beforeSend: function() {
                            $('.loader').css("visibility", "visible");
                        },
                        success: function(response) {
                            $('.loader').css("visibility", "visible");
                            window.location.href = "{{ route('subscription_plan') }}";
                        },
                        error: function(response) {
                            alert(response.responseText);
                        }
                    });
                }
            );
        });
    </script>
    <script src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>


    <script type="text/javascript">
        function isNumberKey(evt) {
            var keyCode = (evt.which) ? evt.which : evt.keyCode;
            if ((keyCode < 65 || keyCode > 90) && (keyCode < 97 || keyCode > 123) && keyCode != 32)

                return false;
            return true;

        }

        $(function() {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            load_data();

            function load_data() {

                var action_url = "{!! route('subscription_plan.anyData') !!}";
                var table = $('#label').DataTable({
                    processing: true,
                    serverSide: true,
                    responsive: true,
                    ordering: true,
                    columnDefs: [{ bSortable: false, aTargets: [2, 3] }],
                    ajax: {
                        url: action_url,
                        type: 'POST',
                        data: function (d) {
                            d.plan_type_id = $('#filter_plan_type').val();
                        }
                    },
                    columns: [{
                            data: 'checkbox',
                            orderable: false,
                            searchable: false,
                            visible: true

                        },
                        {
                            data: 'name',
                            name: 'name',

                        },
                        {
                            data: 'plan_type',
                            name: 'plan_type',

                        },
                        {
                            data: 'pricing_model',
                            name: 'pricing_model',

                        },
                        {
                            data: 'status',
                            name: 'status',

                        },
                        {
                            data: 'options',
                            orderable: false,
                            searchable: false,
                            visible: true
                        }
                    ],
                    order: [['0', 'DESC']]
                });

                // Reload table when plan type filter changes
                $('#filter_plan_type').on('change', function () {
                    table.ajax.reload(null, false);
                });
            }

        });


        $(document).ready(function() {
            if ($('.no-sort').hasClass('sorting_disabled')) {
                $('.no-sort').removeClass('sorting_asc')
            }
        });


        $("#submit_show_msg").click(function() {
            var numberOfChecked = $('input:checkbox:checked').length;
            if (numberOfChecked == '') {
                alert("Please select row.");
                return false;
            }
        });


        $("#checkAll").click(function() {
            $('input:checkbox').not(this).prop('checked', this.checked);
        });



        $("#filter_btn").click(function() {
            $("#filter_div").slideToggle();
        });

        $("#find_q").on("keyup", function() {
            var value = $(this).val().toLowerCase();
            $("#doctorTypeTable tr").filter(function() {
                $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
            });
        });

        $(document).on('submit', '#updateAll', function(e) {
            e.preventDefault();
            var allVals = [];
            var check = false;

            var select_row = "{{ __('backend.select_row') }}";
            var select_status = "{{ __('backend.select_status') }}";

            var type = $(document).find('#action').val();
            if (type == 'no') {
                $(document).find('#alert_confirm').modal('show');
                $(document).find('#alert_confirm').find('.alert_dynamic_message').text(select_status);

            } else {
                $(".has-value:checked").each(function() {
                    var idvalue = $(this).attr('data-id');
                    if (typeof idvalue === "undefined") {

                    } else {
                        allVals.push(idvalue);
                    }
                });

                if (allVals.length <= 0) {
                    $(document).find('#alert_confirm').modal('show');
                    $(document).find('#alert_confirm').find('.alert_dynamic_message').text(select_row);
                } else {
                    var msg = "";
                    if (type == 0) {
                        msg = "Are you sure you want to deactive this subscription plan?";
                    } else if (type == 1) {
                        msg = "Are you sure you want to active this  subscription plan?";
                    } else {
                        msg = "Are you sure you want to delete this  subscription plan?";
                    }

                    $(document).find('#default_confirm').modal('show');
                    $(document).find('#default_confirm').find('.dynamic_message').text(msg);
                    var join_selected_values = allVals.join(",");
                    $(document).find('#default_confirm').find('.checkbox_data').val(join_selected_values);
                    $(document).find('#default_confirm').find('.checkbox_type').val(type);

                }

            }
        });
        $(document).on('click', '.delete-school', function(e) {
            e.preventDefault();
            var package_id = $(this).attr('data-id');
            var allVals = [];
            allVals.push(package_id);
            var type = 2;
            var msg = "Are you sure you want to delete?";

            $(document).find('#default_confirm').modal('show');
            $(document).find('#default_confirm').find('.dynamic_message').text(msg);
            var join_selected_values = allVals.join(",");
            $(document).find('#default_confirm').find('.checkbox_data').val(join_selected_values);
            $(document).find('#default_confirm').find('.checkbox_type').val(type);
        });

        $(document).on('click', '.yes_click', function(e) {
            var join_selected_values = $(document).find('#default_confirm').find('.checkbox_data').val();
            var type = $(document).find('#default_confirm').find('.checkbox_type').val();
            var csrf = "{{ csrf_token() }}";
            ajaxUpdateAll(csrf, join_selected_values, type, action);
        });

        function ajaxUpdateAll(csrf, join_selected_values, type) {
            $.ajax({
                url: "{{ route('subscription_planUpdateAll') }}",
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': csrf
                },
                data: 'ids=' + join_selected_values + '&status=' + type,
                beforeSend: function() {
                    $('.loader').css("visibility", "visible");
                },
                success: function(data) {

                    if (data.success == true) {
                        $('.loader').css("visibility", "hidden");
                        $('#success_file_popup').append(messages('alert-success', data.msg));
                        setTimeout(function() {
                            $('#success_file_popup').empty();
                        }, 5000);


                        $(document).find('#default_confirm').modal('hide');
                        var tabe = $('#label').DataTable();
                        $(document).find('#action').prop('selectedIndex', 0);
                        tabe.ajax.reload(null, false);
                        $("#checkAll").prop('checked', false);

                    } else {
                        $('.loader').css("visibility", "hidden");
                        $('#success_file_popup').append(messages('alert-danger', data.error));
                        setTimeout(function() {
                            $('#success_file_popup').empty();
                        }, 5000);
                    }
                },
                error: function(data) {
                    alert(data.responseText);
                }
            });
        }
        $("#action").change(function() {
            if (this.value == "delete") {
                $("#submit_all").css("display", "none");
                $("#submit_show_msg").css("display", "inline-block");
            } else {
                $("#submit_all").css("display", "inline-block");
                $("#submit_show_msg").css("display", "none");
            }
        });

        function messages(classname, msg) {
            return '<div class="alert ' + classname +
                ' m-b-0"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span> </button>' +
                msg + '</div>';
        }
        setTimeout(function() {
            $('#topmsgall').hide();
        }, 5000);
    </script>
@endpush