@extends('layouts.app')
@section('content')
    <div class="row pt-2 pb-2">
        <div class="col-sm-9">
		    <h4 class="page-title">PPDB Dashboard</h4>
		</div>
        <div class="col-sm-3">
        
        </div>
    </div>
    <!-- End Breadcrumb-->

    <div class="row">
    <div class="col-lg-4">
        {{-- dd($biodata[0]->psb_id) --}}
        <div class="card">
            @if(!empty($biodata[0]->psb_file_foto))
            <img src="{{asset('upload_file_psb/'.$biodata[0]->psb_file_foto.'')}}" class="w-50 mx-auto">
            @else
            <img src="{{asset('tpl/assets/images/noimage.png')}}" class="w-50 mx-auto">
            @endif
            <button type="button" onclick="edit_all('modal-all-lg',{{$biodata[0]->psb_id}})" class="btn btn-primary btn-square"> <i class="fa fa-user"></i>Ubah Data Diri</button>
            <a target="blank" href="/cetak-formulir/{{$biodata[0]->psb_number_unix}}" class="btn btn-warning btn-square" ><i class="fa fa-print"></i> Cetak Formulir</a>
            @if (isset($lunas))
                <a target="blank" href="/cetak-kartu-pelajar/{{$biodata[0]->psb_number_unix}}" class="btn btn-success btn-square" ><i class="fa fa-id-card"></i> Cetak Kartu Pelajar</a>
            @else
                
            @endif
        <div class="card-body pt-3">
            <h5 class="card-title">{{$biodata[0]->psb_nama_siswa}}</h5>
            <p class="card-text">{{$biodata[0]->psb_alamat_siswa}}</p>
        </div>

        <div class="card-body border-top border-light">
                <div class="media align-items-center">
                    <div><span class=" fa fa-table skill-img"></span></div>
                    <div class="media-body text-left ml-3">
                    <div class="progress-wrapper">
                        <b>Tempat Tanggal Lahir</b>
                        <p>{{$biodata[0]->psb_tempat_lahir_siswa}}, {{date('d-m-Y',strtotime($biodata[0]->psb_tgl_lahir_siswa))}}</p>
                    </div>                   
                </div>
                </div>
                <hr>
                <div class="media align-items-center">
                <div><span class=" fa fa-id-card skill-img"></span></div>
                    <div class="media-body text-left ml-3">
                    <div class="progress-wrapper">
                        <b>NIK</b>
                        <p>{{$biodata[0]->psb_nik_siswa}}</p>
                    </div>                   
                </div>
                </div>
                <hr>
                <div class="media align-items-center">
                <div><span class=" fa fa-id-card skill-img"></span></div>
                    <div class="media-body text-left ml-3">
                    <div class="progress-wrapper">
                        <b>NISN</b>
                        <p>{{$biodata[0]->psb_nisn}}</p>
                    </div>                   
                </div>
                </div>
                <hr>
                <div class="media align-items-center">
                <div><span class=" fa fa-phone skill-img"></span></div>
                    <div class="media-body text-left ml-3">
                    <div class="progress-wrapper">
                        <b>No. Telepon</b>
                        <p>{{$biodata[0]->psb_phone_siswa}}</p>
                    </div>                   
                </div>
                </div>
                
            </div>
    </div>

    </div>

    <div class="col-lg-8">
        @if ($message = Session::get('success'))
        <div class="alert alert-success gradient-ohhappiness alert-dismissible" role="alert">
            <div class="alert-icon">
            <i class="fa fa-check"></i>
            </div>
            <div class="alert-message">
            <span><strong>Success!</strong> {{ $message }}</span>
            </div>
        </div>
        @endif

        @if ($message = Session::get('error'))
        <div class="alert alert-danger gradient-redmist alert-dismissible" role="alert">
            <div class="alert-icon">
            <i class="fa fa-remove"></i>
            </div>
            <div class="alert-message">
            <span><strong>Error!</strong> {{ $message }}</span>
            </div>
        </div>
        @endif
        <div class="card">
        <div class="card-body">
        <ul class="nav nav-tabs nav-tabs-success top-icon nav-justified">
            <li class="nav-item">
                <a href="javascript:void();" data-target="#profile" data-toggle="pill" class="nav-link active"><i class="icon-user"></i> <span class="hidden-xs">Profile</span></a>
            </li>
            <li class="nav-item">
                <a href="javascript:void();" data-target="#messages" data-toggle="pill" class="nav-link"><i class="fa fa-money"></i> <span class="hidden-xs">Pembayaran</span></a>
            </li>
            <li class="nav-item">
                <a href="javascript:void();" data-target="#upload" data-toggle="pill" class="nav-link"><i class="fa fa-paperclip"></i> <span class="hidden-xs">Berkas</span></a>
            </li>
        </ul>
        <div class="tab-content p-3">
            <div class="tab-pane active" id="profile">
                
                <div class="row">
                    <div class="col-md-12">
                        <h5 class="mb-3">Data Diri</h5>
                        <div class="table-responsive">
                            <table class="table table-hover table-striped">
                                <tbody>                                    
                                    <tr>
                                        <td>
                                            Email
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_email_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Jenis Kelamin
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_jenis_kelamin_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Anak Ke
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_anak_ke_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Lulusan / Alumni (SD)
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_asal_sekolah}}
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    
                    <div class="col-md-12">
                        <hr>
                        <h5 class="mb-3">Data Keluarga</h5>
                        <div class="table-responsive">
                            <table class="table table-hover table-striped">
                                <tbody>                                    
                                    <tr>
                                        <td>
                                            Nama Ibu
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_ibu_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Pekerjaan Ibu
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_pekerjaan_ibu_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Nama Ayah
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_ayah_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Pekerjaan Ayah
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_pekerjaan_ayah_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            No Handphone Orang Tua
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_phone_ortu_siswa}}
                                        </td>
                                    </tr>
                                    
                                    <tr>
                                        <td>
                                            Alamat Orang Tua
                                        </td>
                                        <td>
                                            <p>{{$biodata[0]->psb_alamat_ortu_siswa}}</p>
                                            
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>                           
                    </div>
                    <div class="col-md-12">
                        <hr>
                        <h5 class="mb-3">Data Wali</h5>
                        <div class="table-responsive">
                            <table class="table table-hover table-striped">
                                <tbody>                                    
                                    <tr>
                                        <td>
                                            Nama Wali
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_wali_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            No Handphone Wali
                                        </td>
                                        <td>
                                            {{$biodata[0]->psb_phone_wali_siswa}}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            Alamat Wali
                                        </td>
                                        <td>
                                            <p>{{$biodata[0]->psb_alamat_wali_siswa}}</p>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>                           
                    </div>
                </div>
                <!--/row-->
            </div>
            <div class="tab-pane" id="messages">

                @if ($count_tagian > 0)
                <div class="table-responsive">
                    <table class="table table-bordered" id="table_tagihan" width="100%">
                        <thead>
                            <tr>
                                <th></th>
                                <th style="display: none;">Tagihan ID</th>
                                <th><strong>Tagihan PPDB</strong></th>
                                <th><strong>Diskon</strong></th>
                                <th><strong>Total Tagihan/Sisa</strong></th>
                                <th><strong>Pembayaran</strong></th>
                                <th><strong>Refund/Pengembalian</strong></th>
                                <th><strong>Status</strong></th>
                            </tr>
                        </thead>
                        <tbody>                                    
                            @foreach ($tagihan as $tagihan)                                
                                <tr>
                                    <td class="tableClick"></td>
                                    <td style="display: none;">{{$tagihan->psb_id}}</td>
                                    <td>
                                        Rp {{number_format($tagihan->tagihan_h_jumlah)}} 
                                        @if (!empty($tagihan->biaya_spp_id))
                                        @endif
                                    </td>
                                    <td>
                                        Rp {{number_format($tagihan->tagihan_h_discount)}}
                                    </td>
                                    <td>
                                        Rp {{number_format($tagihan->tagihan_h_sisa)}}
                                    </td>
                                    <td>
                                        Rp {{number_format($tagihan->tagihan_h_masuk)}} 
                                    </td>
                                    <td>
                                        Rp {{number_format($tagihan->tagihan_h_refund)}} 
                                    </td>
                                    <td>
                                        @if($tagihan->tagihan_h_sisa == 0)
                                            <h5><span class="badge badge-success status">Lunas</span></h5>
                                        @else
                                            <h5><span class="badge badge-danger status">Belum Lunas</span></h5>
                                        @endif                                                                        
                                    </td>
                                </tr>                    
                            @endforeach
                        </tbody> 
                    </table>
                </div>
                    <div class="modal-footer">
                        @if(!empty($biodata[0]->psb_bukti_pembayaran))
                        <a target="_blank" class="btn btn-info" href="{{asset('upload_bukti_pembayaran')}}/{{$biodata[0]->psb_bukti_pembayaran}}">Cek Bukti Pembayaran</a>
                        @else
                        
                        @endif
                        <button type="button" class="btn btn-warning waves-effect waves-light m-1" data-toggle="modal" data-target="#refundModal"> <i class="fa fa-money"></i> Pengembalian</button>
                        <!-- Button trigger modal -->
                        <button type="button" class="btn btn-primary"  data-toggle="modal" data-target="#bayarModal">
                            Bayar Tagihan
                        </button>
                        
                        <!-- modal refund -->
                        <div id="refundModal" class="modal fade" tabindex="-1"  role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                          <div class="modal-dialog modal-lg">
                            <div class="modal-content border-primary animated flipInX">
                              <div class="modal-header bg-primary">
                                <h5 class="modal-title" id="exampleModalLabel">Modal Add / Edit</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                  <span aria-hidden="true">&times;</span>
                                </button>
                              </div>
                              <div class="modal-body">
                                    <form id="form-all-refund">
                                    <div class="col-4">
                                        <div class="form-group row">
                                            <label>Nominal Refund / Pengembalian</label>
                                            <input type="hidden" name="psb_id" id="psb_id" value="{{($siswa_id)?$siswa_id->psb_id:''}}">
                                            <input type="hidden" name="sis_id" id="sis_id" value="{{($siswa_id)?$siswa_id->siswa_id:''}}">
                                            <input type="text" id="tagihan_h_refund" name="tagihan_h_refund" class="form-control money number_valid_char">
                                        </div>
                                    </div>
                              </div>
                              <div class="modal-footer">
                                <button type="button" class="btn btn-white" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
                                <button type="button" class="btn btn-primary" id="btn-form-save" onclick="save_all_refund()">Refund</button>
                                    </form>
                              </div>
                            </div>
                          </div>
                        </div>
                        
                        <!-- Modal -->
                        <div class="modal fade" id="bayarModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                            <div class="modal-dialog modal-lg" style="max-width: 70%;" role="document">

                            <div class="modal-content">
                                <div class="modal-header bg-info">
                                <h5 class="modal-title text-white" id="exampleModalLabel">Form Pembayaran</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                                </div>
                                <div class="modal-body">
                                    <form id="bayar-all-tagihan">
                                    @csrf  
                                    @method('PUT')
                                    <div class="col-4">
                                        <div class="form-group row">
                                            <label>Tipe Pembayaran</label>
                                            <select name="transaksi_tipe_pembayaran" class="form-control select-select" id="tipe_pembayaran">
                                                <option value="0">Tunai</option>
                                                <option value="1">Non Tunai</option>
                                            </select>
                                            <input type="hidden" name="psb_id" id="psb_id" value="{{($siswa_id)?$siswa_id->psb_id:''}}">
                                            <input type="hidden" name="sis_id" id="sis_id" value="{{($siswa_id)?$siswa_id->siswa_id:''}}">
                                        </div>
                                        <div class="bayar 1" style="display: none;">
                                            <div class="form-group row">
                                                <label>No Kartu</label>
                                                <input type="text" name="transaksi_no_kartu_atm" class="form-control">
                                            </div>
                                        </div>
                                    </div>
                                    {{-- <table>
                                        <table class="table table-striped table-bordered custom-table mb-0" width="100%">
                                            <thead>
                                                <tr>
                                                    <!-- <th scope="col">#</th> -->
                                                    <th scope="col" style="display: none;">Id Tagihan</th>
                                                    <th scope="col">Nama Tagihan</th>
                                                    <th scope="col">Rincian Biaya PPDB</th>
                                                    <th scope="col" width="10%" style="display: none;">Diskon</th>
                                                    <th scope="col" style="display: none;">Total</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @php $row=100; @endphp
                                                @foreach ($detail_tagihan as $dt)
                                                @if($dt->tagihan_sisa > 0)
                                                <tr id="baris-{{$row++}}">
                                                    <!-- <th scope="row"><input id="ceklist" onchange="cek(this, {{$row}})" type="checkbox"></th> -->
                                                    <th style="display: none;"><input type="text" name="tagihan_id[]" value="{{$dt->tagihan_id}}"></th>
                                                    <td>
                                                        {{$dt->tagihan_name}}
                                                        <p>
                                                        @foreach($rinci_detail as $detail)
                                                            - {{$detail->biaya_psb_detail_name}}<br>
                                                        @endforeach
                                                    </td>
                                                    <td><input type="text" class="form-control number_valid_char money" name="jumlahtagihan[]" id="jumlahtagihan{{$row}}" value="{{$dt->tagihan_jumlah}}" readonly></td>
                                                    <td style="display: none;"><input type="text" readonly class="form-control number_valid_char" name="diskon[]" id="diskon{{$row}}" onchange="hitung_diskon(this, {{$row}})" value="0"></td> 
                                                <td style="display: none;"><input type="text" readonly class="form-control number_valid_char money" value="{{$dt->tagihan_jumlah}}" name="nilai_bayar[]" id="bayar{{$row}}" value="0"></td>
                                                </tr>
                                                @endif
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </table> --}}
                                    <table>
                                        <table class="table table-striped table-bordered custom-table mb-0" width="100%">
                                            <thead>
                                                <tr>
                                                    <!-- <th scope="col">#</th> -->
                                                    <th scope="col" style="display: none;">Id Tagihan</th>
                                                    <th scope="col">Keterangan Tagihan</th>
                                                    <th scope="col">Tagihan</th>
                                                    <th scope="col">Diskon (Alumni)</th>
                                                    <th scope="col">Jumlah</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @php $row=100; @endphp
                                                @foreach ($detail_tagihan as $dt)
                                                <tr id="baris-{{$row++}}">
                                                    <td style="display: none;"><input type="text" name="tagihan_id[]" id="tagihan_id{{$row}}" value="{{$dt->tagihan_h_id}}"></td>
                                                    <td>
                                                        {{$dt->biaya_psb_name}}
                                                        <p>
                                                        @foreach($rinci_detail as $detail)
                                                            - {{$detail->biaya_psb_detail_name}}<br>
                                                        @endforeach
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control number_valid_char money" name="jumlahtagihan[]" id="jumlahtagihan{{$row}}" value="{{($dt->tagihan_h_masuk==0)?$dt->tagihan_h_jumlah:$dt->tagihan_h_sisa}}" readonly>
                                                    </td>
                                                    <td>
                                                        <input type="text" readonly class="form-control number_valid_char money" name="diskon[]" id="diskon{{$row}}" value="{{($dt->tagihan_h_masuk==0)?$dt->tagihan_h_discount:'0'}}">
                                                    </td> 
                                                    <td>
                                                        <input type="text" readonly class="form-control number_valid_char money" value="{{$dt->tagihan_h_sisa}}" name="nilai_bayar[]" id="bayar{{$row}}" value="0">
                                                    </td>
                                                </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </table>
                                    <table class="table table-striped table-bordered custom-table mb-0" >
                                        <thead>
                                            <tr>
                                                <th width="70%" style="text-align: right;">Total</th>
                                                <th><input type="hidden" name="tagihan_h_id" id="tagihan_h_id" value="{{$tagihan->tagihan_h_id}}"><input type="text" name="grand_total" id="grand_total" value="0" readonly class="form-control money"></th>
                                            </tr>
                                            <tr>
                                                <th width="70%" style="text-align: right;">Pembayaran Masuk</th>
                                                <th><input type="text" name="pembayaran_masuk" id="pembayaran_masuk" value="{{$tagihan->tagihan_h_masuk}}" readonly class="form-control money"></th>
                                            </tr>
                                            <tr style="display: none;">
                                                <th width="70%" style="text-align: right;">Diskon (Alumni)</th>
                                                <th><input type="text" name="diskon_alumni" id="diskon_alumni" value="{{$tagihan->tagihan_h_discount}}" readonly class="form-control money"></th>
                                            </tr>
                                            <tr>
                                                <th width="70%" style="text-align: right;">Grand Total</th>
                                                <th><input type="text" name="sisa_pembayaran" id="sisa_pembayaran" value="{{$tagihan->tagihan_h_sisa}}" readonly class="form-control money"></th>
                                            </tr>
                                            <tr>
                                                <th width="70%" style="text-align: right;">Bayar</th>
                                                <th><input type="text" name="total_dibayarkan" class="form-control money" id="total_dibayarkan" oninput="hitung_kembalian()"></th>
                                            </tr>
                                            <tr class="kembalian">
                                                <th width="70%" style="text-align: right;">Kembalian</th>
                                                <th><input type="text" name="total_kembali" readonly class="form-control money" id="total_kembali"></th>
                                            </tr>
                                        </thead>
                                    </table>
                                </div>
                                <div class="modal-footer">
                                <button type="button" class="btn btn-dark text-white" data-dismiss="modal">Close</button>
                                <button type="button" class="btn btn-primary submit-btn" onclick="save_all_tagihan()">Bayar</button>
                                </div>
                            </form>
                            </div>
                            </div>
                        </div>
                    </div>
                @else
                <div class="alert alert-warning alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert">×</button>
                    <div class="alert-icon">
                        <i class="icon-info"></i>
                    </div>
                    <div class="alert-message">
                        <span><strong>Perhatian!</strong> Data anda Sedang di Verifikasi.</span>
                    </div>
                </div>
                @endif           
                
            </div>
            <div class="tab-pane" id="upload">
                <div class="table-responsive">
                    <table class="table table-hover table-bordered">
                        <thead class="bg-facebook text-white">
                            <tr>
                                <th width="5%">No</th>
                                <th width="75%">Jenis Berkas</th>
                                <th width="20%">Status</th>
                            </tr>
                        </thead>
                        <tbody class="text-center">
                            <tr>
                                <td>1</td>
                                <td class="text-left">Ijazah</td>
                                <td>@if (!empty($biodata[0]->psb_ijazah))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <span class="badge badge-sm badge-danger">Belum Upload</span>
                                @endif</td>
                            </tr>
                            <tr>
                                <td>2</td>
                                <td class="text-left">Kartu Keluarga</td>
                                <td>@if (!empty($biodata[0]->psb_file_kk))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <span class="badge badge-sm badge-danger">Belum Upload</span>
                                @endif</td>
                            </tr>   
                            <tr>
                                <td>3</td>
                                <td class="text-left">Akte Lahir</td>
                                <td>@if (!empty($biodata[0]->psb_file_akte_lahir))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <span class="badge badge-sm badge-danger">Belum Upload</span>
                                @endif</td>
                            </tr> 
                            <tr>
                                <td>4</td>
                                <td class="text-left">Foto</td>
                                <td>@if (!empty($biodata[0]->psb_file_foto))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <span class="badge badge-sm badge-danger">Belum Upload</span>
                                @endif</td>
                            </tr> 
                            <tr>
                                <td>5</td>
                                <td class="text-left">KTP Orang Tua</td>
                                <td>@if (!empty($biodata[0]->psb_file_ktp_ortu))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <button class="btn btn-sm btn-danger" type="button" onclick="changeStatus({{$biodata[0]->psb_id}},1)"><i class="fa fa-warning"></i> Cek</button>
                                @endif</td>
                            </tr>
                            <tr>
                                <td>6</td>
                                <td class="text-left">KIA (Kartu Identitas Anak)</td>
                                <td>@if (!empty($biodata[0]->psb_file_kia))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <button class="btn btn-sm btn-danger" type="button" onclick="changeStatus({{$biodata[0]->psb_id}},2)"><i class="fa fa-warning"></i> Cek</button>
                                @endif</td>
                            </tr>
                            <tr>
                                <td>7</td>
                                <td class="text-left">NISN (Nomor Induk Siswa Nasional)</td>
                                <td>@if (!empty($biodata[0]->psb_file_nisn))
                                    <span class="badge badge-sm badge-success"><i class="fa fa-check"></i></span>
                                @else
                                    <button class="btn btn-sm btn-danger" type="button" onclick="changeStatus({{$biodata[0]->psb_id}},3)"><i class="fa fa-warning"></i> Cek</button>
                                @endif</td>
                            </tr> 
                        </tbody>
                    </table>
                </div>
                <span class="text-danger">Catatan : Jika ada berkas yang belum diupload silahkan ke menu 'Ubah Data Diri' pada tab 'Upload Berkas' untuk melengkapi berkas. Untuk berkas fotocopy KTP Orang Tua, KIA, dan NISN yang belum diserahkan ke pihak sekolah silahkan lengkapi dan serahkan ke pihak sekolah.</span>
            </div>
        </div>
    </div>
    </div>
    </div>
        <!--Warning Modal -->        
        <div class="modal fade" id="warningmodal">
            <div class="modal-dialog modal-lg">
                <div class="modal-content border-warning">
                <div class="modal-header bg-warning">
                    <h5 class="modal-title text-white">Form Pembayaran</h5>
                    <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="container">
                        <div class="row border">
                            <div class="col">
                                <div class="form-group">
                                    <form id="bayar-tagihan">
                                    @csrf  
                                    @method('PUT')
                                    <label>Nama Biaya</label>
                                    <input type="hidden" name="tagihan_id" id="tagihanid" class="form-control">
                                    <input type="text" name="tagihan_name" id="namabiaya" class="form-control" readonly>                                 
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label>Jumlah</label>
                                    <input type="text" name="tagihan_jumlah" id="tagihan_jumlah" class="form-control number_valid_char money" readonly>
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label>Diskon (%)</label>
                                    <input type="text" name="transaksi_diskon" id="tagihan_diskon" oninput="hitung()" class="form-control number_valid_char money">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                    <label>Total</label>
                                    <input type="text" readonly name="total_diskon" id="hidetotal" class="form-control number_valid_char money">
                            </div>
                            <div class="col border-left">                            
                                <div class="form-group">
                                    <label>Tipe Pembayaran</label>
                                    <select name="transaksi_tipe_pembayaran" class="form-control select-select" id="transaksi_tipe_pembayaran">
                                        <option value="0">Tunai</option>
                                        <option value="1">Non Tunai</option>
                                    </select>
                                </div>
                                <div class="nontunai" style="display: none;">
                                    <div class="form-group">
                                        <label>No Kartu</label>
                                        <input type="text" name="transaksi_no_kartu_atm" class="form-control">
                                    </div>
                                </div>
                            </div>
                            <div class="col border-left border-right">                            
                                <div class="form-group">
                                    <label>Bayar</label>
                                    <input type="text" name="transaksi_bayar" id="tagihan_bayar" oninput="hitung_kembali()" class="form-control number_valid_char money">
                                </div>
                                <div class="tunai" style="display: none;">
                                    <div class="form-group">
                                        <label>Kembali</label>
                                        <input type="text" name="transaksi_kembali" id="tagihan_kembali" class="form-control number_valid_char money">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>                
                <div class="modal-footer">
                    <input type="hidden" name="psb_id" id="psb_id" value="{{$biodata[0]->psb_id}}">
                    <button type="button" class="btn btn-dark" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
                    <button type="button" class="btn btn-primary submit-btn" onclick="save_tagihan()"><i class="fa fa-check-square-o"></i> Save changes</button>
                </div>
                </form>
                </div>
            </div>
        </div>
        <!--End Modal -->        
    </div>
    
