@extends("template.layouts.simple.master")
@section('content')
    <div class="page-body">
        @include("master.notification")
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-12">
                    <div class="card">
                        <div class="card-header ">
                            <a href="{{route("shifts-create")}}">
                                <button class="btn btn-primary float-end">Create New</button>
                            </a>

                        </div>
                        <div class="card-body">
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th>Sno</th>
                                    <th>Shift Name</th>
                                    <th>Timing</th>
                                    <th>Description</th>
                                    <th>Action</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($shifts as $s)
                                    <tr>
                                        <td>{{$loop->iteration}}.</td>
                                        <td>{{$s->name}}</td>
                                        <td>{{$s->timing}}</td>
                                        <td>{{$s->description}}</td>
                                        <td>
                                            <a href="{{route('shifts-edit' , ["id"=>$s->id])}}"> <i
                                                    class="fa fa-edit fs-4"></i>
                                            </a>
                                            <i class="d-none fs-4 fa fa-trash delete_btn" data-id="{{$s->id}}"></i></td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>

                    </div>
                </div>
            </div>
        </div>


    </div>
@endsection
{{--@include("")--}}
@section("scripts")
    @include("master.notification_show_hide")
    <script>
        $(document).ready(function () {

            $(".delete_btn").click(function (e) {
                e.preventDefault();
                const id = $(this).data("id");

                Swal.fire({
                    title: 'Are you sure?',
                    text: "You won't be able to revert this!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes, delete it!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: "{{route('shifts-destroy')}}",
                            type: "POST",
                            data: {
                                "_token": "{{ csrf_token() }}", // Add the CSRF token to the data
                                "id": id
                            },
                            success: function (data) {
                                console.log(data);
                                if (data.response == 1) {
                                    Swal.fire(
                                        'Deleted!',
                                        'Your file has been deleted.',
                                        'success'
                                    )
                                    location.reload();
                                } else {
                                    Swal.fire({
                                        icon: 'error',
                                        title: 'Oops...',
                                        text: 'Something went wrong!',
                                    })
                                }
                            }
                        })

                    }
                })

            })
        })
    </script>

@endsection