基于uniapp的学生(选课)成绩小程序

简介: 本系统2022年4月创作完成,该系统包含小程序端和管理端,适合选题:小程序、学生成绩、学生选课、成绩管理。系统小程序端采用uniapp+uview实现,小程序接口和管理端采用springboot+mybatis开发,使用mysql数据库,下面是大概的功能。

项目介绍:



本系统2022年4月创作完成,该系统包含小程序端和管理端,适合选题:小程序、学生成绩、学生选课、成绩管理。系统小程序端采用uniapp+uview实现,小程序接口和管理端采用springboot+mybatis开发,使用mysql数据库,下面是大概的功能。


项目功能:



小程序端:
学生登录注册、查看个人信息、修改个人信息、
选课退课
学生可以查看学期课表
老师登录注册、查看个人信息、修改个人信息、查看学期课表
老师可以对选课学生进行打分
管理端:
用户管理:用户信息的维护
课程管理:添加课程信息(学期,学分,地点,课程名,任课教师)
咨询列表:可查看学生的提问,并给出回复
管理员管理:维护管理员信息


数据库表结构文档:



96da592eda8b4b93b0c03a4cbf73c6c4.png


系统包含技术:



管理端:springboot、mybatis、layui

小程序端:uniapp、uview、js、css等

开发工具:idea/hbuilder

数据库:mysql 5.7

JDK版本:jdk1.8


部分截图说明:



下面是登录


2e663c96e7c948599a3c13d0c06f48cf.png


教师首页


0098c702c91d4e64b4ab6b44598b2d4c.png


教师个人中心


157579cb7a3e4b2aa38c448502cdc90e.png


教师查看课程详情


2761d7ca13034f8da02860bb7007104a.png


学生选课


816f198041394b87bc2dc2667abfe710.png


学生个人中心


f2d0ce39606f4942bbd17c455c66050c.png


学生选课信息


0f0cf2293c8344f997a75d2755371093.png


修改信息


a509d5c9ca0641be9378d8948f7f1f40.png


后台-登录


b646bf8f043f4eafadfacadfa252507a.png


后台-首页


788fd215bce34d8d9273553b3fdcc94b.png


后台-教师管理


88ea447f41ca4d3297a0bed9b91bf3ee.png


后台-课程管理


885cc1317e264882990f7a1b4cb15b22.png


部分代码:



拦截器


 @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        HttpSession session = request.getSession();
        if(session.getAttribute("ad") != null){
            return true;
        }
        // 不符合条件的给出提示信息,并转发到主页面
        request.setAttribute("msg", "您还没有登录,请先登录!");
        request.getRequestDispatcher("/gologin.jsp").forward(request, response);
        //返回true通过,返回false拦截
        return false;
    }


登录部分


/**
   * 登录
   * 将提交数据(username,password)写入Admin对象
   */
  @RequestMapping(value = "/login")
  public String login(Admin admin, Model model, HttpSession session, HttpServletRequest request) {
    if(admin.getUsername()==null || admin.getUsername().length()<=0 ){
      model.addAttribute("msg", "请输入手机号!");
      return "login";
    }
    if(admin.getPassword()==null || admin.getPassword().length()<1){
      model.addAttribute("msg", "请输入密码!");
      return "login";
    }
    Map mp = new HashMap();
    mp.put("username",admin.getUsername());
    mp.put("password",admin.getPassword());
    List<Admin> ad = adminService.queryFilter(mp);
    if(ad!=null && ad.size()==1){
      session.setAttribute("ad", ad.get(0));
      session.setAttribute("type", "01");
      return "homepage";
    }else{
      model.addAttribute("msg", "请确定账户信息是否正确!");
      return "login";
    }
  }
  /**
   * 退出登录
   */
  @RequestMapping(value = "/loginOut")
  public String loginOut(HttpSession session) {
    session.invalidate();
    return "login";
  }
  /**
   * 查询个人信息
   */
  @RequestMapping(value = "/info")
  public String info(HttpServletRequest request) {
    return "queryInfo";
  }
  /**
   * 进入修改
   */
  @RequestMapping(value = "/updateInfo")
  public String updateInfo(HttpServletRequest request) {
    return "updateInfo";
  }
  /**
   * 修改信息
   */
  @RequestMapping( value = "/updateInfoAdmin", method = RequestMethod.POST)
  @ResponseBody
  public String updateInfoAdmin(Admin admin, Model model, HttpServletRequest request, HttpSession session1) {
    HttpSession session = request.getSession();
    if(session.getAttribute("ad") == null){
      session.setAttribute("msg", "对不起,请登录!");
      return "202";
    }
    if(admin.getPassword().length()<1){
      return "204";
    }
    Admin admin1 = (Admin) session.getAttribute("ad");
    if(!admin1.getPassword().equals(admin.getPassword())){
      return "201";
    }
    if(!"".equals(admin.getPasswords())){
      admin.setPassword(admin.getPasswords());
    }
    adminService.updateAdmin(admin);
    return "200";
  }


课程组件


<template>
  <view class="list" v-if="list.length > 0">
    <view @click="goDetail(item.id)" class="item" v-for="(item, index) in list" :key="index" hover-class="none">
      <view class="info">
        <view class="text">
          <view class="title">课程名称:{{item.name}}</view>
          <view class="other">
            <view class="left">
              <view class="time">学期:{{item.term}}</view>
            </view>
            <view class="right">
              <view class="time">任课老师:{{item.tname}}</view>
            </view>
          </view>
        </view>
      </view>
      <view class="line"></view>
    </view>
  </view>
