@extends('dashboard.base')

@section('content')
        <div class="container-fluid">
          <div class="animated fadeIn">
            <div class="row justify-content-md-center">
              <div class="col-sm-12 col-md-12 col-lg-12 col-xl-12">
                @include('dashboard.shared.alert')
                <div class="card">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="m-0">Input Transaksi</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-sm-12 col-md-12">
                                <form action="{{ route('keuangan.store') }}" method="POST">
                                    @csrf
                                    <div class="form-group">
                                        <label>Jenis Transaksi</label><br>
                                        <div class="form-check form-check-inline">
                                            <input class="form-check-input" type="radio" name="jenis" id="kas-masuk" value="kas-masuk" @if (old('jenis') == "kas-masuk") checked @endif>
                                            <label class="form-check-label" for="kas-masuk">Kas Masuk</label>
                                        </div>
                                        <div class="form-check form-check-inline">
                                            <input class="form-check-input" type="radio" name="jenis" id="kas-keluar" value="kas-keluar" @if (old('jenis') == "kas-keluar") checked @endif>
                                            <label class="form-check-label" for="kas-keluar">Kas Keluar</label>
                                        </div>
                                        @error('jenis')
                                            <div class="alert alert-danger py-1 px-2 my-1">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label>Tanggal</label>
                                        <input type="date" class="form-control w-25" name="tanggal" value="{{ old('tanggal', date('dd/mm/yyyy')) }}" required>
                                        @error('tanggal')
                                            <div class="alert alert-danger py-1 px-2 my-1">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label>Instansi</label><br>
                                        <select class="form-control col-sm-12 col-md-12" name="instansi_id" id="instansi_id" width="100%" required>
                                            <option value="" disabled selected hidden></option>
                                            @foreach ($instansis as $value => $instansi)
                                                <option value="{{ $instansi->id }}" @if (old('instansi_id') == $instansi->id) selected @endif>{{ $instansi->name }}</option>
                                            @endforeach
                                        </select>
                                        @error('instansi_id')
                                            <div class="alert alert-danger py-1 px-2 my-1">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label>Nama Transaksi</label>
                                        <input type="text" class="form-control" name="nama" value="{{ old('nama') }}" autofocus required>
                                        @error('nama')
                                            <div class="alert alert-danger py-1 px-2 my-1">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label>Nonimal</label>
                                        <input type="text" class="form-control currency" name="jumlah" value="{{ old('jumlah') }}" required>
                                        @error('jumlah')
                                            <div class="alert alert-danger py-1 px-2 my-1">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label>Keterangan</label>
                                        <textarea class="form-control" name="keterangan"></textarea>
                                        @error('keterangan')
                                            <div class="alert alert-danger py-1 px-2 my-1">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <button id="btn-submit" type="submit" class="btn btn-success">Simpan</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
              </div>
            </div>
          </div>
        </div>

@endsection

@section('javascript')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/autonumeric/1.8.2/autoNumeric.js"></script>
    <script>
        $(document).ready(function(){
            $("#instansi_id").select2({
                placeholder: "Pilih instansi",
                width: 'resolve'
            });
            $(".currency").autoNumeric('init', {
                aSep: '.', 
                aDec: ',',
                aForm: true,
                vMax: '9999999999',
                vMin: '-9999999999'
            });
        });
    </script>
@endsection