@extends('layoututama')
@section('content')
<div class="row match-height">
    
    <div class="col-md-4">
        <div class="card">
            <div class="card-header">
                <div class="card-title-wrap bar-info">
                    <h4 class="card-title" id="basic-layout-round-controls">Bayar Tagihan</h4>
                </div>
              
            </div>
            <div class="card-body">
                <div class="px-3">
                
                    <form class="form" action="{{url('kasirbayarsave')}}" method="post" id="frmadmin" name="frmadmin">
                        {{csrf_field()}}
                        <input type="hidden" name="id" value="">
                        <input type="hidden" name="idtrans" value="">
                        <div class="form-body">

                            <div class="form-group">
                                <label for="alamat">ID. Pesanan<br>
                                <b>{{$query->id_trans}}</b></label>
                            </div>

                            <div class="form-group">
                                <label for="alamat">Tanggal <br>
                                <b>{{date('d/m/Y')}}</b></label>
                            </div>
                            <div class="form-group">
                                <label for="pelanggan">Nama Pelanggan</label>
                                <input type="text" id="pelanggan" class="form-control round" name="pelanggan" required autofocus value="" readonly>
                            </div>
                            <div class="form-group">
                                <label for="alamat">Alamat</label>
                                <textarea name="alamat" id="alamat" class="form-control round" rows="3" readonly></textarea>
                            </div>
                            <div class="form-group">
                                <label for="kontak">No. Telp</label>
                                <input type="text" id="kontak" class="form-control round" name="kontak" required value="" readonly>
                            </div>
                            <div class="form-group">
                                <label for="email">Email</label>
                                <input type="email" id="email" class="form-control round" name="email"  readonly value="">
                            </div>

                            
                        </div>

                    
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-8">
        <div class="card">
            <div class="card-header">
                <div class="card-title-wrap bar-info">
                    <h4 class="card-title" id="basic-layout-round-controls">Detail Pesanan</h4>
                </div>
              
            </div>
            <div class="card-body px-3">
            <div class="table-responsive">
                <table class="table table-bordered" style="font-size:13px;">
                    <thead>
                        <tr>
                            <th>Kode</th>
                            <th>Nama Item</th>
                            <th>Qty</th>
                            <th>Harga</th>
                            <th>Disc</th>
                            <th>Total</th>
                        </tr>
                    </thead>

                    <tbody>
                        
                            @foreach($detail as $row)
                                <tr>
                                    <td>{{$row->kode_barang}}</td>
                                    <td>{{$row->nama_barang}}
                                        @if($row->is_banner == 1)
                                        <br> Ukuran :  x  Meter
                                        @endif
                                    </td>
                                    <td>{{$row->qty}} {{$row->satuan}}</td>
                                    <td>{{number_format($row->harga)}}</td>
                                    <td>{{$row->diskon}} %</td>
                                    <td>{{number_format($row->total)}}</td>
                                    
                                </tr>
                            @endforeach
                        
                    </tbody>
                </table>
                </div>
                
                <div class="row">
                    <div class="col-lg-6">
                        <label for="total">TOTAL PESANAN</label>
                        <input type="text" id="total" class="form-control" name="total" readonly style="font-size:22px; color:red;" value="">
                    </div>

                    <div class="col-lg-6">
                        <label for="uangmuka">UANGMUKA</label>
                        <input type="text" id="uangmuka" class="form-control" name="uangmuka" style="font-size:22px; color:red;" value="" readonly>
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-6">
                        <label for="total">TOTAL TAGIHAN</label>
                        <input type="text" id="totaltagihan" class="form-control" name="totaltagihan" readonly style="font-size:22px; color:red;" value="0">
                    </div>

                    <div class="col-lg-6">
                        <label for="uangmuka">BAYAR</label>
                        <input type="text" id="bayar" class="form-control" name="bayar" style="font-size:22px; color:red;" value="" autofocus>
                    </div>
                    
                </div>

                <div class="row">
                    <div class="col-lg-6">
                        <label for="total">KEMBALI</label>
                        <input type="text" id="kembali" class="form-control" name="kembali" id="kembali" readonly style="font-size:22px; color:red;">
                    </div>

                    <div class="col-lg-6">
                        <label for="total">TGL. LUNAS</label>
                        <input type="date" id="tanggal" class="form-control" name="tanggal" value="2025-07-05">
                    </div>
                    
                </div>
                
            </div>

            <div class="form-actions px-3 mt-1">
                <button type="button" class="btn btn-danger mr-1" id="batal">
                    <i class="icon-trash"></i> Cancel
                </button>
                <button type="button" class="btn btn-success" id="simpan">
                    <i class="icon-note"></i> Simpan Data
                </button>
            </div>
        </div>
    </div>        
</div>    

</form>
<script>
$(function(){
    $('#simpan').on('click', function(){
            $('#frmadmin').submit();
        });

        $('#bayar').on('keyup',function(){
            var total = $('#totaltagihan').val();
            var bayar = $('#bayar').val();
            
            var kembali = parseInt(bayar) - parseInt(total);

            if(bayar <=0 || bayar == "") {
                $('#kembali').val(0);
            } else{
                if(kembali <= 0) {
                    $('#kembali').val(0);
                } else {
                    $('#kembali').val(kembali);
                }
            }
        });
});
</script>
@endsection