@extends('panel.components.sidbar')


@section('content')
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>
<div class="md-card uk-margin-medium-bottom">
    <div class="md-card-content">
        @if(session()->get('message'))
        <div>
            <p style="color: green">{{ session()->get('message') }}</p>
        </div>
        @endif
        {{-- <h3></h3> --}}
        <div class="uk-overflow-container">
            @isset($user)
            <div class="uk-grid" data-uk-grid-margin>
                <h3>Update User Information</h3>
                <div class="uk-width-medium-1" style="margin-top: 1%">
                    <form action="{{ route('users.update',$user) }}" method="POST">
                        @csrf
                        @method('PUT')
                        <div class="uk-form-row">
                            <div class="uk-grid" data-uk-grid-margin>
                                <div class="uk-width-medium-1-2">
                                    <label>First Name</label>
                                    <input type="text" name="first_name" value="{{ $user->first_name }}"
                                        class="md-input" />
                                </div>
                                <div class="uk-width-medium-1-2">
                                    <label>Last Name</label>
                                    <input type="text" name="last_name" value="{{ $user->last_name }}"
                                        class="md-input" />
                                </div>

                            </div>
                        </div>
                        <div class="uk-form-row">
                            <label>Email</label>
                            <input type="email" name="email" value="{{ $user->email }}" class="md-input" />
                        </div>
                </div>
                <div style="text-align:center;padding-bottom:10px;">

                    <button type="submit"
                        class="md-btn md-btn-primary md-btn-large md-btn-wave-light waves-effect waves-button waves-light">
                        Update</button>
                    </form>

                </div>
            </div>
        </div>
        @else
        <h3>Users</h3>
        <table class="uk-table uk-table-nowrap table_check">
            <thead>
                <tr>
                    <th class="uk-width-2-10">User Name</th>
                    <th class="uk-width-2-10 uk-text-center">Email</th>
                    <th class="uk-width-1-10 uk-text-center">Registeration Date</th>
                    <th class="uk-width-1-10 uk-text-center">Status</th>
                    <th class="uk-width-2-10 uk-text-center">Actions</th>
                </tr>
            </thead>
            <tbody>

                @foreach ($users as $user)

                <tr>


                    <td>{{ ucwords($user->first_name .' '.$user->last_name) }}</td>
                    <td class="uk-text-center">{{ $user->email }}</td>
                    <td class="uk-text-center">{{ $user->created_at->toDateString() }}</td>
                    <td class="uk-text-center"><span
                            class="uk-badge @if(!$user->isVerified)uk-badge-danger @endif">@if($user->isVerified)
                            Verified @else Not Verified @endif </span></td>
                    <td class="uk-text-center">
                        <a href="{{ route('users.edit',$user) }}"><i class="md-icon material-icons">edit</i></a>
                        <button class="bg-transparent border-0" data-toggle="modal" data-target="#exampleModal{{ $user->id }}"><i class="md-icon material-icons">autorenew</i></button>
                        {{-- <a href="#"><i class="md-icon material-icons">cancel</i></a> --}}
                        {{-- <a href="#"><i class="md-icon material-icons">delete</i></a> --}}
                    </td>


 
  <!-- Modal -->
  <div class="modal fade" style="margin-top: 200px" id="exampleModal{{ $user->id }}" tabindex="-1" aria-labelledby="exampleModalLabel{{ $user->id }}" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel{{ $user->id }}">Change Package</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <form action="{{ route('users.update.payment',$user) }}" method="POST">
          @csrf
          @method('PUT')
        <div class="modal-body">
          <div class="row">
              <div class="col-lg-4">
                <label for="">Choose Expire Date</label>
                  <input class="form-control" type="date" name="expire_date" id="">
              </div>
              {{-- </div>
                .
<div class="row"> --}}
    <div class="col-lg-2">
                <b>OR</b>
    </div>
              <div class="col-lg-6">
                <label for="">Choose Payment Plan</label>
                  <select name="plan_id" id="" class="form-control">
                    <option value="{{ null }}">Choose Payment Plan</option>
                    @foreach ($plans as $plan)
                        
                    <option value="{{ $plan->id }}">{{ $plan->type }}</option>
                    @endforeach
                  </select>
              </div>
          </div>
        </div>
        
        <div class="modal-footer">
          {{-- <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> --}}
          <button type="submit" class="btn btn-primary">Save</button>
        </form>
        </div>
      </div>
    </div>
  </div>
                    @endforeach

  
  <!-- Modal -->
  <div class="modal fade" style="margin-top: 200px" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          ...
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div>
    </div>
  </div>

  
            </tbody>
        </table>
        @endisset
    </div>
</div>
</div>

@endsection