@extends('layouts.app')
@push('css')
@endpush
@section('content')
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <div class="d-inline p-2  text-dark" style="font-size: 26px;font-weight: bold">Venue Coordinator</div>
                </div>
                <!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li><a href="{{ route('home') }}" class="btn btn-info btn-sm m-1"><i class="fas fa-home"></i>
                                Home</a>
                        </li>
                    </ol>
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->
    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">
            <!-- Main row -->
            <div class="row">
                <div class="col-md-12 col-x-12 col-sm-12">
                    <form action="{{ route('venue.coordinator.store') }}" method="POST">
                        @csrf
                        <div class="row">
                            <div class="col-md-8 col-xs-8 col-sm-8">
                                <div class="form-group">
                                    <label for="venue">Venue Name</label>
                                    <select id="selectVenue"
                                        class="js-example-basic-single form-control @error('venue_id') is-invalid @enderror"
                                        name="venue_id">
                                        <option value="">Select</option>
                                        @foreach ($venues as $venue)
                                            <option value="{{ $venue->id }}">{{ $venue->name }}</option>
                                        @endforeach
                                    </select>
                                    @error('venue_id')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>

                        </div>
                        <div class="col-md-8 col-xs-8 col-sm-8">

                            <div class="form-group">
                                <label for="username">User Name</label>
                                <input id="username" type="text" placeholder="User Name"
                                    class="form-control @error('username') is-invalid @enderror" name="username"
                                    value="{{ old('username') }}" />
                                @error('username')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>


                            <div class="form-group">
                                <label for="fname">Full Name</label>
                                <input id="fname" type="text" placeholder="Full Name"
                                    class="form-control @error('fname') is-invalid @enderror" name="fname"
                                    value="{{ old('fname') }}" />
                                @error('fname')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>

                            <div class="form-group">
                                <label for="email">Email</label>
                                <input id="email" type="email" placeholder="Email"
                                    class="form-control @error('email') is-invalid @enderror" name="email"
                                    value="{{ old('email') }}" />
                                @error('email')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>


                            <div class="form-group">
                                <label for="phone">Contact Number</label>
                                <input id="phone" type="text" placeholder="phone"
                                    class="form-control @error('phone') is-invalid @enderror" name="phone"
                                    value="{{ old('phone') }}" />
                                @error('phone')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>

                        </div>




                        <input type="submit" onclick="values()"class="btn btn-sm btn-success" value="Create">
                    </form>
                </div>
            </div>



            <br><br>
            <hr>
            <h3><b>Assign Venue Coordinator</b></h3>
            <div class="col-md-12 col-x-12 col-sm-12">

                <form action="#" method="POST">
                    @csrf
                    <div class="row">
                        <div class="col-md-8 col-xs-8 col-sm-8">
                            <div class="form-group">
                                <label for="venue">Venue Name</label>
                                <select id="selectVenue1"
                                    class="js-example-basic-single form-control @error('venue_id') is-invalid @enderror"
                                    name="venue_id">
                                    <option value="z">Select</option>
                                    @foreach ($venues as $venue)
                                        <option value="{{ $venue->id }}">{{ $venue->name }}</option>
                                    @endforeach
                                </select>
                                @error('venue_id')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>

                    </div>

            </div>
{{-- 
            <div class="container">
                <div class="search">
                    <input type="search" name="search" id="search" placeholder="Search for Course Coordinator"
                        class="form-control">


                </div>



            </div>

            <div class="container">

                <table class="table table-bordered" id="Content">



                </table>

            </div>
 --}}

 <div class="card card-info">
    <fieldset class="external">
        <legend class="scheduler-border" style="width: auto;">Input Specific Query</legend>
        <div class="row">


            <div class="col-md-3 col-xs-3 col-sm-3">
                <div class="form-group">
                    <label for="pds">PDS ID:</label>
                    <input name="pds" id="pds" type="text" placeholder="PDS ID"
                        class="form-control @error('pds') is-invalid @enderror"
                        value="{{ old('pds') }}" />
                    @error('pds')
                        <span class="invalid-feedback" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
            </div>


            <div class="col-md-3 col-xs-3 col-sm-3">
                <div class="form-group">
                    <label for="nid">NID Number</label>
                    <input name="nid" id="nid" type="text" placeholder="NID Number"
                        class="form-control @error('nid') is-invalid @enderror"
                        value="{{ old('nid') }}" />
                    @error('nid')
                        <span class="invalid-feedback" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
            </div>
          
            <div class="col-md-3 col-xs-3 col-sm-3">
                <div class="form-group">
                    <label for="phone">Phone Number</label>
                    <input name="phone" id="e_phone" type="text" placeholder="Phone Number"
                        class="form-control @error('phone') is-invalid @enderror"
                        value="{{ old('phone') }}" />
                    @error('phone')
                        <span class="invalid-feedback" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
            </div>
            <div class="form-group">
                <label for="email">Email</label>
                <input id="e_email" type="email" placeholder="Email"
                    class="form-control @error('email') is-invalid @enderror" name="email"
                    value="{{ old('email') }}" />
                @error('email')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
            </div>

        </div>
        <button type="button" class="btn btn-success" onclick="searchSpecificCoordinator()"> Search
        </button>

