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

















- <view>
-
- <SearchBar>SearchBar>
-
-
-
- <view class="index_swiper">
-
- <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
page=new Page<>(pageBean.getPageNum(),pageBean.getPageSize()); - Page
pageResult = feedBackService.page(page, new QueryWrapper().like("title", query)); - Map
map=new HashMap<>(); - map.put("feedBackList",pageResult.getRecords());
- map.put("total",pageResult.getTotal());
- return R.ok(map);
- }
-
- /**
- * 查询所有数据 下拉框用到
- * @return
- */
- @RequestMapping("/listAll")
- public R listAll(){
- Map
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
map=new HashMap<>(); - map.put("feedBack", feedBack);
- return R.ok(map);
- }
-
- /**
- * 上传商品大类图片
- * @param file
- * @return
- * @throws Exception
- */
- @RequestMapping("/uploadImage")
- public Map
uploadImage(MultipartFile file)throws Exception{ - Map
map=new HashMap(); - 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
map2=new HashMap(); - map2.put("title", newFileName);
- map2.put("src", "/image/banner/"+newFileName);
- map.put("data", map2);
- }
-
- return map;
- }
-
-
-
- }