@extends('layouts.master')
@section('title')
    شاشة قائمة العملاء
@endsection
@section('css')
    <link href="{{ URL::asset('assets/plugins/datatable/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" />
    <link href="{{ URL::asset('assets/plugins/datatable/css/buttons.bootstrap4.min.css') }}" rel="stylesheet">
    <link href="{{ URL::asset('assets/plugins/datatable/css/responsive.bootstrap4.min.css') }}" rel="stylesheet" />
    <link href="{{ URL::asset('assets/plugins/datatable/css/jquery.dataTables.min.css') }}" rel="stylesheet">
    <link href="{{ URL::asset('assets/plugins/datatable/css/responsive.dataTables.min.css') }}" rel="stylesheet">
    <link href="{{ URL::asset('assets/plugins/select2/css/select2.min.css') }}" rel="stylesheet">
@endsection
@section('page-header')
    <!-- breadcrumb -->
    <div class="breadcrumb-header justify-content-between">
        <div class="my-auto">
            <div class="d-flex">
                <h4 class="content-title mb-0 my-auto">شاشة قائمة العملاء</h4><span
                    class="text-muted mt-1 tx-13 mr-2 mb-0">/ شاشة العملاء</span>
            </div>
        </div>

    </div>
    <!-- breadcrumb -->
@endsection
@section('content')
    <!-- row -->
    <div class="row">
        <div class="col-xl-12">
            <div class="card mg-b-20">
                <div class="card-header pb-0">
                    <div class="d-flex justify-content-between">


                        @if (in_array(43, Session('accessRoles')))
                            <a href="{{ route('customers.create') }}" class="btn btn-sm btn-primary" style="color:white"><i
                                    class="fas fa-plus"></i>&nbsp; اضافة عميل </a>
                        @endif
                    </div>

                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table id="example1" class="table key-buttons text-md-nowrap" data-page-length='50'
                            style="text-align: center">
                            <thead>
                                <tr>
                                    <th class="border-bottom-0">#</th>
                                    <th class="border-bottom-0"> اسم العميل </th>
                                    <th class="border-bottom-0"> الإيميل </th>
                                    <th class="border-bottom-0"> رقم الهاتف </th>
                                    <th class="border-bottom-0"> العمر </th>
                                    <th class="border-bottom-0"> النقات </th>
                                    <th class="border-bottom-0"> الجنسية </th>
                                    <th class="border-bottom-0"> الدولة </th>
                                    <th class="border-bottom-0"> المحافظة </th>
                                    <th class="border-bottom-0">صورة الملف الشخصي</th>
                                    <th class="border-bottom-0">حالة الحساب</th>
                                    <th class="border-bottom-0">العمليات</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($customers as $customer)
                                    <tr>
                                        <td>{{ $customer->id }}</td>
                                        <td>{{ $customer->name }}</td>
                                        <td>{{ $customer->email }}</td>
                                        <td>{{ $customer->phone_number }}</td>
                                        <td>{{ $customer->age }}</td>
                                        <td>{{ $customer->points }}</td>
                                        <td>{{ $customer->nationality }}</td>
                                        <td>{{ $customer->country }}</td>
                                        <td>{{ $customer->governorate }}</td>
                                        <td><img src="{{ asset('uploads/profiles/' . $customer->profile_photo_path) }}"
                                                width="100" height="100" alt=""></td>

                                        <td>
                                            @if ($customer->isVerified == 1)
                                                مفعل
                                            @else
                                                غير مفعل
                                            @endif
                                        </td>

                                        <td>
                                            <div class="dropdown">
                                                <button aria-expanded="false" aria-haspopup="true"
                                                    class="btn ripple btn-primary btn-sm" data-toggle="dropdown"
                                                    type="button">العمليات<i class="fas fa-caret-down ml-1"></i></button>
                                                <div class="dropdown-menu tx-13">


                                                    @if (in_array(42, Session('accessRoles')))
                                                        <a class="dropdown-item"
                                                            href="{{ route('customers.edit', $customer->id) }}">تعديل
                                                            الحساب</a>
                                                    @endif
                                                    @if (in_array(44, Session('accessRoles')))
                                                        <form method="post"
                                                            action="{{ route('customers.destroy', $customer->id) }}">
                                                            @method('delete')
                                                            @csrf
                                                            {{--                                                                <button type="submit" class="btn btn-danger btn-sm">Delete</button> --}}
                                                            <button type="submit" class="dropdown-item" href="#"><i
                                                                    class="text-danger fas fa-trash-alt"></i>&nbsp;&nbsp;حذف
                                                                الحساب</button>
                                                        </form>
                                                    @endif


                                                </div>
                                            </div>

                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- row closed -->
    </div>
    <!-- Container closed -->
    </div>
    <!-- main-content closed -->
@endsection
@section('js')
    <script src="{{ URL::asset('assets/plugins/datatable/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.dataTables.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/responsive.dataTables.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/jquery.dataTables.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.bootstrap4.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.bootstrap4.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/jszip.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/pdfmake.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/vfs_fonts.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.html5.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.print.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.colVis.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/responsive.bootstrap4.min.js') }}"></script>
    <!--Internal  Datatable js -->
    <script src="{{ URL::asset('assets/js/table-data.js') }}"></script>
    <script src="{{ URL::asset('assets/js/modal.js') }}"></script>

    <script>
        $('#exampleModal2').on('show.bs.modal', function(event) {
            var button = $(event.relatedTarget)
            var id = button.data('id')
            var station_type = button.data('station_type')
            var modal = $(this)
            modal.find('.modal-body #id').val(id);
            modal.find('.modal-body #station_type').val(station_type);

        })
    </script>

    <script>
        $('#modaldemo9').on('show.bs.modal', function(event) {
            var button = $(event.relatedTarget)
            var id = button.data('id')
            var station_type = button.data('station_type')
            var modal = $(this)
            modal.find('.modal-body #id').val(id);
            modal.find('.modal-body #station_type').val(station_type);
        })
    </script>
@endsection