@extends('admin.layout.index')

{{-- ===========  meta Title  =================== --}}
@section('title')
    لیست نمایندگان - {{ $user->first_name.' '.$user->last_name }}
@endsection
{{-- ===========  My Css Style  =================== --}}
@section('style')
    <style>
        #users {
            border: 1px solid #eeeeee;
            height: auto;
            max-height: 120px;
            overflow: auto;
            display: none;
            position: absolute;
            z-index: 999;
            width: 100%;
            top: 48px;
            background-color: white;
        }


        .user {
            margin-bottom: 0;
            padding: 0.5rem;
        }

        .user:hover {
            background-color: #afb6ff;
            color: white;
            cursor: pointer;
        }
    </style>
@endsection
{{-- ===========  My JavaScript  =================== --}}

@section('script')
    <script>
        $(document).ready(function () {
            //get localStorage
            let users = JSON.parse(localStorage.getItem("users"));
            let userNameSearch = localStorage.getItem('userNameSearch');
            if (users != null) {
                $('#userNameSearch').val(userNameSearch);
                filter();
            }
        });

        function removeModal(seller_id) {
            let modal = $('#remove_modal');
            modal.modal('show');
            $('#seller_id').val(seller_id);
        }

        function RemoveUser() {
            let seller_id = $('#seller_id').val();
            let user_id = "{{ $user->id }}";
            let modal_alert = $('#modal_alert');
            $.ajax({
                url: "{{ route('admin.user.representation_remove') }}",
                data: {
                    _token: "{{ csrf_token() }}",
                    seller_id: seller_id,
                    user_id: user_id,
                },
                dataType: "json",
                type: 'POST',
                beforeSend: function () {

                },
                success: function (msg) {
                    if (msg) {
                        if (msg[0] === 1) {
                            window.location.reload();
                        }
                    }
                },
            })
        }

        $('#clearFactorBtn').click(function () {
            //clear localStorage
            localStorage.removeItem('users');
            localStorage.removeItem('userNameSearch');
            window.location.reload();
        })

        function ShowSelectExpert() {
            $('#add_representation').modal('show');
        }

        function SaveSeller() {
            let seller_id = $('#seller_id').val();
            if (seller_id == 0) {
                alert('کاربری انتخاب نکرده اید')
                return false;
            }
            let user_id = "{{ $user->id }}";

            $.ajax({
                url: "{{ route('admin.user.representation.add') }}",
                data: {
                    _token: "{{ csrf_token() }}",
                    seller_id: seller_id,
                    user_id: user_id,

                },
                dataType: "json",
                type: "POST",
                beforeSend: function () {
                    $("#overlay").fadeIn();
                },
                success: function (msg) {
                    if (msg[0] == 1) {
                       window.location.reload();
                    } else {
                        console.error(msg);
                    }
                },
                fail: function (error) {
                    console.log(error);
                }
            })
        }

    </script>
@endsection
{{-- ===========      CONTENT      =================== --}}
@section('content')
    <div class="text-left">
        <button onclick="ShowSelectExpert()" class="btn btn-success btn-sm mr-1">افزودن</button>
        <a href="{{ route('admin.user.index',['is_expert'=>1]) }}"
           class="btn btn-dark btn-sm mr-1">بازگشت</a>


    </div>
    @if(count($sellers)>0)
        <div class="row">
            <div class="col-12">
                <form
                    id="groupDelete"
                    action="#"
                    method="POST">
                    @method('delete')
                    @csrf
                    <table class="table table-bordered text-center table-striped">
                        <thead>
                        <tr>
                            <th>ردیف</th>
                            <th>نام و نام خانوادگی</th>
                            <th>شماره همراه</th>
                            <th>حذف</th>
                        </tr>
                        </thead>
                        <tbody id="insertRow">
                        @foreach($sellers as $key=>$item)
                            <tr>
                                <td>
                                    {{ $sellers->firstItem()+$key }}
                                </td>
                                <td>
                                    <a>
                                        {{ $item->first_name.' '.$item->last_name }}
                                    </a>
                                </td>
                                <td>
                                    {{ $item->cellphone }}
                                </td>
                                <td>
                                    <button type="button" onclick="removeModal({{ $item->id }})"
                                            class="btn btn-danger btn-sm">
                                        <i class="fa fa-trash"></i>
                                    </button>
                                </td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </form>
            </div>
        </div>
        <div class="row paginate">
            <div class="col-12">
                <div class="row justify-content-center">
                    {{ $sellers->render() }}
                </div>
            </div>
        </div>
    @else
        <div class="row d-sm-flex align-items-center justify-content-between mt-4 noneDisplay">
            <div class="col-12">
                <hr>
            </div>
            <div class="col-12">
                <div class="alert alert-info text-center">
                    نماینده ای برای نمایش موجود نیست
                </div>
            </div>
        </div>
    @endif
    <div id="remove_modal" class="modal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <p>نماینده از لیست این کاربر حذف خواهد شد.آیا ادامه میدهید ؟</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">نه!</button>
                    <button onclick="RemoveUser()" type="button" class="btn btn-success" data-dismiss="modal">حذف کن
                    </button>
                </div>
            </div>
        </div>
    </div>
    <div id="add_representation" class="modal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <p>نماینده مورد نظر را اضافه نمایید</p>
                    <select id="seller_id" class="form-control">
                        <option value="0">انتخاب کنید</option>
                        @foreach($all_sellers as $item)
                            <option value="{{ $item->id }}">{{ $item->first_name.' '.$item->last_name }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="modal-footer">
                    <button onclick="SaveSeller()" type="button" class="btn btn-success">
                        افزودن
                    </button>
                </div>
            </div>
        </div>
    </div>
@endsection