feat: publish data source legend
This commit is contained in:
@@ -0,0 +1,23 @@
|
||||
---
|
||||
import SourceBadge from "./SourceBadge.astro";
|
||||
const sourceGroups = [
|
||||
{ source: "rf4-official", text: "официальные таблицы игры" },
|
||||
{ source: "players", text: "сообщения игроков" },
|
||||
{ source: "rf4db", text: "разрешённый community-источник" },
|
||||
{ source: "rf4stat-fishing", text: "разрешённая статистика уловов" },
|
||||
{ source: "rf4stat-post", text: "разрешённые публикации" },
|
||||
{ source: "rf4map", text: "разрешённые точки карты" },
|
||||
{ source: "rf4posts-spot", text: "разрешённые полевые сигналы" },
|
||||
];
|
||||
---
|
||||
<section class="data-legend content-grid" aria-labelledby="legend-title">
|
||||
<div class="data-legend__intro"><span class="overline">Как читать плашки</span><h2 id="legend-title">Легенда данных</h2><p>Цвет означает происхождение, а статус — пригодность записи. Плашка источника ведёт на исходную публикацию, когда ссылка доступна.</p></div>
|
||||
<div class="data-legend__body">
|
||||
<div class="legend-sources">{sourceGroups.map(item => <div><SourceBadge source={item.source}/><span>{item.text}</span></div>)}</div>
|
||||
<div class="legend-quality">
|
||||
<div><i data-quality="verified">✓</i><p><strong>Учтено</strong><span>Проверено и участвует в расчёте активности.</span></p></div>
|
||||
<div><i data-quality="unverified">?</i><p><strong>Ждёт проверки</strong><span>Показывается, но пока не влияет на индекс.</span></p></div>
|
||||
<div><i data-quality="incomplete">!</i><p><strong>Неполные данные</strong><span>Часть полей отсутствует и явно перечислена.</span></p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -3,6 +3,7 @@ import "../styles/global.css";
|
||||
import "../styles/catalog.css";
|
||||
import "../styles/source-status.css";
|
||||
import "../styles/data-passport.css";
|
||||
import "../styles/data-legend.css";
|
||||
import FishingIcon from "../components/FishingIcon.astro";
|
||||
const {
|
||||
title = "RF4 Spotter — свежие точки клёва Russian Fishing 4",
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import SourceBadge from "../components/SourceBadge.astro";
|
||||
import DataLegend from "../components/DataLegend.astro";
|
||||
import { ago, api, plural, type SourceStatus } from "../lib/api";
|
||||
let sources: SourceStatus[] = [], unavailable = false;
|
||||
try { sources = await api<SourceStatus[]>("/api/v1/source-status"); } catch { unavailable = true; }
|
||||
@@ -9,4 +10,5 @@ const labels = { healthy:"Актуален", stale:"Данные устарел
|
||||
<Layout title="Состояние источников — RF4 Spotter" description="Текущее безопасное состояние источников данных RF4 Spotter.">
|
||||
<section class="catalog-hero content-grid"><span class="overline">Прозрачность данных</span><h1>Статус источников</h1><p>Пауза или изменение страницы не удаляют уже опубликованные данные.</p></section>
|
||||
{unavailable ? <div class="state content-grid"><h2>Статус временно недоступен</h2></div> : <section class="source-health-grid content-grid">{sources.map(source => <article data-status={source.status}><div><SourceBadge source={source.source_system}/><span class="health-state"><i></i>{labels[source.status]}</span></div><h2>{source.name}</h2><strong>{source.observations} {plural(source.observations,["наблюдение","наблюдения","наблюдений"])}</strong><p>{source.last_success_at ? `Последнее успешное обновление ${ago(source.last_success_at)}` : "Успешных запусков пока нет"}</p></article>)}</section>}
|
||||
<DataLegend />
|
||||
</Layout>
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
.data-legend{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px;margin-bottom:100px;padding-top:42px;border-top:1px solid #cbd6ce}.data-legend h2{font:400 42px/.95 Georgia,serif;margin:10px 0 14px}.data-legend__intro p{max-width:440px;color:#526662;line-height:1.55}.data-legend__body{display:grid;grid-template-columns:1fr 1fr;gap:30px}.legend-sources{display:grid;gap:8px}.legend-sources>div{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:8px;border-bottom:1px solid #d8e0da}.legend-sources>div>span{color:#687976;font-size:10px;text-align:right}.legend-quality{display:grid;align-content:start;gap:9px}.legend-quality>div{display:grid;grid-template-columns:30px 1fr;gap:10px;padding:10px;border-radius:10px;background:#fff}.legend-quality i{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#e2efcf;color:#49651f;font-style:normal;font-weight:800}.legend-quality i[data-quality="unverified"]{background:#e8e2f4;color:#59438d}.legend-quality i[data-quality="incomplete"]{background:#f5e6b8;color:#755609}.legend-quality p{display:flex;flex-direction:column;margin:0}.legend-quality strong{font-size:12px}.legend-quality span{margin-top:3px;color:#687976;font-size:10px;line-height:1.35}@media(max-width:900px){.data-legend{grid-template-columns:1fr;gap:25px}.data-legend__body{grid-template-columns:1fr 1fr}}@media(max-width:620px){.data-legend__body{grid-template-columns:1fr}}
|
||||
Reference in New Issue
Block a user