@extends('layouts.master')

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/hr-forms.css') }}">
@endpush

@section('content')
    <div class="hr-page-container">
        <div class="hr-breadcrumb">
            <a href="{{ url('admin') }}"><i class="fa-solid fa-house"></i> Home</a>
            <i class="fa-solid fa-chevron-right" style="font-size: 10px;"></i>
            <a href="{{ url('departments') }}">Departments</a>
            <i class="fa-solid fa-chevron-right" style="font-size: 10px;"></i>
            <span class="current">Edit Department</span>
        </div>

        <div class="hr-page-header">
            <div class="hr-header-left">
                <h2><i class="fa-solid fa-pen-to-square"></i> Edit Department</h2>
                <p>Modify department details, code, description and operational status</p>
            </div>
            <div class="hr-header-actions">
                <a href="{{ url('departments') }}" class="hr-btn-back">
                    <i class="fa-solid fa-arrow-left"></i> Department List
                </a>
            </div>
        </div>

        <div class="hr-card">
            <div class="hr-card-header">
                <div class="hr-card-title">
                    <i class="fa-solid fa-sliders"></i> Modify: {{ $department->name }}
                </div>
                <div>
                    <span
                        class="badge {{ strtolower($department->status) === 'active' ? 'badge-success' : 'badge-secondary' }}"
                        style="padding: 6px 12px; font-size: 12px; border-radius: 6px;">
                        {{ ucfirst($department->status ?? 'Active') }}
                    </span>
                </div>
            </div>
            <div class="hr-card-body">
                @if (isset($errors) && $errors->any())
                    <div class="hr-alert-error">
                        <strong><i class="fa-solid fa-triangle-exclamation"></i> Please fix the following errors:</strong>
                        <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                <form method="POST" action="{{ url('departments/update/' . Crypt::encrypt($department->id)) }}">
                    @csrf
                    @method('POST')

                    <div class="row">
                        <div class="col-md-7">
                            <div class="hr-form-group">
                                <label class="hr-label" for="dept_name">
                                    Department Name <span class="required">*</span>
                                </label>
                                <div class="hr-input-icon-wrap">
                                    <i class="fa-solid fa-building"></i>
                                    <input type="text" id="dept_name" name="name"
                                        value="{{ old('name', $department->name) }}" class="hr-input" required>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-5">
                            <div class="hr-form-group">
                                <label class="hr-label" for="dept_code">
                                    Department Code
                                </label>
                                <div class="hr-input-icon-wrap">
                                    <i class="fa-solid fa-hashtag"></i>
                                    <input type="text" id="dept_code" name="code"
                                        value="{{ old('code', $department->code) }}" class="hr-input">
                                </div>
                            </div>
                        </div>

                        <div class="col-md-8">
                            <div class="hr-form-group">
                                <label class="hr-label" for="dept_desc">
                                    Description &amp; Responsibilities
                                </label>
                                <textarea id="dept_desc" name="description" class="hr-textarea"
                                    rows="3">{{ old('description', $department->description) }}</textarea>
                                <span class="hr-hint">Brief outline of this department's role</span>
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="hr-form-group">
                                <label class="hr-label" for="dept_status">
                                    Operational Status <span class="required">*</span>
                                </label>
                                <select id="dept_status" name="status"
                                    class="hr-select {{ (isset($errors) && $errors->has('status')) ? 'is-invalid' : '' }}"
                                    required>
                                    <option value="Active" {{ strtolower(old('status', $department->status)) === 'active' ? 'selected' : '' }}>Active</option>
                                    <option value="Inactive" {{ strtolower(old('status', $department->status)) === 'inactive' ? 'selected' : '' }}>Inactive</option>
                                </select>
                                @if(isset($errors) && $errors->has('status'))
                                    <div class="invalid-feedback d-block">{{ $errors->first('status') }}</div>
                                @endif
                                <span class="hr-hint">Inactive departments cannot be assigned to new staff</span>
                            </div>
                        </div>
                    </div>

                    <div class="hr-form-actions">
                        <a href="{{ url('departments') }}" class="hr-btn-cancel">
                            <i class="fa-solid fa-xmark"></i> Cancel
                        </a>
                        <button type="submit" class="hr-btn-submit">
                            <i class="fa-solid fa-floppy-disk"></i> Update Department
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection