Telegram-Market/telegram-shop
1
1
Fork 0
Code Issues 43 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Complete SmartAdmin Shell Migration #123

New Issue
Closed
opened 2026-07-02 19:27:04 +00:00 by NW · 1 comment
NW commented 2026-07-02 19:27:04 +00:00
Owner
Copy Link

Goal

Полностью перенести оригинальный SmartAdmin shell из шаблона templates/smartadmin/smartadmin-ai-docs/Node.js/SmartAdmin-Full/ вместо текущей самописной Bootstrap-обёртки. Текущий каркас выглядит нецелостно — стили плывут, используются Bootstrap CDN + FontAwesome вместо родных smartapp.min.css, sa-icons.css, waves.min.css, sprite.svg.

Source Template

templates/smartadmin/smartadmin-ai-docs/Node.js/SmartAdmin-Full/

  • public/css/smartapp.min.css — основной CSS SmartAdmin
  • public/webfonts/smartadmin/sa-icons.css — иконки SmartAdmin
  • public/plugins/waves/waves.min.css — ripple-эффект
  • public/icons/sprite.svg — SVG-спрайт иконок
  • public/scripts/core/smartApp.js — ядро SmartAdmin
  • public/scripts/core/smartNavigation.js — навигация
  • public/scripts/core/smartFilter.js — фильтрация списков
  • public/scripts/core/smartSlimscroll.js — кастомный скролл
  • public/plugins/bootstrap/bootstrap.bundle.min.js — Bootstrap 5 (local)
  • public/plugins/waves/waves.min.js — ripple
  • public/plugins/sortablejs/Sortable.min.js — drag-and-drop панелей
  • views/partials/app-html.ejs — DOCTYPE + html
  • views/partials/app-head-css.ejs — CSS includes
  • views/partials/app-header.ejs — оригинальный header
  • views/partials/app-sidebar.ejs — оригинальный sidebar
  • views/partials/app-footer.ejs — оригинальный footer
  • views/partials/app-scripts.ejs — JS includes
  • views/partials/app-notifications.ejs — dropdown уведомлений
  • views/partials/app-pagetitle.ejs — breadcrumbs + title
  • views/auth-login.ejs — login страница SmartAdmin
  • views/dashboard-control-center.ejs / dashboard-marketing.ejs — готовые dashboard шаблоны

Tasks

  • Скопировать все assets из templates/smartadmin/smartadmin-ai-docs/Node.js/SmartAdmin-Full/public/ в src/admin/public/ (css, webfonts, icons, plugins, scripts, img, json, media, sass)
  • Настроить Express EJS engine: app.set('view engine', 'ejs'), app.set('views', path.join(__dirname, 'views'))
  • Переписать src/admin/views/layout.ejs на основе app-html.ejs + app-head-css.ejs + app-footer.ejs + app-scripts.ejs — полный SmartAdmin shell
  • Создать src/admin/views/partials/app-header.ejs — оригинальный SmartAdmin header
  • Создать src/admin/views/partials/app-sidebar.ejs — оригинальный SmartAdmin sidebar
  • Создать src/admin/views/partials/app-notifications.ejs — dropdown уведомлений
  • Создать src/admin/views/partials/app-pagetitle.ejs — breadcrumbs + page title
  • Создать src/admin/views/partials/app-settings.ejs — settings drawer (если нужно)
  • Создать src/admin/views/partials/app-drawer.ejs — app drawer (если нужно)
  • Переписать src/admin/auth.js — login страница на основе auth-login.ejs (форма с EJS, а не HTML-строки)
  • Переписать src/admin/views/dashboard.ejs на основе dashboard-control-center.ejs или dashboard-marketing.ejs — с готовыми панелями, графиками, activity feed, quick actions
  • Переписать все view-файлы: users, products, categories, catalog, purchases, audit, settings, wallets, payment-wallets, seed, locales, locations — использовать SmartAdmin классы
  • Удалить старый самописный CSS style.css (если ещё не удалён)
  • Удалить Bootstrap CDN и Bootswatch CDN из layout
  • Убедиться что все data-action и data-toggleclass атрибуты работают через smartApp.js
  • Убедиться что smartNavigation.js инициализирует sidebar и active state
  • Убедиться что waves.min.js инициализирует ripple-эффект на кнопках
  • Убедиться что smartSlimscroll.js инициализирует кастомный скролл в sidebar
  • Убедиться что smartFilter.js инициализирует фильтрацию меню
  • Убедиться что Sortable.min.js инициализирует drag-and-drop панелей (если используется)

Acceptance Criteria

  • Все страницы используют оригинальный SmartAdmin CSS (smartapp.min.css) и не используют Bootstrap CDN
  • Header выглядит как в оригинальном SmartAdmin (SVG иконки, правильные отступы, правильные dropdown, profile image, notifications, theme toggle, fullscreen)
  • Sidebar выглядит как в оригинальном SmartAdmin (primary-nav, menu-filter, app-logo, nav-footer, backdrop, custom-scroll)
  • Footer выглядит как в оригинальном SmartAdmin (app-footer, app-footer-content, back-to-top)
  • Login страница выглядит как auth-login.ejs из шаблона
  • Dashboard выглядит как dashboard-control-center.ejs или dashboard-marketing.ejs из шаблона
  • Все view-файлы используют правильные SmartAdmin классы и компоненты
  • Нет плывущих стилей, нет самописного CSS-костыля
  • Mobile responsive работает через SmartAdmin mobile-menu-icon и backdrop
  • Все интерактивные элементы работают (sidebar toggle, nav-minified, theme toggle, fullscreen, dropdowns, ripple effect)
  • No JS errors in console
  • Все 12 страниц открываются корректно

