<div>
<div class="row">
<div class="col-xl-12">
<div class="ps-widget bgc-white bdrs4 p30 mb30 overflow-hidden position-relative">
<div class="packages_table table-responsive">
<div class="navtab-style1">
<nav>
<div class="nav nav-tabs mb20" id="nav-tab2" role="tablist">
<button class="nav-link active fw500 ps-0" id="nav-item2-tab" data-bs-toggle="tab"
data-bs-target="#nav-item2" type="button" role="tab" aria-controls="nav-item2"
aria-selected="false">Pending Reviews</button>
<button class="nav-link fw500 ps-0" id="nav-item1-tab" data-bs-toggle="tab"
data-bs-target="#nav-item1" type="button" role="tab" aria-controls="nav-item1"
aria-selected="true">All Reviews</button>
</div>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade" id="nav-item1" role="tabpanel" aria-labelledby="nav-item1-tab">
@forelse ($reviews as $review)
<div class="col-md-12">
<div class="bdrb1 pb20">
<div
class="mbp_first position-relative d-sm-flex align-items-center justify-content-start mb30-sm mt30">
<!-- User Profile Picture -->
@if ($user['role'] == 'seller')
<img src="{{ $review['user']['profile_photo_url'] ?? '' }}"
class="mr-3 img-thumbnail rounded-circle"
style="width: 100px; height: 100px; object-fit: cover;">
@else
<img src="{{ $review['gig']['image_urls'][0] ?? '' }}"
class="mr-3 img-thumbnail rounded-circle"
style="width: 100px; height: 100px; object-fit: cover;">
@endif
<div class="ml20 ml0-xs mt20-xs">
<!-- User Name -->
@if ($user['role'] == 'seller')
<h6 class="mt-0 mb-1">
{{ is_array($review['user']) ? $review['user']['name'] : 'Unknown User' }}
</h6>
@endif
<span class="fz15 fw500">Service: <a
href="#">{{ $review['gig']['title'] }}</a></span>
<!-- Rating and Timestamp -->
<div class="d-flex align-items-center">
<div>
@for ($i = 1; $i <= 5; $i++) @if ($i <=$review['star_rating'])
<i class="fas fa-star vam fz10 review-color me-2"></i>
<!-- Filled star for rating -->
@else
<i class="far fa-star vam fz10 review-color me-2"></i>
<!-- Outline star for remaining -->
@endif
@endfor
</div>
</div>
<div class="">
<span class="text">
{{ \Carbon\Carbon::parse($review['created_at'])->diffForHumans() }}</span> -
@if ( $review['photo_url']) <span><a
href="{{ $review['photo_url'] }}" target="_blank"> [Photo
attached] </a></span>@endif
</div>
<p class="text mt20 mb5">{{ $review['comment'] }} </p>
<button hidden href="#" class="text-white btn-dark rounded">Edit
review</button>
</div>
</div>
</div>
</div>
@empty
<p class="text-center mt10 mb-0 pagination_page_count">No reviews found.</p>
@endforelse
</div>
<!-- Pending Reviews Tab -->
<div class="tab-pane fade show active" id="nav-item2" role="tabpanel"
aria-labelledby="nav-item2-tab">
@forelse ($pendingGigs as $gig)
<div class="col-md-12">
<div class="bdrb1 pb20">
<div class="d-flex align-items-center mb20">
<img src="{{ $gig['gig']['image_urls'][0] ?? '' }}"
class="mr-3 img-thumbnail rounded-circle"
style="width: 100px; height: 100px; object-fit: cover;">
<div class="ml20">
<h6 class="mt-0 mb-1">{{ $gig['gig']['title'] }}</h6>
</div>
</div>
<!-- Review Form -->
<form wire:submit.prevent="submitReview('{{ $gig['gig']['id'] }}')">
<!-- Comment Section -->
<div class="col-sm-12">
<div class="mb-3" x-data="{ count: 0, maxChars: 255 }">
<label class="heading-color ff-heading fw500 mb-2">Comment</label>
<textarea wire:model.lazy="comment" x-model="comment"
x-on:input="count = $event.target.value.length" cols="30"
rows="6" maxlength="255" class="form-control"
placeholder="Share your experience"
style="width: 100%; height: 150px;">
</textarea>
<small x-text="count + '/' + maxChars + ' characters used'"
class="text-muted"></small>
@error('comment')
<span class="text-danger d-block">{{ $message }}</span>
@enderror
</div>
</div>
<!-- Star Rating -->
<div wire:ignore class="mb-3">
<label for="star_rating" class="form-label">Star Rating</label>
<div class="bootselect-multiselect">
<select wire:model="star_rating" id="star_rating"
class="selectpicker" required>
<option value="" disabled>Select a rating</option>
<option value="5">5 Stars</option>
<option value="4">4 Stars</option>
<option value="3">3 Stars</option>
<option value="2">2 Stars</option>
<option value="1">1 Star</option>
</select>
@error('star_rating')
<span class="text-danger d-block">{{ $message }}</span>
@enderror
</div>
</div>
<!-- Photo Upload -->
<div class="mb-3">
<label for="photo" class="form-label">Attach Photo (Optional)</label>
<input type="file" wire:model="photo" id="photo" class="form-control"
accept="image/*">
@error('photo')
<span class="text-danger d-block">{{ $message }}</span>
@enderror
<div wire:loading wire:target="photo" class="mt-2">
<small class="text-muted">Uploading photo...</small>
</div>
@if ($photo)
<div class="mt-2">
<img src="{{ $photo->temporaryUrl() }}" alt="Preview"
class="img-thumbnail" style="max-width: 200px;">
</div>
@endif
</div>
<!-- Submit Button -->
<div class="col-md-12 ">
<div class="text-start">
<button type="submit" wire:loading.attr="disabled"
class="ud-btn btn-thm default-box-shadow2 w-100">
<span wire:loading
class="spinner-border spinner-border-sm"></span>
<span wire:loading.remove> Submit review</span>
</button>
</div>
</div>
</form>
</div>
</div>
@empty
<p class="text-center mt10 mb-0 pagination_page_count">No pending reviews.</p>
@endforelse
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>