Initial import with GitLab CI/CD and registry deploy flow
This commit is contained in:
Yera All
+7045
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,392 @@
|
||||
<!doctype html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>KonturCC Аналитика</title>
|
||||
<link rel="icon" href="/operator/assets/favicon.svg" type="image/svg+xml" />
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&family=IBM+Plex+Sans:wght@400;500;600&display=swap" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/operator/assets/styles.css?v=track43-chart-hover-tooltips" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="app-shell">
|
||||
<aside class="sidebar">
|
||||
<div class="brand">
|
||||
<div class="brand-mark">K</div>
|
||||
<div>
|
||||
<div class="brand-title">KonturCC</div>
|
||||
<div class="brand-sub">Центр аналитики</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="nav-menu">
|
||||
<div class="nav-group">
|
||||
<div class="nav-label">Рабочие зоны</div>
|
||||
<a class="nav-link" data-shell="operator" data-roles="admin,supervisor,operator,analyst" href="/operator"><span class="nav-bullet"></span>Оператор</a>
|
||||
<a class="nav-link" data-shell="supervisor" data-roles="admin,supervisor" href="/supervisor"><span class="nav-bullet"></span>Супервизор</a>
|
||||
<a class="nav-link active" data-shell="analyst" data-roles="admin,supervisor,analyst" href="/analyst"><span class="nav-bullet"></span>Аналитика</a>
|
||||
<a class="nav-link" data-shell="admin" data-roles="admin" href="/admin"><span class="nav-bullet"></span>Администрирование</a>
|
||||
</div>
|
||||
<div class="nav-group">
|
||||
<div class="nav-label">Разделы</div>
|
||||
<a class="nav-link" href="#analyticsPanel"><span class="nav-bullet"></span>Обзор</a>
|
||||
<a class="nav-link" href="#agentAnalyticsPanel"><span class="nav-bullet"></span>Агенты</a>
|
||||
<a class="nav-link" href="#analyticsTrendBlock"><span class="nav-bullet"></span>Тренд</a>
|
||||
<a class="nav-link" href="#analyticsQueuesBlock"><span class="nav-bullet"></span>Очереди</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="sidebar-footer">
|
||||
<strong>Рабочее место аналитика</strong>
|
||||
<p>Историческая картина по обращениям, каналам и очередям без оперативного мониторинга.</p>
|
||||
<p class="hint" id="sessionInfo">Сессия проверяется...</p>
|
||||
<button id="logoutBtn" class="btn ghost" type="button">Выйти</button>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<section class="workspace">
|
||||
<header class="workspace-topbar reveal">
|
||||
<div class="analytics-topbar-intro">
|
||||
<strong>Историческая аналитика сервиса</strong>
|
||||
<p>Периоды, каналы и очереди в одном окне, без перехода в операционный экран.</p>
|
||||
</div>
|
||||
<div class="topbar-actions">
|
||||
<div class="status-pill" id="gatewayStatus">Данные: проверка...</div>
|
||||
<button id="refreshBtn" class="btn ghost" type="button">Обновить данные</button>
|
||||
<div class="profile-chip">
|
||||
<div class="avatar-badge">AN</div>
|
||||
<div class="profile-meta">
|
||||
<div class="profile-name" id="profileName">Центр аналитики</div>
|
||||
<div class="profile-role" id="profileRole">Историческая аналитика</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="layout">
|
||||
<section class="page-hero reveal">
|
||||
<p class="eyebrow">История сервиса</p>
|
||||
<h1>Аналитика контакт-центра</h1>
|
||||
<p class="hint">Исторические KPI, тренды и структура потока по каналам и очередям в одной витрине.</p>
|
||||
</section>
|
||||
|
||||
<section class="panel reveal analytics-dashboard-panel" id="analyticsPanel">
|
||||
<div class="analytics-head">
|
||||
<div>
|
||||
<p class="eyebrow">Сводка периода</p>
|
||||
<h2>Ключевые метрики и тренды</h2>
|
||||
<p class="hint">Сравнивайте выбранный период с предыдущим окном и быстро переключайтесь между очередями и каналами.</p>
|
||||
</div>
|
||||
<div class="actions compact-actions">
|
||||
<button id="analyticsRefreshBtn" class="btn" type="button">Обновить данные</button>
|
||||
<button id="analyticsResetBtn" class="btn ghost" type="button">Сбросить</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-filter-bar">
|
||||
<div class="row">
|
||||
<label for="analyticsPreset">Период</label>
|
||||
<select id="analyticsPreset">
|
||||
<option value="today">Сегодня</option>
|
||||
<option value="7d" selected>7 дней</option>
|
||||
<option value="30d">30 дней</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsFrom">С</label>
|
||||
<input id="analyticsFrom" type="datetime-local" />
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsTo">По</label>
|
||||
<input id="analyticsTo" type="datetime-local" />
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsQueue">Очередь</label>
|
||||
<select id="analyticsQueue">
|
||||
<option value="all">Все очереди</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsChannel">Канал</label>
|
||||
<select id="analyticsChannel">
|
||||
<option value="all">Все каналы</option>
|
||||
<option value="voice">Голос</option>
|
||||
<option value="telegram">Telegram</option>
|
||||
<option value="whatsapp">WhatsApp</option>
|
||||
<option value="webchat">Веб-чат</option>
|
||||
<option value="email">Email</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-toolkit">
|
||||
<div class="analytics-toolkit-group">
|
||||
<div class="row">
|
||||
<label for="analyticsCompareMode">Сравнение</label>
|
||||
<select id="analyticsCompareMode">
|
||||
<option value="previous" selected>С предыдущим окном</option>
|
||||
<option value="off">Только текущий срез</option>
|
||||
</select>
|
||||
</div>
|
||||
<p id="analyticsSavedViewMeta" class="hint analytics-inline-meta">Сохранённых видов пока нет.</p>
|
||||
</div>
|
||||
<div class="analytics-toolkit-group analytics-toolkit-group-wide">
|
||||
<div class="row">
|
||||
<label for="analyticsSavedViewSelect">Сохранённый вид</label>
|
||||
<select id="analyticsSavedViewSelect">
|
||||
<option value="">Без сохранённого вида</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsSavedViewName">Название вида</label>
|
||||
<input id="analyticsSavedViewName" type="text" placeholder="Например, Telegram за 30 дней" />
|
||||
</div>
|
||||
<div class="actions analytics-toolkit-actions">
|
||||
<button id="analyticsSaveViewBtn" class="btn ghost" type="button">Сохранить вид</button>
|
||||
<button id="analyticsDeleteViewBtn" class="btn ghost" type="button">Удалить</button>
|
||||
<button id="analyticsExportBtn" class="btn" type="button">Экспорт CSV</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="hint analytics-filter-note" id="analyticsRangeHint">Выберите период и при необходимости уточните канал или очередь.</p>
|
||||
<div id="analyticsEmptyState" class="analytics-empty-state" hidden></div>
|
||||
|
||||
<div id="analyticsNarrative" class="analytics-narrative"></div>
|
||||
<div id="analyticsComparePanel" class="analytics-compare-panel" hidden></div>
|
||||
<div id="analyticsOverview" class="summary-grid analytics-overview-grid"></div>
|
||||
|
||||
<section class="analytics-ai-panel" id="aiAnalyticsPanel">
|
||||
<div class="analytics-subhead">
|
||||
<div>
|
||||
<p class="eyebrow">AI-аналитика</p>
|
||||
<h3>AI-сессии в цифровых каналах</h3>
|
||||
<p class="hint">Отдельный блок по Telegram и WhatsApp: закрытие AI, передача оператору, задержка ответа и закрытия без оператора без доступа к текстам сообщений.</p>
|
||||
</div>
|
||||
<div class="row analytics-trend-selector">
|
||||
<label for="aiAnalyticsTrendMetric">AI-метрика</label>
|
||||
<select id="aiAnalyticsTrendMetric">
|
||||
<option value="containment_rate">Закрыто AI</option>
|
||||
<option value="handoff_rate">Передано оператору</option>
|
||||
<option value="ai_latency_avg_ms">Задержка AI</option>
|
||||
<option value="closed_without_operator_rate">Закрыто без оператора</option>
|
||||
<option value="human_touched_rate">С участием оператора</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="aiAnalyticsEmptyState" class="analytics-empty-state" hidden></div>
|
||||
<div id="aiAnalyticsOverview" class="summary-grid analytics-overview-grid ai-analytics-overview"></div>
|
||||
|
||||
<div class="analytics-sections">
|
||||
<article class="analytics-subpanel analytics-subpanel-wide">
|
||||
<h3>AI-тренд по периоду</h3>
|
||||
<p class="hint">Динамика AI по выбранной метрике строится по тем же фильтрам периода, канала и очереди, что и основная витрина.</p>
|
||||
<div id="aiAnalyticsTrendChart" class="analytics-chart-shell"></div>
|
||||
</article>
|
||||
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Покрытие AI-данных</h3>
|
||||
<p class="hint">Проверяем, насколько AI-сессии связаны с обращениями, очередями и данными по задержке ответа для корректной интерпретации отчёта.</p>
|
||||
<div id="aiAnalyticsCoverage" class="analytics-coverage"></div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<article class="analytics-subpanel">
|
||||
<h3>AI и оператор по каналам</h3>
|
||||
<p class="hint">Сравнение полностью автоматических и затронутых оператором сессий по Telegram и WhatsApp без текстов сообщений, записей и AI-сводок.</p>
|
||||
<div id="aiAnalyticsChannelComparison" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
<div class="analytics-sections">
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Исходы AI-сессий</h3>
|
||||
<p class="hint">Клик по исходу открывает полноэкранную детализацию по AI-сессиям только на уровне метаданных.</p>
|
||||
<div id="aiAnalyticsOutcomeTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Причины передачи оператору</h3>
|
||||
<p class="hint">Нажмите на причину, чтобы открыть срез по передачам оператору с той же группой причин.</p>
|
||||
<div id="aiAnalyticsReasonTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="analytics-agent-panel" id="agentAnalyticsPanel">
|
||||
<div class="analytics-subhead">
|
||||
<div>
|
||||
<p class="eyebrow">Агенты</p>
|
||||
<h3>Агентская аналитика</h3>
|
||||
<p class="hint">Нагрузка, обработка и текущие состояния агентов по фактам reporting и данным supervisor без локальных заглушек.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="agentAnalyticsEmptyState" class="analytics-empty-state" hidden></div>
|
||||
<div id="agentAnalyticsOverview" class="summary-grid analytics-overview-grid agent-analytics-overview"></div>
|
||||
<div id="agentAnalyticsStateStrip" class="agent-analytics-state-strip"></div>
|
||||
<div class="analytics-sections">
|
||||
<article class="analytics-subpanel analytics-subpanel-wide">
|
||||
<div class="analytics-subhead">
|
||||
<div>
|
||||
<h3>Тренд по агентам</h3>
|
||||
<p class="hint">Динамика по агентам помогает оценить нагрузку, стабильность обработки и изменение FCR по выбранному окну.</p>
|
||||
</div>
|
||||
<div class="row analytics-trend-selector">
|
||||
<label for="agentAnalyticsTrendMetric">Метрика</label>
|
||||
<select id="agentAnalyticsTrendMetric">
|
||||
<option value="interactions_per_agent">Нагрузка на агента</option>
|
||||
<option value="agents_with_activity">Агенты с активностью</option>
|
||||
<option value="avg_handle_seconds">AHT</option>
|
||||
<option value="fcr_rate">FCR</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="agentAnalyticsTrendChart" class="analytics-chart-shell"></div>
|
||||
</article>
|
||||
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Команды и очереди</h3>
|
||||
<p class="hint">Сводка по командам и очередям, где сейчас сосредоточена агентская нагрузка.</p>
|
||||
<div id="agentAnalyticsTeamTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
</div>
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Агенты по выбранному периоду</h3>
|
||||
<p class="hint">Клик по строке открывает полноэкранную детализацию по обращениям выбранного агента без изменения фильтров витрины.</p>
|
||||
<div id="agentAnalyticsTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
<div class="analytics-sections">
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Смены</h3>
|
||||
<p class="hint">Сравнение ночной, дневной и вечерней смен по обращениям, обработке и FCR.</p>
|
||||
<div id="agentAnalyticsShiftTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="analytics-sections">
|
||||
<article class="analytics-subpanel analytics-subpanel-wide" id="analyticsTrendBlock">
|
||||
<div class="analytics-subhead">
|
||||
<div>
|
||||
<h3>Тренд по периоду</h3>
|
||||
<p class="hint">Динамика по выбранной метрике помогает быстро увидеть изменение нагрузки и качества.</p>
|
||||
</div>
|
||||
<div class="row analytics-trend-selector">
|
||||
<label for="analyticsTrendMetric">Метрика</label>
|
||||
<select id="analyticsTrendMetric">
|
||||
<option value="volume">Обращения</option>
|
||||
<option value="SL">SL</option>
|
||||
<option value="ASA">Ожидание</option>
|
||||
<option value="Abandon">Потери</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="analyticsTrendChart" class="analytics-chart-shell"></div>
|
||||
</article>
|
||||
|
||||
<article class="analytics-subpanel">
|
||||
<h3>Каналы</h3>
|
||||
<p class="hint">Сравнение каналов по объему, обработке и доле ответа за выбранный период.</p>
|
||||
<p class="hint analytics-drilldown-note">Нажмите на строку, чтобы открыть точную детализацию по обращениям этого канала.</p>
|
||||
<div id="analyticsChannelTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="analytics-sections">
|
||||
<article class="analytics-subpanel analytics-subpanel-wide" id="analyticsQueuesBlock">
|
||||
<h3>Очереди</h3>
|
||||
<p class="hint">Очереди отсортированы по объему. Нажмите на строку, чтобы сфокусировать всю витрину на одной очереди.</p>
|
||||
<p class="hint analytics-drilldown-note">Клик по строке открывает точный срез по очереди и не меняет фильтры витрины.</p>
|
||||
<div id="analyticsQueueTable" class="analytics-table-shell"></div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div id="analyticsDrilldownBackdrop" class="analytics-drawer-backdrop" hidden></div>
|
||||
<aside
|
||||
id="analyticsDrilldownDrawer"
|
||||
class="analytics-drawer"
|
||||
hidden
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="analyticsDrilldownTitle"
|
||||
aria-describedby="analyticsDrilldownMeta"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div class="analytics-drawer-head">
|
||||
<div>
|
||||
<p class="eyebrow">Детализация обращений</p>
|
||||
<h2 id="analyticsDrilldownTitle">Детализация обращений</h2>
|
||||
<p id="analyticsDrilldownMeta" class="hint">Выберите карточку обращений, канал или очередь на витрине, чтобы открыть список обращений.</p>
|
||||
</div>
|
||||
<button id="analyticsDrilldownCloseBtn" class="btn ghost" type="button">Закрыть</button>
|
||||
</div>
|
||||
|
||||
<div id="analyticsDrilldownFilters" class="analytics-filter-chips analytics-drawer-filters"></div>
|
||||
|
||||
<div class="analytics-drawer-toolbar">
|
||||
<div class="row analytics-drawer-toolbar-search">
|
||||
<label for="analyticsDrilldownSearch">Поиск</label>
|
||||
<input id="analyticsDrilldownSearch" type="search" placeholder="ID, тема или назначенный" autocomplete="off" />
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsDrilldownStatus">Статус</label>
|
||||
<select id="analyticsDrilldownStatus">
|
||||
<option value="all" selected>Все статусы</option>
|
||||
<option value="new">Новая</option>
|
||||
<option value="in_progress">В работе</option>
|
||||
<option value="escalated">Эскалация</option>
|
||||
<option value="closed">Закрыта</option>
|
||||
<option value="abandoned">Потеряна</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="analyticsDrilldownSort">Сортировка</label>
|
||||
<select id="analyticsDrilldownSort">
|
||||
<option value="created_at:desc" selected>Создано: новые сверху</option>
|
||||
<option value="created_at:asc">Создано: старые сверху</option>
|
||||
<option value="updated_at:desc">Обновлено: новые сверху</option>
|
||||
<option value="updated_at:asc">Обновлено: старые сверху</option>
|
||||
<option value="subject:asc">Тема: А-Я</option>
|
||||
<option value="subject:desc">Тема: Я-А</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="actions compact-actions analytics-drawer-toolbar-actions">
|
||||
<button id="analyticsDrilldownClearBtn" class="btn ghost" type="button">Сбросить</button>
|
||||
<button id="analyticsDrilldownExportBtn" class="btn" type="button">Экспорт CSV</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-drawer-body">
|
||||
<section class="analytics-drawer-list-shell">
|
||||
<div class="analytics-drawer-list-head">
|
||||
<strong>Список обращений</strong>
|
||||
<span id="analyticsDrilldownPageMeta" class="hint">0 из 0</span>
|
||||
</div>
|
||||
<div id="analyticsDrilldownList" class="analytics-drawer-list"></div>
|
||||
<div class="analytics-drawer-pager">
|
||||
<button id="analyticsDrilldownPrevBtn" class="btn ghost" type="button">Назад</button>
|
||||
<button id="analyticsDrilldownNextBtn" class="btn ghost" type="button">Дальше</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="analytics-drawer-detail-shell">
|
||||
<div class="analytics-drawer-list-head">
|
||||
<strong>Карточка обращения</strong>
|
||||
<span class="hint">Лента событий и базовые поля без записей, транскриптов и канального контента.</span>
|
||||
</div>
|
||||
<div id="analyticsDrilldownDetail" class="analytics-drawer-detail"></div>
|
||||
</section>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<input id="sessionUser" type="hidden" value="analyst" />
|
||||
<input id="sessionRole" type="hidden" value="analyst" />
|
||||
|
||||
<script src="/analyst/assets/app.js?v=track43-chart-hover-tooltips"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user