@extends('layouts.app')

@section('content')


  <!-- Modal HistoryBayaran -->
  <div class="modal fade" id="denominasiShowModal" tabindex="-1" role="dialog" aria-labelledby="ModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
      <div class="modal-content">
        <div class="modal-header">

          <ul class="nav nav-pills">
            {{-- <li class="nav-item">
              <a class="nav-link" data-toggle="pill" href="#home" role="tab" aria-controls="pills-flamingo" aria-selected="true">Bundle</a>
            </li> --}}
            <li class="nav-item">
              <a class="nav-link active" data-toggle="pill" href="#profile" role="tab" aria-controls="pills-cuckoo" aria-selected="false">Keping</a>
            </li>
          </ul>

          <label class="mt-2 ml-3">Bundle:</label><input type="text" class="form-control col-2 ml-3" id="amaunbundle" placeholder="0.00" readonly>
         <label class="mt-2 ml-3">Keping:</label><input type="text" class="form-control col-2 ml-3" id="amaunkeping" placeholder="0.00" readonly>
         <label class="mt-2 ml-3">Amaun:</label><input type="text" class="form-control col-2 ml-3" id="amaunkeseluruhan" placeholder="0.00" readonly>
          
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          
        </div>
        <div class="modal-body">  

          <div class="tab-content">
            <div class="tab-pane fade" id="home" role="tabpanel" aria-labelledby="flamingo-tab">
              
              <table class="table"> 
                    <tr>
                          <th></th>
                          <th>Peti Besi</th>
                          <th>Jumlah (RM)</th>
                          <th></th>
                          <th>Peti Besi</th>
                          <th>Jumlah (RM)</th>
                    </tr>
                    <tr>
                      <td>RM1</td>
                      <td><input type="text" name="ambilanb1" class="form-control" id="bundle1" readonly/> </td>
                      <td><input type="text" name="totalb1" class="form-control" id="totalb1" value="0.00" readonly/> </td>
                      <td> RM20</td>
                      <td><input type="text" name="ambilanb20" class="form-control" id="bundle20" readonly/> </td>
                      <td><input type="text" name="totalb20" class="form-control" id="totalb20" value="0.00" readonly/> </td>
                  </tr>
                  <tr>
                      <td>RM5</td>
                      <td><input type="text" name="ambilanb5" class="form-control" id="bundle5" readonly/> </td>
                      <td><input type="text" name="totalb5" class="form-control" id="totalb5" value="0.00" readonly/> </td>
                      <td>RM50</td> 
                      <td><input type="text" name="ambilanb50" class="form-control" id="bundle50" readonly/> </td>
                      <td><input type="text" name="totalb50" class="form-control" id="totalb50" value="0.00" readonly/> </td>
                  </tr>
                  <tr>
                      <td>RM10</td>
                      <td><input type="text" name="ambilanb10" class="form-control" id="bundle10" readonly/> </td>
                      <td><input type="text" name="totalb10" class="form-control" id="totalb10" value="0.00" readonly/> </td>
                      <td>RM100 </td>
                      <td><input type="text" name="ambilanb100" class="form-control" id="bundle100" readonly/> </td>
                      <td><input type="text" name="totalb100" class="form-control" id="totalb100" value="0.00" readonly/> </td>
                  </tr>
                    </table>

            </div>
            <div class="tab-pane fade  show active" id="profile" role="tabpanel" aria-labelledby="profile-tab">
              
          <table class="table"> 
            <tr>
                  <th></th>
                  <th>Peti Besi</th>
                  <th>Jumlah (RM)</th>
                  <th></th>
                  <th>Peti Besi</th>
                  <th>Jumlah (RM)</th>
            </tr>
            <tr>
              
              <td>RM0.01</td>
              <td><input type="text" name="ambilansen1" class="form-control" id="sen1" readonly/> </td>
              <td><input type="text" name="totalsen1" id="totalsen1" class="form-control" value="0.00" readonly/> </td>
              <td>RM1</td>
              <td><input type="text" name="ambilanring1" class="form-control" id="ringgit1" readonly/> </td>
              <td><input type="text" name="totalring1" id="totalring1" class="form-control" value="0.00" readonly/> </td>
          </tr>
          <tr>
              <td>RM0.05</td>
              <td><input type="text" name="ambilansen5" class="form-control" id="sen5" readonly/> </td>
              <td><input type="text" name="totalsen5" id="totalsen5" class="form-control" value="0.00" readonly/> </td>
              <td>RM5</td>
              <td><input type="text" name="ambilanring5" class="form-control" id="ringgit5" readonly/> </td>
              <td><input type="text" name="totalring5" id="totalring5" class="form-control" value="0.00" readonly/> </td>
          </tr>
          <tr>
              <td>RM0.10</td>
              <td><input type="text" name="ambilansen10" class="form-control" id="sen10" readonly/> </td>
              <td><input type="text" name="totalsen10" id="totalsen10" class="form-control" value="0.00" readonly/> </td>
              <td>RM10</td>
              <td><input type="text" name="ambilanring10" class="form-control" id="ringgit10" readonly/> </td>
              <td><input type="text" name="totalring10" id="totalring10" class="form-control" value="0.00" readonly/> </td>
          </tr>
          <tr>
            <td>RM0.20</td>
            <td><input type="text" name="ambilansen20" class="form-control" id="sen20" readonly/> </td>
            <td><input type="text" name="totalsen20" id="totalsen20" class="form-control" value="0.00" readonly/> </td>
            <td> RM20</td>
            <td><input type="text" name="ambilanring20" class="form-control" id="ringgit20" readonly/> </td>
            <td><input type="text" name="totalring20" id="totalring20" class="form-control" value="0.00" readonly/> </td>
        </tr>
        <tr>
          <td>RM0.50</td>
          <td><input type="text" name="ambilansen50" class="form-control" id="sen50" readonly/> </td>
          <td><input type="text" name="totalsen50" id="totalsen50" class="form-control" value="0.00" readonly/> </td>
          <td>RM50</td> 
          <td><input type="text" name="ambilanring50" class="form-control" id="ringgit50" readonly/> </td>
          <td><input type="text" name="totalring50" id="totalring50" class="form-control" value="0.00" readonly/> </td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td>RM100 </td> 
        <td><input type="text" name="ambilanring100" class="form-control" id="ringgit100" readonly/> </td>
        <td><input type="text" name="totalring100" id="totalring100" class="form-control" value="0.00" readonly/> </td>
      </tr>
      </table>

            </div>
          </div>

          <input type="hidden" id="jenisjenis"/>
          <input type="hidden" id="kodcawangan"/>
          <input type="hidden" id="tellerla"/>

        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-danger btn-lg" data-dismiss="modal">Tutup</button>
        </div>
      </div>
    </div>
  </div>

