@extends('master.admin')

@push('header.scripts')
<!-- BEGIN PAGE LEVEL PLUGINS -->
<link href="{{ asset('public/assets/global/plugins/datatables/datatables.min.css') }}" type="text/css" />
<link href="{{ asset('public/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css') }}" rel="stylesheet" type="text/css" />
<!-- END PAGE LEVEL PLUGINS -->
@stop

@push('footer.scripts')
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="{{ asset('public/assets/global/scripts/datatable.js') }}" type="text/javascript"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.24/datatables.min.js"></script>
<script src="{{ asset('public/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js') }}" type="text/javascript"></script>
<!-- END PAGE LEVEL SCRIPTS -->
<script>

    var dataTableObj;
    var formData = $('#advance_search_form').serializeArray();
    var advance_search_form_data = {'action': 'advance_search', 'search_form_data': formData};
    var dt_html = '';

    $(function() {

        dt_html = $("#eventcoupons-outer-div").html();
        dataTableObj = dt_init();

        $('#date_range').change(function (e) {
            if ($(this).val() != '') {
                var selectedDate = $(this).val();
                var selectedDateArray = selectedDate.split('|');
                $('#start_date').val(selectedDateArray[0]);
                $('#end_date').val(selectedDateArray[1]);
                $("#advance_search_form").submit();
            } else {
                $('#start_date').val('');
                $('#end_date').val('');
            }
        });

        $("#advance_search_form").submit(function (e) {
            var formData = $('#advance_search_form').serializeArray();
            advance_search_form_data = {'action': 'advance_search', 'search_form_data': formData};
            $("#eventcoupons_dt_wrapper").children().remove();
            $("#eventcoupons-outer-div").html(dt_html);
            dataTableObj = dt_init();
            e.preventDefault(); //STOP default action
        });

        // Delete Item record
        $('#eventcoupons-outer-div').on('click', 'a.list_remove', function (e) {
            $('#deleterecord_error_div').hide();
            $('#deleterecord_success_div').hide();
            $('#delete_record_dt_id').val('eventcoupons_dt')
            $('#delete_item_id').val( $(this).attr('data-id') );
            $('#delete_action_url').val( '{!! url("admin/eventcoupons") !!}/'+$(this).attr('data-id') );
            $('#confirmRemoveRecord').modal('show', {backdrop: 'static'});
            e.preventDefault();
        });

        @if(Session::has('eventcoupons-success'))
        show_push_notification('Success!', '{{ Session::get("eventcoupons-success") }}', 'success');
        @endif

    });

    function dt_init() {
        var token = $('#token_csrf').val();
        returnObj = $('#eventcoupons_dt').DataTable({
            responsive: true,
            processing: true,
            serverSide: true,
            bFilter: false,
            ajax: {
                url: '{!! url("admin/eventcoupons/ajax") !!}',
                type: "POST",
                headers: {'X-CSRF-TOKEN': token},
                data: advance_search_form_data
            },
            columns: [
                {data: 'event_name', name: 'events.name'},
                {data: 'coupon_code', name: 'coupon_codes.coupon_code'},
                {data: 'discount', name: 'coupon_codes.discount'},
                {data: 'times_valid', name: 'coupon_codes.times_valid', className: 'text-center'},
                {data: 'uses_left', name: 'uses_left', className: 'text-center'},
                {data: 'valid_date', name: 'coupon_codes.valid_date', className: 'text-center'},
                {data: 'actions', name: 'actions', className: 'text-right', "bSearchable": false, "bSortable": false}
            ]
        });
    }

</script>
@stop

@section('content')
<!-- BEGIN CONTENT -->
<div class="page-content-wrapper">
    <!-- BEGIN CONTENT BODY -->
    <div class="page-content">
        <!-- BEGIN PAGE HEADER-->
        <!-- BEGIN PAGE BAR -->
        <div class="page-bar">

            <ul class="page-breadcrumb">
                <li>
                    <span>Event Coupons</span>
                </li>
            </ul>
        </div>
        <!-- END PAGE BAR -->
        <!-- BEGIN PAGE TITLE-->
        <h3 class="page-title"> </h3>
        <!-- END PAGE TITLE-->
        <div class="row">
            <div class="col-md-12">


                <!-- BEGIN ADVANCE SEARCH-->
                <div class="row">
                    <div class="col-md-12" id="advance_search_cantainer">
                        <div class="panel panel-default">
                            <div class="panel-heading"><i class="fa fa-search"></i> Advance Search</div>
                            <div class="panel-body">
                                <form id="advance_search_form" name="advance_search_form">
                                    <input type="hidden" name="token_csrf" id="token_csrf" value="{{ csrf_token() }}"/>
                                    <div class="row">
                                        <div class="col-md-4 col-sm-6">
                                            <label> Event </label>
                                            <div class="form-group">
                                                <select id="event_id" name="event_id" class="form-control">
                                                    <option value="">All</option>
                                                    @foreach(list_events() as $event)
                                                        <option value="{{ $event->id }}">{{ $event->name }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6">
                                            <label> Discount Type </label>
                                            <div class="form-group">
                                                <select id="discount_type" name="discount_type" class="form-control">
                                                    <option value="">All</option>
                                                    <option value="fixed">Fixed amount</option>
                                                    <option value="percentage">Percentage</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-6">
                                            <label> Coupon Code </label>
                                            <div class="form-group">
                                                <input type="text" id="coupon_code" name="coupon_code" class="form-control" placeholder="Coupon Code" />
                                            </div>
                                        </div>
                                    </div>
                                    <div class="text-right">
                                        <button type="button" id="dt_clear" name="dt_clear" class="btn default"
                                                onclick="javascript:window.location.reload()">Clear
                                        </button>

                                        <button type="submit" class="btn blue">Search <i class="fa fa-search"></i></button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- END ADVANCE SEARCH-->

                <!-- Begin: life time statistics -->
                <div class="portlet light portlet-fit portlet-datatable bordered">
                    <div class="portlet-title">
                        <div class="caption">
                            <i class="fa fa-dollar"></i>
                            <span class="caption-subject font-dark sbold uppercase">Event Coupons</span>
                        </div>
                        <div class="actions">
                            <div class="btn-group pull-left" style="margin-right: 5px;">
                                <a href="{!! url('admin/eventcoupons/create') !!}" class="btn btn-fit-height blue" style="margin-right: 5px;"><i class="fa fa-plus-circle"></i> Add New Coupon</a>
                            </div>
                        </div>
                    </div>
                    <div class="portlet-body" style="height:auto !important;">
                        <div class="table-scrollable" id="eventcoupons-outer-div">
                            <table id="eventcoupons_dt" class="table table-striped table-bordered table-hover " cellspacing="0" width="100%">
                                <thead>
                                    <tr>
                                        <th>Event</th>
                                        <th>Coupon Code</th>
                                        <th>Discount</th>
                                        <th class="text-center">Times Valid</th>
                                        <th class="text-center">Uses Left</th>
                                        <th class="text-center">Valid Until</th>
                                        <th class="text-right"> Actions </th>
                                    </tr>
                                </thead>
                            </table>
                        </div>
                    </div>

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

    </div>
    <!-- END CONTENT BODY -->
</div>
<!-- END CONTENT WRAPPER -->    


@stop