@extends('tenant.settings.warehouses.warehouses-settings-tabs')
@section('breadcrumb')
    @include('tenant.layouts.breadcrumb', [
        'items' => [
            __('breadcrumb.warehouse_settings') => route('tenant.settings.warehouses.bonds.index'),
            __('breadcrumb.quotation_terms') => '#',
        ],
    ])
@endsection

@section('sidebar')
    @include('tenant.layouts.sidebar', [
        'activeItem' => 'settings.warehouses.sales-price_offers-conditions',
    ])
@endsection

@section('warehouses-settings-content')
    <div class="inner-content-layout form-bg-color p-4 rounded-form">
        <form action="{{ route('tenant.settings.warehouses.sales-price-offers-conditions.save') }}" method="post"
            id="salesPriceOffersForm">
            @csrf

            <div>
                <h4>@lang('settings/warehouses/sales-price_offers-conditions/index.arabic_offer_request_terms')</h4>

                <table class="table table-bprice_offersed table-striped without-herotable">
                    <thead>
                        <tr>
                            <th class="md-td">#</th>
                            <th class="lg-td">@lang('settings/warehouses/sales-price_offers-conditions/index.term')</th>
                            <th class="sm-td">@lang('general.procedures')</th>
                        </tr>
                    </thead>

                    <tbody>
                        @forelse ($ar_sales_price_offers_conditions as $sales_price_offers_condition)
                            <tr>
                                <td class="md-td">{{ $loop->iteration }}</td>
                                <td class="md-td">
                                    <input type="text" class="form-control" name="ar_sales_price_offers_conditions[]"
                                        value="{{ $sales_price_offers_condition }}" required>
                                </td>
                                <td class="sm-td">
                                    <button class="btn btn-outline-danger rounded-pill delete-condition-btn" title="{{__('general.delete')}}">
                                        <i class="fas fa-trash-alt"></i> @lang('general.delete')
                                    </button>
                                </td>
                            </tr>.
                        @empty
                            <tr>
                                <td colspan="100%">
                                    @lang('settings/warehouses/sales-price_offers-conditions/index.no_conditions_yet')
                                </td>
                            </tr>
                        @endforelse
                    </tbody>

                    <tfoot>
                        <tr>
                            <td colspan="100%">
                                <button type="button" class="btn orange-btn add-ar-condition-btn">
                                    @lang('settings/warehouses/sales-price_offers-conditions/index.add_new_term')
                                </button>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>

            <div class="mt-5">
                <h4> @lang('settings/warehouses/sales-price_offers-conditions/index.english_offer_request_terms')</h4>

                <table class="table table-bprice_offersed table-striped without-herotable">
                    <thead>
                        <tr>
                            <th class="md-td">#</th>
                            <th class="lg-td"> @lang('settings/warehouses/sales-price_offers-conditions/index.term')</th>
                            <th class="sm-td">@lang('general.procedures')</th>
                        </tr>
                    </thead>

                    <tbody>
                        @forelse ($en_sales_price_offers_conditions as $sales_price_offers_condition)
                            <tr>
                                <td class="md-td">{{ $loop->iteration }}</td>
                                <td class="md-td">
                                    <input type="text" class="form-control" name="en_sales_price_offers_conditions[]"
                                        value="{{ $sales_price_offers_condition }}" required>
                                </td>
                                <td class="sm-td">
                                    <button class="btn btn-outline-danger rounded-pill delete-condition-btn" title="{{__('general.delete')}}">
                                        <i class="fas fa-trash-alt"></i> @lang('general.delete')
                                    </button>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="100%">
                                    @lang('settings/warehouses/sales-price_offers-conditions/index.no_conditions_yet')
                                </td>
                            </tr>
                        @endforelse
                    </tbody>

                    <tfoot>
                        <tr>
                            <td colspan="100%">
                                <button type="button" class="btn orange-btn add-en-condition-btn">
                                    @lang('settings/warehouses/sales-price_offers-conditions/index.add_new_term')
                                </button>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>

            <div class="text-center">
                <button class="btn orange-btn">@lang('general.save')</button>
            </div>
        </form>
    </div>
@endsection

@push('script')
    <script type="module">
        import {
            confirmAndSubmit
        } from '/tenancy/assets/js/helpers.js';

        $(() => {
            $('#salesPriceOffersForm').on('submit', function(e) {
                e.preventDefault();
                confirmAndSubmit('salesPriceOffersForm', {
                    type: 'green'
                });
            });

            $('body').on('click', '.delete-condition-btn', function() {
                const tbody = $(this).closest('table').find('tbody');
                $(this).closest('tr').remove();
                tbody.find('tr').map((index, tr) => {
                    $(tr).find('td').first().text(index + 1);
                });
            });

            $('body').on('click', '.add-ar-condition-btn', function() {
                const tbody = $(this).closest('table').find('tbody');
                const current_items_count = tbody.find('tr').length;
                tbody.append(buildConditionItem("ar", current_items_count));
            });

            $('body').on('click', '.add-en-condition-btn', function() {
                const tbody = $(this).closest('table').find('tbody');
                const current_items_count = tbody.find('tr').length;
                tbody.append(buildConditionItem("en", current_items_count));
            });

            function buildConditionItem(lang, current_items_count) {
                const newItem = `<tr>
                <td class="md-td">${current_items_count + 1}</td>
                <td class="md-td">
                    <input type="text" class="form-control" name="${lang}_sales_price_offers_conditions[]" value="" required>
                </td>
                <td class="sm-td">
                    <button class="btn btn-outline-danger rounded-pill delete-condition-btn" title="حذف">
                        <i class="fas fa-trash-alt"></i> حذف
                    </button>
                </td>
            </tr>`;

                return newItem;
            }
        });
    </script>
@endpush