1.1 DML操作

资源下载连接

源码
https://download.youkuaiyun.com/download/huang_kuh/12692183

sql
https://download.youkuaiyun.com/download/huang_kuh/12692175

准备：部门、员工、权限、角色管理

加载权限：扫描Controller中的方法，判断是否有注解isAnnotationPresent(RequiredPermission.class)

后台

Controller中，贴@ResponseBody，try/catch操作语句，用Json对象返回操作结果，响应给前端

@ResponseBody
public JSONResult delete(Long id) {
    JSONResult jsonResult = new JSONResult();
    try {
        if (id != null) {
            employeeService.deleteByPrimaryKey(id);
        }
    } catch (Exception e) {
        e.printStackTrace();
        jsonResult.mark("删除失败");
    }
    return jsonResult;
}

JsonResult对象

包含是否success和message字段，mark方法默认失败，传递错误信息参数

@Getter
@Setter
public class JSONResult {
    //是否成功
    private boolean success = true;
    //失败的消息
    private String message;

    //错误信息的标记
    public void mark(String message){
        this.success=false;
        this.message=message;
    }
}

前台

使用ajaxForm保存／更新数据

• 作用：表单提交成功后返回提示信息，此时后台saveOrUpdate方法一定是返回Json对象
• 有submit按钮：$("#表单").ajaxForm(function(data){ });
• 有button按钮：button按钮先绑定点击事件，$("#表单").ajaxSubmit(function(data){ });

ajaxSubmit会阻止原来的提交

artDialg弹框

• 引包的时候选皮肤

<script type="text/javascript" src="/artDialog/jquery.artDialog.js?skin=chrome">
</script>

常用属性
$.dialog({
title:"啊哦",
content:"真的要删除吗？",
icon:"face-smile",
ok: function () {
  $.get(url,{id:id}, function (json) {
  });
},
cancel:true
});

• 属性之间用逗号分隔，未设置content属性会一直显示加载中，支持链式编程

//开始访问后台，查询权限
var dialog =  $.dialog({
     title:"温馨提示",
     icon:"face-smile"
 });
//发送ajax请求，将结果弹框
 $.get("/permission/reload.do",function(json){
     if(json.success){
         dialog.content("加载成功").button({
             name:"朕知道了",
             callback:function(){
                 window.location.reload();
             }
         });
     }
 });

• 点击事件后弹确认框，ok发送请求，后台数据接收后弹结果处理框

三大按钮：input/submit/delete

• input按钮
  统一样式，在commonAll中绑定点击事件，通过data-url属性题跳转指定编辑页面
• 删除按钮
  在commonAll中绑定点击事件，用data-url、data-id传递参数，操作结果弹框Art-Dialog

$(".btn_delete").click(function () {
var id = $(this).data("id");
var url = $(this).data("url");
$.dialog({
  content: "确定删除该数据吗?",
  ok: function () {
      //发送请求执行删除操作
      $.get(url, {id: id}, function (json) {
          //成功之后给用户一个提示信息
          if (json.success) {
              $.dialog({
                  content: "删除成功",
                  ok: function () {
                      window.location.reload();
                  }
              });
          } else {
              $.dialog({
                  content: json.message,
              });
          }
      });
  },
  cancel: true,
});
});

• submit保存按钮
  ajaxForm表单提交，操作结果有ArtDialog弹框提示

保存弹框：
1、引入两个Js文件：
jquery.artDialog.js?skin=chrome
jquery.form.min.js
2、Controller方法必须贴@ResponseBody注解，返回JSON格式数据
3、提交Form表单，有submit按钮
代码实现：
$("#editForm").ajaxForm(function(json) {
    if(json.success){
        $.dialog({
            title:"Hey～",
            content:"保存成功！",
            ok:function(){
                window.location.href="/department/list.do";
            }
        });
    }
}); 

• 编辑按钮，只用普通标签跳转即可