@extends('tenant.pos.pos-tabs')
@php
    $activeTab = 'offers';
@endphp
@section('breadcrumb')
    @include('tenant.layouts.breadcrumb', [
        'items' => [
            __('breadcrumb.point_of_sale') => '#',
            __('breadcrumb.offers') => '#',
        ],
    ])
@endsection

@section('sidebar')
    @include('tenant.layouts.sidebar', ['activeItem' => 'pos.offers'])
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('css/libraries/jstree/default/style.min.css') }}">
    <link rel="stylesheet" href="{{ asset('css/layouts/custom-tabs.css')}}">
@endsection

@section('content-field')
    <div>
        <div class="d-flex justify-content-between my-1">
            <h4>@lang('pos/offers/index.offers') </h4>

            <div>
                @can('pos-offers-add')
                    <a href="{{ route('tenant.pos.offers.create') }}" class="btn btn-sm orange-btn add-root-menu-btn">
                        <i class="fas fa-plus-circle"></i> @lang('pos/offers/index.add_new_offer')
                    </a>
                @endcan
            </div>
        </div>

        <div>
            <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>@lang('pos/offers/index.address')</th>
                        <th> @lang('pos/offers/index.offer_type')</th>
                        <th>@lang('pos/offers/index.from_date') </th>
                        <th> @lang('pos/offers/index.until_date')</th>
                        <th> @lang('pos/offers/index.offer_method')</th>
                        <th> @lang('pos/offers/index.status')</th>
                        <th> @lang('general.procedures')</th>
                    </tr>
                </thead>

                <tbody>
                    @forelse ($offers as $offer)
                        <tr>
                            <td>{{ $loop->iteration }}</td>
                            <td>{{ $offer->title }}</td>
                            <td>{{ $offer->type_as_ar }}</td>
                            <td>{{ $offer->from_date }}</td>
                            <td>{{ $offer->is_forever ? 'دائم' : $offer->to_date }}</td>
                            <td>{{ $offer->offer_way_as_ar }}</td>
                            <td>
                                <span class="status-badge {{ $offer->status ? 'green' : 'red' }}-status">
                                    {{ $offer->status_as_ar }}
                                </span>
                            </td>
                            <td>
                                <x-operations-btn>
                                    @can('pos-offers-edit')
                                        <li>
                                            <a href="{{ route('tenant.pos.offers.edit', ['offer' => $offer->id]) }}"
                                                class="btn">
                                                <i class="fas fa-edit"></i> @lang('general.edit')
                                            </a>
                                        </li>
                                    @endcan

                                    @can('pos-offers-delete')
                                        <li>
                                            <form action="{{ route('tenant.pos.offers.destroy', ['offer' => $offer->id]) }}"
                                                method="post">
                                                @csrf
                                                @method('delete')

                                                <button type="button" class="btn confirm-delete-btn">
                                                    <i class="fas fa-trash-alt"></i> @lang('general.delete')
                                                </button>
                                            </form>
                                        </li>
                                    @endcan
                                </x-operations-btn>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="100%"> @lang('pos/offers/index.no_offers_yet')</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
@endsection

@push('script')
    <script>
        $(() => {
            const addOfferPermission = "{{ Auth::user()->hasPermissionTo('pos-offers-add') }}";
            const editOfferPermission = "{{ Auth::user()->hasPermissionTo('pos-offers-edit') }}"
            const deleteOfferPermission = "{{ Auth::user()->hasPermissionTo('pos-offers-delete') }}";

            $(".confirm-delete-btn").click(function(e) {
                $.confirm({
                    title: $lang('pos.offers.index.confirm_delete_offer'),
                    content: $lang('pos.offers.index.will_delete_offer'),
                    type: "red",
                    buttons: {
                        ok: {
                            text:  $lang('general.yes'),
                            btnClass: "btn orange-btn",
                            keys: ["enter"],
                            action: () => {
                                $(this).closest("form").submit();
                            }
                        },
                        cancel: {
                            text:  $lang('general.cancel'),
                            btnClass: "btn-default",
                            keys: ["esc"]
                        }
                    }
                });
            });
        });
    </script>
@endpush