@section('title', ($formTitle ?? ''))
<x-app-layout :assets="$assets ?? []">
    <div>        
        @if (isset($data))
            {!! Form::model($data, [
                'route' => ['products.update', $data],
                'method' => 'put',
                'enctype' => 'multipart/form-data',
            ]) !!}
        @else
            {!! Form::open([
                'route' => ['products.store'], 
                'method' => 'post', 
                'enctype' => 'multipart/form-data'
            ]) !!}
        @endif

        <div class="row">
            <div class="col-xl-12 col-lg-8">
                <div class="card">
                    <div class="card-header d-flex justify-content-between">
                        <div class="header-title">
                            <h4 class="card-title">{{ isset($data) ? 'Modifier le dépôt #' . $data->name : $formTitle }}</h4>
                        </div>
                        <div class="card-action">
                            <a href="{{ route('warehouses.index') }}" class="btn btn-sm btn-primary" role="button">
                                <svg width="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M13.4424 8.52905L9.95638 12.0001L13.4424 15.4711" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                                </svg>                                                       
                                Retour
                            </a>
                        </div>
                    </div>

                    <div class="card-body">
                        <div class="new-user-info">
                            <div class="row">
                                <div class="form-group col-md-6 @error("designation") is-invalid @enderror">
                                    <label class="form-label" for="designation">Désignation : <span class="text-danger">*</span></label>
                                    {{ Form::text('designation', old('designation'), [
                                        'class' => 'form-control', 
                                        'placeholder' => 'Entrer la désignation', 
                                        'id' => 'designation'
                                    ]) }}
                                    @error("designation")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="form-group col-md-6 @error("supplier_id") is-invalid @enderror">
                                    <label class="form-label" for="supplier_id">Fournisseur : <span class="text-danger">*</span></label>
                                    {{ Form::select('supplier_id', $suppliers, old('supplier_id'), [
                                        'class' => 'form-control select2-basic', 
                                        'placeholder' => 'Sélectionner le fournisseur', 
                                        'id' => 'supplier_id'
                                    ]) }}
                                    @error("supplier_id")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-md-6 @error("category_id") is-invalid @enderror">
                                    <label class="form-label" for="category_id">Famille : <span class="text-danger">*</span></label>
                                    {{ Form::select('category_id', $categories, old('category_id'), [
                                        'class' => 'form-control select2-basic', 
                                        'placeholder' => 'Sélectionner la famille', 
                                        'id' => 'category_id'
                                    ]) }}
                                    @error("category_id")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="form-group col-md-6 @error("metric") is-invalid @enderror">
                                    <label class="form-label" for="metric">Unité de mesure : <span class="text-danger">*</span></label>
                                    <select name="metric" id="metric" class="form-control select2-basic">
                                        <option value="" selected disabled>Entrer l'unité de mesure</option>
                                        @foreach($metrics as $key => $label)
                                            <option value="{{ $key }}" {{ old('metric', $data->metric ?? '') == $key ? 'selected' : '' }}>
                                                {{ $label }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error("metric")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-md-6 @error("price_1") is-invalid @enderror">
                                    <label class="form-label" for="price_1">prix (1) : <span class="text-danger">*</span></label>
                                    {{ Form::text('price_1', old('price_1'), [
                                        'class' => 'form-control', 
                                        'placeholder' => 'Entrer le prix (1)', 
                                        'id' => 'price_1'
                                    ]) }}
                                    @error("price_1")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="form-group col-md-6 @error("price_2") is-invalid @enderror">
                                    <label class="form-label" for="price_2">prix (2) : <span class="text-danger">*</span></label>
                                    {{ Form::text('price_2', old('price_2'), [
                                        'class' => 'form-control', 
                                        'placeholder' => 'Entrer le prix (2)', 
                                        'id' => 'price_2'
                                    ]) }}
                                    @error("price_2")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-md-6 @error("price_3") is-invalid @enderror">
                                    <label class="form-label" for="price_3">prix (3) : <span class="text-danger">*</span></label>
                                    {{ Form::text('price_3', old('price_3'), [
                                        'class' => 'form-control', 
                                        'placeholder' => 'Entrer le prix (1)', 
                                        'id' => 'price_3'
                                    ]) }}
                                    @error("price_3")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="form-group col-md-6 @error("price_4") is-invalid @enderror">
                                    <label class="form-label" for="price_4">prix (4) : <span class="text-danger">*</span></label>
                                    {{ Form::text('price_4', old('price_4'), [
                                        'class' => 'form-control', 
                                        'placeholder' => 'Entrer le prix (2)', 
                                        'id' => 'price_4'
                                    ]) }}
                                    @error("price_4")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-md-6 @error("type") is-invalid @enderror">
                                    <label class="form-label" for="type">Type : <span class="text-danger">*</span></label>
                                    {{ Form::select('type', isset($data) ? \App\Enums\ProductType::editLabels() : \App\Enums\ProductType::createLabels(), old('type', $data->type ?? \App\Enums\ProductType::WHOLESALE->value), [
                                        'class' => 'form-control select2-basic', 
                                        'id' => 'type'
                                    ]) }}
                                    @error("type")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                                <div class="form-group col-md-6 @error("min_stock") is-invalid @enderror">
                                    <label class="form-label" for="min_stock">Stock Minimum (Alerte) : <span class="text-danger">*</span></label>
                                    {{ Form::number('min_stock', old('min_stock', $data->min_stock ?? 10), [
                                        'class' => 'form-control', 
                                        'id' => 'min_stock'
                                    ]) }}
                                    @error("min_stock")
                                    <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>
                            <button type="submit" class="btn btn-primary">{{ isset($data) ? 'Sauvegarder' : 'Créer' }}</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {!! Form::close() !!}
    </div>

    @push('scripts')
        <script>
            $(document).ready(function() {
                // Initialize Select2
                $('.select2-basic').select2({
                    width: '100%',
                    allowClear: true
                });

                $('#type').select2({
                    width: '100%',
                    minimumResultsForSearch: Infinity
                });

                const typeSelect = $('#type');
                const metricSelect = $('#metric');
                // Store the "u" option so we can detach/attach it
                const unitOption = metricSelect.find('option[value="u"]').clone();

                function handleTypeChange() {
                    const selectedType = typeSelect.val();
                    
                    if (selectedType === 'piece') {
                        // Ensure "u" exists in the dropdown
                        if (metricSelect.find('option[value="u"]').length === 0) {
                            metricSelect.append(unitOption);
                        }
                        
                        // Lock to piece metric
                        metricSelect.val('u').trigger('change');
                        metricSelect.attr('disabled', true);
                    } else {
                        // Unlock for wholesale
                        metricSelect.attr('disabled', false);
                        
                        // Physically remove the "u" option so it can't be chosen
                        metricSelect.find('option[value="u"]').remove();
                        
                        // Force reset to placeholder if it was "u"
                        if (metricSelect.val() === 'u') {
                            metricSelect.val('').trigger('change');
                        }
                    }
                }

                // Run on load
                handleTypeChange();

                // Run on change
                typeSelect.on('change', handleTypeChange);

                // Re-enable before submit to ensure Laravel receives the value
                $('form').on('submit', function() {
                    metricSelect.attr('disabled', false);
                });
            });
        </script>
    @endpush
</x-app-layout>