<?php echo message_box('success'); ?>
<?php echo message_box('error'); ?>

<div class="space-y-4">
    <div class="rounded-2xl border border-border bg-card shadow-sm">
        <div class="border-b border-border px-5 py-4">
            <div class="flex items-center gap-2 text-sm font-semibold text-foreground">
                <i data-lucide="settings" class="h-5 w-5"></i>
                <span><?= lang('manage_salary_details') ?></span>
            </div>
        </div>

        <div class="p-5 space-y-6">
            <form id="form" role="form" enctype="multipart/form-data"
                  action="<?= base_url() ?>admin/payroll/manage_salary_details" method="post"
                  class="space-y-4 mx-auto max-w-xl">
                <div class="grid grid-cols-1 gap-2 md:grid-cols-[1fr_auto] md:items-start">
                    <?php
                    $department_options = array('' => lang('select_department'));
                    if (!empty($all_department_info)) {
                        foreach ($all_department_info as $v_department_info) {
                            $deptname = !empty($v_department_info->deptname) ? $v_department_info->deptname : lang('undefined_department');
                            $department_options[$v_department_info->departments_id] = $deptname;
                        }
                    }
                    ?>
                    <?= form_select_group('departments_id', lang('select_department'), $department_options, !empty($departments_id) ? $departments_id : '', true, array('class' => 'select_box')) ?>

                    <button type="submit" id="sbtn" value="1" name="flag"
                            class="inline-flex items-center gap-2 mt-6 rounded-lg bg-indigo-600 px-4 py-2.5 text-xs font-semibold text-white shadow-sm hover:bg-indigo-500">
                        <i data-lucide="arrow-right" class="h-4 w-4"></i>
                        <?= lang('go') ?>
                    </button>
                </div>
            </form>

            <?php if (!empty($flag)): ?>
                <form id="form_validation" role="form" enctype="multipart/form-data"
                      action="<?= base_url() ?>admin/payroll/save_salary_details" method="post"
                      class="space-y-4">

                    <div class="rounded-xl border border-border">
                        <table class="min-w-full text-sm">
                            <thead class="bg-muted/40 text-xs uppercase tracking-wide text-muted-foreground">
                                <tr>
                                    <th class="px-4 py-3 text-left"><?= lang('employee') . ' ' . lang('name') ?></th>
                                    <th class="px-4 py-3 text-left"><?= lang('designation') ?></th>
                                    <th class="px-4 py-3 text-left"><?= lang('hourly') ?></th>
                                    <th class="px-4 py-3 text-left"><?= lang('monthly') ?></th>
                                </tr>
                            </thead>
                            <tbody class="divide-y divide-border bg-background">
                                <?php
                                $hh = '';
                                if (!empty($employee_info)): foreach ($employee_info as $key => $v_emp_info): ?>
                                    <?php if (!empty($v_emp_info)): foreach ($v_emp_info as $v_employee):
                                        $hh = true;
                                        $emp_id = (int) $v_employee->user_id;
                                        $employee_payroll_info = null;
                                        if (!empty($salary_grade_info)) {
                                            foreach ($salary_grade_info as $v_grade_salary_info) {
                                                foreach ($v_grade_salary_info as $v_gsalary_info) {
                                                    if (!empty($v_gsalary_info) && (int) $v_gsalary_info->user_id === $emp_id) {
                                                        $employee_payroll_info = $v_gsalary_info;
                                                        break 2;
                                                    }
                                                }
                                            }
                                        }
                                        ?>
                                        <tr>
                                            <td class="px-4 py-3">
                                                <input type="hidden" name="user_id[]" value="<?= $emp_id ?>">
                                                <input type="hidden" name="payroll_id[]" value="<?= !empty($employee_payroll_info->payroll_id) ? html_escape($employee_payroll_info->payroll_id) : '' ?>">
                                                <span class="font-medium text-foreground"><?= html_escape($v_employee->fullname) ?></span>
                                            </td>
                                            <td class="px-4 py-3 text-foreground"><?= html_escape($v_employee->designations) ?></td>
                                            <td class="px-4 py-3">
                                                <div class="flex items-center gap-3">
                                                    <label class="inline-flex items-center">
                                                        <input
                                                            name="hourly_status[]"
                                                            value="<?= $emp_id ?>"
                                                            type="checkbox"
                                                            data-employee-id="<?= $emp_id ?>"
                                                            data-pay-mode="hourly"
                                                            class="h-4 w-4 rounded border-border text-primary focus:ring-primary/30"
                                                            <?= !empty($employee_payroll_info->hourly_rate_id) ? 'checked' : '' ?>>
                                                    </label>
                                                    <select name="hourly_rate_id[]" class="select_box w-full rounded-lg border border-border bg-input px-3 py-2 text-sm text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30">
                                                        <option value=""><?= lang('select_hourly_grade') ?></option>
                                                        <?php if (!empty($hourly_grade)) : foreach ($hourly_grade as $v_hourly_grade) : ?>
                                                            <option value="<?= $v_hourly_grade->hourly_rate_id ?>"
                                                                <?= !empty($employee_payroll_info->hourly_rate_id) && $v_hourly_grade->hourly_rate_id == $employee_payroll_info->hourly_rate_id ? 'selected' : '' ?>>
                                                                <?= html_escape($v_hourly_grade->hourly_grade) ?>
                                                            </option>
                                                        <?php endforeach;
                                                        endif; ?>
                                                    </select>
                                                </div>
                                            </td>
                                            <td class="px-4 py-3">
                                                <div class="flex items-center gap-3">
                                                    <label class="inline-flex items-center">
                                                        <input
                                                            name="monthly_status[]"
                                                            value="<?= $emp_id ?>"
                                                            type="checkbox"
                                                            data-employee-id="<?= $emp_id ?>"
                                                            data-pay-mode="monthly"
                                                            class="h-4 w-4 rounded border-border text-primary focus:ring-primary/30"
                                                            <?= !empty($employee_payroll_info->salary_template_id) ? 'checked' : '' ?>>
                                                    </label>
                                                    <select name="salary_template_id[]" class="select_box w-full rounded-lg border border-border bg-input px-3 py-2 text-sm text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30">
                                                        <option value=""><?= lang('select_monthly_grade') ?></option>
                                                        <?php if (!empty($salary_grade)) : foreach ($salary_grade as $v_salary_info) : ?>
                                                            <option value="<?= $v_salary_info->salary_template_id ?>"
                                                                <?= !empty($employee_payroll_info->salary_template_id) && $v_salary_info->salary_template_id == $employee_payroll_info->salary_template_id ? 'selected' : '' ?>>
                                                                <?= html_escape($v_salary_info->salary_grade) ?>
                                                            </option>
                                                        <?php endforeach;
                                                        endif; ?>
                                                    </select>
                                                </div>
                                            </td>
                                        </tr>
                                    <?php endforeach;
                                    endif; ?>
                                <?php endforeach;
                                endif; ?>

                                <?php if (empty($hh)) { ?>
                                    <tr>
                                        <td colspan="4" class="px-4 py-6 text-center text-sm text-muted-foreground">
                                            <?= lang('nothing_to_display') ?>
                                        </td>
                                    </tr>
                                <?php } ?>
                            </tbody>
                        </table>
                    </div>

                    <?php if (!empty($hh)) { ?>
                        <div class="flex justify-end">
                            <button id="salery_btn" type="submit"
                                    class="inline-flex items-center gap-2 rounded-lg bg-indigo-600 px-4 py-2 text-xs font-semibold text-white shadow-sm hover:bg-indigo-500">
                                <i data-lucide="save" class="h-4 w-4"></i>
                                <?= lang('update') ?>
                            </button>
                        </div>
                    <?php } ?>

                    <input type="hidden" name="departments_id" value="<?= html_escape($departments_id) ?>"/>
                </form>
            <?php endif; ?>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $(document).on('change', 'input[type="checkbox"][data-employee-id]', function () {
            var employeeId = $(this).data('employee-id');
            var mode = $(this).data('pay-mode');
            if (!employeeId || !mode) return;
            if ($(this).is(':checked')) {
                var otherMode = mode === 'hourly' ? 'monthly' : 'hourly';
                $('input[type="checkbox"][data-employee-id="' + employeeId + '"][data-pay-mode="' + otherMode + '"]').prop('checked', false);
            }
        });
    });
</script>
