如果您觉得系统还不错，且确实能够对您起到帮助作用，在此诚挚地邀请您给予一个Star！！！

如果您看到源码和演示环境，对您有所帮助，诚挚地邀请您给予一个Star，您的支持是我们继续坚持的动力。

总体介绍

易写科技B2C单商家商城购物系统软件由易写科技自主开发而成，软件著作权号（2017SR126184），第一次推出时间在2016年3月1日，后期逐步迭代更新，为上万家客户提供优质的服务，具体可以查看易写科技官网：http://www.yixiekeji.com/ 。

商城系统采用SpringCloud Alibaba + VUE + Uniapp开发，管理端采用ElementUI，用户端采用Uniapp开发，兼容小程序、H5、Android、IOS。

国内首套基于SpringCloud Alibaba微服务架构的开源电商系统；
国内首套真正从商务软件开源出来电商系统-有大量成功案例；
国内首套代码编写的核心成员均来自一线互联网电商公司；
国内首套无阉割开源微服务电商系统，git上可下载所有源代码；
阿里java开发规范，数据库每个表、每个字段都有注释，代码每个方法都有注释。

我们坚信开源的力量能够驱动创新，引领未来。我们提供开放、透明、可定制的商城源代码，让您轻松搭建属于自己的电商平台，掌握电商的未来。

用户端界面

管理端界面

演示环境

管理端

http://b2cadmin.yixiekeji.cn/

用户名：admin 密码：123456

用户端

关注公众号，公众号上点击小程序，跳转到小程序演示环境，进行查看。

后台主要功能

会员管理：会员管理、会员经验值规则配置、会员积分规则配置、会员等级配置、会员经验值配置等

商品管理：品牌管理、规格管理、分类管理、物流公司、运维设置、发布商品、商品管理、商品评价等

商品搜索：索引初始化、关键词设置、敏感词过滤设置、敏感词管理、搜索词历史记录

交易管理：全部订单、未付款订单、待发货订单、已发货订单、已完成订单、已取消订单

订单售后：退货管理、换货管理

商城促销：优惠券管理、积分商城轮播图、积分商城分类、积分商城商品管理

首页配置：首页轮播图、首页楼层、楼层数据

网站文章：文章分类、文章管理

统计分析：每日订单统计、每日商品统计、订单概况、订单客单价走势、退货率统计、全国订单分布统计、会员增长走势等

系统管理：资源管理、角色管理、管理员管理、修改密码、支付宝配置、微信配置、短信配置、OSS上传配置、快递100配置、清除缓存、数据字典

用户端主要功能

登录注册：微信联合登录注册、手机号验证码登录注册、手机号密码登录、手机号密码验证码注册、重置密码、退出登录

购物流程：首页、分类页面、商品单品页、购物车、提交订单、订单支付（支付宝、微信支付）

支付宝支付：H5支付、Android原生支付、IOS原生支付

微信支付：小程序支付、H5支付、Android原生支付、IOS原生支付

积分商城：积分商城首页、积分商城列表页、积分商城单品页、积分商城购物车、积分商城提交订单页面

积分商城支付：全部采用积分支付、积分+支付方式（支付宝或微信）支付

我的订单：待付款、待发货、已发货、已完成、已取消、全部订单

用户中心：收货地址、我的评论、退货、换货、发票、个人资料、联系我们、积分日志、经验值日志、我的等级

我的收藏：商品收藏、店铺收藏

优惠券：未使用、已经使用、已过期、查看优惠券适用商品

售后服务

企业

一对一实时解答；
永久免费升级服务，第一时间获取最新版本；
商城BUG终身修复；
2天技术培训，一天技术一天业务；
二次开发技术和业务免费咨询；
一次免费安装部署。

个人

因为公司运营成本，暂时不针对个人有任何售后服务，您有疑问可以查看我们在线文档，敬请谅解。

联系方式

只是针对企业用户，获取授权可添加微信、QQ或者电话联系

售前：18612670879 Q Q：43006111

微信：18612670879

扫描下面二维码添加微信：无商业合作，暂不接受个人添加微信，敬请谅解。

版权声明以及授权

易写科技B2C单商家商城购物系统软件，软件著作权登记号：2017SR126184 。

版权和所有权声明：本公司对该软件产品拥有全部知识产权（包括但不限于专利权、著作权、商业秘密等），均受到相关法律法规的保护。未获商业授权前，禁止本软件用于商业用途或者上传到开源网站。未获商业授权前，禁止在本软件整体或部分基础上进行二次开发的衍生品用于商业用途或者上传到开源网站。

违者必究！！！

个人免费，商业用途我们则需要收取很少的授权费用，以确保后续服务的专业性和持续性。同时，我们会对开源商城不断更新和维护，从而更好地满足市场需求和提升用户体验。

公司简介

