<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TODOLIST</title>
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" type="text/css" href="./bootstrap-3.3.7-dist/css/bootstrap.min.css" />
<script src="./js/vue.js"></script>
<script src="./js/axios.min.js"></script>
</head>
<body>
<div class="container" id="app">
<div class="row">
<div class="col-md-12">
<div class="page-header">
JAVA的TODOLIST
</div>
<div class="col-md-4">
<form class="form form-inline">
<div class="form-group form-group-sm">
<input type="text" class="form-control" v-model="todoclassname" placeholder="请输入分类名称" />
<button type="button" class="btn btn-primary" v-on:click="addtodoclass('0')">添加同级</button>
<button type="button" class="btn btn-info" v-on:click="addtodoclass('1')">添加下级</button>
</form>
<ul class="nav nav-pills nav-stacked">
<li v-for="(item,index) in todoclasses" v-on:click="changetodoclass(item,index)">
<a rel="nofollow" href="#"> {{item.todoclass.name}}</a></li>
</ul>
<div class="col-md-8">
<div class="form-group">
<input type="text" class="form-control" v-model="todotitle" placeholder="请输入待办事项名称" />
<button type="button" class="btn btn-primary" v-on:click="addtodo()">添加</button>
</body>
</html>
<script type="text/javascript">
var vue=new Vue({
el:"#app",
data:{
index:0,
msg:'helloworld',
todoclassname:'',
todotitle:'',
currenttodoclass:{
todoclass:{
id:1,
name:"学习"
},
todos:[
//
}).catch(function(err){
console.error(err);
alert('网络异常');
});
</script>
结果展示：
Controller层:
public class TodoController {
// xxx/todo/listtodoclasses.wst
public TodoVO listtodoclasses(HttpServletRequest req, HttpServletResponse response){
TodoService todoService=new TodoServiceImpl();
List<TodoClassVO> result = todoService.listTodoClasses(null);
TodoVO todoVO=new TodoVO();
todoVO.setTodoclasses(result);
return todoVO;
}
Service层
接口：
public interface TodoService {
/**
获取所有的todo分类
@return
*/
List<TodoClassVO> listTodoClasses(Integer parentid);
保存Todo分类
@param todoClass
Boolean saveTodoClass(TodoClass todoClass);
Boolean saveTodo(Todo todo);
Boolean updateTodo(Integer todoid);
Boolean deletetodo(Integer todoid);
实现接口
public class TodoServiceImpl implements TodoService {
@Override
public List<TodoClassVO> listTodoClasses(Integer parentid) {
SqlSession sqlSession = MybatisUtil.getInstance().getSqlSessionFactory().openSession();
TodoDAO dao=sqlSession.getMapper(TodoDAO.class);
List<TodoClassVO> result=new ArrayList<>();
try{
List<TodoClass> root = dao.listTodoClassesByParentid(parentid);
for(TodoClass tc:root){
TodoClassVO todoClassVO=new TodoClassVO();
todoClassVO.setTodoclass(tc);
todoClassVO.setTodos(dao.listTodosByClassid(tc.getId()));
todoClassVO.setTodoclassvolist(listTodoClasses(tc.getId()));
result.add(todoClassVO);
return result;
}finally {
sqlSession.close();
public Boolean saveTodoClass(TodoClass todoClass) {
int result=0;
try {
result=dao.saveTodoClass(todoClass);
sqlSession.commit();
}finally{
return result>0;
public Boolean saveTodo(Todo todo) {
int result =0;
result= dao.saveTodo(todo);
public Boolean updateTodo(Integer todoid) {
result= dao.updateTodo(todoid);
public Boolean deletetodo(Integer todoid) {
result= dao.deletetodo(todoid);
DAO层
public interface TodoDAO {
List<Todo> listTodosByClassid(@Param("todoclassid") Integer todoclassid);
List<TodoClass> listTodoClassesByParentid(@Param("parentid") Integer parentid);
int saveTodoClass(TodoClass todoClass);
int saveTodo(Todo todo);
int updateTodo(Integer todoid);
int deletetodo(Integer todoid);
配置文件：
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">;
<mapper namespace="com.westos.todo.dao.TodoDAO">
<select id="listTodosByClassid" resultType="com.westos.todo.entity.Todo">
select from todo
<where>
todoclassid=#{todoclassid}
</where>
</select>
<select id="listTodoClassesByParentid" resultType="com.westos.todo.entity.TodoClass">
select from todoclass
<if test="parentid==null">
parentid is NULL
</if>
<if test="parentid!=null">
parentid=#{parentid}
<insert id="saveTodoClass" parameterType="com.westos.todo.entity.TodoClass">
<selectKey keyProperty="id" resultType="int" order="BEFORE">
select max(ifnull(id,0))+1 from todoclass
</selectKey>
insert into todoclass(id,name) VALUES (#{id},#{name});
</insert>
<insert id="saveTodo" parameterType="com.westos.todo.entity.Todo">
select max(ifnull(id,0))+1 from todo
insert into todo(id,title,todoclassid,create_dt,state) VALUES (#{id},#{title},#{todoclassid},#{create_dt},#{state});
<update id="updateTodo" parameterType="java.lang.Integer">
update todo set state=1 where id=#{id}
</update>
<delete id="deletetodo" parameterType="java.lang.Integer">
delete from todo where id=#{id}
</delete>
</mapper>