Alex
de0f8aecf2
- Создана форма деплоя TreasuryModule с детальными настройками казны - Создана форма деплоя TimelockModule с настройками временных задержек - Создана форма деплоя DLEReader с простой конфигурацией - Добавлены маршруты и индексы для всех модулей - Исправлены пути импорта BaseLayout - Добавлены авторские права во все файлы - Улучшена архитектура деплоя модулей отдельно от основного DLE
5.8 KiB
5.8 KiB
Архитектура фронтенда DLE
📁 Структура сервисов
🎯 Принцип разделения ответственности
Каждый сервис отвечает за свою область функциональности:
services/
├── dleV2Service.js - Основные функции DLE (создание, чтение, управление)
├── modulesService.js - Управление модулями DLE
├── proposalsService.js - Управление предложениями и голосованием
├── tokensService.js - Работа с токенами и балансами
├── analyticsService.js - Аналитические данные и статистика
├── multichainService.js - Мультичейн функциональность
└── index.js - Индексный файл для удобного импорта
🔧 Использование сервисов
Импорт отдельных сервисов:
import { getDLEInfo } from '@/services/dleV2Service.js';
import { createAddModuleProposal } from '@/services/modulesService.js';
import { createProposal } from '@/services/proposalsService.js';
import { getTokenBalance } from '@/services/tokensService.js';
Импорт через индексный файл:
import {
getDLEInfo,
createAddModuleProposal,
createProposal,
getTokenBalance
} from '@/services/index.js';
📄 Страницы управления DLE
🎨 Компоненты страниц:
| Страница | Файл | Используемые сервисы | Описание |
|---|---|---|---|
| Модули | ModulesView.vue |
modulesService.js |
Управление модулями DLE |
| Предложения | DleProposalsView.vue |
proposalsService.js |
Управление предложениями |
| Токены | TokensView.vue |
tokensService.js |
Работа с токенами |
| Кворум | QuorumView.vue |
proposalsService.js |
Настройки голосования |
| Аналитика | AnalyticsView.vue |
analyticsService.js |
Аналитические данные |
| История | HistoryView.vue |
dleV2Service.js |
История операций |
| Настройки | SettingsView.vue |
dleV2Service.js |
Настройки DLE |
| Управление DLE | DleManagementView.vue |
- | Добавление DLE в список |
🔄 Архитектурные принципы
1. Разделение ответственности
- Каждый сервис отвечает за свою область
- Функции не дублируются между сервисами
- Четкие границы между модулями
2. Единообразие API
- Все сервисы используют одинаковый формат ответов
- Единообразная обработка ошибок
- Консистентные названия функций
3. Простота использования
- Интуитивно понятные названия функций
- Подробная документация JSDoc
- Примеры использования
4. Масштабируемость
- Легко добавлять новые функции
- Простое тестирование отдельных модулей
- Возможность переиспользования
🛠️ Утилиты
dle-contract.js
Используется только для транзакций через MetaMask:
- Создание предложений
- Голосование
- Исполнение предложений
- Деактивация DLE
utils/websocket.js
Для real-time обновлений:
- Уведомления о новых предложениях
- Обновления статуса голосования
- Синхронизация данных
📊 Статистика кода
| Сервис | Строк | Функций | Описание |
|---|---|---|---|
dleV2Service.js |
220 | 8 | Основные функции DLE |
modulesService.js |
298 | 5 | Управление модулями |
proposalsService.js |
264 | 12 | Управление предложениями |
tokensService.js |
72 | 3 | Работа с токенами |
analyticsService.js |
320 | 16 | Аналитические данные |
multichainService.js |
353 | 18 | Мультичейн функциональность |
🚀 Преимущества новой архитектуры
- ✅ Читаемость - код легко понять и поддерживать
- ✅ Тестируемость - каждый сервис можно тестировать отдельно
- ✅ Переиспользование - функции можно использовать в разных компонентах
- ✅ Масштабируемость - легко добавлять новые функции
- ✅ Производительность - загрузка только нужных модулей
- ✅ Поддержка - простое исправление ошибок и добавление функций