北京易写科技有限公司是国内最专注的电商服务的软件公司，公司位于北京市，是一家拥有自主知识产权的高新科技公司，并相聚获得中关村高新、国家高新认证。

核心成员均来自一线互联网电商公司，有阿里、京东等工作经历，对互联网、电子商务有深刻理解，有着丰富的电商运营经验，具有大型电商平台架构和技术开发经验。

北京易写科技有限公司旗下B2B2C、B2C、B2B、O2O拥有自主的知识产权。公司定位中高端电子商务提供商、适合二次开发的电子商务系统。

旗下采用Java作为开发语言，结合团队在阿里、京东的实际开发经验，不断开发完善，产品从丰富产品功能、提升用户体验、优化系统性能等方法入手，经过多次升级改版，多次为大型集团公司定制开发，我们的客户有国家电网、中信集团、中电普华、国电通、自然堂、姿美堂、喝茶客、乐视商城、报喜鸟、品悦阳光等，优质的服务得到客户的一致好评。

除此之外，我们还提供区块链溯源、NFT、在线教育、在线考试、知识服务等各种类软件的开发服务，有需求随时联系我们。

易写科技官网 http://www.yixiekeji.com/

技术选型

主要技术体系

B2C开源商城	个人用户	企业用户
Gitee是否全部功能	是	是
代码是否全部可下载	是	是
注册中心	Nacos	Nacos
服务熔断	Sentinel	Sentinel
REST服务调用	OpenFeign	OpenFeign
负载均衡	Ribbon	Ribbon
网关	Gateway	Gateway
数据库	Mysql	Mysql
缓存	Redis	Redis
搜索	Elasticsearch	Elasticsearch
前端	uniapp	uniapp
代码生成器	无	免费赠送
是否可以商业使用	否，仅限个人研究、毕业设计等	可以
售后服务	无	1.一对一实时解答； 2.永久免费升级服务，第一时间获取最新版本； 3.商城BUG终身修复； 4. 一天技术一天业务讲解一共2天； 5.二次开发技术和业务免费咨询； 6.一次免费安装部署。
价格	免费	咨询客服

服务端技术说明

SpringCloud Alibaba是阿里巴巴提供的微服务开发一站式解决方案，其优势主要体现在以下几个方面：

全面的微服务治理能力

SpringCloud Alibaba集成了Spring Cloud和阿里巴巴开源中间件的优势，提供了全面的微服务治理能力。这包括服务发现与配置管理、分布式事务处理、负载均衡、熔断器、智能路由等，能够满足复杂微服务架构下的各种治理需求。

与Spring Cloud生态无缝集成

SpringCloud Alibaba与Spring Boot和Spring Cloud生态高度集成，这使得已有Spring技术栈的团队能够平滑过渡到SpringCloud Alibaba，降低了技术迁移的成本和风险。同时，这种集成也确保了SpringCloud Alibaba能够与Spring Cloud的其他组件和工具无缝协作，共同构建高效的微服务应用。

强大的中间件集成

SpringCloud Alibaba支持多种中间件，如Sentinel实现流量控制和熔断机制。这些中间件的集成提高了系统的稳定性和弹性，使得微服务应用能够更好地应对各种异常情况。

高性能和可扩展性

SpringCloud Alibaba在性能优化和可扩展性方面表现出色。其组件如Dubbo等在国内应用广泛，具有高性能和稳定性的特点。同时，SpringCloud Alibaba也支持水平扩展和垂直扩展，能够满足不同规模和需求的微服务应用。

活跃的社区和丰富的生态

SpringCloud Alibaba拥有活跃的社区和丰富的生态。社区中的开发者们积极分享经验、解决问题，为SpringCloud Alibaba的发展提供了强大的支持。同时，SpringCloud Alibaba也集成了多种开源组件和工具，形成了丰富的生态体系，使得开发者能够更方便地获取和使用各种资源和工具。

综上所述，SpringCloud Alibaba在微服务治理、与Spring Cloud生态集成、中间件集成、AI能力接入、高性能和可扩展性以及社区和生态等方面都表现出色。这些优势使得SpringCloud Alibaba成为微服务解决方案的重要选择之一。

Element管理端技术说明

Element UI的优势主要体现在以下几个方面：

丰富的组件库

Element UI 提供了一套完整的组件库，涵盖了按钮、表单、对话框、通知、导航等常用 UI 元素。这些组件经过精心设计，不仅外观美观，而且功能强大，能够满足大部分前端开发的需求。

高质量的文档和示例

Element UI 的文档非常详尽，每个组件都有详细的用法说明和示例代码。这不仅有助于开发者快速上手，还能在遇到问题时提供有效的解决方案。此外，文档中还包含了大量的最佳实践和常见问题的解答，对开发者来说非常实用。

易于定制和扩展

Element UI 允许开发者通过修改主题变量来自定义组件的样式，使其更符合项目的需求。同时，开发者还可以根据自己的需求扩展组件的功能，实现更加个性化的开发。

