<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>

<?= message_box('success'); ?>
<?= message_box('error'); ?>

<?php
$type = $this->uri->segment(4);
if (!empty($type) && !is_numeric($type)) {
    $ex = explode('_', $type);
    if ($ex[0] == 'c') {
        $type = '_' . date('Y');
    }
}
if (empty($type)) {
    $type = '';
}

$active_filter = $type;

$period_options = array(
    '' => lang('all'),
    'last_month' => lang('last_month'),
    'this_months' => lang('this_months'),
);

$selected_period = array_key_exists($active_filter, $period_options) ? $active_filter : '';
?>

<div id="client-proposals-page" class="space-y-4">
    <div class="rounded-2xl border border-border bg-card shadow-sm">
        <div class="p-4">
            <div class="overflow-x-auto">
                <table class="min-w-[760px] text-sm DataTables md:min-w-full" id="DataTables" cellspacing="0" width="100%">
                    <thead class="bg-slate-50 text-slate-500 dark:bg-slate-800 dark:text-slate-300">
                        <tr>
                            <th class="px-4 py-3 text-left"><?= lang('proposal') ?> #</th>
                            <th class="px-4 py-3 text-left"><?= lang('proposal_date') ?></th>
                            <th class="px-4 py-3 text-left"><?= lang('expire_date') ?></th>
                            <th class="px-4 py-3 text-left"><?= lang('amount') ?></th>
                            <th class="px-4 py-3 text-left"><?= lang('status') ?></th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<style>
    #client-proposals-page .dataTables_wrapper .dataTables_paginate {
        max-width: 100%;
        overflow-x: auto;
        white-space: nowrap;
    }

    #client-proposals-page .dataTables_wrapper > .flex:first-child {
        align-items: center;
    }
</style>

<script>
    list = base_url + "client/proposals/proposalsList";

    function reloadProposals(filter) {
        var url = list;
        if (filter) {
            url += "/" + filter;
        }
        if (typeof table_url !== "undefined") {
            table_url(url);
        } else if (typeof fire_datatable === "function") {
            fire_datatable(url);
        }
    }

    document.addEventListener('DOMContentLoaded', function() {
        var periodSelect = document.getElementById('proposal_period_filter');
        if (periodSelect) {
            periodSelect.addEventListener('change', function() {
                reloadProposals(periodSelect.value);
            });
        }
    });
</script>
