@extends('tenant.layouts.master')

@section('style')
    <link rel="stylesheet" href="{{ asset('css/accounting/representatives/index.css') }}">
@endsection

@section('breadcrumb')
    @php
        $breadcrumb_items[__('breadcrumb.home')] = '/';

        if ($module == 'warehouses') {
            $breadcrumb_items[__('breadcrumb.warehouses')] = '/warehouses/branches';
        } elseif ($module == 'accounting') {
            $breadcrumb_items[__('breadcrumb.accounting')] = '/accounting/accounts';
        } elseif ($module == 'rentals') {
            $breadcrumb_items[__('breadcrumb.rentals')] = '#';
        }

        $breadcrumb_items[__('breadcrumb.receivables')] = route('tenant.receivables.index', ['module' => $module]);
        $breadcrumb_items[__('breadcrumb.representatives')] = '#';
    @endphp

    @include('tenant.layouts.breadcrumb', [
        'items' => $breadcrumb_items,
    ])
@endsection

@section('sidebar')
    @include('tenant.layouts.sidebar', ['activeItem' => "{$module}.receivables"])
@endsection

@section('content')
    <div class="my-4">
        <h4 class="text-center"> @lang('receivables/representatives/index.receivables_representatives') {{ $receivableAccount->name }}</h4>

        <a href="{{ route('tenant.representatives.representatives.create') }}" class="btn orange-btn">
            @lang('receivables/representatives/index.add_representative') <i class="fas fa-plus-circle"></i>
        </a>
    </div>

    <div class="m-auto">
        <table class="table table-striped table-bordered table-hover table-borderless">
            <thead>
                <tr>
                    <th class="xs-td">#</th>
                    <th class="text-center md-td"> @lang('receivables/representatives/index.representative_name')  </th>
                    <th class="text-center md-td">@lang('receivables/representatives/index.username')</th>
                    <th class="text-center md-td"> @lang('receivables/representatives/index.phone_number')</th>
                    <th class="text-center md-td">@lang('receivables/representatives/index.warehouses')</th>
                    <th class="text-center xs-td"> @lang('receivables/representatives/index.commission_percentage')</th>
                    <th class="text-center sm-td">  @lang('receivables/representatives/index.sales_representative')</th>
                    <th class="text-center sm-td">  @lang('receivables/representatives/index.collection_representative')</th>
                    <th class="text-center sm-td"> @lang('receivables/representatives/index.delivery_representative')</th>
                    <th class="text-center sm-td">@lang('receivables/representatives/index.cash_van_representative')</th>
                    <th class="text-center sm-td">@lang('general.procedures')</th>
                </tr>
            </thead>

            <tbody>
                @foreach ($representatives as $representative)
                    <tr>
                        <td class="xs-td">{{ $loop->iteration }}</td>
                        <td class="md-td">{{ $representative->name }}</td>
                        <td class="md-td">{{ $representative->username }}</td>
                        <td class="md-td">{{ $representative->phone }}</td>
                        <td class="md-td">
                            @foreach ($representative->branch as $branch)
                                {{ $branch->name }},
                            @endforeach
                        </td>
                        <td class="xs-td">{{ $representative->commission_rate }}</td>
                        <td class="sm-td">{{ $representative->is_saler == 0 ? 'لا' : 'نعم' }}</td>
                        <td class="sm-td">{{ $representative->is_collector == 0 ? 'لا' : 'نعم' }}</td>
                        <td class="sm-td">{{ $representative->is_delivery == 0 ? 'لا' : 'نعم' }}</td>
                        <td class="sm-td">{{ $representative->is_cash_van == 0 ? 'لا' : 'نعم' }}</td>

                        <td class="xs-td">
                            <x-operations-btn>
                                <li>
                                    <a class="btn show-edit-modal-btn"
                                        href="{{ route('tenant.representatives.representatives.edit', ['module' => $module, 'representative' => $representative->id]) }}">
                                        <i class="fas fa-edit"></i> @lang('general.edit')
                                    </a>
                                </li>

                                <li>
                                    <form
                                        action="{{ route('tenant.representatives.representatives.destroy', ['module' => $module, 'representative' => $representative->id]) }}"
                                        method="post">
                                        @csrf
                                        @method('delete')

                                        <button class="btn" name="delete" type="button">
                                            <i class="fas fa-trash-alt"></i> @lang('general.delete')
                                        </button>
                                    </form>
                                </li>
                            </x-operations-btn>
                        </td>
                    </tr>
                @endforeach
            </tbody>
            @if ($representatives->isEmpty())
                <tfoot class="bordered-top bg-white">
                    <tr id="tFooteTarget" class="bordered-top">
                        <td colspan="11">@lang('receivables/representatives/index.no_representatives')</td>
                    </tr>
                </tfoot>
            @endif
        </table>
    </div>
@endsection

@push('script')
    <script>
        $(() => {
            $('button[name="delete"]').on('click', function(e) {
                $.confirm({
                    title: $lang('receivables.representatives.index.confirm_delete'),
                    content:$lang('receivables.representatives.index.permanent_deletion_warning'),
                    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'],
                            action: () => {
                                $(this).prop('checked', !$(this).prop('checked'));
                            }
                        }
                    }
                });
            });
        });
    </script>
@endpush