@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') }}">
    <!-- summernote -->
    <link rel="stylesheet" href="{{ asset('plugins/summernote/summernote-bs4.min.css') }}">
    <!-- CodeMirror -->
    <link rel="stylesheet" href="{{ asset('plugins/codemirror/codemirror.css') }}">
    <link rel="stylesheet" href="{{ asset('plugins/codemirror/theme/monokai.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>
    <!-- Summernote -->
    <script src="{{ asset('plugins/summernote/summernote-bs4.min.js') }}"></script>
    <!-- CodeMirror -->
    <script src="{{ asset('plugins/codemirror/codemirror.js') }}"></script>
    <script src="{{ asset('plugins/codemirror/mode/css/css.js') }}"></script>
    <script src="{{ asset('plugins/codemirror/mode/xml/xml.js') }}"></script>
    <script src="{{ asset('plugins/codemirror/mode/htmlmixed/htmlmixed.js') }}"></script>

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

    <!-- Bootstrap Switch -->
    <script src="{{ asset('plugins/bootstrap-switch/js/bootstrap-switch.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'
                }
            })
            
            $('.summernote').summernote({
                height: 300,
                callbacks: {
                    onImageUpload: function(files, editor, welEditable) {
                        sendFile(files[0], editor, welEditable);
                    }
                }
            });

            function sendFile(file, editor, welEditable) {
                data = new FormData();
                data.append("file", file);
                data.append('_token', "{{ csrf_token() }}");
                $.ajax({
                    data: data,
                    type: "POST",
                    url: "{{ route('admin.summernote.upload') }}",
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function(url) {
                        $('.summernote').summernote('editor.insertImage', url);
                    }
                });
            }

            $("input[data-bootstrap-switch]").each(function(){
                $(this).bootstrapSwitch('state', $(this).prop('checked'));
            });
        })
    </script>
