코드가 너무 보기 흉해서 복사를 권장하지 않습니다. 보편적인 RBAC의 구현 아이디어를 살펴보세요.
3YAdmin은 일반적인 권한 제어 및 양식에 초점을 맞춘 백그라운드 관리 시스템 템플릿입니다.
3YAdmin은 탭 모드와 일반 모드의 두 가지 레이아웃 모드를 지원합니다. 두 가지 모드는 webpack을 패키징하고 컴파일할 때 결정됩니다. 특정 모드를 패키징할 때 다른 모드의 중복 코드는 도입되지 않습니다(React에서 Tab 모드를 구현하는 것은 꽤 고통스럽습니다).
3YAdmin은 RBAC 권한 제어 모델의 핵심 기능 페이지와 작업을 구현합니다.
3YAdmin은 정의된 JSON 데이터를 구문 분석하여 쿼리 양식, 정적 양식, 동적 양식을 생성할 수 있습니다.
Lazy-Mock과 결합하면 모의 데이터(간단한 코드 생성기)를 사용하여 프런트엔드 및 백엔드 추가, 삭제, 수정 및 쿼리 기능을 빠르게 생성할 수 있습니다.
온라인 데모:
탭 모드
공통 모드
로그인 계정:
admin 123 test 123456 website_admin 123456
실제 백엔드 데이터 지원
로그인/로그아웃
왼쪽 메뉴바 축소
반응형 레이아웃
요청 시 로드
태그 탐색
빵가루
전체 화면/전체 화면 종료
동적 메뉴와 정적 메뉴
모듈별로 구분된 메뉴
범용 권한 제어
메뉴 수준 권한 제어
인터페이스 수준 권한 제어
요소 수준 권한 제어
전역적으로 구성 가능한 로딩 효과
네트워크 예외 처리
기준 치수
시스템 설정
권한 관리
조직 구조
사용자 관리
메뉴 관리
기능 관리
역할 관리
역할 권한 관리
역할 사용자 관리
사용자 역할 관리
부서 관리
직위관리
시스템 모듈
감사 로그
데이터 초기화
예
검색 양식
일반 형식(정적 형식, 처음 구문 분석한 후 JSON 데이터가 변경된 후에도 형식이 변경되지 않음)
동적 양식(동적 양식, JSON 데이터 변경 후 양식이 다시 생성됨)
권한 테스트 페이지
오류 페이지
JSON 양식(JSON 데이터를 구문 분석하여 동적으로 양식 생성)
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
npm start
npm run build
React-react-app에서 생성된 구성을 직접 복사하고 수정합니다. 현재는 요청 시 antd를 가져오고 청크로 패키징하며 AutoDllPlugin을 사용합니다. 자신의 필요에 따라 수정할 수 있습니다.
패키징 모드를 구성하려면 builds.js 및 start.js 파일에서 process.env.REACT_APP_LAYOUT_MODE를 수정해야 합니다.
나중에 프런트엔드와 백엔드가 분리된(vue 및 React 포함) 백엔드 관리 시스템에 대한 자세한 사용 튜토리얼과 프런트엔드 아키텍처 디자인 아이디어가 제공될 것입니다.