thinkjs-iview-admin — это архитектура для создания облегчённой системы управления бэкендом, которая основана на Thinkjs как промежуточном слое, Vuejs в качестве модульного фронтенд-разработки и iview-admin в роли фронтенд UI. Она обеспечивает разделение между фронтендом и бэкендом.

В эту архитектуру интегрирован магазин мобильных приложений. В настоящее время бэкенд магазина ещё не доработан, но автор обещает его обновить и улучшить систему управления бэкенда в процессе разработки.

Бэкенд-проект: back-end

• Импорт SQL-файлов в локальную базу данных.

// Установка зависимостей:
npm install

// Запуск программы:
npm start

Фронтенд-проект: front-end

Демонстрация интерфейса и скриншоты

Функции:

— Вход/выход; — Управление системой: — Управление пользователями; — Управление меню; — Управление ролями; — Управление словарями; — Генератор кода; — Переключение между языками; — Личный кабинет; — Блокировка экрана; — Полноэкранный режим; — Страница ошибок; — Демо-страница; — И другие функции.

Суперпользователь имеет учётную запись admin 111111. Все пароли учётных записей в бэкенде по умолчанию 111111

// Установка зависимостей:
npm install

// Запускаем среду разработки:
npm run dev

// Собираем для продакшена:
npm run build

Использование генератора кода

Рекомендуется заполнять описание таблиц и полей при создании таблиц. Четыре поля обязательны: id (первичный ключ), create_date (дата создания), update_date (дата изменения), del_flag (флаг мягкого удаления).

Выберите таблицу в генераторе кода, настройте параметры и нажмите «Сгенерировать код».

Проект магазина мобильных приложений: wechat-mall

Скриншоты

Функционал:

— Главная страница; — Страницы категорий, товаров, новинок и рекомендаций; — Детальная страница товара с возможностью добавить товар в корзину, сохранить товар и оставить отзыв; — Поиск; — Тематические страницы; — Брендовые страницы; — Полный процесс покупки: добавление, редактирование, удаление товаров, выбор способа доставки, оформление заказа и оплата; — Центр пользователя (заказ, сохранение, история заказов, адрес доставки, обратная связь).

План разработки

— Загрузка изображений и прямой доступ к редактору форматированного текста через облако семи гномов (завершено); — Доработка бэкенда мобильного приложения (в процессе); — Интеграция версии UEditor для node.js.

Ссылки

— thinkjs (https://github.com/thinkjs/thinkjs); — iView (https://github.com/iview/iview); — iview-admin (https://github.com/iview/iview-admin); — Vue (https://github.com/vuejs/vue); — Webpack (https://github.com/webpack/webpack).