@extends('layouts.app')

@section('content')
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <table class="table table-striped">
                <thead>
                    <th>ID</th>
                    <th>Title</th>
                    <th>Action</th>
                    <th>Edit</th>
                    <th>Delete</th>

                    <th></th>
                </thead>
                <tbody>
                  
                @foreach($posts as $post)
                <tr>

                    <td>{{ $post->id }}</td>
                    <td>{{ $post->title }}</td>
                    <!-- <td><img src="{{ $post->image }}" alt="" srcset=""></td> -->
                    <td>
                        <a href="{{ route('post.show', $post->id) }}" class="btn btn-primary">Show Post</a>

                        <!-- <a href="{{ route('post.destroy', $post->id) }}" class="btn btn-primary delete_form">Delete Post</a> -->


                    </td>
                    <td>
                      @if($post->user_id == $user_id)
                        <a href="{{ route('post.edit', $post->id) }}}" class="btn btn-primary delete_formr"/> <i class="fa fa-edit fa-1x"></i> Edit</a>
                        @endif
                      </td>
                      <td>
                        @if($post->user_id == $user_id)
                        <form method="get" class="delete_form" action="{{ route('post.destroy', $post->id) }}">
                          {{csrf_field()}}
                        <button type="submit" class="btn btn-primary delete_formr"><i class="fa fa-trash fa-1x"></i> Delete Post</button>
                        @endif
                        </form>

                    </td>
                @endforeach
                </tbody>

            </table>
        </div>
    </div>
</div>
<script>
    $(document).ready(function(){
        $('.delete_form').on("submit", function(){
            // return confirm("Are you sure?");
            if(confirm("คุณต้องการลบข้อมูลหรือไม่?")){
                return ture;
            }
            else {
                return false;
            }
        });
    });
</script>
@endsection
