@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.expenses.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="example2" class="datatables-basic table dataTable no-footer dtr-column collapsed" aria-describedby="example2_info">
                                <thead>
                                    <tr>
                                        <th>تحكم</th>
                                        <th>رقم القيد</th>
                                        <th>بيان القيد</th>
                                        <th>نوع القيد</th>
                                        <th>القيد الثابت</th>
                                        <th>المبلغ</th>
                                        <th>الصورة</th>
                                        <th>الدفع</th>
                                        <th>التاريخ</th>
                                        <th>المسؤول</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @php
                                        $i=0;
                                    @endphp
                                    @foreach ($expenses as $key => $expense)
                                        <tr id="id-{{$expense->id}}">
                                            <td>
                                                <a class="pe-1 dropdown-toggle -arrow text-primary" data-bs-toggle="dropdown">
                                                  <i data-feather='more-vertical'style="width: 20;height: 20;"></i>
                                                </a>
                                                   <div class="dropdown-menu dropdown-menu-end">
                                                   @can('تعديل مصروف')
                                                    <a href="{{ route('client.expenses.edit', $expense->id) }}" class="dropdown-item"><b> تعديل <i data-feather='edit'></b></i></a>
                                                   @endcan
                                                   @can('حذف مصروف')
                                                   <a onclick="deleteRow({{$expense->id}})" class="dropdown-item"><b> حذف <i data-feather='trash-2'></b></i></a>
                                                  @endcan
                                                  </div>                       
                                              </td>
                                            <td>{{ $expense->expense_number }}</td>
                                            <td>{{ $expense->expense_details }}</td>
                                            <td>{{ $expense->type }}</td>
                                            <td>{{ $expense->fixed->fixed_expense}}</td>
                                            <td>{{abs(floatval( $expense->amount))}}</td>
                                            <td>
                                              @if(!empty($expense->expense_pic))
                                              
                                                     <a class="{{$expense->id}}-image-link" data-lightbox="{{$expense->id}}-set" href="{{asset($expense->expense_pic)}}">عرض</a>
                                                     @endif
                                            </td>
                                            <td>@if($expense->safe_id)خزنة : {{ $expense->safe->safe_name }}   @elseif($expense->bank_id) بنك : {{ $expense->bank->bank_name }} @endif</td>
                                            <td>{{ $expense->created_at}}</td>
                                            <td>{{ $expense->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="{{asset('app-assets/js/sweetalert.min.js')}}"></script>
<script src="{{asset('app-assets/js/lightbox.min.js')}}"></script>

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

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

  function deleteRow(id){

   swal({

title: "هل أنت متأكد من حذف هذا الفئة", 


  type: "warning",

  showCancelButton: true,

  confirmButtonColor: "#DD6B55",

  confirmButtonText: "تأكيد",

cancelButtonText: "إلغاء",

  closeOnConfirm: false

}, function (isConfirm) {

  if (!isConfirm) return;

  $.ajax({

    url: "{{route('client.expenses.delete')}}",

      type: "post",

      data: {

          id: id,
          '_token':'{{csrf_token()}}'
      },

      dataType: "html",
      beforeSend : function (){var ifConnected = window.navigator.onLine;if (!ifConnected) {toastr.info("يتم الآن إعادة الإتصال","لا يوجد إتصال بالإنترنت",{positionClass: "toast-top-right",tapToDismiss: !1,timeOut: 2e3,rtl: $("html").attr("data-textdirection")});}},

      success: function () {

          swal("تم الحذف بنجاح", "", "success");

            $("#id-" +id).remove()

      },

      error: function (xhr, ajaxOptions, thrownError) {

          swal("خطأ في الحذف ", "الرجاء المحاولة مرة آخري", "error");

      }

  });

});
  }



   </script>
@endsection

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