@extends('../backend/layout/' . $layout)

@section('subhead')
    <title>Coupon</title>
@endsection

@section('subcontent')
    <div class="grid grid-cols-12 gap-6 mt-5">
        <div class="intro-y col-span-12">
            <div class="intro-y box">
                <div
                    class="flex flex-col sm:flex-row items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400">
                    <h2 class="font-medium text-base mr-auto">Edit Coupon</h2>
                </div>
                <div id="form-validation" class="p-5">
                    <div class="preview">
                        <form class="validate-form" id="myForm">
                            @method('PUT')
                            <div class="input-form mb-4">
                                <label for="crud-form-2" class="form-label">Coupon Code<span
                                    class="text-danger">*</span></label>
                                <input id="coupon_code" class="form-control" type="text"
                                    value="{{ $coupon->coupon_code }}" name="coupon_code" readonly>
                            </div>
                            <div class="input-form mb-4">
                                <label>Applies to:</label>
                                <div class="form-check mt-2">
                                    <input id="categories" class="form-check-input" type="radio" name="applies_to" value="categories" @checked($coupon->applies_to == 'categories')>
                                    <label class="form-check-label" for="categories">Specific categories</label>
                                </div>
                                <div class="form-check mt-2">
                                    <input id="products" class="form-check-input" type="radio" name="applies_to" value="products" @checked($coupon->applies_to == 'products')>
                                    <label class="form-check-label" for="products">Specific products</label>
                                </div>
                                <div class="form-check mt-2">
                                    <input id="customers" class="form-check-input" type="radio" name="applies_to" value="customers" @checked($coupon->applies_to == 'customers')>
                                    <label class="form-check-label" for="products">Specific customers</label>
                                </div>
                            </div>
                            <div class="input-form mb-4" id="categories_section" style="display:none">
                                <select name="eligible_categories[]"
                                    class="tom-select w-full" id="category_id" multiple>
                                    <option value="">Select a category</option>
                                    @foreach ($categories as $category)
                                        <option value="{{ $category->id }}" @selected(is_array($coupon->eligible_categories) && in_array($category->id, $coupon->eligible_categories))>
                                        {{ $category->parent_id ? $category->parent->name .'->'. $category->name : $category->name }}</option>
                                    @endforeach
                                </select>
                                <span><strong>Note:</strong> If you do not select any category then the coupon will be applicable on all categories.</span>
                                <div id="error-category_id" class="form__input-error text-danger mt-1"></div>
                            </div>
                            <div class="input-form mb-4" id="products_section" style="display:none">
                                <select data-placeholder="Select products" class="tom-select w-full" id="product_id"
                                     name="eligible_products[]" multiple>
                                    @foreach ($products as $product)
                                        <option value="{{ $product->id }}" @selected(is_array($coupon->eligible_products) && in_array($product->id, $coupon->eligible_products))>
                                            {{ $product->name }}</option>
                                    @endforeach
                                </select>
                                <span><strong>Note:</strong> If you do not select any product then the coupon will be applicable on all products.</span>
                                <div id="error-email" class="form__input-error text-danger mt-1"></div>
                            </div>
                            <div class="input-form mb-4" id="customers_section" style="display:none">
                                <select data-placeholder="Select customers" name="eligible_customers[]"
                                    class="tom-select w-full" multiple>
                                    @foreach ($customers as $customer)
                                        <option value="{{ $customer->id }}" @selected(is_array($coupon->eligible_customers) && in_array($customer->id, $coupon->eligible_customers))>
                                            {{ $customer->first_name }}
                                            {{ $customer->last_name }}</option>
                                    @endforeach
                                </select>
                                <span><strong>Note:</strong> If you do not select any customer then the coupon will be applicable on all customers.</span>
                                <div id="error-email" class="form__input-error text-danger mt-1"></div>
                            </div>
                            <div class="grid grid-cols-12 gap-4">
                                <div class="input-form mb-4 col-span-4">
                                    <label for="crud-form-3" class="form-label">Usage Limit</label>
                                    <div class="input-group">
                                        <input id="usage_limits" type="number" class="form-control" name="usage_limits" min="1"
                                        value="{{ $coupon->usage_limits }}" required>
                                        <div class="input-group-text">Times</div>
                                    </div>
                                    <div id="error-email" class="form__input-error text-danger mt-1"></div>
                                </div>
                                <div class="input-form mb-4 col-span-4">
                                    <label for="crud-form-4" class="form-label">Discount <span
                                            class="text-danger">*</span></label>
                                        <input id="discount" type="number" class="form-control" placeholder="100"
                                            name="discount" value="{{ $coupon->discount }}" min="0" max="100" 
                                            required data-pristine-required-message="Please enter discount">
                                    <div id="error-discount" class="form__input-error text-danger mt-1"></div>
                                </div>
                                <div class="input-form mb-4 col-span-4">
                                    <label for="crud-form-4" class="form-label">Discount Type</label>
                                    <select name="discount_type" class="form-control">
                                        <option value="percentage" @selected($coupon->discount_type == 'percentage')>Percentage</option>
                                        <option value="amount" @selected($coupon->discount_type == 'amount')>Amount</option>
                                    </select>
                                </div>
                            </div>
                            <div class="input-form mb-4">
                                <label for="crud-form-3" class="form-label">Status</label>
                                <select id="status" name="status" class="form-control form-select sm:mr-2"
                                    aria-label="Default select example" required>
                                    <option value="1" @selected($coupon->status)>Enable</option>
                                    <option value="0" @selected(!$coupon->status)>Disable</option>
                                </select>
                                <div id="error-email" class="form__input-error text-danger mt-1"></div>
                            </div>
                            <div class="text-left mt-5">
                                <button type="submit" id="btn-submit" class="btn btn-primary w-24 mr-1">Update</button>
                                <a href="{{ route('coupon.index') }}" class="btn btn-outline-secondary w-24 mr-1">Back</a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script src="{{ asset(mix('js/backend/pages/coupon/edit.js')) }}"></script>
    <script>
        const get_coupon_code = '{{ route('generate.code') }}';
        const update_coupon_route = '{{ route('coupon.update', $coupon->id) }}';
    </script>
@endsection