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. 【Excel】IF函数

    判断条件: 一版判断:1>2大于   1<2小于   1=2等于   1<>2不等于  1>=2 1<=2 交集:AND() 并集:OR() 多条件:以后补

  2. MongoDB的安装与简单使用

    一.安装MongoDB的步骤 注:本教程全部统一采用hadoop用户名登录Linux系统,用户名:hadoop 密码:hadoop ​ 首先,在Linux系统中打开一个终端,执行如下命令导入公共秘钥到 ...

  3. three.js 测试1

    关键看一下里面的注释 代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /& ...

  4. Python内置函数---ord()

    描述: ord() 函数是 chr() 函数(对于8位的ASCII字符串)或 unichr() 函数(对于Unicode对象)的配对函数,它以一个字符(长度为1的字符串)作为参数,返回对应的 ASCI ...

  5. iptables 自定义链

    当默认链中的规则非常多时,不方便我们管理. 想象一下,如果INPUT链中存放了200条规则,这200条规则有针对httpd服务的,有针对sshd服务的,有针对私网IP的,有针对公网IP的,假如,我们突 ...

  6. postcss 将px转换成rem vuecli3+vant+vue+postcss

    1.安装 npm install postcss-pxtorem --save 2.找到postcss.config.js 默认是这样 module.exports = { "plugins ...

  7. GPS和LOAM的pose之间建立edge

    基于时间戳一致原理,在与PG的timestamp邻近的的两个LOAM的pose中插值出一个虚拟的LOAM pose PG' ,其timestamp = PG的timestamp. 然后GPS的pose ...

  8. Unity开发:5.0+版本标准资源包无内置问题

    一.问题如下: 在Unity中,一般都会内置有基础的资源包,可以在Assets->Import Package中,点击其下的子项进行导入: 但是我发现,5.0版本与之前的4.x版本相比,安装包变 ...

  9. 搭建git服务器配置gitolite[迁移原来的gitolite工程]

    参考 https://www.liaoxuefeng.com/wiki/896043488029600/899998870925664 http://www.worldhello.net/gotgit ...

  10. mongo 操作

    1.链接mongo /path_to_mongo/bin/mongo MongoDB shell version: connecting to: test > use logs switched ...