基于微信小程序校园二手交易市场（springboot+ mybatis-plus+mysql+原生微信小程序）

一、系统介绍

近年来,随着微信在我国互联网中的广泛使用,基于微信的小程序应用也如雨后春笋,2020年全网小程序已超600万,其中,微信小程序数量超380万。本论文所研究的正是基于微信小程序的电子商城的设计与开发。当前国内,已经是电子商务高速蓬勃发展的时代,人们通过移动互联网消费已是大势所趋。而微信,作为当前社交网络APP中的佼佼者,它不仅仅是一个单纯的手机应用程序,而是一套完整的社交网络生态系统。2017年,微信小程序正式上线,它是一种不用下载就能使用的应用,基于微信平台开发出来的小程序具有用户体验好、流量获取易、开发成本低、微信生态强的优势。它是一项真正的创新,经过几年的发展,已经构造了全新的微信小程序开发环境和开发者生态。本文所研究的"微信小程序电子商城",是根据实际用户的需求,基于微信小程序的开发模式,运用分层式的软件架构,完成了系统的功能设计、数据库设计,并在设计中充分考虑了系统的安全性。通过实际开发并运行,证明该系统稳定、易于操作,且能够满足实际商业活动的需要。 
 

二、系统功能

   1.微信小程序端:首页、分类、发布商品、购物车、我的、在线下单、订单列表、关于我们等。
   2.后台管理端：banner管理、商品类别管理、用户管理、商品管理、订单管理、意见反馈、系统配置等。

三、功能截图：

1.微信小程序端： 

 2.后台管理端：

 

 

 

 

  四、代码实现： 

<view>
  <!-- 搜索框 start -->
  <SearchBar></SearchBar>
  <!-- 搜索框 end -->

  <!-- 轮播图 开始 -->
  <view class="index_swiper">
    <!-- 
      1 swiper标签存在默认的宽度和高度
        100% * 150px 
      2 image标签也存在默认的宽度和高度
        320px * 240px 
      3 设计图片和轮播图
        1 先看一下原图的宽高  600 * 300
        2 让图片的高度自适应 宽度 等于100%
        3 让swiper标签的高度 变成和图片的高一样即可 
      4 图片标签
        mode属性 渲染模式
          widthFix  让图片的标签宽高 和 图片标签的内容的宽高都等比例的发生变化 
     -->
    <swiper autoplay indicator-dots circular>
      <swiper-item
      wx:for="{{swiperList}}"
      wx:for-item="swiper"
      wx:key="id"
      >
        <navigator url="/pages/product_detail/index?id={{swiper.id}}">
          <image mode="widthFix" src="{{baseUrl+'image/banner/'+swiper.images}}"></image>
        </navigator>
      </swiper-item>
    </swiper>
  </view>
  <!-- 轮播图 结束 -->
  
  <!-- 商品大类分类 开始 -->
  <view class="index_bigType">
        <view class="bigTypeRow">
          <navigator
          bindtap="handleTypeJump"
          data-index="{{index}}"
          wx:for="{{bigTypeList_row1}}"
          wx:for-item="bigType"
          wx:for-index="index"
          wx:key="id">
            <image mode="widthFix" src="{{baseUrl+'image/bigType/'+bigType.image}}"></image>
            <view style="text-align: center;font-family: 微软雅黑;padding-bottom: 6rpx;">{{bigType.name}}</view>
          </navigator>
        </view>
        <view class="bigTypeRow">
          <navigator
          bindtap="handleTypeJump"
          data-index="{{index+5}}"
          wx:for="{{bigTypeList_row2}}"
          wx:for-item="bigType"
          wx:for-index="index"
          wx:key="id">
            <image mode="widthFix" src="{{baseUrl+'image/bigType/'+bigType.image}}"></image>
            <view style="text-align: center;font-family: 微软雅黑;padding-bottom: 6rpx;">{{bigType.name}}</view>
          </navigator>
        </view>
     
  </view>
  <!-- 商品大类分类 结束 -->

  <!-- 商品热卖推荐 开始 -->
  <view class="index_hot_product">
    <view class="product_title">
     热卖推荐
    </view>
    <view class="list">
      <view class="product_detail" 
          wx:for="{{hotProductList}}"
          wx:for-item="hotProduct"
          wx:for-index="index"
          wx:key="id"
      >
        <navigator url="/pages/product_detail/index?id={{hotProduct.id}}">
          <image mode="widthFix" src="{{baseUrl+'image/product/'+hotProduct.proPic}}"></image>
          <view class="product_name">{{hotProduct.name}}</view>
          <view class="product_price"> ¥ {{hotProduct.price}}</view>
          <button size="mini" type="warn" class="product_botton" >立即购买</button>
        </navigator>
      </view>
    </view>
  </view>
  <!-- 商品热卖推荐 结束 -->
