nodejs+vue+elementui学生选课系统awwm9

news2024/11/24 5:33:51

前端技术：nodejs+vue+elementui,视图层其实质就是vue页面，通过编写vue页面从而展示在浏览器中，编写完成的vue页面要能够和控制器类进行交互，从而使得用户在点击网页进行操作时能够正常。 可以设置中间件来响应 HTTP 请求。
(3)    教师页面的主要功能：
1.    进入登录界面，用户输入用户名，密码，选择用户类型为教师，然后点击“登录”按钮，假如用户名和密码正确，则进入主界面，否则，提示错误信.息;
2.    主页面为；查看课程：查看学生：成绩录入：个人信息查看：安全退出
3.    在这界面，点击“查看课程”菜单，主要内容显示所有该老师的所有课程。
4.    点击“查看学生”菜单，显示出该教师的所有学生。
5.    点击“成绩录入”菜单，假如学生未给分的，可以在得分输入框内输入分数，然后点击“录入成绩”按钮，实现成绩录入。假如已经录入完的，可以修改成绩;
6.    点击“个人信息查看”菜单，显示当前用户的信息,用户名,密码,真实姓名，职称;
(4)    学生页面的主要功能：
1.    进入登录界面，输入用户名，密码，选择用户类型学生，点击“登录”按钮，后台如果验证成功，则进入系统主界面，否则，提示错误信息;
2.    主界面: 课程信息查看；选课课程；成绩查询；个人信息查看；安全退出。
3.    点击“课程信息查看”菜单，显示出改学生所选的课程，包括课程名称，学分，授课老师;
4.    点击“选课课程”菜单，主界面显示出了该学生已经选择的课程，以及可以选择的课程;在上方，学生点击喜欢的课程。然后点击“选择”课程，即可完成选课功能;在下方，用户点击不喜欢的课程,然后点击“退选课程”，则实现退选课程功能;
5.    点击“成绩查询”菜单，显示该学生的所选课程的成绩，假如授课老师未打分的，则显示“老师暂未打分”;
6.    点击“个人信息查看”菜单，显示当前用户的信息,用户名,密码,真实姓名，专业信息。
创新点;
。主要内容：
(1)    系统用户由三类组成：教师、学生和管理员
(2)    管理员负责的主要功能：
1. 用户进入登录界面，输入用户名，密码，选择管理员用户类型，然后点击“登录”按钮，后台验证成功,则进入主界面，否则，提示错误信息;
2. 用户登录成功，进入管理员主界面; 学生系管理  教师信息管理 课程管理系统 安全退出
3. 点击“学生信息管理系统”，说明:学生信息管理功能有，根据用户名查询学生信息,学生添加功能，学生修改功能，学生信息删除功能;             点击“添加”按钮，进入学生添加界面，输入用户名，密码，真实姓名，学好，专业信息,点击“保存”按钮，实现学生添加功能;
点击“修改”按钮，进入学生修改界面，可以对用户名，密码，真实姓名，学号，专业修改，实现学生修改功能;
用户点击“删除”按钮，弹出删除确认框，假如点击“确定”按钮，则对这条记录进行删除，点击“取消”按钮，则不删除:
4. 教师信息管理功能有，根据用户名查询教师信息，教师添加功能，教师修改功能，教师信息删除功能;进入教师信息修改界面，可以对用户名，密码，真实姓名，职称进行修改，点击“保存”按钮，则完成对信息的修改; Express 框架于Node运行环境的Web框架,
视图层其实质就是vue页面，通过编写vue页面从而展示在浏览器中，编写完成的vue页面要能够和控制器类进行交互，从而使得用户在点击网页进行操作时能够正常。
简单的说 Node.js 就是运行在服务端的 JavaScript。
前端技术：nodejs+vue+elementui
前端：HTML5,CSS3、JavaScript、VUE
 1、 node_modules文件夹(有npn install产生)
    这文件夹就是在创建完项目后，cd到项目目录执行npm install后生成的文件夹，下载了项目需要的依赖项。
2、package.json文件
     此文件是项目的配置文件（可定义应用程序名，版本，依赖项等等）。node_modules文件夹下的依赖项是从哪里知道的呢？原因就是项目根目录下的这个package.json文件，执行npm install时会去找此文件中的dependencies，并安装指定的依赖项。
3、public文件夹(包含images、javascripts、stylesheets)
      这个文件夹做过Web开发的应该一看就知道，为了存放图片、脚本、样式等文件的。
4、routes文件夹
      用于存放路由文件。
5、views文件夹
      存放视图
