@extends('layouts.public.app')

@section('title', $business['company'] . ' Add Review | Chemical Wholesale')
@section('description', $business['company'] . 'Add Review')
@section('keywords', 'Supplier, Chemical Wholesale, ' . $business['company'])

@section('content')
    <div class="greybg">
        <div class="search-keywords">
            <div class="container-fluid">
                <p class="search-keywords-text">Supplier Rating and Review
                </p>
            </div>
        </div>
        <div class="mt-3 pb-4">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-4 d-none d-lg-block">
                        <div class="supplier-card">
                            <div class="supplier-card-img">
                                <img src="{{ @$business['getLogo']['path'] }}" alt="supplier" class="img-fluid"
                                    onerror="src='/assets/img/noimg.jpg'">
                            </div>
                            <p class="suppliername">{{ $business['company'] }}</p>
                            <a href="{{ route('public.supplier.profile', $business['slug']) }}" class="btn-outline w-100">
                                See More Details
                            </a>
                        </div>

                    </div>
                    <div class="col-lg-8">
                        <div class="card">
                            <div class="card-header fw-bold">
                                {{ @$review ? 'Edit' : 'Add' }} Review
                            </div>
                            <div class="card-body">
                                <form action="{{ route('public.supplier_add_review', $business['slug']) }}" method="POST">
                                    @csrf
                                    <div class="row">
                                        <div class="col-lg-12 add-review">
                                            <div class="product-item p-2">
                                                <img src="{{ @$business['getLogo']['path'] }}" alt="img"
                                                    onerror="src='/assets/img/noimg.jpg'">
                                                <div class="product-item-info">
                                                    <h6 class="productname">
                                                        <a href="{{ route('public.supplier.profile', $business['slug']) }}"
                                                            class="text-dark">{{ $business['company'] }}</a>
                                                    </h6>
                                                    <p class="productdesc">
                                                        {{ $business['company'] }}
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-12">
                                            <div class="mb-1">
                                                <label class="form-label">Rating</label>
                                                <input id="rating" name="rating" class="rating rating-loading"
                                                    data-min="0" data-max="5" data-step="1" required
                                                    value="{{ @$review['rating'] }}">
                                            </div>
                                        </div>
                                        <div class="col-lg-12">
                                            <div class="mb-3">
                                                <label class="form-label">Review</label>
                                                <textarea name="review" id="" cols="30" rows="5" class="form-control cw-input">{{ @$review['review'] }}</textarea>
                                            </div>
                                        </div>
                                        <div class="col-lg-12">
                                            <div class="mb-3 d-flex align-items-center">
                                                <button type="submit" class="btn-viewall d-block" id="addReview">Save</button>
                                                <a href="{{ route('public.supplier.profile', @$business['slug']) }}"
                                                    class="text-muted ms-2">
                                                    Cancel
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection
@push('css')
    <link rel="stylesheet" href="{{ asset('assets/css/star-rating.css') }}" />
@endpush
@push('js')
    <script src="{{ asset('assets/js/star-rating.js') }}" data-rel-js></script>

    <script>
        $("#rating").rating({
            clearButton: ''
        });
    </script>
    
    <script>
        $('form').submit(function(e) {
            var submitBtn = $('#addReview');
            submitBtn.html('<span class="spinner me-2"></span>Saving');
            setTimeout(function() {
                submitBtn.removeAttr('disabled');
                submitBtn.html('Save');
            }, 1000);
        });
    </script>
@endpush