@extends('dashboard.base')

@section('content')

<style>.card.text-white.bg-info {
    height: 158px;
}
.card.text-white.bg-warning {
    height: 158px;
}

.card.text-white.bg-danger{
   height: 158px;
}
</style>

          <div class="container-fluid">
            <div class="fade-in">
              <div class="row">
                
                <div class="col-sm-6 col-lg-3">
                  <div class="card text-white bg-info">
                    <div class="card-body pb-0">
                      <button class="btn btn-transparent p-0 float-right" type="button">
                      
                      </button>
                     <div class="user">Total Polls: {{ $count_array['tpoll'] ? $count_array['tpoll']:'0' }} </div><br>
                      <div class="user">Live Polls: {{ $count_array['livepoll'] ? $count_array['livepoll']:'0' }}</div><br>
                      <div class="user">Closed Polls: {{ $count_array['closedpoll'] ? $count_array['closedpoll']:'0' }}</div>
                      
                    </div>
                    <div class="c-chart-wrapper mt-3 mx-3" style="height:70px;">
                      <canvas class="chart" id="card-chart2" height="70"></canvas>
                    </div>
                  </div>
                </div>
                <!-- /.col-->
                <div class="col-sm-6 col-lg-3">
                  <div class="card text-white bg-warning">
                    <div class="card-body pb-0">
                      <!-- <div class="btn-group float-right">
                        <button class="btn btn-transparent dropdown-toggle p-0" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                          <svg class="c-icon">
                            <use xlink:href="assets/icons/coreui/free-symbol-defs.svg#cui-settings"></use>
                          </svg>
                        </button>
                        <div class="dropdown-menu dropdown-menu-right"><a class="dropdown-item" href="#">Action</a><a class="dropdown-item" href="#">Another action</a><a class="dropdown-item" href="#">Something else here</a></div>
                      </div> -->
                      <!-- <div class="text-value-lg">9.823</div> -->
                     
 
                      <div class="user">Total Users: {{ $count_array['totalUsers'] ? $count_array['totalUsers']:'0' }} </div><br>
                      <div class="user">Minipol Users: {{ $count_array['minipol'] ? $count_array['minipol']:'0' }}</div><br>
                      <div class="user">Pinipol Users: {{ $count_array['pinipol'] ? $count_array['pinipol']:'0' }}</div>
                    </div>
                    <div class="c-chart-wrapper mt-3" style="height:70px;">
                      <canvas class="chart" id="card-chart3" height="70"></canvas>
                    </div>
                  </div>
                </div>
                <!-- /.col-->
                <div class="col-sm-6 col-lg-3">
                  <div class="card text-white bg-danger">
                    <div class="card-body pb-0">
                     <!--  <div class="btn-group float-right">
                        <button class="btn btn-transparent dropdown-toggle p-0" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                          <svg class="c-icon">
                            <use xlink:href="assets/icons/coreui/free-symbol-defs.svg#cui-settings"></use>
                          </svg>
                        </button>
                        <div class="dropdown-menu dropdown-menu-right"><a class="dropdown-item" href="#">Action</a><a class="dropdown-item" href="#">Another action</a><a class="dropdown-item" href="#">Something else here</a></div>
                      </div> -->
         <!--              <div class="text-value-lg">9.823</div> -->
                      <div class="user">Total Organizations: {{ $count_array['totalorg'] ? $count_array['totalorg']:'0' }}</div><br>
                       <div class="user">Minipol Organizations: {{ $count_array['org_minipol'] ? $count_array['org_minipol']:'0' }}</div><br>
                      <div class="user">Pinipol Organizations: {{ $count_array['org_pinipol'] ? $count_array['org_pinipol']:'0' }}</div>
                    </div>
                    <div class="c-chart-wrapper mt-3 mx-3" style="height:70px;">
                      <canvas class="chart" id="card-chart4" height="70"></canvas>
                    </div>
                  </div>
                </div>
                <!-- /.col-->
              </div>
                          
            </div>
          </div>
