@extends('tenant.warehouses.warehouses-tabs')

@section('breadcrumb')
    @include('tenant.layouts.breadcrumb', [
        'items' => [
            __('breadcrumb.warehouses') => '/warehouses/branches',
            __('breadcrumb.price_offers') => '#',
        ],
    ])
@endsection

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

@section('content-field')
    <div>
        @can('representatives')
            <div class="d-flex justify-content-end align-items-center">
                <div class="btn-group" role="group" aria-label="categories or items tab" dir="ltr">

                    <button type="button" class="btn toggle-view-btn {{ $view == 'representatives' ? 'active-btn' : '' }}"
                        data-view="representatives">
                        @lang('general.representatives')
                    </button>
                    <button type="button" class="btn toggle-view-btn {{ $view == 'normal' ? 'active-btn' : '' }}"
                        data-view="normal">
                        @lang('general.employees')
                    </button>
                </div>
            </div>
        @endcan

        <div class="normal-view" style="display: {{ $view == 'normal' ? 'block' : 'none' }}">
            @php
                $data_normal = [
                    'sales_price_offers' => $sales_price_offers_normal,
                    'clients' => $clients,
                    'branches' => $branches,
                    'print_data' => Session::get('print_data'),
                    'active_year' => $active_year,
                    'is_deletable' => json_decode(Session::get('deletable_bonds'))->warehouses->salesPriceOffers,
                ];
            @endphp

            <sales-price-offers data="{{ json_encode($data_normal) }}">
            </sales-price-offers>
        </div>

        @can('representatives')
            <div class="representatives-view" style="display: {{ $view == 'representatives' ? 'block' : 'none' }}">
                @php
                    $data_representative = [
                        'sales_price_offers' => $sales_price_offers_representative,
                        'clients' => $clients,
                        'branches' => $branches,
                        'print_data' => Session::get('print_data'),
                        'active_year' => $active_year,
                        'is_deletable' => json_decode(Session::get('deletable_bonds'))->warehouses->salesPriceOffers,
                    ];
                @endphp

                <sales-price-offers data="{{ json_encode($data_representative) }}">
                </sales-price-offers>
            </div>
        @endcan
    </div>
@endsection

@push('prepend-script')
    <script src="{{ asset('js/libraries/mixitup.min.js') }}"></script>
@endpush

@push('script')
    @scriptag('build/js/vue-components/sales-invoices.js')
@endpush

@prepend('script')
    <script type="module">
        import printSection from '/tenancy/assets/js/print.js';
        $('body').on('click', '.print-table-view-btn', function() {
            let target;
            let title = "عروض الاسعار";

            if ($(".normal-view").is(":visible")) {
                target = $('.normal-view').find('#printable-offers-table').clone();
            } else {
                target = $('.representatives-view').find('#printable-offers-table').clone();
            }
            const print_data = @json(Session::get('print_data'));
            printSection.print(target, print_data, title, null, true);
        });

        $('body').on('click', '.toggle-view-btn', function() {
            const view = $(this).attr("data-view");
            $(this).addClass("active-btn");
            $(".toggle-view-btn")
                .not(this)
                .removeClass("active-btn");

            if (view == "normal") {
                $(".normal-view").show();
                $(".representatives-view").hide();
                window.history.pushState(null, null, "?view=normal");
            } else {
                $(".normal-view").hide();
                $(".representatives-view").show();
                window.history.pushState(null, null, "?view=representatives");
            }
        });
    </script>
@endprepend