@extends('layouts.admin')

@section('content')
<div class="container-fluid">
    <div class="card">
        <div class="card-header">
            <h4 class="card-title">Create New Discount</h4>
        </div>
        <div class="card-body">
            <form action="{{ route('admin.promotions.discounts.store') }}" method="POST">
                @csrf
                <div class="row">
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Discount Name</label>
                            <input type="text" name="name" class="form-control" required 
                                   value="{{ old('name') }}" placeholder="Enter discount name">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Discount Type</label>
                            <select name="type" class="form-select" required>
                                <option value="fixed" {{ old('type') == 'fixed' ? 'selected' : '' }}>Fixed Amount</option>
                                <option value="percentage" {{ old('type') == 'percentage' ? 'selected' : '' }}>Percentage</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Discount Value</label>
                            <input type="number" name="value" class="form-control" required 
                                   value="{{ old('value') }}" step="0.01">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Applies To</label>
                            <select name="applies_to" class="form-select" required id="appliesTo">
                                <option value="all">All Products</option>
                                <option value="category">Specific Category</option>
                                <option value="product">Specific Product</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6 d-none" id="categorySelect">
                        <div class="mb-3">
                            <label class="form-label">Select Category</label>
                            <select name="category_id" class="form-select">
                                @foreach($categories as $category)
                                    <option value="{{ $category->id }}">{{ $category->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6 d-none" id="productSelect">
                        <div class="mb-3">
                            <label class="form-label">Select Product</label>
                            <select name="product_id" class="form-select">
                                @foreach($products as $product)
                                    <option value="{{ $product->id }}">{{ $product->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Minimum Quantity</label>
                            <input type="number" name="minimum_qty" class="form-control" 
                                   value="{{ old('minimum_qty') }}">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Maximum Quantity</label>
                            <input type="number" name="maximum_qty" class="form-control" 
                                   value="{{ old('maximum_qty') }}">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">Start Date</label>
                            <input type="datetime-local" name="starts_at" class="form-control" 
                                   value="{{ old('starts_at') }}">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label">End Date</label>
                            <input type="datetime-local" name="expires_at" class="form-control" 
                                   value="{{ old('expires_at') }}">
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="mb-3">
                            <div class="form-check">
                                <input type="checkbox" name="status" class="form-check-input" 
                                       value="1" {{ old('status') ? 'checked' : '' }}>
                                <label class="form-check-label">Active</label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="text-end">
                    <a href="{{ route('admin.promotions.discounts.index') }}" class="btn btn-secondary">Cancel</a>
                    <button type="submit" class="btn btn-primary">Create Discount</button>
                </div>
            </form>
        </div>
    </div>
</div>

@push('scripts')
<script>
$(document).ready(function() {
    $('#appliesTo').on('change', function() {
        const value = $(this).val();
        $('#categorySelect, #productSelect').addClass('d-none');
        if (value === 'category') {
            $('#categorySelect').removeClass('d-none');
        } else if (value === 'product') {
            $('#productSelect').removeClass('d-none');
        }
    });
});
</script>
@endpush
@endsection