@extends('Frontend.Master.authMaster')
@section('content')


    <section class="upload-form-sec">
        <div class="upload-form-sec-wrap">
            <div class="container">

                <div class="row">

                    <div class="col-lg-3">
                        @include('Frontend.Layouts.leftbar')
                    </div>


                    <div class="col-lg-9">
                        <div class="upload-form-div">
                            <div class="page-header">
                                {{-- <h3 class="page-title">Chunk Files</h3> --}}
                                <h4>All Documents</h4>
                            </div>
                        </div>
                        <div class="all-docs">
                            <div class="row">
                                <div class="col-lg-12 grid-margin stretch-card">
                                    <div class="card">
                                        <div class="card-body manage-card">
                                            <table class="table table-bordered custom-table-1">
                                                <thead>
                                                    <tr>
                                                        <th>Sl No.</th>
                                                        {{-- <th>Name</th> --}}
                                                        <th>Title</th>
                                                        {{-- <th>Description</th> --}}
                                                        <th>Purpose</th>
                                                        <th>Tags</th>
                                                        <th>date</th>
                                                        <th>Image</th>
                                                        <th>Action</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @foreach($allFiles as $index => $allFile)
                                                        <tr>
                                                            <td>{{ ($allFiles->firstItem() + $loop->index) }}</td>
                                                            {{-- <td>{{ $allFile->name }}</td> --}}
                                                            <td>{{ $allFile->title }}</td>
                                                            {{-- <td>{{ $allFile->description }}</td> --}}
                                                            <td>{{ \Illuminate\Support\Str::limit($allFile->purpose, 50, '...') }}
                                                            </td>
                                                            {{-- <td>{{ $allFile->purpose }}</td> --}}


                                                            <td>
                                                                @php
                                                                    $tagsArray = is_array($allFile->tags) ? $allFile->tags : json_decode($allFile->tags, true);
                                                                @endphp

                                                                @foreach($tagsArray ?? [] as $tag)
                                                                    <span class="tag-bg-1 badge bg-info">
                                                                        <span class="tag-icon">
                                                                            <i class="fa-solid fa-tag"></i>
                                                                        </span>
                                                                        {{ is_array($tag) ? ($tag['value'] ?? implode(',', $tag)) : $tag }}
                                                                    </span>
                                                                @endforeach
                                                            </td>


                                                            <td>{{$allFile->created_at->format('d-m-Y h:i A')}}</td>
                                                            <td style="">
                                                                {{-- {{ asset('storage/' . $allFile->thumb_image) }} --}}
                                                                @if($allFile->thumb_image)
                                                                    <img src="{{ asset('storage/' . $allFile->thumb_image) }}"
                                                                        alt="Thumbnail"
                                                                        style="width: 100%; height: 100%; object-fit: cover;">
                                                                    {{-- <img src="{{ asset('storage/' . $allFile->thumb_image) }}"
                                                                        alt="Thumbnail"> --}}
                                                                @else
                                                                    <span class="text-muted">No Image</span>
                                                                @endif
                                                            </td>

                                                            <!-- <td>{{ basename($allFile->file_path) }}</td>  -->
                                                            <td class="" style="">
                                                                <!-- <a href="{{ route('userFile.download', basename($allFile->file_path)) }}" class="download_btn" target="_blank">
                                                                    <i class="mdi mdi-download"></i>
                                                                </a> -->
                                                                <a href="{{ route('media.edit', $allFile->id) }}"
                                                                    class="edit_btn">
                                                                    <i class="mdi mdi-pencil"></i>
                                                                </a>
                                                                <!-- <a href="{{ route('media.destroy', $allFile->id) }}"
                                                                    class="delete_btn"
                                                                    id="deleteFile"
                                                                    data-id="{{ $allFile->id }}"
                                                                    onclick="confirmDelete(event, this.href);">
                                                                    <i class="mdi mdi-trash-can"></i>
                                                                </a> -->
                                                                <a href="javascript:void(0);" class="delete-btn"
                                                                    data-id="{{ $allFile->id }}">
                                                                    <i class="mdi mdi-trash-can"></i>
                                                                </a>

                                                            </td>
                                                        </tr>
                                                    @endforeach
                                                </tbody>
                                            </table>

                                            <div class="d-flex justify-content-end mt-3 pagination">
                                                {{ $allFiles->links('pagination::bootstrap-5') }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>
    <script>
        // function myFunction() {
        //       if(!confirm("Are You Sure to delete this"))
        //       event.preventDefault();
        //   }
    </script>

    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <!-- <script src="{{asset('assets/js/deleteconfirmation.js')}}"></script> -->
    <!-- <script>
        document.addEventListener("DOMContentLoaded", function() {
            document.querySelectorAll("tr").forEach((row) => {
                let maxHeight = 0;
                let cells = row.querySelectorAll("td");

                // Find the maximum height of all tds in the row
                cells.forEach((cell) => {
                    let height = cell.offsetHeight;
                    if (height > maxHeight) {
                        maxHeight = height;
                    }
                });

                // Apply max height to the last td
                let lastTd = row.querySelector("td:last-child");
                if (lastTd) {
                    lastTd.style.height = maxHeight + "px";
                }
            });

            function confirmDelete(event, url) {
                event.preventDefault(); // Prevents the default link action
                console.log("Delete confirmation triggered!");
                Swal.fire({
                    title: "Are you sure?",
                    text: "This file will be permanently deleted.",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#d33",
                    cancelButtonColor: "#3085d6",
                    confirmButtonText: "Yes, delete it!"
                }).then((result) => {
                    if (result.isConfirmed) {
                        window.location.href = url; // Redirects only if confirmed
                    }
                });
            }

        });
    </script> -->
    <script>
        $('.delete-btn').click(function () {
            var fileId = $(this).data('id'); // Get user ID from data-id attribute

            // Show SweetAlert2 confirmation dialog
            Swal.fire({
                title: 'Are you sure?',
                text: 'You won\'t be able to revert this!',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Yes, delete it!',
                cancelButtonText: 'No, cancel!',
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: "{{ route('media.destroy') }}",
                        type: 'POST',
                        data: {
                            _token: "{{ csrf_token() }}",
                            id: fileId
                        },
                        success: function (response) {
                            if (response.status === 'success') {
                                Swal.fire('Deleted!', response.message, 'success');
                                location.reload();
                            } else {
                                Swal.fire('Error!', response.message, 'error');
                            }
                        },
                        error: function (xhr, status, error) {
                            Swal.fire('Something went wrong!', 'Please try again.', 'error');
                        }
                    });
                } else {
                    Swal.fire('Cancelled', 'The file was not deleted', 'info');
                }
            });
        });
    </script>

@endsection