🎉Vue3+Vite2.6+TypeScript+ant-design-vue+egg.js One-click build management front and backend management system

Bag quickly develops the management system, portal website, and blog system framework, provides a basic framework, quickly builds enterprise products, and responds to development. You can apply it to any application that requires server-side management. Such as: API interface of development management system, portal website blog, internal business management, ERP, CMS, APP background, etc.

Technical selection

Bag management system is built with Vue3, Vue-Router4, Vuex4, Ant-Design-Vue, Vite, TypeScript, Egg.js, Mysql

Bag portal blog front desk is built with Vue3, Vue-Router4, Vite, Pinia, Element-plus, Equal-Vue, Bootstrap, Vite, TypeScript, Egg.js, Mysql, loads modules on demand, and has built-in rich UI

A key installation

Rapid development, built-in integrated backend system, and custom backend API

 npm i vue-bag-admin --save

application

 import {createApp} from 'vue'
import install from 'vue-bag-admin'
import 'vue-bag-admin/lib/style.min.css'
import App from './App.vue'
import 'vue-bag-admin/mock/admin' // 如果后台服务,不用此mock数据

createApp(App).use(install)

develop

 npm run dev

open source address

Document address , Github source code

demo address

Super administrator account: username: superadmin, password: 123456

Administrator account: username: admin, password: 123456

Management system demo , portal blog front desk demo

The main function

1. User management: system administrator assigns user roles and role permissions
2. Role management: Create the main object of permission control, assign different api permissions and menu permissions to roles
3. Menu management: realize the dynamic menu configuration of users, and realize different menus for different roles
4. Rich Text Editor: MarkDown Editor Feature Embedding
5. Quick Form: One-click development of CURD, configuration conditional search example
6. Quick API: Based on Egg development, add, delete, modify and check the basic sample list of API
7. Interface design: model creation, associated query, one-click access
8. Permission instruction: component permission instruction encapsulation
9. Network configuration: basic axios encapsulation, request reconnection, error cancellation, dynamic configuration
10. State Management: Rich Vuxe and Pinia to choose from
11. Routing configuration: nested routing, dynamic routing can be dynamically configured, fast rendering
12. Global configuration: basic site configuration background image, Login, Slogan, etc.
13. ....

preview

Backstage

front desk