前端Uni-app开发微信小程序|微信小程序手机商城

简介: 前端Uni-app开发微信小程序|微信小程序手机商城

项目编号:BS-XCX-020

一,环境介绍

语言环境:Java:  jdk1.8

数据库:Mysql: mysql5.7

应用服务器:Tomcat:  tomcat8.5.31

开发工具:IDEA或eclipse

后台开发技术:SSM框架  

前台开发技术:uni-app+微信小程序+vue

二,项目简介

随着互联网络的发展,网上购物越来越为人们所关注。网上购物给用户提供方便的购买途径,只要简单的网络操作,足不出户,即可送货上门,种类齐全,并具有完善的售后服务。我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱,购物系统设计被用户普遍使用,为方便用户能够可以随时进行购物系统设计的数据信息管理,特开发了基于购物系统设计的管理系统。

购物系统设计的设计主要是对系统所要实现的功能进行详细考虑,确定所要实现的功能后进行界面的设计,在这中间还要考虑如何可以更好的将功能及页面进行很好的结合,方便用户可以很容易明了的找到自己所需要的信息,还有系统平台后期的可操作性,通过对信息内容的详细了解进行技术的开发。

购物系统设计的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与购物系统设计管理的实际需求相结合,讨论了基于购物系统设计管理的使用。

互联网是人类的基本需求,特别是在现代社会,个人压力增大,社会运作节奏高,随着互联网的快速发展,用户的需求也越来越高,用户也将越来越多依靠互联网而不是自己获取信息,使得各种软件程序的开发得到了应用。

近年来,随着我国经济的不断发展,平台的管理制度越来越多。每个购物系统设计也都将通过计算机进行整体智能化操作,对于购物系统设计功能所牵扯的数据都是通过进行购物系统设计等相关的数据信息内容、并且可以进行管理员后台;首页、个人中心、商品分类管理、商品信息管理、特价商品管理、用户管理、留言板管理、系统管理、订单管理,可以通过系统进行分配,传统的学习方式信息已经无法满足用户的需求。为此开发了本购物系统设计 ,为用户提供一个基于购物系统设计,同时方便用户在前台;首页、商品信息、特价商品、我的等详细情况进行操作。该系统满足了用户对购物系统设计信息获取的需求,并且信息可以及时、准确、有效地进行查看并且系统化、标准化和有效的工作。

我们可以根据数据结构的详细分析要求,我们根据输入和输出数据量的要求进行分析,确定什么表表,结构之间的关系,我们可以验证,调整和完善,查询和浏览过程,可以实现数据库,以使用户对数据和功能有更多要求。

基于系统使用的数据库管理系统的特点,对数据库的概念模型进行了转换和构建。但是,这个系统只需要充分考虑购物系统设计的功能,而且组织比较清晰。

表4.1地址表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

2

yonghu_id

Integer

用户id

3

address_name

String

地址

4

address_phone

String

电话

5

isdefault_types

Integer

是否默认地址

6

insert_time

Date

创建时间

表4.2购物车表表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

7

yonghu_id

Integer

用户id

8

goods_id

Integer

商品id

9

buy_number

Integer

购买数量

10

insert_time

Date

创建时间

表4.3客服聊天表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

11

yonghu_id

Integer

提问用户

12

chat_issue

String

问题

13

chat_reply

String

回复

14

issue_time

Date

问题时间

15

reply_time

Date

回复时间

16

zhuangtai_types

Integer

状态

17

chat_types

Integer

数据类型

18

insert_time

Date

创建时间

表4.4字典表表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

19

dic_code

String

字段

20

dic_name

String

字段名

21

code_index

Integer

编码

22

index_name

String

编码名字

23

super_id

Integer

父字段id

24

beizhu

String

备注

25

create_time

Date

创建时间

表4.5商品信息表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

26

goods_name

String

商品名称

27

goods_types

Integer

商品分类

28

goods_biaoqian_types

Integer

商品标签

29

goods_photo

String

图片

30

goods_pinpai

String

品牌

31

goods_guige

String

规格

32

goods_new_money

BigDecimal

现价

33

goods_click_time

Date

最近点击时间

34

goods_click_number

Integer

点击次数

35

goods_content

String

商品详情

36

insert_time

Date

创建时间

表4.6商品收藏表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

37

goods_id

Integer

商品

38

yonghu_id

Integer

用户

39

insert_time

Date

收藏时间

40

create_time

Date

创建时间

表4.7商品评论表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

41

goods_id

Integer

评论商品

42

yonghu_id

Integer

评论人

43

insert_time

Date

评论时间

44

goods_commentback_content

String

评论内容

45

goods_reply_content

String

回复内容

46

create_time

Date

创建时间

表4.8商品资讯表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

47

news_name

String

资讯名称

48

news_photo

String

资讯图片

49

news_types

Integer

资讯类型

50

insert_time

Date

资讯发布时间

51

news_content

String

资讯详情

52

create_time

Date

创建时间

表4.9订单表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

53

insert_time

Date

创建时间

54

goods_order_uuid_number

String

订单编号

55

yonghu_id

Integer

用户id

56

goods_id

Integer

商品id

57

buy_number

Integer

购买数量

58

price

float

价格/积分

59

discountprice

float

折扣价格

60

total

float

总价格/总积分

61

discounttotal

float

折扣总价格

62

order_types

Integer

订单状态

63

address_id

Integer

地址

表4.10用户表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

64

yonghu_name

String

用户姓名

65

yonghu_phone

String

用户手机号

66

yonghu_id_number

String

用户身份证号

67

new_money

BigDecimal

余额

68

create_time

Date

创建时间

表4.11用户表表

序号

列名

数据类型

说明

允许空

1

Id

Int

id

69

role

String

角色

70

addtime

Date

新增时间

三,系统展示

用户注册

用户登录

小程序首页

商品详情

用户充值

我的订单

四,核心代码展示

