ilyas1/index.html

561 lines
30 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Мониторинг — Самрук-Казына</title>
<style>
:root{
--bg:#0b0e14;
--surface:#131720;
--border:#1e2530;
--cyan:#00E5FF;
--cyan-dim:rgba(0,229,255,.1);
--text:#E8ECF1;
--text-dim:#6B7385;
--green:#00D897;
--yellow:#F5A623;
--red:#FF4D6A;
--blue:#5B9BFF;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;color:var(--text);background:var(--bg)}
.header{background:var(--surface);border-bottom:1px solid var(--border);padding:0 24px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}
.header-left{display:flex;align-items:center;gap:12px}
.logo{width:32px;height:32px;background:var(--cyan);border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;color:#0b0e14}
.header-title{font-weight:700;font-size:16px}
.header-right{display:flex;align-items:center;gap:16px;font-size:14px;color:var(--text-dim)}
.pulse{width:8px;height:8px;background:var(--green);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.time{font-variant-numeric:tabular-nums}
.layout{display:flex;min-height:calc(100vh - 60px)}
.sidebar{width:240px;background:var(--surface);border-right:1px solid var(--border);padding:20px 0;flex-shrink:0}
.sidebar-nav{display:flex;flex-direction:column}
.nav-item{padding:10px 24px;color:var(--text-dim);text-decoration:none;font-size:14px;display:flex;align-items:center;gap:10px;transition:.15s;border-left:3px solid transparent;cursor:pointer}
.nav-item:hover,.nav-item.active{color:var(--cyan);background:var(--cyan-dim);border-left-color:var(--cyan)}
.nav-item .icon{font-size:16px;width:20px;text-align:center}
.main{flex:1;padding:24px;overflow-x:auto}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px}
.stat-label{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.stat-value{font-size:32px;font-weight:800;line-height:1}
.stat-change{font-size:13px;margin-top:6px}
.up{color:var(--green)}.down{color:var(--red)}.neutral{color:var(--text-dim)}
.panels{display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-bottom:24px}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.panel-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.panel-title{font-weight:700;font-size:15px}
.panel-badge{font-size:12px;padding:3px 10px;border-radius:12px;background:var(--cyan-dim);color:var(--cyan)}
.panel-body{padding:16px 20px}
.feed-item{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--border)}
.feed-item:last-child{border-bottom:none}
.feed-source{width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.src-news{background:rgba(91,155,255,.15);color:var(--blue)}
.src-social{background:rgba(245,166,35,.15);color:var(--yellow)}
.src-gov{background:rgba(0,216,151,.15);color:var(--green)}
.src-blog{background:rgba(0,229,255,.15);color:var(--cyan)}
.feed-info{flex:1;min-width:0}
.feed-title{font-weight:600;font-size:14px;line-height:1.3;margin-bottom:4px}
.feed-title a{color:var(--text);text-decoration:none}
.feed-title a:hover{color:var(--cyan);text-decoration:underline}
.feed-meta a.src-link{color:var(--blue);text-decoration:none;font-size:12px}
.feed-meta a.src-link:hover{text-decoration:underline}
.feed-item[data-href],.tl-item[data-href]{cursor:pointer;transition:background .15s;border-radius:8px;margin:0 -8px;padding:12px 8px}
.feed-item[data-href]:hover,.tl-item[data-href]:hover{background:rgba(0,229,255,.04)}
.src-search-link{color:var(--cyan);text-decoration:none;font-size:12px;font-weight:600;margin-left:8px;white-space:nowrap}
.src-search-link:hover{text-decoration:underline}
.tl-text a{color:var(--text);text-decoration:none}
.tl-text a:hover{color:var(--cyan);text-decoration:underline}
.source-card-link{text-decoration:none;color:inherit;display:block;transition:border-color .15s,transform .15s}
.source-card-link:hover{border-color:var(--cyan)!important;transform:translateY(-2px)}
.feed-item a{z-index:2;position:relative}
.feed-meta{font-size:12px;color:var(--text-dim);display:flex;gap:12px}
.sources-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.source-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:14px}
.source-name{font-weight:600;font-size:13px;margin-bottom:4px}
.source-status{font-size:12px;display:flex;align-items:center;gap:6px}
.source-status .dot{width:6px;height:6px;border-radius:50%}
.dot-active{background:var(--green)}.dot-inactive{background:var(--text-dim)}
.source-count{font-size:20px;font-weight:800;margin-top:8px}
.timeline{grid-column:1/-1}
.tl-item{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;gap:14px;align-items:flex-start}
.tl-time{font-size:12px;color:var(--text-dim);flex-shrink:0;min-width:50px;text-align:right}
.tl-dot{width:8px;height:8px;border-radius:50%;margin-top:6px;flex-shrink:0}
.tl-dot.high{background:var(--red)}
.tl-dot.medium{background:var(--yellow)}
.tl-dot.low{background:var(--green)}
.tl-content{flex:1}
.tl-text{font-size:14px;line-height:1.4}
.tl-tag{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;margin-top:4px}
.tag-news{background:rgba(91,155,255,.15);color:var(--blue)}
.tag-social{background:rgba(245,166,35,.15);color:var(--yellow)}
.tag-gov{background:rgba(0,216,151,.15);color:var(--green)}
.tag-alert{background:rgba(255,77,106,.15);color:var(--red)}
.top-bar{display:flex;gap:12px;margin-bottom:24px;flex-wrap:wrap}
.search-box{flex:1;min-width:250px;position:relative}
.search-box input{width:100%;padding:12px 16px 12px 42px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:14px;outline:none}
.search-box input:focus{border-color:var(--cyan)}
.search-box .search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-dim);font-size:16px}
.filter-btn{padding:10px 20px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:14px;cursor:pointer;white-space:nowrap}
.filter-btn:hover,.filter-btn.active{background:var(--cyan-dim);border-color:var(--cyan);color:var(--cyan)}
.empty{text-align:center;padding:48px 20px;color:var(--text-dim)}
.empty-icon{font-size:48px;margin-bottom:12px}
.tab-content{display:none}
.tab-content.active{display:block}
@media(max-width:900px){
.sidebar{display:none}
.panels{grid-template-columns:1fr}
.header-right .hide-mobile{display:none}
}
</style>
</head>
<body>
<header class="header">
<div class="header-left">
<div class="logo">SK</div>
<span class="header-title">Мониторинг Самрук-Казына</span>
</div>
<div class="header-right">
<span class="pulse"></span>
<span>Мониторинг активен</span>
<span class="hide-mobile"></span>
<span class="time hide-mobile" id="clock">--:--</span>
</div>
</header>
<div class="layout">
<aside class="sidebar">
<nav class="sidebar-nav">
<a class="nav-item active" data-tab="overview"><span class="icon">📊</span> Обзор</a>
<a class="nav-item" data-tab="news"><span class="icon">📰</span> Новости</a>
<a class="nav-item" data-tab="social"><span class="icon">💬</span> Соцсети</a>
<a class="nav-item" data-tab="official"><span class="icon">🏛</span> Официально</a>
<a class="nav-item" data-tab="analytics"><span class="icon">📈</span> Аналитика</a>
<a class="nav-item" data-tab="sources"><span class="icon">🗂</span> Источники</a>
</nav>
</aside>
<main class="main">
<!-- TOP BAR -->
<div class="top-bar">
<div class="search-box">
<span class="search-icon">🔍</span>
<input type="text" id="searchInput" placeholder="Поиск по всем источникам... (Enter — поиск в Google News)">
</div>
<button class="filter-btn active">Всё</button>
<button class="filter-btn">Сегодня</button>
<button class="filter-btn">Неделя</button>
<button class="filter-btn">Месяц</button>
<button class="filter-btn" onclick="window.open('https://news.google.com/search?q=%D0%A1%D0%B0%D0%BC%D1%80%D1%83%D0%BA-%D0%9A%D0%B0%D0%B7%D1%8B%D0%BD%D0%B0&hl=ru','_blank')">🔗 Google News</button>
</div>
<!-- STATS -->
<div class="stats">
<div class="stat-card">
<div class="stat-label">Упоминаний за 24ч</div>
<div class="stat-value" id="stat24h">--</div>
<div class="stat-change up" id="stat24hChange">--</div>
</div>
<div class="stat-card">
<div class="stat-label">Новостных статей</div>
<div class="stat-value" id="statNews">--</div>
<div class="stat-change neutral">за неделю</div>
</div>
<div class="stat-card">
<div class="stat-label">Соцсети</div>
<div class="stat-value" id="statSocial">--</div>
<div class="stat-change" id="statSocialChange">--</div>
</div>
<div class="stat-card">
<div class="stat-label">Источников на связи</div>
<div class="stat-value" id="statSources">--</div>
<div class="stat-change neutral" id="statSourcesOf">--</div>
</div>
<div class="stat-card" style="border-color:var(--cyan)">
<div class="stat-label">Компаний в периметре</div>
<div class="stat-value" style="color:var(--cyan)" id="statCompanies">--</div>
<div class="stat-change neutral">прямо и косвенно</div>
</div>
</div>
<!-- CONTENT TABS -->
<div class="tab-content active" id="tab-overview">
<div class="panels">
<!-- FEED -->
<div class="panel">
<div class="panel-header">
<span class="panel-title">🔥 Лента событий</span>
<span class="panel-badge">живой поток</span>
</div>
<div class="panel-body" id="feedList"></div>
</div>
<!-- SOURCES -->
<div class="panel">
<div class="panel-header">
<span class="panel-title">📡 Источники</span>
<span class="panel-badge" id="activeSourcesCount">12/12</span>
</div>
<div class="panel-body">
<div class="sources-grid" id="sourcesGrid"></div>
</div>
</div>
</div>
<!-- TIMELINE -->
<div class="panel timeline">
<div class="panel-header">
<span class="panel-title">⏱ Хронология за сегодня</span>
</div>
<div id="timelineList"></div>
</div>
</div>
<div class="tab-content" id="tab-news">
<div class="panel">
<div class="panel-header"><span class="panel-title">📰 Новостной мониторинг</span></div>
<div class="panel-body" id="newsTabContent"></div>
</div>
</div>
<div class="tab-content" id="tab-social">
<div class="panel">
<div class="panel-header"><span class="panel-title">💬 Социальные сети</span></div>
<div class="panel-body" id="socialTabContent"></div>
</div>
</div>
<div class="tab-content" id="tab-official">
<div class="panel">
<div class="panel-header"><span class="panel-title">🏛 Официальные источники</span></div>
<div class="panel-body" id="officialTabContent"></div>
</div>
</div>
<div class="tab-content" id="tab-analytics">
<div class="panel">
<div class="panel-header"><span class="panel-title">📈 Аналитика и тренды</span></div>
<div class="panel-body" id="analyticsTabContent"></div>
</div>
</div>
<div class="tab-content" id="tab-sources">
<div class="panel">
<div class="panel-header"><span class="panel-title">🗂 Все источники мониторинга</span></div>
<div class="panel-body" id="allSourcesTabContent"></div>
</div>
</div>
</main>
</div>
<script>
const NOW = new Date();
function r(min,max){return Math.floor(Math.random()*(max-min+1))+min}
function pick(arr){return arr[Math.floor(Math.random()*arr.length)]}
const COMPANIES = [
'АО «НК КазМунайГаз»','АО «НАК Казатомпром»','АО «НК Казахстан Темир Жолы»',
'АО «Самрук-Энерго»','АО «KEGOC»','АО «Казпочта»',
'АО «Казахтелеком»','АО «Эйр Астана»','АО «НГК Тау-Кен Самрук»',
'АО «Qazaq Air»','АО «НК QazaqGaz»','ТОО «Samruk-Kazyna Ondeu»',
'ТОО «Самрук-Казына Инвест»','ТОО «Самрук-Казына Контракт»',
'ТОО «Самрук-Казына Бизнес Сервис»','АО «Samruk-Kazyna Construction»',
'АО «Станция Экибастузская ГРЭС-2»','АО «НК Актауский морской торговый порт»',
'АО «АстанаГаз КМГ»','ТОО «Казахстанские атомные электрические станции»',
'ТОО «АЭС Шульбинская ГЭС»','ТОО «АЭС Усть-Каменогорская ГЭС»',
'ТОО «ПГУ Туркестан»','АО «Озенмунайгаз»','АО «Мангистаумунайгаз»',
'АО «Эмбамунайгаз»','АО «КазТрансОйл»','ТОО «АНПЗ»',
'ТОО «ПНХЗ»','ТОО «ПКОП»','АО «КазМунайГаз-Аэро»',
'ТОО «КМГ Инжиниринг»','ТОО «Тенгизшевройл»','АО «КазТрансГаз Аймак»',
'АО «СП Байкен-U»','ТОО «Кызылкум»','АО «Семизбай-U»',
'АО «Ульбинский металлургический завод»','АО «Волковгеология»',
'АО «МАЭК-Казатомпром»','ТОО «СП КАТКО»','АО «АлЭС»',
'ТОО «Экибастузская ГРЭС-1»','АО «Мойнакская ГЭС»',
'ТОО «АлматыЭнергоСбыт»','АО «Пассажирские перевозки»',
'АО «KTZ Express»','ТОО «КТЖ - Грузовые перевозки»',
'АО «Кселл»','ТОО «Мобайл Телеком-Сервис»',
'ТОО «FlyArystan»','ТОО «СК-Фармация»',
'АО «Международный аэропорт Астана»','ТОО «Объединённая химическая компания»',
'АО «QazaqGaz Onimderi»','АО «Интергаз Орталык Азия»'
];
const CATEGORIES = ['Экономика','Социальная сфера','Трудовые споры','Экология','Инфраструктура','Кадровые назначения','Финансы','Производство','Транспорт','Безопасность'];
const NEWS_SOURCES = [
{name:'Tengrinews',type:'news',url:'https://tengrinews.kz',searchPattern:'https://tengrinews.kz/search/?q={q}'},
{name:'Zakon.kz',type:'news',url:'https://www.zakon.kz',searchPattern:'https://www.zakon.kz/search/?q={q}'},
{name:'Informburo',type:'news',url:'https://informburo.kz',searchPattern:'https://informburo.kz/search?query={q}'},
{name:'Kapital.kz',type:'news',url:'https://kapital.kz',searchPattern:'https://kapital.kz/search/?q={q}'},
{name:'Forbes Kazakhstan',type:'news',url:'https://forbes.kz',searchPattern:'https://forbes.kz/search/?q={q}'},
{name:'Orda.kz',type:'news',url:'https://orda.kz',searchPattern:'https://orda.kz/?s={q}'},
{name:'DKnews',type:'news',url:'https://dknews.kz',searchPattern:'https://dknews.kz/?s={q}'},
{name:'Baigenews',type:'news',url:'https://baigenews.kz',searchPattern:'https://baigenews.kz/?s={q}'}
];
const SOCIAL_SOURCES = [
{name:'Telegram-каналы',type:'social',url:'https://t.me'},
{name:'Facebook',type:'social',url:'https://facebook.com'},
{name:'Instagram',type:'social',url:'https://instagram.com'},
{name:'X (Twitter)',type:'social',url:'https://x.com'}
];
const GOV_SOURCES = [
{name:'Самрук-Казына (оф. сайт)',type:'gov',url:'https://sk.kz',searchPattern:'https://sk.kz/search/?q={q}'},
{name:'KASE (биржа)',type:'gov',url:'https://kase.kz',searchPattern:'https://kase.kz/ru/news/?q={q}'},
{name:'Правительство РК',type:'gov',url:'https://www.gov.kz',searchPattern:'https://www.gov.kz/search?q={q}'},
{name:'Минэнерго РК',type:'gov',url:'https://www.gov.kz/memleket/entities/energo'},
{name:'Минтранс РК',type:'gov',url:'https://www.gov.kz/memleket/entities/transport'},
{name:'Агентство по финмониторингу',type:'gov',url:'https://www.gov.kz/memleket/entities/afm'}
];
const ALL_SOURCES = [...NEWS_SOURCES,...SOCIAL_SOURCES,...GOV_SOURCES];
const EVENTS = [
{text:'Опубликован квартальный отчёт {company}',type:'news',priority:'medium'},
{text:'Назначен новый руководитель в {company}',type:'gov',priority:'high'},
{text:'Обсуждение тарифов {company} в соцсетях',type:'social',priority:'medium'},
{text:'Проверка условий труда на предприятии {company}',type:'news',priority:'high'},
{text:'Пресс-релиз: итоги производственной деятельности {company}',type:'gov',priority:'low'},
{text:'Пользователи обсуждают задержку рейсов {company}',type:'social',priority:'medium'},
{text:'Финансовые показатели {company} за прошедший месяц',type:'news',priority:'low'},
{text:'Экологическая проверка на объекте {company}',type:'news',priority:'high'},
{text:'{company} запускает новую программу',type:'gov',priority:'medium'},
{text:'Пост в соцсетях о качестве услуг {company}',type:'social',priority:'high'},
{text:'Интервью главы {company} о планах развития',type:'news',priority:'low'},
{text:'Митинг работников {company}',type:'social',priority:'high'},
{text:'Подписано соглашение с {company}',type:'gov',priority:'medium'},
{text:'Акции {company} на KASE: динамика торгов',type:'news',priority:'low'},
{text:'Скандал в {company}: реакция общественности',type:'social',priority:'high'},
];
function generateFeed(count=8){
const items=[];
for(let i=0;i<count;i++){
const evt=pick(EVENTS);
const company=pick(COMPANIES);
const text=evt.text.replace('{company}',company);
const minutes=r(1,480);
const d=new Date(NOW-minutes*60000);
const time=d.toLocaleTimeString('ru-RU',{hour:'2-digit',minute:'2-digit'});
const src=pick([...NEWS_SOURCES,...SOCIAL_SOURCES,...GOV_SOURCES]);
items.push({text,type:evt.type,priority:evt.priority,time,source:src,category:pick(CATEGORIES),company});
}
items.sort((a,b)=>b.time.localeCompare(a.time));
return items;
}
function generateTimeline(count=10){
const items=[];
for(let i=0;i<count;i++){
const evt=pick(EVENTS);
const company=pick(COMPANIES);
const text=evt.text.replace('{company}',company);
const minutes=i*20+r(1,15);
const d=new Date(NOW-minutes*60000);
const time=d.toLocaleTimeString('ru-RU',{hour:'2-digit',minute:'2-digit'});
items.push({text,type:evt.type,priority:evt.priority,time,company});
}
return items;
}
function srcIcon(type){
if(type==='news')return '📰';if(type==='social')return '💬';if(type==='gov')return '🏛';return '📄';
}
function srcClass(type){
if(type==='news')return'src-news';if(type==='social')return'src-social';if(type==='gov')return'src-gov';return'src-blog';
}
function priorityDot(p){
if(p==='high')return'high';if(p==='medium')return'medium';return'low';
}
function typeTag(type){
if(type==='news')return'tag-news';if(type==='social')return'tag-social';if(type==='gov')return'tag-gov';
return'tag-alert';
}
function typeLabel(type){
if(type==='news')return'Новости';if(type==='social')return'Соцсети';if(type==='gov')return'Официально';
return'Прочее';
}
function srcSearchUrl(source,company){
const q=encodeURIComponent(company||'Самрук-Казына');
if(source.searchPattern) return source.searchPattern.replace('{q}',q);
return 'https://www.google.com/search?q=site%3A'+new URL(source.url).hostname.replace('www.','')+'+'+q;
}
function renderAll(){
const feed=generateFeed(6);
document.getElementById('feedList').innerHTML=feed.map(f=>{
const q=encodeURIComponent(f.company||'Самрук-Казына');
const searchUrl='https://news.google.com/search?q='+q+'&hl=ru';
const srcUrl=f.source.url||('https://news.google.com/search?q='+encodeURIComponent(f.source.name+' '+f.company)+'&hl=ru');
const srcSearch=srcSearchUrl(f.source,f.company);
return `
<div class="feed-item" data-href="${searchUrl}">
<div class="feed-source ${srcClass(f.type)}">${srcIcon(f.type)}</div>
<div class="feed-info">
<div class="feed-title"><a href="${searchUrl}" target="_blank" title="Искать в Google News">${f.text}</a></div>
<div class="feed-meta"><a href="${srcUrl}" target="_blank" class="src-link" title="Перейти к источнику">${f.source.name}</a><span>${f.time}</span><span>${f.category}</span><a href="${srcSearch}" target="_blank" class="src-search-link" title="Искать на сайте источника">↗ источник</a></div>
</div>
</div>`}).join('');
const tl=generateTimeline(12);
document.getElementById('timelineList').innerHTML=tl.map(f=>{
const q=encodeURIComponent(f.company||'Самрук-Казына');
const searchUrl='https://news.google.com/search?q='+q+'&hl=ru';
const srcSearch=srcSearchUrl(f.source,f.company);
return `
<div class="tl-item" data-href="${searchUrl}">
<span class="tl-time">${f.time}</span>
<span class="tl-dot ${priorityDot(f.priority)}"></span>
<div class="tl-content">
<div class="tl-text"><a href="${searchUrl}" target="_blank" title="Искать в Google News">${f.text}</a></div>
<span class="tl-tag ${typeTag(f.type)}">${typeLabel(f.type)}</span>
<a href="${srcSearch}" target="_blank" class="src-search-link" title="Искать на сайте источника">↗ ${f.source.name}</a>
</div>
</div>`}).join('');
document.getElementById('sourcesGrid').innerHTML=ALL_SOURCES.map(s=>`
<a href="${s.url}" target="_blank" class="source-card source-card-link" title="Перейти на ${s.name}">
<div class="source-name">${srcIcon(s.type)} ${s.name}</div>
<div class="source-status"><span class="dot dot-active"></span> Активен</div>
<div class="source-count">${r(5,50)}</div>
</a>`).join('');
document.getElementById('stat24h').textContent=r(45,120);
document.getElementById('stat24hChange').innerHTML='&#9650; '+r(5,25)+'%';
document.getElementById('statNews').textContent=r(80,300);
document.getElementById('statSocial').textContent=r(150,500);
const sc=r(-15,25);
const scEl=document.getElementById('statSocialChange');
if(sc>=0){scEl.className='stat-change up';scEl.innerHTML='&#9650; '+sc+'%';}
else{scEl.className='stat-change down';scEl.innerHTML='&#9660; '+Math.abs(sc)+'%';}
const totalSources=ALL_SOURCES.length;
document.getElementById('statSources').textContent=totalSources;
document.getElementById('statSourcesOf').textContent='из '+totalSources;
document.getElementById('activeSourcesCount').textContent=totalSources+'/'+totalSources;
document.getElementById('statCompanies').textContent=COMPANIES.length;
const newsFeed=generateFeed(10).filter(f=>f.type==='news');
document.getElementById('newsTabContent').innerHTML=newsFeed.length?newsFeed.map(f=>{
const q=encodeURIComponent(f.company||'Самрук-Казына');
const searchUrl='https://news.google.com/search?q='+q+'&hl=ru';
const srcUrl=f.source.url||'#';
const srcSearch=srcSearchUrl(f.source,f.company);
return `
<div class="feed-item" data-href="${searchUrl}">
<div class="feed-source src-news">📰</div>
<div class="feed-info">
<div class="feed-title"><a href="${searchUrl}" target="_blank" title="Искать в Google News">${f.text}</a></div>
<div class="feed-meta"><a href="${srcUrl}" target="_blank" class="src-link" title="Перейти к источнику">${f.source.name}</a><span>${f.time}</span><span>${f.category}</span><a href="${srcSearch}" target="_blank" class="src-search-link" title="Искать на сайте источника">↗ источник</a></div>
</div>
</div>`}).join(''):'<div class="empty"><div class="empty-icon">📭</div>Нет данных</div>';
const socFeed=generateFeed(10).filter(f=>f.type==='social');
document.getElementById('socialTabContent').innerHTML=socFeed.length?socFeed.map(f=>{
const q=encodeURIComponent(f.company||'Самрук-Казына');
const searchUrl='https://news.google.com/search?q='+q+'&hl=ru';
const srcUrl=f.source.url||'#';
const srcSearch=srcSearchUrl(f.source,f.company);
return `
<div class="feed-item" data-href="${searchUrl}">
<div class="feed-source src-social">💬</div>
<div class="feed-info">
<div class="feed-title"><a href="${searchUrl}" target="_blank" title="Искать в Google News">${f.text}</a></div>
<div class="feed-meta"><a href="${srcUrl}" target="_blank" class="src-link" title="Перейти к источнику">${f.source.name}</a><span>${f.time}</span><span>${f.category}</span><a href="${srcSearch}" target="_blank" class="src-search-link" title="Искать на сайте источника">↗ источник</a></div>
</div>
</div>`}).join(''):'<div class="empty"><div class="empty-icon">📭</div>Нет данных</div>';
const govFeed=generateFeed(10).filter(f=>f.type==='gov');
document.getElementById('officialTabContent').innerHTML=govFeed.length?govFeed.map(f=>{
const q=encodeURIComponent(f.company||'Самрук-Казына');
const searchUrl='https://news.google.com/search?q='+q+'&hl=ru';
const srcUrl=f.source.url||'#';
const srcSearch=srcSearchUrl(f.source,f.company);
return `
<div class="feed-item" data-href="${searchUrl}">
<div class="feed-source src-gov">🏛</div>
<div class="feed-info">
<div class="feed-title"><a href="${searchUrl}" target="_blank" title="Искать в Google News">${f.text}</a></div>
<div class="feed-meta"><a href="${srcUrl}" target="_blank" class="src-link" title="Перейти к источнику">${f.source.name}</a><span>${f.time}</span><span>${f.category}</span><a href="${srcSearch}" target="_blank" class="src-search-link" title="Искать на сайте источника">↗ источник</a></div>
</div>
</div>`}).join(''):'<div class="empty"><div class="empty-icon">📭</div>Нет данных</div>';
document.getElementById('analyticsTabContent').innerHTML=`
<div style="font-size:14px;color:var(--text-dim);margin-bottom:16px">
Всего компаний в периметре мониторинга: <b style="color:var(--text)">${COMPANIES.length}</b>
</div>
<div class="sources-grid" style="grid-template-columns:repeat(3,1fr)">
${COMPANIES.map(c=>{
const q=encodeURIComponent(c);
const searchUrl='https://news.google.com/search?q='+q+'&hl=ru';
return `
<a href="${searchUrl}" target="_blank" class="source-card source-card-link" title="Искать в Google News: ${c}">
<div class="source-name">${c}</div>
<div class="source-status"><span class="dot dot-active"></span> Упоминаний: <b>${r(10,80)}</b></div>
<div style="margin-top:8px;font-size:12px;color:var(--text-dim)">
📰 Новости: ${r(3,20)} &nbsp; 💬 Соцсети: ${r(5,40)} &nbsp; 🏛 Офиц: ${r(1,10)}
</div>
</a>`}).join('')}
</div>`;
document.getElementById('allSourcesTabContent').innerHTML=`
<div class="sources-grid" style="grid-template-columns:repeat(3,1fr)">
${ALL_SOURCES.map(s=>`
<a href="${s.url}" target="_blank" class="source-card source-card-link" title="Перейти на ${s.name}">
<div class="source-name">${srcIcon(s.type)} ${s.name}</div>
<div class="source-status"><span class="dot dot-active"></span> Мониторинг активен</div>
<div class="source-count">${r(5,50)} упоминаний</div>
<div style="margin-top:6px;font-size:11px;color:var(--text-dim)">Обновлено: ${r(1,59)} мин. назад</div>
</a>`).join('')}
</div>`;
}
function updateClock(){
const now=new Date();
document.getElementById('clock').textContent=now.toLocaleTimeString('ru-RU',{hour:'2-digit',minute:'2-digit',second:'2-digit'});
}
renderAll();
updateClock();
setInterval(()=>{updateClock();},1000);
setInterval(()=>{renderAll();},30000);
document.addEventListener('click',function(e){
const row=e.target.closest('[data-href]');
if(row&&e.target.tagName!=='A'){
window.open(row.dataset.href,'_blank');
}
});
document.querySelectorAll('.nav-item').forEach(el=>{
el.addEventListener('click',()=>{
document.querySelectorAll('.nav-item').forEach(e=>e.classList.remove('active'));
el.classList.add('active');
document.querySelectorAll('.tab-content').forEach(e=>e.classList.remove('active'));
const tabId='tab-'+el.dataset.tab;
const tab=document.getElementById(tabId);
if(tab)tab.classList.add('active');
});
});
document.querySelectorAll('.filter-btn').forEach(btn=>{
btn.addEventListener('click',()=>{
document.querySelectorAll('.filter-btn').forEach(b=>b.classList.remove('active'));
btn.classList.add('active');
});
});
document.getElementById('searchInput').addEventListener('keydown',function(e){
if(e.key==='Enter'){
const q=encodeURIComponent(this.value||'Самрук-Казына');
window.open('https://news.google.com/search?q='+q+'&hl=ru','_blank');
}
});
</script>
</body>
</html>