旧物回收|基于Springboot+Vue实现旧物回收商城系统的开发与设计

简介: 旧物回收|基于Springboot+Vue实现旧物回收商城系统的开发与设计

项目编号:BS-SC-050

前言:

时代在变迁,社会在发展,人类在推动其进步的同时,创造出了各种各样的新事物来便利我们的生活。可是,很多人享受物质带来的乐趣,却不愿对废旧的物品做垃圾分类和回收,仅随意处置,造成资源浪费成为普遍现象。据调查,城市生活垃圾分类与再生资源回收现已成为制约我国环保事业发展的瓶颈和造成生态污染、资源循环利用困难的根源之一[1]。长期以来,我国都在面临着再生资源浪费严重,而可用资源却逐渐枯竭的严峻问题。

再生资源是人类特殊的新资源[2]。其实,很多废旧物品是可以回收再利用的,它们虽然丢失或部分丢失利用价值,但经过搜集和再加工,注入新的物化劳动和活劳动,就重新具备了商品的价值和使用价值。我国的再生资源回收技术正在逐步提高,这种让物资不断循环利用的经济发展模式,能够很大程度提高资源的利用率,也能节约很多资源。

我们过去对地球的造成伤害不可否认,也已经尝到了反噬的滋味。世界人口越来越多,对资源的需求也越来越大,有效控制资源浪费,最大化地提高资源回收利用率刻不容缓,这是人类历史上的大事。作为地球上的一名成员,我们有责任也有义务。

一,项目简介

1.1 基本功能介绍

   系统根据使用对象将用户分为三个角色:访客、普通用户和系统管理员,访客和普通用户使用前台子系统,系统管理员使用后台子系统。前台子系统包括个人信息模块、商品浏览模块、购物车管理模块和订单管理模块;后台子系统包括个人信息模块、用户管理模块、商品管理模块、订单管理模块和权限管理模块。系统的功能模块图如图1-1所示:

图1-1 旧物回收商城系统功能模块图

前台子系统:

(1)个人信息

个人信息模块包括登录、注册和信息管理功能。用户可以通过登录,来使用系统的核心功能,比如加入购物车、立即购买、结算和支付,如果是新用户,可以填入基本信息后注册一个账号,再来使用;登录系统的用户,还能随时修改自己的个人信息,例如头像、昵称和邮箱等,此外还能管理自己的收货地址。

(2)商品浏览

商品浏览模块包括商品搜索、商品分类和查看详情的功能,在查看商品详情时,已登录的用户具有立即购买和加入购物车的权限。在这个模块,用户可以根据商品类别查找自己想要的商品,还能通过关键字更精确地找到对应的商品,点击某一个商品,能够查看它的详细信息,如名称、介绍、单价、销量和库存等等。

(3)购物车管理

购物车管理模块主要针对已登录的用户管理自己的购物车,用户可以修改商品数量、删除商品和结算,结算之后能看到订单的详细信息,用户需要选择收件人信息,包括姓名、电话和地址,同时也可以添加备注,然后提交订单,进行支付,就完成了一次购买。

(4)订单管理

订单管理模块有支付、取消订单、确认收货和查找订单的功能,此模块对已登录用户开放。用户可以根据订单的状态查看待付款订单、待发货订单和待收货订单,也可以查看所有订单,未支付的订单能够支付也能够取消,待收货的订单可以确认收货。

后台子系统:

(1)个人信息

个人信息模块包括登录和信息修改功能。登录是进入系统的唯一入口,任何管理员使用系统前都必须登录,登录之后才能够获得数据,正常使用后台系统。之后,管理员可以修改自己的个人信息,如上传头像、修改昵称等。

(2)用户管理

用户管理模块包括查询用户和修改用户信息功能。在用户较多的情况下,输入关键字查询能快速找到对应的用户;当需要对某个用户的公开信息进行修改(存在不合规行为)时,可以进行修改或禁用(无法登录),还可以修改用户角色。

(3)商品管理

商品管理模块包括商品类别管理和商品信息管理,商品类别管理有对商品种类的添加、修改和查询的功能,商品信息管理有对商品的添加、修改、删除和查询功能,这些信息处理后都能实时地显示在前端页面。

(4)订单管理

订单管理模块包括对订单的查询、修改和确认发货功能。系统管理员能通过订单编号查询到对应的订单信息,也能根据用户的需求帮助其修改收件人信息和备注,还能确认商品已经发货。

