/**
 * melk-gis-panel.js — نمایش read-only پانل چپ نقشه هوشمند در پورتال ملک
 */

const STATUS_COLOR = {
    prospect: '#f59e0b', under_review: '#f97316', purchased: '#3b82f6',
    permitted: '#8b5cf6', under_construction: '#ef4444', completed: '#10b981',
    sold: '#6b7280', archived: '#d1d5db',
};

const STATUS_LABEL = {
    prospect: 'در کشف', under_review: 'در بررسی', purchased: 'خریداری‌شده',
    permitted: 'مجوزگرفته', under_construction: 'در ساخت', completed: 'تکمیل‌شده',
    sold: 'فروخته‌شده', archived: 'بایگانی',
};

const ISSUE_LABEL = {
    mortgage: 'در رهن بانک', court_seizure: 'توقیف دادگاه', tax_seizure: 'توقیف مالیاتی',
    legal_dispute: 'دعوای حقوقی', inheritance_dispute: 'اختلاف وراثتی',
    road_plan: 'در طرح معبر', national_land: 'اراضی ملی', endowment: 'وقف',
    utility_debt: 'بدهی آب/برق/گاز', municipality_debt: 'بدهی شهرداری',
    easement: 'حق ارتفاق', other: 'سایر',
};

const VIOLATION_LABEL = {
    extra_floor: 'طبقه اضافه', extra_area: 'مازاد تراکم', illegal_use: 'کاربری غیرمجاز',
    no_permit: 'بدون پروانه', facade: 'نما', parking: 'پارکینگ', other: 'سایر',
};

function fmt(n) {
    return Number(n || 0).toLocaleString('fa-IR');
}

function row(esc, label, value) {
    if (value == null || value === '' || value === '—') return '';
    return `<div class="gis-info-row"><span class="gis-info-label">${label}</span><span class="gis-info-value">${value}</span></div>`;
}

export function renderGisTabContent(tab, p, esc) {
    switch (tab) {
        case 'land': return _tabLand(p, esc);
        case 'building': return _tabBuilding(p, esc);
        case 'ownership': return _tabOwnership(p, esc);
        case 'use': return _tabUse(p, esc);
        case 'issues': return _tabIssues(p, esc);
        case 'score': return _tabScore(p, esc);
        case 'units': return _tabUnits(p, esc);
        default: return '';
    }
}

function _tabLand(p, esc) {
    const l = p.land || {};
    const shapeLabel = { rectangular: 'مستطیل', square: 'مربع', corner: 'گوشه‌ای', irregular: 'نامنظم', triangular: 'مثلثی' };
    const posLabel = { middle: 'میانی', corner: 'گوشه', end: 'انتهایی' };
    const ownLabel = { private: 'ملکی', endowment: 'وقفی', government: 'دولتی', national: 'اراضی ملی' };
    const allowedFloors = l.main_street_width
        ? (l.main_street_width < 6 ? '۲ طبقه' : l.main_street_width < 12 ? '۵ طبقه' : l.main_street_width < 24 ? '۷ طبقه' : '۱۰+ طبقه')
        : '—';

    return `<div class="gis-tab-content">
        ${row(esc, 'مساحت', l.area_sqm ? `${fmt(l.area_sqm)} م²` : null)}
        ${row(esc, 'شکل زمین', shapeLabel[l.shape])}
        ${row(esc, 'موقعیت', posLabel[l.position])}
        ${row(esc, 'نوع مالکیت زمین', ownLabel[l.ownership_type])}
        ${l.is_national_land ? '<div class="gis-alert-row gis-alert-row--critical">🔴 اراضی ملی</div>' : ''}
        <div class="gis-info-divider">معابر مجاور</div>
        ${row(esc, 'معبر اصلی', l.main_street_width ? `${l.main_street_width} متر — ${l.main_street_dir || ''}` : null)}
        ${row(esc, 'معبر فرعی', l.second_street_width ? `${l.second_street_width} متر — ${l.second_street_dir || ''}` : null)}
        ${row(esc, 'طبقات مجاز (تخمین)', allowedFloors)}
        <div class="gis-info-divider">ابعاد</div>
        ${row(esc, 'بر شمالی', l.north_dim ? `${l.north_dim} م` : null)}
        ${row(esc, 'بر جنوبی', l.south_dim ? `${l.south_dim} م` : null)}
        ${row(esc, 'عمق شرقی', l.east_dim ? `${l.east_dim} م` : null)}
        ${row(esc, 'عمق غربی', l.west_dim ? `${l.west_dim} م` : null)}
        ${p.address ? `<div class="gis-info-divider">آدرس</div><div style="font-size:12px;color:#475569;padding:8px 0;">${esc(p.address)}</div>` : ''}
    </div>`;
}

