@extends('layouts.app')

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb pb-3">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
                            <li class="breadcrumb-item"><a href="{{ route('laporan') }}">Laporan</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Penyelesaian Pem. </li>
                        </ol>
                    </nav>

                    <div class="card-body text-center">
                        <div class="row form-group">
                            <div class="col-md-2">
                            </div>
                            <div class="col-md-10">
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-">
                                <form action="{{ route('tebusujrah.laporancetak') }}" target="_blank" method="post">
                                    @csrf
                                    <div class="input-group mb-3">
                                        <div class="input-group-prepend ml-3">
                                            <span class="input-group-text" id="basic-addon1">Mula</span>
                                        </div>
                                        <input type="text" class="form-control col-4" placeholder="Pilih Tarikh"
                                            aria-label="Tarikh" id="datemula" name="datemula"
                                            aria-describedby="basic-addon1">

                                        <div class="input-group-prepend ml-2 ">
                                            <span class="input-group-text" id="basic-addon1">Hingga</span>
                                        </div>
                                        <input type="text" class="form-control col-4" placeholder="Pilih Tarikh"
                                            aria-label="Tarikh" id="datehingga" name="datehingga"
                                            aria-describedby="basic-addon1">


                                        <input type="submit" class="btn btn-primary ml-md-5" id="submit_button"
                                            name="submit_button" value="Cetak">
                                    </div>
                                </form>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <table class="table table-striped table-hover" id="myTable">
                                    <thead class="thead-dark">
                                        <tr style="white-space: nowrap">
                                            <th>Bil</th>
                                            <th width="22%">Nama</th>
                                            <th>No K/P</th>
                                            <th>Tarikh<br>Penyelesaian Pemb.</th>
                                            <th>No<br>Rujukan</th>
                                            <th>Pembiayaan<br>(RM)</th>
                                            <th>Lain-lain Caj<br>(RM)</th>
                                            <th>Keuntungan 1% <br>(RM)</th>
                                            <th>Keuntungan<br>(RM)</th>
                                            <th>Bayaran<br>(RM)</th>
                                        </tr>
                                    </thead>
                                    <tfoot class="thead-dark">
                                        <th colspan="5">TOTAL</th>
                                        <th id="pinjamantotal"></th>
                                        <th id="totalujrah"></th>
                                        <th id="totalonepercent"></th>
                                        <th id="keuntungantotal"></th>
                                        <th id="bayarantotal"></th>
                                    </tfoot>
                                </table>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        var api_url = "<?php echo $api_url; ?>";
        var kodcaw = "<?php echo $cawangan_info['kodcaw']; ?>";

        var tabletebus = $('#myTable').DataTable({
            "ordering": true
        });

        $(document).ready(function() {
            $('#datemula').datepicker({
                format: 'dd-mm-yyyy'
            });
            $('#datehingga').datepicker({
                format: 'dd-mm-yyyy'
            });

            //current time
            var current = new Date();
            var current_date = current.getDate();
            var current_month = current.getMonth() + 1;
            var current_year = current.getFullYear();
            var today_date = current_year + '-' + current_month + '-' + current_date;

            $.ajax({
                method: 'get',
                url: api_url + '/api/tebusujrah/laporan/' + kodcaw,
                data: {
                    mula: today_date,
                    akhir: today_date,
                },
                success: function(tebus) {
                    tebustable(tebus);
                }
            });
        });

        $('#datemula').change(function() {

            //mula
            var input_date = this.value;
            var split_date = input_date.split('-');
            var mula_date = split_date[2] + '-' + split_date[1] + '-' + split_date[0];

            var mula = mula_date;

            //current time
            var hinggainput = $('#datehingga').val();

            if (hinggainput != '') {
                var input_date = hinggainput;
                var split_date = input_date.split('-');
                var hingga_date = split_date[2] + '-' + split_date[1] + '-' + split_date[0];

                var akhir = hingga_date;

            } else {
                var current = new Date();
                var current_date = current.getDate();
                var current_month = current.getMonth() + 1;
                var current_year = current.getFullYear();
                var today_date = current_year + '-' + current_month + '-' + current_date;

                var akhir = today_date;
            }

            $.ajax({
                method: 'get',
                url: api_url + '/api/tebusujrah/laporan/' + kodcaw,
                data: {
                    mula: mula,
                    akhir: akhir,
                },
                success: function(tebus) {
                    tebustable(tebus);
                }
            });
        });


        $('#datehingga').change(function() {
            var input_date = this.value;
            var split_date = input_date.split('-');
            var hingga_date = split_date[2] + '-' + split_date[1] + '-' + split_date[0];

            var akhir = hingga_date;

            //current time
            var mulainput = $('#datemula').val();

            if (mulainput != '') {
                var input_date = mulainput;
                var split_date = input_date.split('-');
                var mula_date = split_date[2] + '-' + split_date[1] + '-' + split_date[0];

                var mula = mula_date;

            } else {

                var dulu_date = '2017-01-01';

                var mula = dulu_date;
            }

            $.ajax({
                method: 'get',
                url: api_url + '/api/tebusujrah/laporan/' + kodcaw,
                data: {
                    mula: mula,
                    akhir: akhir,
                },
                success: function(tebus) {
                    tebustable(tebus);
                }
            });
        });



        const formatter = new Intl.NumberFormat('en-US', {
            minimumFractionDigits: 2
        });

        function tebustable(data) {
            var counter = 1;
            var total_pinjaman = 0;
            var total_keuntungan = 0;
            var total_bayaran = 0;
            var total_ujrah = 0;
            var total_onepercent = 0;
            // var bakiupah = 0;


            // console.log(data);

            tabletebus.clear().draw();
            $.each(data, function(index, tebus) {
                total_pinjaman += parseFloat(tebus['pinjaman']);
                // total_keuntungan += parseFloat(tebus['bakiupah']);

                if (tebus['tagbaru'] == '1') {
                   bakiupah = 0.00;
                } else {
                    total_keuntungan = 0.00;
                    bakiupah = parseFloat(tebus['bakiupah']);
                }

                total_bayaran += parseFloat(tebus['bakipjm']);
                total_ujrah += parseFloat(tebus['ujrah']);
                total_onepercent += parseFloat(tebus['onepercent']);

                // console.log(tebus['tagbaru']);
                tabletebus.row.add([
                    counter,
                    tebus['nama'],
                    tebus['nokp'],
                    tebus['t_tebus'],
                    tebus['norujukan'],
                    formatter.format(tebus['pinjaman']),
                    formatter.format(tebus['ujrah']),
                    formatter.format(tebus['onepercent']),
                    // formatter.format(tebus['bakiupah']),
                    formatter.format(bakiupah),
                    formatter.format(tebus['bakipjm'])

                    
                ]).draw();
                counter = counter + 1;
                $('#pinjamantotal').text(formatter.format(total_pinjaman.toFixed(2)));
                $('#totalujrah').text(formatter.format(total_ujrah.toFixed(2)));
                $('#totalonepercent').text(formatter.format(total_onepercent.toFixed(2)));
                $('#keuntungantotal').text(formatter.format(total_keuntungan.toFixed(2)));
                $('#bayarantotal').text(formatter.format(total_bayaran.toFixed(2)));
            });


        }
    </script>
@endsection