基于微信小程序的茶叶在线商城系统（后台Java+Spring boot+VUE+MySQL）

待我称王封你为后i 2024-04-01 16:15 36阅读 0赞

目录  
1 绪论 3  
1.1 项目开发背景 4  
1.2 项目开发意义 4  
1.3 项目主要的内容 4  
2 开发环境及相关技术概述 4  
2.1 相关技术 4  
2.2 系统环境开发条件 6  
3 系统的需求分析与设计 6  
3.1可行性分析 6  
3.2需求分析 6  
3.2.1系统总体概述 6  
3.2.2功能性需求 7  
3.2.3非功能性需求 7  
3.2.4流程图设计 8  
3.2.5系统ER图设计 10  
3.3 数据库设计 12  
3.4系统运行环境 15  
4 系统功能模块的实现 15  
4.1 后端登陆页面的实现 16  
4.2后端商品列表页面实现 17  
4.3 后端类别管理 18  
4.4 后端订单管理 19  
4.5 后端留言评论管理 19  
4.6 前端页面的实现 20  
商品前端展示列表部分代码如下： 21  
5 系统测试 22  
5.1 登陆页面的实现测试 23  
5.2 类别管理 23  
5.4 商品管理 24  
5.5 订单管理 24  
结　论 24  
参考文献 25  
1.3项目主要的内容  
微信茶叶购买小程序从可行性、便捷性等方面进行需求分析。对微信茶叶购买小程序的数据库、功能进行了详细设计，分析了主要界面设计和相关组件设计，微信点餐小程序的具体实现进行了介绍。从数据库中获取数据、向数据库中写入数据，实现系统直接对数据库进行各种数据库查询、插入、删除、更新等操作，在网页中加入动态内容，从而实现小程序所需要的各种基本功能。  
当客户想要购买茶叶的时候便可以在小程序中浏览到自己想要的产品，并且足不出户就可以购买到自己想要的产品并且送货上门，部署云服务器，可以让更多的人访问到，并了解到我们的产品实现购买。  
首页内容：在首页的搜索功能可以帮助用户迅速的找到他们需要的商品：类型功能把所有的商品分为几个大类，可以让用户根据自己的需求选择，推荐功能是根据客户的搜索比例进行一个推荐的功能，根据一个大数据的统计来推测你当前需要的产品和心灵的商品，这个功能可能比较难以实现。  
全部宝贝页内容：在这个页面你可以看到所有商品，可以根据自己的需求选择不同的大类，，每一个大类里面有，不同的小类。  
购物车页内容：在购物车页面可以查看自己添加到购物车的商品，并进行商品的结算支付。可以在本页面对购物车里面的商品，进行商品数量的修改以及商品的删除，并且可以在这个页面联系客服反馈问题，咨询问题；  
我的页内容：在我的页面可以查询自己的订单状况以及修改订单的确认收货以及退款售后服务，订单的物流情况查看商品是否出库，本文转载自http://www.biyezuopin.vip/onews.asp?id=17008以及收货情况。设置收货地址，更改收货地址，及登录自己的个人账号或者更改登录情况。  
2.2 系统环境开发条件  
该系统采用B/S架构，前端框架使用微信开发者工具开发，后台数据实现使用MYSQL  
软件环境—windows7  
数据库MYSQL-Navicat Premium 15  
编程软件—IDEA

//app.js
    App({
        
      onLaunch: function () {
        
        // 展示本地存储能力
        var logs = wx.getStorageSync('logs') || []
        logs.unshift(Date.now())
        wx.setStorageSync('logs', logs)
    
        // 登录
        wx.login({
        
          success: res => {
        
            // 发送 res.code 到后台换取 openId, sessionKey, unionId
          }
        })
        // 获取用户信息
        wx.getSetting({
        
          success: res => {
        
            if (res.authSetting['scope.userInfo']) {
        
              // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
              wx.getUserInfo({
        
                success: res => {
        
                  // 可以将 res 发送给后台解码出 unionId
                  this.globalData.userInfo = res.userInfo
    
                  // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
                  // 所以此处加入 callback 以防止这种情况
                  if (this.userInfoReadyCallback) {
        
                    this.userInfoReadyCallback(res)
                  }
                }
              })
            }
          }
        })
      },
      globalData: {
        
        userInfo: null
      }
    })

