@extends('admin.master')

@section('content')

<!-- Content Header (Page header) -->
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
           
          </div>
          <div class="col-sm-6">
            <div class="search-box col-md-12">   
            <!-- todo1  -->
        <form action="">
            <div class="input-group mb-12">
                <select class="form-control" id="filter-id">
                  <option value="" disabled selected>Students by admission</option>
                  <option value="">All</option>
                  <option value="yes">Admitted</option>
                  <option value="no">Not admitted</option>
                </select>
                
                <div class="input-group-append">
                  {{-- <button onclick="foo1()" type="button" id="filter-btn"> test</button> --}}
                  <button  type="button" id="filter-btn" onclick="foo1()" class="btn btn-primary">Search</button>
                 
                </div>
            </div>
        </form>
    </div>
          </div>
        </div>
      </div><!-- /.container-fluid -->
    </section>

     @if(session()->has('message'))
    <div class="alert alert-success">
        {{ session()->get('message') }}
    </div>
@endif

    <!-- Main content -->
    <section class="content">
      <div class="row">
        <div class="col-12">

     

          <div class="card">
            <div class="card-header">
              <h3 class="card-title">DataTable with default features</h3>
            </div>
            <!-- /.card-header -->
            <div class="card-body">
              <table id="example1" class="table table-bordered table-striped">
                <thead>
                <tr>
                  <th>Name</th>
                  <th>Admission</th>
                  <th>Batch Name</th>
                  <th>Course Name</th>
                  <th>Action</th>
                </tr>
                </thead>
                <tbody>

              @foreach($datas as $data) 
                	<!-- todo3 -->
                <tr data-admission="status-{{ $data->status }}">
                  <td>{{$data->name}}</td>
                  <td>{{$data->status}}</td>
                  <td>{{$data->batch_name}}</td>
                  <td>{{$data->course_name}}</td>
                  
                  <td>
                  	  
                    <button type="button" class="btn btn-primary" data-target-id="modal_{{ $data->id }}" data-toggle="modal" data-target="#modal_{{ $data->id }}">
                    <i class="fa fa-check" aria-hidden="true"></i>
                  </button>

                  <button type="button" class="btn btn-primary" data-target-id="modal_{{ $data->id }}-2" data-toggle="modal" data-target="#modal_{{ $data->id }}-2">
                    <i class="fas fa-eye"></i>
                  </button>
              	  </td>
                </tr>
                
                @endforeach
                
                </tbody>
                <tfoot>
                
                </tfoot>
              </table>
            </div>
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </section>
    <!-- /.content -->



       @foreach($datas as $datav)
        <div class="modal fade" id="modal_{{ $datav->id }}">
        <div class="modal-dialog modal-xl">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">Admission approval & </h4>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
              

              <form method="post" action="{{route('admission.update',$datav->id)}}">
                @csrf
                @method('put')
                
                <div class="form-group">
                  <label for="exampleFormControlSelect1">Select Batch</label>
                 
                  <select class="form-control" id="exampleFormControlSelect1" name="batch_name">
                    <option selected="">Select Batch</option>
                      @foreach($datav->batchInfo as $batch)
                      <option value="{{$batch->batch}}">{{$batch->batch}}</option>
                      @endforeach
                  </select>
                
                </div>

                <div class="form-group">
                  <label for="exampleFormControlSelect1">Select batch</label>
                 
                  <select class="form-control" required="required" id="exampleFormControlSelect1" name="status">
                    <option value="" >Select Admission</option>
                      
                      <option value="yes">Yes</option>
                      <option value="no">No</option>
                      
                  </select>
                
                </div>
                
                <button type="submit" class="btn btn-primary">Submit</button>
              </form>


            </div>

          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      <!-- /.modal -->

    @endforeach  

    @foreach($details_info as $datas)
        <div class="modal fade" id="modal_{{ $datas->id }}-2">
        <div class="modal-dialog modal-xl" style="max-width: 60%">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">Details Information</h4>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
              <div class="contact-form">
                    <div id="cv_format">
                      

                      <div id="cv_format">
                      

                      <div class="col-md-12">

                        <div class="row">
                        
                          <div class="col-md-4"></div>

                          <div class="col-md-4">
                            
                            <div>
                              
                              <!-- <h3>
                                
                                <u>Details Information</u>

                              </h3> -->

                            </div>

                          </div>

                          <div class="col-md-4">
                            

                          </div>

                        </div>


                        <!-- personal info -->
                        
                        <div class="row">
                          
                          <div class="col-md-10" >
                            
                            <div>
                            
                           <div class="row">
                              
                              <div class="col-md-3">
                                <span>Name</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->name}}</span>
                              </div>

                            </div>


                            <div class="row">
                              
                              <div class="col-md-3">
                                <span>Address</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->address}}</span>
                              </div>

                            </div>

                            <div class="row">
                              
                              <div class="col-md-3">
                                <span>Email Address</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->email}}</span>
                              </div>

                            </div>

                            <div class="row">
                              
                              <div class="col-md-3">
                                <span>Phone Number</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->phone_number}}</span>
                              </div>

                            </div>

                            <div class="row">
                              
                              <div class="col-md-3">
                                <span>Course Name</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->course_name}}</span>
                              </div>

                            </div>
                            @if($datas->status == "no")

                      

                            @else
                            <div class="row">
                              
                              <div class="col-md-3">
                                <span>Admission Status</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->status}}</span>
                              </div>

                            </div>

                            @endif

                            @if($datas->batch_name == "no")

                              else
                              <div class="row">
                              
                              <div class="col-md-3">
                                <span>Batch Name</span>
                              </div>

                              <div class="col-md-5">
                                <span>: {{$datas->batch_name}}</span>
                              </div>

                            </div>

                            @endif


                            </div>

                          </div>  

                          <div class="col-md-2">
                            
                            <img src="">

                          </div>

                        

                      </div>

                      <!-- personal info finished here -->

                      <hr>

                      
                    </div>



                    </div>
                </div>


                    </div>
                </div>
            </div>
            <div class="modal-footer">
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
    @endforeach    
        <!-- /.modal-dialog -->
      </div>

@endsection




<script>
  // todo2
  // function foo(){
  //   alert(1)
  // }
  function foo1(){
    // alert(1)
    // return ;
    let t = document.querySelector("#filter-id").value
    console.log(t)
    let arr = [];
    if(t == 'yes'){
        arr = [...document.querySelectorAll("[data-admission='status-yes']")] 

        for(let i =0 ; i<arr.length ; i+=1) {
            arr[i].style.display = ""
        }
         arr = [...document.querySelectorAll("[data-admission='status-no']")] 

        for(let i =0 ; i<arr.length ; i+=1) {
            arr[i].style.display = "none"
        }        
    }else if( t == 'no'){
        arr = [...document.querySelectorAll("[data-admission='status-yes']")] 

        for(let i =0 ; i<arr.length ; i+=1) {
            arr[i].style.display = "none"
        }
         arr = [...document.querySelectorAll("[data-admission='status-no']")] 

        for(let i =0 ; i<arr.length ; i+=1) {
            arr[i].style.display = ""
        }  
    }else {
        arr = [...document.querySelectorAll("[data-admission]")] 

        for(let i =0 ; i<arr.length ; i+=1) {
            arr[i].style.display = ""
        }
    }
  }
</script>