基于微信小程序的在线商城点单系统
前言:闲来无事,制作一个微信小程序商城。系统采用Java语言作为后端实现与小程序的交互,给用来学习或者想自己开个小店的朋友当个参考。
目录
前言项目功能及技术效果图小程序管理端
APISpringBoot框架搭建实体映射创建Mapper接口封装整合Swagger常用字段类型
参考代码块
前言
项目功能及技术
小程序主要有首页、商品详情、商品分类、商品评价、购物车、个人中心等模块。
管理端主要有人员管理、权限管理、商品管理、订单管理等模块。
html+css+js:微信小程序界面。
SpringBoot框架+Java程序语言:小程序及后台管理系统API的实现。
Layui前端框架:web后台管理界面样式及数据渲染框架。
MySQL数据库:数据支持。
效果图
小程序
管理端
API
SpringBoot框架搭建
1.创建maven project,先创建一个名为SpringBootDemo的项目,选择【New Project】
然后在弹出的下图窗口中,选择左侧菜单的【New Project】
在project下创建module,点击右键选择【new】—【Module…】
左侧选择【Spring initializr】,通过idea中集成的Spring initializr工具进行spring boot项目的快速创建。窗口右侧:name可根据自己喜好设置,group和artifact和上面一样的规则,其他选项保持默认值即可,【next】
Developer Tools模块勾选【Spring Boot DevTools】,web模块勾选【Spring Web】,此时,一个Springboot项目已经搭建完成,可开发后续功能
实体映射创建Mapper
创建一个entity实体类文件夹,并在该文件夹下创建项目用到的实体类
package com.example.demo.entity;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import lombok.Data;
import java.time.LocalDateTime;
import java.util.ArrayList;
import java.util.List;
@Data
public class User {
@TableId(type = IdType.AUTO)
private Long id;
private String account;
private String pwd;
private String userDesc;
private String userHead;
private LocalDateTime createTime;
private Long role;
private String nickname;
private String email;
private String tags;
}
接口封装
由于我们使用mybatis-plus,所以简单的增删改查不用自己写,框架自带了,只需要实现或者继承他的Mapper、Service
创建控制器Controller
整合Swagger
添加依赖
先导入spring boot的web包
配置Swagger
创建一个swagger的配置类,命名为SwaggerConfig.java
/*
*用于定义API主界面的信息,比如可以声明所有的API的总标题、描述、版本
*/
private ApiInfo apiDemo() {
return new ApiInfoBuilder()
//用来自定义API的标题
.title("SpringBoot项目SwaggerAPIAPI标题测试")
//用来描述整体的API
.description("SpringBoot项目SwaggerAPI描述测试")
//创建人信息
.contact(new Contact("测试员张三","http://localhost:8080/springboot/swagger-ui.html","xxxxxxxx@163.com"))
//用于定义服务的域名
//.termsOfServiceUrl("")
.version("1.0") //可以用来定义版本
.build();
}
接口测试
运行Spring Boot项目,默认端口8080,通过地址栏访问url
接口组定义
根据不同的业务区分不同的接口组,使用@API来划分
@Api(tags = "用户管理") // tags:组名称
@RestController
public class RoleController {
}
接口定义
使用@ApiModel来标注实体类,同时在接口中定义入参为实体类作为参数。
@ApiModel:用来标类 常用配置项:value:实体类简称;description:实体类说明 @ApiModelProperty:用来描述类的字段的含义。
常用字段类型
字段类型所占字节存储范围最大存储值使用场景TINYINT1-128~127127存储小整数INT4-2147483648~21474836472147483647存储大整数BIGINT8-9223372036854775808~92233720368547758079223372036854775807存储极大整数DECIMAL可变长度存储精度要求高的数值CHAR固定长度最多255字节255个字符存储长度固定的字符串VARCHAR可变长度最多65535字节65535个字符存储长度不固定的字符串DATETIME8‘1000-01-01 00:00:00’~‘9999-12-31 23:59:59’‘9999-12-31 23:59:59’存储日期和时间
参考代码块
bindtap="clickMenu" data-index="{{index}}">{{item.title}}
interval="{{interval}}" duration="{{duration}}" circular="{{circular}}">
style="background: url({{imgUrl}}/upload/20220608/kill-pro-back.png);background-size: 100% 100%;">
class="just-rightText">每人限购1份
超级无敌好吃美味烤鸭
色泽红艳,肉质细嫩,味道醇厚,肥而不腻
评价(2824)
味道好,配送快,值得信赖!
src="{{imgUrl}}/upload/20220608/nextJt.png" lazy-load="true">
src="{{imgUrl}}/upload/20220608/topJt.png" lazy-load="true">
干净又卫生
class="footImg">
class="footImg2">
失效
{{item.remark}}
class="toolImgBack">
class="toolImgBack">
class="toolImgBack">
class="toolImgBack">
class="toolImgBack">
class="toolImgBack">
相关文章
发表评论