手办商城系统|Springboot+vue+ElementUI手办商城系统-阿里云开发者社区

收藏点赞不迷路关注作者有好处

文末获取源码

项目编号：BS-SC-040

一，项目简介

基于SpringBoot手办周边系统功能结构图如图3-1所示：

图1-1 功能结构图

本项目基于Spring Boot+Vue搭建的前后端分离手办周边商城系统主要有用户管理功能、商品管理功能、购物车管理功能、订单管理功能、角色管理功能等，一共分为七个大的核心模块：

前台管理系统：

（1）用户功能模块：用户可以进行登录注册与注销操作，并且可以对个人信息进行响应的修改。

（2）手办功能模块：用户可以搜索查看自己想要的手办，也可以点击手办进行查看手办的详细信息。

（3）购物车管理模块：用户可以把自己感兴趣的商品加入购物车，点击购物车查看购物车信息，可以的对购物车内的商品进行修改，用账号余额对购物车进行结算。

（4）订单功能模块：用户点击订单查看自己的所有订单信息，看到当前订单状态，对已完成的订单进行评价。

后台管理系统：

（5）用户管理模块：管理员可以对普通用户信息进行相应的增删改查操作。

（6）手办资讯管理：管理员可以对商品资讯进行相应的增删改查操作，向用户进行商品推荐。

（7）商品管理模块：管理员可以对商品的信息进行修改，增加新的商品，删除掉不用的商品。

（8）轮播图管理模块：管理员可以对轮播图的信息进行修改，增加新的轮播图，根据优惠在首页显示推荐商品轮播图，实时修改轮播图信息。

本系统采用B/S架构进行设计，主要针对PC端用户使用的，不需要专门的客户端，只需要浏览器就能使用，所以对于其他架构来说方便就是它的优势。它是跨平台的，是基于网页语言的、操作系统对其没有太大的影响。系统架构设计图如下图4-1所示：

图2-1 系统架构设计图

二，环境介绍

语言环境：Java: jdk1.8

数据库：Mysql: mysql5.7

应用服务器：Tomcat: tomcat8.5.31

开发工具：IDEA或eclipse

后台开发技术：Springboot+Mybatis

前台开发技术：Vue+nodejs+ElementUI

特色：支付宝沙箱支付、前后端分离开发

三，系统展示

3.1 前端功能实现

商城首页

商品信息

商品资讯

商品详情

购物车

下单

我的订单

个人中心

支付宝沙箱在线充值

个人后台管理

3.2 后端功能实现

管理员登陆

用户管理

商品分类管理

商品信息管理

订单评价管理

轮播图管理

商品资讯管理

订单管理

四，核心代码展示

package com.controller;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;
import com.entity.CartEntity;
import com.entity.view.CartView;
import com.service.CartService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
/**
 * 购物车表
 * 后端接口
 * @author 
 * @email 
 * @date 2021-03-13 12:49:52
 */
