@extends('layouts.app-frontend')

@section('content')
    <link rel="stylesheet" href="{{asset('css/form.css')}}">
    <div class="container form">
        @if(count($errors) > 0)
          <div class="alert alert-danger">
            @foreach($errors->all() as $error)
                <p>{{ $error }}</p>
            @endforeach
          </div>
        @endif
		@if(session('status'))
			<div class="alert alert-danger">
				  <p>{{ session('status') }}</p>
			</div>
		@endif
        
            {{ Form::open(array('id' => 'formSubmission', 'url' => env('PROXY_URL').env('SUB_DIRECTORY').'/submission', 'method' => 'POST', 'files' => true)) }}
            {{ Form::hidden('promo_id', $promo_id, array('id' => 'promo_id')) }}
            {{ Form::hidden('sub_directory', env('SUB_DIRECTORY'), array('id' => 'sub_directory')) }}
            {{ Form::hidden('post_url', env('PROXY_URL').env('SUB_DIRECTORY').'/submission', array('id' => 'post_url')) }}

            <section class="form__breadcrumb">
                <div class="row">
                    <div class="col-4 ml-auto form__breadcrumb__first">
                        <div class="row">
                            <div class="col-12 pl-lg-5 form__breadcrumb__number">
                                1
                            </div>
                            <div class="col-6 text-center form__breadcrumb__text complete">
                                Pilih Promo
                            </div>
                            <div class="col-6 d-none d-lg-block">
                                <hr>
                            </div>
                        </div>
                    </div>
                    <div class="col-4 form__breadcrumb__second">
                        <div class="row">
                            <div class="col-12 pl-lg-5 form__breadcrumb__number">
                                2
                            </div>
                            <div class="col-6 text-center form__breadcrumb__text active">
                                Isi Formulir
                            </div>
                            <div class="col-6 d-none d-lg-block">
                                <hr>
                            </div>
                        </div>
                    </div>
                    <div class="col-4 col-lg-2 mr-auto form__breadcrumb__third">
                        <div class="row">
                            <div class="col-12 form__breadcrumb__number">
                                3
                            </div>
                            <div class="col-12 form__breadcrumb__text">
                                Verifikasi
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="form__header">
                <p class="title">Formulir</p>
                <p class="subtitle">Isi formulir dibawah ini untuk klaim promo yang anda inginkan</p>
            </section>
            <section class="form__content">
                <div class="row">
                    <div class="col-12 col-md-10 mx-md-auto">
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('product', 'Jenis Kamera')}} <span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Pilih jenis kamera yang telah anda beli</p></div>
                            <div class="col-12">
                                <select name="product" id="product" class="form-control" required>
                                    <option value="">--Pilih jenis kamera--</option>
                                    @foreach ($products as $product)
                                    <option value="{{ $product->id }}" data-gift="{{$product->gift}}"> {{ $product->product_type->name }}{{$product->product !== '' && $product->product !== ' ' ? ' - ' . $product->product : ''}}</option>   
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('gift', 'Jenis Klaim')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Pilih jenis klaim yang anda ingin ajukan</p></div>
                            <div class="col-12">
                                <select name="gift" id="gift" class="form-control" required>
                                    <option value="">--Pilih jenis klaim--</option>
                                </select>
                            </div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('name', 'Nama Lengkap')}}<span class="mandatory">*</span></div>
                            <div class="col-12">{{Form::text('name', null, array('required' => 'required', 'id' => 'name'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('email', 'Email')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Pastikan anda menulis alamat email dengan benar.</p></div>
                            <div class="col-12">{{Form::email('email', null, array('required' => 'required', 'id' => 'email'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('email', 'Konfirmasi Email')}}<span class="mandatory">*</span></div>
                            <div class="col-12">{{Form::email('email_confirmation', null, array('required' => 'required', 'id' => 'email-confirm'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('phone', 'Nomor Telepon')}}<span class="mandatory">*</span></div>
                            <div class="col-12">{{Form::text('phone', null, array('required' => 'required', 'id' => 'phone'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('address', 'Alamat Pengiriman')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Alamat pengiriman lengkap (dengan kode pos)</p></div>
                            <div class="col-12">{{Form::textarea('address', null, array('required' => 'required', 'id' => 'address'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('nearest_city', 'Pusat Klaim Terdekat')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Pilih pusat klaim terdekat dari kotamu</p></div>
                            <div class="col-12">
                                <select name="nearest_city" id="nearest_city" class="form-control" required>
                                    <option value="Jakarta">Jakarta</option>
                                    <option value="Surabaya">Surabaya</option>
                                    <option value="Yogyakarta">Yogyakarta</option>
                                    <option value="Makassar">Makassar</option>
                                </select>
                            </div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('no_ktp', 'Nomor Identitas')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Masukkan nomor identitas (KTP, SIM, Passpord) sesuai dengan data yang di upload</p></div>
                            <div class="col-12">{{Form::text('no_ktp', null, array('required' => 'required', 'id' => 'no_ktp'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('no_warranty', 'Nomor Serial')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Masukkan nomor serial body kamera (8 karakter, huruf dan angka)</p></div>
                            <div class="col-12">{{Form::text('no_warranty', null, array('required' => 'required', 'id' => 'no_warranty'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12">{{Form::label('dealer_name', 'Dealer')}}<span class="mandatory">*</span></div>
                            <div class="col-12"><p class="description">Tuliskan nama dealer tempat melakukan pembelian produk</p></div>
                            <div class="col-12">{{Form::text('dealer_name', null, array('required' => 'required', 'id' => 'dealer_name'))}}</div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-12 col-lg-4">
                                <div class="row">
                                    <div class="col-12">{{Form::label('image_ktp', 'Foto KTP')}}<span class="mandatory">*</span></div>
                                    <div class="col-12">{{Form::file('image_ktp', array('id' => 'image_ktp', 'required' => 'required', 'accept' => 'image/*'))}}</div>
                                        <input type="hidden" name="image_ktp_comp" id="image_ktp_comp">
                                        <input type="hidden" name="image_ktp_ext" id="image_ktp_ext">
                                </div>
                            </div>
                            <div class="col-12 col-lg-4">
                                <div class="row">
                                    <div class="col-12">{{Form::label('image_warranty', 'Foto Garansi')}}<span class="mandatory">*</span></div>
                                    <div class="col-12">
                                        {{Form::file('image_warranty', array('id' => 'image_warranty', 'required' => 'required', 'accept' => 'image/*'))}}
                                        <input type="hidden" name="image_warranty_comp" id="image_warranty_comp">
                                        <input type="hidden" name="image_warranty_ext" id="image_warranty_ext">
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 col-lg-4">
                                <div class="row">
                                    <div class="col-12">{{Form::label('image_receipt', 'Foto Bukti Pembayaran')}}<span class="mandatory">*</span></div>
                                    <div class="col-12">{{Form::file('image_receipt', array('id' => 'image_receipt', 'required' => 'required', 'accept' => 'image/*'))}}</div>
                                        <input type="hidden" name="image_receipt_comp" id="image_receipt_comp">
                                        <input type="hidden" name="image_receipt_ext" id="image_receipt_ext">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12 form__submit">{{Form::submit('Kirim', array('id' => 'btnSubmit'))}}</div>
                        </div>
                    </div>
                </div>
            </section>
            {!! Form::close() !!}
    </div>
@endsection

@section('js-form')
<script>
    $("input#no_warranty").keypress(function(event) {
    var character = String.fromCharCode(event.keyCode);
    return isValid(character);     
    });

    function isValid(str) {
        return !/[~`!@#$%\^&*()+=\-\[\]\\';.,/{}|\\":<>\?]/g.test(str);
    }


    $('input#no_warranty').keyup(function() {
        this.value = this.value.toUpperCase();
    });
</script>
@endsection