<div class="container">

    <div class="row justify-content-center" style="margin-top:60px;">
        <div class="col-md-12">
            
            <div class="card">

                <div class="card-header bg-secondary text-center">{{ __('Paparan Utama') }}</div>

                <div class="card-body text-center">

                 <div class="row form-group justify-content-center">   
                 <div class="col-3 mx-1">    
                 <div class="row">    
                <a href="{{ url('dashboard') }}" class="btn btn-info btn-lg btn-block mb-3">Dashboard</a>
                 </div>
                <div class="row">
                <a href="{{ url('kakitangan') }}" class="btn btn-info btn-lg btn-block mb-3">Kakitangan</a>
            </div>
            <div class="row">
                <a href="{{ url('kelulusan') }}" id="btnkelulusan" class="btn btn-info btn-lg btn-block  mb-3">Kelulusan</a>
            </div>
            <div class="row">
                <a href="{{ url('unjuran') }}" class="btn btn-danger btn-lg btn-block mb-3">Unjuran</a>
            </div>
                 </div>

                <div class="col-3 mx-1">
                <div class="row">
                <a href="#" class="btn btn-danger btn-lg btn-block mb-3">Pelanggan</a>
            </div>
            <div class="row">
                <a href="{{ route('laporan') }}" class="btn btn-info btn-lg btn-block mb-3">Laporan</a>
            </div>
            <div class="row">
                <a href="{{ url('menu') }}" class="btn btn-info btn-lg btn-block mb-3">Khazanah</a>
            </div>
            <div class="row">
                <a href="{{ url('pendahuluanserahan') }}" class="btn btn-info btn-lg btn-block mb-3">Pendahuluan - Serahan</a>
            </div>
            <div class="row">
                <a href="#" data-target="#denominasiShowModal" data-toggle="modal" class="btn btn-info btn-lg btn-block mb-3">Denominasi</a>
            </div>
        
            </div>
                <div class="col-3 mx-1">
            <div class="row">
                <a href="{{ url('capaian') }}" class="btn btn-info btn-lg btn-block mb-3">Capaian</a>
            </div>
            <div class="row">
                <a href="{{ route('lelong') }}" class="btn btn-danger btn-lg btn-block mb-3">Lelong</a>
            </div>
            <div class="row">
                <a href="{{ url('panjar') }}" class="btn btn-info btn-lg btn-block mb-3">Perbelanjaan</a>
            </div>
            <div class="row">
                <a href="{{ url('alirantunai') }}" class="btn btn-info btn-lg btn-block  mb-3">Aliran Tunai</a>
            </div>
            </div>
                       
            </div>
            </div>
        </div>
    </div>
