Render technical diagrams with mermaid

2026-05-01 14:41:02 +07:00
parent fc6117c8f5
commit 3a3bd09a8c
20 changed files with 1191 additions and 391 deletions
--- a/docs/.vitepress/theme/components/diagramSources.ts
+++ b/docs/.vitepress/theme/components/diagramSources.ts
@@ -0,0 +1,187 @@
+export const diagramSources: Record<string, string> = {
+  'architecture-overview': `flowchart LR
+    Browser[Браузер клиента]
+    Frontend[web-frontend<br/>Nuxt 4 + Vue 3]
+    Proxy[/api/graphql proxy]
+    Backend[apollo-backend<br/>Apollo Server + Express]
+    Prisma[Prisma ORM]
+    Db[(PostgreSQL)]
+    Vault[Vault]
+    OneC[1С]
+    Bots[Telegram / MAX / email]
+    Dokploy[Dokploy]
+
+    Browser --> Frontend
+    Frontend --> Proxy
+    Proxy --> Backend
+    Backend --> Prisma
+    Prisma --> Db
+    Backend -.bootstrap env.-> Vault
+    Backend -.sync / events.-> OneC
+    Backend -.notifications.-> Bots
+    Frontend -.deploy.-> Dokploy
+    Backend -.deploy.-> Dokploy`,
+  'component-map': `flowchart LR
+    subgraph UI[UI и маршруты]
+      Pages[app/pages]
+      Components[app/components]
+      Composables[app/composables]
+      Middleware[middleware / plugins]
+    end
+
+    subgraph Transport[Контракт и transport]
+      Ops[graphql/operations]
+      Generated[generated.ts]
+      Apollo[Apollo client]
+      Api[server/api/graphql]
+    end
+
+    subgraph Server[Backend logic]
+      Schema[schema.graphql]
+      Resolvers[resolvers.js]
+      Auth[auth.js / access.js]
+      Context[context.js]
+      Messenger[messenger / telegram / max]
+    end
+
+    subgraph Data[Data layer]
+      Prisma[prisma-client.js]
+      PrismaSchema[schema.prisma]
+      Db[(PostgreSQL)]
+    end
+
+    Pages --> Components
+    Pages --> Composables
+    Components --> Composables
+    Composables --> Apollo
+    Middleware --> Pages
+    Ops --> Generated
+    Generated --> Apollo
+    Apollo --> Api
+    Api --> Schema
+    Schema --> Resolvers
+    Resolvers --> Auth
+    Resolvers --> Context
+    Resolvers --> Messenger
+    Resolvers --> Prisma
+    Prisma --> PrismaSchema
+    Prisma --> Db`,
+  'database-model': `classDiagram
+    direction LR
+
+    class Company
+    class User
+    class CounterpartyProfile
+    class DeliveryAddress
+    class RegistrationRequest
+    class Invitation
+    class MessengerConnection
+    class Product
+    class Warehouse
+    class ProductStock
+    class CatalogProductTypeSetting
+    class Cart
+    class CartItem
+    class Order
+    class OrderItem
+    class OrderStatusEvent
+    class ReferralLink
+    class BonusTransaction
+    class RewardWithdrawalRequest
+
+    Company "1" --> "*" User : users
+    User "1" --> "0..1" CounterpartyProfile : profile
+    User "1" --> "*" DeliveryAddress : addresses
+    User "1" --> "*" MessengerConnection : channels
+    User "1" --> "0..1" Cart : cart
+    User "1" --> "*" Order : orders
+    User "1" --> "*" RegistrationRequest : requests
+    User "1" --> "*" Invitation : invitations
+    Product "1" --> "*" ProductStock : balances
+    Warehouse "1" --> "*" ProductStock : inventory
+    Product "1" --> "*" CartItem : cartItems
+    Product "1" --> "*" OrderItem : orderItems
+    Cart "1" --> "*" CartItem : items
+    Order "1" --> "*" OrderItem : items
+    Order "1" --> "*" OrderStatusEvent : history
+    User "1" --> "*" BonusTransaction : bonus
+    User "1" --> "*" RewardWithdrawalRequest : withdrawals
+    User "1" --> "*" ReferralLink : referrals
+    CatalogProductTypeSetting --> Product : productType`,
+  dashboard: `flowchart TB
+    subgraph Page[Главная страница клиента]
+      Header[Header / навигация]
+      Quick[Быстрые действия]
+      Active[Актуальные заказы и заявки]
+      Notes[Последние уведомления]
+      Bonus[Бонусный блок]
+    end
+
+    Header --> Quick --> Active --> Notes --> Bonus`,
+  'catalog-grid': `flowchart TB
+    subgraph Catalog[Каталог продукции]
+      Title[Заголовок раздела]
+      Search[Поиск]
+      Grid[Сетка карточек товарных направлений]
+      Cards[Упаковочный скотч | Алюминиевый скотч | Крепп | Вспененный | Двусторонний ПП | Двусторонний PVC]
+    end
+
+    Title --> Search --> Grid --> Cards`,
+  'product-card': `flowchart TB
+    subgraph ProductPage[Карточка товара]
+      Title[Заголовок товара и навигация]
+      subgraph TopRow[Верхний блок]
+        Image[Изображение товара]
+        Params[Параметры выбора]
+        Action[SKU / действие В корзину]
+      end
+      Help[Пояснения по параметрам]
+      Table[Таблица доступных вариантов]
+    end
+
+    Title --> TopRow --> Help --> Table`,
+  cart: `flowchart TB
+    subgraph CartPage[Корзина]
+      Items[Список выбранных позиций]
+      Delivery[Адрес доставки]
+      Comment[Комментарий клиента]
+      Submit[Отправить заявку]
+    end
+
+    Items --> Delivery --> Comment --> Submit`,
+  'client-order': `flowchart TB
+    subgraph ClientOrder[Карточка заявки / заказа]
+      Summary[Номер документа и статус]
+      Composition[Состав позиций]
+      Terms[Стоимость и условия поставки]
+      History[История изменений]
+    end
+
+    Summary --> Composition --> Terms --> History`,
+  'bonus-cabinet': `flowchart TB
+    subgraph BonusPage[Бонусный кабинет]
+      Balance[Текущий бонусный баланс]
+      History[История операций]
+      Referrals[Реферальные связи]
+      Action[Подача заявки на использование или вывод]
+    end
+
+    Balance --> History --> Referrals --> Action`,
+  'manager-order': `flowchart TB
+    subgraph ManagerOrder[Карточка обработки заявки]
+      Summary[Клиент / контрагент / менеджер]
+      Payload[Состав заявки или расчетный payload]
+      Terms[Стоимость и условия поставки]
+      Actions[Опубликовать условия / перевести в работу / отменить]
+    end
+
+    Summary --> Payload --> Terms --> Actions`,
+  'manager-orders': `flowchart TB
+    subgraph ManagerOrders[Список заказов менеджера]
+      Header[Заголовок раздела]
+      Filters[Фильтры: статус / клиент / период]
+      Table[Таблица заказов]
+    end
+
+    Header --> Filters --> Table`,
+};