@extends('layouts.app')
@section('content')
<br>
<div class="container">
    <div class="card">
        <div class="card-header bg-dark text-white">
            <h4 class="mb-0">Add Payroll</h4>
        </div>
        <div class="card-body">
            <form action="{{ route('payroll.store') }}" method="POST">
                @csrf

                <!-- Employee Info -->
              <u>  <h6 class="mb-3">Employee Information</h6></u>
                <div class="mb-3">
                    <label class="form-label">Select Employee</label>
                    <select name="employee_id" class="form-control" required>
                        <option value="">Select Employee</option>
                        @foreach($employees as $emp)
                            <option value="{{ $emp->id }}" {{ old('employee_id') == $emp->id ? 'selected' : '' }}>
                                {{ $emp->name }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <!-- Payroll Details -->
               <u> <h6 class="mb-3">Payroll Details</h6></u>
                <div class="row">
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Salary</label>
                        <input type="number" name="salary" value="{{ old('salary') }}" class="form-control" placeholder="Salary" required>
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Allowances</label>
                        <input type="number" name="allowances" value="{{ old('allowances') }}" class="form-control" placeholder="Allowances">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Overtime</label>
                        <input type="number" name="overtime" value="{{ old('overtime') }}" class="form-control" placeholder="Overtime">
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Deductions</label>
                        <input type="number" name="deductions" value="{{ old('deductions') }}" class="form-control" placeholder="Deductions">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Tax</label>
                        <input type="number" name="tax" value="{{ old('tax') }}" class="form-control" placeholder="Tax">
                    </div>
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Month/Year</label>
                        <input type="text" name="month_year" value="{{ old('month_year') }}" class="form-control" placeholder="Month/Year">
                    </div>
                </div>

                <button type="submit" class="btn btn-success">Save</button>

            </form>
        </div>
    </div>
</div>

@endsection