/* client-v2-app.jsx — новый кабинет клиента («Главная — комбо», холст «ЛК клиента — дизайн», DESIGN.md v1.3). Спека: docs/superpowers/specs/2026-10-23-client-lk-v2-design.md, раздел 3. Данные — только views ProjectStore: clientHome (главная), clientStages + clientGates (окно «Этапы»), clientDecisions (окно «Согласования»), projectEstimate + общий компонент сметы estimate-view.jsx (окно «Смета»), clientChat (окно «Чат»), clientMoney (окно «Оплаты»), clientMaterials (окно «Материалы»), clientMedia (окно «Фото и видео»), clientDocs (окно «Документы»); дизайн-проект — отдельная страница client-v2-design.html (client-v2-design.jsx). С 2026-10-26 — кабинет клиента по умолчанию (client-cabinet.js): старые страницы client-*.html открывают свой экран здесь. Профиль и права — старая client-profile.html (аватар в шапке после запуска). До запуска проекта (спека 2026-10-26-client-v2-prestart) главная, шаги и меню берутся из сделки (ClientDealViews) и рисуются в client-v2-prestart.jsx (window.CV.Pre) — в этом же кабинете, без ухода в старый. */ (function () { 'use strict'; const CC = window.ClientCabinet; // на демо-страницах переключателя нет const Lightbox = window.LKLightbox; // общий просмотр фото и видео — lk-lightbox.jsx /* доступ (ClientCabinet.resolve): кто смотрит, какая сделка и проект. Сотрудники — менеджер, руководитель, «ЛК от имени» (?superView=1&name=, Конструктор → Доступ), собственная ссылка руководителя — всегда только читают: баннер в шапке, без отметок активности; действия от имени клиента (решения, оплаты, сообщения, отметки «прочитано», загрузки) отключены: хранилища этой вкладки — только для чтения (ClientCabinet.readOnly), окна показывают причину на месте. Личная ссылка клиента — с действиями */ const ACCESS = CC && CC.resolve ? CC.resolve(window.location) : { why: null, hint: null, mode: 'demo', dealId: null, project: null, account: null, readOnly: false }; const SV = ACCESS.readOnly ? ((CC.superView && CC.superView(window.location)) || { name: '' }) : null; const RO_SPEC = { ProjectStore: { write: ['decideGate', 'decideReplacement', 'decideMaterial', 'decideMaterialsBatch', 'decideApproval', 'setObjectAccess', 'requestVisit', 'bookVisit', 'cancelVisit', 'addPunchItem', 'acceptPunchItem', 'returnPunchItem', 'deferPunchItem', 'openWarrantyCase', 'chatSend', 'chatEnsureClientThread', 'chatEnsureDesignThread', 'pay', 'confirmDeliverySlot', 'rescheduleDeliverySlot', 'setMarketingConsent'], silent: ['markClientSeen'] }, DealContracts: { write: ['clientAck'] }, DpPipeline: { write: ['approve', 'requestChanges', 'specTrack', 'addComment'] }, Files: { async: ['upload', 'uploadAll'] }, /* до запуска проекта: чат сделки, решения по смете, срок предложения, анкеты и бриф (окна — client-v2-prestart.jsx и далее) */ DealChat: { write: ['send', 'ensureDefaults', 'create'], silent: ['markRead'] }, ClientEstimate: { write: ['decide', 'approve', 'rework'] }, EstimateOffer: { write: ['request'] }, FormInstances: { write: ['saveFieldResponses', 'submitDpBrief'] }, ClientIntakeSync: { write: ['saveIntake'] }, }; if (ACCESS.readOnly && CC.readOnly) Object.keys(RO_SPEC).forEach((k) => { if (window[k] && !window[k].__readOnly) window[k] = CC.readOnly(window[k], RO_SPEC[k]); }); const P = window.ProjectStore; const A = window.AccessStore; // ссылка клиента (?t=, ?user=, ?project=, ?deal=, ?superView=) — без постраничных параметров старого кабинета (?tab=feed) const SEARCH = CC && CC.v2Search ? CC.v2Search(window.location.search) : window.location.search || ''; // кабинет и страница «Дизайн-проект» (спека волны 2, раздел 4) — пара страниц; у демо своя пара, чтобы не уйти на настоящий кабинет const DEMO = /-demo(\.html)?$/.test(window.location.pathname); const cabHref = (hash) => (DEMO ? 'client-v2-demo.html' : 'client-v2.html') + SEARCH + (hash ? '#' + hash : ''); const designHref = (tab) => (DEMO ? 'client-v2-design-demo.html' : 'client-v2-design.html') + SEARCH + (tab ? '#' + tab : ''); const rub = (n) => (Math.round(n) || 0).toLocaleString('ru-RU') + ' ₽'; const cap = (t) => (t ? t.charAt(0).toUpperCase() + t.slice(1) : t); const lc = (t) => (t ? t.charAt(0).toLowerCase() + t.slice(1) : t); const days = (n) => n + ' ' + plural(n, 'день', 'дня', 'дней'); const plural = (n, a, b, c) => { const m = Math.abs(n) % 100, k = m % 10; return m > 10 && m < 20 ? c : k > 1 && k < 5 ? b : k === 1 ? a : c; }; // «фронт работ» текущей фазы: доля принятых работ — до неё залита полоса, на краю точка const frontPct = (x) => Math.max(3, Math.min(100, Math.round((x.doneN || 0) / Math.max(1, x.allN || 0) * 100))); const TURN = { client: 'ваше решение', foreman: 'проверка прораба', designer: 'проверка дизайнера', manager: 'проверка менеджера', super: 'решение руководителя' }; const ICONS = { arrow: , pen: , ne: , down: , x: , left: , right: , chat: , clip: , check: , tool: , alert: , lock: , camera: , doc: , box: , bell: , calendar: , wallet: , play: , clock: , }; function Ic({ n, c = '#252528', s = 18 }) { return ; } function useProjectData() { const [, tick] = React.useState(0); React.useEffect(() => (P ? P.subscribe(() => tick((x) => x + 1)) : undefined), []); const p = P ? P.current('client') : null; // у сотрудника по ?deal= до запуска чужой «первый активный» проект не подставляем return ACCESS.dealId && p && p.dealId && p.dealId !== ACCESS.dealId ? null : p; } function useHashModal() { const read = () => (window.location.hash || '').replace('#', ''); const [m, setM] = React.useState(read()); React.useEffect(() => { const on = () => setM(read()); window.addEventListener('hashchange', on); return () => window.removeEventListener('hashchange', on); }, []); const open = (id) => { window.location.hash = id; }; const close = () => { history.replaceState(null, '', window.location.pathname + window.location.search); setM(''); }; return [m, open, close]; } /* центр уведомлений (спека волны 2, раздел 5, п. 1): колокольчик со счётчиком нового с последнего входа. Открыл список — всё отмечено прочитанным (отметка в проекте), а новое подсвечено, пока список открыт. Клик ведёт в нужное окно */ function NotifBell({ project, open }) { const [on, setOn] = React.useState(false); const [prev, setPrev] = React.useState(''); const ref = React.useRef(null); React.useEffect(() => { if (!on) return undefined; const out = (e) => { if (ref.current && !ref.current.contains(e.target)) setOn(false); }; const esc = (e) => { if (e.key === 'Escape') setOn(false); }; document.addEventListener('mousedown', out); document.addEventListener('keydown', esc); return () => { document.removeEventListener('mousedown', out); document.removeEventListener('keydown', esc); }; }, [on]); const n = P.views.clientNotifications(project); if (!n) return null; const toggle = () => { if (!on) { setPrev(n.seenAt || ''); if (n.unread) P.markClientSeen(project.id); } setOn(!on); }; const go = (x) => { setOn(false); if (x.target === 'design') window.location.href = designHref(); else open(x.target); }; return (
{on && (
Уведомления{n.items.some((x) => x.ts > prev) && Новое}
{n.items.length ? n.items.map((x) => ( )) :
Пока ничего нового.
}
)}
); } /* «Новое на объекте» (доработки главной, раздел 4): по дням, внутри дня — горизонтальная лента: вертикальные видео 9:16 и принятые работы с фото. Видео открывается в полноэкранном вертикальном плеере, как Reels */ const durL = (s) => (s > 0 ? Math.floor(s / 60) + ':' + String(Math.round(s % 60)).padStart(2, '0') : ''); function VideoTile({ v, onOpen }) { const [dur, setDur] = React.useState(0); return ( ); } function FeedBlock({ f }) { const [at, setAt] = React.useState(-1); if (!f) return null; const videos = f.days.flatMap((d) => d.items.filter((x) => x.kind === 'video')); return (

Новое на объекте

все фото по этапам
Фото и видео появляются после приёмки работы прорабом
{f.days.length === 0 &&
Принятых работ с фото пока нет.
} {f.days.length > 0 &&
{f.days.map((d) => (

{d.label}

{d.items.map((x, i) => x.kind === 'video' ? setAt(videos.indexOf(x))} /> :
{x.photos} фото
{x.title}
{x.stage} · принято
)}
))}
} {at >= 0 && videos[at] && }
); } function ReelsPlayer({ list, at, setAt }) { const v = list[at]; const go = (d) => setAt((i) => Math.max(0, Math.min(list.length - 1, i + d))); const close = () => setAt(-1); const touch = React.useRef(null); const root = React.useRef(null), xBtn = React.useRef(null); // модальный плеер: фокус на «Закрыть», Tab ходит по кругу внутри, фон не прокручивается; при закрытии фокус — туда, откуда открыли. // Стрелки на самом видео — его перемотка и громкость, переключение видео — стрелками вне видео, кнопками и свайпом React.useEffect(() => { const from = document.activeElement, ov = document.body.style.overflow; document.body.style.overflow = 'hidden'; if (xBtn.current) xBtn.current.focus(); const k = (e) => { if (e.key === 'Escape') { close(); return; } if (e.key === 'Tab') { const f = Array.from(root.current ? root.current.querySelectorAll('button, video') : []); if (!f.length) return; const i = f.indexOf(document.activeElement), n = e.shiftKey ? (i <= 0 ? f.length - 1 : i - 1) : (i === f.length - 1 ? 0 : i + 1); e.preventDefault(); f[n].focus(); return; } if (e.target && e.target.tagName === 'VIDEO') return; if (e.key === 'ArrowRight' || e.key === 'ArrowDown') { e.preventDefault(); go(1); } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') { e.preventDefault(); go(-1); } }; document.addEventListener('keydown', k); return () => { document.removeEventListener('keydown', k); document.body.style.overflow = ov; if (from && from.focus) from.focus(); }; }, []); const onTouchStart = (e) => { const t = e.touches[0]; touch.current = { x: t.clientX, y: t.clientY }; }; const onTouchEnd = (e) => { if (!touch.current) return; const t = e.changedTouches[0]; const dx = t.clientX - touch.current.x, dy = t.clientY - touch.current.y; touch.current = null; const m = Math.abs(dx) > Math.abs(dy) ? dx : dy; if (Math.abs(m) > 50) go(m < 0 ? 1 : -1); }; return (
e.stopPropagation()}>
{at > 0 && } {at < list.length - 1 && }
); } /* команда объекта (доработки главной, раздел 5): менеджер и прораб — крупно рядом, дизайнер и мастера своей бригады — ниже. Фото обязательно; до загрузки — инициалы. «Написать» — чат, где есть эта роль, иначе общий; новый чат не создаём */ const goChat = (open, m) => open(m && m.chatId ? 'chat=' + m.chatId : 'chat'); const yearsL = (n) => n == null ? '' : n === 0 ? 'меньше года в профессии' : 'опыт ' + n + ' ' + plural(n, 'год', 'года', 'лет'); function Face({ m, size }) { return m.photo ? : ; } function TeamBlock({ t, open }) { if (!t) return null; const big = [t.manager, t.foreman].filter(Boolean); const small = [t.designer].concat(t.executors).filter(Boolean); if (!big.length && !small.length) return null; return (

Команда

Люди, которые ведут ваш ремонт
{big.length > 0 &&
{big.map((m) => (
{m.name}
{m.role}{m.years != null ? ' · ' + yearsL(m.years) : ''}
))}
} {small.length > 0 &&
{small.map((m) => (
{m.name}
{m.role}{m.years != null ? ' · ' + yearsL(m.years) : ''}
{m.onSite ?
сейчас на объекте
: null}
))}
}
); } /* визитка проектного менеджера в шапке (доработки главной, раздел 6): нет менеджера — нет визитки */ function MgrCard({ project, open }) { const t = project ? P.views.clientTeam(project) : null; const m = t && t.manager; if (!m) return null; return (
{m.name}Проектный менеджер
); } /* меню (доработки главной, раздел 10): пять ссылок и «Ещё»; все пункты — ссылки на #раздел, у текущего aria-current. «Ещё» закрывается по Esc и клику вне */ // KSH-469: меню короче — календарь, визит, фото и разделы ниже живут на главной виджетами; в «Ещё» остаются, чтобы окно можно было открыть и отсюда const TOP = [['stages', 'Реализация'], ['estimate', 'Смета'], ['payments', 'Оплаты']]; const MORE = [['media', 'Фото и видео'], ['materials', 'Материалы'], ['deliveries', 'Доставки'], ['design', 'Дизайн'], ['report', 'Отчёт за неделю'], ['tools.html?role=client', 'Инструменты']]; // виджеты внизу главной убраны (вариант A шапки, 2026-10-24): приёмка — пока идёт и акт не подписан, гарантия — после подписания. // Когда нужен ответ клиента, эти окна по-прежнему открываются из «Согласований» и «Сейчас важно» const moreFor = (project) => { const pl = project ? P.views.punchList(project) : null; if (!pl) return MORE; return MORE.concat(pl.active && !pl.signed ? [['handover', 'Приёмка объекта']] : [], pl.signed ? [['warranty', 'Гарантия']] : []); }; // menu — меню до запуска; project до запуска — «субъект» сделки (ClientDealViews.subject, prestart): визитка менеджера есть, колокольчика нет function Header({ name, open, design, active, project, menu }) { const ini = (name || 'Клиент').split(' ').map((w) => w[0]).join('').slice(0, 2).toUpperCase(); const [modal] = useHashModal(); // menu заменяет TOP и «Ещё» const top = menu || TOP; const more_ = menu ? [] : moreFor(project); // нижняя панель на телефоне (KSH-550): «Главная» и три первых раздела, остальные разделы меню — в «Ещё» (только на телефоне) const spill = top.slice(3); const cur = active === 'design' ? 'design' : top.concat(more_).some(([id]) => id === modal) ? modal : ''; // на странице дизайн-проекта разделы кабинета — переход на главную с окном const go = (id) => (active ? cabHref(id) : '#' + id); const [more, setMore] = React.useState(false); const moreRef = React.useRef(null); React.useEffect(() => { if (!more) return undefined; const out = (e) => { if (moreRef.current && !moreRef.current.contains(e.target)) setMore(false); }; const esc = (e) => { if (e.key === 'Escape') { setMore(false); const b = moreRef.current && moreRef.current.querySelector('button'); if (b) b.focus(); } }; document.addEventListener('mousedown', out); document.addEventListener('keydown', esc); return () => { document.removeEventListener('mousedown', out); document.removeEventListener('keydown', esc); }; }, [more]); return ( {SV &&
Просмотр от имени клиента{SV.name ? · {SV.name} : null} · только чтение: действия отключены
}
{ const m = document.getElementById('main'); if (m) { e.preventDefault(); m.focus(); m.scrollIntoView(); } }}>Перейти к содержанию ОБИТЕЛЬ
{window.__CLIENT_DEMO_AUTOBUILD && Демо · не сохраняется}{project && !project.prestart && }{DEMO || menu ? {ini} : {ini}}
); } function greeting() { const h = new Date().getHours(); return h < 5 ? 'Доброй ночи' : h < 12 ? 'Доброе утро' : h < 18 ? 'Добрый день' : 'Добрый вечер'; } const todayLine = () => { const s = new Date().toLocaleDateString('ru-RU', { weekday: 'long', day: 'numeric', month: 'long' }); return s.charAt(0).toUpperCase() + s.slice(1); }; // виджет «Согласования» на главной: до 5 решений (со сроком — первыми), «ещё N», всё — в окне #approvals const KIND_IC = { photo: 'camera', act: 'doc', change: 'doc', replacement: 'box', material: 'box', delivery: 'box', access: 'lock', visit: 'calendar', punch: 'tool', order: 'box', invoice: 'wallet', doc: 'doc', design: 'pen' }; // куда ведёт строка согласования (спека 2026-10-24-client-lk-v2-home-refine, раздел 9): окно по #hash или страница дизайн-проекта const goApr = (r, open) => { if (r.href === 'design-schedule') window.location.href = designHref('schedule'); else if (r.href === 'design') window.location.href = designHref(); else open((r.href || '#approvals').replace('#', '')); }; // срок строки: просроченный счёт — красным; решение клиента с прошедшим сроком — спокойно «Решите сегодня» (KSH-549: // красный только у денег); осталось ≤ 3 дней — жёлтым, иначе дата const overPay = (r) => r.overdueDays > 0 && r.kind === 'invoice'; function DueTag({ r }) { if (overPay(r)) return Просроченона {r.overdueDays} {plural(r.overdueDays, 'день', 'дня', 'дней')}; if (r.overdueDays > 0) return Решитесегодня; if (r.soonDays != null) return {r.kind === 'invoice' ? 'Оплатить до' : 'Решить до'}{r.soonDays === 0 ? 'сегодня' : 'через ' + r.soonDays + ' ' + plural(r.soonDays, 'день', 'дня', 'дней')}; return r.decideBy ? {r.kind === 'invoice' ? 'Оплатить до' : 'Решить до'}{r.decideBy} : null; } // короткая подпись строки для экранного диктора: что, вид и срок — без иконки и дублей const aprLabel = (r) => r.title + ', ' + r.kindL + (r.sum ? ', ' + rub(r.sum) : '') + (overPay(r) ? ', просрочено на ' + r.overdueDays + ' ' + plural(r.overdueDays, 'день', 'дня', 'дней') : r.overdueDays > 0 ? ', решите сегодня' : r.soonDays === 0 ? ', срок сегодня' : ''); /* KSH-549: каждое решение на главной — в одном месте. Что уже стоит карточкой «Сейчас важно» (skip), здесь не повторяем; показываем до трёх самых срочных, остальное — ссылкой «Ещё N» в окно «Согласования» */ const aprKey = (r) => r.kind + ':' + (r.refId || r.title); const APR_TOP = 3; function AprWidget({ a, open, skip }) { const seen = new Set((skip || []).map(aprKey)); const rest = (a.all || a.rows).filter((r) => !seen.has(aprKey(r))); const top = rest.slice(0, APR_TOP); const more = rest.length - top.length; return (
open('approvals')} /> {a.n === 0 ?
От вас сейчас ничего не нужно.
: !top.length ?
Всё, что ждёт вас, — в карточках выше.
:
{top.map((r, i) => ( ))} {more > 0 && }
}
); } /* карточка блока главной по референсу Figma 803:2172 (KSH-469): номер-счётчик в рамке, заголовок, тёмный круг ↗ — откроется окно; внизу — чёрная кнопка с ↗ (переход в окно или главное действие блока) */ // text — подпись у стрелки («Все согласования», «Весь календарь»); без неё — только стрелка function WHead({ id, title, n, label, onOpen, text }) { return (
{n > 0 ? : null}

