@extends('layouts.main')

@section('content')

<div class="container-fluid py-4">

    {{-- Success Message --}}
    @if(session('success'))

        <div class="alert alert-success alert-dismissible fade show">
            {{ session('success') }}

            <button type="button"
                    class="btn-close"
                    data-bs-dismiss="alert"></button>
        </div>

    @endif

    {{-- Add Testimonial --}}
    <div class="card border-0 shadow-sm mb-4 rounded-4">

        <div class="card-header bg-white py-3 border-bottom">

            <h5 class="mb-0 fw-bold">
                Add Testimonial
            </h5>

        </div>

        <div class="card-body">

            <form action="{{ route('superadmin.testimonial.store') }}"
                  method="POST"
                  enctype="multipart/form-data">

                @csrf

                <div class="row align-items-end">

                    {{-- Name --}}
                    <div class="col-md-3 mb-3">

                        <label class="form-label fw-semibold">
                            Name
                        </label>

                        <input type="text"
                               name="name"
                               class="form-control rounded-3 @error('name') is-invalid @enderror"
                               placeholder="Enter Name"
                               value="{{ old('name') }}">

                        @error('name')

                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- Description --}}
                    <div class="col-md-4 mb-3">

                        <label class="form-label fw-semibold">
                            Description
                        </label>

                        <textarea name="description"
                                  rows="1"
                                  class="form-control rounded-3 @error('description') is-invalid @enderror"
                                  placeholder="Enter Description">{{ old('description') }}</textarea>

                        @error('description')

                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- Image --}}
                    <div class="col-md-3 mb-3">

                        <label class="form-label fw-semibold">
                            Image
                        </label>

                        <input type="file"
                               name="image"
                               class="form-control rounded-3 @error('image') is-invalid @enderror">

                        @error('image')

                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>

                        @enderror

                    </div>

                    {{-- Button --}}
                    <div class="col-md-2 mb-3">

                        <button type="submit"
                                class="btn btn-primary w-100 rounded-3">

                            <i class="bi bi-plus-circle me-1"></i>
                            Save

                        </button>

                    </div>

                </div>

            </form>

        </div>

    </div>

    {{-- List --}}
    <div class="card border-0 shadow-sm rounded-4">

        <div class="card-header bg-white py-3 border-bottom">

            <h5 class="mb-0 fw-bold">
                Testimonial List
            </h5>

        </div>

        <div class="card-body p-0">

            <div class="table-responsive">

                <table class="table table-hover align-middle mb-0">

                    <thead class="table-light">

                        <tr>
                            <th class="ps-4">#</th>
                            <th>Image</th>
                            <th>Name</th>
                            <th>Description</th>
                            <th class="text-center" width="180">
                                Action
                            </th>
                        </tr>

                    </thead>

                    <tbody>

                        @forelse($testimonials as $item)

                            <tr>

                                {{-- ID --}}
                                <td class="ps-4 fw-semibold">
                                    {{ $loop->iteration }}
                                </td>

                                {{-- Image --}}
                                <td>

                                    @if($item->image)

                                        <img src="{{ asset('uploads/testimonial/'.$item->image) }}"
                                             width="70"
                                             height="70"
                                             class="rounded-3 border"
                                             style="object-fit: cover;">

                                    @else

                                        <img src="https://via.placeholder.com/70x70"
                                             width="70"
                                             height="70"
                                             class="rounded-3 border">

                                    @endif

                                </td>

                                {{-- Name --}}
                                <td class="fw-semibold">
                                    {{ $item->name }}
                                </td>

                                {{-- Description --}}
                                <td style="max-width: 300px;">

                                    <div class="text-muted small">
                                        {{ Str::limit($item->description, 100) }}
                                    </div>

                                </td>

                                {{-- Actions --}}
                                <td>

                                    <div class="d-flex justify-content-center gap-2">

                                        {{-- Edit --}}
                                        <button type="button"
                                                class="btn btn-sm btn-primary rounded-pill px-3"
                                                data-bs-toggle="modal"
                                                data-bs-target="#editTestimonialModal{{ $item->id }}">

                                            <i class="bi bi-pencil-square me-1"></i>
                                            

                                        </button>

                                        {{-- Delete --}}
                                        <a href="{{ route('superadmin.testimonial.delete', $item->id) }}"
                                           class="btn btn-sm btn-danger rounded-pill px-3"
                                           onclick="return confirm('Delete this testimonial?')">

                                            <i class="bi bi-trash me-1"></i>
                                            

                                        </a>

                                    </div>

                                </td>

                            </tr>

                            {{-- Edit Modal --}}
                            <div class="modal fade"
                                 id="editTestimonialModal{{ $item->id }}"
                                 tabindex="-1"
                                 aria-hidden="true">

                                <div class="modal-dialog modal-lg modal-dialog-centered">

                                    <div class="modal-content border-0 rounded-4">

                                        {{-- Header --}}
                                        <div class="modal-header bg-primary text-white">

                                            <h5 class="modal-title">
                                                Edit Testimonial
                                            </h5>

                                            <button type="button"
                                                    class="btn-close btn-close-white"
                                                    data-bs-dismiss="modal"></button>

                                        </div>

                                        {{-- Form --}}
                                        <form action="{{ route('superadmin.testimonial.update', $item->id) }}"
                                              method="POST"
                                              enctype="multipart/form-data">

                                            @csrf

                                            <div class="modal-body">

                                                <div class="row">

                                                    {{-- Name --}}
                                                    <div class="col-md-6 mb-3">

                                                        <label class="form-label fw-semibold">
                                                            Name
                                                        </label>

                                                        <input type="text"
                                                               name="name"
                                                               class="form-control rounded-3"
                                                               value="{{ $item->name }}">

                                                    </div>

                                                    {{-- Image --}}
                                                    <div class="col-md-6 mb-3">

                                                        <label class="form-label fw-semibold">
                                                            Image
                                                        </label>

                                                        <input type="file"
                                                               name="image"
                                                               class="form-control rounded-3">

                                                    </div>

                                                    {{-- Description --}}
                                                    <div class="col-12 mb-3">

                                                        <label class="form-label fw-semibold">
                                                            Description
                                                        </label>

                                                        <textarea name="description"
                                                                  rows="4"
                                                                  class="form-control rounded-3">{{ $item->description }}</textarea>

                                                    </div>

                                                    {{-- Old Image --}}
                                                    <div class="col-12 text-center">

                                                        @if($item->image)

                                                            <img src="{{ asset('uploads/testimonial/'.$item->image) }}"
                                                                 width="100"
                                                                 height="100"
                                                                 class="rounded-3 border shadow-sm"
                                                                 style="object-fit:cover;">

                                                        @endif

                                                    </div>

                                                </div>

                                            </div>

                                            {{-- Footer --}}
                                            <div class="modal-footer">

                                                <button type="button"
                                                        class="btn btn-light border rounded-3"
                                                        data-bs-dismiss="modal">

                                                    Cancel

                                                </button>

                                                <button type="submit"
                                                        class="btn btn-primary rounded-3">

                                                    Update

                                                </button>

                                            </div>

                                        </form>

                                    </div>

                                </div>

                            </div>

                        @empty

                            <tr>

                                <td colspan="5" class="text-center py-5">

                                    <h6 class="text-muted mb-0">
                                        No Data Found
                                    </h6>

                                </td>

                            </tr>

                        @endforelse

                    </tbody>

                </table>

            </div>

        </div>

    </div>

</div>

@endsection