@extends('client.layouts.app')
@section('title', 'قائمة القيود اليدوية ')

@section('content')
    <div class="app-content content">
        <div class="content-overlay"></div>
        <div class="header-navbar-shadow"></div>
        <div class="content-wrapper container-xxl p-0">
            <div class="content-header row">
            </div>
            <div class="content-body">
                <!-- Dashboard Ecommerce Starts -->
                <section id="dashboard-ecommerce">
                    <div class="content-header row">
                        <div class="content-header-left col-md-9 col-12 mb-2">
                            <div class="row breadcrumbs-top">
                                <div class="col-12">
                                    <h2 class="content-header-title float-start mb-0">قائمة القيود اليدوية </h2>
                                    <div class="breadcrumb-wrapper">
                                        <ol class="breadcrumb">
                                            <li class="breadcrumb-item"><a href="{{ route('client.home') }}">لوحة التحكم</a>
                                            </li>
                                            <li class="breadcrumb-item active">قائمة القيود اليدوية
                                            </li>
                                        </ol>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="content-header-right text-md-end col-md-3 col-12 d-md-block d-none">
                            <div class="mb-1 breadcrumb-right">
                                <div class="dropdown">
                                    {{-- @can('إضافة قيد يدوي') --}}
                                        <a href="{{ route('client.manualJournal.create') }}">
                                            <button class="btn-icon btn btn-primary" type="button"> اضافة قيد جديد<i data-feather='plus'>
                                                </i></button>
                                        </a>
                                    {{-- @endcan --}}
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-12 col-md-12 col-12">
                            <div class="card card-statistics">
                                <div class="card-body statistics-body">
                                    <div class="row">
                                        <div class="table-responsive">
                                            <div class="card-datatable">
                                                <table id="manualJournalTable"
                                                    class="datatables-basic table dataTable no-footer dtr-column collapsed"
                                                    aria-describedby="manualJournalTable_info">
                                                    <thead>
                                                        <tr>
                                                            <th>تحكم</th>
                                                            <th>رقم القيد</th>
                                                            <th> البيان</th>
                                                            <th>الفرع</th>
                                                            <th>المبلغ</th>
                                                            <th>التاريخ</th>
                                                            <th>المسؤول</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach ($manualJournals as $manualJournal)
                                                            <tr id="id-{{ $manualJournal->id }}">
                                                                <td>
                                                                    <a class="pe-1 dropdown-toggle text-primary" data-bs-toggle="dropdown">
                                                                        <i data-feather='more-vertical'></i>
                                                                    </a>
                                                                    <div class="dropdown-menu dropdown-menu-end">
                                                                        @can('تعديل مصروف')
                                                                            <a href="{{ route('client.manualJournal.edit', $manualJournal->id) }}"
                                                                                class="dropdown-item"><b> تعديل <i
                                                                                        data-feather='edit'></b></i></a>
                                                                        @endcan
                                                                        <a href="{{ route('client.manualJournal.show', $manualJournal->id) }}"
                                                                            class="dropdown-item"><b> عرض <i
                                                                                    data-feather='eye'></b></i></a>
                                                                        @can('حذف مصروف')
                                                                            <a href="#" onclick="deleteRow({{ $manualJournal->id }})" class="dropdown-item">
                                                                                <b> حذف <i data-feather='trash-2'></i></b>
                                                                            </a>
                                                                        @endcan
                                                                    </div>
                                                                </td>
                                                                <td>{{ $manualJournal->name }}</td>
                                                                <td>{{ $manualJournal->description }}</td>
                                                                <td>{{ $manualJournal->branch->branch_name }}</td> 
                                                                <td>{{ $manualJournal->total }}</td>
                                                                <td>{{ $manualJournal->created_at->format('d-m-Y') }}</td>
                                                                <td>{{ $manualJournal->client->name }}</td>
                                                            </tr>
                                                        @endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                </section>
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script src="{{ asset('app-assets/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('app-assets/js/dataTables.bootstrap5.min.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.all.min.js"></script> <!-- CDN for SweetAlert2 -->
    <script src="{{ asset('app-assets/js/lightbox.min.js') }}"></script>
    

    <script>
        lightbox.option({
            'resizeDuration': 300,
            'wrapAround': true
        });

        $(function() {
            $("#manualJournalTable").DataTable();
        });

        $('#manualJournalTable').DataTable({
            "language": {
                "url": "{{ asset('app-assets/data/locales/Arabic.json') }}"
            }
        });

        // Initialize Feather icons
        feather.replace();

        function deleteRow(id) {
            Swal.fire({
                title: 'هل أنت متأكد من حذف هذا القيد؟',
                text: 'لن تتمكن من استرجاعه بعد الحذف!',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#DD6B55',
                cancelButtonColor: '#3085d6',
                confirmButtonText: 'تأكيد',
                cancelButtonText: 'إلغاء'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: "{{ route('client.manualJournal.delete', '') }}/" + id,
                        type: "DELETE",
                        data: {
                            '_token': '{{ csrf_token() }}'
                        },
                        success: function(response) {
                            if (response.success) {
                                Swal.fire('تم الحذف بنجاح', '', 'success');
                                $("#id-" + id).remove();
                            } else {
                                Swal.fire('خطأ في الحذف', response.error, 'error');
                            }
                        },
                        error: function(xhr, ajaxOptions, thrownError) {
                            Swal.fire('خطأ في الحذف', 'الرجاء المحاولة مرة أخرى', 'error');
                        }
                    });
                }
            });
        }
    </script>
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('app-assets/css/lightbox.css') }}">
@endsection