点击“删除”按钮，弹出删除确认框，点击“确定”，则实现信息删除，否则，不删除;
5. 课程信息管理功能有，根据课程名称查询课程信息，课程信息添加功能，课程信息修改功能，课程信息删除功能;
进入课程信息添加界面，输入课程名称，学分，选择授课老师，点击“保存”按钮，则实现课程信息添加功能;
进入课程信息添加界面，输入课程名称，学分，选择授课老师，点击“保存”按钮，则实现课程信息添加功能;
进入课程信息修改界面，可以修改课程名称，学分，选择其他授课老师，点击“保存”按钮，则实现课程信息修改功能;
点击“删除”按钮，弹出“确认框”，点击“确定”，则实现把这条记录删除，点击“取消”，则不删除;关键代码实现:


 

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

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

相关文章

详细总结Webpack5的配置和使用

详细总结Webpack5的配置和使用

打包工具 使用框架（React、Vue），ES6 模块化语法，Less/Sass 等 CSS预处理器等语法进行开发的代码要想在浏览器运行必须经过编译成浏览器能识别的 JS、CSS 等语法，才能运行。 所以需要打包工具帮我们做完这些事。除此之…
阅读更多...
微信小程序学习笔记（三）——视图与逻辑

微信小程序学习笔记（三）——视图与逻辑

页面导航 什么是页面导航 页面导航指的是页面之间的相互跳转。例如&#xff0c;浏览器中实现页面导航的方式有如下两种&#xff1a; <a> 链接location.href 小程序中实现页面导航的两种方式 声明式导航、 在页面上声明一个 <navigator> 导航组件通过点击 <…
阅读更多...
R语言手动安装包

R语言手动安装包

包安装问题解决方案 1. Biocmanager安装 2. 手动安装 文章目录 包安装问题解决方案前言一、Rstudio手动安装二、conda手动安装R包2.1 在Linux环境中使用R2.2 anaconda官网包下载 总结 前言 大家好✨&#xff0c;这里是bio&#x1f996;。点赞关注不迷路。在上一篇blog中为大家…
阅读更多...
Tabby - 本地化AI代码自动补全 - Linux Debian

Tabby - 本地化AI代码自动补全 - Linux Debian

参考&#xff1a; https://github.com/TabbyML/tabby Docker | Tabby Linux Debian上快速安装Docker并运行_Entropy-Go的博客-CSDN博客 Tabby - 本地化AI代码自动补全 - Windows10_Entropy-Go的博客-CSDN博客 为什么选择Tabby 已经有好几款类似强劲的代码补全工具&#xf…
阅读更多...
自动驾驶感知系统-摄像头

自动驾驶感知系统-摄像头

车载摄像头的工作原理&#xff0c;首先是采集图像&#xff0c;将图像转换为二维数据&#xff1b;然后&#xff0c;对采集的图像进行模式识别&#xff0c;通过图像匹配算法识别行驶过程中的车辆、行人、交通标识等&#xff1b;最后&#xff0c;依据目标物体的运动模式或使用双目…
阅读更多...
(202307)wonderful-sql:基础查询与排序(task2)

(202307)wonderful-sql:基础查询与排序(task2)

教程链接&#xff1a;Datawhale - 一个热爱学习的社区 知识学习 前提&#xff1a; 上一次任务中提出了本课程的用表&#xff0c;但是我并没有加入这个表&#xff0c;这次学习前先对这个表进行插入。 INSERT INTO product VALUES(0001, T恤衫, 衣服, 1000, 500, 2009-09-20)…
阅读更多...
[Linux笔记]gdb调试器常用指令

[Linux笔记]gdb调试器常用指令

gcc/g形成的可执行程序默认是release版的。若要生成debug版&#xff0c;应使用-g选项。 如&#xff1a;gcc -o mytest test.c -g -stdc99 可以看到debug版包含了调试信息&#xff1a; 使用&#xff1a;gdb 文件名&#xff1a; 补充&#xff1a; 以下所有的查看指令都不会影…
阅读更多...
CMU 15-445 -- Parallel Execution - 11

CMU 15-445 -- Parallel Execution - 11

CMU 15-445 -- Join Algorithms - 11 引言Parallel & DistributedInter-query vs. Intra-query Parallelism Process ModelApproach #1: Process per DBMS WorkerApproach #2: Process PoolApproach #3: Thread per DBMS Worker Execution ParallelismInter-query Parallel…
阅读更多...
基于SpringBoot+vue的滴答拍摄影项目设计与实现

基于SpringBoot+vue的滴答拍摄影项目设计与实现

博主介绍&#xff1a; 大家好&#xff0c;我是一名在Java圈混迹十余年的程序员&#xff0c;精通Java编程语言&#xff0c;同时也熟练掌握微信小程序、Python和Android等技术&#xff0c;能够为大家提供全方位的技术支持和交流。 我擅长在JavaWeb、SSH、SSM、SpringBoot等框架…
阅读更多...
JAVA设计模式——23种设计模式详解

JAVA设计模式——23种设计模式详解

