@php use App\Models\Shipping\ShippingMethod; @endphp
@php /** @var ShippingMethod $shippingMethod */  @endphp

<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <h4 class="header-title">{{ $shippingMethod->title }} tariffs</h4>
                <p class="text-muted font-14 mb-4">
                    This section allows you to manage the tariffs for {{ $shippingMethod->title }}. You can change
                    prices, enable or disable countries for delivery, and set the status to "inactive" for countries you
                    want to exclude from delivery. Please make the necessary changes below:
                </p>

                @php
                    $boxes = $shippingMethod->shippingBoxes->groupBy(['pivot.shipping_box_id', 'pivot.zone', 'pivot.country_id']);
                @endphp

                @foreach($boxes as $boxID => $box)
                    <table class="table tariff-table mb-4">
                        <thead>
                        <tr>
                            <th colspan="{{ $box->first()->first()->count() + 1 }}">
                                Box: {{ $shippingBoxes->where('id', $boxID)->first()->label }}
                            </th>
                        </tr>
                        </thead>

                        <tbody>

                        @foreach($box as $zoneID => $boxZones)
                            <tr class="mb-2 mt-2">
                                <td colspan="{{ $box->first()->count() + 1 }}">
                                    <b>Zone: {{ $zoneID }}</b>
                                </td>
                            </tr>

                            <tr>
                                <td class="sizes">Country</td>
                                @foreach($boxZones->first() as $boxCountries)
                                    <td class="sizes">
                                        {{ $boxCountries->pivot->weight_from }} - {{ $boxCountries->pivot->weight_to }}
                                        (kg)
                                    </td>
                                @endforeach
                            </tr>
                            @foreach($boxZones as $countryID => $boxCountries)
                                <tr>
                                    <td>{{ $countries->where('id', $countryID)->first()->title }}</td>

                                    @foreach($boxCountries as $key => $tariff)
                                        <td>
                                            <div class="d-flex tariff-control-container">
                                                <input type="text"
                                                       class="form-control form-control-sm tariff-price-input"
                                                       placeholder="Price"
                                                       name="tariffs[{{ $tariff->pivot->id }}][price]"
                                                       data-id="{{ $tariff->pivot->id }}"
                                                       value="{{ old('tariffs.' . $tariff->pivot->id . '.price', $tariff->pivot->price) }}"
                                                       step="0.01"
                                                >
                                                <div class="ml-2 custom-control custom-switch">
                                                    <input type="hidden"
                                                           name="tariffs[{{ $tariff->pivot->id }}][is_active]"
                                                           value="0"
                                                    >
                                                    <input type="checkbox"
                                                           class="custom-control-input tariff-checkbox"
                                                           name="tariffs[{{ $tariff->pivot->id }}][is_active]"
                                                           data-id="{{ $tariff->pivot->id }}"
                                                           id="{{ $countryID .'_' .$key . '_' . $tariff->pivot->id }}"
                                                            {{ old('tariffs.' . $tariff->pivot->id . '.is_active', $tariff->pivot->is_active) ? 'checked' : '' }}
                                                    >
                                                    <label class="custom-control-label"
                                                           for="{{ $countryID .'_' .$key . '_' . $tariff->pivot->id }}"
                                                           title="Off/On"
                                                    ></label>
                                                </div>
                                            </div>
                                        </td>
                                    @endforeach
                                </tr>
                            @endforeach
                        @endforeach
                        </tbody>
                    </table>
                @endforeach
            </div>
        </div>
    </div>
</div>

@push('script')
    <script>
        $(() => {
            $('.tariff-price-input').on('blur', function () {
                axios.put('/admin/api/shipping-tariff/' + $(this).data('id') + '/package', {
                    'price': parseFloat($(this).val()),
                }).catch((error) => {
                    window.toastr.error(error.response.data.message);
                });
            });
            $('.tariff-checkbox').change(function () {
                axios.put('/admin/api/shipping-tariff/' + $(this).data('id') + '/package', {
                    'is_active': this.checked,
                }).catch((error) => {
                    window.toastr.error(error.response.data.message);
                });
            });
        });
    </script>
@endpush