</template>
<script>
export default {
  name: 'courseList',
  props: {
    list: {
      type: Array,
      default: function(e) {
        return [];
      }
    }
  },
  data() {
    return {
    }
  },
  methods:{
    goDetail(id){
      uni.navigateTo({
        url: '/pages/index/detail?id='+id
      })
    }
  }
}
</script>
<style scoped lang="scss">
/*列表*/
.list {
  margin-top: 2rpx;
  .item {
    padding: 40rpx 24rpx 0 24rpx;
    .info {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      padding-bottom: 4rpx;
      .text {
        flex-grow: 1;
        flex-shrink: 1;
        display: flex;
        flex-direction: column;
        margin-right: 40rpx;
        .title {
          flex-grow: 1;
          flex-shrink: 1;
          font-size: 34rpx;
          line-height: 1.5;
          display: -webkit-box;
          text-overflow: ellipsis;
          word-break: break-all;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
          overflow: hidden;
          height: 72rpx;
          margin-bottom: 8rpx;
        }
        .other {
          flex-grow: 1;
          flex-shrink: 1;
          display: flex;
          align-items: center;
          font-size: 28rpx;
          color: #999;
          line-height: normal;
          .left {
            display: flex;
            flex-grow: 1;
            flex-shrink: 1;
            .source {
              display: -webkit-box;
              text-overflow: ellipsis;
              word-break: break-all;
              -webkit-line-clamp: 1;
              -webkit-box-orient: vertical;
              overflow: hidden;
              width: 140rpx;
              margin-right: 16rpx;
            }
          }
          .right {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            flex-grow: 0;
            flex-shrink: 0;
            margin-right: 5rpx;
            image {
              flex-grow: 1;
              flex-shrink: 1;
              width: 28rpx;
              height: 28rpx;
              margin-right: 12rpx;
            }
            text {
              flex-grow: 1;
              flex-shrink: 1;
              margin-top: -6rpx;
            }
          }
        }
      }
      .photo {
        image {
          height: 170rpx;
          width: 222rpx;
          border-radius: 10rpx;
        }
      }
    }
    .line {
      display: bock;
      width: 100%;
      height: 1rpx;
      margin-top: 22rpx;
      background: #e8e8e8;
    }
    &:last-child {
      .line {
        //display: none;
      }
      //padding-bottom: 30rpx;
    }
  }
}
</style>


以上就是部分功能展示,从整体上来看,本系统功能是十分完整的,界面设计简洁大方,交互友好,数据库设计也很合理,规模适中,代码工整,清晰,适合学习使用。


好了,今天就到这儿吧,小伙伴们点赞、收藏、评论,一键三连走起呀,下期见~~

相关文章
|
3天前
|
开发框架 小程序 前端开发
圈子社交app前端+后端源码,uniapp社交兴趣圈子开发,框架php圈子小程序安装搭建
本文介绍了圈子社交APP的源码获取、分析与定制,PHP实现的圈子框架设计及代码编写,以及圈子小程序的安装搭建。涵盖环境配置、数据库设计、前后端开发与接口对接等内容,确保平台的安全性、性能和功能完整性。通过详细指导,帮助开发者快速搭建稳定可靠的圈子社交平台。
|
2月前
|
人工智能 小程序 搜索推荐
uni app下开发AI运动小程序解决方案
本文介绍了在小程序中实现AI运动识别的解决方案。该方案依托于UNI平台,通过高效便捷的插件形式,实现包括相机抽帧控制、人体识别、姿态识别等在内的多项功能,无需依赖后台服务器,大幅提高识别效率和用户体验。方案内置多种运动模式,支持自定义扩展,适用于AI健身、云上赛事、AI体测等多场景,适合新开发和存量改造项目。
|
2月前
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
43 0
在线课堂+工具组件小程序uniapp移动端源码
|
3月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
400 3
|
3月前
|
小程序 API
微信小程序更新提醒uniapp
在小程序开发中,版本更新至关重要。本方案利用 `uni-app` 的 `uni.getUpdateManager()` API 在启动时检测版本更新,提示用户并提供立即更新选项,自动下载更新内容,并在更新完成后重启小程序以应用新版本。适用于微信小程序,确保用户始终使用最新版本。以下是实现步骤: ### 实现步骤 1. **创建更新方法**:在 `App.vue` 中创建 `updateApp` 方法用于检查小程序是否有新版本。 2. **测试**:添加编译模式并选择成功状态进行模拟测试。
62 0
微信小程序更新提醒uniapp
|
3月前
|
移动开发 小程序 数据可视化
一招学会DIY官网可视化设计支持导出微擎、UNIAPP、H5、微信小程序源码
一招学会DIY官网可视化设计支持导出微擎、UNIAPP、H5、微信小程序源码
59 2
|
5月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
120 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
3月前
|
小程序 数据可视化 API
低代码可视化-uniapp商城首页小程序-代码生成器
低代码可视化-uniapp商城首页小程序-代码生成器
36 0
|
3月前
|
存储 移动开发 小程序
uniapp富文本editor输入二次扩展兼容微信小程序
uniapp富文本editor输入二次扩展兼容微信小程序
101 0
|
3月前
|
小程序
uniapp实现微信小程序隐私协议组件封装
uniapp实现微信小程序隐私协议组件封装
59 0