nx admin

👍 A magical 🐮 ⚔ vue admin，记得star

mgbq

2629

738

Vue

💎 Vue Automated management system

English | 简体中文

Introduction

nx-admin is a front-end management background integration solution. It based on vue and use the UI Toolkit element.

It is a magical vue admin based on the newest development stack of vue, built-in i18n solution, typical templates for enterprise applications, lots of awesome features. It helps you build a large complex Single-Page Applications.Help individuals and businesses to the greatest extent, saving time and money.

document

Full edition

Github entrepot |
Gitee entrepot |
Preview

simplified

Github entrepot |
Gitee entrepot |
Preview

Preparation

You need to install node and git locally. The project is based on ES2015+, vue, vuex, vue-router, axios and element-ui, all request data is simulated using Mock.js.
Understanding and learning this knowledge in advance will greatly help the use of this project.

download

git：git clone https://github.com/mgbq/nx-admin.git

npm：npm install

Preview nx-admin

test account:

1. username: admin
   password: any
2. username: editor
   password: any

nx-admin project

nx-admin Is a completely open source free management system integration solution，By nxmin driven by interest after the work finished, if you also like the front-end development, welcome to join our discussion/study groups, in the same group can answer questions, share learning materials or just bullshit

QQ群

群号 493671066 欢迎大家

other matters needing attention

一、If I don’t want to use some of the above components, how can I remove them from the template without affecting other functionality?

For example, I don’t want to use the vue-quill-editor component, so I need to take three steps

Step 1: delete the routing of this component, find the route to introduce the reorganization in the directory SRC /router/index.js, and delete the following code

  {
        path: 'VueEditor',
        name: 'VueEditor',
        component: () => import('@/views/form/VueEditor'),
        meta: { title: 'VueEditor' }
  },

Step 2: delete the file that introduced the component. Delete the vueediter.vue file in the directory SRC /view/form/.

Step 3: uninstall the component. Execute the following command:

npm un vue-quill-editor -S

ok.

Features

- Login / Logout

- Permission Authentication
  - Page permission
  - Directive permission

- Multi-environment build
  - dev sit stage prod
  
- Global Features
  - Lock screen
  - Query
  - Go to github
  - I18n
  - Multiple dynamic themes
  - Dynamic sidebar (supports multi-level routing)
  - Dynamic breadcrumb
  - Tags-view(Tab page Support right-click operation)
  - Svg Sprite
  - Mock data
  - Screenfull
  - Responsive Sidebar
  
- Editor
  - Rich Text Editor
  - Markdown Editor

- Excel
  - Export Excel
  - Export zip
  - Upload Excel
  - Visualization Excel

- Table
  - Tree Table
  - Inline Edit Table


- Error Page
  - 401
  - 404

- Components
  - Back To Top
  - Drag Dialog
  - Drag Kanban
  - Drag List
  - SplitPane
  - Dropzone
  - Sticky
  - CountTo

- Dashboard
- V-charts
- Animation
- Clipboard
- Markdown to html
- Fontawesome
- Vuex Local persistent storage ,packaging H5 of SessionStorage and LocalStorage
- Right click menu
- Github-emoji
- Third party website
- Dynamic text description

You are welcome to contribute to the development of nx-admin (code writing/document translation)。

Getting started

# clone the project
git clone https://github.com/mgbq/nx-admin.git

# install dependency
npm install

# develop
npm run dev

This will automatically open http://localhost:9528.

Build

# build for test environment
npm run build:sit

# build for production environment
npm run build:prod

Advanced

# --report to build with bundle size analytics
npm run build:prod --report

# --preview to start a server in local to preview
npm run build:prod --preview

# lint code
npm run lint

# auto fix
npm run lint -- --fix

Donate Buy me a coffee ~