GitHub Vue项目推荐|mall-admin-web是一个电商后台管理系统的前端项目基于Vue+Element实现 主要包括商品管理、订单管理、会员管理、促销管理、运营管理、内容管理、统计报表、财务管理、权限管理、设置等功能

项目热度

标星(star):3398 (很不错的实用项目,大神作品,建议关注)

标星趋势

关注(watch):171

拷贝(fork):2003

贡献人数:1

仓库大小:1 MB

最后更新:2019-08-29

代码提交活跃度:

综合推荐指数: 【3】颗星

开发语言

主要语言:Vue

语言分布:Vue:81.04%、JavaScript:15.95%、CSS:2.78%、HTML:0.23%

项目概述

mall-admin-web前言

该项目为前后端分离项目的前端部分,后端项目mall地址:https://github.com/macrozheng/mall

项目介绍

mall-admin-web是一个电商后台管理系统的前端项目,基于Vue+Element实现。 主要包括商品管理、订单管理、会员管理、促销管理、运营管理、内容管理、统计报表、财务管理、权限管理、设置等功能。

项目演示

项目在线演示地址:http://39.98.190.128/index.html

技术选型

后端

前端

系统架构

业务架构

项目布局

src -- 源码目录
├── api -- axios网络请求定义
├── assets -- 静态图片资源文件
├── components -- 通用组件封装
├── icons -- svg矢量图片文件
├── router -- vue-router路由配置
├── store -- vuex的状态管理
├── styles -- 全局css样式
├── utils -- 工具类
└── views -- 前端页面
├── home -- 首页
├── layout -- 通用页面加载框架
├── login -- 登录页
├── oms -- 订单模块页面
├── pms -- 商品模块页面
└── sms -- 营销模块页面

搭建步骤

  • 下载node并安装:https://nodejs.org/dist/v8.9.4/node-v8.9.4-x64.msi;
  • 该项目为前后端分离项目,访问本地访问接口需搭建后台环境,搭建请参考后端项目传送门;
  • 访问在线接口无需搭建后台环境,只需将config/dev.env.js文件中的BASE_API改为http://39.98.190.128:8080即可;
  • 克隆源代码到本地,使用IDEA打开,并完成编译;
  • 在IDEA命令行中运行命令:npm install,下载相关依赖;
  • 在IDEA命令行中运行命令:npm run dev,运行项目;
  • 访问地址:http://localhost:8090 即可打开后台管理系统页面;
  • 如果遇到无法运行该命令,需要配置npm的环境变量,如在path变量中添加:C:\Users\zhenghong\AppData\Roaming\npm。

项目地址

https://github.com/macrozheng/mall-admin-web

程序员新视界:分享有趣、有料的流行程序员话题,每天进步一点点。

