@extends('layouts.admin')
@section('title','Users')
@section('css')
<style>
  .disable {
    display: none;
  }
</style>
@endsection
@section('breadcrumb', 'Users')
@section('content')
<!--Action boxes-->
<div class="container-fluid">



  <div class="row-fluid">
    <div class="span12">

      <div class="widget-box">
        <div class="widget-title"> <span class="icon"><i class="icon-ok"></i></span>
          <h5>Users</h5>
          <div class="buttons">

            <select class="form-control timezone"></select>



          </div>

        </div>
        <div class="widget-content">
          <table class="table table-bordered table-striped">
            <thead>
              <tr>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Email</th>
                <th>Phone</th>
                <th>Status</th>
                <th>Last Login</th>

              </tr>
            </thead>
            <tbody>
              <tr class="odd gradeX">
                @foreach($users as $data)

                <td>{{$data->userFirstName }}</td>
                <td>{{$data->userLastName}}</td>
                <td>{{$data->email}}</td>
                <td>{{ $data->phone ? $data->phone:"===" }}</td>
                <td><a class="edit" href="{{route("changeuserstatus",[$data->id])}}">{{ $data->is_active == 0 ? "Active":"Deactive" }}</a></td>
                <td class="utc" data-utc="{{date('Y/m/d H:i:s',strtotime($data->last_login)).' GMT'}}">01 January 1970 12:00:00 am</td>


              </tr>
              @endforeach
            </tbody>
          </table>
          {{ $users->links('vendor.pagination.default') }}


        </div>
      </div>





    </div>


  </div>
</div>
</div>
<!--end-main-container-part-->
@endsection
@section('js')
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>
<script src="{{asset('js/timezones.full.js')}}"></script> 
<script>
$(document).ready(function() {
   $('.timezone').timezones();
    $('.utc').each(function() {
        var udate = $(this).attr('data-utc');
        var zone = $('.timezone').val();
        const str2 = new Date(udate).toLocaleString('en-US', { timeZone: zone });
        var date = new Date(udate).toString();

       // var index = date.lastIndexOf(':') +3
        //$(this).html(date.substring(0, index));
        $(this).html(str2);
        
        
    });
    $('.timezone').change(function(){
         $('.utc').each(function() {
        var udate = $(this).attr('data-utc');
        var zone = $('.timezone').val();
        const str2 = new Date(udate).toLocaleString('en-US', { timeZone: zone });
        var date = new Date(udate).toString();
        $(this).html(str2);
        
        
         });
    });

    });
  $(".edit").click(function(e) {
    e.preventDefault();
    c = confirm("Are You sure");
    if (c == false)
      return false;
    aa = $(this);
    url = $(this).attr("href");
    axios.put(url)
      .then(function(response) {
        aa.html(response.data);
      })
      .catch(function(error) {

        //ele.remove();
      });
  });
</script>
@endsection