SpringBoot实现对web项目界面的CRUD、拦截器、国际化思路及流程

SpringBoot实现对web项目界面的CRUD、拦截器、国际化思路及流程

1.找模板了解模板引擎

1.1找一个web项目的模板bootstrap导入到springboot项目下的资源文件具体位置

1.2，用到模本引擎导入相应的坐标，也可了解具体实现方法对于页面 Ctrl+N 搜索方法 ThymeleafProperties 源码

<!--thymeleaf-->
<dependency>   
 <groupId>org.springframework.boot</groupId>   
 <artifactId>spring-boot-starter-thymeleaf</artifactId>
 </dependency>

2.国际化

2.1首页配置:注意点，所有页面的静态资源都需要使用thymeleaf接管;
2.2 国际化 i18n — lnternationalization创建这个文件夹以及相关语言环境

想要替换语言页面的元素都要这么去配置：

2.3我们如果需要在项目中进行按钮自动切换，我们需要自定义一个组件LocaleResolver，加载自己写的组件配置到spring容器@Bean
界面改变语言具体地方

在自定义视图中去加载

效果：

4.拦截器

4.1先定义 再到MyMvcConfig中去封装到bean中
在登录是的具体例子：

4.2账号密码错误的具体提示：

实现判定返回msg是否为空：

5.CRUD系列

整合mybatis的信息
5.1关于查询所有的信息contorller
后台controller的具体代码：

package com.xiaotang.demo.controller;//package com.example.demo.controller;

import com.xiaotang.demo.mapper.DepartmentMapper;
import com.xiaotang.demo.mapper.EmployeeMapper;
import com.xiaotang.demo.pojo.Department;
import com.xiaotang.demo.pojo.Employee;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;

import java.util.Collection;

@Controller
public class EmployeeController {

    @Autowired

    EmployeeMapper employeeMapper;

    @Autowired
    DepartmentMapper departmentMapper;

    // 获取所有员工信息
    @GetMapping("/emps")
    public String getEmployees(Model model){
      Collection<Employee> employees= employeeMapper.getEmployees();
        for (Employee employee : employees) {
            System.out.println(employee);
        }

        model.addAttribute("emps",employees);
        return  "emp/list";

    }
    @GetMapping("/emp")
    public String toAddpage(Model model){
        //查询所有部门的信息，返回给前端数据
        Collection<Department> departments =departmentMapper.getDepartments();
        model.addAttribute("departments",departments);
        return "emp/add";

    }

    @PostMapping("/emp")
    public String save(Employee employee){
        System.out.println("进入到增加");
        System.out.println(employee+"输出添加员工的信息");
    //  employee.setId(6);
//        employee.setLastName("kuangshen");
//        employee.setEmail("qinjiang@qq.com");
//        employee.setGender(1);
    //   employee.setDepartment(101);
//        employee.setBirth(new Date());
        employeeMapper.save(employee);
        return "redirect:/emps";
    }


    // 通过id获得员工信息
    @GetMapping("/get/{id}")
    public Employee get(@PathVariable("id") Integer id){
        return employeeMapper.get(id);
    }

    // 通过id删除员工
    @GetMapping("/delemp/{id}")
    public String delete(@PathVariable("id") Integer id){
        System.out.println("进入到删除");
         employeeMapper.delete(id);

        return "redirect:/emps";
    }

}

前端代码的具体显示方式：

	<main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
					<h2><a  class="btn btn-sm btn-success"  th:href="@{/emp}"> 添加员工</a></h2>
					<div class="table-responsive">
						<table class="table table-striped table-sm">
							<thead>
								<tr>
									<th>id</th>
									<th>lastName</th>
									<th>email</th>
									<th>gender</th>
									<th>department</th>
									<th>birth</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>




							<tr th:each="emp:${emps}">
								<td th:text="${emp.getId()}"></td>
								<td th:text="${emp.getLastName()}"></td>
								<td th:text="${emp.getEmail()}"></td>
								<td th:text="${emp.getGender()==0?'女':'男'}"></td>
								<td th:text="${emp.getDepartment()}"></td>
								<td th:text="${#dates.format(emp.getBirth(),'yyyy-MM-dd HH:mm:ss')}"></td>
								<td>
									<button class="btn btn-sm btn-primary">编辑</button>
									<a th:href="@{/delemp/}+${emp.getId()}" class="btn btn-sm btn-danger">删除</a>
<!--									<a class="btn btn-sm btn-danger" th:href="@{/delete/}+ ${emp.getId()">删除</a>-->

								</td>

							</tr>


							</tbody>
						</table>
					</div>
				</main>

具体的显示效果：