良好的社区支持

Element UI 拥有庞大的用户群体和活跃的社区，开发者可以在社区中分享经验、交流心得，共同解决问题。此外，社区中还有许多第三方插件和扩展，进一步丰富了 Element UI 的功能。

持续更新和维护

Element UI 的开发团队一直致力于组件库的更新和维护工作，不断修复已知问题、添加新功能，并优化组件的性能和稳定性。这使得 Element UI 能够跟上前端技术的发展趋势，保持其竞争力。

综上所述，Element UI 在组件库丰富性、文档质量、定制性、社区支持、兼容性、性能优化以及持续更新和维护等方面都表现出色。这些优势使得 Element UI 成为 Vue.js 开发者构建高质量前端应用的首选组件库之一。

uni-app端技术说明

uni-app的优势主要体现在以下几个方面：

跨平台开发能力

多平台支持：uni-app允许开发者使用一套代码，同时构建支持iOS、Android、H5、以及各种小程序（如微信、支付宝、百度、头条、QQ、钉钉等）的原生级别应用程序。这大大减少了开发者为不同平台单独开发的工作量，降低了开发成本和周期。
统一的开发体验：uni-app基于Vue.js框架，保留了Vue.js的大部分语法和特性，如组件、指令、计算属性、生命周期等。对于熟悉Vue.js的开发者来说，上手非常容易，无需学习新的框架或语法。

高效的开发效率

丰富的组件和API：uni-app提供了丰富的组件库和API，涵盖了设备信息、网络、存储、位置、媒体、界面交互等多个方面。这些组件和API的提供，使得开发者能够快速地构建出功能丰富、性能优越的应用程序。
条件编译：uni-app支持条件编译，允许开发者根据不同平台或条件来编写特定代码，实现平台差异性逻辑。这进一步提升了开发的灵活性和效率。

优秀的性能和稳定性

优化渲染机制：uni-app采用了优化的渲染机制和原生渲染，保证了应用的性能和流畅度。
内存管理：uni-app在内存管理方面也做了大量优化，确保了应用的稳定性。

丰富的生态和社区支持

活跃的插件市场：uni-app拥有一个活跃的插件市场，开发者可以方便地使用社区提供的插件，包括UI组件、工具函数、第三方SDK集成等。这些插件的提供，极大地提升了开发效率。
丰富的教程和文档：uni-app提供了丰富的教程和文档，帮助开发者快速上手和解决各种问题。
强大的社区支持：uni-app拥有庞大的开发者社区，开发者可以在社区中分享经验、交流心得，共同解决问题。

热更新和快速迭代能力

热更新：uni-app支持热更新，当应用发布后，可以在不重新提交应用到应用商店的情况下更新部分内容。这提升了应用的灵活性和用户体验。
快速迭代：由于uni-app支持跨平台开发，且拥有高效的开发效率和丰富的组件库，因此开发者能够快速地进行迭代和更新，满足不断变化的市场需求。

综上所述，uni-app在跨平台开发能力、高效的开发效率、优秀的性能和稳定性、丰富的生态和社区支持以及热更新和快速迭代能力等方面都表现出色。这些优势使得uni-app成为跨平台开发框架中的重要选择之一。

准备部署环境

服务端软件版本要求

JDK >= 1.8 (推荐1.8版本)
Mysql >= 5.7.0
Redis >= 3.0
Maven >= 3.0
Node >= 12
nacos >= 2.0.4
sentinel >= 1.6.0
Tomcat >= 8.0

启动图片服务器

现在图片存储分为两种方式，一种是存储磁盘，一种是集成了阿里云的OSS，建议正式环境使用阿里云OSS。

阿里云OSS购买链接地址

https://www.aliyun.com/product/oss?source=5176.29345612&userCode=5dz5rxbt

阿里云服务器ECS购买地址：

https://www.aliyun.com/product/ecs?source=5176.29345612&userCode=5dz5rxbt

另一种方式是存到磁盘，测试环境可以使用，可以直接启动。

下载“tomcat-img”，tomcat-img是一个tomcat，可以直接启动，里面只有一个项目，是图片服务器的项目，图片都会存储到磁盘中，默认端口是8080，可以根据自己的要求修改端口，修改完成启动Tomcat，图片服务器启动成功。

启动Elasticsearch

版本要求：安装Elasticsearch版本号是7.6.2，可以在git上下载，如果下载太慢，可以在华为云镜像上下载，华为云镜像网址： https://mirrors.huaweicloud.com/ 此次安装都为单机运营环境。

1.下载Elasticsearch7.6.2，根据操作系统的不同下载不同操作系统的版本。

2.解压缩下载对应版本的IK分词器，放入到plugins文件夹下面，供搜索使用，如下图：

3.在bin目录下启动Elasticsearch，启动完成之后再浏览器输入：http://127.0.0.1:9200/