{title}{n > 0 ? , {n} : null}

{text ? : }
); } /* блок «Чаты» под «Согласованиями» (доработки главной, раздел 3): до 3 свежих чатов, клик — окно чата сразу на этом чате. Клиент чатов не создаёт: пусто — подсказка и общий чат проекта */ function ChatsCard({ chats, open }) { return (
x + (c.isNew ? c.unread || 1 : 0), 0)} label="Открыть все чаты" onOpen={() => open('chat')} /> {chats.length === 0 ?
Вопросы по ремонту — менеджеру, он ответит здесь.
:
{chats.map((c) => ( ))}
}
); } // общий календарь проекта (спека волны 2, раздел 2): вкладки-фильтры, полоса двух недель на главной, сетка месяца в окне #calendar const CAL_KINDS = [['all', 'Все'], ['work', 'Работы'], ['payment', 'Оплаты'], ['delivery', 'Доставки'], ['decide', 'Согласования']]; // доработки главной, раздел 2: без иконок и цветных меток — вид события тонкой чертой слева и серой подписью, красное — только просрочка const CAL_KL = { work: 'работа', payment: 'оплата', delivery: 'доставка', decide: 'решение' }; // просрочка красным — только у оплат; решение с прошедшим сроком — «Решить», как обычное (KSH-549) const calOver = (e) => e.status === 'overdue' && e.kind === 'payment'; const calStatus = (e) => calOver(e) ? ['Просрочено', 'pill-n cv-over'] : e.status === 'overdue' ? ['Решить', 'pill-n'] : e.status === 'done' ? [e.kind === 'payment' ? 'Оплачено' : e.kind === 'delivery' ? 'Привезли' : 'Готово', 'pill-g'] : e.status === 'wait' ? ['На проверке', 'pill-g'] : e.status === 'due' ? [e.kind === 'payment' ? 'К оплате' : 'Решить', 'pill-n'] : ['План', 'pill-d']; const isoAdd = (d, n) => { const x = new Date(d + 'T00:00:00Z'); x.setUTCDate(x.getUTCDate() + n); return x.toISOString().slice(0, 10); }; const dayLabel = (d, t0) => { if (d === t0) return 'Сегодня'; if (d === isoAdd(t0, 1)) return 'Завтра'; return cap(new Date(d + 'T00:00:00Z').toLocaleDateString('ru-RU', { weekday: 'short', day: 'numeric', month: 'long', timeZone: 'UTC' })); }; const goHref = (href) => { window.location.hash = href.replace('#', ''); }; function CalTabs({ tab, setTab, counts }) { return (
{CAL_KINDS.map(([k, l]) => ( ))}
); } function CalRow({ e }) { const [l, cls] = calStatus(e); return ( ); } function CalAgenda({ list, t0, limit }) { const shown = limit ? list.slice(0, limit) : list; const groups = []; // прошедшие решения клиента — в группе «Сегодня»: их ждут сейчас, без красного заголовка «Просрочено» (KSH-549) shown.forEach((e) => { const g = e.date < t0 && calOver(e) ? 'over' : e.date < t0 && e.status === 'overdue' ? t0 : e.date; const last = groups[groups.length - 1]; if (last && last.key === g) last.items.push(e); else groups.push({ key: g, items: [e] }); }); return groups.map((g) => (
{g.key === 'over' ? 'Просрочено' : dayLabel(g.key, t0)}
{g.items.map((e) => )}
)); } // главная: «Календарь проекта» вместо «Ближайших двух недель» — по умолчанию все процессы, вкладки фильтруют function CalendarBlock({ c, open }) { const [tab, setTab] = React.useState('all'); const [day, setDay] = React.useState(null); const fit = (e) => tab === 'all' || e.kind === tab; const list = day ? c.events.filter((e) => e.date === day && fit(e)) : c.agenda.filter(fit); const noun = { all: 'событий', work: 'работ', payment: 'оплат', delivery: 'доставок', decide: 'согласований' }[tab]; return (
open('calendar')} /> { setTab(k); }} counts={c.counts} />
{['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'].map((d) => {d})} {c.days.map((d) => { const evs = c.events.filter((e) => e.date === d && fit(e)); const over = evs.some(calOver); return ( ); })}
{day &&
{dayLabel(day, c.today)}
} {/* повестка — со своей прокруткой: высота блока равна соседней колонке (KSH-469) */}
{list.length ? :
{day ? 'В этот день ничего не запланировано.' : 'В ближайшие две недели ' + noun + ' нет.'}
}
); } // окно #calendar: месяц с понедельника, те же вкладки, события выбранного дня справа function CalendarModal({ project, onClose }) { React.useEffect(() => { const k = (e) => e.key === 'Escape' && onClose(); document.addEventListener('keydown', k); return () => document.removeEventListener('keydown', k); }, []); const ev = P.views.projectCalendar(project, 'client'); const t0 = new Date().toISOString().slice(0, 10); const [tab, setTab] = React.useState('all'); const [sel, setSel] = React.useState(null); // по умолчанию справа — все события (Роман, 29.10); клик по дню — только этот день const [ym, setYm] = React.useState(t0.slice(0, 7)); const fit = (e) => tab === 'all' || e.kind === tab; const first = ym + '-01'; const dow = (new Date(first + 'T00:00:00Z').getUTCDay() + 6) % 7; const start = isoAdd(first, -dow); const nextM = isoAdd(first, 32).slice(0, 7) + '-01'; const weeks = Math.ceil((dow + (new Date(nextM + 'T00:00:00Z') - new Date(first + 'T00:00:00Z')) / 86400000) / 7); const cells = Array.from({ length: weeks * 7 }, (_, i) => isoAdd(start, i)); const shift = (n) => setYm(isoAdd(first, n > 0 ? 32 : -1).slice(0, 7)); const title = cap(new Date(first + 'T00:00:00Z').toLocaleDateString('ru-RU', { month: 'long', year: 'numeric', timeZone: 'UTC' })); const counts = { all: ev.length }; CAL_KINDS.slice(1).forEach(([k]) => { counts[k] = ev.filter((e) => e.kind === k).length; }); const dayList = ev.filter((e) => e.date === sel && fit(e)); // все события: просроченные сверху, потом от сегодня вперёд, прошедшие — в конце, тише const allList = ev.filter(fit).slice().sort((a, b) => ((a.status === 'overdue' ? 0 : a.date >= t0 ? 1 : 2) - (b.status === 'overdue' ? 0 : b.date >= t0 ? 1 : 2)) || (a.date >= t0 ? a.date.localeCompare(b.date) : b.date.localeCompare(a.date))); const overdue = ev.filter((e) => e.status === 'overdue' && fit(e)); return (
Работы, оплаты, доставки и сроки решений — общий график для вас и команды

