@section('optional_css')
    <!-- Select2 -->
    <link rel="stylesheet" href="{{ asset('plugins/select2/css/select2.min.css') }}">
    <link rel="stylesheet" href="{{ asset('plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">

    <link rel="stylesheet" href="{{ asset('plugins/daterangepicker/daterangepicker.css') }}">
@endsection
@section('optional_js')
    <!-- Select2 -->
    <script src="{{ asset('plugins/select2/js/select2.full.min.js') }}"></script>

    <script src="{{ asset('plugins/fileinput/fileinput.min.js') }}"></script>

    <!-- Date Picker -->
    <script src="{{ asset('plugins/moment/moment.min.js') }}"></script>
    <script src="{{ asset('plugins/daterangepicker/daterangepicker.js') }}"></script>

    <script>
        $(document).ready(function () {
            $('.select2').select2({
                theme: 'bootstrap4'
            })

            $('.datepicker').daterangepicker({
                singleDatePicker: true,
                showDropdowns: true,
                locale: {
                    format: 'YYYY-MM-DD'
                }
            })
        })
    </script>
@endsection
<x-app-layout>
    <x-slot name="header">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1 class="m-0">{{ __('Payment') }}</h1>
            </div><!-- /.col -->
            <div class="col-sm-6">
            </div><!-- /.col -->
        </div><!-- /.row -->
    </x-slot>

    <form class="form-horizontal" action="{{ route('admin.uinvoice.payment_store', $userinvoice->id) }}" method="POST" enctype="multipart/form-data">
        <x-card class="col-sm-12">
            <x-slot name="title">{{ __('Lakukan') }} {{ __('Pembayaran') }}</x-slot>
            @csrf
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Kode Invoice') }}</x-label>
                <div class="col-sm-10">
                    <x-input id="kode_invoice" readonly class="{{ $errors->has('kode_invoice') ? 'is-invalid' : '' }}" type="text" name="kode_invoice" :value="old('kode_invoice', $userinvoice->kode)"/>
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Total Tagihan') }}</x-label>
                <div class="col-sm-10">
                    <x-input id="total_tagihan" readonly class="{{ $errors->has('total_tagihan') ? 'is-invalid' : '' }}" type="text" name="total_tagihan" :value="old('total_tagihan', $userinvoice->total_tagihan)"/>
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Pembayaran') }}</x-label>
                <div class="col-sm-10">
                    <select id="payment" name="payment" class="form-control select2 {{ $errors->has('payment') ? 'is-invalid' : '' }}">
                        <option value="">Pilih Pembayaran</option>
                        <option value="TUNAI" {{ ("TUNAI" == old('payment'))?'selected':'' }}>TUNAI</option>
                        <option value="EDC BCA" {{ ("EDC BCA" == old('payment'))?'selected':'' }}>EDC BCA</option>
                        <option value="EDC BNI" {{ ("EDC BNI" == old('payment'))?'selected':'' }}>EDC BNI</option>
                        <option value="EDC BRI" {{ ("EDC BRI" == old('payment'))?'selected':'' }}>EDC BRI</option>
                        <option value="EDC CIMB NIAGA" {{ ("EDC CIMB NIAGA" == old('payment'))?'selected':'' }}>EDC CIMB NIAGA</option>
                        <option value="EDC MANDIRI" {{ ("EDC MANDIRI" == old('payment'))?'selected':'' }}>EDC MANDIRI</option>
                        <option value="EDC PERMATA" {{ ("EDC PERMATA" == old('payment'))?'selected':'' }}>EDC PERMATA</option>
                        <option value="TRANSFER BNI" {{ ("TRANSFER BNI" == old('payment'))?'selected':'' }}>TRANSFER BNI</option>
                        <option value="TRANSFER MANDIRI" {{ ("TRANSFER MANDIRI" == old('payment'))?'selected':'' }}>TRANSFER MANDIRI</option>
                        <option value="TRANSFER BCA" {{ ("TRANSFER BCA" == old('payment'))?'selected':'' }}>TRANSFER BCA</option>
                        <option value="QR BRI" {{ ("QR BRI" == old('payment'))?'selected':'' }}>QR BRI</option>
                        <option value="QR PERMATA" {{ ("QR PERMATA" == old('payment'))?'selected':'' }}>QR PERMATA</option>
                    </select>
                    @if ($errors->has('payment'))
                        <small class="error invalid-feedback">{{ $errors->first('payment') }}</small>
                    @endif
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Info Pembayaran') }}</x-label>
                <div class="col-sm-10">
                    <x-input id="info" class="{{ $errors->has('info') ? 'is-invalid' : '' }}" type="text" name="info" :value="old('info')"/>
                    @if ($errors->has('info'))
                        <small class="error invalid-feedback">{{ $errors->first('info') }}</small>
                    @endif
                </div>
            </div>
            <x-slot name="footer">
                <x-button class="float-right">{{ __('Save') }}</x-button>
            </x-slot>
        </x-card>
    </form>
</x-app-layout>