能够正常输出，表示启动成功。

导入数据库

Mysql 5.7以上的版本，安装好后，创建数据库yixiekeji（或者根据需要自己修改），把yixiekeji.sql导入到数据库中。

启动Redis

对Redis的版本无特殊要求，正常启动即可。

Redis密码根据自己需求设定，项目中默认的Redis密码是：yixiekeji

启动Nacos和Sentinel

Nacos是一个更易于构建云原生应用的动态服务发现、配置管理和服务管理平台。在Nacos 官网https://nacos.io/zh-cn/index.html下载最新版本的Nacos，在bin目录下执行“./startup.sh -m standalone”单机启动，集群启动看Nacos官网。

启动之后输入: http://127.0.0.1:8848/nacos/ 看到以下界面表示启动成功：

说明：项目中只是把Nacos作为注册中心，所有的配置文件都放到yml中，如果您想把配置文件放入到Nacos中，可以自行修改一下。

Sentinel使用可以根据实际情况来决定，不影响项目整体运营，具体启动和介绍可以查看项目官网：https://sentinelguard.io/zh-cn/index.html。

启动服务

服务端项目说明

yixiekeji：
yixiekeji-core              //jar包，系统公共类文件，主要是一些公共的工具类
yixiekeji-api               //jar包，接口和实体类，OpenFeign接口、数据库对应的entity、VO对象等
yixiekeji-dao               //jar包，Mybatis和ES相关访问数据库的类文件
yixiekeji-provider-item     //商品服务提供者，需要启动，主要是商品、运营等相关的服务
yixiekeji-provider-order    //订单服务提供者，需要启动，主要是订单、购物车、发票等相关的服务
yixiekeji-provider-system   //系统服务提供者，需要启动，主要是会员、报表、权限等相关的服务
yixiekeji-gateway           //gateway网关，需要启动
yixiekeji-web-admin         //平台管理端服务消费者，需要启动，主要为管理员提供对应的接口，调用其他服务
yixiekeji-web-mobile        //用户端服务消费者，需要启动，主要为uniapp提供对应的接口，调用其他服务

启动服务提供者

启动商品服务yixiekeji-provider-item

修改商品服务 yixiekeji-provider-item 的配置文件

server:
  port: 8010   #端口，根据实际情况来修改
feign:
  sentinel:
    enabled: true
spring:
  profiles:
    active: dev
  application:
    name: YIXIEKEJI-ITEM-B2C
  main:
    allow-bean-definition-overriding: true
  cloud:
    nacos:
      discovery:
        server-addr: 127.0.0.1:8848   #nacos注册中心
    sentinel:
      transport:
        dashboard: 127.0.0.1:8849     #sentinel
      log:
        dir: /Users/wangpeng/Documents/logs #sentinel日志目录
  elasticsearch:
    rest:
      uris: http://127.0.0.1:9200
  redis:
    database: 0
    host: 127.0.0.1
    port: 6379
    password: yixiekeji
    timeout: 0
    jedis:
      pool:
        max-active: 1000
        max-idle: 10
        min-idle: 0
        max-wait: -1
  datasource:    #修改数据库的用户名和密码
    driverClassName: com.mysql.cj.jdbc.Driver
    type: com.alibaba.druid.pool.DruidDataSource
    url: jdbc:mysql://127.0.0.1:3306/yixiekeji?useUnicode=true&characterEncoding=UTF-8&allowMultiQueries=true&autoReconnect=true&useSSL=false&serverTimezone=Asia/Shanghai
    username: root
    password: 12345678

mybatis:
  mapper-locations: classpath:sql-mapper/shop/**/*.xml
  config-location: classpath:mybatis-config.xml
  type-aliases-package: com.yixiekeji.entity

logging:   #需要根据情况修改日志的存放目录
  config: classpath:logback-dev.xml
  path: /Users/wangpeng/Documents/logs
  file: item-provider.file
  level-service: INFO
  level-myibatis: INFO

现在分别进行说明：

端口和服务名称

server:
  port: 8010   #端口，根据实际情况来修改
feign:
  sentinel:
    enabled: true
spring:
  profiles:
    active: dev
  application:
    name: YIXIEKEJI-ITEM-B2C
  main:
    allow-bean-definition-overriding: true

注册中心nacos和sentinel配置，根据本地环境进行调整

  cloud:
    nacos:
      discovery:
        server-addr: 127.0.0.1:8848   #nacos注册中心
    sentinel:
      transport:
        dashboard: 127.0.0.1:8849     #sentinel
      log:
        dir: /Users/wangpeng/Documents/logs #sentinel日志目录

elasticsearch配置

  elasticsearch:
    rest:
      uris: http://127.0.0.1:9200

Redis配置，根据环境修改host、port、password

  redis:
    database: 0
    host: 127.0.0.1
    port: 6379
    password: yixiekeji
    timeout: 0
    jedis:
      pool:
        max-active: 1000
        max-idle: 10
        min-idle: 0
        max-wait: -1

