@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-md-11 mx-auto card p-4">
            @if ($message = Session::get('success'))
                <div class="alert alert-success">
                    <p>{{ $message }}</p>
                </div>
            @endif
            <form id="exportform" action="{{route('sistem.export')}}" method="POST"> 
                <table class="table table-striped" id="cawangan">
                    <thead class="bg-primary text-white">
                        <tr>
                            <th><input type="checkbox" aria-label="Checkbox for following text input" onclick="selectall(this)"></th>
                            <th>Nama Cawangan</th>
                            <th>Kod Cawangan</th>
                            <th>IP</th>
                            <th>Nama</th>
                            <th>Nama Pengguna</th>
                            <th>Kata Laluan</th>
                            <th>Status</th>
                            <th class="text-center">Tindakan</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($caw as $data)
                        <tr>
                            <td><input type="checkbox" aria-label="Checkbox for following text input" id="checkboxdata[]" value="{{ $data->id }}"></td>
                            <td>{{ $data->caw_name }}</td>
                            <td>{{ $data->caw_code }}</td>
                            <td>{{ $data->caw_ip }}</td>
                            <td>{{ $data->caw_dbname }}</td>
                            <td>{{ $data->caw_dbuser }}</td>
                            <td>{{ $data->caw_dbpass }}</td>
                            <td>Good</td>
                            <td class="text-center">
                                <form action="{{ route('sistem.deleteConn',$data->id) }}" method="POST" id="formdelconn-{{$data->id}}">
                                    @csrf
                                    <a  href="{{ route('sistem.showConn',$data->id) }}" data-toggle="tooltip" data-placement="top" title="Kemaskini" style="margin-right:30px" ><i class="far fa-edit"></i></a>
                                    {{-- <a  href="{{ route('sistem.showConn',$data->id) }}"><i class="far fa-eye"></i></a> --}}
                                    <a onclick="confirm({{$data->id}})" data-toggle="tooltip" data-placement="top" title="Padam"><i class="far fa-trash-alt"></i></a>
                                </form>
                                
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                    
                </table>
            </form>
        </div>
        
    </div>
    <div class="modal fade" tabindex="-1" id="myModal">
        <div class="modal-dialog modal-lg">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">New Connection</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 action="{{ route('sistem.newConn') }}" method="POST" id="formnewconnection">
                    @csrf
                    <div class="form-row">
                      <div class="form-group col-md-6">
                        <label for="caw_name">Nama Cawangan</label>
                        <input type="text" class="form-control" name="caw_name" id="caw_name" >
                      </div>
                      <div class="form-group col-md-6">
                        <label for="caw_code">Kod Cawangan</label>
                        <input type="text" class="form-control" name="caw_code" id="caw_code" >
                      </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="caw_ip">IP</label>
                          <input type="text" class="form-control" name="caw_ip" id="caw_ip" >
                        </div>
                        <div class="form-group col-md-6">
                          <label for="caw_dbname">Nama</label>
                          <input type="text" class="form-control" name="caw_dbname" id="caw_dbname" >
                        </div>
                      </div>
                      <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="caw_dbuser">Nama Pengguna</label>
                          <input type="text" class="form-control" name="caw_dbuser" id="caw_dbuser" >
                        </div>
                        <div class="form-group col-md-6">
                          <label for="caw_dbpass">Kata Laluan</label>
                          <input type="text" class="form-control" name="caw_dbpass" id="caw_dbpass" >
                        </div>
                      </div>
                      <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="nama_bank">Nama Pemilik Bank</label>
                          <input type="text" class="form-control" name="nama_bank" id="nama_bank" >
                        </div>
                      </div>
                      <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="bank_acc">Akaun Bank</label>
                          <input type="text" class="form-control" name="bank_acc" id="bank_acc" >
                        </div>
                        <div class="form-group col-md-6">
                          <label for="bank_acc_no">No Akaun Bank</label>
                          <input type="text" class="form-control" name="bank_acc_no" id="bank_acc_no" >
                        </div>
                      </div>
                      <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="alamat1">Alamat</label>
                          <input type="text" class="form-control" name="alamat1" id="alamat1" >
                        </div>
                        <div class="form-group col-md-6">
                          <label for="alamat2">Alamat</label>
                          <input type="text" class="form-control" name="alamat2" id="alamat2" >
                        </div>
                      </div>
                      <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="notel">No Telefon</label>
                          <input type="text" class="form-control" name="notel" id="notel" >
                        </div>
                        <div class="form-group col-md-6">
                          <label for="nofaks">No Fax</label>
                          <input type="text" class="form-control" name="nofaks" id="nofaks" >
                        </div>
                      </div>
                      <div class="form-row">
                        <div class="form-group col-md-6">
                          <label for="lokasi">Lokasi</label>
                          <input type="text" class="form-control" name="lokasi" id="lokasi" >
                        </div>
                        <div class="form-group col-md-6">
                          <label for="pkb_jmc">PKB_JMC</label>
                          <input type="text" class="form-control" name="pkb_jmc" id="pkb_jmc" >
                        </div>
                      </div>
                    
                  </form>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">Tutup</button>
              <button type="button" class="btn btn-primary" onclick="newconnection()">Simpan</button>
            </div>
          </div>
        </div>
      </div>
</div>
<script>
    //Enable tooltips everywhere
    $(function () {
        $('[data-toggle="tooltip"]').tooltip()
    })
    function newconnection() {
        $("#formnewconnection").submit();
    }
    function confirm(id) {
        // console.log(id);
        $.confirm({
        title: 'Confirmation',
        content: 'Anda pasti?',
        type: 'orange',
        typeAnimated: true,
        buttons: {
            Delete: {
                btnClass: 'btn-warning',
                action: function () {
                    $("#formdelconn-"+id).submit();
                }
            },  
            Batal: {
                btnClass: 'btn-default',
                action: function () {}
            }
        }
    });
    }
   
        var tablecawangan = $('#cawangan').DataTable({
            "columnDefs": [ 
                {
                "targets": 0,
                "orderable": false
                }, 
                {
                "targets": 8,
                "orderable": false
                }
            ],
            order: [[1, 'asc']],
            "info": false,
            "lengthChange": false,
            "pageLength": 40,
            dom: 'Bfrtip',
            buttons: [
                {
                    className: 'btn btn-outline-success pl-4 pr-4 btn-sm addcaw',
                    text: '<i class="fas fa-plus" id="test"></i>',
                    titleAttr: 'Tambah Cawangan',
                    action: function ( e, dt, node, config ) {
                        // alert( 'Button activated' );
                        // console.log('hye');
                        
                        $('#myModal').modal("show");
                        $('#myModal').on('shown.bs.modal', function () {
                            $('#rolename').trigger('focus')
                        })
                    }
                },
                {
                    className: 'btn btn-outline-secondary pl-4 pr-4 btn-sm  export',
                    titleAttr: 'Export to CSV',
                    text: '<i class="fas fa-download"></i>',
                    action: function ( e, dt, node, config ) {
                        $("#exportform").submit();
                    }
                }
            ]
        });

        $('.addcaw').tooltip();
        $('.export').tooltip();
        // $( '.dt-buttons').addClass('btn-group');
        $( '.addcaw').removeClass('dt-button');
        $( '.export').removeClass('dt-button');
    

    function selectall(cb) {
      tablecawangan.rows().nodes().to$().find('input[type="checkbox"]').each(function(){
            $(this).prop('checked', cb.checked);
        })
    }
</script>
     
@endsection