@extends('layouts.backend.index')
@section('title', $label)

@section('content')
    <div class="card">
        <div class="card-body">
            <x-section-header :action="isset($employee) ?'edit':'create'" :icon="$icon" :label="$label" hr-class="mb-4" />

            <form id="form" method="post" action="{{ $route }}" class="form-block" enctype="multipart/form-data">
                @csrf

                @if (isset($employee))
                    @method('PUT')
                @endif
                <x-section-form icon="mdi mdi-account-details" label="Data Diri"/>
                <div class="row mt-3">
                    <div class="col-sm-12 col-md-6">
                        <x-form.input-text name="nip" label="NIP" :old="old('nip',@$employee->nip)" :optional="true" readonly />
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <x-form.input-text name="nip_old" label="NIP LAMA" :old="old('nip',@$employee->nip_old)" :optional="true" />
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <x-form.input-text name="name" label="Nama" :old="old('name',@$employee->name)" />
                    </div>
                    <div class="col-sm-6 col-md-5">
                        <x-form.radio name="gender" label="Jenis Kelamin" :old="old('gender', @$employee->gender??1)" :option="$option['gender']" />

                    </div>
                    <div class="col-sm-6 col-md-3">
                        <x-form.date-picker name="birthdate" label="Tanggal Lahir" picker-type="date" :old="old('birthdate',@$employee->birthdate)" />
                    </div>
                    <div class="col-sm-6 col-md-4">
                        <x-form.input-group-mask name="phone" label="No. HP" mask="phone"
                            addon="<i class='mdi mdi-cellphone'></i>" :old="old('phone',@$employee->phone)" :optional="true" />
                    </div>
                    <div class="col-sm-6 col-md-4">
                        <x-form.input-group-mask name="email" label="Email" mask="email"
                            addon="<i class='mdi mdi-email'></i>" :old="old('email',@$employee->email)" :optional="true" />
                    </div>
                    <div class="col-sm-12">
                        <x-form.text-area rows='6' name="address" label="Alamat" :old="old('address',@$employee->address)" :optional="true" />

                    </div>
                </div>
                <x-section-form icon="mdi mdi-cash" label="Gaji"/>
                <div class="row mt-3">

                    <div class="col-sm-12 col-md-6">
                        <x-form.radio name="salary_type" label="Tipe Penggajian" :option="$option['salary_type']"
                            :old="old('salary_type', @$employee->salary_type??1)" />
                    </div>
                    <div class="col-sm-12">
                        <div class="row">
                            <div class="col-md-6">
                                <x-form.input-group-mask name="salary" label="Gaji" mask="nominal" addon="Rp."
                            :old="old('salary', @$employee->salary??0)" />
                            </div>
                            <div class="col-md-6">
                                <x-form.input-group-mask name="salary_overtime" label="Gaji Lembur (Perjam)" mask="nominal"
                                addon="Rp." :old="old('salary_overtime', @$employee->salary_overtime??0)" />
                            </div>
                            <div class="col-md-6">
                                <x-form.input-group-mask name="allowance_meal" label="Uang Makan (Perhari)" mask="nominal"
                            addon="Rp." :old="old('allowance_meal', @$employee->allowance_meal??0)" />
                            </div>
                            <div class="col-md-6">
                                <x-form.input-group-mask name="bpjs" label="BPJS" mask="nominal"
                                addon="Rp." :old="old('bpjs', @$employee->bpjs??0)" />
                            </div>
                        </div>

                    </div>

                </div>

                <x-section-form icon="mdi mdi-account-tie" label="Data Karyawan"/>

                <div class="row mt-3">
                    <div class="col-sm-6 col-md-4">
                        <x-form.date-picker name="join_at" label="Tanggal Bergabung" picker-type="date" :old="old('join_at',@$employee->join_at)"/>
                    </div>
                    <div class="col-sm-12 col-md-4">
                        <x-form.select name="position" label="Jabatan" :old="old('position',@$employee->position)" :option="$option['position']" required />
                    </div>

                </div>


                <x-form.input-multi-files :old="@$employee->documents" :name="'documents'" label="Dokumen" info="Gunakan file jpg, jpeg, png, dan pdf. Ukuran file maksimal 2 MB." id="documents" :optional="true"/>

                <x-form.button-submit :cancel-route="route('employee.index')" />
            </form>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $(document).ready(function() {
            window.LaravelDataTables = window.LaravelDataTables || {}



            $(".nominal-mask").inputmask({
                alias: "nominal"
            })
        })
    </script>
@endpush