GitHub Vue项目推荐|Vue+Element实现的电商后台管理系统功能丰富的更多相关文章

  1. GitHub Python项目推荐|瓦力Devops开源项目代码部署平台持续部署

    GitHub Python项目推荐|walle - 瓦力 Devops开源项目代码部署平台 项目热度 标星(star):8418 (很不错的实用项目,大神作品,建议关注) 标星趋势 关注(watch) ...

  2. GitHub Java项目推荐|功能丰富的 Java 工具包|提高开发效率

    GitHub Java项目推荐|功能丰富的 Java 工具包|提高开发效率 功能丰富的 Java 工具包.它帮助我们实现了常用的工具方法,从而减少代码的体积,提高开发效率.该项目最初是作者工作项目中的 ...

  3. (Git) 优秀Java,Vue项目推荐

    Java 1.spring-boot-pay 地址:小柒2012/spring-boot-pay 这是一个支付案例,提供了包括支付宝.微信.银联在内的详细支付代码案例,对于有支付需求的小伙伴来说,这个 ...

  4. 在Vue项目中使用Element UI:按需引入和完整引入

    下面操作在main.js文件中进行 完整引入: import Element from 'element-ui'; //样式文件,需单独引入 import 'element-ui/lib/theme- ...

  5. 如何在Vue项目中使用Element组件

    [前提] 1.安装webpack    cnpm install webpack -g 2.安装vue/vue-cli    cnpm install vue vue-cli -g 3.初始化vue  ...

  6. 构建vue项目(vue 2.x)时的一些配置问题(持续更新)

    基于前文,使用vue-cli脚手架工具构建项目,并使用了webpack,那么我在项目中遇到的一些与配置相关的问题将在这里进行汇总. 1.代码检查问题 由于我们在构建项目时,使用了Eslint对我们的项 ...

  7. Vue.js-创建Vue项目(Vue项目初始化)并不是用Webstrom创建,只是用Webstrom打开

    我犯的错误:作为vue小白,并不知道还要单独去创建初始的vue项目,于是自己在webstrom中建了一个Empty Project, 在其中新增了一个js文件,就开始import Vue from “ ...

  8. 走进Vue时代进阶篇(01):重构电商购物车模块

    前言 从这篇文章开始,我准备给大家分享一些关于Vue.js这门框架的技巧性系列文章,正好我们公司项目中也用到了Vue.所以,教是最好的学.进阶篇比较适合于二三线城市,还在小厂打拼的童鞋们.欢迎你们跟着 ...

  9. Vue 项目推荐,Github 过万 Star

    电鸭社区-远程工作-自由职业-兼职外包-自由从这开始 嗨,我是 Martin,也叫老王.不少小伙伴,说自己是转行.自学,没有项目,今天推荐一个 Vue 实战项目 还记得 Martin 仿写过在线 Ma ...

随机推荐

  1. 【PL/SQL】左侧窗口没了

  2. 【oracle】定时任务

    --创建定时任务-------------------------------------------------------------------------------------------- ...

  3. 归并排序 MergeSort

    今天第一次看懂了严奶奶的代码( ̄▽ ̄)~*,然后按照厌奶那的思路进行了一波coding,稍加调试后即可跑起来. 学习链接:排序七 归并排序.图解排序算法(四)之归并排序 merge函数:将两个有序序列 ...

  4. rabbitmq安装集群

    centos 7.3 64 172.18.39.241 k8s-mini-241172.18.39.242 k8s-mini-242172.18.39.243 k8s-master-243 vim / ...

  5. 【Activiti学习之三】Activiti API(二)

    环境 JDK 1.8 MySQL 5.6 Tomcat 7 Eclipse-Luna activiti 6.0 一.流程定义1.中止与激活流程定义 package com.wjy.pd; import ...

  6. 【C/C++开发】STL内嵌数据类型: value_type

    使用stl库的时候一直对value_type这个东西理解的不是很好,可以说就是不理解.今天看了<STL源码剖析>才恍然大悟.这里稍作记录. 每个STL中的类都有value_type这种东西 ...

  7. Python 绘制 柱状图

    用Python 绘制 柱状图,使用的是bar()函数. 一个简单的例子: # 创建一个点数为 8 x 6 的窗口, 并设置分辨率为 80像素/每英寸 plt.figure(figsize=(10, 1 ...

  8. Alpha冲刺(8/10)——2019.4.30

    作业描述 课程 软件工程1916|W(福州大学) 团队名称 修!咻咻! 作业要求 项目Alpha冲刺(团队) 团队目标 切实可行的计算机协会维修预约平台 开发工具 Eclipse 团队信息 队员学号 ...

  9. CentOS 7下JumpServer安装及配置

    环境 系统 # cat /etc/redhat-release CentOS Linux release 7.4.1708 (Core) # uname -r 3.10.0-693.21.1.el7. ...

  10. AntDesign vue学习笔记(三)嵌套路由使用

    本项目目前结构如下 1.Login页面=>MainFrm页面=>MainFrm左部菜单,右边是显示区域可以切换子页面. 2.当点击左部菜单时,右边的子页面随着进行切换. 实现关键代码如下1 ...