一、什么是设计模式&#x1f349; 设计模式&#xff08;Design pattern&#xff09; 是解决软件开发某些特定问题而提出的一些解决方案也可以理解成解决问题的一些思路。通过设计模式可以帮助我们增强代码的可重用性、可扩充性、 可维护性、灵活性好。我们使用设计模式最终的目…
阅读更多...
基于物联网网关的工业数据可视化平台有什么功能？

基于物联网网关的工业数据可视化平台有什么功能？

随着数字化浪潮的不断发展&#xff0c;工业数据的价值越来越重要。在企业利用数据的过程中&#xff0c;数据可视化是数字化系统中十分重要的一部分。然而&#xff0c;工厂多种设备、多种协议影响到系统的搭建使得企业无法获得全面的数据视图&#xff0c;也无法对整个生产流程进…
阅读更多...
Ubuntu22.04 安装深度学习服务器全纪录

Ubuntu22.04 安装深度学习服务器全纪录

文章目录 Ubuntu 22.04 安装深度学习服务器全纪录1. 制作启动盘2. 安装 Ubuntu 22.043.配置国内镜像软件源4. Python 相关设置5. 配置 SSH6. 配置远程桌面6. 安装 CUDA7. 安装 docker8. 安装 Anaconda9. 安装 ChatGLM210. 使用 fastllm 推理加速 Ubuntu 22.04 安装深度学习服务…
阅读更多...
【100天精通python】Day8：数据结构_元组Tuple的创建、删除、访问、修改、推导系列操作

【100天精通python】Day8：数据结构_元组Tuple的创建、删除、访问、修改、推导系列操作

目录 1 创建元组 2 删除元组 3 访问元组元素 4 多个值的同时赋值和交换 5 修改元组元素 6 元组推导式 7 元组运算符 8 元组常用场景 9 元组&#xff08;Tuple&#xff09;和列表&#xff08;List&#xff09;的区别 元组&#xff08;tuple&#xff09;是 Python 中的…
阅读更多...
Codeforces Round 886 (Div. 4)

Codeforces Round 886 (Div. 4)

目录 A. To My Critics B. Ten Words of Wisdom C. Word on the Paper D. Balanced Round E. Cardboard for Pictures F. We Were Both Children G. The Morning Star A. To My Critics time limit per test1 second m…
阅读更多...
《qt quick核心编程》笔记一

《qt quick核心编程》笔记一

1.基础HelloWorld代码 import QtQuick 2.15 import QtQuick.Window 2.15 import QtQuick.Controls 2.15Window {width: 400height: 300visible: truetitle: qsTr("Hello 1World")Rectangle {width: parent.widthheight: parent.heightcolor: "gray"Text {…
阅读更多...
RabbitMQ惰性队列使用

RabbitMQ惰性队列使用

说明&#xff1a;惰性队列是为了解决消息堆积问题&#xff0c;当生产者生产消息的速度远高于消费者消费消息的速度时&#xff0c;消息会大量的堆积在队列中&#xff0c;而队列中存放的消息数量是有限的&#xff0c;当超出数量时&#xff0c;会造成消息的丢失。而扩容队列&#…
阅读更多...
Homography单应性矩阵

Homography单应性矩阵

1. Homography 单应性概念 考虑 同一个平面(比如书皮)的两张图片&#xff0c;红点表示同一个物理坐标点在两张图片上的各自位置。在 CV 术语中&#xff0c;我们称之为对应点。 Homography 就是将一张图像上的点映射到另一张图像上对应点的3x3变换矩阵. 因为 Homography 是一个 …
阅读更多...
AtcoderABC237场

AtcoderABC237场

A - Not OverflowA - Not Overflow 题目大意 题目要求判断给定的整数N是否在范围[-231, 231-1]内&#xff0c;如果是则输出"Yes"&#xff0c;否则输出"No"。 思路分析 位运算&#xff1a;由于题目中的范围是2的幂次方&#xff0c;可以使用位运算来进行快…
阅读更多...
Elasticsearch/Enterprise Search/Kibana安装记录

Elasticsearch/Enterprise Search/Kibana安装记录

目录 Elasticsearch的安装导入 elasticsearch PGP密钥 安装使用APT安装手动下载安装 启动elasticsearch安全功能重新配置节点以加入现有集群启用系统索引的自动创建功能运行Elasticsearch(在systemd下)检查Elasticsearch是否正在运行Elasticsearch配置外网访问 第三方包安装ela…
阅读更多...
flex局部的知识总结

flex局部的知识总结

一、Flex布局的基本概念。 &#xff08;1&#xff09;Flex布局&#xff1a; 任何一个容器都可以指定为Flex布局。 注意&#xff1a;设为Flex布局以后&#xff0c;子元素的float、clear和vertical-align属性将失效。 &#xff08;2&#xff09;Flex容器&#xff1a;采用Flex布局…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023