SSM Project Day03-部门/组织管理【数据呈现&删除数据】

准备工作

一、实体对象SysDept

public class SysDept implements Serializable {

private static final long serialVersionUID = 2533357694095578718L;

private Integer id;
private String name;
private Integer parentId;
private Integer sort;
private String note;

private Date createdTime;
private Date modifiedTime;
private String createdUser;
private String modifiedUser;

public Integer getId() {
return id;
}

public void setId(Integer id) {
this.id = id;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public Integer getParentId() {
return parentId;
}

public void setParentId(Integer parentId) {
this.parentId = parentId;
}

public Integer getSort() {
return sort;
}

public void setSort(Integer sort) {
this.sort = sort;
}

public String getNote() {
return note;
}

public void setNote(String note) {
this.note = note;
}

public Date getCreatedTime() {
return createdTime;
}

public void setCreatedTime(Date createdTime) {
this.createdTime = createdTime;
}

public Date getModifiedTime() {
return modifiedTime;
}

public void setModifiedTime(Date modifiedTime) {
this.modifiedTime = modifiedTime;
}

public String getCreatedUser() {
return createdUser;
}

public void setCreatedUser(String createdUser) {
this.createdUser = createdUser;
}

public String getModifiedUser() {
return modifiedUser;
}

public void setModifiedUser(String modifiedUser) {
this.modifiedUser = modifiedUser;
}
}

二、Controller绑定页面return “sys/dept_list”

@Controller
@RequestMapping("/dept/")
public class SysDeptController {

//    绑定页面return "sys/dept_list"
//    为什么此方法类型为String？因为这是绑定一个url
@RequestMapping("doDeptListUI")
public String doDeptListUI(){
return "sys/dept_list";
}
}

三、添加点击事件start.html

$(function(){
/* $("#load-log-id").click(function(){
var url="log/doLogListUI.do";
//load函数为一个特殊的ajax函数
$("#mainContentId").load(url);
}) */
/*$("#load-menu-id").click(function(){
var url="menu/doMenuListUI.do";
//load函数为一个特殊的ajax函数
$("#mainContentId").load(url);
})*/
doLoadUI("load-log-id","log/doLogListUI");
doLoadUI("load-menu-id","menu/doMenuListUI");
doLoadUI("load-dept-id","dept/doDeptListUI");

});
//     发现两个方法大量代码重复，可提取
function doLoadUI(id,url) {
$("#"+id).click(function(){
//load函数为一个特殊的ajax函数
$("#mainContentId").load(url,function () {
//初始化对象 如果有数据，移除
$("#mainContentId").removeData();
});
});
}

检测一下吧：

问题：数据呈现失败。由此，进行数据呈现的代码实现。

服务器端实现数据呈现

一、Dao【这是一个接口】

public interface SysDeptDao {

//一、呈现数据功能
List<Map<String,Object>> findObjects();

}

二、mapper.xml

<select id="findObjects" resultType="map">
--         select c.*,p.name parentName
--         from sys_menus c left join sys_menus p
--         on c.parentId=p.id
select c.*,(
select p.name
from sys_depts p
where c.parentId=p.id
) parentName
from sys_depts c

</select>

三、Service

public interface SysDeptService {

//一、呈现数据功能
List<Map<String,Object>> findObjects();
}

@Service
public class SysDeptServiceImpl implements SysDeptService {

//    绑定Dao
@Autowired
private SysDeptDao sysDeptDao;

//    信息呈现功能 业务逻辑
@Override
public List<Map<String, Object>> findObjects() {
return sysDeptDao.findObjects();
}
}

四、Controller

@Controller
@RequestMapping("/dept/")
public class SysDeptController {

//    Controller绑定Service
@Autowired
private SysDeptService sysDeptService;

//    绑定页面return "sys/dept_list"
//    为什么此方法类型为String？因为这是绑定一个url
@RequestMapping("doDeptListUI")
public String doDeptListUI(){
return "sys/dept_list";
}

@RequestMapping("doFindObjects")
@ResponseBody
public JsonResult doFindObjects(){
return new JsonResult(sysDeptService.findObjects());
}
}

客户端实现-呈现

<script type="text/javascript">
/**
* 初始化表格的列
*/
var columns = [
{
field : 'selectItem',
radio : true
},
{
title : 'ID',
field : 'id',
visible : false,
align : 'center',
valign : 'middle',
width : '80px'
},
{
title : '名称',
field : 'name',
align : 'center',
valign : 'middle',
sortable : true,
width : '130px'
},
{
title : '上级机构',
field : 'parentName',
align : 'center',
valign : 'middle',
sortable : true,
width : '100px'
},
{
title : '排序号',
field : 'sort',
align : 'center',
valign : 'middle',
sortable : true,
width : '70px'
}
];

$(function(){
doGetObjects();
})

//1.页面展示功能
function doGetObjects(){
//1.构建treeTable对象
var tableId="gridTree
4000
Table";
var url="dept/doFindObjects";
var table= new TreeTable(
tableId,
url,
columns //上面定义的columns= =
);
//设置从哪一列展开内容(默认是第一列)
table.setExpandColumn(2);//可以不写
//初始化table对象(底层发ajax异步请求访问服务端)
table.init();

}
</script>

检测一下吧：

CURD篇之删除：

核心业务 查询此部门有没有对应的子元素，有没有员工，有则不允许删除

一、Dao

//    查询此部门有没有对应的子元素，有没有员工，有则不允许删除
int getChildCount(Integer id);        //按id传
//    删除功能
int deleteObjects(Integer id);        //按id传

二、mapper.xml

<!--基于菜单id统计子菜单的个数-->
<select id="getChildCount" resultType="int">
select count(*)
from sys_depts
where parentId=#{id}
</select>

<!--基于子菜单查询后，符合操作规定进行删除-->
<delete id="deleteObject">
delete from sys_depts where id=#{id}
</delete>

三、Service

//    查询此部门有没有对应的子元素，有没有员工，有则不允许删除
//    删除功能
int deleteObject(Integer id);        //按id传

//    删除 有子不删 没子删掉
@Override
public int deleteObject(Integer id) {
//       1.合法性验证
if(id==null||id<=0){
throw new ServiceException("数据不合法："+id);
}
//      2.判定有没有子 ，没有子--删
int childCount=sysDeptDao.getChildCount(id);
if(childCount>0){
throw new ServiceException("此元素有子元素，不可被删除");
}
int rows = sysDeptDao.deleteObject(id);
if(rows==0){
throw new ServiceException("此信息可能已经不存在");
}
return rows;
}

四、Controller

@RequestMapping("doDeleteObject")
@ResponseBody
public JsonResult doDeleteObject(Integer id){
sysDeptService.deleteObject(id);
return new JsonResult("Delete Ok");
}

五、前端页面实现

.input-group-btn
.btn-delete

$(function(){
doGetObjects();    //显示
//删
$(".input-group-btn").on("click",".btn-delete",doDeleteObject);
})
//2.删除操作
function doDeleteObject(){
//	获取选中的id
var id=doGetCheckedId();  //获取选中记录的id值
if(!id){alert("没有选中id！");return;}   //没有获取到id
//	异步提交删除数据
var url="dept/doDeleteObject";  //①地址
//	--传id
var params={"id":id};           //②按什么传？id
//	post                            //③post
$.post(url,params,function (result) {
if(result.state==1){       //如果删除成功
doGetObjects();           //显示数据
alert(result.message);  //响应
}else {
alert(result.message);  //响应
}
})
}
//获取选中记录的id值
function doGetCheckedId() {
//bootstrapTreeTable是treeGrid插件内部定义的jquery扩展函数
//getSelections为扩展函数内部要调用的一个方法

//	1.获取选中记录
var selections=$("#gridTreeTable")  //找的是table-id
.bootstrapTreeTable("getSelections");
//	2.对选中记录进行判定
if(selections.length==1){
return selections[0].id;
}
}

检验一下吧！