package com.controller;
import java.text.SimpleDateFormat;
import com.alibaba.fastjson.JSONObject;
import java.util.*;
import org.springframework.beans.BeanUtils;
import javax.servlet.http.HttpServletRequest;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import com.service.TokenService;
import com.utils.StringUtil;
import java.lang.reflect.InvocationTargetException;
import com.service.DictionaryService;
import org.apache.commons.lang3.StringUtils;
import com.annotation.IgnoreAuth;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.entity.*;
import com.entity.view.*;
import com.service.*;
import com.utils.PageUtils;
import com.utils.R;
import com.alibaba.fastjson.*;
/**
 * 购物车表
 * 后端接口
 * @author
 * @email
*/
@RestController
@Controller
@RequestMapping("/cart")
public class CartController {
    private static final Logger logger = LoggerFactory.getLogger(CartController.class);
    @Autowired
    private CartService cartService;
    @Autowired
    private TokenService tokenService;
    @Autowired
    private DictionaryService dictionaryService;
    //级联表service
    @Autowired
    private GoodsService goodsService;
    @Autowired
    private YonghuService yonghuService;
    /**
    * 后端列表
    */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params, HttpServletRequest request){
        logger.debug("page方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(StringUtil.isEmpty(role))
            return R.error(511,"权限为空");
        else if("用户".equals(role))
            params.put("yonghuId",request.getSession().getAttribute("userId"));
        if(params.get("orderBy")==null || params.get("orderBy")==""){
            params.put("orderBy","id");
        }
        PageUtils page = cartService.queryPage(params);
        //字典表数据转换
        List<CartView> list =(List<CartView>)page.getList();
        for(CartView c:list){
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(c);
        }
        return R.ok().put("data", page);
    }
    /**
    * 后端详情
    */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        logger.debug("info方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
        CartEntity cart = cartService.selectById(id);
        if(cart !=null){
            //entity转view
            CartView view = new CartView();
            BeanUtils.copyProperties( cart , view );//把实体数据重构到view中
                //级联表
                GoodsEntity goods = goodsService.selectById(cart.getGoodsId());
                if(goods != null){
                    BeanUtils.copyProperties( goods , view ,new String[]{ "id", "createDate"});//把级联的数据添加到view中,并排除id和创建时间字段
                    view.setGoodsId(goods.getId());
                }
                //级联表
                YonghuEntity yonghu = yonghuService.selectById(cart.getYonghuId());
                if(yonghu != null){
                    BeanUtils.copyProperties( yonghu , view ,new String[]{ "id", "createDate"});//把级联的数据添加到view中,并排除id和创建时间字段
                    view.setYonghuId(yonghu.getId());
                }
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(view);
            return R.ok().put("data", view);
        }else {
            return R.error(511,"查不到数据");
        }
    }
    /**
    * 后端保存
    */
    @RequestMapping("/save")
    public R save(@RequestBody CartEntity cart, HttpServletRequest request){
        logger.debug("save方法:,,Controller:{},,cart:{}",this.getClass().getName(),cart.toString());
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(StringUtil.isEmpty(role))
            return R.error(511,"权限为空");
        else if("用户".equals(role))
            cart.setYonghuId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));
        Wrapper<CartEntity> queryWrapper = new EntityWrapper<CartEntity>()
            .eq("yonghu_id", cart.getYonghuId())
            .eq("goods_id", cart.getGoodsId())
            .eq("buy_number", cart.getBuyNumber())
            ;
        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        CartEntity cartEntity = cartService.selectOne(queryWrapper);
        if(cartEntity==null){
            cart.setInsertTime(new Date());
            cartService.insert(cart);
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }
    /**
    * 后端修改
    */
    @RequestMapping("/update")
    public R update(@RequestBody CartEntity cart, HttpServletRequest request){
        logger.debug("update方法:,,Controller:{},,cart:{}",this.getClass().getName(),cart.toString());
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(StringUtil.isEmpty(role))
            return R.error(511,"权限为空");
        else if("用户".equals(role))
            cart.setYonghuId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));
        //根据字段查询是否有相同数据
        Wrapper<CartEntity> queryWrapper = new EntityWrapper<CartEntity>()
            .notIn("id",cart.getId())
            .andNew()
            .eq("yonghu_id", cart.getYonghuId())
            .eq("goods_id", cart.getGoodsId())
            .eq("buy_number", cart.getBuyNumber())
            ;
        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        CartEntity cartEntity = cartService.selectOne(queryWrapper);
        if(cartEntity==null){
            //  String role = String.valueOf(request.getSession().getAttribute("role"));
            //  if("".equals(role)){
            //      cart.set
            //  }
            cartService.updateById(cart);//根据id更新
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }
    /**
    * 删除
    */
    @RequestMapping("/delete")
    public R delete(@RequestBody Integer[] ids){
        logger.debug("delete:,,Controller:{},,ids:{}",this.getClass().getName(),ids.toString());
        cartService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
}
package com.controller;
import java.text.SimpleDateFormat;
import com.alibaba.fastjson.JSONObject;
import java.util.*;
import org.springframework.beans.BeanUtils;
import javax.servlet.http.HttpServletRequest;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import com.service.TokenService;
import com.utils.StringUtil;
import java.lang.reflect.InvocationTargetException;
import com.service.DictionaryService;
import org.apache.commons.lang3.StringUtils;
import com.annotation.IgnoreAuth;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.entity.*;
import com.entity.view.*;
import com.service.*;
import com.utils.PageUtils;
import com.utils.R;
import com.alibaba.fastjson.*;
/**
 * 商品信息
 * 后端接口
 * @author
 * @email
*/
@RestController
@Controller
@RequestMapping("/goods")
public class GoodsController {
    private static final Logger logger = LoggerFactory.getLogger(GoodsController.class);
    @Autowired
    private GoodsService goodsService;
    @Autowired
    private TokenService tokenService;
    @Autowired
    private DictionaryService dictionaryService;
    //级联表service
    @Autowired
    private YonghuService yonghuService;
    /**
    * 后端列表
    */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params, HttpServletRequest request){
        logger.debug("page方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(StringUtil.isEmpty(role))
            return R.error(511,"权限为空");
        else if("用户".equals(role))
            params.put("yonghuId",request.getSession().getAttribute("userId"));
        if(params.get("orderBy")==null || params.get("orderBy")==""){
            params.put("orderBy","id");
        }
        PageUtils page = goodsService.queryPage(params);
        //字典表数据转换
        List<GoodsView> list =(List<GoodsView>)page.getList();
        for(GoodsView c:list){
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(c);
        }
        return R.ok().put("data", page);
    }
    /**
    * 后端详情
    */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        logger.debug("info方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
        GoodsEntity goods = goodsService.selectById(id);
        if(goods !=null){
            //entity转view
            GoodsView view = new GoodsView();
            BeanUtils.copyProperties( goods , view );//把实体数据重构到view中
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(view);
            goods.setGoodsClickTime(new Date());
            goods.setGoodsClickNumber(goods.getGoodsClickNumber()+1);
            goodsService.updateById(goods);
            return R.ok().put("data", view);
        }else {
            return R.error(511,"查不到数据");
        }
    }
    /**
    * 后端保存
    */
    @RequestMapping("/save")
    public R save(@RequestBody GoodsEntity goods, HttpServletRequest request){
        logger.debug("save方法:,,Controller:{},,goods:{}",this.getClass().getName(),goods.toString());
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(StringUtil.isEmpty(role))
            return R.error(511,"权限为空");
        Wrapper<GoodsEntity> queryWrapper = new EntityWrapper<GoodsEntity>()
            .eq("goods_name", goods.getGoodsName())
            .eq("goods_types", goods.getGoodsTypes())
            .eq("goods_biaoqian_types", goods.getGoodsBiaoqianTypes())
            .eq("goods_pinpai", goods.getGoodsPinpai())
            .eq("goods_guige", goods.getGoodsGuige())
            .eq("goods_click_number", goods.getGoodsClickNumber())
            .eq("goods_temai_types", goods.getGoodsTemaiTypes())
            ;
        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        GoodsEntity goodsEntity = goodsService.selectOne(queryWrapper);
        if(goodsEntity==null){
            goods.setInsertTime(new Date());
            goodsService.insert(goods);
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }
    /**
    * 后端修改
    */
    @RequestMapping("/update")
    public R update(@RequestBody GoodsEntity goods, HttpServletRequest request){
        logger.debug("update方法:,,Controller:{},,goods:{}",this.getClass().getName(),goods.toString());
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(StringUtil.isEmpty(role))
            return R.error(511,"权限为空");
        //根据字段查询是否有相同数据
        Wrapper<GoodsEntity> queryWrapper = new EntityWrapper<GoodsEntity>()
            .notIn("id",goods.getId())
            .andNew()
            .eq("goods_name", goods.getGoodsName())
            .eq("goods_types", goods.getGoodsTypes())
            .eq("goods_biaoqian_types", goods.getGoodsBiaoqianTypes())
            .eq("goods_pinpai", goods.getGoodsPinpai())
            .eq("goods_guige", goods.getGoodsGuige())
            .eq("goods_click_number", goods.getGoodsClickNumber())
            .eq("goods_temai_types", goods.getGoodsTemaiTypes())
            ;
        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        GoodsEntity goodsEntity = goodsService.selectOne(queryWrapper);
        if("".equals(goods.getGoodsPhoto()) || "null".equals(goods.getGoodsPhoto())){
                goods.setGoodsPhoto(null);
        }
        if(goodsEntity==null){
            //  String role = String.valueOf(request.getSession().getAttribute("role"));
            //  if("".equals(role)){
            //      goods.set
            //  }
            goodsService.updateById(goods);//根据id更新
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }
    /**
    * 删除
    */
    @RequestMapping("/delete")
    public R delete(@RequestBody Integer[] ids){
        logger.debug("delete:,,Controller:{},,ids:{}",this.getClass().getName(),ids.toString());
        goodsService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
}

五,相关作品展示

基于Java开发、Python开发、PHP开发、C#开发等相关语言开发的实战项目

基于Nodejs、Vue等前端技术开发的前端实战项目

基于微信小程序和安卓APP应用开发的相关作品

基于51单片机等嵌入式物联网开发应用

基于各类算法实现的AI智能应用

基于大数据实现的各类数据管理和推荐系统


相关文章
|
7天前
|
前端开发 JavaScript 安全
揭秘!前端大牛们如何高效解决跨域问题,提升开发效率!
【10月更文挑战第30天】在Web开发中,跨域问题是一大挑战。本文介绍前端大牛们常用的跨域解决方案,包括JSONP、CORS、postMessage和Nginx/Node.js代理,对比它们的优缺点,帮助初学者提升开发效率。
25 4
|
30天前
|
负载均衡 前端开发 JavaScript
前端研发链路之开发
本文首发于微信公众号“前端徐徐”,作者徐徐。文章介绍了前端研发链路中的开发部分,重点探讨了开发服务器(dev-server)、热更新(hot-reload)、数据模拟(mock)和代理(proxy)等关键技术,帮助开发者理解其基本原理和应用场景,提升开发效率和代码质量。
32 2
前端研发链路之开发
|
24天前
|
人工智能 前端开发 测试技术
探索前端与 AI 的结合:如何用 GPT-4 助力开发效率
本文介绍了 GPT-4 如何成为前端开发者的“神队友”,让开发变得更加高效愉快。无论是需求到代码的自动生成、快速调试和性能优化,还是自动化测试和技术选型,GPT-4 都能提供极大的帮助。通过智能生成代码、捕捉 BUG、优化性能、自动化测试生成以及技术支持,GPT-4 成为开发者不可或缺的工具,帮助他们从繁重的手动任务中解脱出来,专注于创新和创意。GPT-4 正在彻底改变开发流程,让开发者从“辛苦码农”转变为“效率王者”。
28 0
探索前端与 AI 的结合:如何用 GPT-4 助力开发效率
|
29天前
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
451 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
|
24天前
|
JavaScript 前端开发 应用服务中间件
Vue开发中,在实现单页面应用(SPA)前端路由时的hash模式和history模式的区别及详细介绍
Vue开发中,在实现单页面应用(SPA)前端路由时的hash模式和history模式的区别及详细介绍
20 0
|
30天前
|
前端开发 JavaScript 小程序
前端uni开发后端用PHP的圈子系统该 如何做源码?
圈子系统系统基于TP6+Uni-app框架开发;客户移动端采用uni-app开发,管理后台TH6开发。系统支持微信公众号端、微信小程序端、H5端、PC端多端账号同步,可快速打包生成APP
|
24天前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
107 2
|
24天前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
35 0
|
24天前
|
人工智能 自然语言处理 运维
前端大模型应用笔记(一):两个指令反过来说大模型就理解不了啦?或许该让第三者插足啦 -通过引入中间LLM预处理用户输入以提高多任务处理能力
本文探讨了在多任务处理场景下,自然语言指令解析的困境及解决方案。通过增加一个LLM解析层,将复杂的指令拆解为多个明确的步骤,明确操作类型与对象识别,处理任务依赖关系,并将自然语言转化为具体的工具命令,从而提高指令解析的准确性和执行效率。
|
24天前
|
存储 弹性计算 算法
前端大模型应用笔记(四):如何在资源受限例如1核和1G内存的端侧或ECS上运行一个合适的向量存储库及如何优化
本文探讨了在资源受限的嵌入式设备(如1核处理器和1GB内存)上实现高效向量存储和检索的方法,旨在支持端侧大模型应用。文章分析了Annoy、HNSWLib、NMSLib、FLANN、VP-Trees和Lshbox等向量存储库的特点与适用场景,推荐Annoy作为多数情况下的首选方案,并提出了数据预处理、索引优化、查询优化等策略以提升性能。通过这些方法,即使在资源受限的环境中也能实现高效的向量检索。
下一篇
无影云桌面