1.2 整体架构设计

本项目使用的是基于Springn Boot+Vue的前后端分离架构,用户通过PC端来访问系统,即前端页面,浏览器页面根据用户操作向后台获取数据,中间经过交互层,由Axios通过接口向后台发送请求,后台根据请求做出相应的响应,即访问数据库获取数据,将结果原路返回给前端,前端再进行填充和渲染,就是用户看到的效果。

图1-2 旧物回收商城系统架构图

 

1.3  数据库概念结构设计

本项目数据库共有7个实体:用户、收货地址、购物车、商品类别、商品、订单、订单详情,各个实体的E-R图及系统总体E-R图如下所示:

图1-3用户信息E-R图

图4-14 收货地址E-R图

图1-4 购物车E-R图

图1-5 商品类别E-R图

图1-6 商品信息E-R图

图1-7订单信息E-R图

图1-8 订单详情E-R图

图1-9 系统总体E-R图

1.4  数据库物理结构设计

根据E-R图,可以将数据库中的概念模型转换为具体的表结构,7个实体代表7张表,详细信息如下所示:

(1)用户表(t_user):该表用于存储普通用户的基本信息,用户在系统中进行各项操作都需要经过身份认证或者使用到身份信息。

表1-1 用户表(t_user)

列名

数据类型

长度

主键

非空

注释

id

int

ID

username

varchar

50

用户名

password

varchar

255

密码

nickname

varchar

50

昵称

avatar

varchar

255

头像

sex

varchar

10

性别

birthday

date

生日

email

varchar

50

邮箱

role

tinyint

角色

enable

tinyint

启用

(2)收货地址表(t_address):该表用于存储用户的收货地址,当用户购买商品提交订单时需要填写收件人信息。

表1-2 收货地址表(t_address)

列名

数据类型

长度

主键

非空

注释

id

int

ID

user_id

int

用户ID

name

varchar

50

姓名

phone

varchar

20

电话

address

varchar

255

地址

(3)购物车表(t_cart):该表用于存储用户想要购买的商品信息和数量,为方便收藏想买的商品和同时结算多个商品。

表1-3 购物车表(t_cart)

列名

数据类型

长度

主键

非空

注释

id

int

ID

user_id

int

用户ID

goods_id

int

商品ID

count

tinyint

数量

(4)商品类别表(t_category):该表用于存储商品的类别,让所有商品隶属于某一分类,更方便管理和用户查找。

表1-4 商品类别表(t_category)

列名

数据类型

长度

主键

非空

注释

id

int

ID

name

varchar

50

类名

parent_id

int

父级ID

grade

tinyint

级别

(5)商品表(t_goods):该表用于存储商品的基本信息,让用户对每件商品的信息一目了然。

表1-5 商品表(t_goods)

列名

数据类型

长度

主键

非空

注释

id

int

ID

goods_no

varchar

255

商品编号

name

varchar

100

名称

price

decimal

(10,2)

单价

unit

varchar

10

计量单位

image

varchar

255

图片

introduction

varchar

255

介绍

category_id

int

类别ID

sale

int

销量

store

int

库存

(6)订单表(t_order):该表用于存储订单的基本信息,用户每一次购物都会有一份订单信息,便于了解购物的详细情况以及有效处理可能涉及到的售后服务。

表1-6 订单表(t_order)

列名

数据类型

长度

主键

非空

注释

id

int

ID

order_no

varchar

255

订单编号

user_id

int

用户ID

total

decimal

(10,2)

总金额

create_time

timestamp

下单时间

pay_time

datetime

支付时间

trade_no

varchar

255

交易单号

order_status

tinyint

订单状态

name

varchar

50

收货人姓名

phone

varchar

20

收货人电话

address

varchar

255

收货人地址

comment

varchar

255

备注

(7)订单详情表(t_order_details):该表用于存储订单的详细信息,里面记录了购买每一件商品的信息和数量。

表1-7 订单详情表(t_order_details)

列名

数据类型

长度

主键

非空

注释

id

int

ID

order_id

int

主订单ID

goods_id

int

商品ID

count

tinyint

数量

二,环境介绍

语言环境:Java:  jdk1.8

数据库:Mysql: mysql5.7

应用服务器:Tomcat:  tomcat8.5.31