Mysql配置，需要修改url、username、password

  datasource:    #修改数据库的用户名和密码
    driverClassName: com.mysql.cj.jdbc.Driver
    type: com.alibaba.druid.pool.DruidDataSource
    url: jdbc:mysql://127.0.0.1:3306/yixiekeji?useUnicode=true&characterEncoding=UTF-8&allowMultiQueries=true&autoReconnect=true&useSSL=false&serverTimezone=Asia/Shanghai
    username: root
    password: 12345678

日志配置，需要根据情况修改日志的存放目录

logging:   #需要根据情况修改日志的存放目录
  config: classpath:logback-dev.xml
  path: /Users/wangpeng/Documents/logs
  file: item-provider.file
  level-service: INFO
  level-myibatis: INFO

启动服务出现以下界面启动成功

启动订单服务yixiekeji-provider-order

同yixiekeji-provider-item服务

启动系统服务yixiekeji-provider-system

同yixiekeji-provider-item服务

启动服务消费者

启动管理员消费者服务yixiekeji-web-admin

同yixiekeji-provider-item服务

启动uniapp消费者服务yixiekeji-web-mobile

yixiekeji-provider-item服务

启动网关Gateway yixiekeji-gateway

网关Gateway可以启用，也可以不启用，不启动vue前端项目可以直接链接yixiekeji-web-admin和yixiekeji-web-mobile即可，如果启动Gateway，则链接到yixiekeji-gateway的地址。

Gateway基础配置

server:
  port: 8080
spring:
  application:
    # 应用名称
    name: YIXIEKEJI-GATEWAY-B2C
  profiles:
    # 环境配置
    active: dev
  main:
    allow-bean-definition-overriding: true

Nacos的配置以及跨域相关的配置

  cloud:
    nacos:
      discovery:
        # 服务注册地址
        server-addr: 127.0.0.1:8848
    gateway:
      globalcors:
        cors-configurations:
          '[/**]':
            allowedOrigins: "*"
            allowedHeaders: "*"
            allowedMethods: "*"
      default-filters:
        - DedupeResponseHeader=Vary Access-Control-Allow-Origin Access-Control-Allow-Credentials, RETAIN_FIRST
      discovery:
        locator:
          lowerCaseServiceId: true
          enabled: true