function _tabBuilding(p, esc) {
    const b = p.building || {};
    if (!b || !b.has_building) {
        return '<div class="gis-empty-tab">🏗️ اطلاعات ساختمان ثبت نشده است.</div>';
    }
    const age = b.built_year ? `${new Date().getFullYear() - b.built_year} سال` : null;
    const struLabel = { concrete: 'بتن‌آرمه', steel: 'فلزی', masonry: 'آجری', other: 'سایر' };
    const yn = v => (v ? '✅' : '❌');
    return `<div class="gis-tab-content">
        ${row(esc, 'تعداد طبقات', b.floors)}
        ${row(esc, 'تعداد واحدها', b.units)}
        ${row(esc, 'مساحت کل بنا', b.total_area_sqm ? `${fmt(b.total_area_sqm)} م²` : null)}
        ${row(esc, 'سال ساخت', b.built_year)}
        ${row(esc, 'عمر بنا', age)}
        ${row(esc, 'نوع اسکلت', struLabel[b.structure_type])}
        ${row(esc, 'نما', b.facade)}
        <div class="gis-info-divider">مدارک</div>
        ${row(esc, 'پروانه ساخت', b.has_permit === 'yes' ? '✅ دارد' : b.has_permit === 'no' ? '❌ ندارد' : '⚠️ نامعلوم')}
        ${b.permit_number ? row(esc, 'شماره پروانه', b.permit_number) : ''}
        ${row(esc, 'پایان کار', b.has_completion === 'yes' ? '✅ دارد' : b.has_completion === 'no' ? '❌ ندارد' : '⚠️ ناقص')}
        <div class="gis-info-divider">امکانات</div>
        <div class="gis-amenities-grid">
            <span>${yn(b.has_water)} آب</span><span>${yn(b.has_electricity)} برق</span>
            <span>${yn(b.has_gas)} گاز</span><span>${yn(b.has_elevator)} آسانسور</span>
            <span>${yn(b.has_parking)} پارکینگ</span><span>${yn(b.has_storage)} انباری</span>
            ${b.has_basement ? '<span>✅ زیرزمین</span>' : ''}
        </div>
    </div>`;
}

function _tabOwnership(p, esc) {
    const owners = p.owners || [];
    const history = p.history || [];
    const deedLabel = { single_page: 'تک‌برگ', old: 'منگوله‌دار', qolnameh: 'قولنامه‌ای', other: 'سایر' };
    const histLabel = { sale: 'خرید و فروش', inheritance: 'ارث', gift: 'هبه', auction: 'مزایده', government: 'تملک دولتی', endowment: 'وقف', other: 'سایر' };

    const ownersHtml = owners.length ? owners.map(o => `
        <div class="gis-owner-card ${o.is_primary == '1' ? 'gis-owner-card--primary' : ''}">
            <div class="gis-owner-name">${esc(o.name)} ${o.is_primary == '1' ? '<span class="gis-badge">اصلی</span>' : ''}</div>
            <div class="gis-owner-meta">${deedLabel[o.deed_type] || o.deed_type || ''}${o.deed_number ? ' — سند ' + esc(o.deed_number) : ''}${o.ownership_share ? ' — ' + esc(o.ownership_share) : ''}</div>
            ${o.phone ? `<div class="gis-owner-meta">📞 ${esc(o.phone)}</div>` : ''}
        </div>`).join('') : '<div class="gis-empty-tab">مالکی ثبت نشده است.</div>';

    const histHtml = history.length
        ? `<div class="gis-timeline">${history.map(h => `
            <div class="gis-timeline-item">
                <div class="gis-timeline-dot"></div>
                <div class="gis-timeline-body">
                    <div class="gis-timeline-title">${esc(h.owner_name)}</div>
                    <div class="gis-timeline-meta">${histLabel[h.transfer_type] || h.transfer_type}${h.transfer_date ? ' — ' + esc(String(h.transfer_date).slice(0, 10)) : ''}</div>
                    ${h.notes ? `<div class="gis-timeline-note">${esc(h.notes)}</div>` : ''}
                </div>
            </div>`).join('')}</div>`
        : '<div class="gis-empty-tab" style="margin-top:8px;">تاریخچه‌ای ثبت نشده.</div>';

    return `<div class="gis-tab-content">
        <div class="gis-section-title">مالکین فعلی</div>${ownersHtml}
        <div class="gis-section-title" style="margin-top:16px;">تاریخچه مالکیت</div>${histHtml}
    </div>`;
}