Календарь проекта

{title} {ym !== t0.slice(0, 7) && }
{['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'].map((d) => {d})} {cells.map((d) => { const list = ev.filter((e) => e.date === d && fit(e)); const over = list.some((e) => e.status === 'overdue'); return ( ); })}
); } /* полоса хода работ (вариант A шапки, 2026-10-24): кто сейчас работает, путь фаз и четыре факта — одним блоком вместо лида, пути фаз и плиток. Движение: при загрузке фазы заполняются слева направо, текущая — штриховка «идут работы», у живой строки пульс; при «уменьшить движение» всё стоит */ const agoR = (n) => (n === 0 ? 'сегодня' : n === 1 ? 'вчера' : n + ' ' + plural(n, 'день', 'дня', 'дней') + ' назад'); /* честные сдвиги (KSH-529): задержка из-за клиента — каждой строкой и сразу; перенос командой за запас — одной строкой по первой сдвинутой фазе, с причиной прораба (следующие фазы сдвигаются следом — их новые даты уже в пути фаз) */ function ShiftNotes({ path }) { const open = path.filter((x) => x.state !== 'done'); const waits = open.filter((x) => x.wait); const team = open.find((x) => x.shiftDays > 0 && x.reason && !x.wait); if (!waits.length && !team) return null; return (
{waits.map((x) => {x.wait.text}{x.wait.kind === 'payment' ? 'Оплатить' : 'Выбрать'} )} {team &&
Сдача фазы «{team.name}» переносится на {team.shownEndR}, было {team.endR}{team.reason}
}
); } function ProgressBand({ h, path, live }) { const paidN = path.filter((x) => x.paid === 'done').length, payN = path.filter((x) => x.paid).length; const now = live.now, cur = path.find((x) => x.state === 'current'), lastP = path[path.length - 1]; const media = h.weekPhotos + ' фото' + (h.weekVideos ? ', ' + h.weekVideos + ' видео' : ''); return (
{now ?