Springboot-web-admin(demo)（续）

导航栏导航指向不清晰

就是左边导航栏点开不会停留在当前模块，会直接重置
这种样式是由CSS控制的，缺少nav-active

Simple expressions:（简单表达式）

• （变量表达式）Variable Expressions: ${...}
• （选择变量表达式）Selection Variable Expressions: *{...}
• （消息表达式）Message Expressions: #{...}
• （链接URL表达式）Link URL Expressions: @{...}
• （片段表达式）Fragment Expressions: ~{...}
• 还有很多，在thymeleaf官方

IMPL模拟DAO层

进行增删改查。不连接数据库。

声明属性

用到了lombok方法。

@Data
@AllArgsConstructor
@NoArgsConstructor
@ToString
public class Employee {
    private String id;
    private String name;
    private String Company;
    private String department;
}

先在service添加方法

public interface EmployeeService {
    
    Map<String, Employee> getEmployeeMap();
    
    void addEmployee(Employee employee);
    
    Employee getEmployee(String id);
    
    void deleteEmployee(String id);

}

Impl添加执行方法

@Service
public class EmployeeServiceImpl implements EmployeeService{

    // 假定数据来源于 Dao 层
    private static Map<String, Employee> employeeMap = null;

    static {
        employeeMap = new HashMap<>();
        employeeMap.put("1001",new Employee("1001","abc","eee","JAVA"));
        employeeMap.put("1002",new Employee("1002","abc","eee","保卫处"));
        employeeMap.put("1003",new Employee("1003","abc","eee","教研部"));
        employeeMap.put("1004",new Employee("1004","abc","eee","后勤部"));
        employeeMap.put("1005",new Employee("1005","abc","eee","fgg"));
        employeeMap.put("1006",new Employee("1006","abc","eee","fgg"));
    }

    @Override
    public Map<String, Employee> getEmployeeMap() {
        return employeeMap;
    }

    @Override
    public void addEmployee(Employee employee) {
        employeeMap.put(employee.getId(),employee);
    }

    @Override
    public Employee getEmployee(String id) {
        return employeeMap.get(id);
    }

    @Override
    public void deleteEmployee(String id) {
        employeeMap.remove(id);
    }
}

Controller类

@Controller
public class EmployeeController {
    // 返回到页面需要用到Controller
    // RestController 既返参，也返页面。
    // Controller返回页面

    private EmployeeService employeeService;

    @Autowired
    public void EmployeeController(EmployeeService employeeService) {
        this.employeeService = employeeService;
    }

    @GetMapping("/editableTable")
    public String editableTable(Model model){
        System.out.println("员工集合" + employeeService.getEmployeeMap().toString());
        model.addAttribute("employeeMap",employeeService.getEmployeeMap());
        return "/table/editable_table";
    }

    // 进入添加的页面
    @GetMapping("/addEmployeePage")
    public String addEmployeePage(){
        return "/table/add_employee";
    }

    // 执行添加员工的方法
    @PostMapping("/addEmployee")
    public String addEmployee(Employee employee){
        System.out.println("前端新增员工的信息" + employee.toString());
        // 调用service层方法(service call Dao)，真正执行添加员工的操作
        employeeService.addEmployee(employee);
        return "redirect:/editableTable";
    }

    // 进入修改页面
    @RequestMapping("/updateEmployeePage")
    public String updateEmployeePage(String id, Model model){
        // 前往 map 里查询信息，封装 model 返回前端
        model.addAttribute("employee",employeeService.getEmployee(id));
        return "/table/update_employee";
    }

    @GetMapping("/deleteEmployee")
    public String removeEmployee(@RequestParam("id") String id){
        employeeService.deleteEmployee(id);
        return "redirect:/editableTable";
    }

}

页面thymeleaf方法

查询、更改、删除

<tr class="" th:each="employee : ${employeeMap.values()}">
    <td>[[${employee.id}]]</td>
    <td>[[${employee.name}]]</td>
    <td>[[${employee.Company}]]</td>
    <td class="center">[[${employee.department}]]</td>
    <td><a class="edit" th:href="@{/updateEmployeePage(id=${employee.id})}">Edit</a></td>
    <td><a class="delete" th:href="@{/deleteEmployee(id=${employee.id})}">Delete</a></td>
</tr>

添加

<div class="btn-group">
     <a th:href="@{/addEmployeePage}">
         <button id="editable-sample_new" class="btn btn-primary">
         Add New <i class="fa fa-plus"></i>
         </button>
      </a>
</div>

<form th:action="@{/addEmployee}" method="post">

    <div class="form-group col-md-12">
        <label>ID</label>
        <input type="text" class="form-control" name="id" placeholder="enter 4 digits">
    </div>
    <div class="form-group col-md-12">
        <label>Name</label>
        <input type="text" class="form-control" name="name" placeholder="enter your name">
    </div>

    <div class="form-group col-md-12">
        <label>Company</label>
        <input type="text" class="form-control" name="company" placeholder="enter your company">
    </div>
    <div class="form-group col-md-12">
        <label>Department</label>
        <!-- 下拉框 -->
        <select name="department" class="form-control">
            <option value="">please choose your department</option>
            <option value="教研部">教研部</option>
            <option value="JAVA12">JAVA12</option>
            <option value="保卫处">保卫处</option>
            <option value="后勤部">后勤部</option>
         </select>
     </div>

     <button type="submit" class="btn btn-primary">Submit</button>
</form>

国际化

选择

添加



别的同理

在application.properties里

spring.messages.basename=i18n.messages

然后在前端页面动态写入：th:text="#{login.xxxx}

在Configuration类里声明Bean

    @Bean
    public LocaleResolver localeResolver(){
        return new AppLocaleResolver();
    }

创建AppLocaleResolver接口LocaleResolver

public class AppLocaleResolver implements LocaleResolver {

    // 自定义国际化方法，需要实现LocaleResolver接口
    @Override
    public Locale resolveLocale(HttpServletRequest httpServletRequest) {

        String language = httpServletRequest.getParameter("language");
        Locale locale = Locale.getDefault();
        System.out.println("locale" + locale);

        if (!StringUtils.isEmpty(language)){ // en_US zh_CN
            String[] s = language.split("_"); // 截取请求的语言中的：区域、国家代码
            locale = new Locale(s[0],s[1]); // new 新的区域信息对象并给定区域信息
        }
        System.out.println("locale" + locale);
        return null;
    }

    @Override
    public void setLocale(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Locale locale) {

    }
}