3YAdmin-Шаблон системы фонового управления, ориентированный на общий контроль разрешений и формы

3YAdminПостроен на React+Antd. GitHub искал React+Antd+Admin и получил десятки результатов вместо сотен.Зачем писать это?

Я думаю, что ядром системы фонового управления должны быть контроль разрешений, формы и сбор информации об ошибках.Первые два являются наиболее важными. Большинство проектов на GitHub не фокусируются на этом, различные сторонние компоненты сложены вместе, что выглядит круто, но они не очень практичны и их сложно изменить (если это vue, вы можете увидеть другой мой проектvue-quasar-admin).

У некоторых могут возникнуть вопросы: контроль разрешений, разные системы реализованы по-разному, нельзя быть универсальным. Есть только те типы моделей контроля разрешений, и большинство из них — RBAC, которые могут быть не совсем универсальными, но по крайней мере изменения будут не слишком большими.

3YAdmin

  3YAdminЭто шаблон системы фонового управления, ориентированный на общий контроль разрешений и формы.

  3YAdmin поддерживает два режима макета: режим вкладок и обычный режим. Два режима определяются при упаковке и компиляции веб-пакета.При упаковке режима он не будет вводить избыточный код в другой режим (React реализует режим Tab более болезненно).

  3YAdmin реализует страницы основных функций и операции модели управления разрешениями RBAC.

  3YAdmin может создавать формы запросов, статические формы и динамические формы, анализируя определенные данные JSON.

Сопоставлениеlazy-mockМожет быстро генерировать внешний и внутренний интерфейс с помощью функции CRUD фиктивных данных (простой генератор кода).

online demo:

Tab Mode

Common Mode

Вход в учетную запись:

admin 123

test 123456

website_admin 123456

Функции и особенности

• Поддержка реальных серверных данных
• вход/выход
• Уменьшить левую строку меню
• Адаптивный макет
• нагрузка по требованию
• Навигация по тегам
• Панировочные сухари
• полноэкранный/выйти из полноэкранного режима
• Динамические и статические меню
• Меню разделено на модули
• Универсальный контроль доступа
  • Управление доступом на уровне меню
  • Контроль разрешений на уровне интерфейса
  • Контроль разрешений на уровне элемента
• Глобально настраиваемый эффект загрузки
• Обработка сетевых исключений
• модуль
  • системный модуль
    • настройки системы
      • управление меню
    • управление полномочиями
      • управление функциями
      • управление ролями
      • Управление ролевыми правами
      • Управление пользователями ролей
      • Управление ролями пользователей
    • Организация
      • Управление отделом
      • Управление работой
    • Управление пользователями
  • Журнал аудита
  • Инициализация данных
• пример
  • Страница проверки разрешений
  • страница ошибки
  • Форма JSON (при анализе данных JSON форма создается динамически)
    • Форма поиска
    • Общая форма (статическая форма, после первого разбора форма не изменится после изменения данных JSON)
    • Dynamic Form (динамическая форма, форма перегенерируется после изменения данных JSON)

Установите и используйте

Install

git clone https://github.com/wjkang/3YAdmin.git

npm install

Установить фоновую службу имитации

git clone -b 3YAdmin https://github.com/wjkang/quasar-admin-server.git

npm install

npm start

Run

Development

npm start

Production(Build)

npm run build

настроить

Скопируйте конфигурацию, сгенерированную react-react-app, непосредственно для модификации, все в папке react-scripts.В настоящее время antd настроен на импорт по запросу, упакован в куски, и используется AutoDllPlugin. Вы можете изменить его в соответствии с вашими потребностями.

Конфигурация режима упаковки должна изменить process.env.REACT_APP_LAYOUT_MODE в файлах builds.js и start.js.

Используйте учебник

Позже будут подробные туториалы и идеи по проектированию архитектуры фронтенда (включая vue и react) системы управления фоном, отделенной от фронтенда и бэкэнда.Если вам понравилось, можете поставить звезду.

Показать результаты