<div class="row justify-content-center">
<div class="col-lg-8">
<div class="card">
    <div class="card-header"><h5 class="mb-0"><i class="fas fa-file-invoice-dollar me-2"></i><?= lang('adv_finance.create_plan') ?></h5></div>
    <div class="card-body">
        <form method="POST" action="/advanced-finance/installments/store" data-ajax="true">
            <?= csrf_field() ?>
            <div class="row g-3">
                <div class="col-md-6">
                    <label class="form-label"><?= lang('adv_finance.member') ?> <span class="text-danger">*</span></label>
                    <select name="member_id" class="form-select select2-ajax" data-url="/advanced-finance/api/member-search" required></select>
                    <div class="invalid-feedback" data-field="member_id"></div>
                </div>
                <div class="col-md-6">
                    <label class="form-label"><?= lang('adv_finance.invoice') ?></label>
                    <select name="invoice_id" class="form-select select2-ajax" data-url="/advanced-finance/api/invoice-search"></select>
                    <div class="invalid-feedback" data-field="invoice_id"></div>
                </div>
                <div class="col-md-4">
                    <label class="form-label"><?= lang('adv_finance.template') ?></label>
                    <select name="template_id" id="templateSelect" class="form-select">
                        <option value="">— Custom —</option>
                        <?php foreach ($templates as $t): ?>
                        <option value="<?= $t['id'] ?>"
                                data-installments="<?= $t['number_of_installments'] ?>"
                                data-frequency="<?= $t['frequency'] ?>"
                                data-downpct="<?= $t['down_payment_percentage'] ?>">
                            <?= e($t['name_en']) ?>
                        </option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="col-md-4">
                    <label class="form-label"><?= lang('adv_finance.total_amount') ?> <span class="text-danger">*</span></label>
                    <input type="number" name="total_amount" class="form-control" step="0.01" required>
                    <div class="invalid-feedback" data-field="total_amount"></div>
                </div>
                <div class="col-md-4">
                    <label class="form-label"><?= lang('adv_finance.down_payment') ?> <span class="text-danger">*</span></label>
                    <input type="number" name="down_payment" class="form-control" step="0.01" value="0" required>
                    <div class="invalid-feedback" data-field="down_payment"></div>
                </div>
                <div class="col-md-4">
                    <label class="form-label"><?= lang('adv_finance.num_installments') ?> <span class="text-danger">*</span></label>
                    <input type="number" name="num_installments" class="form-control" min="1" max="120" required>
                    <div class="invalid-feedback" data-field="num_installments"></div>
                </div>
                <div class="col-md-4">
                    <label class="form-label"><?= lang('adv_finance.frequency') ?> <span class="text-danger">*</span></label>
                    <select name="frequency" class="form-select" required>
                        <?php foreach ($frequencies as $f): ?>
                        <option value="<?= $f ?>"><?= ucfirst(str_replace('_', ' ', $f)) ?></option>
                        <?php endforeach; ?>
                    </select>
                    <div class="invalid-feedback" data-field="frequency"></div>
                </div>
                <div class="col-md-4">
                    <label class="form-label"><?= lang('adv_finance.start_date') ?> <span class="text-danger">*</span></label>
                    <input type="date" name="start_date" class="form-control" value="<?= date('Y-m-d') ?>" required>
                    <div class="invalid-feedback" data-field="start_date"></div>
                </div>
            </div>
            <div class="mt-4 d-flex gap-2">
                <button type="submit" class="btn btn-primary"><i class="fas fa-save me-1"></i><?= lang('common.save') ?></button>
                <a href="/advanced-finance/installments" class="btn btn-secondary"><?= lang('common.cancel') ?></a>
            </div>
        </form>
    </div>
</div>
</div>
</div>

<?php $__view->push('scripts') ?>
<script>
document.addEventListener('DOMContentLoaded', function() {
    AdvFinance.initMemberSelect('.select2-ajax[data-url*="member-search"]');
    AdvFinance.initMemberSelect('.select2-ajax[data-url*="invoice-search"]');

    document.getElementById('templateSelect').addEventListener('change', function() {
        const opt = this.options[this.selectedIndex];
        if (opt.value) {
            document.querySelector('[name="num_installments"]').value = opt.dataset.installments || '';
            document.querySelector('[name="frequency"]').value = opt.dataset.frequency || 'monthly';
        }
    });
});
</script>
<?php $__view->endPush() ?>