</view>

package com.campus.controller.admin;

import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.campus.entity.Banner;
import com.campus.entity.FeedBack;
import com.campus.entity.PageBean;
import com.campus.entity.R;
import com.campus.service.IBannerService;
import com.campus.service.IFeedBackService;
import com.campus.util.DateUtil;
import org.apache.commons.io.FileUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;

import java.io.File;
import java.util.HashMap;
import java.util.Map;

/**
 * 管理端-意见反馈Controller控制器
 * @create 2022-02-10 7:50
 */
@RestController
@RequestMapping("/admin/feedBack")
public class AdminFeedBackController {

    @Autowired
    private IFeedBackService feedBackService;


    @Value("${imagesFilePath}")
    private String imagesFilePath;

    /**
     * 分页查询
     * @param pageBean
     * @return
     */
    @RequestMapping("/list")
    public R list(@RequestBody PageBean pageBean){
        System.out.println(pageBean);
        String query=pageBean.getQuery().trim();
        Page<FeedBack> page=new Page<>(pageBean.getPageNum(),pageBean.getPageSize());
        Page<FeedBack> pageResult = feedBackService.page(page, new QueryWrapper<FeedBack>().like("title", query));
        Map<String,Object> map=new HashMap<>();
        map.put("feedBackList",pageResult.getRecords());
        map.put("total",pageResult.getTotal());
        return R.ok(map);
    }

    /**
     * 查询所有数据 下拉框用到
     * @return
     */
    @RequestMapping("/listAll")
    public R listAll(){
        Map<String,Object> map=new HashMap<>();
        map.put("feedBackList",feedBackService.list());
        return R.ok(map);
    }

    /**
     * 添加或者修改
     * @param  feedBack
     * @return
     */
    @PostMapping("/save")
    public R save(@RequestBody FeedBack feedBack){
        if( feedBack.getId()==null || feedBack.getId()==-1){
            feedBackService.save(feedBack);
        }else{
            feedBackService.saveOrUpdate( feedBack);
        }
        return R.ok();
    }

    /**
     * 删
     * @param id
     * @return
     */
    @GetMapping("/delete/{id}")
    public R delete(@PathVariable(value = "id") Integer id){
        // 加个判断 大类下面如果有小类，返回报错提示
        feedBackService.removeById(id);
        return R.ok();
    }


    /**
     * 根据id查询
     * @param id
     * @return
     */
    @GetMapping("/{id}")
    public R findById(@PathVariable(value = "id") Integer id){
        System.out.println("id="+id);
       FeedBack feedBack =  feedBackService.getById(id);
        Map<String,Object> map=new HashMap<>();
        map.put("feedBack", feedBack);
        return R.ok(map);
    }

    /**
     * 上传商品大类图片
     * @param file
     * @return
     * @throws Exception
     */
    @RequestMapping("/uploadImage")
    public Map<String,Object> uploadImage(MultipartFile file)throws Exception{
        Map<String,Object> map=new HashMap<String,Object>();
        if(!file.isEmpty()){
            // 获取文件名
            String fileName = file.getOriginalFilename();
            // 获取文件的后缀名
            String suffixName = fileName.substring(fileName.lastIndexOf("."));
            String newFileName=DateUtil.getCurrentDateStr()+suffixName;
            FileUtils.copyInputStreamToFile(file.getInputStream(), new File(imagesFilePath+"/banner/"+newFileName));
            map.put("code", 0);
            map.put("msg", "上传成功");
            Map<String,Object> map2=new HashMap<String,Object>();
            map2.put("title", newFileName);
            map2.put("src", "/image/banner/"+newFileName);
            map.put("data", map2);
        }

        return map;
    }



}