Depends on

#111 #121 #122 (эти issues были первой попыткой, их код нужно заменить полностью)

## Goal Полностью перенести оригинальный SmartAdmin shell из шаблона `templates/smartadmin/smartadmin-ai-docs/Node.js/SmartAdmin-Full/` вместо текущей самописной Bootstrap-обёртки. Текущий каркас выглядит нецелостно — стили плывут, используются Bootstrap CDN + FontAwesome вместо родных `smartapp.min.css`, `sa-icons.css`, `waves.min.css`, `sprite.svg`. ## Source Template `templates/smartadmin/smartadmin-ai-docs/Node.js/SmartAdmin-Full/` - `public/css/smartapp.min.css` — основной CSS SmartAdmin - `public/webfonts/smartadmin/sa-icons.css` — иконки SmartAdmin - `public/plugins/waves/waves.min.css` — ripple-эффект - `public/icons/sprite.svg` — SVG-спрайт иконок - `public/scripts/core/smartApp.js` — ядро SmartAdmin - `public/scripts/core/smartNavigation.js` — навигация - `public/scripts/core/smartFilter.js` — фильтрация списков - `public/scripts/core/smartSlimscroll.js` — кастомный скролл - `public/plugins/bootstrap/bootstrap.bundle.min.js` — Bootstrap 5 (local) - `public/plugins/waves/waves.min.js` — ripple - `public/plugins/sortablejs/Sortable.min.js` — drag-and-drop панелей - `views/partials/app-html.ejs` — DOCTYPE + html - `views/partials/app-head-css.ejs` — CSS includes - `views/partials/app-header.ejs` — оригинальный header - `views/partials/app-sidebar.ejs` — оригинальный sidebar - `views/partials/app-footer.ejs` — оригинальный footer - `views/partials/app-scripts.ejs` — JS includes - `views/partials/app-notifications.ejs` — dropdown уведомлений - `views/partials/app-pagetitle.ejs` — breadcrumbs + title - `views/auth-login.ejs` — login страница SmartAdmin - `views/dashboard-control-center.ejs` / `dashboard-marketing.ejs` — готовые dashboard шаблоны ## Tasks - [ ] Скопировать все assets из `templates/smartadmin/smartadmin-ai-docs/Node.js/SmartAdmin-Full/public/` в `src/admin/public/` (css, webfonts, icons, plugins, scripts, img, json, media, sass) - [ ] Настроить Express EJS engine: `app.set('view engine', 'ejs')`, `app.set('views', path.join(__dirname, 'views'))` - [ ] Переписать `src/admin/views/layout.ejs` на основе `app-html.ejs` + `app-head-css.ejs` + `app-footer.ejs` + `app-scripts.ejs` — полный SmartAdmin shell - [ ] Создать `src/admin/views/partials/app-header.ejs` — оригинальный SmartAdmin header - [ ] Создать `src/admin/views/partials/app-sidebar.ejs` — оригинальный SmartAdmin sidebar - [ ] Создать `src/admin/views/partials/app-notifications.ejs` — dropdown уведомлений - [ ] Создать `src/admin/views/partials/app-pagetitle.ejs` — breadcrumbs + page title - [ ] Создать `src/admin/views/partials/app-settings.ejs` — settings drawer (если нужно) - [ ] Создать `src/admin/views/partials/app-drawer.ejs` — app drawer (если нужно) - [ ] Переписать `src/admin/auth.js` — login страница на основе `auth-login.ejs` (форма с EJS, а не HTML-строки) - [ ] Переписать `src/admin/views/dashboard.ejs` на основе `dashboard-control-center.ejs` или `dashboard-marketing.ejs` — с готовыми панелями, графиками, activity feed, quick actions - [ ] Переписать все view-файлы: users, products, categories, catalog, purchases, audit, settings, wallets, payment-wallets, seed, locales, locations — использовать SmartAdmin классы - [ ] Удалить старый самописный CSS `style.css` (если ещё не удалён) - [ ] Удалить Bootstrap CDN и Bootswatch CDN из layout - [ ] Убедиться что все `data-action` и `data-toggleclass` атрибуты работают через `smartApp.js` - [ ] Убедиться что `smartNavigation.js` инициализирует sidebar и active state - [ ] Убедиться что `waves.min.js` инициализирует ripple-эффект на кнопках - [ ] Убедиться что `smartSlimscroll.js` инициализирует кастомный скролл в sidebar - [ ] Убедиться что `smartFilter.js` инициализирует фильтрацию меню - [ ] Убедиться что `Sortable.min.js` инициализирует drag-and-drop панелей (если используется) ## Acceptance Criteria - [ ] Все страницы используют оригинальный SmartAdmin CSS (`smartapp.min.css`) и не используют Bootstrap CDN - [ ] Header выглядит как в оригинальном SmartAdmin (SVG иконки, правильные отступы, правильные dropdown, profile image, notifications, theme toggle, fullscreen) - [ ] Sidebar выглядит как в оригинальном SmartAdmin (primary-nav, menu-filter, app-logo, nav-footer, backdrop, custom-scroll) - [ ] Footer выглядит как в оригинальном SmartAdmin (app-footer, app-footer-content, back-to-top) - [ ] Login страница выглядит как `auth-login.ejs` из шаблона - [ ] Dashboard выглядит как `dashboard-control-center.ejs` или `dashboard-marketing.ejs` из шаблона - [ ] Все view-файлы используют правильные SmartAdmin классы и компоненты - [ ] Нет плывущих стилей, нет самописного CSS-костыля - [ ] Mobile responsive работает через SmartAdmin mobile-menu-icon и backdrop - [ ] Все интерактивные элементы работают (sidebar toggle, nav-minified, theme toggle, fullscreen, dropdowns, ripple effect) - [ ] No JS errors in console - [ ] Все 12 страниц открываются корректно ## Depends on #111 #121 #122 (эти issues были первой попыткой, их код нужно заменить полностью)
NW added this to the SmartAdmin Enhancements v2 milestone 2026-07-02 19:27:04 +00:00
NW commented 2026-07-02 21:26:59 +00:00
Author
Owner
Copy Link

