bailicangdu/vue2-manage

★ 13,639VueAudience · developerComplexity · 2/5LicenseSetup · moderate

Mindmap

mindmap
  root((vue2-manage))
    Features
      Login and logout
      Restaurant management
      User permissions
      Charts and rich text
    Tech Stack
      Vue 2
      Vuex state
      Vue Router
      Element UI
    Setup
      npm install
      Live backend mode
      Local backend mode
    Use Cases
      Admin dashboard
      Food delivery ops
      Learning Vue 2

mindmap root((vue2-manage)) Features Login and logout Restaurant management User permissions Charts and rich text Tech Stack Vue 2 Vuex state Vue Router Element UI Setup npm install Live backend mode Local backend mode Use Cases Admin dashboard Food delivery ops Learning Vue 2

Click or tap to explore — scroll the page freely

Things people build with this

USE CASE 1

Use this template as a starting point for your own back-office admin panel with login, role-based permissions, and data charts.

USE CASE 2

Study how Vue 2, Vuex, and Vue Router work together in a real-world admin application.

USE CASE 3

Run the full node-elm food delivery back-office system by connecting it to the companion node-elm backend.

Tech stack

Vue 2VuexVue RouterWebpackLessElement UI

Getting it running

Difficulty · moderate Time to first run · 30min

Local development requires the companion node-elm backend running on your machine, otherwise connects to a live online server.

GPL license, you can use and modify it freely, but any distributed derivative work must also be open-sourced under GPL.

In plain English

Vue2-manage is an admin dashboard template built with Vue 2 and Element UI, a popular Chinese-developed component library for building web interfaces. It serves as the back-office management system for a companion project called node-elm, which is a food delivery app inspired by Eleme (a major Chinese food delivery platform). The dashboard connects to a live server and pulls real data, so it is not just a static mock. It includes working features for logging in and out, adding and managing restaurants and food items, managing users, handling permissions based on roles, displaying charts, and using a rich text editor. All of these features are listed in the README as completed. The tech stack is Vue 2, Vuex (for state management), Vue Router (for navigation between pages), Webpack (for building the project), and Less (a CSS preprocessor). ES6 and ES7 JavaScript syntax is used throughout. To run the project, you clone the repository, install dependencies with npm or Yarn, and start the development server. One run command connects to the live online backend, and another connects to a local version of the node-elm backend if you have that running on your machine. The project is part of a small family of related repositories by the same author, including the front-end customer-facing app and a native mobile app. The README is written in Chinese and is brief. The license is GPL.

Copy-paste prompts

Prompt 1

I'm learning Vue 2 and want to understand how this admin dashboard handles role-based permissions. Explain the Vuex store structure and how the router guards work.

Prompt 2

Help me customize this Vue 2 admin dashboard to add a new data table page with sorting and pagination using Element UI components.

Prompt 3

I want to connect this vue2-manage dashboard to my own backend API instead of the node-elm server. Which files and API base URLs do I need to change?

Open on GitHub → Explain another repo

← bailicangdu on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.