@endsection
@section('js')
<script type="text/javascript">

    form = $("#form-all-lg");
    var url_edit = "/edit-datadiri" ;
    var url_update = "/update-datadiri" ;

$(document).ready(function() {

    $('#tbl_tagihan').DataTable( {
        "scrollY": 200,
        "scrollX": true,
        bFilter: false, 
        bInfo: false,
        "ordering": false,
        paging:false
    } );

    var total_a=0;
    $("input[name^='nilai_bayar']").each(function () {
       total_a += parseFloat($(this).val());
    })
    $('[name="grand_total"]').val(total_a);

} );

function changeStatus(id,type){
    var typeFile='';
    if(type==1){
        typeFile ='KTP Orang Tua';
    }else if(type==2){
        typeFile ='KIA';
    }else{
        typeFile ='NISN';
    }
    swal({
        title: "Perhatian",
        text:"Anda yakin sudah cek data "+typeFile+" ?",
        icon: "warning",
        buttons: true,
    })
    .then((willDelete) => {
        if (willDelete) {
            swal("Data berhasil diubah!", {
            icon: "success",
            })
            .then((willDelete)=>{
                window.location.href = "/cek-data?id="+id+"&type="+type;
            });
        }else {
            swal("Cancel");
        }
    });
    // swal("A wild Pikachu appeared! What do you want to do?", {
    // buttons: {
    //     cancel: "Run away!",
    //     catch: {
    //     text: "Throw Pokéball!",
    //     value: "catch",
    //     },
    //     defeat: true,
    // },
    // })
    // .then((value) => {
    //     switch (value) {
        
    //         case "defeat":
    //         swal("Pikachu fainted! You gained 500 XP!");
    //         break;
        
    //         case "catch":
    //         swal("Gotcha!", "Pikachu was caught!", "success");
    //         break;
        
    //         default:
    //         swal("Got away safely!");
    //     }
    // });
}

