<?php
/**
 * @var array $employees
 * @var array $months
 * @var array $years
 * @var string $selectedEmployeeId
 * @var string $selectedMonth
 * @var string $selectedYear
 */
?>
<div class="page-title mb-4">
    <h5><i class="fas fa-plus-circle me-2 text-gold"></i>Generate Salary</h5>
</div>

<div class="glass-card p-0">
    <div class="card-header">
        <div class="card-header-left">
            <i class="fas fa-file-invoice card-icon"></i>
            <h6 class="card-title">Select Employee & Period</h6>
        </div>
        <div>
            <span class="text-muted small"><span class="text-danger">*</span> Required fields</span>
        </div>
    </div>
    <div class="card-body">
        <form method="POST" action="<?= url('salary/store') ?>">
            <?= csrf_field() ?>

            <div class="row g-3">
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Employee <span class="text-danger">*</span></label>
                        <select name="employee_id" class="form-select bg-transparent <?= errorClass('employee_id') ?>" required>
                            <option value="">Select Employee</option>
                            <?php foreach ($employees as $emp): ?>
                                <option value="<?= $emp->id ?>" <?= (old('employee_id', $selectedEmployeeId) == $emp->id) ? 'selected' : '' ?>>
                                    <?= e($emp->first_name . ' ' . $emp->last_name) ?> (<?= e($emp->job_title ?? 'N/A') ?>)
                                </option>
                            <?php endforeach; ?>
                        </select>
                        <?= errorMsg('employee_id') ?>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Month <span class="text-danger">*</span></label>
                        <select name="month" class="form-select bg-transparent <?= errorClass('month') ?>" required>
                            <?php foreach ($months as $val => $label): ?>
                                <option value="<?= $val ?>" <?= (old('month', $selectedMonth) === $val) ? 'selected' : '' ?>>
                                    <?= $label ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                        <?= errorMsg('month') ?>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Year <span class="text-danger">*</span></label>
                        <select name="year" class="form-select bg-transparent <?= errorClass('year') ?>" required>
                            <?php foreach ($years as $y): ?>
                                <option value="<?= $y ?>" <?= (old('year', $selectedYear) == $y) ? 'selected' : '' ?>>
                                    <?= $y ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                        <?= errorMsg('year') ?>
                    </div>
                </div>
            </div>

            <hr class="border-secondary">
            <h6 class="text-gold mb-3"><i class="fas fa-calculator me-2"></i>Salary Details</h6>

            <div class="row g-3">
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Basic Salary</label>
                        <div class="input-group">
                            <span class="input-group-text bg-transparent border-gold"><?= APP_CURRENCY_SYMBOL ?></span>
                            <input type="number" step="0.01" name="basic_salary"
                                   class="form-control bg-transparent <?= errorClass('basic_salary') ?>"
                                   value="<?= e(old('basic_salary', 0)) ?>" min="0">
                        </div>
                        <?= errorMsg('basic_salary') ?>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Commission Total</label>
                        <div class="input-group">
                            <span class="input-group-text bg-transparent border-gold"><?= APP_CURRENCY_SYMBOL ?></span>
                            <input type="number" step="0.01" name="commission_total"
                                   class="form-control bg-transparent <?= errorClass('commission_total') ?>"
                                   value="<?= e(old('commission_total', 0)) ?>" min="0">
                        </div>
                        <?= errorMsg('commission_total') ?>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Bonus</label>
                        <div class="input-group">
                            <span class="input-group-text bg-transparent border-gold"><?= APP_CURRENCY_SYMBOL ?></span>
                            <input type="number" step="0.01" name="bonus"
                                   class="form-control bg-transparent <?= errorClass('bonus') ?>"
                                   value="<?= e(old('bonus', 0)) ?>" min="0">
                        </div>
                        <?= errorMsg('bonus') ?>
                    </div>
                </div>
            </div>

            <div class="row g-3">
                <div class="col-md-4">
                    <div class="mb-3">
                        <label class="form-label">Deductions</label>
                        <div class="input-group">
                            <span class="input-group-text bg-transparent border-gold"><?= APP_CURRENCY_SYMBOL ?></span>
                            <input type="number" step="0.01" name="deductions"
                                   class="form-control bg-transparent <?= errorClass('deductions') ?>"
                                   value="<?= e(old('deductions', 0)) ?>" min="0">
                        </div>
                        <?= errorMsg('deductions') ?>
                    </div>
                </div>
                <div class="col-md-8">
                    <div class="mb-3">
                        <label class="form-label">Notes</label>
                        <textarea name="notes" class="form-control bg-transparent <?= errorClass('notes') ?>"
                                  rows="2" maxlength="2000"><?= e(old('notes')) ?></textarea>
                        <?= errorMsg('notes') ?>
                    </div>
                </div>
            </div>

            <div class="mt-4 d-flex gap-2">
                <button type="submit" class="btn btn-gold">
                    <i class="fas fa-save me-1"></i>Generate Salary
                </button>
                <a href="<?= url('salary') ?>" class="btn btn-outline-secondary">
                    <i class="fas fa-times me-1"></i>Cancel
                </a>
            </div>
        </form>
    </div>
</div>
