/* ADMIN PANEL — login-gated. All data via /api/* endpoints. */ const SWATCH_COLORS = ['#4db8ff', '#00e5ff', '#b388ff', '#46f3a8', '#ffa14d', '#ff7a8d']; const SIZE_OPTIONS = [ { v: 'sz-a', l: 'XL · 7×2' }, { v: 'sz-b', l: 'L · 5×2' }, { v: 'sz-c', l: 'M · 4×2' }, { v: 'sz-d', l: 'M · 4×2 alt' }, { v: 'sz-e', l: 'M · 4×2 alt' }, { v: 'sz-f', l: 'L · 6×2' }, { v: 'sz-g', l: 'L · 6×2 alt' }, ]; const ADMIN_CATEGORIES = ['Платформы', 'Приложения', 'Веб', 'Боты', 'AI', 'Медиа', 'Продукты']; function TelegramPanel({ tg, onAdd, onRemove, onTest }) { const [newChat, setNewChat] = React.useState(''); const submitAdd = async (e) => { e.preventDefault(); const v = newChat.trim(); if (!v) return; const ok = await onAdd(v); if (ok) setNewChat(''); }; return (
УВЕДОМЛЕНИЯ TELEGRAM
{tg.configured ? `Подключено · ${tg.chats.length} чат${tg.chats.length === 1 ? '' : tg.chats.length < 5 ? 'а' : 'ов'}` : 'Не настроено'}
{tg.configured && ( )}
Токен задаётся CLI-скриптом — через браузер его менять небезопасно.
СПИСОК ЧАТОВ · {tg.chats.length}
{tg.chats.length === 0 ? (
Чатов нет. Добавьте хотя бы один chat ID ниже — туда будут приходить заявки.
) : (
{tg.chats.map(id => (
{id} {id.startsWith('-') ? 'группа' : 'личный'}
))}
)}
setNewChat(e.target.value)} placeholder="Новый chat ID — число, отрицательное для групп" inputMode="numeric" />
{!tg.hasToken && (
⚠ Сначала задайте токен бота в терминале:
node server/set-telegram.js <token> <chatId>
)}
КАК ПОЛУЧИТЬ CHAT ID
); } function CaseGallery({ caseId, images, onChanged, onError }) { const fileRef = React.useRef(null); const [uploading, setUploading] = React.useState(false); const [dropFileOver, setDropFileOver] = React.useState(false); const [draggingId, setDraggingId] = React.useState(null); const [overId, setOverId] = React.useState(null); const sendFiles = async (fileList) => { if (!fileList || !fileList.length) return; setUploading(true); try { const fd = new FormData(); [...fileList].forEach(f => fd.append('files', f)); const r = await fetch('/api/cases/' + encodeURIComponent(caseId) + '/images', { method: 'POST', credentials: 'same-origin', body: fd, }); const j = await r.json().catch(() => ({})); if (!r.ok || !j.ok) { onError(j.error || 'Ошибка загрузки'); return; } onChanged(j.images); } catch (_) { onError('Сервер недоступен'); } finally { setUploading(false); } }; const removeImage = async (id) => { try { const r = await fetch(`/api/cases/${encodeURIComponent(caseId)}/images/${id}`, { method: 'DELETE', credentials: 'same-origin', }); const j = await r.json().catch(() => ({})); if (!r.ok) { onError(j.error || 'Ошибка'); return; } onChanged(j.images); } catch (_) { onError('Сервер недоступен'); } }; const reorderTo = async (sourceId, targetId) => { if (sourceId == null || targetId == null || sourceId === targetId) return; const srcIdx = images.findIndex(i => i.id === sourceId); const tgtIdx = images.findIndex(i => i.id === targetId); if (srcIdx === -1 || tgtIdx === -1) return; const next = [...images]; const [moved] = next.splice(srcIdx, 1); next.splice(tgtIdx, 0, moved); onChanged(next); // optimistic try { const r = await fetch(`/api/cases/${encodeURIComponent(caseId)}/images/reorder`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({ ids: next.map(i => i.id) }), }); const j = await r.json().catch(() => ({})); if (!r.ok) { onError(j.error || 'Ошибка'); } else if (j.images) onChanged(j.images); } catch (_) { onError('Сервер недоступен'); } }; const onFileDrop = (e) => { e.preventDefault(); setDropFileOver(false); sendFiles(e.dataTransfer.files); }; return (
{images.length > 0 && (
⇅ перетащите миниатюры для смены порядка · первое фото становится обложкой
{images.map((img, i) => { const isDragging = draggingId === img.id; const isOver = overId === img.id && draggingId !== img.id; return (
{ e.dataTransfer.effectAllowed = 'move'; e.dataTransfer.setData('text/plain', String(img.id)); setDraggingId(img.id); }} onDragEnd={() => { setDraggingId(null); setOverId(null); }} onDragOver={(e) => { if (draggingId == null || draggingId === img.id) return; e.preventDefault(); e.dataTransfer.dropEffect = 'move'; if (overId !== img.id) setOverId(img.id); }} onDragLeave={(e) => { if (!e.currentTarget.contains(e.relatedTarget) && overId === img.id) setOverId(null); }} onDrop={(e) => { e.preventDefault(); e.stopPropagation(); const src = draggingId; setOverId(null); setDraggingId(null); reorderTo(src, img.id); }} style={{ position: 'relative', borderRadius: 12, overflow: 'hidden', border: '1px solid var(--glass-border)', aspectRatio: '4 / 3', background: '#0a0e18', opacity: isDragging ? 0.4 : 1, outline: isOver ? '2px solid var(--neon-2)' : 'none', outlineOffset: -2, cursor: 'grab', transition: 'opacity .15s, outline-color .15s, transform .15s', transform: isOver ? 'scale(1.03)' : 'scale(1)', }} >
{ if (draggingId == null) e.currentTarget.style.opacity = 1; }} onMouseLeave={e => e.currentTarget.style.opacity = 0}>
{i === 0 && (
обложка
)}
); })}
)}
{ // Only highlight the file-dropzone when an actual file is being dragged // (not when we're reordering thumbnails inside the gallery). if (draggingId != null) return; e.preventDefault(); setDropFileOver(true); }} onDragLeave={() => setDropFileOver(false)} onDrop={(e) => { if (draggingId != null) return; onFileDrop(e); }} onClick={() => fileRef.current && fileRef.current.click()} style={{ padding: '20px 14px', borderRadius: 12, textAlign: 'center', border: `1px dashed ${dropFileOver ? 'var(--neon)' : 'var(--line-strong)'}`, background: dropFileOver ? 'rgba(77,184,255,.08)' : 'rgba(8,12,22,.5)', color: 'var(--ink-1)', fontSize: 13, cursor: 'pointer', transition: 'border-color .2s, background .2s', }} > {uploading ? 'Загрузка…' : ( Перетащите файлы сюда или выберите
jpg / png / webp / gif · до 8 МБ · до 10 файлов за раз
)}
{ sendFiles(e.target.files); e.target.value = ''; }} />
); } function emptyCase() { return { id: 'c' + Date.now(), tag: 'NEW', title: 'Новый кейс', summary: 'Краткое описание задачи и решения.', year: new Date().getFullYear(), scope: 'Web', color: '#4db8ff', category: 'Продукты', size: 'sz-c', metrics: [], }; } /* --- LOGIN FORM --- */ function AdminLogin({ onSuccess, onClose }) { const [username, setUsername] = React.useState(''); const [password, setPassword] = React.useState(''); const [error, setError] = React.useState(''); const [busy, setBusy] = React.useState(false); const [retryAfter, setRetryAfter] = React.useState(0); React.useEffect(() => { if (!retryAfter) return; const id = setInterval(() => setRetryAfter(s => s > 1 ? s - 1 : 0), 1000); return () => clearInterval(id); }, [retryAfter]); const submit = async (ev) => { ev.preventDefault(); if (busy || retryAfter > 0) return; setBusy(true); setError(''); try { const r = await fetch('/api/auth/login', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({ username, password }), }); const j = await r.json().catch(() => ({})); if (r.ok) { onSuccess(); return; } if (r.status === 429) { setRetryAfter(j.retryAfter || 300); setError(j.error || 'Слишком много попыток'); } else { const remaining = typeof j.remaining === 'number' ? ` (осталось попыток: ${j.remaining})` : ''; setError((j.error || 'Ошибка авторизации') + remaining); } } catch (_) { setError('Сервер недоступен'); } finally { setBusy(false); } }; return (
{ if (e.target.classList.contains('admin-overlay')) onClose(); }}>
Вход в админку D-one studio
setUsername(e.target.value)} placeholder="admin" />
setPassword(e.target.value)} placeholder="••••••••" />
{error && (
{error}{retryAfter > 0 && ` · повтор через ${retryAfter}с`}
)}
); } /* --- ADMIN PANEL --- */ function Admin({ onClose, onLoggedOut }) { const [cases, setCases] = React.useState([]); const [requests, setRequests] = React.useState([]); const [team, setTeam] = React.useState([]); const [posts, setPosts] = React.useState([]); const [tab, setTab] = React.useState('cases'); const [activeId, setActiveId] = React.useState(null); const [activeMemberId, setActiveMemberId] = React.useState(null); const [activePostId, setActivePostId] = React.useState(null); const [toast, setToast] = React.useState(null); const [loading, setLoading] = React.useState(true); const [tg, setTg] = React.useState({ configured: null, hasToken: false, tokenMasked: null, chats: [], testing: false, }); const debounceRef = React.useRef({}); const memberDebounceRef = React.useRef({}); const postDebounceRef = React.useRef({}); const active = cases.find(c => c.id === activeId); const activeMember = team.find(m => m.id === activeMemberId); const activePost = posts.find(p => p.id === activePostId); const refreshTelegram = React.useCallback(() => { fetch('/api/telegram/status', { credentials: 'same-origin' }) .then(r => r.ok ? r.json() : Promise.reject()) .then(j => setTg(t => ({ ...t, configured: !!j.configured, hasToken: !!j.hasToken, tokenMasked: j.tokenMasked || null, chats: Array.isArray(j.chats) ? j.chats : [], }))) .catch(() => setTg(t => ({ ...t, configured: false }))); }, []); const addChat = async (chatId) => { if (!/^-?\d+$/.test(String(chatId || '').trim())) { showToast('Невалидный chatId'); return false; } try { const r = await fetch('/api/telegram/chats', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({ chatId: String(chatId).trim() }), }); const j = await r.json().catch(() => ({})); if (!r.ok || !j.ok) { showToast(j.error || 'Ошибка'); return false; } setTg(t => ({ ...t, chats: j.chats, configured: t.hasToken && j.chats.length > 0 })); showToast('Чат добавлен'); return true; } catch (_) { showToast('Сервер недоступен'); return false; } }; const removeChat = async (chatId) => { try { const r = await fetch('/api/telegram/chats/' + encodeURIComponent(chatId), { method: 'DELETE', credentials: 'same-origin', }); const j = await r.json().catch(() => ({})); if (!r.ok) { showToast(j.error || 'Ошибка'); return; } setTg(t => ({ ...t, chats: j.chats, configured: t.hasToken && j.chats.length > 0 })); showToast('Удалено'); } catch (_) { showToast('Сервер недоступен'); } }; const testTelegram = async () => { if (tg.testing) return; setTg(t => ({ ...t, testing: true })); try { const r = await fetch('/api/telegram/test', { method: 'POST', credentials: 'same-origin', }); const j = await r.json().catch(() => ({})); if (r.ok && j.ok) { const failed = (j.results || []).filter(x => !x.ok); if (failed.length) showToast(`Отправлено частично: ${failed.length} ошибок`); else showToast('Тест отправлен ✓'); } else { showToast(j.error || 'Не удалось отправить'); } } catch (_) { showToast('Сервер недоступен'); } finally { setTg(t => ({ ...t, testing: false })); } }; const showToast = (msg) => { setToast(msg); setTimeout(() => setToast(null), 2200); }; const fetchAll = React.useCallback(async () => { setLoading(true); try { const [cs, rs, tm, bp] = await Promise.all([ window.apiListCases(), fetch('/api/requests', { credentials: 'same-origin' }).then(r => { if (r.status === 401) throw new Error('unauth'); return r.json(); }), fetch('/api/team', { credentials: 'same-origin' }).then(r => r.ok ? r.json() : { team: [] }), fetch('/api/blog/all', { credentials: 'same-origin' }).then(r => { if (r.status === 401) throw new Error('unauth'); return r.ok ? r.json() : { posts: [] }; }), ]); setCases(cs); setRequests(rs.requests || []); setTeam(tm.team || []); setPosts(bp.posts || []); setActiveId(prev => prev || (cs[0] && cs[0].id) || null); setActiveMemberId(prev => prev || ((tm.team || [])[0] && (tm.team || [])[0].id) || null); setActivePostId(prev => prev || ((bp.posts || [])[0] && (bp.posts || [])[0].id) || null); } catch (e) { if (e && e.message === 'unauth') { onLoggedOut(); return; } showToast('Ошибка загрузки'); } finally { setLoading(false); } }, [onLoggedOut]); React.useEffect(() => { fetchAll(); }, [fetchAll]); React.useEffect(() => { refreshTelegram(); }, [refreshTelegram]); const update = (k, v) => { if (!active) return; const next = cases.map(c => c.id === activeId ? { ...c, [k]: v } : c); setCases(next); // debounce per-case save const key = activeId; if (debounceRef.current[key]) clearTimeout(debounceRef.current[key]); debounceRef.current[key] = setTimeout(async () => { try { const fresh = next.find(c => c.id === key); await window.apiUpsertCase(fresh); window.notifyCasesUpdated(); } catch (_) { showToast('Не удалось сохранить'); } }, 500); }; const addCase = async () => { const nu = emptyCase(); try { await window.apiCreateCase(nu); const list = await window.apiListCases(); setCases(list); setActiveId(nu.id); window.notifyCasesUpdated(); showToast('Кейс создан'); } catch (_) { showToast('Не удалось создать'); } }; const remove = async (id) => { if (!confirm('Удалить кейс?')) return; try { await window.apiDeleteCase(id); const list = await window.apiListCases(); setCases(list); if (id === activeId) setActiveId((list[0] && list[0].id) || null); window.notifyCasesUpdated(); showToast('Удалено'); } catch (_) { showToast('Не удалось удалить'); } }; const move = async (id, dir) => { const idx = cases.findIndex(c => c.id === id); const swap = idx + dir; if (swap < 0 || swap >= cases.length) return; const next = [...cases]; [next[idx], next[swap]] = [next[swap], next[idx]]; setCases(next); try { await window.apiReorderCases(next.map(c => c.id)); window.notifyCasesUpdated(); } catch (_) { showToast('Не удалось переставить'); fetchAll(); } }; const resetAll = async () => { if (!confirm('Сбросить все кейсы к значениям по умолчанию?')) return; try { const list = await window.apiResetCases(); setCases(list); setActiveId((list[0] && list[0].id) || null); window.notifyCasesUpdated(); showToast('Сброшено'); } catch (_) { showToast('Не удалось сбросить'); } }; const removeRequest = async (id) => { try { const r = await fetch('/api/requests/' + id, { method: 'DELETE', credentials: 'same-origin' }); if (!r.ok) throw new Error('fail'); setRequests(requests.filter(x => x.id !== id)); } catch (_) { showToast('Не удалось удалить'); } }; // ---------- TEAM ---------- const notifyTeamUpdated = () => window.dispatchEvent(new CustomEvent('scutoid:team-updated')); const addMember = async () => { try { const r = await fetch('/api/team', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({}), }); const j = await r.json().catch(() => ({})); if (!r.ok || !j.ok) { showToast(j.error || 'Ошибка'); return; } const fresh = await fetch('/api/team', { credentials: 'same-origin' }).then(r => r.json()); setTeam(fresh.team || []); setActiveMemberId(j.member.id); notifyTeamUpdated(); showToast('Участник добавлен'); } catch (_) { showToast('Сервер недоступен'); } }; const updateMemberField = (k, v) => { if (!activeMember) return; const next = team.map(m => m.id === activeMemberId ? { ...m, [k]: v } : m); setTeam(next); const key = activeMemberId; if (memberDebounceRef.current[key]) clearTimeout(memberDebounceRef.current[key]); memberDebounceRef.current[key] = setTimeout(async () => { const fresh = next.find(m => m.id === key); try { const r = await fetch('/api/team/' + key, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify(fresh), }); if (!r.ok) showToast('Не удалось сохранить'); else notifyTeamUpdated(); } catch (_) { showToast('Сервер недоступен'); } }, 500); }; const removeMember = async (id) => { if (!confirm('Удалить участника?')) return; try { const r = await fetch('/api/team/' + id, { method: 'DELETE', credentials: 'same-origin' }); if (!r.ok) throw new Error('fail'); const next = team.filter(m => m.id !== id); setTeam(next); if (activeMemberId === id) setActiveMemberId(next[0]?.id || null); notifyTeamUpdated(); showToast('Удалено'); } catch (_) { showToast('Не удалось удалить'); } }; const moveMember = async (id, dir) => { const idx = team.findIndex(m => m.id === id); const swap = idx + dir; if (swap < 0 || swap >= team.length) return; const next = [...team]; [next[idx], next[swap]] = [next[swap], next[idx]]; setTeam(next); try { await fetch('/api/team/reorder', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({ ids: next.map(m => m.id) }), }); notifyTeamUpdated(); } catch (_) { showToast('Не удалось переставить'); } }; // ---------- BLOG ---------- const addPost = async () => { try { const r = await fetch('/api/blog', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({}), }); const j = await r.json().catch(() => ({})); if (!r.ok || !j.ok) { showToast(j.error || 'Ошибка'); return; } const fresh = await fetch('/api/blog/all', { credentials: 'same-origin' }).then(r => r.json()); setPosts(fresh.posts || []); setActivePostId(j.post.id); showToast('Заметка создана'); } catch (_) { showToast('Сервер недоступен'); } }; const updatePostField = (k, v) => { if (!activePost) return; const next = posts.map(p => p.id === activePostId ? { ...p, [k]: v } : p); setPosts(next); const key = activePostId; if (postDebounceRef.current[key]) clearTimeout(postDebounceRef.current[key]); postDebounceRef.current[key] = setTimeout(async () => { const fresh = next.find(p => p.id === key); try { const r = await fetch('/api/blog/' + key, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify(fresh), }); const j = await r.json().catch(() => ({})); if (!r.ok) { showToast('Не удалось сохранить'); return; } // server may have re-slugified — sync local state if (j.post) { setPosts(prev => prev.map(p => p.id === key ? j.post : p)); } } catch (_) { showToast('Сервер недоступен'); } }, 500); }; const removePost = async (id) => { if (!confirm('Удалить заметку?')) return; try { const r = await fetch('/api/blog/' + id, { method: 'DELETE', credentials: 'same-origin' }); if (!r.ok) throw new Error('fail'); const next = posts.filter(p => p.id !== id); setPosts(next); if (activePostId === id) setActivePostId(next[0]?.id || null); showToast('Удалено'); } catch (_) { showToast('Не удалось удалить'); } }; const movePost = async (id, dir) => { const idx = posts.findIndex(p => p.id === id); const swap = idx + dir; if (swap < 0 || swap >= posts.length) return; const next = [...posts]; [next[idx], next[swap]] = [next[swap], next[idx]]; setPosts(next); try { await fetch('/api/blog/reorder', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({ ids: next.map(p => p.id) }), }); } catch (_) { showToast('Не удалось переставить'); } }; const logout = async () => { try { await fetch('/api/auth/logout', { method: 'POST', credentials: 'same-origin' }); } catch (_) {} onLoggedOut(); }; return (
{ if (e.target.classList.contains('admin-overlay')) onClose(); }}>
Админка D-one studio
{tab === 'cases' && ( )} {tab === 'team' && ( )} {tab === 'blog' && ( )}
{loading ? (
Загрузка…
) : tab === 'cases' ? (
{cases.map((c, i) => (
setActiveId(c.id)}>
{c.tag}
{c.title}
{c.category} · {c.year} · {c.size}
))} {cases.length === 0 && (
Кейсов нет. Нажмите «+ Новый кейс».
)}
{active ? (
РЕДАКТИРОВАНИЕ КЕЙСА · {active.id}
{active.title}
update('title', e.target.value)}/>
update('tag', e.target.value.toUpperCase())}/>