@extends('modules.head') @section('contenido')
    @php($disabledOnEdit = '')
    @if (request()->is('*/edit'))
        @php($disabledOnEdit = 'disabled')
    @endif
    <h3>
        <a href="{{ route('bin_locations.index') }}">Bin Locations</a>
    </h3>

    <section>
        <div class="box">



            <div class="box-body invoice boxEdit">

                <div class="row">

                    <div class="col-md-4 form-group">
                        <label for="bin_code">Bin Location Code</label>
                        <input type="text" id="bin_code" class="form-control" name="bin_code" disabled value="{{ $binLocation?->bin_code }}">
                    </div>
                </div>

                <div class="row">

                    <div class="col-md-4 form-group">
                        <label for="warehouse_code">Warehouse</label>
                        <select id="warehouse_code" class="form-control" name="warehouse_code" {{ $disabledOnEdit }}>
                            <option value="">-- To select --</option>
                            @foreach ($warehouses as $warehouse)
                                <option value="{{ $warehouse->code }}" {{ $binLocation?->warehouse->code == $warehouse->code ? 'selected' : '' }}>
                                    {{ $warehouse->code }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-4 form-group">
                        <label for="description">Description</label>
                        <input type="text" id="description" class="form-control" name="description" {{ $disabledOnEdit }} value="{{ $binLocation?->description }}">
                    </div>

                </div>


                <div class="row" {{ $disabledOnEdit ? 'style=display:none' : '' }}>

                    <div class="col-md-2 form-group">
                        <label for="aisle">Aisle</label>
                        <select id="aisle" class="form-control" name="aisle">
                            <option value="">-- To select --</option>
                            @foreach ($aisles as $aisle)
                                <option value="{{ $aisle->code }}">
                                    {{ $aisle->code }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-2 form-group">
                        <label for="section">Section</label>
                        <select id="section" class="form-control" name="section">
                            <option value="">-- To select --</option>
                            @foreach ($sections as $section)
                                <option value="{{ $section->code }}">
                                    {{ $section->code }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-2 form-group">
                        <label for="shelf">Shelf</label>
                        <select id="shelf" class="form-control" name="shelf">
                            <option value="">-- To select --</option>
                            @foreach ($shelves as $shelf)
                                <option value="{{ $shelf->code }}">
                                    {{ $shelf->code }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-2 form-group">
                        <label for="position">Position</label>
                        <select id="position" class="form-control" name="position">
                            <option value="">-- To select --</option>
                            @foreach ($positions as $position)
                                <option value="{{ $position->code }}">
                                    {{ $position->code }}
                                </option>
                            @endforeach
                        </select>
                    </div>


                </div>

                <div class="row">

                    <div class="col-md-4 form-group">
                        <label for="bin_location_restriction_type">Type Restriction</label>
                        <select id="bin_location_restriction_type" class="form-control"
                            name="bin_location_restriction_type" {{ $disabledOnEdit }}>
                            <option value="">-- To select --</option>
                            @foreach ($binLocationRestrictionTypes as $binLocationRestrictionType)
                                <option value="{{ $binLocationRestrictionType->restricted_trans_type }}" {{ $binLocation?->boBinLocationType?->restricted_trans_type == $binLocationRestrictionType->restricted_trans_type ? 'selected' : '' }}>
                                    {{ $binLocationRestrictionType->description }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-4 form-group" style="display: none;">
                        <label for="restriction_reason">Restriction Reason</label>
                        <input type="text" id="restriction_reason" class="form-control" name="restriction_reason" {{ $disabledOnEdit }} value="{{ $binLocation?->restriction_reason }}">
                    </div>
                </div>

                <div class="row">

                    <div class="col-md-2 form-group">
                        <label for="minimum_qty">Minimum Quantity</label>
                        <input type="number" id="minimum_qty" class="form-control" name="minimum_qty" {{ $disabledOnEdit }} value="{{ $binLocation?->minimum_qty }}">
                    </div>

                    <div class="col-md-2 form-group">
                        <label for="maximum_qty">Maximum Quantity</label>
                        <input type="number" id="maximum_qty" class="form-control" name="maximum_qty" {{ $disabledOnEdit }} value="{{ $binLocation?->maximum_qty }}">
                    </div>

                </div>

                <div class="row">
                    <div class="col-md-4 form-group">
                        <br />
                        <input type="checkbox" id="receiving_bin_location" name="receiving_bin_location" {{ $disabledOnEdit }} {{ $binLocation?->receive_bin ? 'checked' : '' }}>
                        <label for="receiving_bin_location">Receiving Bin Location</label>
                    </div>  
                </div>

                <div class="row" {{ $disabledOnEdit ? 'style=display:none' : '' }}>
                    <div class="col-md-12 form-group">
                        <button class="btn btn-primary pull-right btnbox" id="save-bin-location" >Create</button>
                    </div>
                </div>

            </div>
        </div>
    </section>
@endsection

<script src="{{ asset('js/jQuery/jquery-2.2.3.min.js') }}"></script>
<script src="{{ asset('js/bootstrap/js/bootstrap.min.js') }}"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="{{ asset('js/ajax.js') }}"></script>


<script>
    $(document).ready(function() {

        $('#save-bin-location').click(function(e) {

            const isValidForm = validateBinLocationForm();
            const el = $(this);

            if (!isValidForm) {
                return;
            }

            swal({
                title: 'Are you sure?',
                text: "Do you want to create this bin location?",
                icon: 'warning',
                buttons: {
                    cancel: true,
                    confirm: true
                }
            }).then((result) => {
                if (result) {
                    submitBinLocation(el);
                }
            });
        });

        $('#bin_location_restriction_type').change(function() {
            const element = $(this);
            const restrictionReason = $('#restriction_reason');
            const restrictionReasonContainer = restrictionReason.parent();

            if (element.val() == '' || element.val() == 'brtNoRestrictions') {
                restrictionReason.val('');
                restrictionReasonContainer.hide();
            } else {
                restrictionReasonContainer.show();
            }
        }).trigger('change');

        // Handle changes to warehouse, aisle, section, shelf and position fields
        $('#warehouse_id, #aisle, #section, #shelf, #position').change(function() {
            const warehouse = $('#warehouse_id').val();
            const aisle = $('#aisle').val();
            const section = $('#section').val();
            const shelf = $('#shelf').val();
            const position = $('#position').val();
            let binCode = [warehouse, aisle, section, shelf, position].filter(Boolean).join('');
            $('#bin_code').val(binCode);
        });

        function submitBinLocation(el) {
            const element = $(el);
            const data = getFormData();
            element.button('loading');
            postRequest('{{ route('bin_locations.store') }}', data, function(response) {
                    if (response.result) {
                        swal({
                            icon: 'success',
                            title: 'Bin Location Successfully Created'
                        }).then(() => {
                            window.location.href = '{{ route('bin_locations.index') }}';
                        });
                    } else {
                        swal({
                            icon: 'error',
                            title: 'Error Creating Bin Location',
                            text: response.message
                        });
                    }
                },
                function() {
                    element.button('reset');
                }
            );

        }

        function validateBinLocationForm() {

            // Get form values
            const data = getFormData();

            // Validation flags
            let isValid = true;
            let errorMessage = '';

            // Validate warehouse
            if (!data.warehouse_code) {
                isValid = false;
                errorMessage += 'Please select a warehouse\n';
            }

            // Validate aisle
            if (!data.aisle) {
                isValid = false;
                errorMessage += 'Please select an aisle\n';
            }

            // Validate section
            if (!data.section) {
                isValid = false;
                errorMessage += 'Please select a section\n';
            }

            // Validate shelf
            if (!data.shelf) {
                isValid = false;
                errorMessage += 'Please select a shelf\n';
            }

            // Validate position
            if (!data.position) {
                isValid = false;
                errorMessage += 'Please select a position\n';
            }

            // Validate restriction type
            if (!data.restriction_type) {
                isValid = false;
                errorMessage += 'Please select a restriction type\n';
            }

            // Validate minimum quantity
            if (!data.minimum_qty) {
                isValid = false;
                errorMessage += 'Minimum quantity is required\n';
            } else if (data.minimum_qty < 0) {
                isValid = false; 
                errorMessage += 'Minimum quantity cannot be negative\n';
            }

            // Validate maximum quantity
            if (!data.maximum_qty) {
                isValid = false;
                errorMessage += 'Maximum quantity is required\n';
            } else if (data.maximum_qty < 0) {
                isValid = false;
                errorMessage += 'Maximum quantity cannot be negative\n';
            }


            // Validate restriction reason if restriction type is selected
            if (data.restriction_type && data.restriction_type !== 'brtNoRestrictions' && !data
                .restriction_reason) {
                isValid = false;
                errorMessage += 'Please provide a restriction reason\n';
            }

            if (!isValid) {
                swal({
                    icon: 'info',
                    title: 'Validation Error',
                    text: errorMessage,
                });
            }

            return isValid;

        }


        function getFormData() {
            const warehouseCode = $('#warehouse_code').val();
            const aisle = $('#aisle').val();
            const section = $('#section').val();
            const shelf = $('#shelf').val();
            const position = $('#position').val();
            const description = $('#description').val();
            const restrictionType = $('#bin_location_restriction_type').val();
            const restrictionReason = $('#restriction_reason').val();
            const receivingBinLocation = $('#receiving_bin_location').is(':checked');
            const minimumQty = $('#minimum_qty').val();
            const maximumQty = $('#maximum_qty').val();

            return {
                warehouse_code: warehouseCode,
                aisle: aisle,
                section: section,
                shelf: shelf,
                position: position,
                description: description,
                restriction_type: restrictionType,
                restriction_reason: restrictionReason,
                receiving_bin_location: receivingBinLocation,
                minimum_qty: minimumQty,
                maximum_qty: maximumQty
            };
        }

    });
</script>