/**
 * CreateShipmentDialog.js — ساخت محموله از فاکتور خرید/فروش
 *
 * استفاده:
 *   CreateShipmentDialog.open({
 *     api,
 *     source: 'purchase' | 'sale',
 *     invoiceId: 12,
 *     invoiceItems: [{ id, product_name, unit, quantity, ... }],
 *     onCreated: (shipment_no) => {...}
 *   });
 */

export default class CreateShipmentDialog {

    static async open(opts) {
        // لود روش‌های حمل
        let methods = [], carriers = [];
        try {
            const [m, c] = await Promise.all([
                opts.api.get("/ship/methods"),
                opts.api.get("/ship/carriers"),
            ]);
            methods  = m?.data ?? [];
            carriers = c?.data ?? [];
        } catch {}

        const isOutbound = opts.source === 'sale';
        const items = opts.invoiceItems ?? [];

        const methodOpts = methods.map(m => `<option value="${m.id}">${m.icon} ${this._esc(m.name)} (~${m.avg_days} روز)</option>`).join("");
        const carrierOpts = `<option value="">— انتخاب —</option>` + carriers.map(c =>
            `<option value="${c.id}">${this._esc(c.name)}</option>`).join("");

        const ov = document.createElement("div"); ov.className = "acc-modal-overlay";
        ov.innerHTML = `
        <div class="acc-modal" style="max-width:680px;max-height:92vh;overflow-y:auto;">
            <button class="acc-modal__close">✕</button>
            <div class="acc-modal__title">🚚 ایجاد محموله ${isOutbound ? '(فروش)' : '(خرید)'}</div>

            <div style="background:#eff6ff;padding:10px;border-radius:6px;font-size:12px;color:#1e40af;margin-bottom:12px;">
                💡 هر آیتم می‌تواند روش حمل متفاوت داشته باشد. آیتم‌هایی که می‌خواهید در همین محموله باشند را تیک بزنید.
            </div>

            <form>
                <div class="doc-form-row">
                    <div class="acc-form-group"><label>روش حمل *</label>
                        <select name="method_id" required>
                            <option value="">انتخاب...</option>${methodOpts}
                        </select>
                    </div>
                    <div class="acc-form-group"><label>شرکت حمل</label>
                        <select name="carrier_id">${carrierOpts}</select>
                    </div>
                </div>
                <div class="doc-form-row">
                    <div class="acc-form-group"><label>تاریخ برنامه تحویل</label>
                        <input name="planned_delivery_date" type="date" value="${new Date(Date.now()+86400000*3).toISOString().split('T')[0]}">
                    </div>
                    <div class="acc-form-group"><label>کد رهگیری</label>
                        <input name="tracking_code" placeholder="(اختیاری)" dir="ltr">
                    </div>
                </div>
                ${isOutbound ? `
                <div class="acc-form-group"><label>آدرس مقصد</label>
                    <textarea name="destination_address" rows="2" placeholder="آدرس مشتری..."></textarea>
                </div>` : ''}
                <div class="acc-form-group"><label>یادداشت</label>
                    <input name="notes" placeholder="یادداشت محموله">
                </div>

                <h4 style="margin:14px 0 8px 0;font-size:13px;color:#475569;">📦 آیتم‌های محموله</h4>
                <table class="acc-table" style="font-size:12px;">
                    <thead><tr>
                        <th style="width:30px;"><input type="checkbox" data-ref-pk="checkAll" checked></th>
                        <th>محصول</th><th>تعداد فاکتور</th><th>تعداد در این محموله</th>
                    </tr></thead>
                    <tbody>
                    ${items.map(it => `
                    <tr>
                        <td><input type="checkbox" name="item_${it.id}" value="1" checked></td>
                        <td>${CreateShipmentDialog._esc(it.product_name ?? it.description ?? '—')}</td>
                        <td>${it.quantity} ${CreateShipmentDialog._esc(it.unit ?? '')}</td>
                        <td><input type="number" name="qty_${it.id}" value="${it.quantity}" min="0" step="any" style="width:80px;"></td>
                    </tr>
                    `).join("")}
                    </tbody>
                </table>

                <div class="acc-modal__actions">
                    <button type="button" class="acc-btn acc-btn--secondary" data-action="cancel">انصراف</button>
                    <button type="submit" class="acc-btn acc-btn--primary">🚚 ایجاد محموله</button>
                </div>
            </form>
        </div>`;

        document.body.appendChild(ov);
        const close = () => ov.remove();
        ov.querySelector(".acc-modal__close").addEventListener("click", close);
        ov.querySelector("[data-action=cancel]").addEventListener("click", close);
        ov.addEventListener("click", e => { if (e.target === ov) close(); });

        // checkAll
        const checkAll = ov.querySelector('[data-ref-pk="checkAll"]');
        checkAll.addEventListener('change', () => {
            ov.querySelectorAll('input[name^="item_"]').forEach(c => c.checked = checkAll.checked);
        });

        ov.querySelector("form").addEventListener("submit", async ev => {
            ev.preventDefault();
            const fd = new FormData(ev.target);
            const body = {
                method_id: fd.get('method_id'),
                carrier_id: fd.get('carrier_id') || null,
                planned_delivery_date: fd.get('planned_delivery_date'),
                tracking_code: fd.get('tracking_code') ?? '',
                notes: fd.get('notes') ?? '',
                items: [],
            };
            if (isOutbound) body.destination_address = fd.get('destination_address');

            items.forEach(it => {
                if (fd.get(`item_${it.id}`)) {
                    body.items.push({
                        ref_item_id: it.id,
                        qty_planned: parseFloat(fd.get(`qty_${it.id}`) ?? it.quantity),
                    });
                }
            });

            if (!body.items.length) { alert("حداقل یک آیتم انتخاب کنید"); return; }
            if (!body.method_id)     { alert("روش حمل را انتخاب کنید"); return; }

            const btn = ev.target.querySelector("[type=submit]");
            btn.disabled = true;
            try {
                const path = isOutbound
                    ? `/ship/from-sale/${opts.invoiceId}`
                    : `/ship/from-purchase/${opts.invoiceId}`;
                const res = await opts.api.post(path, body);
                close();
                opts.onCreated?.(res?.shipment_no);
                alert(`✅ محموله ${res?.shipment_no} ایجاد شد`);
            } catch(e) {
                alert("خطا: " + (e?.message ?? ""));
                btn.disabled = false;
            }
        });
    }

    static _esc(s) { return String(s ?? "").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;"); }
}
