1589 lines
90 KiB
HTML
1589 lines
90 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>Agentik desktop — все экраны</title>
|
||
<link rel="stylesheet" href="style.css">
|
||
<style>
|
||
body { display: block; padding: 28px 24px 80px; background: #0A0A0F; }
|
||
.screen {
|
||
width: 1240px; margin: 0 auto 56px; position: relative;
|
||
overflow: hidden; border-radius: 14px;
|
||
}
|
||
.screen .lbl {
|
||
text-align: center; font-size: 12px; color: var(--dim);
|
||
margin-bottom: 12px; letter-spacing: .03em; position: relative;
|
||
background: transparent;
|
||
}
|
||
.screen .lbl b { color: var(--fg); font-weight: 650; margin-right: 4px; }
|
||
/* затемнение окна под поповером проверки в макете агентов */
|
||
.screen .dim { opacity: .4; }
|
||
.screen .layer { position: relative; inset: auto; margin-top: 18px; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ============ 1 · список диалогов (диалог не выбран) ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>1 · список диалогов</b> рейка / voice-first, диалог не выбран</div>
|
||
<div class="win">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a2)"></span>
|
||
<div class="ava" style="background:var(--a2)">К</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Книги</span><span class="t">пн</span></div>
|
||
<div class="l2"><span class="p">Разложил по полкам</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">О</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Отчёт за квартал</span><span class="t">12:05</span></div>
|
||
<div class="l2"><span class="p">Файл лежит на диске</span><span class="bd">1</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a3)"></span>
|
||
<div class="ava" style="background:var(--a3)">Р</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Разбор логов</span><span class="t">вчера</span></div>
|
||
<div class="l2"><span class="p">Нашёл 3 ошибки 502</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a2)"></span>
|
||
<div class="ava" style="background:var(--a2)">S</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Solana-бэкенд</span><span class="t">вчера</span></div>
|
||
<div class="l2"><span class="p">Девайс-нет стартовал</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">Д</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Деплой в прод</span><span class="t">пн</span></div>
|
||
<div class="l2"><span class="p">Готово, релиз 3 опубликован</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<div class="empty">
|
||
<div class="big">💬</div>
|
||
<h3>Выберите диалог слева</h3>
|
||
<p>Или нажмите <b>+</b> в шапке списка, чтобы создать новый. Пока ни один диалог не открыт.</p>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 2 · открытый чат ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>2 · открытый чат</b> диалог с агентом, последний ход агента завершён</div>
|
||
<div class="win">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a2)"></span>
|
||
<div class="ava" style="background:var(--a2)">К</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Книги</span><span class="t">пн</span></div>
|
||
<div class="l2"><span class="p">Разложил по полкам</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">О</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Отчёт за квартал</span><span class="t">12:05</span></div>
|
||
<div class="l2"><span class="p">Файл лежит на диске</span><span class="bd">1</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a3)"></span>
|
||
<div class="ava" style="background:var(--a3)">Р</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Разбор логов</span><span class="t">вчера</span></div>
|
||
<div class="l2"><span class="p">Нашёл 3 ошибки 502</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<header class="m-head">
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="hd">
|
||
<div class="t1">agentik · рабочий</div>
|
||
<div class="t2 ok">на связи</div>
|
||
</div>
|
||
<div class="ghost">
|
||
<button>Стоп</button>
|
||
</div>
|
||
</header>
|
||
<div class="thread">
|
||
<div class="b u">Посмотри логи за вчера<span class="tm">14:10</span></div>
|
||
<div class="b a">Проверил: 3 ошибки <code>502</code> около 04:20, все — обрыв соединения с upstream. Виновник — таймаут прокси. Поправить?<span class="tm">14:12</span></div>
|
||
<div class="b u">Да, увеличь таймаут до 60 и перезапусти прокси<span class="tm">14:14</span></div>
|
||
<div class="act-line">
|
||
<span class="g">⚙</span>
|
||
<span>вызов инструмента: <span class="nm">shell</span></span>
|
||
<span class="ch">▾</span>
|
||
</div>
|
||
<div class="b a">Готово: таймаут поднят, прокси стартанул, за последний час ошибок нет.<span class="tm">14:22</span></div>
|
||
</div>
|
||
<div class="composer">
|
||
<div class="composer-row">
|
||
<div class="composer-input">Сообщение агенту…</div>
|
||
<button class="mic" title="Голос">🎤</button>
|
||
<button class="send off" title="Отправить">➤</button>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 3 · идёт запись голоса ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>3 · запись голоса</b> композер в режиме recording — панель с волной и таймером</div>
|
||
<div class="win">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<header class="m-head">
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="hd">
|
||
<div class="t1">agentik · рабочий</div>
|
||
<div class="t2 ok">на связи</div>
|
||
</div>
|
||
</header>
|
||
<div class="thread">
|
||
<div class="b a">Тогда профиль лучше не ставить — массив «дышит». Возьмите герметик для дерева: он остаётся эластичным.<span class="tm">14:33</span></div>
|
||
<div class="b u">Скинь, что брать по смесителю<span class="tm">14:34</span></div>
|
||
<div class="b a">Смеситель с выдвижным изливом, <code>GROHE</code> или <code>Hansgrohe</code>.<span class="tm">14:35</span></div>
|
||
</div>
|
||
<div class="composer">
|
||
<div class="rec-panel">
|
||
<div class="wave"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div>
|
||
<div class="rec-time">0:07</div>
|
||
<button class="rec-btn" title="Пауза">⏸</button>
|
||
<button class="rec-btn" title="Отменить запись">✕</button>
|
||
<button class="rec-btn rec-send" title="Отправить">➤</button>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 4 · нет ассистентов ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>4 · нет ассистентов</b> пустое состояние рейки и основной зоны</div>
|
||
<div class="win">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты</div>
|
||
<div class="chip">Работа</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows"></div>
|
||
</section>
|
||
<main class="main">
|
||
<div class="empty">
|
||
<div class="big">💬</div>
|
||
<h3>Диалогов пока нет</h3>
|
||
<p>Добавьте первого ассистента — он появится в списке, и можно будет начать.</p>
|
||
<button class="btn prim">+ Добавить ассистента</button>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 6 · управление группами ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>6 · управление группами</b> модалка со списком групп + добавить</div>
|
||
<div class="win" style="position:relative">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a2)"></span>
|
||
<div class="ava" style="background:var(--a2)">К</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Книги</span><span class="t">пн</span></div>
|
||
<div class="l2"><span class="p">Разложил по полкам</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<header class="m-head">
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="hd">
|
||
<div class="t1">agentik · рабочий</div>
|
||
<div class="t2 ok">на связи</div>
|
||
</div>
|
||
</header>
|
||
<div class="thread">
|
||
<div class="b a">Тогда профиль лучше не ставить — массив «дышит». Возьмите герметик для дерева.<span class="tm">14:33</span></div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim">
|
||
<div class="modal groups">
|
||
<h2>Группы<button class="x" title="Закрыть">✕</button></h2>
|
||
<div class="sub" style="font-size:12.5px;color:var(--dim);padding:0 20px 12px;">Папки для диалогов. «Все чаты» — встроенная, её нельзя удалить или переименовать.</div>
|
||
<div class="body">
|
||
<div class="grp sys">
|
||
<div class="mid">
|
||
<div class="nm">Все чаты</div>
|
||
<div class="sub">Показывает все диалоги, из любой группы</div>
|
||
</div>
|
||
<span class="lock">встроенная</span>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid">
|
||
<div class="nm">Работа</div>
|
||
<div class="sub">12 диалогов</div>
|
||
</div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid">
|
||
<div class="nm">Дом</div>
|
||
<div class="sub">4 диалога</div>
|
||
</div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid">
|
||
<div class="nm">Учёба</div>
|
||
<div class="sub">2 диалога</div>
|
||
</div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid">
|
||
<div class="nm">Личное</div>
|
||
<div class="sub">пустая</div>
|
||
</div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<button class="btn wide" style="margin:8px 0 4px">+ Добавить группу</button>
|
||
</div>
|
||
<div class="foot">
|
||
<button class="btn prim" style="flex:1">Готово</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 7 · создание группы ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>7 · создание группы</b> форма новой группы + выбор диалогов</div>
|
||
<div class="win" style="position:relative">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<span class="strip" style="background:var(--a2)"></span>
|
||
<div class="ava" style="background:var(--a2)">К</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">Книги</span><span class="t">пн</span></div>
|
||
<div class="l2"><span class="p">Разложил по полкам</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<header class="m-head">
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="hd">
|
||
<div class="t1">agentik · рабочий</div>
|
||
<div class="t2 ok">на связи</div>
|
||
</div>
|
||
</header>
|
||
<div class="thread">
|
||
<div class="b a">Тогда профиль лучше не ставить — массив «дышит». Возьмите герметик для дерева.<span class="tm">14:33</span></div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim">
|
||
<div class="modal groups">
|
||
<h2>Новая группа<button class="x" title="Закрыть">✕</button></h2>
|
||
<div class="sub" style="font-size:12.5px;color:var(--dim);padding:0 20px 12px;">Придумайте имя и добавьте в группу нужные диалоги.</div>
|
||
<div class="body">
|
||
<div class="form-field">
|
||
<label>Название</label>
|
||
<input type="text" value="Учёба" placeholder="как назвать группу">
|
||
<div class="note">Так группа будет называться в ленте над списком диалогов.</div>
|
||
</div>
|
||
<div class="tags">
|
||
<div class="lbl">Диалоги в группе <span style="color:var(--dim);font-weight:500;text-transform:none;letter-spacing:0;">(0)</span></div>
|
||
<div class="empty">В этой группе пока нет диалогов. Нажмите «Добавить диалог», чтобы выбрать.</div>
|
||
<button class="add-chat-btn" style="margin-top:9px;">+ Добавить диалог</button>
|
||
</div>
|
||
</div>
|
||
<div class="foot">
|
||
<button class="btn">Отмена</button>
|
||
<button class="btn prim">Создать группу</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 8 · изменение группы ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>8 · изменение группы</b> переименование, диалоги, опасная зона</div>
|
||
<div class="win" style="position:relative">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<header class="m-head">
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="hd">
|
||
<div class="t1">agentik · рабочий</div>
|
||
<div class="t2 ok">на связи</div>
|
||
</div>
|
||
</header>
|
||
<div class="thread">
|
||
<div class="b a">Тогда профиль лучше не ставить — массив «дышит». Возьмите герметик для дерева.<span class="tm">14:33</span></div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim">
|
||
<div class="modal groups">
|
||
<h2>Изменить группу<button class="x" title="Закрыть">✕</button></h2>
|
||
<div class="sub" style="font-size:12.5px;color:var(--dim);padding:0 20px 12px;">Переименование и состав диалогов. Удаление самой группы — внизу.</div>
|
||
<div class="body">
|
||
<div class="form-field">
|
||
<label>Название</label>
|
||
<input type="text" value="Дом">
|
||
<div class="note">Новое имя сразу появится в ленте над списком диалогов.</div>
|
||
</div>
|
||
<div class="tags">
|
||
<div class="lbl">Диалоги в группе <span style="color:var(--dim);font-weight:500;text-transform:none;letter-spacing:0;">(3)</span></div>
|
||
<div class="tags-list">
|
||
<div class="chat-tag">
|
||
<div class="ava-sm" style="background:var(--a2)">К</div>
|
||
<span class="nm">Книги</span>
|
||
<button class="x" title="Убрать из группы">✕</button>
|
||
</div>
|
||
<div class="chat-tag">
|
||
<div class="ava-sm" style="background:var(--a3)">П</div>
|
||
<span class="nm">Плов по-узбекски</span>
|
||
<button class="x" title="Убрать из группы">✕</button>
|
||
</div>
|
||
<div class="chat-tag">
|
||
<div class="ava-sm" style="background:var(--a4)">С</div>
|
||
<span class="nm">Смета на ремонт</span>
|
||
<button class="x" title="Убрать из группы">✕</button>
|
||
</div>
|
||
</div>
|
||
<button class="add-chat-btn">+ Добавить диалог</button>
|
||
</div>
|
||
<div class="danger-zone">
|
||
<div class="lbl">Опасное</div>
|
||
<button class="btn dang" style="width:100%;text-align:center;">Удалить группу</button>
|
||
<div class="note" style="font-size:11px;color:var(--dim);margin-top:8px;line-height:1.5;">Удаление группы не трогает диалоги — они останутся и будут видны в «Все чаты».</div>
|
||
</div>
|
||
</div>
|
||
<div class="foot">
|
||
<button class="btn">Отмена</button>
|
||
<button class="btn prim">Сохранить</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 9 · выбор диалога для группы ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>9 · выбор диалога для группы</b> список диалогов с галочками</div>
|
||
<div class="win" style="position:relative">
|
||
<section class="list">
|
||
<div class="l-head"><h1>Диалоги</h1></div>
|
||
<div class="chips">
|
||
<div class="chip on">Все чаты<b>3</b></div>
|
||
<div class="chip">Работа</div>
|
||
<div class="chip">Дом</div>
|
||
<button class="chip-act" title="Группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
</div>
|
||
<div class="q">🔍 Поиск…</div>
|
||
<div class="rows">
|
||
<div class="row on">
|
||
<span class="strip" style="background:var(--a1)"></span>
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="mid">
|
||
<div class="l1"><span class="n">agentik · рабочий</span><span class="t">14:22</span></div>
|
||
<div class="l2"><span class="p">Собрал отчёт, жду правок</span><span class="bd">2</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<main class="main">
|
||
<header class="m-head">
|
||
<div class="ava" style="background:var(--a1)">С</div>
|
||
<div class="hd">
|
||
<div class="t1">agentik · рабочий</div>
|
||
<div class="t2 ok">на связи</div>
|
||
</div>
|
||
</header>
|
||
<div class="thread">
|
||
<div class="b a">Тогда профиль лучше не ставить — массив «дышит». Возьмите герметик для дерева.<span class="tm">14:33</span></div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim">
|
||
<div class="modal pick">
|
||
<h2>Добавить диалог в «Дом»<button class="x" title="Закрыть">✕</button></h2>
|
||
<div class="q" placeholder="Поиск по диалогам…">🔍 Поиск по диалогам…</div>
|
||
<div class="body">
|
||
<div class="pick-row">
|
||
<div class="ava-sm" style="background:var(--a2)">К</div>
|
||
<div class="mid">
|
||
<div class="nm">Книги</div>
|
||
<div class="ad">Разложил по полкам</div>
|
||
</div>
|
||
<div class="check">✓</div>
|
||
</div>
|
||
<div class="pick-row">
|
||
<div class="ava-sm" style="background:var(--a3)">П</div>
|
||
<div class="mid">
|
||
<div class="nm">Плов по-узбекски</div>
|
||
<div class="ad">На 6 порций, в казане</div>
|
||
</div>
|
||
<div class="check">✓</div>
|
||
</div>
|
||
<div class="pick-row">
|
||
<div class="ava-sm" style="background:var(--a4)">С</div>
|
||
<div class="mid">
|
||
<div class="nm">Смета на ремонт</div>
|
||
<div class="ad">Кухня + ванная, материалы</div>
|
||
</div>
|
||
<div class="check">✓</div>
|
||
</div>
|
||
<div class="pick-row">
|
||
<div class="ava-sm" style="background:var(--a1)">А</div>
|
||
<div class="mid">
|
||
<div class="nm">agentik · рабочий</div>
|
||
<div class="ad">Собрал отчёт, жду правок</div>
|
||
</div>
|
||
<div class="check">✓</div>
|
||
</div>
|
||
<div class="pick-row">
|
||
<div class="ava-sm" style="background:var(--a5)">О</div>
|
||
<div class="mid">
|
||
<div class="nm">Отчёт за квартал</div>
|
||
<div class="ad">Файл лежит на диске</div>
|
||
</div>
|
||
<div class="check">✓</div>
|
||
</div>
|
||
<div class="pick-row">
|
||
<div class="ava-sm" style="background:var(--a3)">Р</div>
|
||
<div class="mid">
|
||
<div class="nm">Разбор логов nginx</div>
|
||
<div class="ad">Нашёл 3 ошибки 502</div>
|
||
</div>
|
||
<div class="check">✓</div>
|
||
</div>
|
||
</div>
|
||
<div class="foot">
|
||
<button class="btn">Отмена</button>
|
||
<button class="btn prim">Добавить (3)</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 10 · агенты · список ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>10 · агенты · список</b> окно «Агенты»: карточки + действия</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Агенты</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="agent-card">
|
||
<div class="avatar" style="background:var(--accent);color:var(--on-accent)">АГ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">agentik</div>
|
||
<div class="ag-desc">Корпоративный помощник: код, документы, отчёты</div>
|
||
<div class="ag-addr">http://192.168.88.135:8080/agentik</div>
|
||
</div>
|
||
<div class="state"><span class="d"></span>на связи</div>
|
||
<div class="card-acts">
|
||
<button class="mini-ic" title="Проверить связь">⇄</button>
|
||
<button class="mini-ic" title="Изменить">✎</button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="avatar" style="background:#86C99A;color:var(--on-accent)">ДМ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">home-assistant</div>
|
||
<div class="ag-desc">Рецепты, расписания, бытовые мелочи</div>
|
||
<div class="ag-addr">http://192.168.76.199:8080/agentik</div>
|
||
</div>
|
||
<div class="state err"><span class="d"></span>не отвечает</div>
|
||
<div class="card-acts">
|
||
<button class="mini-ic" title="Проверить связь">⇄</button>
|
||
<button class="mini-ic" title="Изменить">✎</button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="avatar pic" style="background:transparent;padding:0"><img src="data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect width='40' height='40' fill='%232F4A63'/%3E%3Ccircle cx='20' cy='15' r='6.5' fill='%23DCE6F0'/%3E%3Cpath d='M7 40c0-7.5 5.8-12 13-12s13 4.5 13 12z' fill='%23DCE6F0'/%3E%3C/svg%3E" alt=""></div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">Кот-ассистент</div>
|
||
<div class="ag-desc">Поддержка и шутки в трудную минуту</div>
|
||
<div class="ag-addr">http://192.168.88.24:8080/agentik</div>
|
||
</div>
|
||
<div class="state off"><span class="d"></span>не проверялся</div>
|
||
<div class="card-acts">
|
||
<button class="mini-ic" title="Проверить связь">⇄</button>
|
||
<button class="mini-ic" title="Изменить">✎</button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<button class="btn wide">+ Добавить агента</button>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn prim" style="flex:1">Готово</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 11 · агенты · новый ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>11 · агенты · новый</b> форма добавления: hint про <code>AgentInfo</code>, адрес, цвет/картинка</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Новый агент</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="hint-line">
|
||
Имя и описание берутся с сервера агента автоматически
|
||
(<code>AgentInfo.name</code>, <code>description</code>, <code>usefulness</code>).
|
||
Здесь нужно только настроить, как отличать агента визуально.
|
||
</div>
|
||
<div class="field">
|
||
<label>Адрес сервера агента</label>
|
||
<div class="addr-row">
|
||
<input type="text" class="mono" value="http://192.168.88.135:8080/agentik"
|
||
placeholder="http://хост:порт/agentik">
|
||
<button class="btn sm">Проверить связь</button>
|
||
</div>
|
||
<div class="note">Адрес целиком, вместе с путём <code>/agentik</code>. Если агент
|
||
на этой же машине — <code>http://localhost:8080/agentik</code>.</div>
|
||
</div>
|
||
<div class="field">
|
||
<label>Как отличать в списке</label>
|
||
<div class="appearance-tabs">
|
||
<div class="tab on">Цвет</div>
|
||
<div class="tab">Картинка</div>
|
||
</div>
|
||
<div class="pane on">
|
||
<div class="colors">
|
||
<div class="swatch on" style="background:#6AB2F2"></div>
|
||
<div class="swatch" style="background:#86C99A"></div>
|
||
<div class="swatch" style="background:#C9A886"></div>
|
||
<div class="swatch" style="background:#B79AE0"></div>
|
||
<div class="swatch" style="background:#E28C8C"></div>
|
||
</div>
|
||
<div class="note">Цветом помечаются диалоги агента в списке — полоска у строки
|
||
и точка у группы.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn prim" style="flex:1">Добавить агента</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 12 · агенты · изменить ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>12 · агенты · изменить</b> форма правки: адрес предзаполнен, имя/описание недоступны</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Изменить агента</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="hint-line">
|
||
Имя и описание задаются сервером и здесь недоступны для правки.
|
||
Здесь можно изменить адрес и визуальную метку.
|
||
</div>
|
||
<div class="field">
|
||
<label>Адрес сервера агента</label>
|
||
<div class="addr-row">
|
||
<input type="text" class="mono" value="http://192.168.88.135:8080/agentik">
|
||
<button class="btn sm">Проверить связь</button>
|
||
</div>
|
||
<div class="note">Адрес целиком, вместе с путём <code>/agentik</code>.</div>
|
||
</div>
|
||
<div class="field">
|
||
<label>Как отличать в списке</label>
|
||
<div class="appearance-tabs">
|
||
<div class="tab on">Цвет</div>
|
||
<div class="tab">Картинка</div>
|
||
</div>
|
||
<div class="pane on">
|
||
<div class="colors">
|
||
<div class="swatch on" style="background:#6AB2F2"></div>
|
||
<div class="swatch" style="background:#86C99A"></div>
|
||
<div class="swatch" style="background:#C9A886"></div>
|
||
<div class="swatch" style="background:#B79AE0"></div>
|
||
<div class="swatch" style="background:#E28C8C"></div>
|
||
</div>
|
||
<div class="note">Цветом помечаются диалоги агента в списке.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn prim" style="flex:1">Сохранить</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 13 · агенты · проверка связи ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>13 · агенты · проверка связи</b> поповер поверх затемнённого списка</div>
|
||
<div class="dialog dim">
|
||
<div class="d-head">
|
||
<h2>Агенты</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="agent-card">
|
||
<div class="avatar" style="background:var(--accent);color:var(--on-accent)">АГ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">agentik</div>
|
||
<div class="ag-desc">Корпоративный помощник: код, документы, отчёты</div>
|
||
<div class="ag-addr">http://192.168.88.135:8080/agentik</div>
|
||
</div>
|
||
<div class="state"><span class="d"></span>на связи</div>
|
||
<div class="card-acts">
|
||
<button class="mini-ic">⇄</button>
|
||
<button class="mini-ic">✎</button>
|
||
<button class="mini-ic del"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot"><button class="btn prim" style="flex:1">Готово</button></div>
|
||
</div>
|
||
<div class="layer">
|
||
<div class="dialog small">
|
||
<div class="d-head">
|
||
<h2>Проверка связи</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="probe-head ok">
|
||
<div class="big">✓</div>
|
||
<div class="txt">
|
||
<div class="ttl">Агент отвечает</div>
|
||
<div class="sub">http://192.168.88.135:8080/agentik</div>
|
||
</div>
|
||
</div>
|
||
<div class="probe-list">
|
||
<div><span>Ответ на запрос</span><b>ok</b></div>
|
||
<div><span>Отвечает по адресу</span><b>http://192.168.88.135:8080/agentik</b></div>
|
||
<div><span>Диалогов у агента</span><b>4</b></div>
|
||
<div><span>Отклик</span><b>38 мс</b></div>
|
||
</div>
|
||
<div class="hint-line">Адрес рабочий. Можно добавлять этого агента.</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Проверить снова</button>
|
||
<button class="btn prim" style="flex:1">Готово</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 14 · sidebar-utility · главное окно ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>14 · sidebar-utility</b> одобренный канон — сайдбар + папки + полноценный композер с ASR</div>
|
||
<div class="window">
|
||
<aside class="sidebar">
|
||
<div class="sb-head">
|
||
<div class="sb-title">
|
||
<span>Диалоги</span>
|
||
<button class="icon-btn" title="Новый диалог">+</button>
|
||
</div>
|
||
</div>
|
||
<input class="search" placeholder="Поиск диалога…" style="margin:0 16px 8px;width:calc(100% - 32px);">
|
||
|
||
<div class="folders">
|
||
<div class="folder active">Все чаты <span class="cnt">3</span></div>
|
||
<div class="folder">Работа</div>
|
||
<div class="folder">Дом</div>
|
||
<div class="folder act" title="Группы: добавить, изменить, удалить"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></div>
|
||
</div>
|
||
|
||
<div class="chat-list">
|
||
<div class="chat-row active">
|
||
<div class="avatar">АГ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>agentik · рабочий</span><span class="chat-time">14:22</span></div>
|
||
<div class="chat-prev">Собрал отчёт, жду правок</div>
|
||
</div>
|
||
<div class="row-tail"><span class="badge">2</span></div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g2">ОЧ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Отчёт за квартал</span><span class="chat-time">12:05</span></div>
|
||
<div class="chat-prev">Файл лежит на диске</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g3">РЗ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Разбор логов nginx</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Нашёл 3 ошибки 502</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g4">ПО</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Помощь по Solana</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Девайс-нет стартовал</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
|
||
<main class="main">
|
||
<header class="chat-head">
|
||
<button class="back-btn">←</button>
|
||
<div class="avatar">АГ</div>
|
||
<div class="head-meta">
|
||
<div class="head-name">agentik · рабочий</div>
|
||
<div class="head-sub"><span class="dot">●</span> на связи</div>
|
||
</div>
|
||
<button class="icon-btn" title="Параметры диалога"><svg viewBox="0 0 24 24"><circle cx="12" cy="5" r="2"/><circle cx="12" cy="12" r="2"/><circle cx="12" cy="19" r="2"/></svg></button>
|
||
</header>
|
||
|
||
<div class="messages">
|
||
<div class="msg user">Проверь, почему падает CI в agentik<span class="meta">14:18</span></div>
|
||
<div class="think"><b>Думает:</b> 42 прогона, красных 40. Смотрю имена тестов…
|
||
<span class="rest">похоже на проблему кодировки при создании файлов классов.</span></div>
|
||
<div class="tool"><span class="gear">⚙</span> <code>grep -rnP 'fun `[^`]*[^\x00-\x7F]' --include='*.kt'</code></div>
|
||
<div class="msg bot">Нашёл причину: в именах тестов стоит длинное тире «—», а сборка работает в ASCII-кодировке. Отсюда падение компилятора. Починил, CI зелёный.<span class="meta">14:22</span></div>
|
||
<div class="msg user">Отлично. Сделай релиз «3»<span class="meta">14:23</span></div>
|
||
<div class="think"><b>Думает:</b> создаю тег, запускаю публикацию…
|
||
<span class="rest">проверю, что в Nexus появилась версия 3.</span></div>
|
||
</div>
|
||
|
||
<div class="composer">
|
||
<div class="attach-strip"></div>
|
||
<div class="asr-note"><span class="live"></span> распознаю:
|
||
<span style="color:var(--fg)">проверь логи сборки за вчерашний день и сделай вывод …</span></div>
|
||
|
||
<div class="rec-panel">
|
||
<button class="mini cancel">✕</button>
|
||
<div class="wave"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div>
|
||
<span class="rec-time">0:12</span>
|
||
<div class="rec-actions"><button class="mini ok">Остановить и отправить</button></div>
|
||
</div>
|
||
|
||
<div class="input-row">
|
||
<div class="input-wrap"><textarea rows="1" placeholder="Написать агенту…"></textarea></div>
|
||
<button class="rec-btn">🎙</button>
|
||
<button class="send-btn">Отправить</button>
|
||
</div>
|
||
|
||
<div class="hint"><span>готов · голос <kbd>Ctrl</kbd>+<kbd>R</kbd> · отправка <kbd>Enter</kbd></span></div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 15 · новый диалог · одобренный agent-picker ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>15 · agent-picker · одобренный</b> модалка выбора ассистента с warn про недоступного</div>
|
||
<div class="dialog" style="width:480px;min-width:480px;max-height:600px;">
|
||
<div class="d-head">
|
||
<h2>Новый диалог</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body" style="padding:14px 18px 8px;">
|
||
<div class="d-lead">В каком ассистенте создать диалог?</div>
|
||
|
||
<div class="agent-opt on">
|
||
<div class="avatar">АГ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">agentik · рабочий</div>
|
||
<div class="ag-addr">http://192.168.88.135:8080/agentik</div>
|
||
<div class="ag-state ok"><span class="d"></span>на связи</div>
|
||
</div>
|
||
<div class="pick"></div>
|
||
</div>
|
||
|
||
<div class="agent-opt">
|
||
<div class="avatar g2">ДМ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">домашний</div>
|
||
<div class="ag-addr">http://192.168.76.199:8080/agentik</div>
|
||
<div class="ag-state ok"><span class="d"></span>на связи</div>
|
||
</div>
|
||
<div class="pick"></div>
|
||
</div>
|
||
|
||
<div class="agent-opt">
|
||
<div class="avatar pic"></div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">Кот-ассистент</div>
|
||
<div class="ag-addr">http://192.168.24.8080:8080/agentik</div>
|
||
<div class="ag-state err"><span class="d"></span>не отвечает</div>
|
||
</div>
|
||
<div class="pick"></div>
|
||
</div>
|
||
|
||
<div class="warn on" style="display:flex">
|
||
<span class="i">⚠</span>
|
||
<span>Ассистент сейчас не отвечает. Диалог создать можно, но
|
||
сообщение не уйдёт, пока он не поднимется.</span>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="" placeholder="как назвать диалог">
|
||
<div class="note">Можно оставить пустым — диалог покажется как «Без названия». Переименуете в ⋯ в шапке чата.</div>
|
||
</div>
|
||
|
||
<div class="checkbox-row on">
|
||
<div class="box"></div>
|
||
<div class="mid">
|
||
<div class="lbl">Временный диалог</div>
|
||
<div class="desc">История не сохраняется на сервере. Подходит для коротких проверок и отладки.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn prim" style="flex:1">Создать диалог</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 16 · группы · список (sidebar-вариант) ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>16 · группы · список</b> одобренный — модалка поверх окна, sidebar-сайдбар</div>
|
||
<div class="window">
|
||
<aside class="sidebar">
|
||
<div class="sb-head"><div class="sb-title"><span>Диалоги</span><button class="icon-btn" title="Новый диалог">+</button></div></div>
|
||
<input class="search" placeholder="Поиск диалога…" style="margin:0 16px 10px;width:calc(100% - 32px);">
|
||
<div class="folders">
|
||
<div class="folder active">Все чаты <span class="cnt">3</span></div>
|
||
<div class="folder">Работа</div>
|
||
<div class="folder">Дом</div>
|
||
<div class="folder">Учёба</div>
|
||
<div class="folder">Личное</div>
|
||
<div class="folder act" title="Группы: добавить, изменить, удалить"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></div>
|
||
</div>
|
||
<div class="chat-list">
|
||
<div class="chat-row active">
|
||
<div class="avatar">АГ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>agentik · рабочий</span><span class="chat-time">14:22</span></div>
|
||
<div class="chat-prev">Собрал отчёт, жду правок</div>
|
||
</div>
|
||
<div class="row-tail"><span class="badge">2</span></div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g2">ОЧ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Отчёт за квартал</span><span class="chat-time">12:05</span></div>
|
||
<div class="chat-prev">Файл лежит на диске</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g3">РЗ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Разбор логов nginx</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Нашёл 3 ошибки 502</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g4">ПО</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Помощь по Solana</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Девайс-нет стартовал</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
<main class="main">
|
||
<header class="chat-head">
|
||
<div class="avatar">АГ</div>
|
||
<div><div class="head-name">agentik · рабочий</div><div class="head-sub"><span class="dot">●</span> на связи</div></div>
|
||
</header>
|
||
<div class="messages">
|
||
<div class="msg user">Проверь, почему падает CI</div>
|
||
<div class="msg bot">Нашёл: длинное тире в именах тестов ломает сборку. Починил, CI зелёный.</div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim"></div>
|
||
<div class="layer">
|
||
<div class="dialog">
|
||
<div class="d-head"><h2>Группы</h2><button class="x-btn">✕</button></div>
|
||
<div class="d-body">
|
||
<div class="grp sys">
|
||
<div class="mid"><div class="nm">Все чаты</div><div class="sub">Показывает все диалоги, из любой группы</div></div>
|
||
<div class="lock">встроенная</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid"><div class="nm">Работа</div><div class="sub">12 диалогов</div></div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid"><div class="nm">Дом</div><div class="sub">4 диалога</div></div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid"><div class="nm">Учёба</div><div class="sub">2 диалога</div></div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<div class="grp">
|
||
<div class="mid"><div class="nm">Личное</div><div class="sub">пустая</div></div>
|
||
<div class="acts">
|
||
<button class="mini-ic" title="Настройки группы"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></button>
|
||
<button class="mini-ic del" title="Удалить"><svg viewBox="0 0 24 24"><path d="M3 6h18v2H3V6zm2 3h14l-1.4 11.2a2 2 0 0 1-2 1.8H8.4a2 2 0 0 1-2-1.8L5 9zm3-6h8l1 2H7l1-2z"/></svg></button>
|
||
</div>
|
||
</div>
|
||
<button class="btn wide">+ Добавить группу</button>
|
||
</div>
|
||
<div class="d-foot"><button class="btn prim" style="flex:1">Готово</button></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 17 · группы · новая ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>17 · группы · новая</b> одобренный — форма без выбора диалогов (диалоги — потом)</div>
|
||
<div class="window">
|
||
<aside class="sidebar">
|
||
<div class="sb-head"><div class="sb-title"><span>Диалоги</span><button class="icon-btn" title="Новый диалог">+</button></div></div>
|
||
<input class="search" placeholder="Поиск диалога…" style="margin:0 16px 10px;width:calc(100% - 32px);">
|
||
<div class="folders">
|
||
<div class="folder active">Все чаты <span class="cnt">3</span></div>
|
||
<div class="folder">Работа</div>
|
||
<div class="folder">Дом</div>
|
||
<div class="folder">Учёба</div>
|
||
<div class="folder">Личное</div>
|
||
<div class="folder act" title="Группы: добавить, изменить, удалить"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></div>
|
||
</div>
|
||
<div class="chat-list">
|
||
<div class="chat-row active">
|
||
<div class="avatar">АГ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>agentik · рабочий</span><span class="chat-time">14:22</span></div>
|
||
<div class="chat-prev">Собрал отчёт, жду правок</div>
|
||
</div>
|
||
<div class="row-tail"><span class="badge">2</span></div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g2">ОЧ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Отчёт за квартал</span><span class="chat-time">12:05</span></div>
|
||
<div class="chat-prev">Файл лежит на диске</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g3">РЗ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Разбор логов nginx</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Нашёл 3 ошибки 502</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g4">ПО</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Помощь по Solana</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Девайс-нет стартовал</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
<main class="main">
|
||
<header class="chat-head">
|
||
<div class="avatar">АГ</div>
|
||
<div><div class="head-name">agentik · рабочий</div><div class="head-sub"><span class="dot">●</span> на связи</div></div>
|
||
</header>
|
||
<div class="messages">
|
||
<div class="msg user">Проверь, почему падает CI</div>
|
||
<div class="msg bot">Нашёл: длинное тире в именах тестов ломает сборку. Починил, CI зелёный.</div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim"></div>
|
||
<div class="layer">
|
||
<div class="dialog">
|
||
<div class="d-head"><h2>Новая группа</h2><button class="x-btn">✕</button></div>
|
||
<div class="d-body">
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="Учёба" placeholder="как назвать группу">
|
||
<div class="note">Так группа будет называться в ленте над списком диалогов.</div>
|
||
</div>
|
||
<div class="info">
|
||
<span>ℹ</span>
|
||
<span>Диалоги в группу попадают потом — из самого диалога. Здесь группа
|
||
только создаётся, диалог в неё не переносится.</span>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn prim" style="flex:1">Создать группу</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 18 · группы · изменение ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>18 · группы · изменение</b> одобренный — переименование + danger-zone в той же форме</div>
|
||
<div class="window">
|
||
<aside class="sidebar">
|
||
<div class="sb-head"><div class="sb-title"><span>Диалоги</span><button class="icon-btn" title="Новый диалог">+</button></div></div>
|
||
<input class="search" placeholder="Поиск диалога…" style="margin:0 16px 10px;width:calc(100% - 32px);">
|
||
<div class="folders">
|
||
<div class="folder">Все чаты <span class="cnt">3</span></div>
|
||
<div class="folder active">Работа</div>
|
||
<div class="folder">Дом</div>
|
||
<div class="folder">Учёба</div>
|
||
<div class="folder">Личное</div>
|
||
<div class="folder act" title="Группы: добавить, изменить, удалить"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></div>
|
||
</div>
|
||
<div class="chat-list">
|
||
<div class="chat-row active">
|
||
<div class="avatar">АГ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>agentik · рабочий</span><span class="chat-time">14:22</span></div>
|
||
<div class="chat-prev">Собрал отчёт, жду правок</div>
|
||
</div>
|
||
<div class="row-tail"><span class="badge">2</span></div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g2">ОЧ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Отчёт за квартал</span><span class="chat-time">12:05</span></div>
|
||
<div class="chat-prev">Файл лежит на диске</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g3">РЗ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Разбор логов nginx</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Нашёл 3 ошибки 502</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g4">ПО</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Помощь по Solana</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Девайс-нет стартовал</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
<main class="main">
|
||
<header class="chat-head">
|
||
<div class="avatar">АГ</div>
|
||
<div><div class="head-name">agentik · рабочий</div><div class="head-sub"><span class="dot">●</span> на связи</div></div>
|
||
</header>
|
||
<div class="messages">
|
||
<div class="msg user">Проверь, почему падает CI</div>
|
||
<div class="msg bot">Нашёл: длинное тире в именах тестов ломает сборку. Починил, CI зелёный.</div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim"></div>
|
||
<div class="layer">
|
||
<div class="dialog">
|
||
<div class="d-head"><h2>Группа «Работа»</h2><button class="x-btn">✕</button></div>
|
||
<div class="d-body">
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="Работа" placeholder="как назвать группу">
|
||
<div class="note">Так группа будет называться в ленте над списком диалогов.</div>
|
||
</div>
|
||
<div class="info">
|
||
<span>ℹ</span>
|
||
<span>В группе сейчас 12 диалогов. Переименование их не затрагивает —
|
||
это только название группы.</span>
|
||
</div>
|
||
<div class="danger-zone">
|
||
<div class="lbl">Опасное</div>
|
||
<button class="btn dang" style="width:100%">Удалить группу</button>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn prim" style="flex:1">Сохранить</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 19 · группы · удаление ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>19 · группы · удаление</b> одобренный — отдельная модалка подтверждения с warn + красный CTA</div>
|
||
<div class="window">
|
||
<aside class="sidebar">
|
||
<div class="sb-head"><div class="sb-title"><span>Диалоги</span><button class="icon-btn" title="Новый диалог">+</button></div></div>
|
||
<input class="search" placeholder="Поиск диалога…" style="margin:0 16px 10px;width:calc(100% - 32px);">
|
||
<div class="folders">
|
||
<div class="folder">Все чаты <span class="cnt">3</span></div>
|
||
<div class="folder active">Работа</div>
|
||
<div class="folder">Дом</div>
|
||
<div class="folder">Учёба</div>
|
||
<div class="folder">Личное</div>
|
||
<div class="folder act" title="Группы: добавить, изменить, удалить"><svg viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg></div>
|
||
</div>
|
||
<div class="chat-list">
|
||
<div class="chat-row active">
|
||
<div class="avatar">АГ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>agentik · рабочий</span><span class="chat-time">14:22</span></div>
|
||
<div class="chat-prev">Собрал отчёт, жду правок</div>
|
||
</div>
|
||
<div class="row-tail"><span class="badge">2</span></div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g2">ОЧ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Отчёт за квартал</span><span class="chat-time">12:05</span></div>
|
||
<div class="chat-prev">Файл лежит на диске</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g3">РЗ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Разбор логов nginx</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Нашёл 3 ошибки 502</div>
|
||
</div>
|
||
</div>
|
||
<div class="chat-row">
|
||
<div class="avatar g4">ПО</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Помощь по Solana</span><span class="chat-time">вчера</span></div>
|
||
<div class="chat-prev">Девайс-нет стартовал</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
<main class="main">
|
||
<header class="chat-head">
|
||
<div class="avatar">АГ</div>
|
||
<div><div class="head-name">agentik · рабочий</div><div class="head-sub"><span class="dot">●</span> на связи</div></div>
|
||
</header>
|
||
<div class="messages">
|
||
<div class="msg user">Проверь, почему падает CI</div>
|
||
<div class="msg bot">Нашёл: длинное тире в именах тестов ломает сборку. Починил, CI зелёный.</div>
|
||
</div>
|
||
</main>
|
||
<div class="scrim"></div>
|
||
<div class="layer">
|
||
<div class="dialog">
|
||
<div class="d-head"><h2>Удалить группу?</h2><button class="x-btn">✕</button></div>
|
||
<div class="d-body">
|
||
<div class="warn">
|
||
<span class="i">⚠</span>
|
||
<span>Группа <b>«Работа»</b> исчезнет из ленты. <b>Диалоги не удалятся</b> —
|
||
они останутся и будут видны в «Все чаты». Вернуть группу можно, создав её
|
||
заново, но диалоги придётся разложить руками.</span>
|
||
</div>
|
||
<div class="field">
|
||
<label>Что сделать с диалогами группы</label>
|
||
<div class="grp" style="margin-bottom:9px">
|
||
<div class="mid">
|
||
<div class="nm">Оставить без группы</div>
|
||
<div class="sub">12 диалогов вернутся в «Все чаты»</div>
|
||
</div>
|
||
<div class="lock">✓</div>
|
||
</div>
|
||
</div>
|
||
<div class="info">
|
||
<span>ℹ</span>
|
||
<span>Другого пути нет: диалог обязан быть где-то виден. Отдельной
|
||
«корзины» у диалогов нет — удаляются только диалоги, и не отсюда.</span>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn dang solid" style="flex:1">Удалить группу</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ вход в окно информации о диалоге ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>вход в окно информации о диалоге</b> кнопка <code>⋯</code> в шапке открытого чата с подсветкой</div>
|
||
<div class="window">
|
||
<aside class="sidebar">
|
||
<div class="sb-head"><div class="sb-title"><span>Диалоги</span><button class="icon-btn" title="Новый диалог">+</button></div></div>
|
||
<input class="search" placeholder="Поиск диалога…" style="margin:0 16px 10px;width:calc(100% - 32px);">
|
||
<div class="chat-list">
|
||
<div class="chat-row active">
|
||
<div class="avatar">АГ</div>
|
||
<div class="chat-mid">
|
||
<div class="chat-name"><span>Spring Boot · настройка логов</span><span class="chat-time">14:22</span></div>
|
||
<div class="chat-prev">Логи теперь пишутся в отдельный файл…</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
<main class="main">
|
||
<header class="chat-head">
|
||
<div class="avatar">АГ</div>
|
||
<div class="head-meta">
|
||
<div class="head-name">Spring Boot · настройка логов</div>
|
||
<div class="head-sub"><span class="dot">●</span> на связи · agentik</div>
|
||
</div>
|
||
<button class="icon-btn hi-btn" title="Параметры диалога"><svg viewBox="0 0 24 24"><circle cx="12" cy="5" r="2"/><circle cx="12" cy="12" r="2"/><circle cx="12" cy="19" r="2"/></svg></button>
|
||
</header>
|
||
</main>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 20 · параметры диалога · обычный ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>20 · параметры диалога · обычный</b> чекбокс выключен и задизейблен (<code>isTemporal=false</code>). Открывается по <code>⋯</code> в шапке чата</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Spring Boot · настройка логов</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="Spring Boot · настройка логов">
|
||
<div class="note">Пустое имя — диалог покажется как «Без названия».</div>
|
||
</div>
|
||
|
||
<label style="display:block;font-size:12px;color:var(--dim);margin:0 0 6px">Агент</label>
|
||
<div class="agent-card" style="margin-bottom:0">
|
||
<div class="avatar" style="background:var(--accent);color:var(--on-accent)">АГ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">agentik</div>
|
||
<div class="ag-addr">http://192.168.88.135:8080/agentik</div>
|
||
</div>
|
||
<div class="state"><span class="d"></span>на связи</div>
|
||
</div>
|
||
|
||
<div class="checkbox-row off" style="margin-top:14px">
|
||
<div class="box"></div>
|
||
<div class="mid">
|
||
<div class="lbl">Временный диалог</div>
|
||
<div class="desc">Задаётся только при создании. Изменить временность существующего диалога нельзя.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="probe-list">
|
||
<div><span>Создан</span><b>1 окт 2026, 22:07</b></div>
|
||
<div><span>Обновлён</span><b>5 окт 2026, 11:30</b></div>
|
||
</div>
|
||
|
||
<div class="danger-zone">
|
||
<div class="lbl">Опасное</div>
|
||
<button class="btn dang" style="width:100%">Удалить диалог</button>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Закрыть</button>
|
||
<button class="btn prim" style="flex:1">Сохранить</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 21 · параметры диалога · временный ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>21 · параметры диалога · временный</b> чекбокс включён и задизейблен (<code>isTemporal=true</code>)</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Черновик ТЗ</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="Черновик ТЗ">
|
||
</div>
|
||
|
||
<label style="display:block;font-size:12px;color:var(--dim);margin:0 0 6px">Агент</label>
|
||
<div class="agent-card" style="margin-bottom:0">
|
||
<div class="avatar" style="background:#C9A886;color:var(--on-accent)">КО</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">coder</div>
|
||
<div class="ag-addr">http://192.168.76.199:8080/agentik</div>
|
||
</div>
|
||
<div class="state"><span class="d"></span>на связи</div>
|
||
</div>
|
||
|
||
<div class="checkbox-row on off" style="margin-top:14px">
|
||
<div class="box"></div>
|
||
<div class="mid">
|
||
<div class="lbl">Временный диалог</div>
|
||
<div class="desc">История не сохраняется на сервере.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="probe-list">
|
||
<div><span>Создан</span><b>только что</b></div>
|
||
</div>
|
||
|
||
<div class="danger-zone">
|
||
<div class="lbl">Опасное</div>
|
||
<button class="btn dang" style="width:100%">Удалить диалог</button>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Закрыть</button>
|
||
<button class="btn prim" style="flex:1">Сохранить</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 22 · параметры диалога · без названия ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>22 · параметры диалога · без названия</b> пустое имя</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Без названия</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="" placeholder="как назвать диалог">
|
||
<div class="note">Пока имя не задано, диалог показывается как «Без названия».</div>
|
||
</div>
|
||
|
||
<label style="display:block;font-size:12px;color:var(--dim);margin:0 0 6px">Агент</label>
|
||
<div class="agent-card" style="margin-bottom:0">
|
||
<div class="avatar" style="background:#86C99A;color:var(--on-accent)">ДМ</div>
|
||
<div class="ag-mid">
|
||
<div class="ag-name">home-assistant</div>
|
||
<div class="ag-addr">http://192.168.76.199:8080/agentik</div>
|
||
</div>
|
||
<div class="state err"><span class="d"></span>не отвечает</div>
|
||
</div>
|
||
|
||
<div class="checkbox-row off" style="margin-top:14px">
|
||
<div class="box"></div>
|
||
<div class="mid">
|
||
<div class="lbl">Временный диалог</div>
|
||
<div class="desc">Задаётся только при создании. Изменить временность существующего диалога нельзя.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="probe-list">
|
||
<div><span>Создан</span><b>сегодня, 09:11</b></div>
|
||
</div>
|
||
|
||
<div class="danger-zone">
|
||
<div class="lbl">Опасное</div>
|
||
<button class="btn dang" style="width:100%">Удалить диалог</button>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Закрыть</button>
|
||
<button class="btn prim" style="flex:1">Сохранить</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 23 · параметры диалога · ошибка сохранения ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>23 · параметры диалога · ошибка</b> сервер не принял имя — warn + «Повторить»</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Spring Boot · настройка логов</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="field">
|
||
<label>Название</label>
|
||
<input type="text" value="Spring Boot · настройка логов">
|
||
</div>
|
||
|
||
<div class="warn">
|
||
<span class="i">⚠</span>
|
||
<span>Не удалось сохранить имя: агент не отвечает. Проверьте связь и попробуйте снова.</span>
|
||
</div>
|
||
|
||
<div class="danger-zone">
|
||
<div class="lbl">Опасное</div>
|
||
<button class="btn dang" style="width:100%">Удалить диалог</button>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Закрыть</button>
|
||
<button class="btn prim" style="flex:1">Повторить</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 24 · удаление диалога · подтверждение ============ -->
|
||
<section class="screen">
|
||
<div class="lbl"><b>24 · удаление диалога · подтверждение</b> открывается по «Удалить диалог» из 20–23. Действие необратимо — warn + красный CTA</div>
|
||
<div class="dialog">
|
||
<div class="d-head">
|
||
<h2>Удалить диалог?</h2>
|
||
<button class="x-btn">✕</button>
|
||
</div>
|
||
<div class="d-body">
|
||
<div class="warn">
|
||
<span class="i">⚠</span>
|
||
<span>Диалог <b>«Spring Boot · настройка логов»</b> и вся его история будут
|
||
безвозвратно удалены с сервера. Это действие нельзя отменить.</span>
|
||
</div>
|
||
<div class="info">
|
||
<span>ℹ</span>
|
||
<span>Корзины нет. Если передумаете — диалог придётся создавать заново, и
|
||
контекст будет потерян.</span>
|
||
</div>
|
||
</div>
|
||
<div class="d-foot">
|
||
<button class="btn" style="flex:1">Отмена</button>
|
||
<button class="btn dang solid" style="flex:1">Удалить</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
</body>
|
||
</html> |