</div>
<script>

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

        var pusher = new Pusher("{{ env('PUSHER_APP_KEY') }}", {
            cluster: 'ap1',
            encrypted: true
        });

        var cawangankhazanah = '{{ Auth::user()->cawangan }}';

        var channel = pusher.subscribe('status-liked');
        channel.bind('my-event', function(data) {
            // let message = JSON.stringify(data);

            if(cawangankhazanah == data.cawangan)
            {
                $('#btnkelulusan').removeClass("btn-primary").addClass("btn-success");

            }
        });


        let api = "{{ config('api.url') }}";
        let kodcaw = "{{ Auth::user()->cawangan }}";

        $.ajax({
            method: 'get',
            url: api + '/api/DenominasiController/' + kodcaw,
            success:function(data)
            {
                $.each(data, function(key,val) {             
                    

                    $('#bundle1').val(val.bd1);
                    $('#totalb1').val(formatter.format(val.b1));

                    $('#bundle20').val(val.bd20);
                    $('#totalb20').val(formatter.format(val.b20));

                    $('#bundle5').val(val.bd5);
                    $('#totalb5').val(formatter.format(val.b5));

                    $('#bundle50').val(val.bd50);
                    $('#totalb50').val(formatter.format(val.b50));

                    $('#bundle10').val(val.bd10);
                    $('#totalb10').val(formatter.format(val.b10));

                    $('#bundle100').val(val.bd100);
                    $('#totalb100').val(formatter.format(val.b100));

                    $('#sen1').val(val.txtsen1);
                    $('#totalsen1').val(formatter.format(val.k01));

                    $('#sen5').val(val.txtsen5);
                    $('#totalsen5').val(formatter.format(val.k05));

                    $('#sen10').val(val.txtsen10);
                    $('#totalsen10').val(formatter.format(val.k010));

                    $('#sen20').val(val.txtsen20);
                    $('#totalsen20').val(formatter.format(val.k020));

                    $('#sen50').val(val.txtsen50);
                    $('#totalsen50').val(formatter.format(val.k050));

                    $('#ringgit1').val(val.txtring1);
                    $('#totalring1').val(formatter.format(val.k1));

                    $('#ringgit5').val(val.txtring5);
                    $('#totalring5').val(formatter.format(val.k5));

                    $('#ringgit10').val(val.txtring10);
                    $('#totalring10').val(formatter.format(val.k10));

                    $('#ringgit20').val(val.txtring20);
                    $('#totalring20').val(formatter.format(val.k20));

                    $('#ringgit50').val(val.txtring50);
                    $('#totalring50').val(formatter.format(val.k50));

                    $('#ringgit100').val(val.txtring100);
                    $('#totalring100').val(formatter.format(val.k100));

                    $('#amaunkeping').val("RM " + formatter.format(val.jumlahkeping));
                    $('#amaunbundle').val("RM " + formatter.format(val.jumlahbundle));
                    $('#amaunkeseluruhan').val("RM " + formatter.format(val.txtjumlah));

                });     
            }
            
        });


</script>
@endsection
