Spring Boot小项目3

修改员工信息

跳转页面

前端

list.html

<a class="btn btn-sm btn-primary" th:href="@{/emp/}+${emp.getId()} " >编辑</a>

把add.html复制一下改成update.html

后端

EmployeeCotroller.java

@GetMapping(/emp/{id})

//去员工的修改页面
public String toUpdateEmp(@PathVariable("id")Integer id,Model model){
    //查出原来的数据
    Employee employee = employeeDao.getEmployeeById(id);

    model.addAtribute("emp",employeeById)
    
    return "emp/update";
}

将修改的信息返回给后台

前端

为了不要修改的时候同一个人但是却把修改的当成新的员工去添加了
把id隐藏域携带过来

<input>: HTML输入元素

type="hidden": 表示这是一个隐藏字段，用户不可见，但会随表单一起提交

name="id": 指定字段的名称为"id"，服务器将通过这个名称来获取值

示例

<form th:action="@{/employees/update}" method="post">
    <input type="hidden" name="id" th:value="${emp.id}">
    
    <label>姓名:</label>
    <input type="text" name="name" th:value="${emp.name}">
    
    <label>邮箱:</label>
    <input type="email" name="email" th:value="${emp.email}">
    
    <button type="submit">更新员工信息</button>
</form>

后端

在那个员工修改页面的方法下面加

@RequestMapping("/updateEmp")
public String update(Employee employee){
    employeeDao.save(employee);
    return "redirect:/emps";
}

删除

前端

<a class="btn btn-sm btn-danger" th:href="@{/delemp/}+${emp.getId()}">删除</a>

后端

    @GetMapping("/delemp/{id}")
    public String deleteEmp(@PathVariable("id")Integer id) {
        employeeDao.deleteEmployeeById(id);
        return "redirect:emps";
    }

404

在templates下面创建error文件夹，然后床架按一个404.html

注销

dashboard.html
<a class="nav-link" th:href="@{/user/logout}">注销</a>

    //注销员工
    public String logout(HttpSession session) {
        session.invalidate(); //把session移除
        return "redirect:/index.html";
    }

一些关于前端的

1. 模板
   1. 别人写好的 可以改成自己需要的
2. 框架
   1. 组件：需要自己动手拼接
      1. Bootstrap，Layui(Github)，semantic-ui
   2. 栅格系统
   3. 导航栏
   4. 侧边栏
   5. 表单

如何快速建立一个web页面

1. 前端搞定
   1. 知道页面长什么样子
   2. 数据
2. 设计数据库
   1. 前端让他能自动运行，独立化工程
3. 数据接口对接
   1. json
4. 前后端联调

有一套自己熟悉的后台模板
x-admin
前端界面
至少能够通过一些前端框架组合出一个网站
1. 首页-index
2. 关于 - about
3. blog
4. post
5. user

数据库调用

对于SQL(关系型数据库)还是NOSQL(非关系型)数据库，SPringBoot底层都是采用SpringData的方式进行统一管理
基本依赖
JDBC API
Mysql Driver
创建application.yaml
URL格式：jdbc:mysql://<主机地址>:<端口>/<数据库名>?<参数>
jdbc:mysql://localhost:3306/your_database_name?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai&useSSL=false
新版的springboot的依赖
这通常通过 pom.xml 文件实现，对于Maven项目，可以通过Spring Initializr来快速创建一个带有JPA依赖的基础项目结构
示例：

  datasource:
    url: jdbc:mysql://localhost:3306/survey_system?useUnicode=true&characterEncoding=utf-8
    username: root
    password: 123123
    driver-class-name: com.mysql.cj.jdbc.Driver
    //空格很重要

/java/Controller/

package Controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;
import java.util.Map;

@RestController
public class JDBCController {

    @Autowired
    JdbcTemplate jdbcTemplate;

    //查询数据库所有信息
    //没有实体类可用Map获取数据里的东西
    @GetMapping("/userlist")
    public List<Map<String,Object>> userList(){
        String sql = "select * from user";
        List<Map<String, Object>> list_maps = jdbcTemplate.queryForList(sql);
        return list_maps;
    }

    @GetMapping("/addUser")
    public String addUser(){
        String sql = "insert into mybatis.user(id,name,pwd) values(4,'小明'，'123456')";
        jdbcTemplate.update(sql);
        return "success";
    }

    @GetMapping("/updateUser")
    public String updateUser(){
        String sql = "update mybatis.user set name=?,pwd=? where id=?";

        //封装
        Object[] objects = new Object[2];
        objects[0] = "小明";
        objects[1] = "zzzz";
        jdbcTemplate.update(sql,objects);

        return "success";
    }

    @GetMapping("/deleteUser/{id}")
    public String deleteUser(@PathVariable("id") int id){
    String sql = "delete from mybatis.user where id=?";
    jdbcTemplate.update(sql,id);
    return "success";
    }
}