@extends('admin.layout.master')
@section('content')
@section('honors', 'active')
@section('title', 'Users')
<style>
    .approved{
        color: green;
    }

    .pending{
        color: white;
        background-color: green;
    }
</style>


<div class="container-xxl flex-grow-1 container-p-y">
    @if (session('success'))
        <div class="alert alert-success">{{ session('success') }}</div>
    @endif
    <div class="row">
        <div class="card">
            <h5 class="card-header row">
                <div class="col-md-3">
                    Users
                </div>
                <div class="col-md-3">
                </div>
                <div class="col-md-4">

                </div>
                <div class="col-md-2">
                    {{-- <a class="btn btn-primary" href="{{ route('admin.add.honor') }}">Wall of Honor</a> --}}
                </div>

            </h5>
            <div class="table-responsive text-nowrap">
                <table class="table table-hover w-100" id="table">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Full Name</th>
                            <th>Email</th>
                            <th>Birth Date</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody class="table-border-bottom-0">
                       
                        @foreach ($users as $user)
                            <tr>
                                <td>{{$user->id}}</td>
                                <td>{{$user->name}}</td>
                                <td>{{$user->email}}</td>
                                <td>{{$user->birth_date}}</td>
                               
                                <td>
                                    {{-- <a href="{{route('admin.edit.user',['id'=>$user->id])}}" class="fa fa-edit"></a> --}}
                                    <a href="{{route('admin.delete.honor',['id'=>$user->id])}}" class="fa fa-trash"></a>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>

            </div>

        </div>
    </div>
</div>
</div>
<!-- Modal Honor -->
{{-- <div class="modal fade" id="comment" tabindex="-1" aria-labelledby="comment" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Change Status</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="btn-close"></button>
            </div>
            <div class="modal-body">
                <form action="{{route('admin.tribute.status.change')}}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <input type="hidden" name="id" class="tribute_id" value="{{$tribute->id}}">
                    
                    <div class="mb-3">
                        <h6 class="card-title">Status</h6>
                        <select name="status" class="form-control status">
                            <option value="Approved"  @if (!empty($tribute) && $tribute->status == 'Approved') selected @endif>Approved</option>
                            <option value="Pending"  @if (!empty($tribute) && $tribute->status == 'Pending') selected @endif>Pending</option>
                        </select>
                        <span class="text-danger">{{ $errors->first('status') }}</span>
                    </div>
                </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-primary">Submit</button>

            </div>
        </form>
        </div>
    </div>
</div> --}}
@endsection
@push('script')
<script>
    $(document).ready(function() {


        $('#table').DataTable({
            "scrollX": true

        });

        $(".comment").on("click", function() {
            //var dataId = $(this).attr("data-id");
            var favorite = [];
            $.each($("input[name='id[]']:checked"), function() {
                favorite.push($(this).val());
            });
            //alert("My Plants ID are: " + favorite.join(", "));
            // $('.id[]').attr(favorite);
            console.log("favorite.toString()", favorite.toString())
            let ab = document.getElementById("abc");
            ab.value = favorite.toString()
            //$(".blotter").val(dataId);
        });
    });
</script>

<script>
    $(".tribute").on("click", function() {
        var dataId = $(this).attr("data-id");
        var datastatus = $(this).attr("data-status");

        $(".tribute_id").val(dataId);
        $(".status").val(datastatus);

        // alert("The data-id of clicked item is: " + dataId);
    });
</script>
@endpush