@extends('backend.layouts.app')
@section('title', $title)
@section('content')

<x-back-button :route="route('admin.coupons.index')">Back to coupons</x-back-button>

<div class="row">
    <div class="col">
        <div class="card">
            <div class="card-header">
                <h5 class="card-title mb-0">
                    {{ $title }}
                </h5>
            </div>
            <div class="card-body">
                <form action="{{ route('admin.coupons.update', $coupon->id) }}" method="post" enctype="multipart/form-data">
                    @csrf
                    @method("PUT")
                    <div class="form-group row mb-3">
                        <div class="col">
                            <label class="form-label" for="code">Code <span class="text-danger">*</span></label>
                            <input class="form-control @error("code") is-invalid @enderror" type="text" id="code" name="code" value="{{ old('code', $coupon->code) }}" required />
                            <button type="button" class="btn btn-pink mt-2" onclick="generateCouponCode(6)">
                                <i class="ri-ai-generate me-1"></i>
                                Generate coupon
                            </button>
                            @error("code")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row mb-3">
                        <div class="col">
                            <label class="form-label" for="user_usage_limit">User usage limit <span class="text-danger">*</span></label>
                            <input class="form-control @error("user_usage_limit") is-invalid @enderror" type="number" min="1"
                                   id="user_usage_limit" name="user_usage_limit" value="{{ old('user_usage_limit', $coupon->user_usage_limit) }}" required/>
                            @error("user_usage_limit")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="col">
                            <label class="form-label" for="profit_percentage">Profit percentage % <small class="text-success">for employees</small> <span class="text-danger">*</span></label>
                            <input class="form-control @error("profit_percentage") is-invalid @enderror" type="number" min="1"
                                   id="profit_percentage" name="profit_percentage" value="{{ old('profit_percentage', $coupon->profit_percentage) }}" required/>
                            @error("profit_percentage")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row mb-3">
                        <div class="col">
                            <input class="form-check-input @error("is_free_shipping") is-invalid @enderror"
                                   type="checkbox" id="is_free_shipping" name="is_free_shipping" value="true"
                                   required @checked(old('is_free_shipping', (bool)$coupon->is_free_shipping) === true) />
                            <label class="form-check-label" for="is_free_shipping">Free shipping</label>
                            @error("is_free_shipping")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row mb-3">
                        <div class="col">
                            <label class="form-label" for="start_date">Start Date <span class="text-danger">*</span></label>
                            <input class="form-control @error("start_date") is-invalid @enderror" type="date" id="start_date" name="start_date" value="{{ old('start_date', $coupon->start_date) }}" required />
                            @error("start_date")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="col">
                            <label class="form-label" for="end_date">End Date <span class="text-danger">*</span></label>
                            <input class="form-control @error("end_date") is-invalid @enderror" type="date" id="end_date" name="end_date" value="{{ old('end_date', $coupon->end_date) }}" required />
                            @error("end_date")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row mb-3 hideable-free-shipping">
                        <div class="col">
                            <label class="form-label" for="min_value">Min Value <span class="text-danger">*</span></label>
                            <input class="form-control @error("min_value") is-invalid @enderror" type="number" id="min_value" name="min_value" value="{{ old('min_value', $coupon->min_value) }}" required />
                            @error("min_value")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="col">
                            <label class="form-label" for="max_value">Max Value <span class="text-danger">*</span></label>
                            <input class="form-control @error("max_value") is-invalid @enderror" type="number" id="max_value" name="max_value" value="{{ old('max_value', $coupon->max_value) }}" required />
                            @error("max_value")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row mb-3 hideable-free-shipping">
                        <div class="col">
                            <label class="form-label" for="discount">Discount <span class="text-danger">*</span></label>
                            <input class="form-control @error("discount") is-invalid @enderror" type="number" id="discount" name="discount" value="{{ old('discount', $coupon->discount) }}" required />
                            @error("discount")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                        <div class="col">
                            <label class="form-label" for="discount_type">Discount Type <span class="text-danger">*</span></label>
                            <select class="form-select @error("discount_type") is-invalid @enderror" id="discount_type" name="discount_type" required>
                                @foreach(App\Enums\CouponDiscountType::getValues() as $key => $value)
                                    <option class="text-capitalize" value="{{ $value }}" {{ old('discount_type', $coupon->discount_type) == $key ? 'selected' : '' }}>{{ $value }}</option>
                                @endforeach
                            </select>
                            @error("discount_type")
                            <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row mb-3">
                        <div class="col">
                            <button type="submit" class="btn btn-primary" onclick="loadingBtn(this)">Submit</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('script')
    <script>
    function generateCouponCode(length) {
        const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
        let couponCode = '';
        for (let i = 0; i < length; i++) {
            couponCode += characters.charAt(Math.floor(Math.random() * characters.length));
        }
        document.getElementById('code').value = couponCode;
    }
    </script>

    @if((bool)$coupon->is_free_shipping) === true)
    <script>
        document.querySelectorAll('.hideable-free-shipping').forEach(function(element) {
            element.classList.add('d-none');
        });
    </script>
    @else
        <script>
            document.querySelectorAll('.hideable-free-shipping').forEach(function(element) {
                element.classList.remove('d-none');
            });
        </script>
    @endif

    <script>
        document.getElementById('is_free_shipping').addEventListener('change', function() {
            if (this.checked) {
                document.getElementById('min_value').value = 0;
                document.getElementById('max_value').value = 0;
                document.getElementById('discount').value = 0;
                document.getElementById('discount_type').value = 'none';
                document.querySelectorAll('.hideable-free-shipping').forEach(function(element) {
                    element.classList.add('d-none');
                });

            } else {
                document.getElementById('min_value').value = "";
                document.getElementById('max_value').value = "";
                document.getElementById('discount').value = "";
                document.getElementById('discount_type').value = 'fixed';
                document.querySelectorAll('.hideable-free-shipping').forEach(function(element) {
                    element.classList.remove('d-none');
                });
            }
        });
    </script>
@endsection