<!--------------Strat Notification management---------------------->          
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>


        <div class="container-fluid">
          <div class="animated fadeIn">
            <div class="row">
              <div class="col-sm-12 col-md-12 col-lg-12 col-xl-12">
                <div class="card">


                    <div class="card-header">
                    @if(session()->has('success'))
                    <div class="alert alert-success" role="alert">
                      <strong></strong> {{ session()->get('success') }}
                      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                      </button>
                    </div>
                    @endif
                      <i class="fa fa-align-justify"></i>{{ __('Notification Management') }}
                      <br><br>
                      <div class="row">
                       <div class="col-md-3">
                        <label class="control-label">Notification Type</label>
                                 <select class="form-control" type="text" id="filter_notification" placeholder="Notification Type" name="filter_notification">
                                        <option value="0">All Notifictions</option>
                                        <option value="1">Organization Account</option>
                                        <option value="2">Premium Poll</option>
                                        <option value="3">Poll Report</option>
                                </select>
                        </div>
                         <div class="col-md-3">
                             <label class="control-label">Status</label>
                                 <select class="form-control" type="text" id="status" placeholder="Choose Status" name="status">
                                        <option value="0">UnRead</option>
                                        <option value="1">Read</option>
                                </select>
                        </div>

                        </div>    
                    </div>
                    <div class="card-body">
                        <div class="container">
                            <table class="table table-bordered display nowrap" id="userdoatatable">
                              @csrf
                                <thead>
                                <tr>
                                   <!--  <th>Notification From</th> -->
                                    <th>User Name</th>
                                    <th>Notification Type</th>
                                    <th>Message</th>
                                    <th>Registered On</th>
                                    <th>Read Status</th>
                                    <th>Action</th>
                                    </tr>
                                </thead>
                            </table>
                        </div>
                        <link  href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css" rel="stylesheet">
                        <link  href="https://cdn.datatables.net/responsive/2.2.4/css/responsive.dataTables.min.css" rel="stylesheet">


                        <script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
                        <script src="https://cdn.datatables.net/responsive/2.2.4/js/dataTables.responsive.min.js"></script>

                         <script>
                            $(document).ready( function () {
                                fill_datatable(0,0);


                              function fill_datatable(filter_notification='',status = '')
                                {
                                     $.fn.dataTable.ext.errMode = 'throw';
                                       var dataTable = $('#userdoatatable').DataTable({
                                        processing: true,
                                        serverSide: true,
                                        responsive: true,
                                        //  "scrollX": true,
                                         "oLanguage": {
                                                  "sEmptyTable": "No Data Available"
                                              },



                                         ajax:{
                                            type: "POST",
                                            url: "{{ url('notification-type-list')  }}",
                                            data:{"_token": "{{ csrf_token() }}",status:status,filter_notification:filter_notification}
                                        },
                                    columns: [
                                        /*{ data: 'notification_from', name: 'notification_from' },*/
                                        { data: 'notification_to', name: 'notification_to' },
                                        { data: 'notification_type', name: 'notification_type' },
                                        { data: 'message', name: 'message' },
                                        { data: 'user_role', name: 'user_role' },
                                        { data: 'read_status', name: 'read_status' },
                                        { data: 'action', name: 'action', orderable: false, searchable: false}
                                     ]


                                });


                              }

                             $('#status').on('change',function(){
                              var status = $('#status').val();
                              var filter_notification = $('#filter_notification').val();
                              if(status != '' ||filter_notification !='')
                              {
                                  $('table#userdoatatable').DataTable().destroy();
                                  fill_datatable(filter_notification,status);
                              }

                          });

                             $('#filter_notification').on('change',function(){
                              var status = $('#status').val();
                              var filter_notification = $('#filter_notification').val();
                              if(status != '' ||filter_notification !='')
                              {
                                  $('table#userdoatatable').DataTable().destroy();
                                  fill_datatable(filter_notification,status);
                              }

                          });


                         /*     $(document).on('click',".cil-media-play", function(){
                                  return confirm('Are you sure you want to Activate Account?');
                                });

                               $(document).on('click',".cil-media-pause", function(){
                                  return confirm('Are you sure you want to Suspend Account?');
                                });

                               $(document).on('click',".confirmation-del", function(){
                                  return confirm('Are you sure you want to delete this User?');
                                });
*/

                            });

                                    //$('div.alert').not('.alert-important').delay(5000).fadeOut(500);
                        </script>
                    </div>
                </div>

              </div>
            </div>
          </div>
        </div>          
<!--------------End Notification management----------------------> 
@endsection

@section('javascript')

    <script src="{{ asset('js/Chart.min.js') }}"></script>
    <script src="{{ asset('js/coreui-chartjs.bundle.js') }}"></script>
    <script src="{{ asset('js/main.js') }}" defer></script>
@endsection