function cek (e, row)
{
    
    if(e.checked){

        var grand_ttl = $('#grand_total').val();
        var jumlahtagihan = $('#jumlahtagihan'+row+'').val();
        $('#diskon'+row+'').prop("readonly", false);
        $('#dibayarkan'+row+'').prop("readonly", false);

        $('#bayar'+row+'').val(jumlahtagihan);

        var total_a=0;
        $("input[name^='nilai_bayar']").each(function () {
           total_a += parseFloat($(this).val());
        })
        $('[name="grand_total"]').val(total_a);
        $('[name="total_dibayarkan"]').val(total_a);
        // var total_b=0;
        // $("input[name^='dibayarkan']").each(function () {
        //    total_b += parseFloat($(this).val());
        // })
        // console.log(total_b);
        // $('[name="total_dibayarkan"]').val(total_b);

        var t = $('#total_dibayarkan').val(); 
        var z = $('#grand_total').val();
        var total = parseFloat(t)-parseFloat(z);
        $('#total_kembali').val(total);

    } else {
        var grand_ttl = $('#grand_total').val();
        var jumlahtagihan = $('#jumlahtagihan'+row+'').val();
        var byr = $('#bayar'+row+'').val();

        var total_a=0;
        var total_a = parseFloat(grand_ttl) - parseFloat(byr);

        $('[name="grand_total"]').val(total_a);
        $('[name="total_dibayarkan"]').val(total_a);

        
        $('#diskon'+row+'').prop("readonly", true);
        $('#dibayarkan'+row+'').prop("readonly", true);
        $('#diskon'+row+'').val(0);
        $('#dibayarkan'+row+'').val(0);
        $('#bayar'+row+'').val(0);

        var t = $('#total_dibayarkan').val(); 
        var z = $('#grand_total').val();
        var total = parseFloat(t)-parseFloat(z);
        $('#total_kembali').val(total);
    }

}
function hitung_diskon(e, row) {
    var diskon = $(e).val();
    var jumlahtagihan = $('#jumlahtagihan'+row+'').val();
    total_all = parseFloat(jumlahtagihan) - (parseFloat(diskon)/100) * parseFloat(jumlahtagihan);
    $('#bayar'+row+'').val(total_all);

    var grand_ttl = $('#grand_total').val();
    var bayar = $('#bayar'+row+'').val();

    var total_a=0;
    var total_a = parseFloat(grand_ttl) - (parseFloat(diskon)/100) * parseFloat(jumlahtagihan);

    $('[name="grand_total"]').val(total_a);

    var t = $('#total_dibayarkan').val(); 
    var z = $('#grand_total').val();
    var total = parseFloat(t)-parseFloat(z);
    $('#total_kembali').val(total);

}

