@extends('layouts.app')

@section('content')
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6 row">
                    <h1 class="mr-4">Users</h1>
                    <a href="{{ route('user.create') }}" class="btn btn-primary">Add New <i class="fa fa-user"></i></a>
                    <a href="javascript:window.location.reload(true)" class="btn btn-primary" style="margin-left: 5px;">Reload</a>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
                        <li class="breadcrumb-item active">Users</li>
                    </ol>
                </div>
            </div>
        </div>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <table id="user-table" class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th>Mark</th>
                                    <th>#</th>
                                    <th>Username</th>
                                    <th>Email</th>
                                    <th>Workout Plan</th>
                                    <th>Yearly Plan?</th>
                                    <th>Subscription Tier</th>
                                    <th>Had Kit?</th>
                                    <th>Need a Kit</th>
                                    <th>Created On</th>
                                    <th>Status</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @php
                                $i = 1;
                                @endphp
                                @foreach ($accounts as $account)
                                    <tr>
                                        <td id="marked_as_read_td">
                                             
                                                @if(!empty($account->data()['marked_as_read']) && $account->data()['marked_as_read'] == 'true')
                                                    @php $checked = 'checked=checked'; @endphp
                                                <p style="display: none;" id="marked_as_read_id">
                                                    Checkedbox
                                                </p>
                                                @else
                                                     @php $checked = ''; @endphp
                                                <p style="display: none;" id="marked_as_read_id">
                                                    &#8203;
                                                </p>
                                                @endif
                                              
                                            <input type="checkbox" class="mark_checkbox" data-id ="{{$account->id()}}" {{$checked}} value="true" name="marked"></td>
                                            
                                        <td>{{ $i++ }}</td>
                                        <td>{{ $account->id() }}</td>
                                        @if (!empty($account->data()['email']))
                                            <td>{{ $account->data()['email'] }}</td>
                                        @else
                                            <td>--</td>
                                        @endif
                                        @if (!empty($account->data()['Workout_Type']))
                                            <td>{{ $account->data()['Workout_Type'] }}</td>
                                        @else
                                            <td>--</td>
                                        @endif
                                        <td id="had_yearly_plan_td">
                                             
                                            @if(!empty($account->data()['had_yearly_plan']) && $account->data()['had_yearly_plan'] == 'true')
                                                @php $checked = 'checked=checked'; @endphp
                                            <p style="display: none;" id="had_yearly_plan_id">
                                                Checkedbox
                                            </p>
                                            @else
                                                 @php $checked = ''; @endphp
                                            <p style="display: none;" id="had_yearly_plan_id">
                                                &#8203;
                                            </p>
                                            @endif
                                          
                                            <input type="checkbox" class="had_yearly_plan" data-id ="{{$account->id()}}" {{$checked}} value="true" name="marked">
                                        </td>
                                        @if (array_key_exists('Subscription_Duration', $account->data()))
                                            <td>
                                                {{ $account->data()['Subscription_Duration'] }}
                                            </td>
                                        @else
                                            <td>--</td>
                                        @endif
                                        <td id="had_kit_td">
                                             
                                            @if(!empty($account->data()['had_kit']) && $account->data()['had_kit'] == 'true')
                                                @php $checked = 'checked=checked'; @endphp
                                            <p style="display: none;" id="had_kit_id">
                                                Checkedbox
                                            </p>
                                            @else
                                                 @php $checked = ''; @endphp
                                            <p style="display: none;" id="had_kit_id">
                                                &#8203;
                                            </p>
                                            @endif
                                          
                                            <input type="checkbox" class="had_kit" data-id ="{{$account->id()}}" {{$checked}} value="true" name="marked">
                                        </td>
                                        @if (array_key_exists('exercise_kit_needed', $account->data()))
                                        <td>
                                            {{ $account->data()['exercise_kit_needed'] }}
                                        </td>
                                        @else
                                            <td>--</td>
                                        @endif
                                        <td>{{ date('d M Y', strtotime($account->createTime())) }}</td>
                                        @if (array_key_exists('status', $account->data()))
                                            <td>
                                                @if ($account->data()['status'] == 0)
                                                    <span class="badge badge-danger">Blocked</span>
                                                @elseif($account->data()['status'] == 1)
                                                    <span class="badge badge-success">Active</span>
                                                @endif
                                            </td>
                                        @else
                                            <td>--</td>
                                        @endif
                                        <td class="row" style="width: 200px;">
                                            @if (array_key_exists('status', $account->data()))
                                                @if ($account->data()['status'] == 0)
                                                    <a href="{{ route('user.status', $account->id()) }}"
                                                        data-toggle="tooltip" data-placement="top" title="Unblock User"
                                                        class="btn btn-sm btn-success ml-2 user-unblock"><i
                                                            class="fa fa-check-square"></i></a>
                                                @elseif($account->data()['status'] == 1)
                                                    <a href="{{ route('user.status', $account->id()) }}"
                                                        data-toggle="tooltip" data-placement="top" title="Block User"
                                                        class="btn btn-sm btn-warning ml-2 text-white user-block"><i
                                                            class="fa fa-window-close"></i></a>
                                                @endif
                                            @else
                                                <a href="{{ route('user.status', $account->id()) }}" data-toggle="tooltip"
                                                    data-placement="top" title="Unblock User"
                                                    class="btn btn-sm btn-success ml-2 user-unblock"><i
                                                        class="fa fa-check-square"></i></a>
                                            @endif
                                            <a href="{{ route('user.show', $account->id()) }}" data-toggle="tooltip"
                                                data-placement="top" title="View User" class="btn btn-sm btn-info ml-2"><i
                                                    class="fas fa-eye"></i></a>
                                            <a href="{{ route('user.edit', $account->id()) }}" data-toggle="tooltip"
                                                data-placement="top" title="Edit User"
                                                class="btn btn-sm btn-success ml-2"><i class="fas fa-pencil-alt"></i></a>
                                            <a href="{{ route('user.delete', $account->id()) }}" data-toggle="tooltip"
                                                data-placement="top" title="Delete User"
                                                class="btn btn-sm btn-danger ml-2 delete-user"><i
                                                    class="fas fa-trash"></i></a>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th>Mark</th>
                                    <th>#</th>
                                    <th>Username</th>
                                    <th>Email</th>
                                    <th>Workout Plan</th>
                                    <th>Yearly Plan?</th>
                                    <th>Subscription Tier</th>
                                    <th>Had Kit?</th>
                                    <th>Need a Kit</th>
                                    <th>Created On</th>
                                    <th>Status</th>
                                    <th>Action</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <script type="text/javascript">
        $(document).ready(function() {
            $(document).on('change', 'input.mark_checkbox', function() {
                var _token = $('input[name="_token"]').val();
                var id = $(this).data('id');
                var checkbox_value = 'false';
                if($(this).is(':checked')){
                    checkbox_value = 'true';
					$(this).parent().children('#marked_as_read_id').html('Checkedbox');
					table.cell($(this).parent()).invalidate().draw();
                }else{
					$(this).parent().children('#marked_as_read_id').html('&#8203;');
					table.cell($(this).parent()).invalidate().draw();
				}
                $.ajax({
                    url: "{{ route('setAsMarked') }}",
                    type: "POST",
                    dataType: "json",
                    data: {
                        id: id,
                        checkbox_value: checkbox_value,
                        _token: _token
                    },
                    success: function(res) {
                       
                    }
                })
            })

            $(document).on('change', 'input.had_yearly_plan', function() {
                var _token = $('input[name="_token"]').val();
                var id = $(this).data('id');
                var checkbox_value = false;
                if($(this).is(':checked')){
                    checkbox_value = true;
					$(this).parent().children('#had_yearly_plan_id').html('Checkedbox');
					table.cell($(this).parent()).invalidate().draw();
                }else{
					$(this).parent().children('#had_yearly_plan_id').html('&#8203;');
					table.cell($(this).parent()).invalidate().draw();
				}
                $.ajax({
                    url: "{{ route('hadYearlyPlan') }}",
                    type: "POST",
                    dataType: "json",
                    data: {
                        id: id,
                        checkbox_value: checkbox_value,
                        _token: _token
                    },
                    success: function(res) {
                       
                    }
                })
            })

            $(document).on('change', 'input.had_kit', function() {
                var _token = $('input[name="_token"]').val();
                var id = $(this).data('id');
                var checkbox_value = false;
                if($(this).is(':checked')){
                    checkbox_value = true;
					$(this).parent().children('#had_kit_id').html('Checkedbox');
					table.cell($(this).parent()).invalidate().draw();
                }else{
					$(this).parent().children('#had_kit_id').html('&#8203;');
					table.cell($(this).parent()).invalidate().draw();
				}
                $.ajax({
                    url: "{{ route('hadKit') }}",
                    type: "POST",
                    dataType: "json",
                    data: {
                        id: id,
                        checkbox_value: checkbox_value,
                        _token: _token
                    },
                    success: function(res) {
                       
                    }
                })
            })
        });    

    </script>

@endsection