@RestController
@RequestMapping("/cart")
public class CartController {
    @Autowired
    private CartService cartService;
    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,CartEntity cart,
    HttpServletRequest request){
      if(!request.getSession().getAttribute("role").toString().equals("管理员")) {
        cart.setUserid((Long)request.getSession().getAttribute("userId"));
      }
        EntityWrapper<CartEntity> ew = new EntityWrapper<CartEntity>();
    PageUtils page = cartService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, cart), params), params));
        return R.ok().put("data", page);
    }
    /**
     * 前端列表
     */
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,CartEntity cart, HttpServletRequest request){
        EntityWrapper<CartEntity> ew = new EntityWrapper<CartEntity>();
    PageUtils page = cartService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, cart), params), params));
        return R.ok().put("data", page);
    }
  /**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( CartEntity cart){
        EntityWrapper<CartEntity> ew = new EntityWrapper<CartEntity>();
        ew.allEq(MPUtil.allEQMapPre( cart, "cart")); 
        return R.ok().put("data", cartService.selectListView(ew));
    }
   /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(CartEntity cart){
        EntityWrapper< CartEntity> ew = new EntityWrapper< CartEntity>();
    ew.allEq(MPUtil.allEQMapPre( cart, "cart")); 
    CartView cartView =  cartService.selectView(ew);
    return R.ok("查询购物车表成功").put("data", cartView);
    }
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        CartEntity cart = cartService.selectById(id);
        return R.ok().put("data", cart);
    }
    /**
     * 前端详情
     */
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        CartEntity cart = cartService.selectById(id);
        return R.ok().put("data", cart);
    }
    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody CartEntity cart, HttpServletRequest request){
      cart.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
      //ValidatorUtils.validateEntity(cart);
      cart.setUserid((Long)request.getSession().getAttribute("userId"));
        cartService.insert(cart);
        return R.ok();
    }
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody CartEntity cart, HttpServletRequest request){
      cart.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
      //ValidatorUtils.validateEntity(cart);
        cartService.insert(cart);
        return R.ok();
    }
    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody CartEntity cart, HttpServletRequest request){
        //ValidatorUtils.validateEntity(cart);
        cartService.updateById(cart);//全部更新
        return R.ok();
    }
    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        cartService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    /**
     * 提醒接口
     */
  @RequestMapping("/remind/{columnName}/{type}")
  public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
             @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
    map.put("column", columnName);
    map.put("type", type);
    if(type.equals("2")) {
      SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
      Calendar c = Calendar.getInstance();
      Date remindStartDate = null;
      Date remindEndDate = null;
      if(map.get("remindstart")!=null) {
        Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
        c.setTime(new Date()); 
        c.add(Calendar.DAY_OF_MONTH,remindStart);
        remindStartDate = c.getTime();
        map.put("remindstart", sdf.format(remindStartDate));
      }
      if(map.get("remindend")!=null) {
        Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
        c.setTime(new Date());
        c.add(Calendar.DAY_OF_MONTH,remindEnd);
        remindEndDate = c.getTime();
        map.put("remindend", sdf.format(remindEndDate));
      }
    }
    Wrapper<CartEntity> wrapper = new EntityWrapper<CartEntity>();
    if(map.get("remindstart")!=null) {
      wrapper.ge(columnName, map.get("remindstart"));
    }
    if(map.get("remindend")!=null) {
      wrapper.le(columnName, map.get("remindend"));
    }
    if(!request.getSession().getAttribute("role").toString().equals("管理员")) {
        wrapper.eq("userid", (Long)request.getSession().getAttribute("userId"));
      }
    int count = cartService.selectCount(wrapper);
    return R.ok().put("count", count);
  }
}

package com.controller;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Calendar;
import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.apache.commons.lang3.StringUtils;
import org.json.JSONObject;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.ResourceUtils;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.annotation.IgnoreAuth;
import com.baidu.aip.face.AipFace;
import com.baidu.aip.face.MatchRequest;
import com.baidu.aip.util.Base64Util;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.entity.ConfigEntity;
import com.service.CommonService;
import com.service.ConfigService;
import com.utils.BaiduUtil;
import com.utils.FileUtil;
import com.utils.R;
/**
 * 通用接口
 */