开发工具:IDEA或eclipse

前端开发技术:Vue+ElementUI+Nodejs

后台开发技术:Springboot+Mybatis-plus+Springmvc

三,系统展示

3.1  前台系统实现

3.1.1  登录注册

用户进入前台系统,首先看到的是首页,不论登录与否都能查看和搜索商品,界面实现如图5-1所示。

如果用户有购买商品的需求,必须先登录或注册一个账号再登录,如图5-2和图5-3所示,用户点击登录或注册按钮,会弹出一个对话框,根据输入项填入相关信息,点击登录或注册,就会提示成功或是失败,接着再进行下一步操作。

图5-1 前台首页界面

图5-2 前台登录界面

图5-3 前台注册界面

3.1.2  个人信息管理

用户在个人信息管理页面可以修改自己的个人信息,也可以管理自己的收货地址, 如图5-4所示。

在个人信息部分,用户直接在信息项上修改,然后点击保存,就可以修改好个人信息。然后在地址管理部分,用户可以点击新增地址按钮或是编辑按钮进行添加或修改,页面会弹出一个对话框,用户只要在输入项上进行编辑,再点击确定按钮即可。如果要删除,则点击删除按钮,页面会提示用户是否确定要删除,点击确定会立即删除,点击取消会取消。

图5-4 个人信息管理界面

个人中心部分核心代码如下:

//根据用户名获取用户信息@GetMapping("/info/{username}")

  public Result getInfo(@PathVariable String username){

    QueryWrapper<User> qw = new QueryWrapper<>();

    qw.eq("username",username);

    return Result.success(userService.getOne(qw));

}
//得到当前用户的所有收货地址@GetMapping("/all")

  public Result findAll(@RequestParam Integer userId) {

    QueryWrapper<Address> qw = new QueryWrapper<>();

    qw.eq("user_id",userId);

    List<Address> addressList = addressService.list(qw);

    if (addressList.size() == 0){

        return Result.success("暂无收货地址");

    }else {

        return Result.success(addressList);

    }

}

  //新增和修改地址@PostMapping("/save")

  public Result save(@RequestBody Address address) {

    if(addressService.saveOrUpdate(address)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

  //删除地址@DeleteMapping("/del/{id}")

  public Result delete(@PathVariable Integer id) {

    if(addressService.removeById(id)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

3.1.3  商品浏览

商品浏览功能不受拦截器限制,它包括商品按类别浏览、按搜索结果浏览和详情浏览,界面实现如图5-5、5-6和5-7所示。

在系统首页,商品默认按第一个类别展示,点击不同的类名展示不同的商品。另外,用户也可以在顶部搜索栏里输入精确的关键字,来查找需要的商品,浏览器跳转到另一个页面展示搜索结果。不论在哪个地方点击商品基本信息框里的图片,都可以查看其详细信息,或者点击加入购物车,登录的用户就可以立即加入购物车,未登录用户不可以。

在商品详情页面,登录的用户可以按需选择商品数量,然后点击立即购买或是加入购物车按钮,如果点击的是立即购买按钮,会跳转到确认订单页面,用户需要填入收件人信息,再选填备注,然后点击提交订单按钮,就会到支付页面,支付成功就完成了此次购买。如果点击的是加入购物车按钮,就会提示添加成功或失败,后续操作到购物车进行。

图5-5 商品分类展示界面

图5-6 商品搜索展示界面

图5-7 商品详情展示界面

商品浏览部分核心代码

//根据类别id查询商品@GetMapping("/find/{categoryId}")

  public Result findByCategory(@PathVariable String categoryId) {

    QueryWrapper<Goods> qw = new QueryWrapper<>();

    qw.eq("category_id",categoryId);

    List<Goods> goodsList = goodsService.list(qw);

    return Result.success(goodsList);

}

  //根据商品名称查询商品@GetMapping("/find/search")

  public Result findByName(@RequestParam(defaultValue = "") String name){

    QueryWrapper<Goods> queryWrapper = new QueryWrapper<>();

    if (!"".equals(name)){

        queryWrapper.like("name", name);

    }

    List<Goods> goodsList = goodsService.list(queryWrapper);

    return Result.success(goodsList);

}

  //根据商品id查看商品详情@GetMapping("/detail/{goodsId}")

  public Result goodsDetail(@PathVariable Integer goodsId) {

    Goods detail = goodsService.getById(goodsId);

    return Result.success(detail);

}

//加入购物车

@PostMapping("/save")

public Result addCart(@RequestBody Cart cart){
   QueryWrapper<Cart> qw = 
new QueryWrapper<>();
   qw.eq(
"user_id",cart.getUserId());
   qw.eq(
"goods_id",cart.getGoodsId());
   List<Cart> carts = 
cartService.list(qw);
   
if (carts.size()>0){
       
return Result.error(Constants.CODE_600,"该商品已在购物车");
   }
   
if(cartService.save(cart)){
       
return Result.success("添加成功",null);
   }
else {
       
return Result.error(Constants.CODE_600,"添加失败");
   }
}

3.1.4  购物车管理

购物车管理界面如图5-8所示,用户可以自行修改商品数量、删除和清空购物车,点击对应按钮即可。如需购买,就点击结算按钮,页面会跳转到确认订单页面,如图5-9所示,用户要填入收货地址,再选填备注信息,然后点击提交订单按钮,就会到支付页面,如图5-10所示,支付成功就表示购买成功了,详情可到订单页面查看,如图5-11所示。

图5-8 购物车管理界面

图5-9 确认订单界面

图5-10 沙箱支付界面

图5-11 订单界面

购物车管理部分核心代码:

//查看购物车@GetMapping("/all")

  public Result findAll(@RequestParam Integer userId){

    QueryWrapper<Cart> qw = new QueryWrapper<>();

    qw.eq("user_id",userId);

    List<Cart> carts = cartService.list(qw);

    if(carts.size() == 0){

        return Result.success("购物车是空的",null);

    }else {//数据处理,通过goodsIdcount得到(图片、名称、单价、单位、数量、金额)
        List<GoodsVo> cartList = new ArrayList<>();

        for (Cart cart : carts){

            if (cart.getUserId() != null && cart.getGoodsId() != null && cart.getCount() != null){

                QueryWrapper<Goods> queryWrapper = new QueryWrapper<>();

                queryWrapper.eq("id",cart.getGoodsId());

                Goods goods = goodsService.getById(cart.getGoodsId());

                GoodsVo goodsVo = new GoodsVo();

                goodsVo.setId(cart.getId());

                goodsVo.setGoodsId(cart.getGoodsId());

                goodsVo.setImage(goods.getImage());

                goodsVo.setName(goods.getName());

                goodsVo.setPrice(goods.getPrice());

                goodsVo.setUnit(goods.getUnit());

                goodsVo.setStore(goods.getStore());

                goodsVo.setCount(cart.getCount());

                goodsVo.setSum(goods.getPrice().multiply(new BigDecimal(cart.getCount())));

                cartList.add(goodsVo);

            }

        }

        return Result.success(cartList);

    }

}

  //修改购物车商品购买数量@PostMapping("/update")//传入用户id和商品id,以及修改后的数量public Result updateCount(@RequestBody Cart cart){

    UpdateWrapper<Cart> uw = new UpdateWrapper<>();

    uw.eq("id",cart.getId());

    uw.eq("user_id",cart.getUserId());

    uw.eq("goods_id",cart.getGoodsId());

    uw.set("count",cart.getCount());

    if(cartService.update(uw)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}
//提交订单,存入数据库,去支付@PostMapping("/generate")

  public Result generateOrder(@RequestBody Order order){

    String orderNo = DateUtil.format(new Date(),"yyyyMMdd") + System.currentTimeMillis();

    order.setOrderNo(orderNo);//给每个订单设置一个唯一编号
    orderService.save(order);//把数据存入主订单,
    //根据订单编号orderNo拿到该新增订单的id

    QueryWrapper<Order> qw = new QueryWrapper<>();

    qw.eq("order_no",orderNo);

    Integer orderId = orderService.getOne(qw).getId();

    //******立即购买******

    if ((order.getGoodsId() != null) && (order.getCount() != null) ){

        //根据orderIdgoodsIdcount把这个商品存入订单详情
        saveOrderDetails(orderId,order.getGoodsId(),order.getCount());

        //购买的商品库存减少,销量增加
        updateStoreAndSale(order.getGoodsId(),order.getCount());

    }

    //******在购物车结算******

    else {

        //把购物车里当前用户的数据存入订单详情,商品库存减少,销量增加
        QueryWrapper<Cart> cartQw = new QueryWrapper<>();

        cartQw.eq("user_id",order.getUserId());

        List<Cart> cartList = cartService.list(cartQw);

        for (Cart cart : cartList){

            saveOrderDetails(orderId,cart.getGoodsId(),cart.getCount());

            updateStoreAndSale(cart.getGoodsId(),cart.getCount());

        }

        //再把购物车里的数据删除
        cartService.remove(cartQw);

    }

    return Result.success(getAlipay(orderId,orderNo,order.getTotal()));

}
//支付
@GetMapping("/pay") public String pay(Alipay alipay) {

    AlipayTradePagePayResponse response;

    try {

        //发起API调用(以创建当面付收款二维码为例)
        response = Factory.Payment.Page()//URLEncoder.encode(alipay.getSubject(), "UTF-8")

                .pay(alipay.getSubject(), alipay.getOutTraceNo(), alipay.getTotalAmount(), "");

    } catch (Exception e) {

        System.err.println("调用遭遇异常,原因:" + e.getMessage());

        throw new RuntimeException(e.getMessage(), e);

    }

    return response.getBody();

}

3.1.5  订单管理

订单管理功能界面的实现如图5-12所示,根据订单状态将订单分为全部订单、待付款订单、待发货订单和待收货订单,方便用户查找,在我的订单模块默认打开的是全部订单,用户查看其它类型的订单直接点击局部导航栏菜单即可。

在全部订单页面,用户可以同时拥有其他三类订单分别具有的功能。待付款订单页面,用户可以选择付款,浏览器会打开一个新窗口,即沙箱支付窗口,在此窗口支付成功即可;也可以选择取消订单,订单记录依然会保留在个人账号上。待发货页面,用户只有查看的功能;待收货页面,如果用户已经收到商家邮寄过来的快递,就可以确认收货了。每个订单下面还隐藏了用户下单时填写的收件人信息和备注信息,只要点击左侧的展开按钮即可查看。

图5-12 订单管理界面

订单管理部分核心代码:

//根据当前用户userId查询所有订单@GetMapping("/all")

  public Result findAll(@RequestParam Integer userId) {

    QueryWrapper<Order> qw = new QueryWrapper<>();

    qw.eq("user_id",userId);

    List<Order> orders = orderService.list(qw);

    if (orders.size() == 0){

        return Result.success("暂时没有订单",null);

    }else {

        getDetails(orders);//使订单们获得订单详情
        return Result.success(orders);

    }

}

  //获取当前用户待付款订单、待发货和待收货订单@GetMapping("/receive")

  public Result receive(@RequestParam Integer userId,@RequestParam Integer status){

    QueryWrapper<Order> qw = new QueryWrapper<>();

    qw.eq("user_id",userId);

    qw.eq("status",status);

    List<Order> orders = orderService.list(qw);

    if (orders.size() == 0){

        return Result.success("暂时没有该类订单",null);

    }else {

        getDetails(orders);//使订单们获得订单详情
        return Result.success(orders);

    }

}

  //取消订单和确认收货@PostMapping("/receive")

  public Result cancelOrReceive(@RequestParam Integer orderId,@RequestParam Integer status){

    UpdateWrapper<Order> uw = new UpdateWrapper<>();

    uw.eq("id",orderId);

    uw.set("status",status);//2是确认发货待收货,3是确认收货已完成,4是取消订单
    if(orderService.update(uw)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

3.2  后台系统实现

3.2.1  登录

进入商城后台系统的唯一途径是登录,其具体实现如图5-13所示,用户需要在此页面输入用户名和密码,然后点击登录按钮,经过后台验证成功才可进入系统。登录成功默认进入系统主页,具体如图5-14所示,上方是对用户、商品、订单、交易金额的总计;下方左侧是一个用ECharts实现的各类商品销量柱状统计图,右侧是一个系统公告。

图5-13 后台登录界面

图5-14 后台主页界面

3.2.2  个人信息管理

个人信息管理主要是为管理员提供个人信息修改功能,其具体实现如图5-15所示,用户直接在原本信息的基础上进行修改,然后点击保存即可,新的信息会立马同步到页面上。

图5-15 个人信息管理界面

3.2.3  用户管理

用户管理是后台系统管理员管理前台用户的模块。管理员可以浏览和查找需要查看的用户信息,在搜索框里输入用户名或昵称,然后点击搜索按钮就可以。也可以根据系统监控到的信息,对其进行部分信息修改,比如该用户头像违规,可以在编辑里修改其头像,又或者他/她的行为存在违规,可以在信息栏里关闭其正常使用按钮,该用户就会在这段时间里,暂时无法登上前台系统购买商品了。还可以修改用户权限,当普通用户的角色被修改为系统管理员,此时用户管理模块就找不到该普通用户的信息了,它具有了和当前管理员同样的登录和管理后台的权限。具体如图5-16所示。

图5-16 用户管理界面

用户管理部分核心代码:

//分页查询@GetMapping("/page")

  public IPage<User> findPage(@RequestParam(defaultValue = "1") Integer pageNum,

                            @RequestParam(defaultValue = "10") Integer pageSize,

                            @RequestParam(defaultValue = "") String username,

                            @RequestParam(defaultValue = "") String nickname) {

    IPage<User> page = new Page<>(pageNum, pageSize);

    QueryWrapper<User> queryWrapper = new QueryWrapper<>();

    if (!"".equals(username)){//要先判断查询条件是否非空,不然sql语句拼接时,默认值为null的会是'%null%',而不是'%%'

        queryWrapper.like("username", username);

    }

    if (!"".equals(nickname)){//要先判断查询条件是否非空,不然sql语句拼接时,默认值为null的会是'%null%',而不是'%%'

        queryWrapper.like("nickname", nickname);

    }

    queryWrapper.eq("role",1);//只查找普通用户
    return userService.page(page, queryWrapper);

}

  //修改@PostMapping("/save")

  public Result save(@RequestBody User user) {

    if(userService.saveOrUpdate(user)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

3.2.4  商品类别管理

商品类别管理有助于更好的管理商品和查找商品,当商品类别比较多又想快速知道是否存在此种分类时,管理员就可以在搜索栏里直接输入类名进行查找,快速又方便。管理员也可以新增和修改类别信息,只要在弹出框里输入对应的信息,点击确定即可保存,具体如图5-17所示。

图5-17 商品类别管理界面

商品类别管理部分核心代码:

//分页查询@GetMapping("/page")

  public Result findPage(@RequestParam(defaultValue = "1") Integer pageNum,

                            @RequestParam(defaultValue = "10") Integer pageSize,

                            @RequestParam(defaultValue = "") String name) {

    IPage<Category> page = new Page<>(pageNum, pageSize);

    QueryWrapper<Category> queryWrapper = new QueryWrapper<>();

    if (!"".equals(name)){

        queryWrapper.like("name", name);

    }

    return Result.success(categoryService.page(page, queryWrapper));

}

  //添加和修改@PostMapping("/save")

  public Result save(@RequestBody Category category) {

    if(categoryService.saveOrUpdate(category)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

3.2.5  商品信息管理

商品信息管理页面如图5-18所示,管理员可以在搜索栏里输入商品的名称或类别然后点击搜索按钮快速查找某件商品;也可以新增和编辑一件商品,点击任意按钮,页面会弹出一个商品信息的表单,将新增或需要修改的的信息填入对应的输入框,再点击确定,即可保存并且在页面刷新展示;还可以删除和批量删除商品,在点击其按钮时,页面会先提示管理员是否确认删除,以防止意外情况发生,再次确认之后才可以将商品删除,否则可以取消。

图5-18 商品信息管理界面

商品信息管理部分核心代码:

//分页查询@GetMapping("/page")

  public Result findPage(@RequestParam(defaultValue = "1") Integer pageNum,

                             @RequestParam(defaultValue = "10") Integer pageSize,

                             @RequestParam(defaultValue = "") String name,

                             @RequestParam(defaultValue = "") String category) {

    Integer categoryId = null;

    QueryWrapper<Category> qw = new QueryWrapper<>();

    if (!"".equals(category)){

        qw.like("name",category);

        categoryId = categoryService.getOne(qw).getId();//获得类别id

    }

    IPage<Goods> page = new Page<>(pageNum, pageSize);

    QueryWrapper<Goods> queryWrapper = new QueryWrapper<>();

    if (!"".equals(name)){//要先判断查询条件是否非空,不然sql语句拼接时,默认值为null的会是'%null%',而不是'%%'

        queryWrapper.like("name", name);

    }

    if (categoryId != null){

        queryWrapper.eq("category_id",categoryId);

    }

    return Result.success(goodsService.page(page, queryWrapper));

}

  //新增和修改@PostMapping("/save")

  public Result save(@RequestBody Goods goods) {

    if(goodsService.saveOrUpdate(goods)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

  //删除@DeleteMapping("/del/{id}")

  public Result delete(@PathVariable Integer id) {

    if(goodsService.removeById(id)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

  //批量删除@PostMapping("/del/batch")

  public Result batchDel(@RequestBody List<Integer> ids){

    if(goodsService.removeByIds(ids)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

3.2.6  订单管理

订单管理页面如图5-19所示,管理员可以查看所有的订单,在搜索框里搜索某一个订单,也可以编辑未发货的订单,顺应客户要求,对填错信息的订单进行部分内容修改,包括收件人姓名、电话、地址和备注,只要在弹出的对话框里修改相应内容然后点击确定即可。对待发货的商品点击发货,管理员需要再次确认已经发货才能真正修改数据。

图5-19 订单管理界面

订单管理部分核心代码:

@GetMapping("/page")//分页查询public Result findPage(@RequestParam(defaultValue = "1") Integer pageNum,@RequestParam(defaultValue = "10") Integer pageSize,@RequestParam(defaultValue = "") String orderNo) {

    IPage<Order> page = new Page<>(pageNum, pageSize);

    QueryWrapper<Order> queryWrapper = new QueryWrapper<>();

    if (!"".equals(orderNo)){

        queryWrapper.like("order_no", orderNo);

    }

    return Result.success(orderService.page(page,queryWrapper));

}@PostMapping("/save")//修改public Result save(@RequestBody Order order) {

    if(orderService.saveOrUpdate(order)){

        return Result.success();

    }else {

        return Result.error(Constants.CODE_600);

    }

}

四,项目测试用例展示

以下是系统主要功能的部分测试用例,如表6-1、表6-2、表6-3、表6-4所示。

表6-1 注册功能测试用例

操作步骤

操作描述

数据

预期结果

实际结果

1

不输入数据,点击注册按钮

所有数据皆为空

必填项下方提示输入对应信息

符合

2

输入必填项,点击提交按钮

用户名:aily,密码:123,确认密码:123,昵称:艾丽

提示注册成功

符合

3

输入必填项,点击提交按钮

用户名:zhangsan,密码:123,确认密码:123,昵称:张

提示用户名已存在

符合

4

输入必填项,点击提交按钮

用户名:zhang,密码:12345,确认密码:12346,昵称:张

提示两次输入的密码不一致

符合

5

输入所有项,点击提交按钮

用户名:zhang,密码:123456,确认密码:123456,昵称:小张,头像:略,性别:男,生日:2022/10/24,邮箱:zhang@163.com

提示注册成功

符合

表6-2 登录功能测试用例

操作步骤

操作描述

数据

预期结果

实际结果

1

不输入数据,点击登录按钮

用户名:空,密码:空

提示请输入用户名和请输入密码

符合

2

输入用户名,不输入密码,点击登录按钮

用户名:zhang,密码:空

提示请输入密码

符合

3

不输入用户名,输入密码,点击登录按钮

用户名:空,密码:123

提示请输入用户名

符合

4

输入用户名和输入密码,点击登录按钮

用户名:zhang,密码:123

提示用户不存在

符合

5

输入用户名和输入密码,点击登录按钮

用户名:zhangsan,密码:1234

提示密码错误

符合

6

输入用户名和输入密码,点击登录按钮

用户名:zhangsan,密码:123

提示登录成功

符合

表6-3 商品搜索功能测试用例

操作步骤

操作描述

数据

预期结果

实际结果

1

不输入数据,点击搜索按钮

商品关键词为空

展示是所有商品基本信息

符合

2

输入数据,点击搜索按钮

商品关键词为1

提示未找到相关商品

符合

3

输入数据,点击搜索按钮

商品关键词为二手

展示相关商品基本信息

符合

4

点击任意商品类名

无输入数据

展示相关商品基本信息

符合

表6-4 确认订单功能测试用例

操作步骤

操作描述

数据

预期结果

实际结果

1

不填写收件人信息和备注,点击提交订单按钮

收件人信息为空,备注信息为空

提示请选择收件人信息

符合

2

填写收件人信息,不填写备注,点击提交订单按钮

收件人信息:张三 13364587954 希望小学,备注信息为空

提交订单成功,跳转到支付页面

符合

3

填写收件人信息和备注,点击提交订单按钮

收件人信息:张三 13364587954 希望小学,备注信息:包裹易破损

提交订单成功,跳转到支付页面

符合

五,项目总结

   本项目致力于研究如何解决废旧物品的回收再利用问题,基于SpringBoot技术,设计并实现旧物回收商城系统。让广大群众拥有一个便捷好用的在线废旧物品交易平台,使得旧物不再是废物,有效缓解资源浪费问题。

项目根据使用角色将系统分为前台子系统和后台子系统,前台子系统给普通用户和访客使用,后台子系统给系统管理员使用。前台子系统包括个人信息、商品浏览、购物车管理和订单管理四个模块,后台子系统包包括个人信息管理、用户管理、商品管理和订单管理四个模块。

相关文章
|
2天前
|
存储 JavaScript 前端开发
基于 SpringBoot 和 Vue 开发校园点餐订餐外卖跑腿Java源码
一个非常实用的校园外卖系统,基于 SpringBoot 和 Vue 的开发。这一系统源于黑马的外卖案例项目 经过站长的进一步改进和优化,提供了更丰富的功能和更高的可用性。 这个项目的架构设计非常有趣。虽然它采用了SpringBoot和Vue的组合,但并不是一个完全分离的项目。 前端视图通过JS的方式引入了Vue和Element UI,既能利用Vue的快速开发优势,
32 13
|
10天前
|
JavaScript 安全 Java
java版药品不良反应智能监测系统源码,采用SpringBoot、Vue、MySQL技术开发
基于B/S架构,采用Java、SpringBoot、Vue、MySQL等技术自主研发的ADR智能监测系统,适用于三甲医院,支持二次开发。该系统能自动监测全院患者药物不良反应,通过移动端和PC端实时反馈,提升用药安全。系统涵盖规则管理、监测报告、系统管理三大模块,确保精准、高效地处理ADR事件。
|
1月前
|
JavaScript
Vue基础知识总结 4:vue组件化开发
Vue基础知识总结 4:vue组件化开发
|
1月前
|
XML Java 数据库连接
SpringBoot集成Flowable:打造强大的工作流管理系统
在企业级应用开发中,工作流管理是一个核心组件,它能够帮助我们定义、执行和管理业务流程。Flowable是一个开源的工作流和业务流程管理(BPM)平台,它提供了强大的工作流引擎和建模工具。结合SpringBoot,我们可以快速构建一个高效、灵活的工作流管理系统。本文将探讨如何将Flowable集成到SpringBoot应用中,并展示其强大的功能。
138 1
|
1月前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,帮助开发者提高开发效率和应用的可维护性。
69 2
|
1月前
|
JavaScript NoSQL Java
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
39 0
|
2月前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,包括版本兼容性、安全性、性能调优等方面。
172 1
|
3月前
|
前端开发 JavaScript Java
基于Java+Springboot+Vue开发的服装商城管理系统
基于Java+Springboot+Vue开发的服装商城管理系统(前后端分离),这是一项为大学生课程设计作业而开发的项目。该系统旨在帮助大学生学习并掌握Java编程技能,同时锻炼他们的项目设计与开发能力。通过学习基于Java的服装商城管理系统项目,大学生可以在实践中学习和提升自己的能力,为以后的职业发展打下坚实基础。
176 2
基于Java+Springboot+Vue开发的服装商城管理系统
|
1月前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,创建并配置 Spring Boot 项目,实现后端 API;然后,使用 Ant Design Pro Vue 创建前端项目,配置动态路由和菜单。通过具体案例,展示了如何快速搭建高效、易维护的项目框架。
111 62
|
1月前
|
JavaScript Java 项目管理
Java毕设学习 基于SpringBoot + Vue 的医院管理系统 持续给大家寻找Java毕设学习项目(附源码)
基于SpringBoot + Vue的医院管理系统,涵盖医院、患者、挂号、药物、检查、病床、排班管理和数据分析等功能。开发工具为IDEA和HBuilder X,环境需配置jdk8、Node.js14、MySQL8。文末提供源码下载链接。