<?php $__template->layout('Layout.main'); ?>

<?php $__template->section('title'); ?>إنشاء قيد افتتاحي<?php $__template->endSection(); ?>

<?php $__template->section('content'); ?>
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;">
    <h2 style="margin:0;">إنشاء قيد افتتاحي</h2>
    <a href="/accounting/opening-entries" class="btn btn-outline">العودة</a>
</div>

<div class="card">
    <div style="padding:20px;">
        <form method="POST" action="/accounting/opening-entries" id="opening-form">
            <?= csrf_field() ?>
            <div style="margin-bottom:20px;">
                <label class="form-label">السنة المالية <span style="color:#DC2626;">*</span></label>
                <select name="fiscal_year_id" class="form-select" required style="max-width:300px;">
                    <option value="">— اختر —</option>
                    <?php foreach ($fiscalYears as $fy): ?>
                        <option value="<?= (int)$fy['id'] ?>"><?= e($fy['name_ar']) ?> (<?= e($fy['start_date']) ?>)</option>
                    <?php endforeach; ?>
                </select>
            </div>

            <div class="table-responsive">
                <table class="data-table" style="width:100%;" id="lines-table">
                    <thead>
                        <tr>
                            <th style="width:35%;">الحساب</th>
                            <th style="width:20%;">مدين</th>
                            <th style="width:20%;">دائن</th>
                            <th style="width:20%;">بيان</th>
                            <th style="width:5%;"></th>
                        </tr>
                    </thead>
                    <tbody id="lines-body">
                        <tr>
                            <td>
                                <select name="entries[0][account_id]" class="form-select" required>
                                    <option value="">— اختر حساب —</option>
                                    <?php foreach ($accounts as $acc): ?>
                                        <option value="<?= (int)$acc['id'] ?>"><?= e($acc['code']) ?> — <?= e($acc['name_ar']) ?></option>
                                    <?php endforeach; ?>
                                </select>
                            </td>
                            <td><input type="number" name="entries[0][debit]" class="form-input line-debit" step="0.01" min="0" value="0" dir="ltr"></td>
                            <td><input type="number" name="entries[0][credit]" class="form-input line-credit" step="0.01" min="0" value="0" dir="ltr"></td>
                            <td><input type="text" name="entries[0][description]" class="form-input" value="قيد افتتاحي"></td>
                            <td></td>
                        </tr>
                    </tbody>
                    <tfoot>
                        <tr style="font-weight:700;background:#F9FAFB;">
                            <td>الإجمالي</td>
                            <td id="total-debit" style="text-align:center;">0.00</td>
                            <td id="total-credit" style="text-align:center;">0.00</td>
                            <td colspan="2" id="balance-msg"></td>
                        </tr>
                    </tfoot>
                </table>
            </div>

            <div style="margin-top:15px;display:flex;gap:8px;">
                <button type="button" id="btn-add-line" class="btn btn-outline">+ سطر</button>
                <button type="submit" class="btn btn-primary">حفظ القيد الافتتاحي</button>
            </div>
        </form>
    </div>
</div>

<script>
(function(){
    var idx = 1;
    var body = document.getElementById('lines-body');
    var btn = document.getElementById('btn-add-line');
    var accountOptions = body.querySelector('select').innerHTML;

    btn.addEventListener('click', function(){
        var tr = document.createElement('tr');
        tr.innerHTML = '<td><select name="entries['+idx+'][account_id]" class="form-select" required>'+accountOptions+'</select></td>'
            +'<td><input type="number" name="entries['+idx+'][debit]" class="form-input line-debit" step="0.01" min="0" value="0" dir="ltr"></td>'
            +'<td><input type="number" name="entries['+idx+'][credit]" class="form-input line-credit" step="0.01" min="0" value="0" dir="ltr"></td>'
            +'<td><input type="text" name="entries['+idx+'][description]" class="form-input" value="قيد افتتاحي"></td>'
            +'<td><button type="button" class="btn btn-sm btn-outline" onclick="this.closest(\'tr\').remove();calcTotals();">×</button></td>';
        body.appendChild(tr);
        idx++;
        bindCalc();
    });

    function calcTotals(){
        var d=0,c=0;
        document.querySelectorAll('.line-debit').forEach(function(i){d+=parseFloat(i.value)||0;});
        document.querySelectorAll('.line-credit').forEach(function(i){c+=parseFloat(i.value)||0;});
        document.getElementById('total-debit').textContent=d.toFixed(2);
        document.getElementById('total-credit').textContent=c.toFixed(2);
        var diff=Math.abs(d-c);
        var msg=document.getElementById('balance-msg');
        if(diff<0.01){msg.textContent='متوازن';msg.style.color='#059669';}
        else{msg.textContent='فرق: '+diff.toFixed(2);msg.style.color='#DC2626';}
    }
    function bindCalc(){
        document.querySelectorAll('.line-debit,.line-credit').forEach(function(i){i.removeEventListener('input',calcTotals);i.addEventListener('input',calcTotals);});
    }
    bindCalc();
})();
</script>
<?php $__template->endSection(); ?>
