@extends('layouts.app')

@section('title')
  Dashboard
@endsection

@section('admin-content')
    <script src="https://cdn.jsdelivr.net/npm/autonumeric@4.6.0/dist/autoNumeric.min.js"></script>

    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>Transfer Budgets</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('dashboard.index') }}">Dashboard</a></li>
                        </li>
                    </ol>
                </div>
            </div>
        </div>
    </section>
    <section class="content">
        <div class="container-fluid">
            <div class="card card-primary card-outline">
                <div class="card-body">
					<form method="POST" action="{{ route('budget_control.store') }}" enctype="multipart/form-data">
                        @csrf
                        @include('backend.layouts.partials.messages')
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="mb-3">
                                    <label class="form-label">Periode Bulan <span class="font-italic font-weight-normal">(required)</span></label>
									<select class="form-control form-control-md" name="periode_month" required>
										<option value="">Pilih Bulan</option>
										<option value="january" {{ old('periode_month') == 1 ? 'selected' : '' }}>Januari</option>
										<option value="february" {{ old('periode_month') == 2 ? 'selected' : '' }}>Februari</option>
										<option value="march" {{ old('periode_month') == 3 ? 'selected' : '' }}>Maret</option>
										<option value="april" {{ old('periode_month') == 4 ? 'selected' : '' }}>April</option>
										<option value="may" {{ old('periode_month') == 5 ? 'selected' : '' }}>Mei</option>
										<option value="june" {{ old('periode_month') == 6 ? 'selected' : '' }}>Juni</option>
										<option value="july" {{ old('periode_month') == 7 ? 'selected' : '' }}>Juli</option>
										<option value="august" {{ old('periode_month') == 8 ? 'selected' : '' }}>Agustus</option>
										<option value="september" {{ old('periode_month') == 9 ? 'selected' : '' }}>September</option>
										<option value="october" {{ old('periode_month') == 10 ? 'selected' : '' }}>Oktober</option>
										<option value="november" {{ old('periode_month') == 11 ? 'selected' : '' }}>November</option>
										<option value="december" {{ old('periode_month') == 12 ? 'selected' : '' }}>Desember</option>
									</select>
                                </div>
								<div class="mb-3">
                                    <label class="form-label">Periode Tahun <span class="font-italic font-weight-normal">(required)</span></label>
									<select class="form-control form-control-md" name="periode_year" required>
										<option value="">Pilih Tahun</option>
										{{-- get current year and one year after --}}
										@for ($i = date('Y'); $i <= date('Y') + 1; $i++)
											<option value="{{ $i }}" {{ old('periode_year') == $i ? 'selected' : '' }}>{{ $i }}</option>
										@endfor
									</select>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Penerima <span class="font-italic font-weight-normal">(required)</span></label>
                                    <select class="form-control form-control-md" name="receiver_id" required>
                                        <option value="">Pilih Receiver</option>
                                        @foreach ($users as $receiver)
                                            <option value="{{ $receiver->id }}" {{ old('receiver_id') == $receiver->id ? 'selected' : '' }}>
                                                {{ $receiver->name }} ({{ $receiver->cabang->cabang->name }})
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="mb-3">
                                    <label class="form-label">Amount <span class="font-italic font-weight-normal">(required)</span></label>
                                    <input type="text" class="form-control" name="amount" id="amount" required value="{{ old('amount') }}">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Remarks <span class="font-italic font-weight-normal">(optional)</span></label>
                                    <textarea class="form-control" name="remarks">{{ old('remarks') }}</textarea>
                                </div>
								<div class="mb-3">
                                    <label class="form-label">Tanggal Closing <span class="font-italic font-weight-normal">(required)</span></label>
                                    <input type="datetime-local" class="form-control" name="closing_at" id="closing_at" required value="{{ old('closing_at') }}">
                                </div>
                            </div>

                            <button type="submit" class="btn btn-primary ml-2">Submit</button>
                        </div>
					</form>
                </div>
            </div>
        </div>
    </section>

    <script>
        new AutoNumeric('#amount', {
            digitGroupSeparator: '.', // Pemisah ribuan
            decimalCharacter: ',',    // Karakter desimal (tidak digunakan karena tanpa desimal)
            currencySymbol: 'Rp.',    // Simbol mata uang
            decimalPlaces: 0,         // Tidak ada angka desimal
            unformatOnSubmit: true    // Nilai asli tanpa format saat dikirimkan
        });
    </script>
@endsection