[Open Source] A multifunctional, high-efficiency, low-code front-end and back-end integrated, intelligent development tool

1. Introduction to open source projects

Multifunctional, high-efficiency, low-code front-end and back-end integrated, intelligent development tool

mdp-sys-ui-web aims to provide a template project for enterprise development and management business systems. This template project has the characteristics of high efficiency, low code, and rich functions. Enterprises can add more other business functions to this project; they can also use this project as a template to create new projects for developing other businesses. Using this project to build applications, you don't need to consider multi-tenancy, login, unified authentication center, permissions, menu management, system management, public components, public api, code redundancy, data dictionary, picture library, file library, smart form, workflow , microservices calling each other, global tracking and locating bugs, multi-primary key CRUD, complex SQL queries and other issues are all built-in and can be easily solved.

If I have to give you a reason to use mdp: it is to reduce the code a lot and develop so easy  mdp-sys-ui-web as an independent front-end project. Enterprises can use this project alone and develop the back-end system separately; it can also be used directly The Mark Meng team  supports the open source backend system mdp-sys-backend as the backend service.

2. Open source agreement

Use the MIT open source license

3. Interface display

4. Function Overview

 Built-in functions

Role permissions 
  ├── Role management => role crud, assign menu, assign permissions 
  ├── Permission definition => permission crud 
  ├── Menu management => menu (button) crud, assign menu (button) to role, 
  ├── Module management => Module crud 
  ├── Opened modules => View the modules that have been opened by the enterprise (individual) 
   
Organization management 
  ├── Organization management => Enterprise information maintenance, administrator maintenance, account information maintenance, enterprise product maintenance, 
  ├─ ─ User management => user's crud, assign positions, assign departments, reset password, invite 
  ├── Department management => department curd, assign positions to departments, view department users 
  ├── Company management => company curd (super management (for staff use) 
  ├── Position management => post curd, assign roles to positions, view job personnel 
  ├── Logout review => review user’s logout application 
Platform management 
  ├── Platform configuration => configure platform information 
  ├── Personal Certification audit => Review individual’s real-name certification request 
  ├── Enterprise certification audit => Review enterprise’s real-name certification request Metadata 
management 
  ├── Dictionary management => CRUD of data dictionary 
  ├── List maintenance => Drop-down list data items crud 
  ├── Parameter definition => crud 
approval center for public system parameters 
  ├── To be executed => My to-be-executed task query, task execution 
  ├── Calendar task => My to-be-executed task query, task execution 
  ├── Initiate process => Initiate process 
Approval monitoring 
  ├── The process I initiated => Query the process I initiated 
  ├── The process I monitored => Query the process I monitored and urge 
  ├── The process I participated in => Query my participation Process 
model 
  ├── Process editor => Online process editor 
  ├── Model release => Process model release 
  ├── Model settings => Set the association between the process and the smart form, the starting conditions of the model, the approver, Permissions, etc. 
Smart forms (low code) 
  ├── Form center => Portal of smart forms 
  ├── Form design => Perform smart form design, permission settings, etc. 
  ├── Data entry, query => Query the data entered in the form

5. Technology Selection

⌨ Technology stack

vue family bucket + element-ui + axios

⚙ Quick start

⚠️Note: This project uses [email protected]+ version, so it is at least compatible with [email protected]+

Preamble preparation

  • Your local environment needs node and git installed. Our technology stack is based on ES2015+, vue, vuex, vue-router and element-ui. Understanding and learning this knowledge in advance will be of great help in using this project.
  • This project is a web front-end project. All APIs are provided by mdp-sys-backend. Please download the project.
  • Code generator download mdp-code-generator

Component library mdp-ui

Mdp encapsulates dozens of UI components. The difference between using mdp-ui and not using mdp-ui: the difference between writing 100 lines of code or writing 1 line of code. The reduction in code volume is immediate.

  • mdp-ui
  • The core component of mdp, this component library is a pure front-end page component, which can run correctly without configuring any back-end api interface.
  • mdp-ui-ext
  • Business components based on mdp-ui extension with backend api business loading capabilities

⚙Quick start

Find main.js and add the following code
//mdp-ui basic components 
import MdpComponents from '@/components/mdp-ui/index.js' 
Vue.use(MdpComponents) 

//mdp-ui-ext extended components 
import MdpUiExtComponents from '@/components/mdp-ui -ext/index.js' 
Vue.use(MdpUiExtComponents) 

// Public api 
import mdp from "@/api/mdp_pub"; 
Vue.prototype.$mdp = mdp;

 Open source project based on mdp framework expansion

⚠️ Note: The following expanded frameworks or subsystems are summarized and extracted by the mdp open source team based on project experience. They can be used or not. They can be merged into existing projects in the form of jar packages for release, or they can be released separately into single applications and microservices. application
  • Third-party payment framework, integrating WeChat payment, Alipay payment, and PayPal payment
  • mdp-tpa-pay-backend backend
  • instant messaging framework
  • mdp-im-uniapp front-end app
  • mdp-im-web front-end browser
  • mdp-im-backend backend
  • Unified Certification Center Framework
  • mdp-sys-ui-web front-end
  • mdp-oauth2-backend backend
  • mdp-sys-backend backend
  • Microservices framework
  • mdp-cloud-backend backend
  • Workflow management subsystem
  • mdp-workflow-ui-web front-end
  • mdp-workflow-backend backend
  • Smart form subsystem
  • mdp-form-ui-web front-end
  • mdp-form-backend backend
  • content management subsystem
  • mdp-arc-ui-web front-end
  • mdp-arc-backend backend
  • SMS subsystem
  • mdp-sms-ui-web front-end
  • mdp-sms-backend backend
  • Project management subsystem
  • xm-crowd-ui-web front-end crowdsourcing
  • xm-ui-web front-end management terminal
  • xm-backend backend
  • Financial management subsystem
  • ac-core-ui-web front-end management terminal
  • ac-backend backend
Please see the README.md document for more information.

6. Source code address

mdp-sys-ui-web: mdp-sys-ui-web aims to provide a template project for enterprise development and management business systems. This template project has the characteristics of high efficiency, low code, and rich functions. Enterprises can add more other business functions to this project; they can also use this project as a template to create new projects for developing other businesses.

Guess you like

Origin blog.csdn.net/weixin_37576193/article/details/133808056