课题-健康上报小程序

60 阅读2分钟

课题-健康上报小程序

本文所涉及所有资源均在传知代码平台可获取

概述

这几天接到了个学生的需求,大概就是做一个在校常态化管理的小程序,该项目可以满足基本的增删查改,搭建简单适合学生课题作业

用到的技术及框架

  • Spring boot
  • element
  • node
  • mysql 5.6
  • Vue2

开发工具

  • IntelliJ IDEA
  • 微信小程序

附录资源截图

在这里插入图片描述

演示效果

前端

在这里插入图片描述

后端

在这里插入图片描述

核心逻辑

需求分析

在这里插入图片描述

接口设计

统一返回接口

新建base包

在这里插入图片描述

新建Result类

import lombok.Data;

import java.io.Serializable;


@Data
public class Result implements Serializable {

    private Integer code;

    private String message;

    private Object data;

    public Result(ResultCode resultCode,Object data){
        this.code = resultCode.getCode();
        this.message = resultCode.getMsg();
        this.data = data;
    }
}

新建ResultCode类

package com.example.minipro_cov.base;
public enum ResultCode {

    SUCCESS(200, "成功"),
    FAILLER(100,"失败"),
    ;

    private Integer code;

    private String msg;

    public Integer getCode() {
        return this.code;
    }

    public String getMsg() {
        return this.msg;
    }

    ResultCode(Integer code, String msg) {
        this.code = code;
        this.msg = msg;
    }
}

使用方法,在控制器里面返回

return Result result = new Result(ResultCode.SUCCESS,"你的数据");

测试结果

在这里插入图片描述

程序运行演示测试结果

在这里插入图片描述

登录接口设计

新建userController.java

//登录接口
    @RequestMapping("/login")
    public Result login(@RequestParam("username") String username, @RequestParam("password") String password){
        QueryWrapper<User> userQueryWrapper = new QueryWrapper<>();
        userQueryWrapper.select("id","nickname","uname","pwd").like("uname" , username).like("pwd",password);
//把select()放在最后面也可以,但我一般喜欢放在最前面,和sql语法保持一致
        List<User> userList = userMapper.selectList(userQueryWrapper);
if (!userList.isEmpty()){
    Result result = new Result(ResultCode.SUCCESS,userList);
    return result;

}else{
    Result result = new Result(ResultCode.FAILLER,userList);
    return result;

}

    }

注册用户接口设计

//    注册用户
    @RequestMapping("/regidt")
    public Result regidt(@RequestParam String nickname, @RequestParam String uname, @RequestParam String pwd){
    User user=new User();
    user.setNickname(nickname);//设置昵称
    user.setUname(uname);//设置学号、工号
    user.setPwd(pwd);//设置密码
    int result= userMapper.insert(user);

   if (result==1){
       return new Result(ResultCode.SUCCESS,result);
   }
else{
       return new Result(ResultCode.FAILLER,result);
   }
    }

功能页面

后台

用户管理

在这里插入图片描述

打卡管理

在这里插入图片描述

小程序

个人信息修改 可以进行修改编辑自己的个人信息和登录密码

在这里插入图片描述

我的打卡 含有打卡记录轨迹

在这里插入图片描述

部署方式

后台管理系统

打开【后台管理系统】文件夹,通过

npm i

进行安装,安装结束后,输入下方代码完成运行

  npm run serve

在这里插入图片描述

浏览器访问localhost:8080即可

  账户 admin 
  密码 123

接口端

导入后端代码(文件夹名:Springboot后端服务)到idea ,配置数据库连接,依赖文件,运行run即可

在这里插入图片描述

小程序端

通过微信开发者工具打开【健康上报小程序】文件夹,运行即可

在这里插入图片描述

TIPS: 如果需要发布小程序到外部使用,修改前端requests.js文件里面的const baseURL = ‘http://127.0.0.1:8088’ 打包即可

下载方式

点击底部附件即可完成下载

文章代码资源点击附件获取