3YAdmin
1.0.0
Der Code ist zu hässlich, daher wird nicht empfohlen, ihn zu kopieren. Sie können sich die Implementierungsidee von RBAC ansehen, die universell ist.
3YAdmin ist eine Vorlage für ein Hintergrundverwaltungssystem, die sich auf die allgemeine Berechtigungskontrolle und Formulare konzentriert.
3YAdmin unterstützt zwei Layoutmodi: Tab-Modus und Normalmodus. Die beiden Modi werden beim Packen und Kompilieren des Webpacks festgelegt. Beim Packen eines bestimmten Modus wird kein redundanter Code im anderen Modus eingeführt (es ist ziemlich mühsam, den Tab-Modus in React zu implementieren).
3YAdmin implementiert die Kernfunktionsseiten und -vorgänge des RBAC-Berechtigungskontrollmodells.
3YAdmin kann Abfrageformulare, statische Formulare und dynamische Formulare generieren, indem es die definierten JSON-Daten analysiert.
In Kombination mit Lazy-Mock können Sie mit Scheindaten (einfacher Codegenerator) schnell Front-End- und Back-End-Hinzufügungs-, Lösch-, Änderungs- und Abfragefunktionen generieren.
Online-Demo:
Tab-Modus
Gleichtakt
Login-Konto:
admin 123 test 123456 website_admin 123456
Echte Backend-Datenunterstützung
Anmelden/Abmelden
Verkleinern Sie die linke Menüleiste
Responsives Layout
Laden nach Bedarf
Tag-Navigation
Semmelbrösel
Vollbild/Vollbild beenden
Dynamisches Menü vs. statisches Menü
Menüs nach Modulen unterteilt
Universelle Berechtigungskontrolle
Berechtigungskontrolle auf Menüebene
Berechtigungskontrolle auf Schnittstellenebene
Berechtigungskontrolle auf Elementebene
Global konfigurierbare Ladeeffekte
Behandlung von Netzwerkausnahmen
Modul
Systemeinstellungen
Berechtigungsverwaltung
Organisationsstruktur
Benutzerverwaltung
Menüverwaltung
Funktionsmanagement
Rollenmanagement
Rollenberechtigungsverwaltung
Rollenbenutzerverwaltung
Benutzerrollenverwaltung
Abteilungsleitung
Positionsmanagement
Systemmodul
Audit-Protokoll
Dateninitialisierung
Beispiel
Suchformular
Gemeinsames Formular (statisches Formular, nach dem ersten Parsen ändert sich das Formular nicht, nachdem sich die JSON-Daten geändert haben)
Dynamisches Formular (dynamisches Formular, das Formular wird nach Änderungen der JSON-Daten neu generiert)
Berechtigungstestseite
Fehlerseite
JSON-Formular (dynamisch ein Formular durch Parsen von JSON-Daten generieren)
git clone https://github.com/wjkang/3YAdmin.git
npm installInstallieren Sie den Hintergrund-Mock-Dienst
git clone -b 3YAdmin https://github.com/wjkang/quasar-admin-server.git
npm install
npm startnpm startnpm run buildKopieren und ändern Sie die von „react-react-app“ generierte Konfiguration direkt. Sie befinden sich alle im Ordner „react-scripts“. Derzeit ist antd für den Import bei Bedarf konfiguriert, in Blöcken verpackt und wird mit AutoDllPlugin verwendet. Sie können es entsprechend Ihren eigenen Bedürfnissen ändern.
Die Konfiguration des Verpackungsmodus erfordert die Änderung von „process.env.REACT_APP_LAYOUT_MODE“ in den Dateien „builds.js“ und „start.js“.
Später gibt es detaillierte Nutzungs-Tutorials und Designideen für die Front-End-Architektur für das Back-End-Managementsystem mit Front-End- und Back-End-Trennung (einschließlich Vue und React). Wenn es Ihnen gefällt, können Sie ihm einen Stern geben.