function _tabUse(p, esc) {
    const u = p.use || {};
    const landArea = parseFloat(p.land?.area_sqm || 0);
    const density = parseFloat(u.density_pct || 0);
    const coverage = parseFloat(u.coverage_pct || 0);
    const maxBuild = u.max_build_area ? parseFloat(u.max_build_area) : (landArea > 0 && density > 0 ? landArea * density / 100 : null);
    const footprint = landArea > 0 && coverage > 0 ? landArea * coverage / 100 : null;
    const hasConflict = u.current_use && u.approved_use && u.current_use.trim() !== u.approved_use.trim();

    if (!u.current_use && !u.approved_use && !u.density_pct) {
        return '<div class="gis-empty-tab">🏷️ اطلاعات کاربری ثبت نشده است.</div>';
    }

    return `<div class="gis-tab-content">
        ${hasConflict ? '<div class="gis-alert-row gis-alert-row--critical" style="margin-bottom:12px;">⚠️ تعارض کاربری: کاربری فعلی با مصوب طرح تفصیلی مغایرت دارد</div>' : ''}
        <div class="gis-info-divider">کاربری</div>
        ${row(esc, 'کاربری فعلی', u.current_use ? esc(u.current_use) : null)}
        ${row(esc, 'کاربری مصوب (طرح تفصیلی)', u.approved_use ? esc(u.approved_use) : null)}
        <div class="gis-info-divider">ضوابط ساختمانی</div>
        ${row(esc, 'تراکم ساختمانی مجاز', density > 0 ? `${density}%` : null)}
        ${row(esc, 'سطح اشغال مجاز', coverage > 0 ? `${coverage}%` : null)}
        ${row(esc, 'حداکثر طبقات مجاز', u.max_floors || null)}
        ${(maxBuild || footprint) ? `
        <div class="gis-info-divider">محاسبات اتوماتیک</div>
        ${maxBuild ? `<div class="gis-info-row" style="background:#f0fdf4;border-radius:8px;padding:8px 12px;"><span class="gis-info-label">حداکثر زیربنای مجاز</span><span class="gis-info-value" style="color:#166534;font-weight:800;">${fmt(maxBuild)} م²</span></div>` : ''}
        ${footprint ? `<div class="gis-info-row" style="background:#eff6ff;border-radius:8px;padding:8px 12px;"><span class="gis-info-label">سطح اشغال زمین</span><span class="gis-info-value" style="color:#1e40af;font-weight:700;">${fmt(footprint)} م²</span></div>` : ''}` : ''}
    </div>`;
}