@endsection
<x-app-layout>
    <x-slot name="header">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1 class="m-0">{{ __('Pasien') }}</h1>
            </div><!-- /.col -->
            <div class="col-sm-6">
            </div><!-- /.col -->
        </div><!-- /.row -->
    </x-slot>

    <form class="form-horizontal loading" action="{{ route('admin.patient.store') }}" method="POST" enctype="multipart/form-data">
        <x-card class="col-sm-12">
            <x-slot name="title">{{ __('Create') }} {{ __('Pasien') }}</x-slot>
            @csrf
            <div class="form-group row">
                <h3>Identitas</h3>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Jenis Identitas') }} <span class="text-danger">*</span></x-label>
                <div class="col-sm-10">
                    <select name="jenis_identitas" class="form-control select2 {{ $errors->has('jenis_identitas') ? 'is-invalid' : '' }}">
                        <option value="KTP" {{ ("KTP" == old('jenis_identitas'))?'selected':'' }}>KTP</option>
                        {{-- <option value="SIM" {{ ("SIM" == old('jenis_identitas'))?'selected':'' }}>SIM</option> --}}
                        <option value="Pasport" {{ ("Pasport" == old('jenis_identitas'))?'selected':'' }}>Pasport</option>
                        {{-- <option value="Lain nya" {{ ("Lain nya" == old('jenis_identitas'))?'selected':'' }}>Lain nya</option> --}}
                    </select>
                    @if ($errors->has('jenis_identitas'))
                        <small class="error invalid-feedback">{{ $errors->first('jenis_identitas') }}</small>
                    @endif
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Nomor Identitas') }} <span class="text-danger">*</span></x-label>
                <div class="col-sm-10">
                    <x-input id="nomor_identitas" class="{{ $errors->has('nomor_identitas') ? 'is-invalid' : '' }}" type="text" name="nomor_identitas" :value="old('nomor_identitas')"/>
                    @if ($errors->has('nomor_identitas'))
                        <small class="error invalid-feedback">{{ $errors->first('nomor_identitas') }}</small>
                    @endif
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Foto Identitas') }} <span class="text-danger">*</span></x-label>
                <div class="col-sm-10">
                    <div class="fileinput fileinput-new" data-provides="fileinput">
                        <div class="fileinput-preview img-thumbnail text-center mb-2" data-trigger="fileinput">
                            <img src="{{ Storage::url(Setting::getSetting('company-logo')) }}" width="200">
                        </div>
                        <div>
                            <span class="btn btn-info btn-file">
                                <span class="fileinput-new">Select Image</span>
                                <input type="file" name="foto_identitas">
                            </span>
                            <a href="#" class="btn btn-danger fileinput-exists" data-dismiss="fileinput">Remove</a>
                        </div>
                        <p style="margin-top: 15px"><em>Upload image if add image</em></p>
                    </div>
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Nama Lengkap Sesuai KTP') }} <span class="text-danger">*</span></x-label>
                <div class="col-sm-10">
                    <x-input id="nama_lengkap" class="{{ $errors->has('nama_lengkap') ? 'is-invalid' : '' }}" type="text" name="nama_lengkap" :value="old('nama_lengkap')"/>
                    @if ($errors->has('nama_lengkap'))
                        <small class="error invalid-feedback">{{ $errors->first('nama_lengkap') }}</small>
                    @endif
                </div>
            </div>
            <div class="form-group row">
                <x-label class="col-sm-2">{{ __('Foto Pasien') }} <span class="text-danger">*</span></x-label>
                <div class="col-sm-10">
                    <div class="fileinput fileinput-new" data-provides="fileinput">
                        <div class="fileinput-preview img-thumbnail text-center mb-2" data-trigger="fileinput">
                            <img src="{{ Storage::url(Setting::getSetting('company-logo')) }}" width="200">
                        </div>
                        <div>
                            <span class="btn btn-info btn-file">
                                <span class="fileinput-new">Select Image</span>
                                <input type="file" name="foto_pasien">
                            </span>
                            <a href="#" class="btn btn-danger fileinput-exists" data-dismiss="fileinput">Remove</a>
                        </div>
                        <p style="margin-top: 15px"><em>Upload image if add image</em></p>
                    </div>
                </div>
            </div>
            <div class="form-group row">
                <div class="col-sm-6">
                    <div class="form-group row">
                        <h3>Info Pasien</h3>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Nomor Telepon') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="nomor_telepon" class="{{ $errors->has('nomor_telepon') ? 'is-invalid' : '' }}" type="text" name="nomor_telepon" :value="old('nomor_telepon')"/>
                            @if ($errors->has('nomor_telepon'))
                                <small class="error invalid-feedback">{{ $errors->first('nomor_telepon') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Email') }}</x-label>
                        <div class="col-sm-10">
                            <x-input id="email" class="{{ $errors->has('email') ? 'is-invalid' : '' }}" type="email" name="email" :value="old('email')"/>
                            @if ($errors->has('email'))
                                <small class="error invalid-feedback">{{ $errors->first('email') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Jenis Kelamin') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <select name="jenis_kelamin" class="form-control select2 {{ $errors->has('jenis_kelamin') ? 'is-invalid' : '' }}">
                                <option value="">Pilih Jenis Kelamin</option>
                                <option value="Laki Laki" {{ ("Laki Laki" == old('jenis_kelamin'))?'selected':'' }}>Laki Laki</option>
                                <option value="Perempuan" {{ ("Perempuan" == old('jenis_kelamin'))?'selected':'' }}>Perempuan</option>
                                <option value="Lain nya" {{ ("Lain nya" == old('jenis_kelamin'))?'selected':'' }}>Lain nya</option>
                            </select>
                            @if ($errors->has('jenis_kelamin'))
                                <small class="error invalid-feedback">{{ $errors->first('jenis_kelamin') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Tanggal Lahir') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="tanggal_lahir" class="datepicker {{ $errors->has('tanggal_lahir') ? 'is-invalid' : '' }}" type="text" name="tanggal_lahir" :value="old('tanggal_lahir')"/>
                            @if ($errors->has('tanggal_lahir'))
                                <small class="error invalid-feedback">{{ $errors->first('tanggal_lahir') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Tempat Lahir') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="tempat_lahir" class="{{ $errors->has('tempat_lahir') ? 'is-invalid' : '' }}" type="text" name="tempat_lahir" :value="old('tempat_lahir')"/>
                            @if ($errors->has('tempat_lahir'))
                                <small class="error invalid-feedback">{{ $errors->first('tempat_lahir') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Agama') }}</x-label>
                        <div class="col-sm-10">
                            <x-input id="agama" class="{{ $errors->has('agama') ? 'is-invalid' : '' }}" type="text" name="agama" :value="old('agama')"/>
                            @if ($errors->has('agama'))
                                <small class="error invalid-feedback">{{ $errors->first('agama') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('keterangan') }}</x-label>
                        <div class="col-sm-10">
                            <textarea class="form-control" name="keterangan">{{ old('keterangan') }}</textarea>
                            @if ($errors->has('keterangan'))
                                <small class="error invalid-feedback">{{ $errors->first('keterangan') }}</small>
                            @endif
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group row">
                        <h3>Alamat</h3>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Negara Asal') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="negara_asal" class="{{ $errors->has('negara_asal') ? 'is-invalid' : '' }}" type="text" name="negara_asal" :value="old('negara_asal', 'Indonesia')"/>
                            @if ($errors->has('negara_asal'))
                                <small class="error invalid-feedback">{{ $errors->first('negara_asal') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Alamat Domisili') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <textarea class="form-control {{ $errors->has('alamat') ? 'is-invalid' : '' }}" name="alamat">{{ old('alamat') }}</textarea>
                            @if ($errors->has('alamat'))
                                <small class="error invalid-feedback">{{ $errors->first('alamat') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Kelurahan') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="kelurahan" class="{{ $errors->has('kelurahan') ? 'is-invalid' : '' }}" type="text" name="kelurahan" :value="old('kelurahan')"/>
                            @if ($errors->has('kelurahan'))
                                <small class="error invalid-feedback">{{ $errors->first('kelurahan') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Kecamatan') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="kecamatan" class="{{ $errors->has('kecamatan') ? 'is-invalid' : '' }}" type="text" name="kecamatan" :value="old('kecamatan')"/>
                            @if ($errors->has('kecamatan'))
                                <small class="error invalid-feedback">{{ $errors->first('kecamatan') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('Kota') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="kota" class="{{ $errors->has('kota') ? 'is-invalid' : '' }}" type="text" name="kota" :value="old('kota')"/>
                            @if ($errors->has('kota'))
                                <small class="error invalid-feedback">{{ $errors->first('kota') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('RT') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="rt" class="{{ $errors->has('rt') ? 'is-invalid' : '' }}" type="text" name="rt" :value="old('rt')"/>
                            @if ($errors->has('rt'))
                                <small class="error invalid-feedback">{{ $errors->first('rt') }}</small>
                            @endif
                        </div>
                    </div>
                    <div class="form-group row">
                        <x-label class="col-sm-2">{{ __('RW') }} <span class="text-danger">*</span></x-label>
                        <div class="col-sm-10">
                            <x-input id="rw" class="{{ $errors->has('rw') ? 'is-invalid' : '' }}" type="text" name="rw" :value="old('rw')"/>
                            @if ($errors->has('rw'))
                                <small class="error invalid-feedback">{{ $errors->first('rw') }}</small>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
            <x-slot name="footer">
                <x-button class="float-right">{{ __('Save') }}</x-button>
            </x-slot>
        </x-card>
    </form>
</x-app-layout>