✅ SmartAdmin Shell Migration Complete

Implemented

  • SmartAdmin CSS (smartapp.min.css) + SVG sprite icons (sprite.svg)
  • Header: sidebar toggle, brand, search, fullscreen, theme toggle, notifications (bell + 3 items), profile dropdown (Admin/Administrator)
  • Sidebar: 11 nav items with SVG icons, menu filter, active state, mobile responsive
  • Footer: copyright + back-to-top
  • Login page: SmartAdmin styled login form with gradient background
  • Dashboard: stat cards, revenue/users/top-products charts, activity feed, quick actions, commission, wallet summary
  • All pages: users, products, categories, catalog, purchases, audit, settings, wallets, payment-wallets, seed, locales, locations
  • Theme toggle: light/dark with localStorage
  • Menu filter: real-time search in sidebar
  • Mobile responsive: sidebar collapse with toggle

Screenshots

  • /tmp/admin-screenshots/login_final.png
  • /tmp/admin-screenshots/dashboard_final.png
  • /tmp/admin-screenshots/users_final.png
  • /tmp/admin-screenshots/settings_final.png
  • /tmp/admin-screenshots/catalog_final.png

Status

All 12 pages working. Server running on port 3001.

## ✅ SmartAdmin Shell Migration Complete ### Implemented - SmartAdmin CSS (`smartapp.min.css`) + SVG sprite icons (`sprite.svg`) - Header: sidebar toggle, brand, search, fullscreen, theme toggle, notifications (bell + 3 items), profile dropdown (Admin/Administrator) - Sidebar: 11 nav items with SVG icons, menu filter, active state, mobile responsive - Footer: copyright + back-to-top - Login page: SmartAdmin styled login form with gradient background - Dashboard: stat cards, revenue/users/top-products charts, activity feed, quick actions, commission, wallet summary - All pages: users, products, categories, catalog, purchases, audit, settings, wallets, payment-wallets, seed, locales, locations - Theme toggle: light/dark with localStorage - Menu filter: real-time search in sidebar - Mobile responsive: sidebar collapse with toggle ### Screenshots - `/tmp/admin-screenshots/login_final.png` - `/tmp/admin-screenshots/dashboard_final.png` - `/tmp/admin-screenshots/users_final.png` - `/tmp/admin-screenshots/settings_final.png` - `/tmp/admin-screenshots/catalog_final.png` ### Status All 12 pages working. Server running on port 3001.
NW closed this issue 2026-07-02 21:27:00 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
phase::1
Phase 1: Security
 phase::1
Phase 1
 phase::1
Phase 1
 phase::2
Phase 2: Architecture
 phase::2
Phase 2
 phase::3
Phase 3: Admin API
 phase::3
Phase 3
 phase::4
Phase 4: Web UI
 phase::4
Phase 4
 phase::5
Phase 5: Quality
 phase::5
Phase 5
 priority::critical
Critical priority
 priority::critical
Critical priority
 priority::high
High priority
 priority::high
High priority
 priority::medium
Medium priority
 priority::medium
Medium priority
 type::bug
Bug fix
 type::bug
Bug
 type::feature
New feature
 type::feature
Feature
 type::infra
Infrastructure
 type::infra
Infrastructure
 type::refactor
Code refactoring
 type::refactor
Refactoring
 type::security
Security issue
 type::security
Security
 type::testing
Testing
 type::testing
Testing
No Label
Milestone
No items
No Milestone SmartAdmin Enhancements v2
Projects
Clear projects
No project
Assignees
Clear assignees
NW
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Telegram-Market/telegram-shop#123
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?