universal-dashboard/examples/README.md

74 lines
2.8 KiB
Markdown
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.

# Примеры панели экосистемы
Самодостаточные демо-страницы для всех поддерживаемых форматов данных. Каждый пример можно хостить отдельно — в папке есть всё необходимое для работы через HTTP-сервер.
## Структура
```
examples/
├── index.html # Оглавление примеров
├── shared/ # Общие ресурсы для всех демо
│ ├── styles.css
│ ├── script.js
│ └── assets/ # SVG-иконки
├── full/ # section → group → item
│ ├── index.html
│ ├── settings.json
│ └── panel-data.json
├── section-items/ # section → item
├── flat/ # корневой items[]
└── mixed/ # items + groups в одном разделе
```
## Запуск
Из папки `examples`:
```bash
cd examples
npx serve .
```
Открой:
- `http://localhost:3000/` — оглавление
- `http://localhost:3000/full/` — полная иерархия
- `http://localhost:3000/section-items/` — раздел без подразделов
- `http://localhost:3000/flat/` — плоский список
- `http://localhost:3000/mixed/` — смешанный раздел
Альтернатива — сервер из корня репозитория:
```bash
cd ecosystem
npx serve .
```
Тогда примеры доступны по пути `/examples/...`.
## Что внутри каждого примера
| Файл | Назначение |
|------|------------|
| `index.html` | Страница панели, подключает `../shared/` |
| `settings.json` | Указывает `./panel-data.json` |
| `panel-data.json` | Демо-данные выбранного формата |
## Обновление shared/
Папка `shared/` — копия `styles.css`, `script.js` и `assets/` из корня проекта. После изменений в основной панели синхронизируй:
```powershell
Copy-Item ..\styles.css, ..\script.js shared\
Copy-Item ..\assets\* shared\assets\ -Recurse -Force
```
## Копирование как шаблон
Чтобы сделать свою панель на базе примера:
1. Скопируй папку нужного формата (например, `flat/`)
2. Отредактируй `panel-data.json`
3. При необходимости добавь типы в `serviceMeta`
4. Хости папку примера вместе с `shared/` (относительные пути уже настроены)