/* global React, Icon, DirChip, Money, Dropdown, Card, Button */ // Schools.ArtemenkoCRM — Заявки с сайта (lead funnel top), redesigned from the real product const UNIT_LABEL = { зан: '/зан', мес: '/мес', курс: '/курс', разово: '' }; function channelMeta(ch) { const all = (window.CRM_DATA && window.CRM_DATA.CONTACT_TYPES) || []; return all.find(t => t.value === ch) || { label: 'Контакт', icon: 'at-sign', mono: false }; } // ---- CSV helpers ---- function leadsToCSV(leads) { const head = ['id', 'name', 'contacts', 'goal', 'subject', 'price', 'priceUnit', 'manager', 'date', 'converted']; const esc = (v) => { const s = v == null ? '' : String(v); return /[",\n;]/.test(s) ? '"' + s.replace(/"/g, '""') + '"' : s; }; const serialiseContacts = (l) => { const list = (l.contacts && l.contacts.length) ? l.contacts : (l.contact && l.contact !== '—' ? [{ type: l.channel, value: l.contact }] : []); return list.map(c => `${c.type}:${c.value}`).join(' | '); }; const lines = [head.join(',')]; leads.forEach(l => { lines.push([l.id, l.name, serialiseContacts(l), l.goal, ((l.subjects && l.subjects.length) ? l.subjects.join(' | ') : (l.subject || '')), l.price, l.priceUnit, l.manager, l.date, l.converted ? '1' : '0'].map(esc).join(',')); }); return lines.join('\n'); } function parseCSV(text) { // minimal CSV parser supporting quoted fields const rows = []; let row = []; let cur = ''; let q = false; for (let i = 0; i < text.length; i++) { const ch = text[i]; if (q) { if (ch === '"' && text[i + 1] === '"') { cur += '"'; i++; } else if (ch === '"') q = false; else cur += ch; } else { if (ch === '"') q = true; else if (ch === ',') { row.push(cur); cur = ''; } else if (ch === '\n' || ch === '\r') { if (cur !== '' || row.length) { row.push(cur); rows.push(row); row = []; cur = ''; } if (ch === '\r' && text[i + 1] === '\n') i++; } else cur += ch; } } if (cur !== '' || row.length) { row.push(cur); rows.push(row); } return rows; } function csvToLeads(text) { const rows = parseCSV(text).filter(r => r.length > 1); if (!rows.length) return []; const head = rows[0].map(h => h.trim().toLowerCase()); const idx = (k) => head.indexOf(k); return rows.slice(1).map((r, n) => { const contactsRaw = r[idx('contacts')] || ''; const contacts = contactsRaw.split('|').map(s => s.trim()).filter(Boolean).map(pair => { const k = pair.indexOf(':'); return k === -1 ? { type: 'phone', value: pair } : { type: pair.slice(0, k).trim(), value: pair.slice(k + 1).trim() }; }); const first = contacts[0] || { type: 'phone', value: '—' }; const priceRaw = r[idx('price')]; return { id: parseInt(r[idx('id')], 10) || (Date.now() % 100000) + n, name: r[idx('name')] || 'Без имени', contacts, channel: first.type, contact: first.value, goal: r[idx('goal')] || '—', subject: r[idx('subject')] || null, price: priceRaw ? parseInt(priceRaw, 10) : null, priceUnit: r[idx('priceunit')] || null, manager: r[idx('manager')] || null, date: r[idx('date')] || 'импорт', converted: ['1', 'true', 'да'].includes((r[idx('converted')] || '').trim().toLowerCase()), }; }); } function Leads({ onAddLead, onEditLead, onConvert, onDelete, onBulkDelete, onImport, onExport }) { const { LEADS, MANAGERS } = window.CRM_DATA; const [tab, setTab] = React.useState('open'); // open | converted const [qInput, setQInput] = React.useState(''); const [q, setQ] = React.useState(''); const [subject, setSubject] = React.useState(null); const [manager, setManager] = React.useState(null); const [range, setRange] = React.useState(null); // {start, end} ISO const [calOpen, setCalOpen] = React.useState(false); const [selected, setSelected] = React.useState([]); const fileRef = React.useRef(null); const calRef = React.useRef(null); const [, force] = React.useReducer(x => x + 1, 0); // «Дорогой» поиск: обновляем список с небольшой задержкой после ввода. React.useEffect(() => { const t = setTimeout(() => setQ(qInput), 280); return () => clearTimeout(t); }, [qInput]); React.useEffect(() => { if (!calOpen) return; const h = (e) => { if (calRef.current && !calRef.current.contains(e.target)) setCalOpen(false); }; document.addEventListener('mousedown', h); return () => document.removeEventListener('mousedown', h); }, [calOpen]); // Parse the mock Russian dates into a comparable yyyy-mm-dd (year 2026). const MON_ABBR = { 'янв': 0, 'фев': 1, 'мар': 2, 'апр': 3, 'мая': 4, 'май': 4, 'июн': 5, 'июл': 6, 'авг': 7, 'сен': 8, 'окт': 9, 'ноя': 10, 'дек': 11 }; const parseLeadDate = (s) => { if (!s) return null; const low = s.toLowerCase(); const iso = (y, m, d) => `${y}-${String(m + 1).padStart(2, '0')}-${String(d).padStart(2, '0')}`; if (low.includes('сегодня')) return iso(2026, 4, 31); if (low.includes('вчера')) return iso(2026, 4, 30); const m = low.match(/(\d{1,2})\s+([а-я]+)/); if (m && MON_ABBR[m[2].slice(0, 3)] != null) return iso(2026, MON_ABBR[m[2].slice(0, 3)], parseInt(m[1], 10)); return null; }; const managerOpts = [{ value: null, label: 'Все менеджеры' }, { value: '__none', label: 'Без менеджера' }] .concat(MANAGERS.map(m => ({ value: m, label: m }))); const subjectOpts = [{ value: null, label: 'Все предметы' }] .concat((window.CRM_DATA.DIRECTIONS).map(s => ({ value: s, label: s }))); const rows = LEADS.filter(l => { if (tab === 'open' ? l.converted : !l.converted) return false; if (q && !(`${l.name} ${l.contact} ${l.goal}`.toLowerCase().includes(q.toLowerCase()))) return false; if (subject && !((l.subjects && l.subjects.length ? l.subjects : (l.subject ? [l.subject] : [])).includes(subject))) return false; if (manager === '__none' && l.manager) return false; if (manager && manager !== '__none' && l.manager !== manager) return false; if (range) { const d = parseLeadDate(l.date); if (d && (d < range.start || d > range.end)) return false; } return true; }); const fmtRange = (r) => { const f = (s) => { const [y, m, d] = s.split('-'); const MN = ['янв','фев','мар','апр','мая','июн','июл','авг','сен','окт','ноя','дек']; return `${+d} ${MN[+m - 1]}`; }; return f(r.start) + ' – ' + f(r.end); }; // selection is scoped to the current tab; clear it when tab changes React.useEffect(() => { setSelected([]); }, [tab]); const visibleIds = rows.map(r => r.id); const allSelected = visibleIds.length > 0 && visibleIds.every(id => selected.includes(id)); const someSelected = selected.length > 0; const toggleOne = (id) => setSelected(s => s.includes(id) ? s.filter(x => x !== id) : [...s, id]); const toggleAll = () => setSelected(allSelected ? [] : visibleIds); const assignManager = (lead, v) => { lead.manager = v === '__none' ? null : v; force(); }; const handleExport = () => onExport(rows, tab); const handleFile = (e) => { const f = e.target.files && e.target.files[0]; if (f) onImport(f); e.target.value = ''; }; const th = { textAlign: 'left', fontSize: 11.5, fontWeight: 700, letterSpacing: '0.04em', textTransform: 'uppercase', color: 'var(--text-dim)', padding: '0 18px 13px', whiteSpace: 'nowrap' }; const td = { padding: '12px 18px', borderTop: '1px solid var(--border)', fontSize: 14, color: 'var(--text)', verticalAlign: 'middle' }; const dim = { color: 'var(--text-dim)' }; const cbCol = { width: 40, padding: '0 8px 13px 18px' }; const cbTd = { padding: '12px 8px 12px 18px', borderTop: '1px solid var(--border)', verticalAlign: 'middle' }; const Checkbox = ({ checked, onChange, indeterminate }) => ( { e.stopPropagation(); onChange(); }} onMouseEnter={e => { if (!(checked || indeterminate)) e.currentTarget.style.borderColor = 'var(--brand)'; e.currentTarget.style.boxShadow = '0 0 0 3px var(--brand-soft)'; }} onMouseLeave={e => { if (!(checked || indeterminate)) e.currentTarget.style.borderColor = 'var(--border-strong)'; e.currentTarget.style.boxShadow = 'none'; }} style={{ width: 18, height: 18, borderRadius: 4, cursor: 'pointer', flex: 'none', display: 'inline-flex', alignItems: 'center', justifyContent: 'center', border: '1.5px solid ' + (checked || indeterminate ? 'var(--brand)' : 'var(--border-strong)'), background: checked || indeterminate ? 'var(--brand)' : 'var(--bg-card)', color: '#fff', transition: 'background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease)', }}> {checked && } {!checked && indeterminate && } ); return (
{/* Tabs + toolbar */}
{[{ id: 'open', label: 'Новые' }, { id: 'converted', label: 'Конвертированные' }].map(t => ( ))}
{rows.length} заявок
{/* Filters */}
setQInput(e.target.value)} placeholder="Поиск по заявкам…" style={{ border: 'none', outline: 'none', background: 'transparent', flex: 1, fontFamily: 'var(--font-sans)', fontSize: 13.5, color: 'var(--text)' }} />
{calOpen && setCalOpen(false)} />}
{/* Bulk action bar */} {someSelected && (
Выбрано: {selected.length}
)} {/* Table */} {rows.length > 0 ? (
{rows.map((l, ri) => { const list = (l.contacts && l.contacts.length) ? l.contacts : (l.contact && l.contact !== '—' ? [{ type: l.channel, value: l.contact }] : []); const primaryC = list[0] || { type: l.channel || 'phone', value: '—' }; const cm = channelMeta(primaryC.type); const primary = primaryC.value; const extra = Math.max(0, list.length - 1); const checked = selected.includes(l.id); return ( { if (someSelected) toggleOne(l.id); else onEditLead(l); }}> ); })}
# Имя Контакт Заметка Предмет Цена Менеджер Дата Действия
e.stopPropagation()}> toggleOne(l.id)} /> {l.id} {l.name}
{primary} {extra > 0 && +{extra}}
{l.goal || '—'} {(() => { const subs = (l.subjects && l.subjects.length) ? l.subjects : (l.subject ? [l.subject] : []); return subs.length ?
{subs.map(s => {s})}
: {null}; })()}		 {l.price != null ? /зан : —} e.stopPropagation()}> assignManager(l, v)} searchable options={[{ value: '__none', label: '— назначить —' }].concat(MANAGERS.map(m => ({ value: m, label: m })))} width={168} /> {l.date} e.stopPropagation()}>
{l.converted ? Конвертирован : }
) : (
{tab === 'converted' ? 'Конвертированных заявок пока нет' : 'Новых заявок нет — всё разобрано'}
)}
); } Object.assign(window, { Leads, leadsToCSV, csvToLeads });