@extends('layout')

@section('content')

<!-- Page header -->
<div class="page-header page-header-light">
    <div class="page-header-content header-elements-md-inline">
        <div class="page-title d-flex">
            <h4><i class="icon-arrow-left52 mr-2"></i>Tambah Data Jasa Transfer</h4>
            <a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
        </div>
    </div>
</div>
<!-- /page header -->

<!-- Content area -->
<div class="content">
    
    <!-- Hover rows -->
    <div class="card">
        <div class="card-header header-elements-inline">
        </div>
        <div class="card-body">
            <form class="form-validate-jquery" action="{{ route('jasatransfer.store')}}" method="post">
                @csrf
                
                <div class="form-group row">
                    <label class="col-form-label col-lg-2">Member Evatrack</label>
                    <div class="col-lg-6">
                        {{-- @if (\Auth::user()->role <= 20) --}}
                        @if (\Auth::user()->role <= 21)
                        <select class="select-search form-control border-teal border-1" id="member_id" name="member_id" required>
                            <option value="">-- Pilih Member --</option>
                            @foreach ($users as $user)
                            <option value="{{$user->id}}" data-kodemember="{{$user->kode_member}}">{{$user->nama}}</option>
                            @endforeach
                        </select>
                        <span class="text-muted">Kode Member : <span id="kod_mem"></span></span>
                        <input type="hidden" id="member" name="member">
                        <input type="hidden" id="kode_member" name="kode_member">
                        @else
                        <div class="form-control-plaintext">{{\Auth::user()->nama}}</div>
                        <input type="hidden" id="member"_id" name="member_id" value="{{\Auth::user()->id}}">
                        <input type="hidden" id="member" name="member" value="{{\Auth::user()->nama}}">
                        <input type="hidden" id="kode_member" name="kode_member" value="{{\Auth::user()->kode_member}}">
                        @endif
                        <input type="hidden" id="rate_rmb" name="rate_rmb" value="{{isset($getdatajtvb['setting']['rate_yuan'])?$getdatajtvb['setting']['rate_yuan']:$currency->rate_rupiah}}">
                        <input type="hidden" id="rate_usd" name="rate_usd" value="{{isset($getdatajtvb['setting']['rate_usd'])?$getdatajtvb['setting']['rate_usd']:$currency_usd->rate_rupiah}}">
                    </div>
                </div>
                
                <div class="form-group row">
                    <label class="col-form-label col-lg-2">Nominal Rupiah (Rp)</label>
                    <div class="col-lg-4">
                        <input type="number" id="nominal" name="nominal" class="form-control border-teal border-1" placeholder="Masukkan Nominal Transfer" required>
                    </div>
                    <div class="col-lg-2 text-right">
                        <div class="form-control-plaintext"><span class="badge badge-warning">Rate RMB(Rp) : {{isset($getdatajtvb['setting']['rate_yuan'])?$getdatajtvb['setting']['rate_yuan']:$currency->rate_rupiah}}</span></div>
                    </div>
                    <div class="col-lg-2 text-left">
                        <div class="form-control-plaintext"><span class="badge badge-success">Rate USD(Rp) : {{isset($getdatajtvb['setting']['rate_usd'])?$getdatajtvb['setting']['rate_usd']:$currency_usd->rate_rupiah}}</span></div>
                    </div>
                </div>

                <div class="form-group row">
                    <label class="col-form-label col-lg-2">Pilihan Rate</label>
                    <div class="col-lg-6">
                        <select class="form-control border-teal border-1" name="pilihan_rate" id="pilihan_rate">
                            <option value="rmb">Yuan (¥)</option>
                            <option value="usd">USD ($)</option>
                        </select>
                    </div>
                </div>

                <div class="form-group row">
                    <label class="col-form-label col-lg-2">Nominal Yuan (¥)<br>
                        <span class="text-muted">* Setelah di Convert ke Yuan</span>
                    </label>
                    <div class="col-lg-6">
                        <input type="number" id="nominal_rmb" name="nominal_rmb" class="form-control border-teal border-1" readonly>
                    </div>
                </div>

                <div class="form-group row">
                    <label class="col-form-label col-lg-2">Nominal USD ($)<br>
                        <span class="text-muted">* Setelah di Convert ke Dollar</span>
                    </label>
                    <div class="col-lg-6">
                        <input type="number" id="nominal_usd" name="nominal_usd" class="form-control border-teal border-1" readonly>
                    </div>
                </div>
                
                <legend class="text-uppercase font-size-sm font-weight-bold">Detail Transfer</legend>
                
                <div class="form-control-plaintext font-weight-semibold">Dari</div>
                
                <div class="form-group row">
                    <div class="col">
                        <span>Bank</span>
                        <input id="bank" name="bank" class="form-control border-teal border-1" type="text" required>
                    </div>
                    <div class="col">
                        <span>Atas Nama</span>
                        <input id="atas_nama" name="atas_nama" class="form-control border-teal border-1" type="text" required>
                    </div>
                    <div class="col">
                        <span>No. Rekening</span>
                        <input id="no_rek" name="no_rek" class="form-control border-teal border-1" type="text" required>
                    </div>
                </div>
                
                <div class="form-control-plaintext font-weight-semibold">Tujuan</div>

                <div class="form-group row">
                    <div class="col">
                        <span>Bank</span>
                        <input id="bank_tujuan" name="bank_tujuan" class="form-control border-success border-1" type="text" value="{{isset($getdatajtvb['rekening']['bank'])?$getdatajtvb['rekening']['bank']:''}}" {{\Auth::user()->role == 1?'required':'readonly'}}>
                    </div>
                    <div class="col">
                        <span>Atas Nama</span>
                        <input id="atas_nama_tujuan" name="atas_nama_tujuan" class="form-control border-success border-1" type="text" value="{{isset($getdatajtvb['rekening']['nama_rek'])?$getdatajtvb['rekening']['nama_rek']:''}}" {{\Auth::user()->role == 1?'required':'readonly'}}>
                    </div>
                    <div class="col">
                        <span>No. Rekening</span>
                        <input id="no_rek_tujuan" name="no_rek_tujuan" class="form-control border-success border-1" type="text" value="{{isset($getdatajtvb['rekening']['no_rek'])?$getdatajtvb['rekening']['no_rek']:''}}" {{\Auth::user()->role == 1?'required':'readonly'}}>
                    </div>
                </div>
                <hr>
                <div class="form-group row">
                    <label class="col-form-label col-lg-2">Keterangan</label>
                    <div class="col-lg-6">
                        <textarea class="form-control border-teal border-1" name="keterangan" cols="20" rows="5"></textarea>
                    </div>
                </div>
                
                <div class="text-right">
                    <a href="{{ url('/transfereva')}}" class="btn btn-light">Kembali <i class="icon-undo"></i></a>
                    <button type="submit" class="btn btn-primary">Simpan <i class="icon-paperplane ml-2"></i></button>
                </div>
            </form>
        </div>
        
    </div>
    <!-- /hover rows -->
    