routes相关的配置，可以根据自己实际情况进行修改

      routes:
        # admin
        - id: YIXIEKEJI-ADMIN-B2C-WEB
          uri: lb://YIXIEKEJI-ADMIN-B2C-WEB
          predicates:
            - Path=/web-admin/**
          filters:
            - StripPrefix=1
        # mweb
        - id: YIXIEKEJI-MOBILE-B2C-WEB
          uri: lb://YIXIEKEJI-MOBILE-B2C-WEB
          predicates:
            - Path=/web-m/**
          filters:
            - StripPrefix=1

Element管理端环境部署

管理端采用的依赖包和版本号

  "dependencies": {
    "axios": "0.18.1",
    "clipboard": "^2.0.11",
    "core-js": "3.6.5",
    "echarts": "^4.2.1",
    "element-ui": "2.13.2",
    "js-cookie": "2.2.0",
    "normalize.css": "7.0.0",
    "nprogress": "0.2.0",
    "path-to-regexp": "2.4.0",
    "qs": "^6.10.1",
    "quill-image-drop-module": "^1.0.3",
    "screenfull": "^4.2.0",
    "vant": "^2.12.51",
    "vue": "2.6.10",
    "vue-drag-resize": "^1.5.4",
    "vue-quill-editor": "^3.0.6",
    "vue-router": "3.0.6",
    "vuedraggable": "^2.24.3",
    "vuex": "3.1.0"
  }

管理端项目启动

修改vue.config.js配置文件

  devServer: {
    port: port,
    overlay: {
      wranings: false,
      errors: true
    },
    proxy: {
      [process.env.VUE_APP_BASE_API]: {
        //根据环境修改此处配置文件
        target: `http://127.0.0.1:8081/`,
        changeOrigin: true,
        pathRewrite: { // 路径重写，
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      }
    }
  },

修改main.js

在main.js中修改线上图片资源、图片请求地址

import Vue from "vue";
import Cookies from "js-cookie";
import "normalize.css/normalize.css"; // a modern alternative to CSS resets
import permission from "@/directive/permission/index.js"; // 权限判断指令
import Element from "element-ui";
import "./styles/element-variables.scss";
import "@/styles/index.scss"; // global css
import App from "./App";
import store from "./store";
import router from "./router";
import "./assets/icons";
import "./icons";
import "./permission";
import "./utils/error-log";
import * as filters from "./filters";
import "@/icons/icon.css";

Vue.use(permission);
Vue.use(Element, {
  size: Cookies.get("size") || "medium",
});

Object.keys(filters).forEach((key) => {
  Vue.filter(key, filters[key]);
});

Vue.config.productionTip = false;

//  根据环境修改此处配置文件
Vue.prototype.$imagePath = "http://127.0.0.1:8080/b2cimage"; // 静态资源，图片路径前缀 
Vue.prototype.$imageUrl = "http://127.0.0.1:8081"; // 图片请求接口地址

修改获取验证码方法

本地项目启动需要手动改写登录页面的请求地址

服务器启动需要添加’/api//admin/system/verifyCode’

本地执行打包命令需要去掉’/api/admin/system/verifyCode’

  methods: {
    ...mapActions(["Login", "Logout"]),
    checkCapslock(e) {
      const { key } = e;
      this.capsTooltip = key && key.length === 1 && key >= "A" && key <= "Z";
    },
    // 获取验证码
    refreshCode() {
      this.fcode = "/admin/system/verifyCode?r=" + Math.random();
    },

管理端项目启动

a）：git clone      从gitee拉取代码
b）：cd admin       进入对应目录结构
c）：npm install    编译下载依赖
d）：npm run dev    运行项目
e）：npm run build  执行打包命令

管理端文档规范

1、文件名要求：文件名以小写开头，取对应页面的英文，如balancepwdadd.vue；
2、Css要求：css类要放在/assets/pageCommon/css里面，公共css文件index.css；
3、文件要求：对没有任何业务逻辑控制的页面，可以直接跳转；部分页面需要传参，弹框、message、头部、底部等需要大量代码去实现，要以组件的方式引入；
4、接口请求：看后台需要配置post、get，目前只用到这两种请求方式，post2类代表上传图片类接口请求；

管理端文件说明

请求接口文件说明

src/api 请求接口文件说明

all.js              //公共请求接口，包含数据字段、图片上传、权限、省市区等
member.js           //会员相关接口
memberComment.js    //商品评价相关的接口
menu.js             //获取路由接口
mIndex.js           //首页相关接口
news.js             //新闻相关的接口
order.js            //订单相关的接口
orderafter.js       //退换货相关接口
product.js          //商品相关接口
promotionbasics.js  //促销活动相关接口
report.js           //报表相关接口
role.js             //权限相关接口
search.js           //搜索相关接口
system.js           //系统相关接口，比如修改密码、管理员维护、支付方式维护等
user.js             //登录相关接口

管理端业务逻辑文件说明

views
    dashboard
        index.vue //首页
    error-page
        401.vue   //410页面
        404.vue   //404页面
    index
        mindexbannerlist.vue     //首页轮播图
        mindexfloordatalist.vue  //首页楼层
        mindexfloorlist.vue      //首页楼层数据
    login
        index.vue //登录
    member
        gradeconfigdownedit.vue   //会员年度经验值递减配置
        gradeconfigedit.vue       //会员等级配置
        gradevalueconfigedit.vue  //会员经验值规则配置
        intvalueconfigedit.vue    //会员积分规则配置
        memberlist.vue            //会员列表
    news
        news
            newsadd.vue   //文章管理添加
            newsedit.vue  //文章管理编辑
            newslist.vue  //文章管理列表
            newslook.vue  //文章管理查看
        newstype
            newstypelist.vue  //文章分类
    order
        orders
            ordersdetails.vue  //订单详情
            orderslist.vue     //全部订单
            orderslist1.vue    //未付款的订单
            orderslist2.vue    //待发货的订单
            orderslist3.vue    //已发货的订单
            orderslist4.vue    //已完成的订单
            orderslist5.vue    //已取消的订单
        productback
            backdetails.vue    //退货基本信息
            backedit.vue       //操作退货
            backlist.vue       //退货列表
        productexchange
            exchangedetails.vue  //换货基本信息
            exchangedit.vue      //操作换货
            exchangelist.vue     //换货列表
    product
        brand
            brandlist.vue  //品牌管理
        cate
            cateadd.vue     //商品分类新增
            catedetail.vue  //商品分类详情
            cateedit.vue    //商品分类编辑
            catelist.vue    //商品分类列表
        couriercompany
            couriercompanylist.vue  //物流公司管理
        norm
            normadd.vue     //商品规格新加
            normdetail.vue  //商品规格详情
            normedit.vue    //商品规格编辑
            normlist.vue    //商品规格列表
        pdt
            goodsset.vue        //商品库存价格修改
            listall.vue         //商品列表
            listdelsale.vue     //已删除的商品
            listonsale.vue      //正在售卖的商品
            listwaitsale.vue    //未售卖的商品
            productadd.vue      //商品新增
            productdetails.vue  //商品详情
            productedit.vue     //商品修改
        transport
            all_area.vue          //所有地区展示
            transportadd.vue      //商品运费添加
            transportdetails.vue  //商品运费详情
            transportedit.vue     //商品运费编辑
            transportlist.vue     //商品运费列表
        productcommentslist.vue   //商品评价管理
    promotion
        coupon
            couponadd.vue     //优惠券新加
            coupondetail.vue  //优惠券详情
            couponedit.vue    //优惠券编辑
            couponexport.vue  //优惠券导出
            couponlist.vue    //优惠券列表
        integral
            integraladd.vue         //积分商城添加
            integralbannerlist.vue  //积分商城轮播图管理
            integraledit.vue        //积分商城编辑
            integrallist.vue        //积分商城列表
            integrallook.vue        //积分商城查看
            integraltypelist.vue    //积分商城分类列表
    report
        orders
            chinaorder.vue          //全国订单分布统计
            goodsReturnRate.vue     //退货率统计
            orderOverview.vue       //订单概况统计
            saleOverview.vue        //销售概况统计
        memberview.vue              //会员增长走势统计
        reportorderday.vue          //没日订单销量统计
        reportproductday.vue        //每日商品销量统计
    search
        keyword.vue           //搜索关键字管理
        keywordfilter.vue     //搜索敏感词过滤设置
        keywordlist.vue       //搜索敏感词管理
        searchIndexes.vue     //索引初始化设置
        searchlogs.vue        //搜索日志管理
    system
        adminuser
            adminuserlist.vue //管理员管理
            clearcache.vue    //清除缓存
            editpwd.vue       //修改密码
        code
            codelist.vue      //数据字典管理
        config
            alipayconfig.vue  //支付宝配置
            kuaidiconfig.vue  //快递100配置
            ossconfig.vue     //OSS上传配置
            smsconfig.vue     //短信配置
            wxpayconfig.vue   //微信支付配置
        resource
            resourcelist.vue  //系统资源管理
        role
            rolelist.vue      //用户角色管理

uni-app用户端环境部署

项目采用的工具包和版本号

{
  "dependencies": {
    "jweixin-module": "^1.6.0",
    "pinia-plugin-persistedstate": "^3.2.1",
    "qrcode": "^1.5.3",
    "tki-qrcode": "^0.1.6",
    "vue-qrcode": "^2.2.2",
    "weixin-js-sdk": "^1.6.5"
  }
}

项目启动

修改接口请求地址/utils/requests.js

let token = ""; //凭证
import { login } from "@/store/login";

function service(options = {}) {
  let optionsApi = "";
  optionsApi = options.url;
  // #ifdef MP-WEIXIN
  // 小程序接口请求地址
  options.url = "https://127.0.0.1/prod-api/api" + `${options.url}`;  
  // #endif
  // #ifdef APP-PLUS
  // APP接口请求地址
  options.url = "http://127.0.0.1" + `${options.url}`;
  // #endif
  // #ifdef H5
  // H5打包请求地址
  options.url = "/prod-api" + `${options.url}`;
  // #endif
  console.log(login());
  //配置请求头
  options.header = {
    "content-type": "application/x-www-form-urlencoded;charset=UTF-8",
    token: login().token, //Bearer
    //获取存储的cookie,仅在mp小程序环境运行
    // #ifdef MP
    // 'cookie': uni.getStorageSync("shiro")
    // #endif
  };

// …………………………

配置请求头/utils/requests.js

//配置请求头，可以根据自己本地环境进行调整
  options.header = {
    "content-type": "application/x-www-form-urlencoded;charset=UTF-8",
    token: login().token, //Bearer
    //获取存储的cookie,仅在mp小程序环境运行
    // #ifdef MP
    // 'cookie': uni.getStorageSync("shiro")
    // #endif
  };

修改图片服务器 main.js

import App from './App'
import HeadNav from "./components/navbar/index.vue";
import * as Pinia from 'pinia'

import {
    createSSRApp
} from 'vue'

export function createApp() {
    const app = createSSRApp(App)
    // 创建pinia实例
    const pinia = Pinia.createPinia()
    // 使用pinia
    app.use(pinia)
    // 根据图片服务器的网址，修改配置
    app.config.globalProperties.imageUrl = 'http://127.0.0.1/b2cimage'
    app.component("HeadNav", HeadNav);
    return {
        app,
        Pinia
    }
}

修改H5的代理

H5段需要配置代理，其他端可以不用进行此项配置

import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'

export default defineConfig({
    plugins: [
        uni()
    ],
    server: {
        port: 5173,
        proxy: {
            '/prod-api': {
                // 目标服务接口，根据本地环境进行修改
                target: 'http://127.0.0.1/', 
                changeOrigin: true,
                rewrite: path => path.replace(/^\/prod-api/, ''),
            }
        }
    }
})

项目启动运行

在Hbuild X点击运行, 选择运行到相应容器即可。

项目文件说明

请求接口文件说明

api 请求接口文件说明

cart.js            //购物车请求相关接口
classification.js  //分类和商品列表页相关接口
coupon.js          //优惠券相关接口
goodsDetail.js     //商品详情页相关接口
homePage.js        //首页相关接口
integralPage.js    //积分商城相关接口
invoice.js         //发票相关接口
login.js           //登录注册相关接口
member.js          //用户中心会员相关包括用户收货地址、收藏等相关接口
order.js           //下单相关接口
pay.js             //支付相关接口
reviews.js         //评论相关接口
search.js          //搜索相关接口
shopInvoice.js     //发票相关接口

业务逻辑文件说明

pages 目录下

classification
    classification.vue          //分类列表页
homePage
    couponList.vue              //首页调整到全部优惠券
    goodsDetail.vue             //商品详情
    homepage.vue                //首页
    newsDetails.vue             //新闻详情
    newsPage.vue                //新闻列表
    noDataPage.vue              //无数据页面
    reviewsPage.vue             //商品评价
    searchPage.vue              //点击搜索框跳转到搜索页面
    searchResult.vue            //搜索结果页面
loginInterface
    privacyAgreement   
        privacyAgreement.vue     //隐私政策
    registerProtocol
        registerProtocol.vue     //注册协议
    loginInterface.vue           //验证码登录
    passwordLogin.vue            //密码登录
    registerPage.vue             //注册
    resetPassword.vue            //未登录时忘记密码页面
memberCenter
    address
        addAddress.vue           //收货地址新增和修改
        address.vue              //收货地址列表
    commentPage
        addComment.vue           //添加评论
        commentPage.vue          //我得评价
    couponsPage
        couponsPage.vue          //优惠券适用商品
    integralPage
        confirmOrder.vue         //积分商城确认订单
        integralDetails.vue      //积分商城商品详情
        integralEXP.vue          //积分和经验值
        integralPage.vue         //积分商城首页
    invoice
        alertInvoice.vue         //发票中心
    myOrder
        commentList.vue          //我的订单跳转到评价页面
        myOrder.vue              //我的订单列表
        orderDetail.vue          //订单详情
        returnsExchanges.vue     //我的订单调整到退换货页面
    personalInformation
        alterNikename.vue        //修改个人信息
        personalInformation.vue  //个人信息展示
    returnsExchanges
        deliveryPage.vue         //退换货发货
        exchangesPage.vue        //换货列表页
        logisticsInformation.vue //物流信息
        returnsPage.vue          //退货列表页
    alertPhoneNumber.vue         //更改绑定手机号
    collectPage.vue              //收藏
    findMe.vue                   //联系我们
    memberCenter.vue             //个人中心
    myCoupon.vue                 //我的优惠券
    resetPassword.vue            //重置密码
shoppingCart
    commitSuccess.vue            //提交订单成功页面
    confirmOrder.vue             //提交订单
    paymentMethod.vue            //支付方式选择页面
    paySuccess.vue               //支付成功页面
    ShoppingCart.vue             //购物车页面

如果您觉得系统还不错，且确实能够对您起到帮助作用，在此诚挚地邀请您给予一个Star！！！

总体介绍

用户端界面

管理端界面

演示环境

管理端

用户端

后台主要功能

用户端主要功能

售后服务

企业

个人

联系方式

版权声明以及授权

公司简介

技术选型

主要技术体系

服务端技术说明

全面的微服务治理能力

与Spring Cloud生态无缝集成

强大的中间件集成

高性能和可扩展性

活跃的社区和丰富的生态

Element管理端技术说明

丰富的组件库

高质量的文档和示例

易于定制和扩展

良好的社区支持

持续更新和维护

uni-app端技术说明

跨平台开发能力

高效的开发效率

优秀的性能和稳定性

丰富的生态和社区支持

热更新和快速迭代能力

准备部署环境

服务端软件版本要求

启动图片服务器

启动Elasticsearch

导入数据库

启动Redis

启动Nacos和Sentinel

启动服务

服务端项目说明

启动服务提供者

启动商品服务yixiekeji-provider-item

启动订单服务yixiekeji-provider-order

启动系统服务yixiekeji-provider-system

启动服务消费者

启动管理员消费者服务yixiekeji-web-admin

启动uniapp消费者服务yixiekeji-web-mobile

启动网关Gateway yixiekeji-gateway

Element管理端环境部署

管理端采用的依赖包和版本号

管理端项目启动

修改vue.config.js配置文件

修改main.js

修改获取验证码方法

管理端项目启动

管理端文档规范

管理端文件说明

请求接口文件说明

管理端业务逻辑文件说明

uni-app用户端环境部署

项目采用的工具包和版本号

项目启动

修改接口请求地址**/utils/requests.js**

配置请求头**/utils/requests.js**

修改图片服务器 main.js

修改H5的代理

项目启动运行

项目文件说明

请求接口文件说明

业务逻辑文件说明

修改接口请求地址/utils/requests.js

配置请求头/utils/requests.js