@extends('admin.layout.master')

@section('content')
<style>
    select2-container--default {
        min-height: 104px !important;
}
.table-container {
    overflow: auto; height: 400px;
}


.no-sort::after { display: none!important; }
.no-sort::before { display: none!important; }

</style>
<style>
    .dt-buttons{
        float: right;
    }
    div.dataTables_wrapper div.dataTables_processing{
        z-index:99999;
    }
    div.dataTables_wrapper div.dataTables_processing{
        top: 15% !important;
    }
</style>
<!-- Content Header (Page header) -->
<div class="content-header">
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-6">
                <h1 class="m-0">Offer Email Batches - {{ $type_name }}</h1>
            </div><!-- /.col -->
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="#">Home</a></li>
                    <li class="breadcrumb-item active">Offer Email Batches</li>
                </ol>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.container-fluid -->
</div>

<section class="content">
    <div class="container-fluid">
        @foreach (['danger', 'warning', 'success', 'info'] as $msg)
            @if(Session::has('alert-' . $msg))

                <p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}
                    <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
                </p>
            @endif
        @endforeach

        <div class="row">
            <div class="col-12 col-sm-6 col-md-2">
                <div class="info-box">
                    <div class="info-box-content">
                        <span class="info-box-text text-bold">Total</span>
                        <span class="info-box-number h4">
                            {{ !empty($AllCount) ? $AllCount->total : 0 }}
                        </span>
                    </div>
                </div>
            </div>

            <div class="col-12 col-sm-6 col-md-2">
                <div class="info-box">
                    <div class="info-box-content">
                        <span class="info-box-text text-bold">Sent</span>
                        <span class="info-box-number h4">
                            {{ !empty($AllCount) ? $AllCount->receivers : 0 }}
                        </span>
                    </div>
                </div>
            </div>

            <div class="col-12 col-sm-6 col-md-2">
                <div class="info-box mb-3">
                    <div class="info-box-content">
                        <span class="info-box-text text-bold">Opens</span>
                        <span class="info-box-number h4">{{ !empty($AllCount) ? $AllCount->opens : 0 }}</span>
                    </div>
                </div>
            </div>

            <div class="col-12 col-sm-6 col-md-2">
                <div class="info-box mb-3">
                    <div class="info-box-content">
                        <span class="info-box-text text-bold">Clicks</span>
                        <span class="info-box-number h4">{{ !empty($AllCount) ? $AllCount->clicks : 0 }}</span>
                    </div>
                </div>
            </div>

            <div class="col-12 col-sm-6 col-md-2">
                <div class="info-box mb-3">
                    <div class="info-box-content">
                        <span class="info-box-text text-bold">Purchase</span>
                        <div class="row">
                            <div class="col-4 text-left h4">{{ !empty($AllCount) ? $AllCount->purchases : 0 }}</div>
                            <div class="col-8 text-right h4">${{ !empty($AllCount->purchase_value) ? $AllCount->purchase_value : 0 }}</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-12 col-sm-6 col-md-2">
                <div class="info-box mb-3">
                    <div class="info-box-content">
                        <span class="info-box-text text-bold">Unsubscribe</span>
                        <span class="info-box-number h4">{{ !empty($AllCount) ? $AllCount->unsubscribes : 0 }}</span>
                    </div>
                </div>
            </div>


        </div>

        <div class="card">
            <div class="card-body">
                <form action="{{ route('admin.offer-email-campaigns') }}" id="frm_search" method="get">
                    <div class="row mb-2">

                        <div class="col-md-2">
                            <div class="form-group m-2">
                                <label for="form-label">Date</label>
                                <input type="date" name="date" id="date" value="{{ $date }}" class="form-control" placeholder="Review Date">
                            </div>
                        </div>
                        <input type="hidden" name="type_id" id="type_id" value="{{ $type_id }}" class="form-control">

                        <div class="col-2 mt-2">
                            <button class="btn btn-success " type="submit" style="margin-top: 30px !important;">Submit</button>
                            <a class="btn btn-warning" href="{{ route('admin.offer-email-campaigns') }}" style="margin-top: 30px !important;">Reset</a>
                            <a class="btn btn-primary" href="{{ route('admin.offer-email-campaigns-add') }}" style="margin-top: 30px !important;">+ Add</a>

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

        <div class="card">
            <div class="card-body">
                <div class="table-responsive ">
                    <table class="table table-bordered find-parts-report-table" >
                        <thead class="thead-dark">
                            <tr>
                                @foreach ($columns_list_header as $c)
                                <th class="noSearch">{{ $c }}</th>
                                @endforeach
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>


<script type="text/javascript">
  var table ="";

    $(function () {

     table = $('.find-parts-report-table').DataTable({

            searching: false,
            processing: true,
            serverSide: true,
            order: [[0, 'desc']],
            "autoWidth" : false,
            ajax: {
                url: "{{ route('admin.offer-email-campaigns') }}",
                type: "get",
                data: function (data) {
                    delete data.columns;
                    data.search_date = "{{ $date }}";
                    data.search_type_id = "{{ $type_id }}";
                }
            },
            columns: [

                                            {
                            data: null,
                            render: function ( data, type, row ) {
                                var id = data.id;

                                if(data.is_send == '0'){

                                    var viewurl = "{{ route('admin.offer-email-send') }}";
                                    viewurl = viewurl + '?id='+id;
                                    return '<a id="startSending" class="btn btn-success senEmailBtn startSending" href="'+ viewurl +'" >Send Email</a>';

                                }else if(data.is_send == '2'){
                                    return 'Email Sent Processing';
                                }else{
                                    return 'Email sent';
                                }

                            },
                        }
                    ],
            "columnDefs": [ {
                        "targets": 0,
                        "orderable": false
                        }, { targets: '_all', width:'30px' } ],
        });


    });

    $('#startSending').click(function(){
        $(this).attr('disabled', 'disabled');
        $(this).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> <span class="visually-hidden">Email Sending...</span>');
    });



  </script>


@endsection