function hitung() {
    var a = $('#tagihan_diskon').val();
    var b = $('#tagihan_jumlah').val();
    var total = parseFloat(b)-(parseFloat(a)*parseFloat(b)/100);
    $('#hidetotal').val(total);
    $('#tagihan_bayar').val(0);
    hitung_kembali();
}

function hitung_kembali() {
    var t = $('#tagihan_bayar').val(); 
    var z = $('#hidetotal').val();
    var total = parseFloat(t)-parseFloat(z);
    $('#tagihan_kembali').val(total);
}

function hitung_kembalian() {
    var t = $('#total_dibayarkan').val(); 
    var z = $('#sisa_pembayaran').val();
    var total = parseFloat(t)-parseFloat(z);
    $('#total_kembali').val(total);
}

function hitung_dibayarkan(e, row){
    var total_a = 0;
    $("input[name^='dibayarkan']").each(function () {
       total_a += parseFloat($(this).val());
    })
    $('[name="total_dibayarkan"]').val(total_a);

    var grand_ttl = $('#grand_total').val();
    var total_dibayarkan = $('#total_dibayarkan').val();
    var hasil_kembalian = parseFloat(total_dibayarkan) - parseFloat(grand_ttl);
    console.log(grand_ttl);
    $('#total_kembali').val(hasil_kembalian);
}

