@extends('layouts.app')

@section('title', 'Edit Employee')

@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0">Edit Employee: {{ $employee->name }}</h5>
                <a href="{{ route('employees.index') }}" class="btn btn-secondary">
                    <i class="bi bi-arrow-left me-1"></i> Back
                </a>
            </div>
            <div class="card-body">
                <!-- Tabs Navigation -->
                <ul class="nav nav-tabs mb-4" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link {{ $activeTab == 'master' ? 'active' : '' }}" data-bs-toggle="tab" href="#master" role="tab">
                            <i class="bi bi-person me-1"></i> Master Data
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ $activeTab == 'contact' ? 'active' : '' }}" data-bs-toggle="tab" href="#contact" role="tab">
                            <i class="bi bi-telephone me-1"></i> Contact
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ $activeTab == 'status' ? 'active' : '' }}" data-bs-toggle="tab" href="#status" role="tab">
                            <i class="bi bi-briefcase me-1"></i> Employment
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ $activeTab == 'tax_profile' ? 'active' : '' }}" data-bs-toggle="tab" href="#tax_profile" role="tab">
                            <i class="bi bi-percent me-1"></i> Tax Profile
                        </a>
                    </li>
                </ul>

                <!-- Tab Contents -->
                <div class="tab-content">
                    <!-- Master Data Tab -->
                    <div class="tab-pane fade {{ $activeTab == 'master' ? 'show active' : '' }}" id="master" role="tabpanel">
                        <form action="{{ route('employees.update', $employee) }}" method="POST">
                            @csrf
                            @method('PUT')
                            <input type="hidden" name="tab" value="master">

                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="name" class="form-label">Full Name <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('name') is-invalid @enderror" id="name" name="name" value="{{ old('name', $employee->name) }}" required minlength="2" maxlength="100">
                                    @error('name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="email" class="form-label">Email <span class="text-danger">*</span></label>
                                    <input type="email" class="form-control @error('email') is-invalid @enderror" id="email" name="email" value="{{ old('email', $employee->email) }}" required maxlength="100">
                                    @error('email')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="national_identification_number" class="form-label">NIK <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('national_identification_number') is-invalid @enderror number-only" id="national_identification_number" name="national_identification_number" value="{{ old('national_identification_number', $employee->national_identification_number) }}" required maxlength="16">
                                    @error('national_identification_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="family_card_number" class="form-label">Family Card <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('family_card_number') is-invalid @enderror number-only" id="family_card_number" name="family_card_number" value="{{ old('family_card_number', $employee->family_card_number) }}" required maxlength="16">
                                    @error('family_card_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="tax_identification_number" class="form-label">NPWP <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('tax_identification_number') is-invalid @enderror number-only" id="tax_identification_number" name="tax_identification_number" value="{{ old('tax_identification_number', $employee->tax_identification_number) }}" required maxlength="16">
                                    @error('tax_identification_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="phone_number" class="form-label">Phone <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('phone_number') is-invalid @enderror number-only" id="phone_number" name="phone_number" value="{{ old('phone_number', $employee->phone_number) }}" required minlength="10" maxlength="15">
                                    @error('phone_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="gender" class="form-label">Gender <span class="text-danger">*</span></label>
                                    <select class="form-select @error('gender') is-invalid @enderror" id="gender" name="gender" required>
                                        <option value="Male" {{ old('gender', $employee->gender) == 'Male' ? 'selected' : '' }}>Male</option>
                                        <option value="Female" {{ old('gender', $employee->gender) == 'Female' ? 'selected' : '' }}>Female</option>
                                    </select>
                                    @error('gender')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="religion" class="form-label">Religion <span class="text-danger">*</span></label>
                                    <select class="form-select @error('religion') is-invalid @enderror" id="religion" name="religion" required>
                                        <option value="Islam" {{ old('religion', $employee->religion) == 'Islam' ? 'selected' : '' }}>Islam</option>
                                        <option value="Kristen" {{ old('religion', $employee->religion) == 'Kristen' ? 'selected' : '' }}>Kristen</option>
                                        <option value="Hindu" {{ old('religion', $employee->religion) == 'Hindu' ? 'selected' : '' }}>Hindu</option>
                                        <option value="Budha" {{ old('religion', $employee->religion) == 'Budha' ? 'selected' : '' }}>Budha</option>
                                        <option value="Khonghucu" {{ old('religion', $employee->religion) == 'Khonghucu' ? 'selected' : '' }}>Khonghucu</option>
                                    </select>
                                    @error('religion')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="place_of_birth" class="form-label">Place of Birth <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('place_of_birth') is-invalid @enderror" id="place_of_birth" name="place_of_birth" value="{{ old('place_of_birth', $employee->place_of_birth) }}" required>
                                    @error('place_of_birth')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="date_of_birth" class="form-label">Date of Birth <span class="text-danger">*</span></label>
                                    <input type="date" class="form-control @error('date_of_birth') is-invalid @enderror" id="date_of_birth" name="date_of_birth" value="{{ old('date_of_birth', $employee->date_of_birth->format('Y-m-d')) }}" required max="{{ date('Y-m-d') }}">
                                    @error('date_of_birth')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="marital_status" class="form-label">Marital Status <span class="text-danger">*</span></label>
                                    <select class="form-select @error('marital_status') is-invalid @enderror" id="marital_status" name="marital_status" required>
                                        <option value="Single" {{ old('marital_status', $employee->marital_status) == 'Single' ? 'selected' : '' }}>Single</option>
                                        <option value="Married" {{ old('marital_status', $employee->marital_status) == 'Married' ? 'selected' : '' }}>Married</option>
                                        <option value="Divorced" {{ old('marital_status', $employee->marital_status) == 'Divorced' ? 'selected' : '' }}>Divorced</option>
                                        <option value="Widowed" {{ old('marital_status', $employee->marital_status) == 'Widowed' ? 'selected' : '' }}>Widowed</option>
                                    </select>
                                    @error('marital_status')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="highest_education_level" class="form-label">Education <span class="text-danger">*</span></label>
                                    <select class="form-select @error('highest_education_level') is-invalid @enderror" id="highest_education_level" name="highest_education_level" required>
                                        <option value="SD" {{ old('highest_education_level', $employee->highest_education_level) == 'SD' ? 'selected' : '' }}>SD</option>
                                        <option value="SMP" {{ old('highest_education_level', $employee->highest_education_level) == 'SMP' ? 'selected' : '' }}>SMP</option>
                                        <option value="SMA/Setara" {{ old('highest_education_level', $employee->highest_education_level) == 'SMA/Setara' ? 'selected' : '' }}>SMA/Setara</option>
                                        <option value="D1" {{ old('highest_education_level', $employee->highest_education_level) == 'D1' ? 'selected' : '' }}>D1</option>
                                        <option value="D2" {{ old('highest_education_level', $employee->highest_education_level) == 'D2' ? 'selected' : '' }}>D2</option>
                                        <option value="D3" {{ old('highest_education_level', $employee->highest_education_level) == 'D3' ? 'selected' : '' }}>D3</option>
                                        <option value="S1" {{ old('highest_education_level', $employee->highest_education_level) == 'S1' ? 'selected' : '' }}>S1</option>
                                        <option value="S2" {{ old('highest_education_level', $employee->highest_education_level) == 'S2' ? 'selected' : '' }}>S2</option>
                                        <option value="S3" {{ old('highest_education_level', $employee->highest_education_level) == 'S3' ? 'selected' : '' }}>S3</option>
                                    </select>
                                    @error('highest_education_level')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="mt-4">
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-check-lg me-1"></i> Save Master Data
                                </button>
                            </div>
                        </form>
                    </div>

                    <!-- Contact Tab -->
                    <div class="tab-pane fade {{ $activeTab == 'contact' ? 'show active' : '' }}" id="contact" role="tabpanel">
                        <form action="{{ route('employees.update', $employee) }}" method="POST">
                            @csrf
                            @method('PUT')
                            <input type="hidden" name="tab" value="contact">

                            <div class="row">
                                <div class="col-md-12 mb-3">
                                    <label for="address" class="form-label">Address <span class="text-danger">*</span></label>
                                    <textarea class="form-control @error('address') is-invalid @enderror" id="address" name="address" rows="3" required minlength="10" maxlength="500">{{ old('address', $employee->contact->address ?? '') }}</textarea>
                                    @error('address')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="mother_name" class="form-label">Mother's Name <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('mother_name') is-invalid @enderror" id="mother_name" name="mother_name" value="{{ old('mother_name', $employee->contact->mother_name ?? '') }}" required>
                                    @error('mother_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="emergency_contact_name" class="form-label">Emergency Contact Name <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('emergency_contact_name') is-invalid @enderror" id="emergency_contact_name" name="emergency_contact_name" value="{{ old('emergency_contact_name', $employee->contact->emergency_contact_name ?? '') }}" required>
                                    @error('emergency_contact_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="emergency_contact_relationship" class="form-label">Relationship <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('emergency_contact_relationship') is-invalid @enderror" id="emergency_contact_relationship" name="emergency_contact_relationship" value="{{ old('emergency_contact_relationship', $employee->contact->emergency_contact_relationship ?? '') }}" required>
                                    @error('emergency_contact_relationship')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="emergency_contact_phone_number" class="form-label">Emergency Phone <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('emergency_contact_phone_number') is-invalid @enderror number-only" id="emergency_contact_phone_number" name="emergency_contact_phone_number" value="{{ old('emergency_contact_phone_number', $employee->contact->emergency_contact_phone_number ?? '') }}" required minlength="10" maxlength="15">
                                    @error('emergency_contact_phone_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="mt-4">
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-check-lg me-1"></i> Save Contact
                                </button>
                            </div>
                        </form>
                    </div>

                    <!-- Status Tab -->
                    <div class="tab-pane fade {{ $activeTab == 'status' ? 'show active' : '' }}" id="status" role="tabpanel">
                        <form action="{{ route('employees.update', $employee) }}" method="POST">
                            @csrf
                            @method('PUT')
                            <input type="hidden" name="tab" value="status">

                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="status" class="form-label">Status <span class="text-danger">*</span></label>
                                    <select class="form-select @error('status') is-invalid @enderror" id="status" name="status" required>
                                        <option value="Active" {{ old('status', $employee->status->status ?? '') == 'Active' ? 'selected' : '' }}>Active</option>
                                        <option value="Inactive" {{ old('status', $employee->status->status ?? '') == 'Inactive' ? 'selected' : '' }}>Inactive</option>
                                        <option value="Resign" {{ old('status', $employee->status->status ?? '') == 'Resign' ? 'selected' : '' }}>Resign</option>
                                        <option value="Fired" {{ old('status', $employee->status->status ?? '') == 'Fired' ? 'selected' : '' }}>Fired</option>
                                    </select>
                                    @error('status')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="start_date" class="form-label">Start Date <span class="text-danger">*</span></label>
                                    <input type="date" class="form-control @error('start_date') is-invalid @enderror" id="start_date" name="start_date" value="{{ old('start_date', $employee->status->start_date ? $employee->status->start_date->format('Y-m-d') : '') }}" required>
                                    @error('start_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="end_date" class="form-label">End Date</label>
                                    <input type="date" class="form-control @error('end_date') is-invalid @enderror" id="end_date" name="end_date" value="{{ old('end_date', $employee->status->end_date ? $employee->status->end_date->format('Y-m-d') : '') }}">
                                    @error('end_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label for="resign_reason" class="form-label">Resign Reason</label>
                                    <input type="text" class="form-control @error('resign_reason') is-invalid @enderror" id="resign_reason" name="resign_reason" value="{{ old('resign_reason', $employee->status->resign_reason ?? '') }}" maxlength="500">
                                    @error('resign_reason')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="mt-4">
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-check-lg me-1"></i> Save Employment
                                </button>
                            </div>
                        </form>
                    </div>

                    <!-- Tax Profile Tab -->
                    <div class="tab-pane fade {{ $activeTab == 'tax_profile' ? 'show active' : '' }}" id="tax_profile" role="tabpanel">
                        <form action="{{ route('employees.update', $employee) }}" method="POST">
                            @csrf
                            @method('PUT')
                            <input type="hidden" name="tab" value="tax_profile">

                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="npwp_number" class="form-label">NPWP Number</label>
                                    <input type="text" class="form-control @error('npwp_number') is-invalid @enderror" id="npwp_number" name="npwp_number" value="{{ old('npwp_number', $employee->taxProfile->npwp_number ?? '') }}" maxlength="30">
                                    @error('npwp_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="tax_marital_status" class="form-label">Tax Marital Status <span class="text-danger">*</span></label>
                                    <select class="form-select @error('marital_status') is-invalid @enderror" id="tax_marital_status" name="marital_status" required>
                                        <option value="single" {{ old('marital_status', $employee->taxProfile->marital_status ?? 'single') == 'single' ? 'selected' : '' }}>Single</option>
                                        <option value="married" {{ old('marital_status', $employee->taxProfile->marital_status ?? '') == 'married' ? 'selected' : '' }}>Married</option>
                                    </select>
                                    @error('marital_status')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="dependents" class="form-label">Number of Dependents <span class="text-danger">*</span></label>
                                    <input type="number" class="form-control @error('dependents') is-invalid @enderror" id="dependents" name="dependents" value="{{ old('dependents', $employee->taxProfile->dependents ?? '0') }}" min="0" max="10" required>
                                    <small class="text-muted">Maximum 3 for PTKP calculation</small>
                                    @error('dependents')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="ptkp_code" class="form-label">PTKP Code</label>
                                    <select class="form-select @error('ptkp_code') is-invalid @enderror" id="ptkp_code" name="ptkp_code">
                                        <option value="">Select PTKP Code</option>
                                        <option value="TK/0" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'TK/0' ? 'selected' : '' }}>TK/0 - Tidak Kawin / 0 Tanggungan</option>
                                        <option value="TK/1" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'TK/1' ? 'selected' : '' }}>TK/1 - Tidak Kawin / 1 Tanggungan</option>
                                        <option value="TK/2" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'TK/2' ? 'selected' : '' }}>TK/2 - Tidak Kawin / 2 Tanggungan</option>
                                        <option value="TK/3" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'TK/3' ? 'selected' : '' }}>TK/3 - Tidak Kawin / 3 Tanggungan</option>
                                        <option value="K/0" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/0' ? 'selected' : '' }}>K/0 - Kawin / 0 Tanggungan</option>
                                        <option value="K/1" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/1' ? 'selected' : '' }}>K/1 - Kawin / 1 Tanggungan</option>
                                        <option value="K/2" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/2' ? 'selected' : '' }}>K/2 - Kawin / 2 Tanggungan</option>
                                        <option value="K/3" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/3' ? 'selected' : '' }}>K/3 - Kawin / 3 Tanggungan</option>
                                        <option value="K/I/0" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/I/0' ? 'selected' : '' }}>K/I/0 - Kawin + Istri Bekerja / 0 Tanggungan</option>
                                        <option value="K/I/1" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/I/1' ? 'selected' : '' }}>K/I/1 - Kawin + Istri Bekerja / 1 Tanggungan</option>
                                        <option value="K/I/2" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/I/2' ? 'selected' : '' }}>K/I/2 - Kawin + Istri Bekerja / 2 Tanggungan</option>
                                        <option value="K/I/3" {{ old('ptkp_code', $employee->taxProfile->ptkp_code ?? '') == 'K/I/3' ? 'selected' : '' }}>K/I/3 - Kawin + Istri Bekerja / 3 Tanggungan</option>
                                    </select>
                                    @error('ptkp_code')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="mt-4">
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-check-lg me-1"></i> Save Tax Profile
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    // Number-only input fields
    document.querySelectorAll('.number-only').forEach(function(input) {
        input.addEventListener('input', function(e) {
            this.value = this.value.replace(/[^0-9]/g, '');
        });

        input.addEventListener('keypress', function(e) {
            if (!/[0-9]/.test(e.key) && e.key !== 'Backspace' && e.key !== 'Delete' && e.key !== 'Tab') {
                e.preventDefault();
            }
        });
    });
</script>
@endpush