目前实现页面

最新推荐文章于 2024-11-16 13:36:18 发布
最新推荐文章于 2024-11-16 13:36:18 发布
阅读量175 收藏
点赞数 2
文章标签： idea spring boot mybatis html 数据库
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_80868351/article/details/139972564
版权

html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>教师信息</title>
  <script src="./js/vue.js"></script>
  <script src="./js/axios-0.18.0.js"></script><script src="js/jquery.min.js"></script>
  <script src="js/element.js"></script>
  <script src="js/axios-0.18.0.js"></script>

  <link rel="stylesheet" href="element-ui/index.css">
  <script src="./element-ui/index.js"></script>
  <style>
    .el-header{
      background: #409EFF;
    }
    .el-aside {
      color: #333;}
  </style>

</head>

<body>
<div id="app" align="center">

  <el-menu
          :default-active="activeIndex2"
          class="el-menu-demo"
          mode="horizontal"
          @select="handleSelect"
          background-color="#545c64"
          text-color="#fff"
          active-text-color="#ffd04b">
    <el-menu-item index="1">处理中心</el-menu-item>
    <el-submenu index="2">
      <template slot="title">我的工作台</template>
      <el-menu-item index="2-1">教师详细信息</el-menu-item>
      <el-menu-item index="2-2">教学评价</el-menu-item>
      <el-menu-item index="2-3">教学反馈</el-menu-item>
    </el-submenu>
    <el-menu-item index="3" disabled>消息中心</el-menu-item>
  </el-menu>
<el-container style="height: 500px; border: 1px solid #eee">
  <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
    <el-menu :default-openeds="['1', '3']">
      <el-submenu index="1">
        <template slot="title"><i class="el-icon-message"></i>专业管理</template>
        <el-menu-item-group>
          <template slot="title">分组一</template>
          <el-menu-item index="1-1">选项1</el-menu-item>
          <el-menu-item index="1-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="1-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="1-4">
          <template slot="title">选项4</template>
          <el-menu-item index="1-4-1">选项4-1</el-menu-item>
        </el-submenu>
      </el-submenu>
      <el-submenu index="2">
        <template slot="title"><i class="el-icon-menu"></i>班级管理</template>
        <el-menu-item-group>
          <template slot="title">分组一</template>
          <el-menu-item index="2-1">选项1</el-menu-item>
          <el-menu-item index="2-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="2-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="2-4">
          <template slot="title">选项4</template>
          <el-menu-item index="2-4-1">选项4-1</el-menu-item>
        </el-submenu>
      </el-submenu>
      <el-submenu index="3">
        <template slot="title"><i class="el-icon-setting"></i>学生管理</template>
        <el-menu-item-group>
          <template slot="title">分组一</template>
          <el-menu-item index="3-1">选项1</el-menu-item>
          <el-menu-item index="3-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="3-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="3-4">
          <template slot="title">选项4</template>
          <el-menu-item index="3-4-1">选项4-1</el-menu-item>
        </el-submenu>
      </el-submenu>
      <el-submenu index="1">
        <template slot="title"><i class="el-icon-message"></i>教师管理</template>
        <el-menu-item-group>
          <template slot="title">分组一</template>
          <el-menu-item index="1-1">选项1</el-menu-item>
          <el-menu-item index="1-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="1-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="1-4">
          <template slot="title">选项4</template>
          <el-menu-item index="1-4-1">选项4-1</el-menu-item>
        </el-submenu>
      </el-submenu>
      <el-submenu index="1">
        <template slot="title"><i class="el-icon-message"></i>课程管理</template>
        <el-menu-item-group>
          <template slot="title">分组一</template>
          <el-menu-item index="1-1">选项1</el-menu-item>
          <el-menu-item index="1-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="1-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="1-4">
          <template slot="title">选项4</template>
          <el-menu-item index="1-4-1">选项4-1</el-menu-item>
        </el-submenu>
      </el-submenu>
    </el-menu>
  </el-aside>

  <el-container>
    <el-header >
      <h1 align="center"></h1>
      教师列表展示
    </el-header>
<!--<h1 align="center"></h1>-->
<!--<el-container>-->
<!--  <el-header>教师信息列表展示</el-header>-->
<!--</el-container>-->
  <el-main>
    <el-table :data="tableData">
      <el-table-column prop="id" label="工号" width="140">
      </el-table-column>
      <el-table-column prop="name" label="姓名" width="120">
      </el-table-column>
      <el-table-column prop="email" label="邮箱">
      </el-table-column>
      </el-table-column>
      <el-table-column prop="department" label="部门">
      </el-table-column>
      </el-table-column>
      <el-table-column prop="password" label="密码">
      </el-table-column>
      </el-table-column>
      <el-table-column  label="操作" width="200">
        <div align="center" style="display: flex; justify-content: center;">
<a href="teacher_edit.html">
  <el-button type="primary" icon="el-icon-edit" size="medium" round>修改</el-button>

<a href="teacher_delete2.html">
  <el-button type="primary" icon="el-icon-delete" size="medium" round>删除</el-button></a>
</a></div>
      </el-table-column>

    </el-table>
  </el-main>
  </el-container>
  </el-container>
  <div>
    <el-switch v-model="value">
    </el-switch>
    <p align="center">
      <el-pagination
              layout="total, sizes, prev, pager, next, jumper"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[3, 5, 10, 20]"
              :page-size="pageSize"
              :total="total">
      </el-pagination>
    </p>

  </div>
</div>

<script>
  new Vue({
    el: "#app",
    data() {
      return {
        tableData: []
      }
    },

    mounted(){
      //peotfindAll
      axios.get('/teacher').then(res=>{
        if(res.data.code==1){
          this.tableData = res.data.data;
        }
      }).catch(r=>{
        console.error(r);
      });
    },




  })

</script>



</body>

</html>

TeacherController

package com.example.teacher.controller;

import com.example.teacher.pojo.Pagebean;
import com.example.teacher.pojo.Result;
import com.example.teacher.pojo.Teacher;
import com.example.teacher.service.TeacherService;
import com.sun.istack.logging.Logger;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
@Slf4j
@RestController
public class TeacherController {

    @Autowired
    private TeacherService teacherService;

    //查询
    @GetMapping("/teacher")
    public Result findAllJson1() {
        return Result.success(teacherService.findAll());
    }


    @DeleteMapping("/teacher/{id}")
    public void deleteTeacher(@PathVariable("id") Integer id) {
        teacherService.deleteTeacher(id);
    }


    @GetMapping("/teachers/{id}")
    public Result teacherfindById(@PathVariable("id") Integer id) { // 注意@PathVariable的使用和参数列表后面的大括号
        return Result.success(teacherService.teacherfindById(id)); // 假设peotService有一个名为peotfindById的方法
    }

    @PutMapping("/teacherup")
    public Result updataTeacher(@RequestBody Teacher teacher) {
        boolean r = teacherService.updataTeacher(teacher);
        if (r) {
            return Result.success();
        } else {
            return Result.error("更新失败");
        }
    }

    @PostMapping("/teacherup")
    public Result insertTeacher(@RequestBody Teacher teacher) {
        boolean result = teacherService.insertTeacher(teacher);
        if (result) {
            return Result.success();
        } else {
            return Result.error("添加失败");
        }
    }

    @GetMapping("/teacher/{page}/{pageSize}")

    public Result findAll(@PathVariable  Integer page,
                          @PathVariable  Integer pageSize){
        Pagebean pageBean =  teacherService.list(page,pageSize);
        return Result.success(pageBean);
    }

}

TeacherMapper

package com.example.teacher.mapper;

import com.example.teacher.pojo.Teacher;
import org.apache.ibatis.annotations.*;

import java.util.List;
@Mapper
public interface TeacherMapper {



    @Select("select * from teacher")
    public List<Teacher> findAll();

    @Delete("delete from teacher where id =#{id}")
    public int deleteTeacher(Integer id);
    @Select("select * from teacher where id=#{id}")
    public Teacher teacherfindById(Integer ID);

    @Update("updata teacher set name=#{name},gender=#{gender},emil=#{emil},department=#{department},password=#{password} where id=#{id}")
    public boolean updataTeacher(Teacher teacher);

    @Insert("insert into teacher(name,gender,emil,department,password)values(#{name},#{gender}.#{emil},#{department},#{password}")
    public int insertTeacher(Teacher teacher);
    @Select("select * from teacher")
    public List<Teacher> list();

}

Service

package com.example.teacher.service.impl;

import com.example.teacher.mapper.TeacherMapper;
import com.example.teacher.pojo.Pagebean;
import com.example.teacher.pojo.Teacher;
import com.example.teacher.service.TeacherService;
import com.github.pagehelper.Page;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class TeacherServiceImpl implements TeacherService {
    @Autowired
    private TeacherMapper teacherMapper;

    @Override
    public List<Teacher> findAll() {
        return teacherMapper.findAll();
    }

    @Override
    public int deleteTeacher(Integer id) {
        return teacherMapper.deleteTeacher(id);
    }

    @Override
    public Teacher teacherfindById(Integer id) {
        return teacherMapper.teacherfindById(id);
    }

    @Override
    public boolean updataTeacher(Teacher teacher) {
        return teacherMapper.updataTeacher(teacher);
    }

    @Override
    public boolean insertTeacher(Teacher teacher) {
        int result = teacherMapper.insertTeacher(teacher);
        return result == 1;
    }


    @Override
    public Pagebean list(Integer page, Integer pageSize) {
        //问：PageHelper.startPage(page, pageSize); 请解释一下

        // 设置分页参数
        PageHelper.startPage(page, pageSize);
        // 执行分页查询
        List<Teacher> teacherList = teacherMapper.list();

        // 获取分页结果
        PageInfo<Teacher> p = new PageInfo<>(teacherList);
        //封装PageBean

        Pagebean pageBean = new Pagebean(p.getTotal(), p.getList());
        return pageBean;

    }
}


package com.example.teacher.service;

import com.example.teacher.pojo.Pagebean;
import com.example.teacher.pojo.Teacher;
import org.springframework.context.annotation.Bean;

import java.util.List;
public interface TeacherService {
    public List<Teacher> findAll();

    public int deleteTeacher(Integer id);

    public Teacher teacherfindById(Integer id);

    public boolean updataTeacher(Teacher teacher);

    public boolean insertTeacher(Teacher teacher);

    public Pagebean list(Integer page, Integer pageSize);

}

login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./js/vue.js"></script>
    <script src="./js/axios-0.18.0.js"></script><script src="js/jquery.min.js"></script>
    <script src="js/element.js"></script>
    <script src="js/axios-0.18.0.js"></script>

    <link rel="stylesheet" href="element-ui/index.css">
    <script src="./element-ui/index.js"></script>
    <link rel="stylesheet"href="reset.css">
    <link rel="stylesheet"href="login.css">
</head>
<body>
<div class="wrap">
    <h1>教师管理系统</h1>
    <form action="" method="">
        <div class="input-group">
            <i class="icon-user fa fa-user"></i>
            <input type="text" name="" class="form-control" placeholder="请输入账号" />
        </div>
        <div class="input-group">
            <i class="icon-user fa fa-lock"></i>
            <input type="text" name="" class="form-control" placeholder="请输入密码" />
        </div>
        <div class="input-group btn-group">
            <button >登录</button>
        </div>
    </form>
    <p>@zm</p>

</div>

</body>
</html>

zm宇宙兜兜
关注
自适应页面的实现方式
weixin_34101229的博客
07-25 4972
页面自适应 自适应是指页面内容自动适应屏幕大小，实现自适应的方法有多种： 1.简易场景实现自适应：浮动、页面居中、元素宽度不写固定而设置百分比自动匹配大小。这样在页面宽度发生变化时，能利用以上特性实现简易的自适应效果。2.如果实际开发中有复杂场景的需求，一般通过编写多套CSS代码，然后用媒体查询技术，让页面根据不同屏幕尺寸来加载不同代码模...
前端页面预览word_前端实现在线预览文档
weixin_39851914的博客
12-19 1万+
前端实现在线预览文档发布时间：2019-06-03 17:22,浏览次数：529<>前端实现在线预览文档最近项目开发中需要实现在线预览Word,Excel,PowerPoint格式的文档，网上查找了很多资源，各说纷纭，但是在一一尝试之后只有使用微软的预览接口才能成功，其他的会出现各种各样的问题，现在说下如何使用微软的预览接口来实现该功能<>通过联机查看 Office 文档地...
Android实现页面跳转
热门推荐
lzh623015455的博客
06-09 3万+
一. Android实现页面跳转有两种方式，一种为.MainActivity跳转；第二种是Relatelayout布局跳转，首先看第一种方式 *1. MainActivity区域设置* public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstance
页面实现自动保存内容功能
牧小七的博客
12-23 5708
实现自动保存功能有3三种方式 大家好，我是音神，最近再写功能的时候，遇到了自动保存内容功能，花了很久的时间，废了很多的心血，终于把它写完了，下面就来跟聊聊我的实现方式，哈哈哈，每次分享知识心里总是很开心，控制不住的开心~ 1.第一种是使用js定时，页面加载完成先将内容保存到浏览器内存；然后编写定时代码，判断现在的内容是否和存储的内容一直，如果不一致就调用后端接口执行自动保存操作。 优点是后端会完整的保存数据 缺点是浏览器内存存储的数据量大 2.第二种也是定时方式实现的，和第一种类似，唯一不一样的地方是浏
SpringBoot整合Thymleaf实现页面静态化
兴趣使然的草帽路飞
09-03 5529
SpringBoot整合Thymleaf实现页面静态化
SSH 实现页面跳转
王如霜
12-04 6654
JSP中使用绝对路径 在.jsp文件中通常要引入.css文件，图片等，若采用相对路径较复杂，一般采用绝对路径${ pageContext.request.contextPath}此句话的作用先获取前面的请求路径，比如       ${ pageContext.request.contextPath}/css就是先获取前面的路径以由首页跳转到注册页面为例：1.修改页面跳转连接<a href="${
layui实现增加页面
ssqkxg的博客
06-09 4327
1、在后台首页面增加一个教室信息列表，代码如下： 结果如下： 2、在教室信息列表中实现增加增加和修改等功能： 注：先编写教室信息代码和教室添加信息代码，放在教室信息的文件夹下 3、实现界面如下： 4、遇到一个问题：Classes没有被定义，如下所示： 目前没有得到解决。 ...
React实现页面之间的跳转
06-08 8556
目录1. 需求说明2. 技术实现3. 代码展示4. 效果展示5. 参考文献 1. 需求说明 目前在学习过程中需要结合自己之前复现的论文算法弄一个人工智能安全平台系统，其中需要做一个前端展示我们的模块，我们点击模块就可以跳转到相应的界面，因为之前做过一个这样的前端展示界面，但是是在别人的项目上改造过来的，很多技术细节都没有搞明白，这次做的就是自己亲自搭建的一个前端界面，所以需要用到关于React页面跳转的知识，下面就介绍下自己实现的这个基础功能吧。 2. 技术实现 功能很简单，就是实现一个界面到另外一个界面之
JS和JSP实现页面跳转的几种方法
qq_41172982的博客
09-25 1万+
一、js如何实现页面跳转 所谓的js页面跳转就是利用javesrcipt对打开的页面ULR进行跳转，如我们打开的是A页面，通过javsrcipt脚本就会跳转到B页面。目前很多垃圾站经常用js跳转将正常页面跳转到广告页面，当然也有一些网站为了追求吸引人的视觉效果，把一些栏目链接做成js链接，但这是一个比较严重的蜘蛛陷阱，无论是SEO人员还是网站设计人员应当尽力避免。 1.常规的JS...
防止恶意刷新页面的Java实现
lgxzzz的博客
12-20 1万+
在很多对安全性要求较高的项目中，需要提供至少一种对整个项目的安全控制方案，常用的比如身份认证、访问控制、安全审计等等。由于设计不合理而导致的安全问题可能会给项目带来非常大的隐患，正是因为如此，安全问题也得到了广大web项目开发者的重视，尤其是在电子政务和电子商务的开发中，更是需要提供一定层次上的安全性要求。 本文的重点在于实现一种防止恶意刷新页面的方法，笔者在实现该功能时，查找了很多资料并且进行...
CSS3实现的页面加载中动画过度特效特效代码
03-20
CSS3实现的页面加载中动画过度特效是一款实现了点击加载页面后出现动画过度效果的代码，本段代码适应于所有网页使用，有需要的朋友们可以前来下载使用，本段代码兼容目前最新的各类主流浏览器，是一款非常优秀的特效...
HTML5页面实现录音功能
11-28
目前基于webikit(谷歌之类的webikit)和Gecko(Firefox 52~57)都可以(不支持苹果移动设备)，测试地址 https://sms.reyo.cn/ 用户名:aa ...我们就是想实现像微信一样的能发送语音的聊天数据(只是我们用h5在网页上实现)：
如何用ajax实现页面自动刷新,Ajax实现页面自动刷新实例解析
weixin_42503223的博客
08-06 1674
Ajax实现页面自动刷新实例解析 内容精选换一换用户已创建桶并上传了网站文件。域名后缀目前支持的范围为2~6个英文大小写字母。开启CDN加速后，可配置网站加速、文件下载加速和点播加速。详细应用场景请参见应用场景。通过CDN实现OBS文件下载加速的详细配置方法请参见最佳实践。CDN加速需收费，具体请参见CDN价格说明。同时OBS提供更加优惠的回源流量包，可以减少CDN加速场景下获取数据时云解析服务支...
IntelliJ IDEA中有什么让你相见恨晚的好用插件?
jakpopc的博客
06-22 5324
我是Jackpop，我们交个朋友吧！IntelliJ IDEA在开发者中的受欢迎程度，想必不用多说。开箱即用、功能强大，备受欢迎。虽然IDEA已经提供了丰富的功能，但是，我们仍然可以通过配置插件来满足个性化的需求。JetBrains Marketplace 上有着大量实用插件，但是，并非每个都称得上优秀。今天，就给大家精选12款非常好用的IDEA插件。命名规范对于编程语言重要，而且不同编程语言有不同的命名规范要求。有的要求驼峰命名，有的要求下划线命名。通过CamelCase这款插件，我们可以在CamelCa
在启动 Spring Boot 项目时，报找不到 slf4j 的错误
m0_75138009的博客
11-12 581
将 pom.xml 中的如下配置替换成这样，排除这个插件。而且 tomcat 的启动信息不知道为什么输出出来了。
Spring Boot框架：网上商城开发新选择
liuxin33445566的博客
11-13 1141
Spring Boot是一种不需要代码生成的一种框架，并且可以不需要配置任何的XML文件就可以，因为Spring Boot里面自带了很多接口，只需要配置不同的接口就会自动的应用并且识别需要的依赖，在配置方面非常的方便，使用起来感觉像没有用到框架的感觉。系统测试一般都是在跟生产环境相似的环境当中运行，程序的功能比如添加功能，删除功能，修改功能等都会使用同样的数据在新系统和现有系统中进行比较，这样做让用户对新系统中的添加，修改，删除等功能能够更好地理解，也能提升用户对新系统的满意度。
Spring Boot 携手 Deeplearning4j：构建高效的企业知识图谱系统
2403_87236754的博客
11-13 1173
是一个用于快速构建独立、生产级别的Spring应用程序的框架。它简化了Spring应用程序的开发过程，提供了自动配置、起步依赖等功能，使得开发者能够更加专注于业务逻辑的实现。本文介绍了如何采用整合j 在自然语言处理领域构建一个企业知识图谱系统。通过对文本数据的分析，提取实体和关系，构建知识图谱，为企业提供更加智能的知识管理和搜索服务。在实现过程中，我们选择了卷积神经网络（CNN）来进行实体识别和关系抽取，并介绍了数据集的格式Maven 依赖代码示例单元测试和预期输出等内容。
[SpB]如何开始使用 Spring Boot？
最新发布
m0_74331272的博客
11-16 510
Spring Boot 简化了 Java 项目开发，你只需要专注于业务逻辑，底层的很多配置和功能由 Spring Boot 自动帮你处理。下面是你如何快速上手 Spring Boot 的步骤，以及如何通过 IDEA 了解 Spring Boot 的功能。虽然 Spring Boot 极大简化了开发流程，但一些功能实现起来还是会遇到一定的难点，尤其是对新手来说。Spring Boot 的上手难点在于理解它背后的自动化和配置逻辑，以及逐步掌握高级功能（如安全、微服务、监控）。
基于Spring Boot的电子商务平台架构
2401_85761762的博客
11-13 610
通过对网上商城系统的开发，让我深刻明白开发一个程序软件需要经历的流程，当确定要开发一个网上商城系统的程序时，我在开发期间，对其功能进行合理的需求分析，然后才是程序软件的功能的框架设计，数据库的实体与数据表设计，程序软件的功能详细界面实现，以及程序的功能测试等进行全方位的细致考虑，虽然在此过程中，各个环节都遇到了大大小小的困难，但是通过对这些问题进行反复的分析，深入的思考，借助各种相关文献资料提供的方法与解决思路成功解决面临的各个问题，最后成功的让我开发的网上商城系统得以正常运行。
jQuery页面翻转特效实现教程
通过选择器和方法的结合使用，可以方便地实现页面翻转特效。 知识点四：HTML5中对于翻转特效的支持 HTML5作为新一代的网页标准，虽然没有直接提供翻转动画的相关标签或属性，但是它加强了对CSS3的支持。利用CSS3的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值