</fieldset>
</div>
</div>


<div class="row">
   

    <div class="card card-info">
    <div class="col-md-9 col-sm-9 col-lg-9">
       
        <div id="gg"></div>
    </div>


</div>



    <div class="row">
        <div class="col-md-6 col-sm-6 col-lg-6">
            <div id="view"></div>
        </div>
        <div class="col-md-6">
            <div id="info">

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


            <!-- /.row (main row) -->
        </div>
        <!-- /.container-fluid -->
    </section>
    <!-- /.content -->
@endsection
@push('js')
    <script>






function searchSpecificCoordinator() {

var pds_id = $("#pds").val();
var nid = $("#nid").val();
var phone = $("#e_phone").val();
var email = $("#e_email").val();



$.ajax({
    url: '{{ route('specificTrainer.search') }}',
    type: "POST",

    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    },
    data: {
        pds_id: pds_id,
        nid: nid,
        phone: phone,
        email: email

    },
    beforeSend: function() {
        $('#wait').show();
    },
    success: function(data) {

        if (data == 1) {
            Swal.fire({
                title: '<strong>Sorry, No matching record Found</strong>',
                type: 'error',
                html: 'Problem: ' + 'No Teachers data match with input credentials' +
                    '</br> Please try again! </br>',
                showCloseButton: true
            });
        } else {
            console.log(data.id);


            displayUsers3(data);
        }
    },
    error: function(err) {
        $('#wait').hide();
    },
    complete: function() {
        $('#wait').hide();
    }



});
}






let displayUsers3 = (data) => {



let htmlTemplate = '';

htmlTemplate += ` <br><br><table class="table table-bordered table-hover">
    <thead>
    <tr>
        <th scope="col">#</th>
        <th scope="col">Select</th>
        <th scope="col">Full Name</th>
        <th scope="col">Email</th>
        <th scope="col">Designation</th>
    </tr>
    </thead>
    <tbody>`;
i = 1;
htmlTemplate += `
<tr>
<th scope="row"> ${i}</th>
<td> <input id="ad_Checkbox${data.id}" onclick="selectOrgChildRec(this)"  class="ads_Checkbox" type="checkbox" value="${data.id}" /> </td>
<td>
    ${data.full_name}
</td>
<td>${data.email}</td>

<td>${data.designation}</td>


</tr>`

htmlTemplate += `   </tbody>
    </table>
    <br>

    <input type="button" class="btn btn-sm btn-success" id="save_value" name="save_value" onclick="saveCoordinator()" value="Save" />
<br> <br>
    `;

document.querySelector('#gg').innerHTML = htmlTemplate;
}








function saveCoordinator() {

var venueId = $("#selectVenue1").val();
        if (venueId == 'z') {
            alert("No venue selected! Please select a course!!");
            return;
        }


var arr = $('.ads_Checkbox:checked').map(function() {
return this.value;
}).get();


if (arr.length < 1 ) {
alert("No Coordinator selected! Please select a course coordinator!!");
return;
}

$.ajax({
url: '{{ route('specificVenueCoordinator.store') }}',
type: "POST",

headers: {
    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: {
    data: arr,
    venueId  : venueId 
   

},
beforeSend: function() {
    $('#wait').show();
},
success: function(data) {

    if (data == 2) {
        swal("Success!",
            "The venue coordinator has been added and duly notified!",
            "success")


    } else {
        Swal({
            title: 'Error!',
            text: 'The venue coordinator could not be added : ' 
            
        })
    }

},
error: function(err) {
    $('#wait').hide();
},
complete: function() {
    $('#wait').hide();
}


});




}



























        $('#search').on('keyup', function() {

            var venueId = $("#selectVenue1").val();
            console.log(venueId);
            if (venueId == 'z') {
                alert("No venue selected! Please select a venue!!");
                return;
            }

            $venue = venueId;

            $value = $(this).val();

            $.ajax({

                type: 'get',
                url: '{{ URL::to('search/VenueCoordinator') }}',
                data: {
                    'search': $value,
                    'venue': $venue
                },
                success: function(data) {
                    console.log(data);
                    $('#Content').html(data);
                }


            });



        })






        function addVenueCoordinator(id) {

            var venueId = $("#selectVenue1").val();

            var courseId = $("#selectCourse1").val();
            var u_id = id;
            if (venueId == 'z') {
                alert("No venue selected! Please select a venue!!");
                return;
            }
            var JsonData = {
                venueId: venueId,
                u_id: u_id,
                _token: "{{ csrf_token() }}"
            }
            $.ajax({
                url: '{{ route('add.venueCoordinator') }}',
                type: "POST",
                dataType: "json",
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: JsonData,
                success: function(data) {
                    swal({
                        title: "Success!",
                        text: "The selected person has been added as a Venue Coordinator!",
                        icon: "success",
                        button: "Close",
                    });
                }
            });

        }












        function values() {
            var venueId = $("#selectVenue").val();

            var Full_N = $("#fname").val();

            var email = $("#email").val();
            var phone = $("#phone").val();


            console.log(venueId);
            console.log(Full_N);
            console.log(email);
            console.log(phone);
        }
    </script>
@endpush