![在这里插入图片描述][7a3f05b7913643498288e51f4fdbfba4.png_pic_center]  
![在这里插入图片描述][f67f28f9369d4c0abc9ff4b80714e1a3.png_pic_center]  
![在这里插入图片描述][b5a9bd732c594df8ab9c7372770e29cd.png_pic_center]  
![在这里插入图片描述][6382de7d218e474cb1c7e76dd4be31bc.png_pic_center]  
![在这里插入图片描述][0a3256e42ece41e5986e9d798da4a96b.png_pic_center]  
![在这里插入图片描述][68e3cb9fa32d41a9bcae3c31e8254101.png_pic_center]  
![在这里插入图片描述][25ab0672e97344958d588828dc41c63b.png_pic_center]  
![在这里插入图片描述][3cfb531efc144bd6ba2489c4bcad221b.png_pic_center]  
![在这里插入图片描述][7ad5544e119e436e8cadda7227194053.png_pic_center]  
![在这里插入图片描述][7c6c59c433d64f9894c854966c7c4eac.png_pic_center]  
![在这里插入图片描述][80dd58f253eb466b83ba8fa9382514ed.png_pic_center]  
![在这里插入图片描述][9a41ba33f81d47bc9b7565c5dac08481.png_pic_center]  
![在这里插入图片描述][1fe145a713e34857ad3aceb15958df2a.png_pic_center]  
![在这里插入图片描述][69ede9ae20024ef39884d584d23a59d3.png_pic_center]  
![在这里插入图片描述][f8580b1b8d1b468e9992e2a66a3137f0.png_pic_center]  
![在这里插入图片描述][2dff66a85016445eb584ec94b9de7f05.png_pic_center]  
![在这里插入图片描述][8c34f3c0808c4c279f96c38f32e5249f.png_pic_center]

[7a3f05b7913643498288e51f4fdbfba4.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/69f69c1fddeb48ddba8ff36373e0f165.png
[f67f28f9369d4c0abc9ff4b80714e1a3.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/ce6544027d5a41c9816f849cb7509384.png
[b5a9bd732c594df8ab9c7372770e29cd.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/9957947b596a422d85bdca2a8c7a0836.png
[6382de7d218e474cb1c7e76dd4be31bc.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/9f6465cb45e240b5a972abf53157bf65.png
[0a3256e42ece41e5986e9d798da4a96b.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/bb20b22a2df04833844672817dd9848c.png
[68e3cb9fa32d41a9bcae3c31e8254101.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/f7eefb38b96a4711a3ffc2442ba7a51e.png
[25ab0672e97344958d588828dc41c63b.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/96558ad4ed6a4ba89b1b77059a8c54c4.png
[3cfb531efc144bd6ba2489c4bcad221b.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/26c87cba2afe4a1089d950bbaeb0ea9b.png
[7ad5544e119e436e8cadda7227194053.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/0dce7803e1164bc28fdd4b7a033ccf85.png
[7c6c59c433d64f9894c854966c7c4eac.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/0699a797975f47c8b1fef3146e185ff8.png
[80dd58f253eb466b83ba8fa9382514ed.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/30c95b352b9c4d29809e5717ff95b9d6.png
[9a41ba33f81d47bc9b7565c5dac08481.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/0efc93c55af146f08bf2119af8c19cec.png
[1fe145a713e34857ad3aceb15958df2a.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/f1a644b2dee844ba969b8ee2bbff9486.png
[69ede9ae20024ef39884d584d23a59d3.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/dfa440b9f3244d1f87d397c20b3c543e.png
[f8580b1b8d1b468e9992e2a66a3137f0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/60cc9c7d7d8547a28b495d050301afe6.png
[2dff66a85016445eb584ec94b9de7f05.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/ebc56385ed8f41a9b2172dd0224872d8.png
[8c34f3c0808c4c279f96c38f32e5249f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/cb944e8b5cb04152a85552346a9403c0.png