@extends('layouts.admin')

@section('content')
<!--App-Content-->
<div class="app-content my-3 my-md-5">
    <div class="side-app">
        <x-page.header>Teaching Team Members</x-page.header>
        @include('admin.errors.form-errors')
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Add New Teaching Team Member</h3>
                    </div>

                    <div class="card-body">
                        <p>Create a Brand new Teaching Team</p>

                        <form method="POST" action="{{route('teacher.team.member.post')}}" class="form-horizontal">
                            @csrf
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Teaching Team <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select name="ttid" class="form-control select2-show-search" required>
                                            @foreach ($teachingTeams as $item)

                                            <option value="{{$item->ttid}}">{{$item->ttname}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Teaching Team Member Type <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select name="ttyid" class="form-control select2-show-search" required>
                                            @foreach ($teachingTeamTypes as $item)

                                            <option value="{{$item->ttyid}}">{{$item->ttyname}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">User <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select name="user_id" class="form-control select2-show-search" required>
                                            @foreach ($users as $item)
                                            <option value="{{$item->id}}">
                                                {{$item->first_name.' '.$item->middle_name.' '.$item->last_name .' - ('.$item->email.')'}}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                             <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Main Teacher <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <label class="form-swich">
                                        <input type="checkbox" name="is_coach" class="form-switch-input" >
                                        <span class="form-switch-indicator"></span>
                                        <span class="form-switch-description"></span>
                                        </label>
                                    </div>
                                </div>
                            </div>


                            <div class="form-group mb-0 row justify-content-end">
                                <div class="col-md-3">
                                    <button type="submit" class="btn btn-primary waves-effect waves-light">Add New
                                        Member</button>
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Teaching Teams List</h3>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table
                                class="data-table-example table table-striped table-bordered table-vcenter text-nowrap">
                                <thead>
                                    <tr>

                                        <th style="text-align: center;">id</th>
                                        <th style="text-align: center;">Name</th>
                                        <th style="text-align: center;">Email</th>
                                        <th style="text-align: center;">Teaching Team</th>
                                        <th style="text-align: center;">Type</th>
                                        <th style="text-align: center;">Main Teacher</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                    $count=0;
                                     @endphp
                                    @foreach ($teachers as $teacher )

                                     <tr class="text-center">
                                         <td>{{++$count}}</td>
                                         <td>{{$teacher->first_name.' '. $teacher->middle_name.' '. $teacher->last_name}}
                                         </td>
                                         <td>{{$teacher->email}}</td>
                                         <td>{{$teacher->ttname}}</td>
                                         <td>{{$teacher->ttyname}}</td>
                                         @if ($teacher->is_coach)
                                         <td>Yes</td>
                                         @else
                                         <td>No</td>

                                         @endif
                                         <td style="text-align: center;">
                                             <div data-bs-toggle="tooltip" data-bs-original-title="Edit">
                                                 <button type="button" value="{{$teacher->ttuid}}"
                                                     class="modal-effect btn btn-outline-light btn-sm waves-effect waves-light edit"
                                                     data-bs-effect="effect-sign" data-bs-toggle="modal"
                                                     data-bs-original-title="Edit" data-bs-target="#edit"><i
                                                         class="fa fa-edit fs-16"></i></button>
                                             </div>
                                             <a href="javascript:void(0)" onClick="confirmDelete(event,{{$teacher->ttuid}})" class="btn btn-outline-light btn-sm waves-effect waves-light"
                                                data-bs-toggle="tooltip" data-bs-original-title="Delete"
                                                title='Delete'>
                                                <i class="fa fa-trash fs-16"></i>
                                                    <form method="POST" action="{{ route('teacher.team.member.destroy', $teacher->ttuid) }}" id="delete-form-{{$teacher->ttuid}}">
                                                        @csrf
                                                        <input name="_method" type="hidden" value="DELETE">
                                                    </form>
                                             </a>

                                         </td>
                                     </tr>

                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Edit form modal -->
<div class="modal  fade effect-sign show" id="edit" tabdocumentation="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="example-Modal3">Edit</h5>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="" id="teachingTeamUserForm" name="teachingTeamUserForm"
                    enctype="multipart/form-data">
                    @csrf
					<div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Teaching Team <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select id="teachingTeam" name="ttid" class="form-control select2-show-search" required>
                                            @foreach ($teachingTeams as $item)

                                            <option value="{{$item->ttid}}">{{$item->ttname}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Teaching Team Member Type <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select name="ttyid" id="teachingTeamMemberType" class="form-control select2-show-search" required>
                                            @foreach ($teachingTeamTypes as $item)

                                            <option value="{{$item->ttyid}}">{{$item->ttyname}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">User <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select name="user_id" id="userName" class="form-control select2-show-search" required>
                                            @foreach ($users as $item)

                                            <option value="{{$item->id}}">
                                                {{$item->first_name.' '.$item->middle_name.' '.$item->last_name .' - ('.$item->email.')'}}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="is_coach">Main Teacher <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <label class="form-swich">
                                        <input type="checkbox" name="is_coach" id='is_coach' class="form-switch-input" >
                                        <span class="form-switch-indicator"></span>
                                        <span class="form-switch-description"></span>
                                        </label>
                                    </div>
                                </div>
                            </div>


            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                <button type="submit" id="submit" class="btn btn-primary" value="">Submit</button>
                <input type="hidden" id="ttu_id" name="ttu_id" value="0">
            </div>
            </form>
        </div>
    </div>
</div>
@endsection
@section('admin-js')
<script>
    $(document).ready(function () {
        // Get Record data using it's id
        jQuery('body').on('click', '.edit', function () {
            var ttu_id = $(this).val();
            $.get('/staff/teacher/team-user/member/' + ttu_id, function (data) {
                jQuery('#ttu_id').val(data.ttu_id);
                jQuery('#teachingTeam').val(data.ttid).change();
                jQuery('#teachingTeamMemberType').val(data.ttyid).change();
                jQuery('#userName').val(data.user.id).change();
				if(data.is_coach == 1){
                            jQuery('#is_coach').attr("checked", "checked");
                        }else{
                            jQuery('#is_coach').attr("checked", false);
						}
                jQuery('#submit').val("update");
                jQuery('#teachingTeamUserForm').attr('action',
                    '/staff/teacher/team-user/member/' + ttu_id)
                // console.log(data.teaching_team.ttname);
                // console.log(data.teaching_team_type.ttyname);
                // console.log(data.user.first_name);
                // console.log(data.user.first_name + ' ' + data.user.middle_name + ' ' + data.user.last_name + ' - (' + data.user.email + ')' )
            })
        });
    })

</script>
@endsection