<?php $created = can_action('72', 'created');
$edited = can_action('72', 'edited');
$deleted = can_action('72', 'deleted');
$office_hours = config_item('office_hours');
?>
<?= message_box('success'); ?>
<?= message_box('error'); ?>

<div class="space-y-6">
    <div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
        <div>
            <h2 class="text-2xl font-semibold text-foreground"><?= lang('leave_management') ?></h2>
            <p class="text-sm text-muted-foreground"><?= lang('manage') . ' ' . lang('leave_management') ?></p>
        </div>
        <div>
            <a href="<?= base_url('admin/leave_management/apply_leave') ?>" class="inline-flex items-center gap-2 rounded-lg bg-indigo-600 px-3 py-2 text-xs font-semibold text-white shadow-sm hover:bg-indigo-500">
                <i data-lucide="plus" class="h-4 w-4"></i>
                <span><?= lang('apply') . ' ' . lang('leave') ?></span>
            </a>
        </div>
    </div>

    <div class="rounded-2xl border border-border bg-card shadow-sm">
        <div class="border-b border-border px-4 py-3">
            <div class="flex flex-wrap items-center gap-2">
                <a href="<?= base_url('admin/leave_management') ?>"
                   class="inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-semibold <?= $active == 1 ? 'bg-indigo-600 text-white shadow-sm' : 'border border-border bg-card text-foreground hover:bg-muted' ?>">
                    <?= lang('pending') . ' ' . lang('approval') ?>
                </a>
                <a href="<?= base_url('admin/leave_management/my_leave') ?>"
                   class="inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-semibold <?= $active == 2 ? 'bg-indigo-600 text-white shadow-sm' : 'border border-border bg-card text-foreground hover:bg-muted' ?>">
                    <?= lang('my_leave') ?>
                </a>
                <?php if (!empty(admin_head())) { ?>
                    <a href="<?= base_url('admin/leave_management/all_leave') ?>"
                       class="inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-semibold <?= $active == 3 ? 'bg-indigo-600 text-white shadow-sm' : 'border border-border bg-card text-foreground hover:bg-muted' ?>">
                        <?= lang('all_leave') ?>
                    </a>
                <?php } ?>
                <a href="<?= base_url('admin/leave_management/leave_report') ?>"
                   class="inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-semibold <?= $active == 4 ? 'bg-indigo-600 text-white shadow-sm' : 'border border-border bg-card text-foreground hover:bg-muted' ?>">
                    <?= lang('leave_report') ?>
                </a>
            </div>
        </div>
        <div class="p-4">
            <div class="grid grid-cols-1 xl:grid-cols-2 gap-4">
                <?php if ($this->session->userdata('user_type') == 1) { ?>
                    <div class="rounded-xl border border-border bg-card p-4">
                        <div class="flex items-center gap-2 border-b border-border pb-3 mb-3">
                            <i data-lucide="pie-chart" class="h-4 w-4 text-muted-foreground"></i>
                            <h4 class="text-sm font-semibold text-foreground"><?= lang('all') . ' ' . lang('leave_report') ?></h4>
                        </div>
                        <div class="chart-pie flot-chart"></div>
                    </div>
                <?php } ?>
                <div class="rounded-xl border border-border bg-card p-4">
                    <div class="flex items-center gap-2 border-b border-border pb-3 mb-3">
                        <i data-lucide="pie-chart" class="h-4 w-4 text-muted-foreground"></i>
                        <h4 class="text-sm font-semibold text-foreground"><?= lang('my_leave') . ' ' . lang('report') ?></h4>
                    </div>
                    <div class="chart-pie-my flot-chart"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<?php
$my_atleast_one = get_row('tbl_leave_application', array('user_id' => my_id(), 'application_status' => 2));
$atleast_one = get_row('tbl_leave_application', array('application_status' => 2));

$all_category = $this->db->get('tbl_leave_category')->result();
$color = array('37bc9b', '7266ba', 'f05050', 'ff902b', '7266ba', 'f532e5', '5d9cec', '7cd600', '91ca00', 'ff7400', '1cc200', 'bb9000', '40c400');
if (!empty($all_category)) {
?>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.js"></script>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.tooltip.min.js"></script>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.resize.js"></script>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.pie.js"></script>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.time.js"></script>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.categories.js"></script>
<script src="<?= base_url() ?>assets/plugins/Flot/jquery.flot.spline.min.js"></script>
<script type="text/javascript">
// CHART PIE
// -----------------------------------
<?php
        if (!empty($atleast_one)) {
            if (!empty($leave_report)) {
        ?>

    (function(window, document, $, undefined) {
        $(function() {
            var data = [
                <?php
                                if (!empty($all_category)) {
                                    foreach ($all_category as $key => $v_category) {
                                        if (!empty($leave_report['leave_taken'][$key])) {
                                            $all_report = $leave_report['leave_taken'][$key];
                                ?> {
                    "label": "<?= $v_category->leave_category . ' ( <small>' . lang('quota') . ': ' . $leave_report['leave_quota'][$key] . ' ' . lang('taken') . ': ' . $all_report . '</small>)' ?>",
                    "color": "#<?= $color[$key] ?>",
                    "data": <?= $all_report ?>
                },
                <?php }
                                    }
                                } ?>
            ];
            var options = {
                series: {
                    pie: {
                        show: true,
                        innerRadius: 0,
                        label: {
                            show: true,
                            radius: 0.8,
                            formatter: function(label, series) {
                                return '<div class="flot-pie-label">' +
                                    Math.round(series.percent) +
                                    '%</div>';
                            },
                            background: {
                                opacity: 0.8,
                                color: '#222'
                            }
                        }
                    }
                }
            };

            var chart = $('.chart-pie');
            if (chart.length)
                $.plot(chart, data, options);

        });

    })(window, document, window.jQuery);
<?php }
        }
        ?>

<?php

        if (!empty($my_atleast_one)) { ?>
    // CHART PIE
    // -----------------------------------
    (function(window, document, $, undefined) {

        $(function() {
            var data = [
                <?php
                            if (!empty($all_category)) {
                                foreach ($all_category as $key => $v_category) {
                                    if (!empty($my_leave_report['leave_taken'][$key]) && $my_leave_report['leave_taken'][$key] != 0) {
                                        $result = $my_leave_report['leave_taken'][$key];
                            ?> {
                    "label": "<?= $v_category->leave_category . ' ( <small>' . lang('quota') . ': ' . $my_leave_report['leave_quota'][$key] . ' ' . lang('taken') . ': ' . $result . '</small>)' ?>",
                    "color": "#<?= $color[$key] ?>",
                    "data": <?= $result ?>
                },
                <?php }
                                }
                            } ?>
            ];

            var options = {
                series: {
                    pie: {
                        show: true,
                        innerRadius: 0,
                        label: {
                            show: true,
                            radius: 0.8,
                            formatter: function(label, series) {
                                return '<div class="flot-pie-label">' +
                                    Math.round(series.percent) +
                                    '%</div>';
                            },
                            background: {
                                opacity: 0.8,
                                color: '#222'
                            }
                        }
                    }
                }
            };
            var chart = $('.chart-pie-my');
            if (chart.length)
                $.plot(chart, data, options);
        });
    })(window, document, window.jQuery);

<?php } ?>
</script>
<?php } ?>