</div>
<!-- /content area -->
@endsection

@section('js')
<!-- Theme JS files -->
<script src="{{asset('global_assets/js/plugins/notifications/pnotify.min.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/forms/validation/validate.min.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/forms/selects/select2.min.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/buttons/spin.min.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/buttons/ladda.min.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/pickers/daterangepicker.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/pickers/anytime.min.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/pickers/pickadate/picker.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/pickers/pickadate/picker.date.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/pickers/pickadate/picker.time.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/pickers/pickadate/legacy.js')}}"></script>
<script src="{{asset('global_assets/js/plugins/forms/styling/uniform.min.js')}}"></script>

<script src="{{asset('assets/js/app.js')}}"></script>
<script src="{{asset('global_assets/js/demo_pages/form_select2.js')}}"></script>
<script src="{{asset('global_assets/js/demo_pages/form_inputs.js')}}"></script>
<script src="{{asset('global_assets/js/demo_pages/form_checkboxes_radios.js')}}"></script>

<script type="text/javascript">
    $(document).on('change','#member_id', function() {
        var kodemember = $('#member_id option:selected').data('kodemember')
        var member = $('#member_id option:selected').text()
        $('#kode_member').val(kodemember);
        $('#member').val(member);
        $('#kod_mem').text(kodemember);
        // console.log(kodemember,member);
    });

    $(document).on('change','#tujuan', function() {
        var bank = $('#tujuan option:selected').data('bank');
        var namarek = $('#tujuan option:selected').data('namarek');
        var norek = $('#tujuan option:selected').data('norek');
        
        $('#bank_tujuan').val(bank)
        $('#atas_nama_tujuan').val(namarek)
        $('#no_rek_tujuan').val(norek)
    })

    $(document).on('change','#nominal', function() {
        var nominal = $('#nominal').val();
        var rate = $('#rate_rmb').val();
        var rate_usd = $('#rate_usd').val();
        
        var nominal_rmb = nominal / rate;
        var nominal_usd = nominal / rate_usd;
        $('#nominal_rmb').val(nominal_rmb.toFixed(2));
        $('#nominal_usd').val(nominal_usd.toFixed(2));
    })
</script>

<script type="text/javascript">
    $( document ).ready(function() {
        
        var $select = $('.form-control-select2').select2();
        
        // Default style
        @if(session('error'))
        new PNotify({
            title: 'Error',
            text: '{{ session('error') }}.',
            icon: 'icon-blocked',
            type: 'error'
        });
        @endif
        @if ( session('success'))
        new PNotify({
            title: 'Success',
            text: '{{ session('success') }}.',
            icon: 'icon-checkmark3',
            type: 'success'
        });
        @endif
        @if ($errors->any())
        @foreach ($errors->all() as $error)
        new PNotify({
            title: 'Error',
            text: '{{ $error }}.',
            icon: 'icon-blocked',
            type: 'error'
        });
        @endforeach
        @endif
        
    });
</script>
@endsection