@extends('layouts.main')
@section('css')

@endsection
@section('content')

<div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title">Search Condition</h3>
                        </div>
                        <div class="card-body">
                            <form class="" role="form" method="post" id="search-form"
                                action="{{url('whatsapp-bulk-sms-history')}}">

                                <div class="row">
                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="msg_type">SMS Type</label>
                                            <select class="selectpicker form-control" name="msg_type" id="msg_type">
                                                <option value="" @if($type=="" ) selected @endif>All</option>
                                                <option value="regular" @if($type=="regular" ) selected @endif>Regular
                                                </option>
                                                <option value="scheduled" @if($type=="scheduled" ) selected @endif>
                                                    Scheduled</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="el2">Date From</label>
                                            <input type="date" id="date_from" class="form-control dateTimePicker"
                                                name="date_from" value="{{$date_from}}">
                                        </div>
                                    </div>

                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="el2">Date To</label>
                                            <input type="date" id="date_to" class="form-control dateTimePicker"
                                                name="date_to" value="{{$date_to}}">
                                        </div>
                                    </div>

                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="msg_type">SMS Status</label>
                                            <select class="selectpicker form-control" name="msg_status" id="msg_status">
                                                <option value="" @if($status=="" ) selected @endif>Any</option>
                                                <option value="failed" @if($status=="failed" ) selected @endif>Failed
                                                </option>
                                                <option value="queued" @if($status=="queued" ) selected @endif>Queued
                                                </option>
                                                <option value="processing" @if($status=="processing" ) selected @endif>
                                                    Processing</option>
                                                <option value="processed" @if($status=="processed" ) selected @endif>
                                                    Processed</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="msg_type">SMS Delivery Status</label>
                                            <select class="selectpicker form-control" name="msg_delivery_status"
                                                id="msg_delivery_status">
                                                <option value="" @if($deliveryStatus=="" ) selected @endif>All</option>
                                                <option value="sent" @if($deliveryStatus=="sent" ) selected @endif>Sent
                                                </option>
                                                <option value="failed" @if($deliveryStatus=="failed" ) selected @endif>
                                                    Failed</option>
                                                <option value="queued" @if($deliveryStatus=="queued" ) selected @endif>
                                                    Queued</option>
                                                <option value="readed" @if($deliveryStatus=="readed" ) selected @endif>
                                                    Readed</option>
                                                <option value="played" @if($deliveryStatus=="played" ) selected @endif>
                                                    Played</option>
                                                <option value="delivered" @if($deliveryStatus=="delivered" ) selected
                                                    @endif>Delivered</option>
                                                <option value="cancelled" @if($deliveryStatus=="cancelled" ) selected
                                                    @endif>Cancelled</option>
                                                <option value="processing" @if($deliveryStatus=="processing" ) selected
                                                    @endif>Processing</option>
                                            </select>
                                        </div>
                                    </div>

                                    <!-- <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="msg_type">Phone Number</label>
                                            <input type="text" class="form-control" name="phone_number"
                                                placeholder="1672******" value="{{$search_phone_number}}" />
                                        </div>
                                    </div> -->
                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            <label>Categories/Groups</label>
                                            <select name="customer_group[]" class="select2bs4" multiple="multiple"
                                                data-placeholder="Select a Category/Group" style="width: 100%;">
                                                @foreach($customerGroup as $v)
                                                <option value="{{$v->id}}" @if(in_array($v->id, $search_customer_group))
                                                    selected @endif>{{$v->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            <label>Camapigns</label>
                                            <select name="campaigns[]" class="select2bs4" multiple="multiple"
                                                data-placeholder="Select a campaign" style="width: 100%;">
                                                @foreach($campaignList as $v)
                                                <option value="{{$v->id}}" @if(in_array($v->id, $search_campaign))
                                                    selected @endif>{{$v->campaign_name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="search">&emsp;</label><br />
                                            <button type="submit" class="btn btn-success pull-right btn-block"><i
                                                    class="fa fa-search"></i> Search</button>
                                        </div>
                                    </div>

                                    <div class="col-sm-2">
                                        <div class="form-group">
                                            <label for="reset">&emsp;</label><br />
                                            <a href="{{URL::to('whatsapp-sms-history')}}" type="button"
                                                class="btn btn-primary pull-right btn-block" id="reset">Reset
                                            </a>
                                        </div>
                                    </div>



                                </div>
                                <input type="hidden" name="_token" value="{{csrf_token()}}">

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


                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title">WHATSAPP SMS HISTORY</h3>
                        </div>
                        <div class="card-body">
                        <button class="btn btn-success btn-sm pull-right" data-toggle="tooltip" data-placement="top"
                        id="exportAll" style="margin: 10px;"><i class="fa fa-expand"></i> Export All
                    </button>
                            <table class="table table-striped table-bordered" style="width:100%" id="sms-history-table">
                                <thead>
                                <tr>
                                    <th style="width: 5%;">number</th>
                                    <th style="width: 10%;">Message Type</th>
                                    <th style="width: 15%;">Sms created Date</th>
                                    <th style="width: 10%;">To</th>
                                    <th style="width: 5%;">Number</th>
                                    <th style="width: 20%;">Message</th>
                                    <th style="width: 15%;">Status</th>
                                    <th style="width: 15%;">Delivery Status</th>
                                    <th style="width: 10%;">Campaign</th>
                                    <th style="width: 10%;">Listed Numbers</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($smsHistory as $k=>$v)
                                    <tr>
                                        <td>{{(($page-1) * $limit) +($k+1)}}</td>
                                        <td>{{$v->type}}</td>
                                        <td>{{date('Y-m-d H:i A', (strtotime($v->created_at)))}}</td>
                                        <td>{{$v['broadcast']->broadcast_name}}</td>
                                        <td>{{$v['customer_group_customer_broadcast_count']}}</td>
                                        <td>{{$v->message}}</td>
                                        @if(!empty(\Illuminate\Support\Facades\Auth::user()) && \Illuminate\Support\Facades\Auth::user()->user_type== 'administrator')
                                            <td>
                                                <div class="form-group">
                                                    <select class="selectpicker form-control" name="status_update" id="status_update{{$v->id}}" onchange="status_update('{{$v->id}}', this)">
                                                        <option @if($v->status == 'queued') selected @endif value="queued">queued</option>
                                                        <option @if($v->status == 'processed') selected @endif value="processed">processed</option>
                                                        <option @if($v->status == 'failed') selected @endif value="failed">failed</option>
                                                    </select>
                                                </div>
                                            </td>
                                        @else
                                            <td>{{$v->status}} @if($v->status=='failed') <span style="color:#c15e5e;"> ({{$v->failed_reason}}) </span> @endif</td>
                                        @endif
                                        @if(!empty(\Illuminate\Support\Facades\Auth::user()) && \Illuminate\Support\Facades\Auth::user()->user_type== 'administrator')
                                            <td>
                                                <div class="form-group">
                                                    <select class="selectpicker form-control" name="delivery_status_update" id="delivery_status_update{{$v->id}}" onchange="delivery_status_update('{{$v->id}}', this)">
                                                        <option @if($v->deliveryStatus == 'queued') selected @endif value="queued">queued</option>
                                                        <option @if($v->deliveryStatus == 'sent') selected @endif value="sent">sent</option>
                                                        <option @if($v->deliveryStatus == 'delivered') selected @endif value="delivered">delivered</option>
                                                        <option @if($v->deliveryStatus == 'failed') selected @endif value="failed">failed</option>
                                                    </select>
                                                </div>
                                            </td>
                                        @else
                                            <td>{{$v->deliveryStatus}}</td>
                                        @endif
                                        <td>@if($v['campaign']) {{$v['campaign']->campaign_name}} @else N/A @endif</td>
                                        <td>
                                        @if($v->status=='failed')
                                        <a href="javascript:void(0)" id="resendBtn" data-id="{{$v->id}}" class="btn btn-primary btn-xs" style="background: cadetblue;">Resend</a>
                                        @else
                                        <a href="{{url('/broadcast-listed-customer/'.$v->group_broadcast_id)}}" class="btn btn-primary btn-xs"><i class="fa fa-eye"></i> View List</a>
                                        @endif
                                        </td>
                                        
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                        {{ $smsHistory->appends(request()->input())->links() }}
                    </div>
                </div>
            </div>
        </div>

@endsection

{{--External Style Section--}}
@section('script')


    <script>
        function status_update(id, selectObject) {
            var status = selectObject.value;
            $.ajax({
                type:'get',
                url: "{{\Illuminate\Support\Facades\URL::to('status_update_whatsapp_sms')}}",
                dataType: 'json',
                data: { id:id, status:status},
                success: function (data){
                    if(data.success==0){
                        toastr.clear()
                        toastr.error('', data.error_message);
                        return;
                    }else{
                        toastr.clear()
                        toastr.success('', 'Successfully Status updated by '+data.success_status);
                        var pass_id = data.pass_id;
                        $('#status_update'+pass_id+' option').css('background-color', 'white');
                        $('option:selected', selectObject).css('background-color', 'red');
                        return;
                    }
                },
                error: function(data){
                    // console.log('error',data);
                    toastr.clear()
                    toastr.error('', 'Error!! Try Again Latter');
                    return;
                }
            });
        }
        function delivery_status_update(id, selectObject) {
            var delivery_status = selectObject.value;
            $.ajax({
                type:'get',
                url: "{{\Illuminate\Support\Facades\URL::to('delivery_status_update_whatsapp_sms')}}",
                dataType: 'json',
                data: { id:id, delivery_status:delivery_status},
                success: function (data){
                    if(data.success==0){
                        toastr.clear()
                        toastr.error('', data.error_message);
                        return;
                    }else{
                        toastr.clear()
                        toastr.success('', 'Successfully Delivery Status updated by '+data.success_status);
                        var pass_id = data.pass_id;
                        $('#delivery_status_update'+pass_id+' option').css('background-color', 'white');
                        $('option:selected', selectObject).css('background-color', 'red');
                        return;
                    }
                },
                error: function(data){
                    toastr.clear()
                    toastr.error('', 'Error!! Try Again Latter');
                    return;
                }
            });
        }
        $(document).ready(function(){
            $('.select2bs4').select2({
            theme: 'bootstrap4'
        });
            $(".deleteSMS").click(function(){
                var id = $(this).data("id");
                //console.log(id);

                bootbox.confirm("Are you sure?", function (result) {
                    if (result) {
                        window.location.href = BASE_URL + "/delete/message/" + id;
                    }
                });
            });

            $("#exportAll").on('click', function () {
                exportAll();
            });
            
            
            $("#resendBtn").on('click', function () {
                resend($(this).attr('data-id'));
            });

        function exportAll() {
            var searchParam = {
                phone_number:'{{$search_phone_number}}',
                customer_group:'{{$search_customer_group_string}}',
                campaigns:'{{$search_campaign_string}}',
                date_from:'{{$date_from}}',
                date_to:'{{$date_to}}',
                msg_delivery_status:'{{$deliveryStatus}}',
                msg_status:'{{$status}}',
                msg_type:'{{$type}}',
                export_type:'bulk',
            }

            bootbox.confirm("Are you sure you want to export?", function (result) {
                if (result) {
                    location.href = BASE_URL + "/export-all-bulk-sms-csv?"+$.param(searchParam);
                }
            });
        }


        function resend(id){
            
            bootbox.confirm("Are you sure you want to resend?", function (result) {
                if (result) {
                    console.log(id)
                    $.ajax({
                        headers: {'X-CSRF-TOKEN': CSRF_TOKEN},
                        type: "POST",
                        url: BASE_URL+"/resend-bulk-sms",
                        data: {
                            id: id,
                        },
                        success: function (data) {
                            location.reload();
                        }
                });
                }
            });
        }
        });
    </script>
@endsection