天马学航——智慧教务系统(移动端)开发日志四

天马学航——智慧教务系统(移动端)开发日志四

日志摘要：优化了教师端界面的UI，更新了教师端添加课程，提交成绩等功能，修复了一些已知的BUG

1、教师添加课程设计

教师在此界面添加课程，并将数据提交后端进行审核

界面效果
image-20240620111914879
前端源码
@Entry
@Component
struct AddCourse {selectedDate: Date = new Date("2010-1-1")@State time:string = '请选择时间'@State cid:string = '-111'@State cname:string = '-111'build() {Column({ space: 5 }) {Text(" ")Row({ space: 10 }) {Text(" ")Image($r('app.media.back')).width(30).height(30).onClick(function () {//返回上一页router.back() //直接返回})Text("发布课程").fontSize(30).fontWeight(FontWeight.Bolder)}.width('100%')Text("----------------------------------------------")Text(" ")Column({space:30}){Text("申请发布课程").fontSize(30).fontWeight(FontWeight.Bolder).fontSize(30)Row({space:20}){Text("课程号    ").fontSize(15)TextInput().width('70%').height(50).type(InputType.Normal).onChange(value=>{this.cid = value})}.width('100%')Row({space:20}){Text("课程名称").fontSize(15)TextInput().width('70%').height(50).type(InputType.Normal).onChange(value=>{this.cname = value})}.width('100%')Row({space:20}){Text("上课时间").fontSize(15)Button("选择时间").width(100).margin(20).onClick(() => {DatePickerDialog.show({start: new Date("2023-1-1"), // 设置选择器的起始日期end: new Date("2055-12-31"), // 设置选择器的结束日期selected: this.selectedDate, // 设置当前选中的日期lunar: false,onAccept: (value: DatePickerResult) => { // 点击弹窗中的“确定”按钮时触发该回调// 通过Date的setFullYear方法设置按下确定按钮时的日期，这样当弹窗再次弹出时显示选中的是上一次确定的日期this.selectedDate.setFullYear(value.year, value.month, value.day)console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))this.time=value.year+"-"+(value.month+1)+"-"+ value.dayif(value.month+1>0&&value.month+1<10){this.time=value.year+"-0"+(value.month+1)+"-"+ value.day}if(value.day>0&&value.day<10){this.time=value.year+"-"+(value.month+1)+"-0"+ value.day}if((value.month+1>0&&value.month+1<10)&&(value.day>0&&value.day<10)){this.time=value.year+"-0"+(value.month+1)+"-0"+ value.day}},onCancel: () => { // 点击弹窗中的“取消”按钮时触发该回调console.info("DatePickerDialog:onCancel()")},onChange: (value: DatePickerResult) => { // 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调console.info("DatePickerDialog:onChange()" + JSON.stringify(value))}})})Text(this.time).fontSize(15)}.width('100%')Column({space:20}){Text("*注意：请确认信息后再提交，否则可能导致审核不通过！").fontSize(15).fontColor(Color.Red)Button("提交申请").width(200).onClick(()=>{if(this.time === "请选择时间" || this.cid === '-111' || this.cname === '-111'){promptAction.showToast({message: "请完成表单的填写",duration: 2000,bottom: 50});}else {AddCourses.STA(this.cid,this.cname,this.time).then(resp=>{console.log("后端返回"+resp)promptAction.showToast({message: resp,duration: 2000,bottom: 50});})}})}}.width('80%')}}
}
请求源码
class AddCourses {baseURL: string = IP.ipSTA(cid: string, cname: string, ctime: string): Promise<string> {const data = {cid: cid,cname: cname,ctime: ctime}return new Promise((resolve, reject) => {let httpRequest = http.createHttp()httpRequest.request(`${this.baseURL}/InsertCourse`,{method: http.RequestMethod.GET,extraData: data,connectTimeout: 10000,readTimeout: 10000},).then(resp=>{if(resp.responseCode===200){console.log("请求成功！"+resp.result)resolve(resp.result.toString())}else {console.log("请求出现问题"+resp.responseCode)}}).catch(err=>{console.log("请求失败")})})}
}const sc1 = new AddCourses()
export default sc1 as AddCourses
后端源码
public class TeacherInsertCourse extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {resp.setContentType("application/json");resp.setCharacterEncoding("UTF-8");String sid = req.getParameter("sid");String cid = req.getParameter("cid");String grade = req.getParameter("grade");System.out.println("教师提交成绩"+sid+cid+grade);//MybatisSqlSession sql = MybatisUntills.getSqlSession();CourseMapper mapper = sql.getMapper(CourseMapper.class);Map<String,Object> map = new HashMap<String, Object>();map.put("sid",sid);map.put("cid",cid);map.put("grade",grade);int i = mapper.TeacherInsertGrade(map);sql.commit();if(i==1){resp.getWriter().write("上传成功");}else {resp.getWriter().write("上传失败");}sql.close();}@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {doGet(req, resp);}
}

2、教师提交成绩功能设置

前端从后端获取本教师任教的课程，并显示在前端，前端通过表单收集每门课程的评分，并向后端发送请求

image-20240620111914879
前端源码
struct AddGrade {@State grades:Grade[] = []@State g:string = '000'aboutToAppear(){this.getinfo()}build() {Column({ space: 5 }) {Text(" ")Row({ space: 10 }) {Text(" ")Image($r('app.media.back')).width(30).height(30).onClick(function () {//返回上一页router.back() //直接返回})Text("提交成绩").fontSize(30).fontWeight(FontWeight.Bolder)}.width('100%')Text("----------------------------------------------")Text(" ")List({space:20}){ForEach(this.grades,grade=>{ListItem(){Row({space:30}){Text(" ")Column({space:10}){Text("学号："+grade.sid)Text("姓名："+grade.sname)Text("课程名称："+grade.cname)Text("课程号："+grade.cid)Row(){Text("成绩：")TextInput({placeholder:"给分有理，扣分有据"}).width(200).type(InputType.Number).onChange(value=>{this.g = value})}Button("提交").onClick(()=>{InsertGrade.STA(grade.sid,grade.cid,this.g).then(resp=>{promptAction.showToast({message: resp,duration: 2000,bottom: 50});})router.pushUrl({url:"pages/view/Teacher/AddGrade"},router.RouterMode.Single,err => {if(err){console.log("跳转失败")}})})}.width('100%').justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Start)}.width('95%').padding(20).backgroundColor(Color.White).borderRadius(15).shadow({ radius: 6, color: '#1F000000', offsetX: 2, offsetY: 4 })}})}}}getinfo(){GetCourse.GT().then(resp=>{console.log("前端收到数据"+resp);this.grades = respif(resp.length === 0){promptAction.showToast({message: "您已上传完所有成绩~",duration: 2000,bottom: 50});}})}
}
请求源码
请求课程
class GetCourse {baseURL: string = IP.ipGT(): Promise<Grade[]> {return new Promise((resolve, reject) => {let Http = http.createHttp()Http.request(`${this.baseURL}/GetTeacherCourse`,{method: http.RequestMethod.GET,connectTimeout: 10000,readTimeout: 10000}).then(resp=>{if(resp.responseCode === 200){console.log("请求成功"+resp.result)resolve(JSON.parse(resp.result.toString()))}else {console.log("请求发现异常"+resp.responseCode)}}).catch(err=>{console.log("请求失败"+err)})})}
}const sc = new GetCourse()
export default sc as GetCourse
向后端返回成绩
class InsertGrade {baseURL: string = IP.ipSTA(sid: string, cid: string, grade: string): Promise<string> {const data = {cid: cid,sid: sid,grade: grade}return new Promise((resolve, reject) => {let httpRequest = http.createHttp()httpRequest.request(`${this.baseURL}/TeacherInertCourse`,{method: http.RequestMethod.GET,extraData: data,connectTimeout: 10000,readTimeout: 10000},).then(resp=>{if(resp.responseCode === 200){console.log("后端返回成功"+resp.result)resolve(resp.result.toString())}else {console.log("请求出现问题："+resp.responseCode)}}).catch(err=>{console.log("请求失败"+err)})})}
}const sc = new InsertGrade()
export default sc as InsertGrade
后端源码

请求课程部分与学生选课第一部分业务逻辑相似，这里不再赘述

这里只写出后端处理前端返回成绩的部分

public class TeacherInsertCourse extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {resp.setContentType("application/json");resp.setCharacterEncoding("UTF-8");String sid = req.getParameter("sid");String cid = req.getParameter("cid");String grade = req.getParameter("grade");System.out.println("教师提交成绩"+sid+cid+grade);//MybatisSqlSession sql = MybatisUntills.getSqlSession();CourseMapper mapper = sql.getMapper(CourseMapper.class);Map<String,Object> map = new HashMap<String, Object>();map.put("sid",sid);map.put("cid",cid);map.put("grade",grade);int i = mapper.TeacherInsertGrade(map);sql.commit();if(i==1){resp.getWriter().write("上传成功");}else {resp.getWriter().write("上传失败");}sql.close();}@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {doGet(req, resp);}
}

3、BUG修复

修复了一些已知的BUG

4、UI优化

优化教师端图标和界面布局，使得更加人性化

image-20240620111914879

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/diannao/32629.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

代码随想录算法训练营第四十七天|LeetCode123 买卖股票的最佳时机Ⅲ

代码随想录算法训练营第四十七天|LeetCode123 买卖股票的最佳时机Ⅲ

题1&#xff1a; 指路&#xff1a;123. 买卖股票的最佳时机 III - 力扣&#xff08;LeetCode&#xff09; 思路与代码&#xff1a; 买卖股票专题中三者不同的是Ⅰ为只买卖一次&#xff0c;Ⅱ可多次买卖&#xff0c;Ⅲ最多可买卖两次。那么我们将买买卖行为分为五个状态部分(…
阅读更多...
LeetCode 每日一题 2024/6/17-2024/6/23

LeetCode 每日一题 2024/6/17-2024/6/23

记录了初步解题思路 以及本地实现代码&#xff1b;并不一定为最优 也希望大家能一起探讨 一起进步 目录 6/17 522. 最长特殊序列 II6/18 2288. 价格减免6/19 2713. 矩阵中严格递增的单元格数6/20 2748. 美丽下标对的数目6/21 LCP 61. 气温变化趋势6/22 2663. 字典序最小的美丽字…
阅读更多...
WAAP的特性、功能以及优势

WAAP的特性、功能以及优势

随着互联网技术的快速发展&#xff0c;Web应用程序和API已经成为企业日常运营中不可或缺的部分。然而&#xff0c;与此同时&#xff0c;网络攻击手段也愈发复杂和隐蔽&#xff0c;给企业的数据安全带来了严峻的挑战。为了应对这一挑战&#xff0c;WAAP&#xff08;WebApplicati…
阅读更多...
fastapi+vue3+primeflex前后端分离开发项目第一个程序

fastapi+vue3+primeflex前后端分离开发项目第一个程序

安装axios axios是用来请求后端接口的。 https://www.axios-http.cn/docs/intro pnpm 是一个前端的包管理工具&#xff0c;当我们需要给前端项目添加新的依赖的时候&#xff0c;就可以使用pnpm install 命令进行安装。 pnpm install axios安装 primeflex primeflex是一个cs…
阅读更多...
知乎客户端跨平台-Hybrid-调试实战

知乎客户端跨平台-Hybrid-调试实战

在开发上述功能的过程中&#xff0c;发现了 flipper 这个工具 flipper 提供了一个桌面客户端&#xff0c;然后这个桌面客户端提供了一个和手机客户端通信的机制&#xff0c;免去了 socket 服务的开销&#xff0c;依靠这个通信机制&#xff0c;我们可以把上述的功能复制过来 基…
阅读更多...
Python数列求和

Python数列求和

1 问题 如何用python解决数学问题&#xff1f;如何用python数列求和&#xff1f; 2 方法 代码清单 1 Courier New字体&#xff0c;23磅行间距>>> def sum_num(): input_num input("输入一个0-9的整数:") try: input_num int(input_num) …
阅读更多...
AI时代的音乐革命：创作更简单，灵魂在哪里？

AI时代的音乐革命：创作更简单，灵魂在哪里？

#AI在创造还是毁掉音乐# 我是李涛&#xff0c;一名音乐创作者&#xff0c;最近一直在思考一个问题&#xff1a;AI到底是在创造音乐&#xff0c;还是在毁掉音乐&#xff1f; 几个月前&#xff0c;我第一次接触到AI音乐创作工具。它让我震惊&#xff0c;只需要输入几个关键词&a…
阅读更多...
Apollo9.0 PNC源码学习之Planning模块（一）—— 规划概览

Apollo9.0 PNC源码学习之Planning模块（一）—— 规划概览

0 前言 规划本质就是搜索问题，数学角度来看就是寻找函数最优解 规划模块复杂的就是相关的逻辑处理和过程计算 对于规划的三维问题，目前解决方案：降维+迭代 将SLT问题分解为ST和SL二维优化问题：在一个维度优化之后，再另一个维度再进行优化，最后整合成三维的轨迹。 虽然降…
阅读更多...
人机交互中的真问题与假问题

人机交互中的真问题与假问题

在人机交互领域&#xff0c;存在一些真正的挑战和问题&#xff0c;这些问题影响着如何有效地设计、开发和使用人机界面和交互系统。具体涉及&#xff1a; 人机交互系统需要尽可能自然和普适&#xff0c;以便用户可以轻松理解和使用。例如&#xff0c;语音识别系统需要能够准确地…
阅读更多...
Excel使用小技巧

Excel使用小技巧

1、快速求和 选中数据区域&#xff0c;然后按组合键<Alt> 2、Excel表格美化 选中单元格区域&#xff0c;插入——表格&#xff0c;确定。也可以按快捷键CtrlT。 3、多个单元格同时输入 选中所有单元格&#xff0c;在编辑栏输入数据&#xff0c;按下Ctrl键的同时&#xf…
阅读更多...
How to create a langchain doc from an str

How to create a langchain doc from an str

问题背景&#xff1a; Ive searched all over langchain documentation on their official website but I didnt find how to create a langchain doc from a str variable in python so I searched in their GitHub code and I found this : 在 langchain 的官方文档中&#…
阅读更多...
链表题目之模拟类

链表题目之模拟类

还有一些题目是没有特别复杂的技巧&#xff0c;但是考察仔细程度以及基本的链表处理能力&#xff0c;从而考察在基本的逻辑处理上考虑的全面和细致层度。这类题目对于业务代码编码能力的鉴定的确是有一些帮助。 分隔链表(86) 题目&#xff1a;86. 分隔链表 把大于等于的放到一…
阅读更多...
游戏工厂：AI（AIGC/ChatGPT）与流程式游戏开发

游戏工厂：AI（AIGC/ChatGPT）与流程式游戏开发

游戏工厂&#xff1a;AI&#xff08;AIGC/ChatGPT&#xff09;与流程式游戏开发 码客 卢益贵 ygluu 关键词&#xff1a;AI&#xff08;AIGC、ChatGPT、文心一言&#xff09;、流程式管理、好莱坞电影流程、电影工厂、游戏工厂、游戏开发流程、游戏架构、模块化开发 一、前言…
阅读更多...
Vue76-路由对浏览器历史记录的影响

Vue76-路由对浏览器历史记录的影响

一、push模式 默认是push 二、replace模式 替换当前记录&#xff01; &#xff08;当前指针指向的那一条记录&#xff09; 三、小结
阅读更多...
完全禁用 Windows Defender

完全禁用 Windows Defender

你有没有这样的情况&#xff0c;安装软件时&#xff0c;关闭了Windows实时保护&#xff0c;过几天&#xff0c;打开软件时&#xff0c;发现里面的附件被吞噬&#xff0c;因为Defender又自动打开了&#xff0c;那么&#xff0c;有没有一款可以完全禁用Defender的工具&#xff0c…
阅读更多...
年薪50w+的项目经理，手把手教你如何复盘

年薪50w+的项目经理，手把手教你如何复盘

复盘是一种重要的学习和改进工具&#xff0c;对于项目经理来说&#xff0c;能帮助识别项目中的成功与失败&#xff0c;为未来的项目管理提供宝贵经验。 理论部分 定义目标。在开始复盘之前&#xff0c;明确复盘的目标是什么。是为了找出项目中的问题并提出解决方案&#xff0c…
阅读更多...
Linux的设备模型

Linux的设备模型

在设备模型出现以前，Linux的驱动存在以下问题： 1，设备和驱动没有分离。也就是说设备的信息是硬编码在驱动代码中的，这给驱动程序造成了极大的限制。如果硬件有所改动，那么必然要修改驱动代码。比如LED如果修改了管脚，那么就必然要修改驱动程序。这样就导致驱动的通用性很…
阅读更多...
腾讯大牛，手把手教你建立自己的Android学习知识体系，附实例+面经+建议！

腾讯大牛，手把手教你建立自己的Android学习知识体系，附实例+面经+建议！

主要让我介绍了我的项目&#xff0c;又出了几个题让我做。 项目就是让我介绍我科研做的那个流式二维码数据传输系统&#xff0c;我介绍的时候面试官听的很仔细&#xff0c;让我详细介绍了拍到的二维码是如何定位、采样和识别转换成二进制流的。然后问我传输速率是多少&#xff…
阅读更多...
Android开启wifi调试

Android开启wifi调试

1.首先需要电脑和手机设备在同一个局域网下 1.1 手机和电脑连接同一个wifi&#xff0c;这样就是在同一个局域网下 1.2 可以用手机开一个热点&#xff0c;然后电脑连接手机开启的热点&#xff0c;这样也算在同一个局域网下 2.开启手机设备的无线调试功能 这个功能好像是可以在…
阅读更多...
yarn安装配置及使用教程

yarn安装配置及使用教程

Yarn 是一款 JavaScript 的包管理工具&#xff0c;是 Facebook, Google, Exponent 和 Tilde 开发的一款新的 JavaScript 包管理工具&#xff0c;它提供了确定性、依赖关系树扁平化等特性&#xff0c;并且与 npm 完全兼容。以下是 Yarn 的安装及使用教程&#xff1a; Yarn 安装…
阅读更多...
最新文章

Copyright @ 2022~2023