@extends('layouts.admin.master')

@section('title')Fee Plan
 {{ $title }}
@endsection


@push('css')
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/date-picker.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/select2.css') }}">
@endpush
<style>
    .box{
        position:absolute;
        top:15px;
        left:15px;
    }
</style>
@section('content')	
	<div class="container-fluid">
    <div class="page-header">
      <div class="row">
        <div class="col-lg-6">
          <h3>Academic</h3>
          <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('index') }}">Home</a></li>
            <li class="breadcrumb-item"><a href="{{ route('index') }}">Settings</a></li>    
            <li class="breadcrumb-item"><a href="{{ route('index') }}">Financial Year</a></li>            

          </ol>
        </div>
        <div class="col-lg-6">
          <!-- Bookmark Start-->
          <div class="bookmark">
            <ul>
              <li><button class="btn btn-primary-light" type="button">Add FY</button></li>             
            </ul>
          </div>
          <!-- Bookmark Ends-->
        </div>
      </div>
    </div>
</div>
	<div class="container-fluid">
	    <div class="row">
	        <div class="col-lg-5 col-sm-12">
	            <div class="card">
	                <div class="card-body">
                        <form>
	                    <div class="form theme-form">	                       	                        
                            <div class="row">	                            	                            
                                <div class="mb-3">
                                    <label>Course</label>
                                    <select class="js-example-basic-single col-sm-12" id="courseList" name ="courseList">                                                                                                         
                                        
                                    </select>
                                </div>                            
	                        </div>                            
                            <div class="row">
	                            <div class="col">
	                                <div class="mb-3">
                                        <label>Plan Type</label>                                        
                                        <div class="form-group m-t-15 m-checkbox-inline mb-0 custom-radio-ml">
                                            <div class="radio radio-primary">
                                                <input id="radioinline1" type="radio" name="radio1" value="installment" checked>
                                                <label class="mb-0" for="radioinline1">Installment</label>
                                            </div>
                                            <div class="radio radio-primary">
                                                <input id="radioinline2" type="radio" name="radio1" value="downpayment">
                                                <label class="mb-0" for="radioinline2">One Time</label>
                                            </div>
                                        </div>                                  
	                                </div>                                    
	                            </div>
	                        </div>
                            <div class="row">
	                            <div class="col">
	                                <div class="mb-3">
                                        <label>Payment Mode</label>                                        
                                        <div class="form-group m-checkbox-inline mb-0 custom-radio-ml">
                                            <div class="checkbox checkbox-dark">
                                                <input id="inline-1" type="checkbox">
                                                <label for="inline-1">Option<span class="digits"> 1</span></label>
                                            </div>
                                            <div class="checkbox checkbox-dark">
                                                <input id="inline-2" type="checkbox">
                                                <label for="inline-2">Option<span class="digits"> 2</span></label>
                                            </div>
                                        </div>                                  
	                                </div>                                    
	                            </div>
	                        </div>    
                            <div class="row">	                            	                            
                                <div class="mb-3">
                                    <label>No of Installment</label>
                                    <select class="form-select" name="totalInstallment" id="totalInstallment">
                                        <option value="">select installment count</option>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                        <option value="6">6</option>
                                        <option value="7">7</option>
                                        <option value="8">8</option>
                                        <option value="9">9</option>
                                        <option value="10">10</option>
                                    </select>
                                </div>                            
	                        </div>                                                   
                            <div class="row">	                            	                            
                                <div class="mb-3">
                                    <label>Status</label>
                                    <select class="form-select" name="status" id="status">
                                        <option value="Active">Active</option>
                                        <option value="Inactive">Inactive</option>
                                    </select>
                                </div>                            
	                        </div>
                            <div class="row">	                            	                            
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-bordernone" id="installmentDiv">
                                        <thead>
                                            <tr>                                        
                                                <th>Sno</th>
                                                <th>Days</th>
                                                <th>Amount</th>                                                
                                            </tr>
                                        </thead>
                                        <tbody>                                            
                                        </tbody>                           
                                        </table>
                                    </div>
                                </div>
	                        </div>
                            <div class="row">
                                <div class="col mb-3">
                                <div>
                                    <label class="form-label" for="exampleFormControlTextarea9">Remark</label>
                                    <textarea class="form-control" id="exampleFormControlTextarea9" rows="3" id="remark" name="remark"></textarea>
                                </div>
                                </div>
                            </div>                                              	                        
	                        <div class="row">                                                            
	                            <div class="col justify-content-center">
	                                <div class="text-center"><button class="btn btn-primary" type="submit">Add Plan</button></div>
	                            </div>
	                        </div>
	                    </div>
                        </form>
	                </div>
	            </div>
	        </div>
            <div class="col-lg-7 col-sm-12">
                 <div class="job-sidebar">	                
	                <div class="custom-scrollbar">
	                    <div class="default-according style-1 faq-accordion job-accordion" id="accordionoc">
	                        <div class="row">
	                            <div class="col-xl-12">
	                                <div class="card">
	                                    <div class="card-header">
	                                        <h5 class="mb-0 p-0">
	                                            <button class="btn btn-link ps-0">Search Course</button>
	                                        </h5>
	                                    </div>
	                                    <div class="collapse show" id="collapseicon" aria-labelledby="collapseicon" data-parent="#accordion">
	                                        <div class="card-body filter-cards-view animate-chk">
	                                            <div class="job-filter mb-3">
                                                <select class="js-example-basic-single col-sm-12" id="courseList" name ="courseList">                                                                                                         
                                                </select>
	                                            </div>                                           	                                            
	                                        </div>
	                                    </div>
	                                </div>
	                            </div>
	                        </div>
                            <div class="row">
                                <div class="col-12 ">                                    
                                    <div class="card custom-card">                                           
                                        <div class="text-center profile-details">
                                        <span class="badge badge-primary box outline">Active</span>
                                            <h4><a href="social-app.html" alt="">RB # GZ #2 022-23</a></h4>
                                            <h6>Bhagalpur</h6>
                                        </div>
                                        <h6>Fee distribution :</h6>
                                        <div class="card-footer row">                                                
                                            <div class="col-4 col-sm-4">
                                                <h6>Tution Fee</h6>
                                                <h3 class="counter">9564</h3>
                                            </div>
                                            <div class="col-4 col-sm-4">
                                                <h6>Exam Fee</h6>
                                                <h3><span class="counter">49</span>K</h3>
                                            </div>
                                            <div class="col-4 col-sm-4">
                                                <h6>Infra Fee</h6>
                                                <h3><span class="counter">96</span>M</h3>
                                            </div>
                                        </div>
                                        <div class="card-footer row">
                                            <div class="col-6 col-sm-6">
                                                <h6>SM Fee</h6>
                                                <h3 class="counter">9566</h3>
                                            </div>
                                            <div class="col-6 col-sm-6">
                                                <h6>Admission Fee</h6>
                                                <h3><span class="counter">49</span>K</h3>
                                            </div>                                                
                                        </div>
                                    </div>                                    
                                </div>
                            </div>
	                    </div>
	                </div>
	            </div>
            </div>
	    </div>
	</div>

	
	@push('scripts')
	<script src="{{ asset('assets/js/datepicker/date-picker/datepicker.js') }}"></script>
    <script src="{{ asset('assets/js/datepicker/date-picker/datepicker.en.js') }}"></script>
    <script src="{{ asset('assets/js/datepicker/date-picker/datepicker.custom.js') }}"></script>
    <script src="{{ asset('assets/js/setting/installment.js') }}"></script>
    <script src="{{ asset('assets/js/select2/select2.full.min.js') }}"></script>
    <script src="{{ asset('assets/js/select2/select2-custom.js') }}"></script>
	@endpush

@endsection