function _tabIssues(p, esc) {
    const issues = p.issues || [];
    const commissions = p.commissions || [];
    const sevColor = { critical: '#fee2e2', warning: '#fef3c7', info: '#eff6ff' };
    const sevBorder = { critical: '#ef4444', warning: '#f59e0b', info: '#3b82f6' };
    const statusLabel = { active: 'فعال', resolved: 'رفع‌شده', partial: 'جزئی' };
    const verdictLabel = { demolish: '🔴 تخریب', fine: '🟡 جریمه', conditional: '🟠 مشروط' };
    const vs = { pending: 'در انتظار', executed: 'اجرا شده', not_executed: 'اجرا نشده', appealed: 'اعتراض' };

    const activeIssues = issues.filter(i => i.status === 'active');
    const resolvedIssues = issues.filter(i => i.status !== 'active');

    const issuesHtml = activeIssues.length ? activeIssues.map(i => `
        <div class="gis-issue-card" style="background:${sevColor[i.severity] || '#f8fafc'};border-right:3px solid ${sevBorder[i.severity] || '#cbd5e1'}">
            <div class="gis-issue-title">${esc(i.title)}</div>
            <div class="gis-issue-meta">${ISSUE_LABEL[i.type] || i.type}${i.amount ? ' — ' + fmt(i.amount) + ' ﷼' : ''}</div>
            ${i.description ? `<div class="gis-issue-desc">${esc(i.description)}</div>` : ''}
        </div>`).join('') : '<div class="gis-empty-tab" style="padding:12px 0;">مشکل فعالی ثبت نشده ✅</div>';

    const resolvedHtml = resolvedIssues.length ? resolvedIssues.map(i => `
        <div class="gis-issue-card" style="background:#f8fafc;border-right:3px solid #cbd5e1;opacity:0.85;">
            <div class="gis-issue-title" style="color:#64748b;">${esc(i.title)}</div>
            <div class="gis-issue-meta" style="color:#94a3b8;">✅ ${statusLabel[i.status] || i.status}${i.resolved_at ? ' — ' + esc(String(i.resolved_at).slice(0, 10)) : ''}</div>
        </div>`).join('') : '';

    const commsHtml = commissions.length ? commissions.map(c => `
        <div class="gis-issue-card" style="background:#fef9c3;border-right:3px solid #eab308;">
            <div class="gis-issue-title">ماده ۱۰۰ — سال ${c.year}</div>
            <div class="gis-issue-meta">${VIOLATION_LABEL[c.violation_type] || c.violation_type} | ${verdictLabel[c.verdict] || c.verdict} | ${vs[c.verdict_status] || c.verdict_status}${c.fine_amount ? ' — ' + fmt(c.fine_amount) + ' ﷼' : ''}</div>
            ${c.case_number ? `<div class="gis-issue-meta">پرونده: ${esc(c.case_number)}</div>` : ''}
        </div>`).join('') : '<div class="gis-empty-tab" style="padding:8px 0;">سابقه کمیسیون ثبت نشده</div>';

    return `<div class="gis-tab-content">
        <div class="gis-section-title">مشکلات و موانع</div>${issuesHtml}${resolvedHtml}
        <div class="gis-section-title" style="margin-top:16px;">کمیسیون ماده ۱۰۰ (GIS)</div>${commsHtml}
    </div>`;
}

function _tabScore(p, esc) {
    const score = p.score || { score: 0, level: 'risky' };
    const color = { good: '#10b981', moderate: '#f59e0b', risky: '#ef4444' }[score.level] || '#6b7280';
    const label = { good: 'خوب', moderate: 'متوسط', risky: 'پرریسک' }[score.level] || '—';
    const pct = (score.score || 0) + '%';
    return `<div class="gis-tab-content">
        <div class="gis-score-display" style="border-color:${color}">
            <div class="gis-score-value" style="color:${color}">${score.score || 0}</div>
            <div class="gis-score-label">${label}</div>
        </div>
        <div class="gis-score-bar-wrap"><div class="gis-score-bar-track"><div class="gis-score-bar-fill" style="width:${pct};background:${color}"></div></div></div>
        ${(score.warnings || []).length ? `<div class="gis-section-title" style="margin-top:14px;">موارد کاهش امتیاز</div>${score.warnings.map(w => `
            <div class="gis-issue-card" style="background:${w.level === 'critical' ? '#fee2e2' : '#fef3c7'};border-right:3px solid ${w.level === 'critical' ? '#ef4444' : '#f59e0b'}">
                <span style="font-size:13px;">${w.level === 'critical' ? '🔴' : '🟡'} ${esc(w.text)}</span>
            </div>`).join('')}` : '<div class="gis-empty-tab" style="margin-top:16px;color:#10b981;">✅ هیچ مشکل کاهش‌دهنده‌ای یافت نشد</div>'}
    </div>`;
}

function _tabUnits(p, esc) {
    const units = p.units || [];
    if (!units.length) return '<div class="gis-empty-tab">واحد/پلاک فرعی ثبت نشده</div>';
    return `<div class="gis-tab-content"><div class="gis-section-title">واحدهای ثبت‌شده (${units.length})</div>
        <div class="em-reno-units-list">${units.map(u => `
            <div class="em-reno-unit-item">
                <code dir="ltr">${esc(u.renovation_code || u.code || '')}</code>
                ${u.unit_type ? `<span>${esc(u.unit_type)}</span>` : ''}
                ${u.area_sqm ? `<span>${fmt(u.area_sqm)} م²</span>` : ''}
            </div>`).join('')}</div></div>`;
}

