frontend: Vite+TypeScript scaffold (types, api) — not wired to static yet

2026-07-17 15:41:13 +00:00 · 2026-07-17 15:41:13 +00:00 · c6363cd8cf
commit c6363cd8cf
parent 6c47dada00
9 changed files with 1309 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -1,3 +1,5 @@
 *.bak-*
 *.predeploy-*
 __pycache__/
+node_modules/
+dist/
--- a/frontend/index.html
+++ b/frontend/index.html
@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="ru">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>mapdash — frontend scaffold</title>
+</head>
+<body>
+  <div id="app"></div>
+  <script type="module" src="/src/main.ts"></script>
+</body>
+</html>
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
--- a/frontend/package.json
+++ b/frontend/package.json
@ -0,0 +1,19 @@
+{
+  "name": "mapdash-frontend",
+  "private": true,
+  "version": "0.1.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "typecheck": "tsc --noEmit",
+    "build": "tsc --noEmit && vite build"
+  },
+  "dependencies": {
+    "vis-data": "^7.1.9",
+    "vis-timeline": "^7.7.3"
+  },
+  "devDependencies": {
+    "typescript": "^5.6.3",
+    "vite": "^5.4.10"
+  }
+}
--- a/frontend/src/api.ts
+++ b/frontend/src/api.ts
@ -0,0 +1,26 @@
+// Typed wrappers around the mapdash HTTP API. All network access for the app
+// goes through here, so response shapes stay in one typed place.
+import type { Meta, Board, Booking, Filters } from './types';
+
+function buildQuery(f: Filters): string {
+  const params = new URLSearchParams({
+    city: f.cities.join(','),
+    dimension: f.dimensions.join(','),
+    search: f.search,
+  });
+  return params.toString();
+}
+
+async function getJson<T>(url: string): Promise<T> {
+  const res = await fetch(url);
+  if (!res.ok) {
+    throw new Error(`Request failed: ${url} -> HTTP ${res.status}`);
+  }
+  return (await res.json()) as T;
+}
+
+export const api = {
+  meta: (): Promise<Meta> => getJson<Meta>('/api/meta'),
+  boards: (f: Filters): Promise<Board[]> => getJson<Board[]>('/api/boards?' + buildQuery(f)),
+  bookings: (f: Filters): Promise<Booking[]> => getJson<Booking[]>('/api/bookings?' + buildQuery(f)),
+};
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@ -0,0 +1,23 @@
+// Scaffold entry point. NOT wired into production yet — the live UI is still
+// served from /opt/mapdash/static/index.html. This only exercises the typed
+// api/types modules so the toolchain (tsc + vite) has a real entry to compile.
+import { api } from './api';
+import type { Filters } from './types';
+
+const NO_FILTERS: Filters = { cities: [], dimensions: [], search: '' };
+
+async function bootstrap(): Promise<void> {
+  const meta = await api.meta();
+  const [boards, bookings] = await Promise.all([
+    api.boards(NO_FILTERS),
+    api.bookings(NO_FILTERS),
+  ]);
+  const app = document.getElementById('app');
+  if (app) {
+    app.textContent =
+      `meta: ${meta.cities.length} cities / ${meta.dimensions.length} dimensions; ` +
+      `boards: ${boards.length}; bookings: ${bookings.length}`;
+  }
+}
+
+void bootstrap();
--- a/frontend/src/types.ts
+++ b/frontend/src/types.ts
@ -0,0 +1,38 @@
+// Domain types — mirror the JSON returned by the FastAPI backend (main.py).
+// Keeping these in one place lets TypeScript catch drift between the frontend
+// and the ClickHouse-backed API (e.g. a renamed or missing field) at build time.
+
+/** GET /api/meta */
+export interface Meta {
+  cities: string[];
+  dimensions: string[];
+}
+
+/** One row of GET /api/boards (grouped per board_id). */
+export interface Board {
+  board_id: string;
+  board_address: string;
+  board_city: string;
+  board_dimension: string;
+}
+
+/** One row of GET /api/bookings. task_id/task_status added in the July 2026 change. */
+export interface Booking {
+  board_id: string;
+  task_id: string;
+  task_status: string;
+  start_date: string; // ISO date YYYY-MM-DD
+  end_date: string;   // ISO date YYYY-MM-DD
+  brand: string;
+  company_name: string;
+}
+
+/** Current filter selection shared by boards/bookings queries. */
+export interface Filters {
+  cities: string[];
+  dimensions: string[];
+  search: string;
+}
+
+/** task_status value that marks an archived booking (painted slate #708090). */
+export const ARCHIVED_STATUS = 'РК. Архив';
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "skipLibCheck": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "isolatedModules": true,
+    "verbatimModuleSyntax": true
+  },
+  "include": ["src"]
+}
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@ -0,0 +1,12 @@
+import { defineConfig } from 'vite';
+
+// Scaffold config: build output goes to frontend/dist for now (does NOT touch the
+// live /opt/mapdash/static). In the full-migration phase we switch outDir to
+// '../static' so `vite build` produces the served bundle directly.
+export default defineConfig({
+  root: '.',
+  build: {
+    outDir: 'dist',
+    emptyOutDir: true,
+  },
+});