@extends('admin.layouts.base')
@section('title', 'Create Warehouse')

@section('content')
<div id="kt_app_content_container" class="app-container">
    <div class="card">
        <div class="card-header">
            <h3 class="card-title fw-bold">Create New Warehouse</h3>
            <div class="card-toolbar">
                <a href="{{ route('admin.warehouses.index') }}" class="btn btn-sm btn-light">
                    <i class="ki-duotone ki-arrow-left fs-5"><span class="path1"></span><span class="path2"></span></i>
                    Back to List
                </a>
            </div>
        </div>

        <form action="{{ route('admin.warehouses.store') }}" method="POST">
            @csrf
            <div class="card-body">
                <div class="row mb-6">
                    <div class="col-md-6">
                        <label class="form-label required">Warehouse Name</label>
                        <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" value="{{ old('name') }}" required>
                        @error('name')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-6">
                        <label class="form-label required">Warehouse Code</label>
                        <input type="text" name="code" class="form-control @error('code') is-invalid @enderror" value="{{ old('code') }}" placeholder="e.g., WH-001" required>
                        @error('code')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                        <div class="form-text">Unique identifier for this warehouse</div>
                    </div>
                </div>

                <div class="mb-6">
                    <label class="form-label required">Address</label>
                    <textarea name="address" rows="3" class="form-control @error('address') is-invalid @enderror" required>{{ old('address') }}</textarea>
                    @error('address')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <div class="row mb-6">
                    <div class="col-md-6">
                        <label class="form-label required">City</label>
                        <input type="text" name="city" class="form-control @error('city') is-invalid @enderror" value="{{ old('city') }}" required>
                        @error('city')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Zone</label>
                        <input type="text" name="zone" class="form-control @error('zone') is-invalid @enderror" value="{{ old('zone') }}" placeholder="e.g., North, South">
                        @error('zone')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>



                <div class="separator my-8"></div>

                <h4 class="fw-bold mb-5">Storage & Products</h4>

                <div class="row mb-6">
                    <div class="col-md-6">
                        <label class="form-label mb-3">Supported Storage Types</label>
                        <div class="row g-3">
                            @foreach($storageTypes as $type)
                            <div class="col-md-6">
                                <div class="form-check form-check-custom form-check-solid">
                                    <input class="form-check-input" type="checkbox" name="storage_types[]" value="{{ $type->id }}" id="storage_type_{{ $type->id }}" {{ in_array($type->id, old('storage_types', [])) ? 'checked' : '' }}/>
                                    <label class="form-check-label" for="storage_type_{{ $type->id }}">
                                        {{ $type->name }}
                                    </label>
                                </div>
                            </div>
                            @endforeach
                        </div>
                        @error('storage_types')
                            <div class="text-danger mt-2 small">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-6">
                        <label class="form-label mb-3">Supported Product Categories</label>
                        <div class="row g-3">
                            @foreach($productCategories as $category)
                            <div class="col-md-6">
                                <div class="form-check form-check-custom form-check-solid">
                                    <input class="form-check-input" type="checkbox" name="product_categories[]" value="{{ $category->id }}" id="product_category_{{ $category->id }}" {{ in_array($category->id, old('product_categories', [])) ? 'checked' : '' }}/>
                                    <label class="form-check-label" for="product_category_{{ $category->id }}">
                                        {{ $category->name }}
                                    </label>
                                </div>
                            </div>
                            @endforeach
                        </div>
                        @error('product_categories')
                            <div class="text-danger mt-2 small">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                        @error('product_categories')
                            <div class="text-danger mt-2 small">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="separator my-8"></div>

                <h4 class="fw-bold mb-5">Additional Services</h4>
                <div class="table-responsive">
                    <table class="table table-row-dashed table-row-gray-300 align-middle gs-0 gy-4">
                        <thead>
                            <tr class="fw-bold text-muted">
                                <th class="w-25px">
                                    <div class="form-check form-check-sm form-check-custom form-check-solid">
                                        <input class="form-check-input" type="checkbox" id="select_all_services" />
                                    </div>
                                </th>
                                <th class="min-w-150px">Service Name</th>
                                <th class="min-w-100px">Price Type</th>
                                <th class="min-w-100px">Base Price</th>
                                <th class="min-w-150px">Custom Price (Optional)</th>
                            </tr>
                        </thead>
                        <tbody> 
                            @foreach($additionalServices as $service)
                            <tr>
                                <td>
                                    <div class="form-check form-check-sm form-check-custom form-check-solid">
                                        <input class="form-check-input service-checkbox" type="checkbox" 
                                            name="additional_services[{{ $service->id }}][enabled]" 
                                            value="1" 
                                            data-service-id="{{ $service->id }}"
                                            {{ old("additional_services.{$service->id}.enabled") ? 'checked' : '' }} />
                                    </div>
                                </td>
                                <td>
                                    <div class="d-flex align-items-center">
                                        <div class="d-flex justify-content-start flex-column">
                                            <span class="text-gray-800 fw-bold text-hover-primary mb-1 fs-6">{{ $service->name }}</span>
                                            <span class="text-gray-400 fw-semibold d-block fs-7">{{ Str::limit($service->description, 50) }}</span>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <span class="badge badge-light-primary">{{ ucfirst(str_replace('_', ' ', $service->price_type)) }}</span>
                                    <input type="hidden" name="additional_services[{{ $service->id }}][price_type]" value="{{ $service->price_type }}">
                                </td>
                                <td>
                                    <span class="text-gray-800 fw-bold">${{ number_format($service->base_price, 2) }}</span>
                                    @if($service->unit_label)
                                        <span class="text-gray-400 fs-7">/ {{ $service->unit_label }}</span>
                                    @endif
                                </td>
                                <td>
                                    <div class="input-group input-group-sm input-group-solid">
                                        <span class="input-group-text">$</span>
                                        <input type="number" step="0.01" class="form-control service-price-input" 
                                            name="additional_services[{{ $service->id }}][price]" 
                                            value="{{ old("additional_services.{$service->id}.price", $service->base_price) }}" 
                                            {{ old("additional_services.{$service->id}.enabled") ? '' : 'disabled' }} />
                                    </div>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <div class="separator my-8"></div>

                <h4 class="fw-bold mb-5">Pricing & Capacity Configuration</h4>

                <div class="row mb-6">
                    <div class="col-md-4">
                        <label class="form-label required">Total Square Feet</label>
                        <input type="number" name="total_sqft" class="form-control @error('total_sqft') is-invalid @enderror" value="{{ old('total_sqft') }}" required min="1">
                        @error('total_sqft')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-4">
                        <label class="form-label required">Price Per SQFT ($)</label>
                        <input type="number" step="0.0001" name="sqft_price_per_unit" class="form-control @error('sqft_price_per_unit') is-invalid @enderror" value="{{ old('sqft_price_per_unit') }}" required min="0">
                        @error('sqft_price_per_unit')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-4">
                        <label class="form-label required">Activity Space (%)</label>
                        <input type="number" step="0.01" name="activity_space_percentage" class="form-control @error('activity_space_percentage') is-invalid @enderror" value="{{ old('activity_space_percentage', 15) }}" required min="0" max="100">
                        <div class="form-text">Extra space added for movement (default 15%)</div>
                        @error('activity_space_percentage')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="row mb-6">
                    <div class="col-md-4">
                        <label class="form-label required">Max Pallet Height (inches)</label>
                        <input type="number" name="pallet_max_height" class="form-control @error('pallet_max_height') is-invalid @enderror" value="{{ old('pallet_max_height', 60) }}" required min="1">
                        @error('pallet_max_height')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-4">
                        <label class="form-label required">Maximum Rentable SQFT</label>
                        <input type="number" name="maximum_rentable_sqft" class="form-control @error('maximum_rentable_sqft') is-invalid @enderror" value="{{ old('maximum_rentable_sqft') }}" required min="1">
                        <div class="form-text">Maximum space available for rental (prevents overbooking)</div>
                        @error('maximum_rentable_sqft')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="mb-6">
                    <label class="form-label">Status</label>
                    <div class="form-check form-switch form-check-custom form-check-solid">
                        <input class="form-check-input" type="checkbox" name="is_active" value="1" id="is_active" {{ old('is_active', true) ? 'checked' : '' }}>
                        <label class="form-check-label" for="is_active">
                            Active
                        </label>
                    </div>
                </div>
            </div>

            <div class="card-footer d-flex justify-content-end py-6">
                <a href="{{ route('admin.warehouses.index') }}" class="btn btn-light me-3">Cancel</a>
                <button type="submit" class="btn btn-primary">
                    <i class="ki-duotone ki-check fs-2"></i>
                    Create Warehouse
                </button>
            </div>
        </form>
    </div>
</div>
@endsection

@push('scripts')
<script>
    $(document).ready(function() {
        // Handle individual service checkbox
        $('.service-checkbox').on('change', function() {
            const serviceId = $(this).data('service-id');
            const priceInput = $(`input[name="additional_services[${serviceId}][price]"]`);
            
            if ($(this).is(':checked')) {
                priceInput.prop('disabled', false);
            } else {
                priceInput.prop('disabled', true);
            }
        });

        // Handle select all
        $('#select_all_services').on('change', function() {
            const isChecked = $(this).is(':checked');
            $('.service-checkbox').prop('checked', isChecked).trigger('change');
        });
    });
</script>
@endpush