@push('css')
<link href="{{asset('assets/libs/select2/css/select2.min.css')}}" rel="stylesheet" type="text/css">
@endpush
<div class="row">
	<div class="col-lg-6">
		<div class="mb-3">
			<label>Perihal</label>
			{!! Form::text('perihal',null,['class'=>'form-control','placeholder'=>'input perihal']) !!}
		</div>
	</div>
	<div class="col-md-6">
		<div class="mb-3">
			<label>Invoice pengajuan</label>
			{!! Form::file('file_dokumen',['class'=>'filestyle','data-buttonname'=>'btn-primary']) !!}
			<span style="color:orange;"> *gunakan file dalam bentuk pdf</span>
		</div>
	</div>
	<div class="col-lg-12">
		<div class="mb-3">
			<label>Keterangan</label>
			{!! Form::textarea('keterangan',null,['class'=>'form-control','placeholder'=>'input keterangan']) !!}
		</div>
	</div>
</div>

<div class="row">
	<h4>Item penggunaan dana</h4>
	<div class="col-md-5">
		<div class="mb-3">
			<label>Penggunaan dana</label>
			{!! Form::text('label[]',null,['class'=>'form-control','placeholder'=>'input penggunaan dana','required'=>'required']) !!}
		</div>
	</div>
	<div class="col-md-5">
		<div class="mb-3">
			<label>Nominal (Rp)</label>
			{!! Form::text('nominal[]',null,['class'=>'form-control input-mask text-start','data-inputmask'=>"'alias': 'numeric', 'groupSeparator': ',', 'digits': 0, 'digitsOptional': false, 'prefix': '', 'placeholder': '0'",'required'=>'required']) !!}
		</div>
	</div>
</div>
<div class="prepend">

</div>
<div class="col-md-12">
	<a class="btn btn-warning add-item"><i class="fa fa-plus"></i>	Tambah Item</a>
</div>
<div class="row">
	<div class="col-md-12">
		<br>
		<h4>Pajak</h4>
	</div>
	<div class="col-md-6">
		<div class="mb-3">
			<label>PPN (%)</label>
			{!! Form::number('ppn',null,['class'=>'form-control','placeholder'=>'input ppn','step'=>'0.01','min'=>0,'required'=>'required']) !!}
		</div>
	</div>
	<div class="col-md-6">
		<div class="mb-3">
			<label>Bersifat memotong</label>
			{!! Form::select('memotong',['1'=>'Ya','0'=>'Tidak'],null,['class'=>'form-control']) !!}
		</div>
	</div>
	<div class="col-md-6">
		<div class="mb-3">
			<label>PPH (%)</label>
			{!! Form::number('ppn',null,['class'=>'form-control','placeholder'=>'input pph','step'=>'0.01','min'=>0,'required'=>'required']) !!}
		</div>
	</div>
	<div class="col-md-6">
		<div class="mb-3">
			<label>Bersifat memotong</label>
			{!! Form::select('memotong',['1'=>'Ya','0'=>'Tidak'],null,['class'=>'form-control']) !!}
		</div>
	</div>
</div>
@push('js')
<script src="{{asset('assets/libs/admin-resources/bootstrap-filestyle/bootstrap-filestyle.min.js')}}"></script>
<script src="{{asset('assets/libs/select2/js/select2.min.js')}}"></script>
<script src="{{asset('assets/libs/inputmask/jquery.inputmask.min.js')}}"></script>
<script type="text/javascript">
	$('.role').select2({
		width:'100%',
		placeholder:'pilih role',
	});

	$(document).ready(function(){$(".input-mask").inputmask()});

	$(document).ready(function(){
		$('.group-span-filestyle').find('label').removeClass('btn-secondary').addClass('btn-primary');
	});

	$('.add-item').click(function(){
		$('.prepend').append($('#item-template').html());
		$(".input-mask").inputmask();
	});

	$('body').on('click','.btn-cancel',function(){
		$(this).closest('.row').remove();
	});
</script>

<script type="text/template" id="item-template">
	<div class="row">
		<div class="col-md-5">
			<div class="mb-3">
				<label>Penggunaan dana</label>
				{!! Form::text('label[]',null,['class'=>'form-control','placeholder'=>'input penggunaan dana','required'=>'required']) !!}
			</div>
		</div>
		<div class="col-md-5">
			<div class="mb-3">
				<label>Nominal (Rp)</label>
				{!! Form::text('nominal[]',null,['class'=>'form-control input-mask text-start','data-inputmask'=>"'alias': 'numeric', 'groupSeparator': ',', 'digits': 0, 'digitsOptional': false, 'prefix': '', 'placeholder': '0'",'required'=>'required']) !!}
			</div>
		</div>
		<div class="col-md-2">
			<div class="mb-3">
				<label>Action</label><br>
				<a class="btn btn-block btn-danger btn-cancel"><i class="fa fa-times"></i>	Batalkan Item</a>
			</div>
		</div>
	</div>
</script>
@endpush