@extends('layouts.teacher')

<title>{{ config('app.name', 'Laravel') }} | Teacher | Students</title>
<style>
    .edit:hover {
        color: #fff !important;
        background-color: blue !important;
        border-color: #696cff !important;
        border-radius: 5px !important;
    }

    .delete:hover {
        color: #fff !important;
        background-color: #E3242B !important;
        border-color: #E3242B !important;
        border-radius: 5px !important;
    }

    .dtbl_dropdown .dataTables_length {
        width: 65px;
    }

    .dtbl_dropdown .dataTables_length label {
        width: 100%;
    }
</style>
<link rel="stylesheet" href="assets/css/toggle.css">
@section('main-content')


    <div class="content-wrapper">
        <!-- Content -->
        <div class="container-xxl container-p-y row">
            <div class="col-6">
                <h4 class="fw-bold py-2"><span class="text-muted fw-light">Records /</span> Students Details</h4>
                <h5>( {{ isset($class_name->class) ? $class_name->class : 'Class not assigned' }} )</h5>
            </div>


            <!-- Basic Bootstrap Table -->
            <div class="card pb-5 ms-3">
                <h5 class="pt-3">Students List</h5>
                <div class="table dataTable text-nowrap dtbl_dropdown">
                    <table class="table" id="services">
                        <thead>
                            <tr>
                                <th class="d-none">#</th>
                                <th class="text-center">User</th>
                                <th class="ps-1">First Name</th>
                                <th class="ps-1">Last Name</th>
                                <th class="ps-1">Email</th>
                                <th class="ps-1">Phone</th>
                                <th class="text-center">Status</th>
                                <th class="text-center">Action</th>
                            </tr>
                        </thead>
                        <tbody class="table-border-bottom-0">
                            @if (count($users) != 0)
                                @foreach ($users as $key => $user)
                                    <!-- {{ $pic = $user->profile_photo_path }} -->
                                    <tr id="row_{{ $user->id }}">
                                        <td class="d-none">{{ $key + 1 }}</td>
                                        @if ($user->profile_photo_path)
                                            <td class="text-center">
                                                <img src="{{  $user->profile_photo_path }}"
                                                    alt="user" width="50" height="50" class="rounded-circle" />
                                            </td>
                                        @else
                                            <td class="text-center">
                                                <img src="{{ URL::asset('assets/images/users/avatar.jpg') }}" alt="user"
                                                    width="50" height="50" class="rounded-circle" />
                                            </td>
                                        @endif
                                        <td class="ps-1 name_{{ $user->id }}">{{ ucwords($user->first_name) }}</td>
                                        <td class="ps-1 name_{{ $user->id }}">{{ ucwords($user->last_name) }}</td>

                                        <td class="ps-1 phone_{{ $user->id }}">
                                            @if ($user->parent_id !== null)
                                                {{ $user->parent->email }}
                                            @else
                                                {{ $user->email }}
                                            @endif
                                        </td>

                                        <td class="ps-1 phone_{{ $user->id }}">
                                            @if ($user->parent_id !== null)
                                                {{ $user->parent->phone }}
                                            @else
                                                {{ $user->phone }}
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            @if ($user->parent_id !== null && $user->parent)
                                                @if ($user->parent->status == 'active' && $user->status == 'active')
                                                       Active
                                                  
                                                @else
                                                        In-Active
                                                 
                                                @endif
                                            @else
                                                @if ($user->status == 'active')
                                                       Active
                                                   
                                                @else
                                                        In-Active
                                                   
                                                @endif
                                            @endif
                                        </td>
                                        <td class="text-center"><a class="dropdown-item view"
                                                href="/studentdetail/{{ $user->id }}"><i class="bx bx-detail"></i>
                                                view</a></td>
                                    </tr>
                                @endforeach
                            @else
                                <tr>
                                    <td><span>{{ 'No record found' }}</span></td>
                                </tr>
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- / Content -->
    </div>
@endsection
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
    function usersstatus(id) {

        var mainParent = $('#' + id);


        if ($(mainParent).find('input.cb-value').is(':checked')) {
            $(mainParent).addClass('active');
            var status = "active";
        } else {
            $(mainParent).removeClass('active');
            var status = "in-active";
        }

        var formData = new FormData();

        formData.append('uuid', id);
        formData.append('status', status);
        $.ajax({
            type: "post",
            url: "{{ url('/active-user') }}",
            contentType: 'application/json',
            cache: false,
            contentType: false,
            processData: false,
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            data: formData,
            success: function(data) {
                if ($.isEmptyObject(data.error)) {
                    success = data.success;
                    const messageContainer = $('#messageContainer');
                    messageContainer.empty();
                    if (data.success) {
                        // Add the success message to the #messageContainer
                        messageContainer.html('<div class="alert alert-success">' + data.success +
                            '</div>');
                        setTimeout(function() {
                            messageContainer.empty();
                        }, 2000);
                    } else {
                        // Add the error message to the #messageContainer
                        messageContainer.html(
                            '<div class="alert alert-danger">Error: Something went wrong</div>');
                        setTimeout(function() {
                            messageContainer.empty();
                        }, 2000);
                    }
                    //  window.location.href = data.success;
                } else {
                    // printErrorMsg(data.error);
                    $.each(data.error, function(field_name, error) {
                        // $(document).find('[name='+field_name+']').after('<span class="text-strong text-danger">' +error+ '</span>')
                        $(document).find('#' + field_name + '').closest('div').after(
                            '<span class="text-strong text-danger">' + error + '</span>')
                    })
                }
            }

        })
    }
</script>