@section('css')
    <link rel="stylesheet" href="{{ secure_asset('assets/plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css') }}">
    <link rel="stylesheet" href="{{secure_asset('assets/plugins/select2/css/select2.min.css') }}">
    <link rel="stylesheet" href="{{secure_asset('assets/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">
@endsection
    <div class="box-body row">

        <div class="form-group col-md-6">
            <label for="">Nama Customer<sup style="font-size: 1.5em; vertical-align: text-bottom;">*</sup></label>
            {{ Form::text('nama_customer', $customer->nama_customer, ['class' => 'form-control' . ($errors->has('nama_customer') ? ' is-invalid' : ''), 'placeholder' => 'Nama Customer', 'required']) }}
            <span class="text-danger" id="nama_customer-error"></span>
            @error('nama_customer')
            <div class="text-danger">{{$message}}</div>
            @enderror
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('NIK') }}
            {{ Form::number('nik', $customer->nik, ['class' => 'form-control' . ($errors->has('nik') ? ' is-invalid' : ''), 'placeholder' => 'NIK' ]) }}
            <span class="text-danger" id="nik-error"></span>
        </div>
        <div class="form-group col-md-6">
            <label for="exampleInputEmail1">Tanggal Lahir<sup style="font-size: 1.5em; vertical-align: text-bottom;">*</sup></label>
            <div class="input-group date" data-provide="datepicker" data-date-format="dd-mm-yyyy">
                <input name="tanggal_lahir" type="text" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off"/>

                <div class="input-group-addon">
                    <div class="input-group-text" style="height:39px;"><i class="fa fa-calendar"></i></div>
                </div>
            </div>
            @error('tanggal_lahir')
            <div class="text-danger">{{$message}}</div>
            @enderror
            <span class="text-danger" id="tanggal_lahir-error"></span>

        </div>

        <div class="form-group col-md-6 ">
            <label for="">Jenis Kelamin<sup style="font-size: 1.5em; vertical-align: text-bottom;">*</sup></label>
                <select name="gender" class="form-control select2bs4" >
                    <option value="" disabled selected>
                -- Pilih salah satu --
                </option>
                <option value="L"
                >Laki-Laki</option>
                <option value="P"
                >Perempuan</option>
                </select>
            @error('gender')
            <div class="text-danger">{{$message}}</div>
            @enderror        </div>
        <div class="form-group col-md-6">
            {{ Form::label('foto') }}
            <input type="file" class="form-control" name="foto"
            accept="image/png, image/jpg, image/jpeg" placeholder="pilih foto">
            <p style="font-size: 0.83em; color: grey">File upload maksimal: 2Mb</p>
            <span class="text-danger" id="foto-error"></span>
            @error('foto')
            <div class="text-danger">{{$message}}</div>
            @enderror
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('email') }}
            {{ Form::email('email', $customer->email, ['class' => 'form-control' . ($errors->has('email') ? ' is-invalid' : ''), 'placeholder' => 'Email']) }}
            <span class="text-danger" id="email-error"></span>
            @error('email')
            <div class="text-danger">{{$message}}</div>
            @enderror
        </div>
        <div class="form-group col-md-6">
            <label for="">Password<sup style="font-size: 1.5em; vertical-align: text-bottom;">*</sup></label>
            <input type="password" class="form-control" id="newPassword" name="password" required>
            <span class="text-danger" id="password-error"></span>
            @error('password')
            <div class="text-danger">{{$message}}</div>
            @enderror
        </div>
        <div class="form-group col-md-6">
            <label for="">Konfirmasi Password<sup style="font-size: 1.5em; vertical-align: text-bottom;">*</sup></label>
            <input type="password" class="form-control" id="confirmPassword" name="confirm" required>
            <span class="text-danger" id="confirm-error"></span>
            @error('confirm')
            <div class="text-danger">{{$message}}</div>
            @enderror
        </div>
        <div class="form-group col-md-6">
            <label for="">Nomor Handphone<sup style="font-size: 1.5em; vertical-align: text-bottom;">*</sup></label>
            {{ Form::number('no_hp', $customer->no_hp, ['class' => 'form-control' . ($errors->has('no_hp') ? ' is-invalid' : ''), 'placeholder' => 'Contoh: 08xxxxxxx' , 'required']) }}
            <span class="text-danger" id="no_hp-error"></span>
            @error('no_hp')
            <div class="text-danger">{{$message}}</div>
            @enderror
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('Status') }}
            <input type="text" name="status" id="" value="Belum Diverifikasi" readonly class="form-control">
            <span class="text-danger" id="status-error"></span>
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('Kode Referal') }}
            {{ Form::text('referal_code', $customer->referal_code, ['class' => 'form-control' . ($errors->has('referal_code') ? ' is-invalid' : ''), 'placeholder' => 'Kode Referal','readonly']) }}
            <span class="text-danger" id="referal_code-error"></span>
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('Kode Referal Dari Customer Lain') }}
            {{ Form::text('parent_referal_code', $customer->parent_referal_code, ['class' => 'form-control' . ($errors->has('parent_referal_code') ? ' is-invalid' : ''), 'placeholder' => 'Kode Referal Dari Customer Lain', 'readonly']) }}
            {!! $errors->first('parent_referal_code', '<div class="invalid-feedback">:message</div>') !!}
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('Poin') }}
            {{ Form::text('point', number_format($customer->point, 0, ',', '.'), ['class' => 'form-control' . ($errors->has('point') ? ' is-invalid' : ''), 'placeholder' => 'Point' , 'readonly' => 'readonly']) }}
            {!! $errors->first('point', '<div class="invalid-feedback">:message</div>') !!}
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('XP') }}
            {{ Form::text('level_point', number_format($customer->level_point, 0, ',', '.'), ['class' => 'form-control' . ($errors->has('level_point') ? ' is-invalid' : ''), 'placeholder' => 'XP' , 'readonly' => 'readonly']) }}
            {!! $errors->first('level_point', '<div class="invalid-feedback">:message</div>') !!}
        </div>
        <div class="form-group col-md-6">
            {{ Form::label('Nomor Member') }}
            {{ Form::text('nomor_member', $customer->nomor_member, ['class' => 'form-control' . ($errors->has('nomor_member') ? ' is-invalid' : ''), 'placeholder' => 'Nomor Member' , 'readonly']) }}
            {!! $errors->first('nomor_member', '<div class="invalid-feedback">:message</div>') !!}
        </div>
        <div class="form-group">
        <input type="hidden" value="{{$customer->customer_id}}" name="customer_id">
        <input type="hidden" value="{{$customer->foto}}" name="old_foto">
        </div>

    </div>
@section('js')
    <script src="{{ secure_asset('assets/plugins/sweetalert2/sweetalert2.min.js') }}"></script>
    <script src="{{ secure_asset('assets/plugins/select2/js/select2.full.min.js') }}"></script>
    <script>
         $(function () {
            //Initialize Select2 Elements
            $('.select2bs4').select2({
            theme: 'bootstrap4'
            })
         })
    </script>
@endsection