You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
321 lines
15 KiB
PHTML
321 lines
15 KiB
PHTML
5 years ago
|
@extends('layouts.app')
|
||
|
|
|
||
|
|
@section('page-name','Pembayaran SPP')
|
||
|
|
|
||
|
|
@section('content')
|
||
|
|
<div class="page-header">
|
||
|
|
<h1 class="page-title">
|
||
|
|
@yield('page-name')
|
||
|
|
</h1>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header">
|
||
|
|
<h3 class="card-title">Transaksi</h3>
|
||
|
|
</div>
|
||
|
|
@if(session()->has('msg'))
|
||
|
|
<div class="card-alert alert alert-{{ session()->get('type') }}" id="message" style="border-radius: 0px !important">
|
||
|
|
@if(session()->get('type') == 'success')
|
||
|
|
<i class="fe fe-check mr-2" aria-hidden="true"></i>
|
||
|
|
@else
|
||
|
|
<i class="fe fe-alert-triangle mr-2" aria-hidden="true"></i>
|
||
|
|
@endif
|
||
|
|
{{ session()->get('msg') }}
|
||
|
|
</div>
|
||
|
|
@endif
|
||
|
|
<div class="card-body">
|
||
|
|
{{-- <form action="{{ route('keuangan.store') }}" method="post"> --}}
|
||
|
|
@if($errors->any())
|
||
|
|
<div class="alert alert-danger">
|
||
|
|
@foreach($errors->all() as $error)
|
||
|
|
{{ $error }}<br>
|
||
|
|
@endforeach
|
||
|
|
</div>
|
||
|
|
@endif
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
@csrf
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="form-label">Siswa</label>
|
||
|
|
<select id="siswa" class="form-control" name="siswa_id">
|
||
|
|
<option value="#">[-- Pilih Siswa --]</option>
|
||
|
|
@foreach($siswa as $item)
|
||
|
|
<option value="{{ $item->id }}"> {{ $item->nama.' - '.$item->kelas->nama.' - ' }} </option>
|
||
|
|
@endforeach
|
||
|
|
</select><br>
|
||
|
|
Saldo: IDR. <span id="saldo">0</span>
|
||
|
|
</div>
|
||
|
|
<div class="form-group" style="display: none" id="form-tagihan">
|
||
|
|
<label class="form-label" >Tagihan</label>
|
||
|
|
<select id="tagihan" class="form-control" name="tagihan_id">
|
||
|
|
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="form-group" style="display: none" id="form-tagihan-2">
|
||
|
|
<label class="form-label">Total Tagihan</label>
|
||
|
|
IDR. <span id="harga">0</span>
|
||
|
|
<label class="custom-switch">
|
||
|
|
<input type="checkbox" class="custom-switch-input" id="ada-diskon">
|
||
|
|
<span class="custom-switch-indicator"></span>
|
||
|
|
<span class="custom-switch-description">Ada diskon? </span>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<div class="form-group" style="display: none" id="form-diskon">
|
||
|
|
<label class="form-label">Diskon (IDR)</label>
|
||
|
|
<input type="text" name="diskon" id="diskon" class="form-control" placeholder="masukan angka dalam satuan mata uang, tanpa titik atau koma">
|
||
|
|
</div>
|
||
|
|
<div class="form-group" style="display: none" id="form-total">
|
||
|
|
<label class="form-label">Total Pembayaran</label>
|
||
|
|
<input type="text" name="pembayaran" class="form-control" id="total" readonly>
|
||
|
|
</div>
|
||
|
|
<div class="form-group" style="display: none" id="form-pembayaran">
|
||
|
|
<label class="form-label">Pembayaran</label>
|
||
|
|
<div class="selectgroup w-100">
|
||
|
|
<label class="selectgroup-item">
|
||
|
|
<input type="radio" name="via" value="tunai" class="selectgroup-input" checked="">
|
||
|
|
<span class="selectgroup-button">Tunai</span>
|
||
|
|
</label>
|
||
|
|
<label class="selectgroup-item" style="display: none" id="opsi-tabungan">
|
||
|
|
<input type="radio" name="via" value="tabungan" class="selectgroup-input">
|
||
|
|
<span class="selectgroup-button">Potong Tabungan</span>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group" style="display: none" id="form-keterangan">
|
||
|
|
<label class="form-label">Keterangan</label>
|
||
|
|
<textarea name="keterangan" id="keterangan" rows="3" class="form-control"></textarea>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="d-flex">
|
||
|
|
<button class="btn btn-primary ml-auto" style="display: none" id="btn-simpan">Simpan</button>
|
||
|
|
</div>
|
||
|
|
{{-- </form> --}}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-12">
|
||
|
|
<div class="card">
|
||
|
|
<div class="card-header">
|
||
|
|
<h3 class="card-title">Histori Transaksi</h3>
|
||
|
|
<div class="card-options">
|
||
|
|
<a href="{{ route('keuangan.export') }}" class="btn btn-primary btn-sm ml-2" download="true">Export</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="table-responsive">
|
||
|
|
<table class="table card-table table-hover table-vcenter text-wrap">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th class="w-1">No.</th>
|
||
|
|
<th>Tanggal</th>
|
||
|
|
<th>Siswa</th>
|
||
|
|
<th>Jumlah</th>
|
||
|
|
<th>Diskon</th>
|
||
|
|
<th>Total</th>
|
||
|
|
<th>Keterangan</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
@foreach ($transaksi as $index => $item)
|
||
|
|
<tr>
|
||
|
|
<td><span class="text-muted">{{ $index+1 }}</span></td>
|
||
|
|
<td>{{ $item->created_at->format('d-m-Y') }}</td>
|
||
|
|
<td>{{ $item->siswa->nama.'('.$item->siswa->kelas->nama.')' }}</td>
|
||
|
|
<td>IDR. {{ format_idr($item->tagihan->jumlah) }}</td>
|
||
|
|
<td>IDR. {{ format_idr($item->diskon) }}</td>
|
||
|
|
<td>IDR. {{ format_idr($item->tagihan->jumlah - $item->diskon) }}</td>
|
||
|
|
<td style="max-width:150px;">{{ $item->keterangan }}</td>
|
||
|
|
</tr>
|
||
|
|
@endforeach
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div class="card-footer">
|
||
|
|
<div class="d-flex">
|
||
|
|
<div class="ml-auto mb-0">
|
||
|
|
{{ $transaksi->links() }}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
@endsection
|
||
|
|
@section('css')
|
||
|
|
<link href="{{ asset('assets/plugins/select2/select2.min.css') }}" rel="stylesheet" />
|
||
|
|
<style>
|
||
|
|
.select2-container--default .select2-selection--multiple .select2-selection__choice {
|
||
|
|
color: black;
|
||
|
|
}
|
||
|
|
.select2{
|
||
|
|
width: 100% !important;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
@endsection
|
||
|
|
@section('js')
|
||
|
|
<script>
|
||
|
|
require(['jquery','select2','sweetalert'], function ($, select2, sweetalert) {
|
||
|
|
$(document).ready(function () {
|
||
|
|
//format IDR
|
||
|
|
function formatNumber(num) {
|
||
|
|
return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1.')
|
||
|
|
}
|
||
|
|
$('#siswa').select2({
|
||
|
|
placeholder: "Pilih Siswa",
|
||
|
|
});
|
||
|
|
$('#tagihan').select2({});
|
||
|
|
|
||
|
|
var siswa_id; //siswa_id
|
||
|
|
var tagihan_id; //tagihan_id
|
||
|
|
var saldo; //saldo dari siswa
|
||
|
|
var harga; //harga dari tagihan
|
||
|
|
var diskon = 0; //diskon
|
||
|
|
var via = 'tunai'; //pembayaran via
|
||
|
|
// memilih siswa
|
||
|
|
$('#siswa').on('change',function(){
|
||
|
|
if(this.value == '#'){
|
||
|
|
$('#saldo').text('0')
|
||
|
|
$('#form-tagihan').hide()
|
||
|
|
$('#form-tagihan-2').hide()
|
||
|
|
$('#form-total').hide()
|
||
|
|
$('#form-pembayaran').hide()
|
||
|
|
$('#opsi-tabungan').hide()
|
||
|
|
$('#form-keterangan').hide()
|
||
|
|
$('#btn-simpan').hide()
|
||
|
|
return;
|
||
|
|
}else{
|
||
|
|
siswa_id = this.value
|
||
|
|
}
|
||
|
|
//get saldo
|
||
|
|
$.ajax({url: "{{ route('api.getsaldo') }}/" + this.value, success: function(result){
|
||
|
|
$('#saldo').text(result.sal)
|
||
|
|
saldo = result.saldo
|
||
|
|
$('#form-tagihan').show()
|
||
|
|
$('#form-tagihan-2').show()
|
||
|
|
$('#form-total').show()
|
||
|
|
$('#form-pembayaran').show()
|
||
|
|
if(saldo > 0){
|
||
|
|
$('#opsi-tabungan').show()
|
||
|
|
}
|
||
|
|
$('#form-keterangan').show()
|
||
|
|
$('#btn-simpan').show()
|
||
|
|
}, beforeSend: function(){
|
||
|
|
$('#saldo').text('tunggu, sedang mengambil saldo.....')
|
||
|
|
$('#form-tagihan').hide()
|
||
|
|
$('#form-tagihan-2').hide()
|
||
|
|
$('#form-total').hide()
|
||
|
|
$('#form-pembayaran').hide()
|
||
|
|
$('#opsi-tabungan').hide()
|
||
|
|
$('#form-keterangan').hide()
|
||
|
|
$('#btn-simpan').hide()
|
||
|
|
}});
|
||
|
|
//get tagihan
|
||
|
|
$.ajax({url: "{{ route('api.gettagihan') }}/" + this.value, success: function(result){
|
||
|
|
if(result.length == 0){
|
||
|
|
alert('tidak ada item tagihan yang tersedia')
|
||
|
|
}
|
||
|
|
$("#tagihan").empty()
|
||
|
|
for(i=0;i < result.length ;i++){
|
||
|
|
$("#tagihan").append('<option value="'+ result[i].id +'" data-harga="'+ result[i].jumlah +'">'+ result[i].nama +'</option>');
|
||
|
|
}
|
||
|
|
//set harga dari data pertama
|
||
|
|
tagihan_id = result[0].id
|
||
|
|
harga = result[0].jumlah
|
||
|
|
if(harga <= saldo){
|
||
|
|
$('#opsi-tabungan').show()
|
||
|
|
}else{
|
||
|
|
$('#opsi-tabungan').hide()
|
||
|
|
}
|
||
|
|
|
||
|
|
//menampilkan harga
|
||
|
|
$('#harga').text(formatNumber(harga));
|
||
|
|
$('#total').val(formatNumber(harga - diskon));
|
||
|
|
},});
|
||
|
|
})
|
||
|
|
|
||
|
|
$('#tagihan').on('change', function(){
|
||
|
|
tagihan_id = this.value
|
||
|
|
//set harga dari opsi yang dipilih
|
||
|
|
harga = $('option:selected', this).attr('data-harga');
|
||
|
|
|
||
|
|
if(harga <= saldo){
|
||
|
|
$('#opsi-tabungan').show()
|
||
|
|
}else{
|
||
|
|
$('#opsi-tabungan').hide()
|
||
|
|
}
|
||
|
|
|
||
|
|
//jika diganti diskon kembali ke nol
|
||
|
|
diskon = 0
|
||
|
|
$('#diskon').val('');
|
||
|
|
//menampilkan harga
|
||
|
|
$('#harga').text(formatNumber(harga));
|
||
|
|
$('#total').val(formatNumber(harga - diskon));
|
||
|
|
})
|
||
|
|
|
||
|
|
$('#ada-diskon').on('change', function(){
|
||
|
|
$('#form-diskon').toggle();
|
||
|
|
})
|
||
|
|
|
||
|
|
$('#diskon').keyup(function(){
|
||
|
|
if(this.value <= 0){
|
||
|
|
this.value = ''
|
||
|
|
diskon = 0
|
||
|
|
}else{
|
||
|
|
diskon = this.value
|
||
|
|
}
|
||
|
|
if((harga - diskon) < 0){
|
||
|
|
diskon = 0
|
||
|
|
alert('diskon invalid, silahkan tulis ulang')
|
||
|
|
$('#diskon').val('')
|
||
|
|
}
|
||
|
|
$('#total').val(formatNumber(harga - diskon));
|
||
|
|
if((harga - diskon) <= saldo){
|
||
|
|
$('#opsi-tabungan').show()
|
||
|
|
}else{
|
||
|
|
$('#opsi-tabungan').hide()
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
//pembayaran via
|
||
|
|
$('.selectgroup-input').change(function(){
|
||
|
|
via = this.value
|
||
|
|
})
|
||
|
|
|
||
|
|
$('#btn-simpan').on('click', function(){
|
||
|
|
console.log(harga)
|
||
|
|
if((harga - diskon) == NaN){
|
||
|
|
alert('diskon invalid')
|
||
|
|
}else{
|
||
|
|
$('#btn-simpan').addClass("btn-loading")
|
||
|
|
$.ajax({
|
||
|
|
type: "POST",
|
||
|
|
url: "{{ route('api.tagihan') }}/"+siswa_id,
|
||
|
|
data: {
|
||
|
|
tagihan_id : tagihan_id,
|
||
|
|
siswa_id : siswa_id,
|
||
|
|
jumlah : harga,
|
||
|
|
diskon : diskon,
|
||
|
|
keterangan : keterangan.value,
|
||
|
|
via : via
|
||
|
|
},
|
||
|
|
success: function(data){
|
||
|
|
console.log(data);
|
||
|
|
swal({title: data.msg})
|
||
|
|
setTimeout(function(){
|
||
|
|
window.location.reload()
|
||
|
|
}, 2000)
|
||
|
|
},
|
||
|
|
error: function(data){
|
||
|
|
console.log('Error......')
|
||
|
|
console.log(data)
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
@endsection
|