export function renderGisParcelPanel(parcel, esc, opts = {}) {
    if (!parcel) return '';
    const p = parcel;
    const score = p.score || { score: 0, level: 'risky' };
    const scoreColor = { good: '#10b981', moderate: '#f59e0b', risky: '#ef4444' }[score.level] || '#6b7280';
    const issues = p.issues || [];
    const activeIssues = issues.filter(i => i.status === 'active');
    const criticalCount = activeIssues.filter(i => i.severity === 'critical').length;
    const warningCount = activeIssues.filter(i => i.severity === 'warning').length;
    const issueBadge = criticalCount + warningCount;

    const codeDisplay = p.code
        ? `پلاک ${esc(p.code)}${p.sub_code ? '/' + esc(p.sub_code) : ''}`
        : `پارسل #${p.id || p.parcel_id}`;

    return `<div class="em-reno-gis-panel gis-detail-panel--embedded" data-ref="gisPanel">
        <div class="gis-panel-header">
            <div class="gis-panel-header__info">
                <div class="gis-panel-title">${codeDisplay}</div>
                <div class="gis-panel-sub">${esc([p.district_name, p.neighborhood_name].filter(Boolean).join(' ← '))}</div>
            </div>
            <div class="gis-score-badge" style="background:${scoreColor}">${score.score || 0}<span style="font-size:10px;">/۱۰۰</span></div>
        </div>
        <div class="gis-panel-status-row">
            <span class="gis-status-dot" style="background:${STATUS_COLOR[p.status] || '#94a3b8'}"></span>
            <span style="font-weight:700;font-size:13px;">${esc(STATUS_LABEL[p.status] || p.status || '—')}</span>
            ${p.locked_by_name ? `<span class="gis-lock-badge">🔒 ${esc(p.locked_by_name)}</span>` : ''}
            ${criticalCount > 0 ? `<span class="gis-issue-badge gis-issue-badge--critical">⚠️ ${criticalCount} بحرانی</span>` : ''}
            ${warningCount > 0 ? `<span class="gis-issue-badge gis-issue-badge--warning">⚡ ${warningCount} هشدار</span>` : ''}
        </div>
        <div class="gis-panel-tabs" data-ref="gisPanelTabs">
            <button class="gis-panel-tab gis-panel-tab--active" data-gtab="land">📍 زمین</button>
            <button class="gis-panel-tab" data-gtab="building">🏛️ ساختمان</button>
            <button class="gis-panel-tab" data-gtab="ownership">👤 مالکیت</button>
            <button class="gis-panel-tab" data-gtab="use">🏷️ کاربری</button>
            <button class="gis-panel-tab" data-gtab="issues">⚠️ مشکلات${issueBadge ? ` (${issueBadge})` : ''}</button>
            <button class="gis-panel-tab" data-gtab="score">📊 کارنامه</button>
            ${(p.units || []).length ? '<button class="gis-panel-tab" data-gtab="units">🏠 واحدها</button>' : ''}
        </div>
        <div class="gis-panel-body" data-ref="gisPanelBody">${renderGisTabContent('land', p, esc)}</div>
        <div class="gis-panel-actions em-reno-gis-actions-bar">
            ${opts.erpUrl ? `<a class="gis-btn gis-btn--primary" href="${esc(opts.erpUrl)}index.php?tab=gis&parcel=${p.id || p.parcel_id}" target="_blank">🗺️ باز کردن در نقشه ERP</a>` : ''}
            ${opts.erpUrl ? `<button type="button" class="gis-btn gis-btn--secondary" data-ref="openGisMapBtn">📍 نمایش روی نقشه</button>` : ''}
        </div>
    </div>`;
}

export function bindGisParcelPanel(root, { parcel, esc, erpUrl }) {
    const panel = root?.querySelector('[data-ref="gisPanel"]');
    if (!panel || !parcel) return;

    panel.querySelector('[data-ref="openGisMapBtn"]')?.addEventListener('click', () => {
        const code = parcel.code;
        if (code) sessionStorage.setItem('acc_gis_search_code', code);
        window.open((erpUrl || '/acc-engine/') + 'index.php?tab=gis', '_blank');
    });

    const body = panel.querySelector('[data-ref="gisPanelBody"]');
    panel.querySelector('[data-ref="gisPanelTabs"]')?.querySelectorAll('[data-gtab]').forEach(btn => {
        btn.addEventListener('click', () => {
            panel.querySelectorAll('[data-gtab]').forEach(b => b.classList.remove('gis-panel-tab--active'));
            btn.classList.add('gis-panel-tab--active');
            if (body) body.innerHTML = renderGisTabContent(btn.dataset.gtab, parcel, esc);
        });
    });
}
