@extends('layouts.layout-2')

@section('content')


    <h4 class="font-weight-bold py-2 mb-2">
        {{ __('User') }}
    </h4>

    <div class="card">
        <div class="card-datatable table-responsive">
            <table class="datatables-users table table-striped table-bordered">

                <thead>
                <tr>
                    <th>#</th>
                    <th>{{__('First name')}}</th>
                    <th>{{__('Last name')}}</th>
                    <th>{{__('E-Mail')}}</th>
                    <th>{{__('Zugang')}}</th>
                    <th>{{__('verified')}} (seit)</th>
                    <th>{{__('active')}} (seit)</th>
                    <th>{{__('Account')}} (bis)</th>
                    <th>{{__('Shop')}} (bis)</th>
                    <th>{{__('Shop')}} ab</th>
                    <th>{{__('Zahlungsarten')}}</th>
                    <th>{{__('Test Modus')}}</th>
                    <th>{{__('delete')}}</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>



    <!-- Modal admin -->
    <div class="modal fade" id="modals-admin">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">

                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>

                    <div class="form-row">
                        <div class="form-group col">
                            <label for="admin" class="form-label">{{__('Role')}}</label>
                            <select class="selectpicker" data-style="btn-default" name="admin">
                                {!!  HTMLHelper::getRolesOptions() !!}
                            </select>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-admin" value="save-admin">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal confirmed -->
    <div class="modal fade" id="modals-confirmed">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">
                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="custom-control custom-checkbox m-0">
                            <input type="checkbox" class="custom-control-input" name="confirmed" checked>
                            <span class="custom-control-label">{{__('verified')}}</span>
                        </label>
                    </div>
                    <div class="form-row">
                        <div class="form-group col">
                            <label for="confirmation_date" class="form-label">{{__('Datum')}} seit</label>
                            <input type="text" name="confirmation_date" class="form-control b-material-datetime-picker" placeholder="25.10.2020 10:30">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-confirmed" value="save-confirmed">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal active -->
    <div class="modal fade" id="modals-active">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">

                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="custom-control custom-checkbox m-0">
                            <input type="checkbox" class="custom-control-input" name="active" checked>
                            <span class="custom-control-label">{{__('active')}}</span>
                        </label>
                    </div>
                    <div class="form-row">
                        <div class="form-group col">
                            <label for="active_date" class="form-label">{{__('Datum')}} seit</label>
                            <input type="text" name="active_date" class="form-control b-material-datetime-picker" placeholder="25.10.2020 10:30">
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-active" value="save-active">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal account -->
    <div class="modal fade" id="modals-account">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">

                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col">
                            <label for="payment_account" class="form-label">{{__('Account')}} bis</label>
                            <input type="text" name="payment_account" class="form-control b-material-datetime-picker" placeholder="25.10.2020 10:30">
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-account" value="save-account">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal account -->
    <div class="modal fade" id="modals-shop">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">

                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col">
                            <label for="payment_shop" class="form-label">{{__('Shop')}} bis</label>
                            <input type="text" name="payment_shop" class="form-control b-material-datetime-picker" placeholder="25.10.2020 10:30">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-shop" value="save-shop">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal test modus -->
    <div class="modal fade" id="modals-test_mode">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">

                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>
                    <div class="form-group">
                        <p>Aktiviert den Testmodus beim den Zahlungsdiensten. Käufe werden als TEST markiert und die Mails gehen an devtest@mivita.care</p>
                        <p><a target="_blank" href="https://docs.payone.com/display/public/PLATFORM/Testdata">Zu den Testdaten für den Kauf von Payone</a>.</p>
                        <label class="custom-control custom-checkbox m-0">
                            <input type="checkbox" class="custom-control-input" name="test_mode" checked>
                            <span class="custom-control-label">{{__('Test Mode')}}</span>
                        </label>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-test_mode" value="save-test_mode">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Modal test modus -->
    <div class="modal fade" id="modals-payment_methods">
        <div class="modal-dialog">
            <form class="modal-content" action="{{ route('admin_user_store') }}" method="post">
                @csrf
                <input type="hidden" class="form-control" name="id">

                <div class="modal-header">
                    <h5 class="modal-title">{{__('User')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                </div>
                <div class="modal-body">
                    <div class="form-row">
                        <div class="form-group col">
                            <label for="email" class="form-label">{{__('E-Mail')}}</label>
                            <input type="text" class="form-control" name="email" placeholder="{{__('E-Mail')}}" readonly>
                        </div>
                    </div>
                    @foreach(\App\Models\PaymentMethod::where('active', true)->get() as $payment_method)
                    <div class="form-group">
                        <label class="custom-control custom-checkbox m-0">
                            <input type="checkbox" class="custom-control-input input-payment-methods" name="payment_methods[]" value="{{$payment_method->id}}" @if($payment_method->default) checked @endif>
                            <span class="custom-control-label">{{ $payment_method->name }}</span>
                        </label>
                    </div>
                    @endforeach
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                    <button type="submit" class="btn btn-primary" name="save-payment_methods" value="save-payment_methods">{{__('save')}}</button>
                </div>
            </form>
        </div>
    </div>

    <script>
        $( document ).ready(function() {
            $('#modals-admin').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                $(this).find(".modal-body select[name='admin']").val(button.data('admin'));
                $('.selectpicker').selectpicker('refresh');
            });

            $('#modals-confirmed').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                $(this).find(".modal-body input[name='confirmed']").prop( "checked", button.data('confirmed'));
                $(this).find(".modal-body input[name='confirmation_date']").val(button.data('confirmation_date'));
            });

            $('#modals-active').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                $(this).find(".modal-body input[name='active']").prop( "checked", button.data('active'));
                $(this).find(".modal-body input[name='active_date']").val(button.data('active_date'));
            });

            $('#modals-account').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                $(this).find(".modal-body input[name='payment_account']").val(button.data('payment_account'));
            });

            $('#modals-shop').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                $(this).find(".modal-body input[name='payment_shop']").val(button.data('payment_shop'));
            });
            $('#modals-payment_methods').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                var payment_methods = button.data('payment_methods');
                if(payment_methods){

                    $.each($(this).find(".modal-body .input-payment-methods"), function (i, item) {
                        if($.inArray(parseInt($(item).val()), payment_methods) !== -1){
                            $(item).prop( "checked", true);
                        }else{
                            $(item).prop( "checked", false);
                        }
                    });
                }
            });

            $('#modals-test_mode').on('show.bs.modal', function (event) {
                var button = $(event.relatedTarget);
                $(this).find(".modal-content input[name='id']").val(button.data('id'));
                $(this).find(".modal-body input[name='email']").val(button.data('email'));
                $(this).find(".modal-body input[name='test_mode']").prop( "checked", button.data('test_mode'));
            });


            $('.datatables-users').dataTable({
                "processing": true,
                "serverSide": true,
                "ajax": '{!! route('data_table_users') !!}',
                "order": [[0, "desc" ]],
                "columns": [
                    { data: 'id', searchable: false},
                    { data: 'first_name', name: 'account.first_name' },
                    { data: 'last_name', name: 'account.last_name' },
                    { data: 'email', name: 'email' },
                    { data: 'admin', name: 'admin' },
                    { data: 'confirmed', name: 'confirmed' },
                    { data: 'active', name: 'active' },
                    { data: 'account', name: 'account' },
                    { data: 'shop', name: 'shop' },
                    { data: 'since', name: 'since' },
                    { data: 'my_payment_methods', name: 'my_payment_methods' },
                    { data: 'test_mode', name: 'test_mode' },
                    { data: 'action_delete', orderable: false, searchable: false},
                ],
                "bLengthChange": false,
                "iDisplayLength": 50,
                "language": {
                    "url": "/js/German.json"
                }
            });

        });
    </script>
@endsection