@extends('layouts.admin')
@section('content')

<div class="card">      
    <div class="card-body">
        <div class="card-title">
           <h3> Training Allowance form </h3>
        </div>
        <form method="POST" action="{{route('allowance-store')}}">
            @csrf
              <div class="row">
                <div class="col-md-12">
                    <div class="form-group">
                        <label class="">Trainee</label>
                        <select class="form-control" name="user_id">
                            <option value="" selected>Select Trainee</option>
                            @foreach($users as $key => $user)
                                <option value="{{$user->user->id}}">{{$user->user->name}}</option>                       
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="form-group">
                        <label for="present">Total Present (days)</label>
                        <input type="text" id="present" name="total_present" class="form-control">
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="form-group">
                        <label for="absent"> Total Absent (days)</label>
                        <input type="text" id="absent" name="total_absent" class="form-control">
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="form-group">
                        <label for="honorarium">Per day Honorarium</label>
                        <input type="text" disabled id="honorarium" class="form-control" value="{{$course_setting->per_day_honorarium}}">
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="form-group">
                        <b>Total payable : <span class="payable_amount">0</span> TK</b>
                        <input type="hidden" value="0" name="total_payable_amount" class="total_payable_amount" >
                        <input type="hidden" value="{{$course->id}}" name="course_id" >
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="form-group">
                        <label for="p_method">Payment Method</label>
                        <select class="form-control" id="p_method" name="payment_method">
                            <option value="" selected>Select Payment Method</option>
                            <option value="cash">Cash</option>
                            <option value="mobile_banking">Mobile Banking</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-12 mobile_banking_number d-none">
                    <div class="form-group">
                        <label for="m_number">Mobile Banking Number</label>
                        <input type="text" id="m_number" name="mobile_banking_number" class="form-control">
                    </div>
                </div>
              </div>
                <div class="form-group">
                    <button class="btn btn-success" type="submit">
                        Submit
                    </button>
                </div>
        </form>
    </div>
</div>



@endsection

@section('scripts')
<script>
     $(document).ready(function () {
        $('#p_method').on('change', function() {
            if($(this).val()=='mobile_banking')
            {
                $('.mobile_banking_number').removeClass('d-none');
            }else{
                $('.mobile_banking_number').addClass('d-none');
            }
        })
        $('#present').on('keyup change',function() { 
           let present_days=parseInt($(this).val());
           let honorarium= parseInt($('#honorarium').val());
           let total_payable_amount=present_days*honorarium;
           $('.payable_amount').text(total_payable_amount)
           $('.total_payable_amount').val(total_payable_amount)
         });
     })
</script>
@endsection