$(function(){
validasi_angka();
money();

var table = $('#table_tagihan').DataTable( {
//"ajax": "../ajax/data/objects.txt",
"columns": [
    {
        "className":      'detail-tagihan',
        "orderable":      false,
        "data":           null,
        "defaultContent": ''
    },
    { "data": "psb_id", visible:true},
    { "data": "tagihan_h_jumlah" },
    { "data": "tagihan_h_discount"},
    { "data": "tagihan_h_sisa"},
    { "data": "tagihan_h_masuk"},
    { "data": "tagihan_h_refund"},
    { "data": "status" },
],
});

$('#table_tagihan tbody').on('click', 'td.detail-tagihan', function () {
    var tr = $(this).closest('tr');
    var row = table.row( tr );
    var tb;
    var status;

    // console.log(row.data());

    if ( row.child.isShown() ) {
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    }
    else {
        data_r = row.data();
        $.ajax({
            type  : 'GET',
            dataType: 'JSON',
            url   : 'psb-dashboard/get-detail-tagihan/',
            headers : {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
            data  : { 
                psb_id : data_r.psb_id
                },
            success  : function(values){
                
                tb = '<table class="table table-bordered table-hover" border="2">'+
                '<thead>'+
                    '<tr>'+
                        '<td style="font-weight:bold;display: none;" >id</td>'+
                        '<td style="font-weight:bold">Nama Tagihan</td>'+
                        '<td style="font-weight:bold">Jumlah</td>'+
                        // '<td style="font-weight:bold">Sisa</td>'+
                        // '<td style="font-weight:bold">Status</td>'+
                        // '<td style="font-weight:bold">Action</td>'+
                    '</tr>'+
                '</thead>'+
                '<tbody>';
                $.each(values.data.data.detail_tagihan,function(i,v){
                    var masuk = v.tagihan_masuk;
                    var sisa = v.tagihan_sisa;
                    if (masuk<sisa) {
                        var print= '<h5><span class="badge badge-danger">Belum Lunas</span></h5>';
                        var btn = '<a data-toggle="modal" href="#" data-tagihanid="'+v.tagihan_id+'"  data-namabiaya="'+v.tagihan_name+'" data-jumlah="'+v.tagihan_jumlah+'" data-sisabiaya="'+v.tagihan_sisa+'" class="btn btn-warning waves-effect waves-light m-1" data-target="#warningmodal"><i class="fa fa-money"></i> Bayar Tagihan</a>';
                    } else {
                        var print= '<h5><span class="badge badge-success">Lunas</span></h5>';
                        var btn = '<a data-toggle="modal" href="#" data-tagihanid="'+v.tagihan_id+'"  data-namabiaya="'+v.tagihan_name+'" data-jumlah="'+v.tagihan_jumlah+'" class="btn btn-warning waves-effect waves-light m-1 disabled" data-target="#warningmodal"><i class="fa fa-money"></i> Bayar Tagihan</a>';
                    }
                    tb +=
                    '<tr>'+
                    '<td style="display: none;">'+v.tagihan_id+'</td>'+
                    '<td>'+v.tagihan_name+'</td>'+
                    '<td>Rp '+addCommas(v.tagihan_jumlah)+'</td>'+
                    // '<td>Rp '+addCommas(v.tagihan_sisa)+'</td>'+
                    // '<td>'+print+'</td>'+                    
                    // '<td>'+btn+'</td>'+
                    '</tr>';           
                })
                tb+=
                '</tbody>'+
                '</table>';
                row.child(tb).show();
                tr.addClass('shown');
            }
        });
        // Open this row
        }
    });
});

// $('#diskon').blur(function() {
//     var jumlah = parseFloat($('#jumlah').val());
//     var diskon = parseFloat($(this).val()); //assume is decimal rate so used parseFloat to  change from string to #
//     var money = (jumlah - (jumlah * diskon/ 100));
//     $('#totaltagihan').text(money);
// });

// $('#bayar').blur(function() {
//     var totaltagihan = $('#totaltagihan').text();
//     //console.log(totaltagihan);
//     var bayar = parseFloat($(this).val()); //assume is decimal rate so used parseFloat to  change from string to #
//     var money = bayar-totaltagihan;
//     $('#kembali').val(money);
// });

$('#warningmodal').on('shown.bs.modal', function (e) {
    var link     = $(e.relatedTarget),
        modal    = $(this),
        tagihanid = link.data("tagihanid"),
        namabiaya = link.data("namabiaya"),
        sisabiaya = link.data("sisabiaya"),
        jumlah    = link.data("jumlah");

    modal.find("#tagihanid").val(tagihanid);
    modal.find("#namabiaya").val(namabiaya);
    if(sisabiaya>0){
        modal.find("#tagihan_jumlah").val(sisabiaya);
        modal.find("#hidetotal").val(sisabiaya);
        modal.find("#totaltagihan").text("Rp "+addCommas(sisabiaya));
    } else {
        modal.find("#tagihan_jumlah").val(jumlah);
        modal.find("#hidetotal").val(jumlah);
        modal.find("#totaltagihan").text("Rp "+addCommas(jumlah));
    }
    modal.find("#tagihan_bayar").val(0);
    modal.find("#tagihan_kembali").val(0);
});

$('#warningmodal').modal({
    show:false,
    keyboard: false,
    backdrop: 'static'
});

$('#bayarModal').modal({
    show:false,
    keyboard: false,
    backdrop: 'static'
});

$(document).ready(function(){
    $("#tipe_pembayaran").change(function(){
    $(this).find("option:selected").each(function(){
        var optionValue = $(this).attr("value");
        var v = $("#grand_total").val();
        if(optionValue=="0"){
            $(".kembalian").show();
            $(".1").hide();
            $("#total_dibayarkan").val(0);
            $("#total_kembali").val(0);
            $('#total_dibayarkan').prop("readonly", false);
        } else{
            $(".1").show();
            $("#total_dibayarkan").val(v);
            $(".kembalian").hide();
            $('#total_dibayarkan').prop("readonly", true);
        }
    });
    }).change();
});

$(document).ready(function(){
    $("#transaksi_tipe_pembayaran").change(function(){
    $(this).find("option:selected").each(function(){
        var optionValue = $(this).attr("value");
        var z = $("#tagihan_jumlah").val();
        if(optionValue=="0"){
            $(".tunai").show();
            document.getElementById("tagihan_bayar").value=0;
            document.getElementById("tagihan_kembali").value=0;
            $("#hidetotal").val(0);
            $(".nontunai").hide();
        } else{
            $(".nontunai").show();
            $("#tagihan_diskon").val(0);
            $("#tagihan_bayar").val(z);
            $("#hidetotal").val(z);
            $(".tunai").hide();
        }
    });
    }).change();
});

function save_tagihan()
{
    var a = $("#tagihan_bayar").val();
    var b = $("#tagihan_jumlah").val();
    var c = $("#tagihan_kembali").val();
    console.log(a+'-'+c);

    if (c > a || a == 0) {
        swal({
            text: "Jumlah yang anda masukkan salah/kurang",
            icon: "warning",
        })
    // } else if(c > a){
    //     swal({
    //         text: "Pembayaran Kurang",
    //         icon: "warning",
    //     })
    } else {
    $("#bayar-tagihan").validate();
    var data = new FormData($("#bayar-tagihan")[0]);
    var message = "input";
    swal({
        title: "Apakah anda yakin ?",
        text: "Data pembayaran sudah benar",
        icon: "warning",
        buttons: true,
        dangerMode: false,
        })
        .then((willDelete) => {
            if (willDelete) {
            $.ajax({
                type  : 'POST',
                url   : '/bayar-detail-tagihan',
                headers : {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data  : data,
                cache:false,
                contentType:false,
                processData:false
                }).done(function(data) {
                if(data.status.code==0)
                {
                    swal({
                        title: "Success!",
                        text: "Data berhasil "+message,
                        icon: "success",
                        button: "Ok!",
                    }).then(function(){
                    if (typeof url_redirect !== 'undefined')
                    {
                        $(location).attr('href',url_redirect);    
                    }
                    else
                    {
                        print_receipt(data.data.trans_id)
                        location.reload(true)
                    }
                });
                } 
            }).fail(function(data) {  
                var dt = data.responseJSON;
                
                if(dt.errors)
                {
                    $.each(dt.errors, function (key, value) {
                        var input = '[name=' + key + ']';
                        
                        $(input + '+span').html('<strong>'+ value +'</strong>');
                        $(input).addClass('is-invalid');
                        $(input).focus();
                        $(input).change(function(){
                            $(input+'+span').html('');
                            $(input).removeClass('is-invalid');
                        })
                    });  
                }
                else
                {
                    swal({
                    title: dt.status.message,
                    type: "error"
                    })
                }
                
            });
        }   
    });
    }
}

function save_all_tagihan()
{

    var grand_ttl = $('#grand_total').val();
    var ttl_dibayarkan = $('#total_dibayarkan').val();
    var ttl_kembali = $('#total_kembali').val();
    // console.log(grand_ttl);
    // if(ttl_dibayarkan < grand_ttl || ttl_dibayarkan == 0){
    //     swal({
    //         text: "Jumlah yang anda masukkan salah/kurang",
    //         icon: "warning",
    //     })
    // } else {
    
        $("#bayar-all-tagihan").validate();
        var data = new FormData($("#bayar-all-tagihan")[0]);
        var message = "input";
        swal({
            title: "Apakah anda yakin ?",
            text: "Data pembayaran sudah benar",
            icon: "warning",
            buttons: true,
            dangerMode: false,
            })
            .then((willDelete) => {
                if (willDelete) {
                $.ajax({
                    type  : 'POST',
                    url   : '/bayar-all-tagihan',
                    headers : {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data  : data,
                    cache:false,
                    contentType:false,
                    processData:false
                    }).done(function(data) {
                    if(data.status.code==0)
                    {
                        swal({
                            title: "Success!",
                            text: "Data berhasil "+message,
                            icon: "success",
                            button: "Ok!",
                        }).then(function(){
                        if (typeof url_redirect !== 'undefined')
                        {
                            $(location).attr('href',url_redirect);    
                        }
                        else
                        {
                            print_receipt(data.data.trans_id)
                            location.reload(true)
                        }
                    });
                    } 
                }).fail(function(data) {  
                    var dt = data.responseJSON;
                    
                    if(dt.errors)
                    {
                        $.each(dt.errors, function (key, value) {
                            var input = '[name=' + key + ']';
                            
                            $(input + '+span').html('<strong>'+ value +'</strong>');
                            $(input).addClass('is-invalid');
                            $(input).focus();
                            $(input).change(function(){
                                $(input+'+span').html('');
                                $(input).removeClass('is-invalid');
                            })
                        });  
                    }
                    else
                    {
                        swal({
                        title: dt.status.message,
                        type: "error",
                        icon: "error"
                        })
                    }
                    
                });
            }   
        });
    // }
}

function print_receipt(id)
{   
    window.open('../bukti-pembayaran/'+id+'');
}

function save_all_refund()
{
    
    $("#form-all-refund").validate();
    var data = new FormData($("#form-all-refund")[0]);
    var message = "input";
    swal({
        title: "Apakah anda yakin ?",
        text: "Data refund sudah benar",
        icon: "warning",
        buttons: true,
        dangerMode: false,
        })
        .then((willAction) => {
            if (willAction) {
            $.ajax({
                type  : 'POST',
                url   : '/bayar-all-refund',
                headers : {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data  : data,
                cache:false,
                contentType:false,
                processData:false
                }).done(function(data) {
                if(data.status.code==0)
                {
                    swal({
                        title: "Success!",
                        text: "Data berhasil "+message,
                        icon: "success",
                        button: "Ok!",
                    }).then(function(){
                    if (typeof url_redirect !== 'undefined')
                    {
                        $(location).attr('href',url_redirect);    
                    }
                    else
                    {
                        location.reload(true)
                    }
                });
                } 
            }).fail(function(data) {  
                var dt = data.responseJSON;
                
                if(dt.errors)
                {
                    $('.alert-danger').html('');
                    $.each(dt.errors, function (key, value) {
                        $('.alert-danger').show();
                        $('.alert-danger').append('<li>'+value+'</li>');
                        var input = '[name=' + key + ']';
                        
                        $(input + '+span').html('<strong>'+ value +'</strong>');
                        $(input).addClass('is-invalid');
                        $(input).focus();
                        $(input).change(function(){
                            $(input+'+span').html('');
                            $(input).removeClass('is-invalid');
                        })
                    });  
                }
                else
                {
                    swal({
                    title: dt.status.message,
                    type: "error",
                    icon: "error"
                    })
                }
                
            });
        }   
    });
}
</script>
@endsection