@extends('layouts.template')
@section('content')
<div class="row">
    <div class="col-xl-12">
        <div class="card">
            <form method="POST" action="{{ route('coaching.store') }}" enctype="multipart/form-data" id="form">
                    @csrf
            <div class="card-header border-0 pt-6">
                <div class="row">
                    <div class="card-title">Coaching Mentoring</div>
                </div>
            </div>
            <div class="col-lg-12 fv-row" style="margin-left:30px;">
                <span class="badge badge-info">Create Date : 2024-12-23<br></span>
            </div>
            <div class="card-body pt-5">
                <div class="col-lg-6 fv-row">
                    <label class="col-lg-12 col-form-label fw-bold fs-7 required">Lokasi Pertemuan</label>
                    <input type="text" name="places" placeholder="Enter Here" class="form-control form-control-solid fw-bold fs-7" required/>
                </div>
                <div class="col-lg-6 fv-row">
                    <label class="col-lg-12 col-form-label fw-bold fs-7 required">SAM/SAS (Pembimbing)</label>
                    <select aria-label="Select Distributor" data-control="select2" data-placeholder="Select Supervisor" class="form-select form-select-solid form-select-lg fw-bold fs-7" name="pembimbing" required>
                        @foreach($sam as $s)
                        <option value="{{$s->id}}">{{$s->name}}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-12">
                    @foreach($question as $q)
                        @if($q->type == 2)
                        <label class="col-lg-12 col-form-label required fw-bold fs-7"><b class="text-primary">{{$q->title}} :</b> {{$q->question}}<span class="badge badge-light-primary"><a href="{{route('coaching.viewpending', encrypt(Auth::user()->username))}}"><u>See all pending details</u></a></span></label>
                        <div class="col-lg-12 fv-row">
                           <table class="table table-bordered" id="dynamicTable">  
                                <tr>
                                    <th class="fw-bold fs-7">Pembahasan</th>
                                    <th class="fw-bold fs-7">Mengapa pembahasan itu penting ?</th>
                                    <th class="fw-bold fs-7">Komitmen</th>
                                    <th class="fw-bold fs-7">Type</th>
                                    <th class="fw-bold fs-7">Due Date Penyelesaian</th>
                                    <th class="fw-bold fs-7"></th>
                                </tr>
                                <tr> 
                                    <input type="text" name="id_question_3" value="{{$q->id_question}}" readonly hidden> 
                                    <td>
                                        <textarea type="text" name="permasalahan[]" placeholder="Pembahasan" class="form-control form-control-solid fw-bold fs-7" rows="3" required /></textarea>
                                    </td> 
                                    <td>
                                        <textarea type="text" name="reason_permasalahan[]" placeholder="Insert Here" class="form-control form-control-solid fw-bold fs-7" rows="3" required /></textarea>
                                    </td> 
                                    <td>
                                        <textarea type="text" name="komitmen[]" placeholder="Komitmen" class="form-control form-control-solid fw-bold fs-7" rows="3" required /></textarea>
                                    </td>
                                    <td>
                                        <select aria-label="Select Type" data-control="select2" data-placeholder="Select Category" class="form-select form-select-solid fw-bold fs-7" name="cat_permasalahan[]" required>
                                             <option value="">- Select Category -</option>
                                             <option value="SDM">SDM</option>
                                             <option value="Operasional">Operasional</option>
                                             <option value="Pos Material">Pos Material</option>
                                             <option value="Produk">Produk</option>
                                             <option value="Program">Program</option>
                                             <option value="Others">Others</option>
                                        </select>
                                    </td>  
                                    <td>
                                        <input type="date" name="due_date[]" placeholder="Enter your Name" class="form-control form-control-solid fw-bold fs-7" required/>
                                    </td>  
                                    <td><button type="button" name="add" id="add" class="btn btn-success btn-sm"><i class="fas fa-plus"></i></button></td>  
                                </tr>  
                            </table> 
                        </div>
                        @elseif($q->type == 1)
                        <div class="col-lg-12 fv-row">
                            <label class="col-lg-12 col-form-label required fw-bold fs-7"><b class="text-primary">{{$q->title}} :</b> {{$q->question}}</label>
                            <input type="text" name="id_question_1[]" value="{{$q->id_question}}" readonly hidden>
                            <textarea class="form-control form-control-lg form-control-solid fw-bold fs-7" aria-label="With textarea" name="answer[]" placeholder="Answer" required></textarea>
                        </div>
                        <br>
                        @else
                        <div class="col-lg-12 fv-row">
                            <label class="col-lg-12 col-form-label required fw-bold fs-7"><b class="text-primary">{{$q->title}} :</b> {{$q->question}}</label>
                            <textarea class="form-control form-control-lg form-control-solid fw-bold fs-7" aria-label="With textarea" name="answer[]" placeholder="Answer" required></textarea>
                        </div>
                        <br>
                        @endif
                    @endforeach
                    </div>    
                    <div class="card-footer d-flex justify-content-end py-6 px-9">
                        <button type="submit" class="btn btn-primary" id="">
                        <i class="fas fa-save"></i>Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<script src="//code.jquery.com/jquery.js"></script>     
<script type="text/javascript">
   
    var i = 0;

    $("#add").click(function(){
   
        ++i;

       
             var rowCount = $('#dynamicTable tr').length;

              var rowCount = $('#dynamicTable tr').length;

              if(rowCount < 7){
                $("#dynamicTable").append('<tr><td><textarea type="text" name="permasalahan[]" placeholder="Pembahasan" class="form-control form-control-solid fw-bold fs-7" rows="3" required/></textarea><input type="text" name="id_question_2[]" value="{{$q->id_question}}" readonly hidden></td><td><textarea type="text" name="reason_permasalahan[]" placeholder="Insert Here" class="form-control form-control-solid fw-bold fs-7" rows="3" required/></textarea></td><td><textarea type="text" name="komitmen[]" placeholder=Komitmen" class="form-control form-control-solid fw-bold fs-7" rows="3" required/></textarea></td><td><select aria-label="Select Type" data-control="select2" data-placeholder="Select Category" class="form-select form-select-solid fw-bold fs-7" name="cat_permasalahan[]" required><option value="">- Select Category -</option><option value="SDM">SDM</option><option value="Operasional">Operasional</option><option value="Pos Material">Pos Material</option><option value="Produk">Produk</option><option value="Program">Program</option><option value="Others">Others</option></select></td><td><input type="date" name="due_date[]" placeholder="" class="form-control form-control-solid fw-bold fs-7" required /></td><td><button type="button" name="add" id="add" class="btn btn-danger btn-sm remove-tr"><i class="fas fa-trash"></i></button></td></tr>');
              }
            
        // }
        
   
        
    });
   
    $(document).on('click', '.remove-tr', function(){  
         $(this).parents('tr').remove();
    });  
   
</script>
@endsection