@RestController
public class CommonController{
  @Autowired
  private CommonService commonService;
  @Autowired
  private ConfigService configService;
  private static AipFace client = null;
  private static String BAIDU_DITU_AK = null;
  @RequestMapping("/location")
  public R location(String lng,String lat) {
    if(BAIDU_DITU_AK==null) {
      BAIDU_DITU_AK = configService.selectOne(new EntityWrapper<ConfigEntity>().eq("name", "baidu_ditu_ak")).getValue();
      if(BAIDU_DITU_AK==null) {
        return R.error("请在配置管理中正确配置baidu_ditu_ak");
      }
    }
    Map<String, String> map = BaiduUtil.getCityByLonLat(BAIDU_DITU_AK, lng, lat);
    return R.ok().put("data", map);
  }
  /**
   * 人脸比对
   * 
   * @param face1 人脸1
   * @param face2 人脸2
   * @return
   */
  @RequestMapping("/matchFace")
  public R matchFace(String face1, String face2) {
    if(client==null) {
      /*String AppID = configService.selectOne(new EntityWrapper<ConfigEntity>().eq("name", "AppID")).getValue();*/
      String APIKey = configService.selectOne(new EntityWrapper<ConfigEntity>().eq("name", "APIKey")).getValue();
      String SecretKey = configService.selectOne(new EntityWrapper<ConfigEntity>().eq("name", "SecretKey")).getValue();
      String token = BaiduUtil.getAuth(APIKey, SecretKey);
      if(token==null) {
        return R.error("请在配置管理中正确配置APIKey和SecretKey");
      }
      client = new AipFace(null, APIKey, SecretKey);
      client.setConnectionTimeoutInMillis(2000);
      client.setSocketTimeoutInMillis(60000);
    }
    JSONObject res = null;
    try {
      File file1 = new File(ResourceUtils.getFile("classpath:static/upload").getAbsolutePath()+"/"+face1);
      File file2 = new File(ResourceUtils.getFile("classpath:static/upload").getAbsolutePath()+"/"+face2);
      String img1 = Base64Util.encode(FileUtil.FileToByte(file1));
      String img2 = Base64Util.encode(FileUtil.FileToByte(file2));
      MatchRequest req1 = new MatchRequest(img1, "BASE64");
      MatchRequest req2 = new MatchRequest(img2, "BASE64");
      ArrayList<MatchRequest> requests = new ArrayList<MatchRequest>();
      requests.add(req1);
      requests.add(req2);
      res = client.match(requests);
      System.out.println(res.get("result"));
    } catch (FileNotFoundException e) {
      e.printStackTrace();
      return R.error("文件不存在");
    } catch (IOException e) {
      e.printStackTrace();
    } 
    return R.ok().put("data", com.alibaba.fastjson.JSONObject.parse(res.get("result").toString()));
  }
  /**
   * 获取table表中的column列表(联动接口)
   * @param table
   * @param column
   * @return
   */
  @IgnoreAuth
  @RequestMapping("/option/{tableName}/{columnName}")
  public R getOption(@PathVariable("tableName") String tableName, @PathVariable("columnName") String columnName,String level,String parent) {
    Map<String, Object> params = new HashMap<String, Object>();
    params.put("table", tableName);
    params.put("column", columnName);
    if(StringUtils.isNotBlank(level)) {
      params.put("level", level);
    }
    if(StringUtils.isNotBlank(parent)) {
      params.put("parent", parent);
    }
    List<String> data = commonService.getOption(params);
    return R.ok().put("data", data);
  }
  /**
   * 根据table中的column获取单条记录
   * @param table
   * @param column
   * @return
   */
  @IgnoreAuth
  @RequestMapping("/follow/{tableName}/{columnName}")
  public R getFollowByOption(@PathVariable("tableName") String tableName, @PathVariable("columnName") String columnName, @RequestParam String columnValue) {
    Map<String, Object> params = new HashMap<String, Object>();
    params.put("table", tableName);
    params.put("column", columnName);
    params.put("columnValue", columnValue);
    Map<String, Object> result = commonService.getFollowByOption(params);
    return R.ok().put("data", result);
  }
  /**
   * 修改table表的sfsh状态
   * @param table
   * @param map
   * @return
   */
  @RequestMapping("/sh/{tableName}")
  public R sh(@PathVariable("tableName") String tableName, @RequestBody Map<String, Object> map) {
    map.put("table", tableName);
    commonService.sh(map);
    return R.ok();
  }
  /**
   * 获取需要提醒的记录数
   * @param tableName
   * @param columnName
   * @param type 1:数字 2:日期
   * @param map
   * @return
   */
  @IgnoreAuth
  @RequestMapping("/remind/{tableName}/{columnName}/{type}")
  public R remindCount(@PathVariable("tableName") String tableName, @PathVariable("columnName") String columnName, 
             @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
    map.put("table", tableName);
    map.put("column", columnName);
    map.put("type", type);
    if(type.equals("2")) {
      SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
      Calendar c = Calendar.getInstance();
      Date remindStartDate = null;
      Date remindEndDate = null;
      if(map.get("remindstart")!=null) {
        Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
        c.setTime(new Date()); 
        c.add(Calendar.DAY_OF_MONTH,remindStart);
        remindStartDate = c.getTime();
        map.put("remindstart", sdf.format(remindStartDate));
      }
      if(map.get("remindend")!=null) {
        Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
        c.setTime(new Date());
        c.add(Calendar.DAY_OF_MONTH,remindEnd);
        remindEndDate = c.getTime();
        map.put("remindend", sdf.format(remindEndDate));
      }
    }
    int count = commonService.remindCount(map);
    return R.ok().put("count", count);
  }
  /**
   * 单列求和
   */
  @IgnoreAuth
  @RequestMapping("/cal/{tableName}/{columnName}")
  public R cal(@PathVariable("tableName") String tableName, @PathVariable("columnName") String columnName) {
    Map<String, Object> params = new HashMap<String, Object>();
    params.put("table", tableName);
    params.put("column", columnName);
    Map<String, Object> result = commonService.selectCal(params);
    return R.ok().put("data", result);
  }
  /**
   * 分组统计
   */
  @IgnoreAuth
  @RequestMapping("/group/{tableName}/{columnName}")
  public R group(@PathVariable("tableName") String tableName, @PathVariable("columnName") String columnName) {
    Map<String, Object> params = new HashMap<String, Object>();
    params.put("table", tableName);
    params.put("column", columnName);
    List<Map<String, Object>> result = commonService.selectGroup(params);
    return R.ok().put("data", result);
  }
  /**
   * （按值统计）
   */
  @IgnoreAuth
  @RequestMapping("/value/{tableName}/{xColumnName}/{yColumnName}")
  public R value(@PathVariable("tableName") String tableName, @PathVariable("yColumnName") String yColumnName, @PathVariable("xColumnName") String xColumnName) {
    Map<String, Object> params = new HashMap<String, Object>();
    params.put("table", tableName);
    params.put("xColumn", xColumnName);
    params.put("yColumn", yColumnName);
    List<Map<String, Object>> result = commonService.selectValue(params);
    SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
    for(Map<String, Object> m : result) {
      for(String k : m.keySet()) {
        if(m.get(k) instanceof Date) {
          m.put(k, sdf.format((Date)m.get(k)));
        }
      }
    }
    return R.ok().put("data", result);
  }
}

五，项目总结

本系统的主要使用对象为手办系统管理员以及消费者，由于消费者主要为年轻人群体，所以对时间的要求不高，没有限制使用的时间。本系统在浏览器运行，需要保证隐私性要强。

时间性：新品手办上架时，可能登录系统的用户较多，需要保证用户操作时服务器反应时间在5秒以内。

运行环境约束：系统可以在IE8以上浏览器平稳运行，可以在不同浏览器运行，对运行的环境要求较低。

易用性需求：本系统页面简介明了易操作，对于众多用户来说可用性较强，不需要进行培训等流程都可以操作。

手办商城系统|Springboot+vue+ElementUI手办商城系统

项目编号：BS-SC-040

一，项目简介

二，环境介绍

三，系统展示

3.1 前端功能实现

3.2 后端功能实现

四，核心代码展示

五，项目总结

热门文章

最新文章

相关课程

相关电子书

相关实验场景