/**
 * DepreciationSection.js — اجرا و گزارش استهلاک
 */
import SectionBase from "../../accounting/SectionBase.js";

const MONTH_NAMES = ['فروردین','اردیبهشت','خرداد','تیر','مرداد','شهریور','مهر','آبان','آذر','دی','بهمن','اسفند'];

export default class DepreciationSection extends SectionBase {

    async template() {
        return `
        <div class="acc-section-wrap">
            <div class="acc-toolbar">
                <h2 class="acc-section-title">📉 استهلاک</h2>
            </div>

            <!-- اجرا -->
            <div style="background:#eff6ff;padding:14px;border-radius:8px;margin-bottom:14px;border:1px solid #bfdbfe;">
                <h3 style="margin:0 0 10px 0;font-size:14px;color:#1e40af;">⚙️ اجرای استهلاک ماهانه</h3>
                <div style="display:flex;gap:10px;align-items:end;flex-wrap:wrap;">
                    <div class="acc-form-group" style="margin:0;">
                        <label style="font-size:11px;">سال میلادی</label>
                        <input data-ref="year" type="number" class="acc-input" value="${new Date().getFullYear()}" min="2020" max="2100">
                    </div>
                    <div class="acc-form-group" style="margin:0;">
                        <label style="font-size:11px;">ماه</label>
                        <select data-ref="month" class="acc-input">
                            ${[1,2,3,4,5,6,7,8,9,10,11,12].map(m =>
                                `<option value="${m}" ${m === new Date().getMonth() + 1 ? 'selected' : ''}>${m}</option>`).join("")}
                        </select>
                    </div>
                    <button class="acc-btn acc-btn--primary" data-ref="runBtn">▶️ اجرای استهلاک</button>
                    <button class="acc-btn acc-btn--secondary" data-ref="refreshBtn">🔄</button>
                </div>
                <small style="color:#64748b;font-size:11px;">💡 استهلاک بر اساس روش هر دسته‌بندی محاسبه می‌شود</small>
            </div>

            <div data-ref="wrap"><div class="acc-loading">⏳ بارگذاری اموال...</div></div>
        </div>`;
    }

    async afterRender() {
        await this._loadAssets();
        this.on(this.ref("runBtn"),     "click", () => this._run());
        this.on(this.ref("refreshBtn"), "click", () => this._loadAssets());
    }

    async _loadAssets() {
        this.ref("wrap").innerHTML = `<div class="acc-loading">⏳ بارگذاری...</div>`;
        try {
            const res = await this.api.get("/assets", { status: 'active' });
            this._render(res?.data ?? []);
        } catch { this.ref("wrap").innerHTML = `<div class="acc-error">❌ خطا</div>`; }
    }

    _render(rows) {
        if (!rows.length) { this.ref("wrap").innerHTML = `<div class="acc-empty">دارایی فعالی نیست</div>`; return; }
        const totalPurchase = rows.reduce((s, a) => s + parseFloat(a.purchase_price), 0);
        const totalCurrent  = rows.reduce((s, a) => s + parseFloat(a.current_value), 0);
        const totalDepr     = totalPurchase - totalCurrent;

        this.ref("wrap").innerHTML = `
        <div style="background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:14px;margin-bottom:14px;">
            <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;">
                <div>
                    <div style="font-size:11px;color:#64748b;">قیمت کل خرید</div>
                    <div style="font-size:18px;font-weight:700;color:#3b82f6;">${this._fmt(totalPurchase)} ﷼</div>
                </div>
                <div>
                    <div style="font-size:11px;color:#64748b;">ارزش دفتری فعلی</div>
                    <div style="font-size:18px;font-weight:700;color:#10b981;">${this._fmt(totalCurrent)} ﷼</div>
                </div>
                <div>
                    <div style="font-size:11px;color:#64748b;">استهلاک تجمعی</div>
                    <div style="font-size:18px;font-weight:700;color:#ef4444;">${this._fmt(totalDepr)} ﷼</div>
                </div>
            </div>
        </div>

        <table class="acc-table">
            <thead><tr><th>دارایی</th><th>تاریخ خرید</th><th>قیمت خرید</th><th>ارزش فعلی</th><th>استهلاک</th><th>%</th></tr></thead>
            <tbody>
            ${rows.map(a => {
                const depr = parseFloat(a.purchase_price) - parseFloat(a.current_value);
                const pct  = parseFloat(a.purchase_price) > 0 ? (depr / parseFloat(a.purchase_price)) * 100 : 0;
                return `<tr>
                    <td>
                        <b>${this.escape(a.name)}</b>
                        <br><small style="color:#94a3b8;">${this.escape(a.asset_code)} | ${a.category_icon || ''} ${this.escape(a.category_name ?? '')}</small>
                    </td>
                    <td>${a.purchase_date ?? '—'}</td>
                    <td>${this._fmt(a.purchase_price)}</td>
                    <td><b style="color:#10b981;">${this._fmt(a.current_value)}</b></td>
                    <td><b style="color:#ef4444;">${this._fmt(depr)}</b></td>
                    <td>
                        <div style="display:flex;align-items:center;gap:6px;">
                            <div style="flex:1;height:6px;background:#e2e8f0;border-radius:3px;overflow:hidden;">
                                <div style="height:100%;width:${Math.min(100, pct)}%;background:#ef4444;"></div>
                            </div>
                            <small>${pct.toFixed(1)}٪</small>
                        </div>
                    </td>
                </tr>`;
            }).join("")}
            </tbody>
        </table>`;
    }

    async _run() {
        const year  = parseInt(this.ref("year")?.value ?? new Date().getFullYear());
        const month = parseInt(this.ref("month")?.value ?? new Date().getMonth() + 1);
        if (!confirm(`اجرای استهلاک برای ماه ${month}/${year}؟`)) return;

        const btn = this.ref("runBtn");
        btn.disabled = true; btn.textContent = "⏳ در حال اجرا...";
        try {
            const res = await this.api.post("/assets/depreciation/run", { year, month });
            alert(`✅ استهلاک برای ${res?.processed} دارایی محاسبه شد`);
            this._loadAssets();
        } catch(e) { alert("خطا: " + (e?.message ?? "")); }
        finally { btn.disabled = false; btn.textContent = "▶️ اجرای استهلاک"; }
    }

    _fmt(v) { return new Intl.NumberFormat("fa-IR").format(Math.round(Number(v ?? 0))); }
    escape(s) { return String(s ?? "").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;"); }
}
