文章目录
一、标签管理(一)复制types.html修改 - tags.html(二)复制types-input.html修改 - tags-input.html(三)TagService接口(四)TagServiceImpl实现类(五)TagRepository接口(六)TagController控制器(七)运行效果一、标签管理
(一)复制types.html修改 - tags.html
<!DOCTYPE html><html lang="en" xmlns:th="/1999/xhtml"><head th:replace="admin/_fragments :: head(~{::title})"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>标签管理</title><link rel="stylesheet" href="/npm/semantic-ui@2.4.2/dist/semantic.min.css"><link rel="stylesheet" href="../../static/css/me.css"></head><body><!--导航--><nav th:replace="admin/_fragments ::menu(3)" class="ui inverted attached segment m-padded-tb-mini m-shadow-small"><div class="ui container"><div class="ui inverted secondary stackable menu"><h2 class="ui teal header item">管理后台</h2><a href="#" class="active m-item item m-mobile-hide"><i class="home icon"></i>博客</a><a href="#" class="m-item item m-mobile-hide"><i class="idea icon"></i>分类</a><a href="#" class="m-item item m-mobile-hide"><i class="tags icon"></i>标签</a><div class="right m-item m-mobile-hide menu"><div class="ui dropdown item"><div class="text"><img class="ui avatar image" src="https://unsplash.it/100/100?image=1005">袁晓晓</div><i class="dropdown icon"></i><div class="menu"><a href="#" class="item">注销</a></div></div></div></div></div><a href="#" class="ui menu toggle black icon button m-right-top m-mobile-show"><i class="sidebar icon"></i></a></nav><div class="ui attached pointing menu"><div class="ui container"><div class="right menu"><a href="#" th:href="@{/admin/tags/input}" class="item">新增</a><a href="#" th:href="@{/admin/tags}" class="teal active item">列表</a></div></div></div><!--中间内容--><div class="m-container-small m-padded-tb-big"><div class="ui container"><div class="ui success message" th:unless="${#strings.isEmpty(message)}"><i class="close icon"></i><div class="header">提示:</div><p th:text="${message}">恭喜,操作成功!</p></div><table class="ui celled table"><thead><tr><th></th><th>名称</th><th>操作</th></tr></thead><tbody><tr th:each="type,iterStat : ${page.content}"><td th:text="${iterStat.count}">1</td><td th:text="${type.name}">刻意练习清单</td><td><a href="#" th:href="@{/admin/tags/{id}/input(id=${type.id})}" class="ui mini teal basic button">编辑</a><a href="#" th:href="@{/admin/tags/{id}/delete(id=${type.id})}" class="ui mini red basic button">删除</a></td></tr></tbody><tfoot><tr><th colspan="6"><div class="ui mini pagination menu" th:if="${page.totalPages}>1"><a th:href="@{/admin/tags(page=${page.number}-1)}" class="item" th:unless="${page.first}">上一页</a><a th:href="@{/admin/tags(page=${page.number}+1)}" class="item" th:unless="${page.last}">下一页</a></div><a href="#" th:href="@{/admin/tags/input}" class="ui mini right floated teal basic button">新增</a></th></tr></tfoot></table></div></div><br><br><!--底部footer--><footer th:replace="admin/_fragments :: footer" class="ui inverted vertical segment m-padded-tb-massive"><div class="ui center aligned container"><div class="ui inverted divided stackable grid"><div class="three wide column"><div class="ui inverted link list"><div class="item"><img src="../../static/images/wechat.jpg" class="ui rounded image" alt="" style="width: 110px"></div></div></div><div class="three wide column"><h4 class="ui inverted header m-text-thin m-text-spaced">最新博客</h4><div class="ui inverted link list"><a href="#" class="item">用户故事(User Story)</a><a href="#" class="item">用户故事(User Story)</a><a href="#" class="item">用户故事(User Story)</a></div></div><div class="three wide column"><h4 class="ui inverted header m-text-thin m-text-spaced">联系我</h4><div class="ui inverted link list"><a href="#" class="item">Email: listen@</a><a href="#" class="item">QQ: 2293432330</a></div></div><div class="seven wide column"><h4 class="ui inverted header m-text-thin m-text-spaced">Lirenmi</h4><p class="m-text-thin m-text-spaced m-opacity-mini">这是我的个人博客,会分享关于编程、写作、思考相关的任何内容,希望可以给来到这儿的人有所帮助...</p></div></div><div class="ui inverted section divider"></div><p class="m-text-thin m-text-spaced m-opacity-tiny">Copyright@-Lirenml Designed by Lirenmi</p></div></footer><!--/*/<th:block th:replace="_fragments :: script">/*/--><!--加/*/静态页面注释有效,动态页面注释无效--><script src="/npm/jquery@3.2/dist/jquery.min.js"></script><script src="/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script><!--/*/</th:block>/*/--><script>$('.menu.toggle').click(function () {$('.m-item').toggleClass('m-mobile-hide');});$('.ui.dropdown').dropdown({on : 'hover'});//消息提示关闭初始化$('.message .close').on('click', function() {$(this).closest('.message').transition('fade')});</script></body></html>
(二)复制types-input.html修改 - tags-input.html
<!DOCTYPE html><html lang="en" xmlns:th="/1999/xhtml"><head th:replace="admin/_fragments :: head(~{::title})"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>标签新增</title><link rel="stylesheet" href="/npm/semantic-ui@2.4.2/dist/semantic.min.css"><link rel="stylesheet" href="../../static/lib/editormd/css/editormd.min.css"><link rel="stylesheet" href="../../static/css/me.css"></head><body><!--导航--><nav th:replace="admin/_fragments ::menu(3)" class="ui inverted attached segment m-padded-tb-mini m-shadow-small"><div class="ui container"><div class="ui inverted secondary stackable menu"><h2 class="ui teal header item">管理后台</h2><a href="#" class="active m-item item m-mobile-hide"><i class="home icon"></i>博客</a><a href="#" class="m-item item m-mobile-hide"><i class="idea icon"></i>分类</a><a href="#" class="m-item item m-mobile-hide"><i class="tags icon"></i>标签</a><div class="right m-item m-mobile-hide menu"><div class="ui dropdown item"><div class="text"><img class="ui avatar image" src="https://unsplash.it/100/100?image=1005">袁晓晓</div><i class="dropdown icon"></i><div class="menu"><a href="#" class="item">注销</a></div></div></div></div></div><a href="#" class="ui menu toggle black icon button m-right-top m-mobile-show"><i class="sidebar icon"></i></a></nav><div class="ui attached pointing menu"><div class="ui container"><div class="right menu"><a href="#" th:href="@{/admin/tags/input}" class="active item">新增</a><a href="#" th:href="@{/admin/tags}" class="teal item">列表</a></div></div></div><!--中间内容--><div class="m-container-small m-padded-tb-big"><div class="ui container"><form action="#" method="post" th:object="${tag}" th:action="*{id}==null ? @{/admin/tags} : @{/admin/tags/{id}(id=*{id})}" class="ui form"><input type="hidden" name="id" th:value="*{id}"><div class="required field"><div class="ui left labeled input"><label class="ui teal basic label">名称</label><input type="text" name="name" placeholder="分类名称" th:value="*{name}"></div></div><div class="ui mini error message"></div><!--/*/<div class="ui negative message" th:if="${#fields.hasErrors('name')}"><i class="close icon"></i><div class="header">验证失败</div><p th:errors="*{name}">提交信息不符合规则</p></div>/*/--><div class="ui right aligned container"><button type="button" class="ui button" onclick="window.history.go(-1)">返回</button><button class="ui teal submit button">提交</button></div></form></div></div><br><br><br><br><br><!--底部footer--><footer th:replace="admin/_fragments :: footer" class="ui inverted vertical segment m-padded-tb-massive"><div class="ui center aligned container"><div class="ui inverted divided stackable grid"><div class="three wide column"><div class="ui inverted link list"><div class="item"><img src="../../static/images/wechat.jpg" class="ui rounded image" alt="" style="width: 110px"></div></div></div><div class="three wide column"><h4 class="ui inverted header m-text-thin m-text-spaced">最新博客</h4><div class="ui inverted link list"><a href="#" class="item">用户故事(User Story)</a><a href="#" class="item">用户故事(User Story)</a><a href="#" class="item">用户故事(User Story)</a></div></div><div class="three wide column"><h4 class="ui inverted header m-text-thin m-text-spaced">联系我</h4><div class="ui inverted link list"><a href="#" class="item">Email: listen@</a><a href="#" class="item">QQ: 2293432330</a></div></div><div class="seven wide column"><h4 class="ui inverted header m-text-thin m-text-spaced">Lirenmi</h4><p class="m-text-thin m-text-spaced m-opacity-mini">这是我的个人博客,会分享关于编程、写作、思考相关的任何内容,希望可以给来到这儿的人有所帮助...</p></div></div><div class="ui inverted section divider"></div><p class="m-text-thin m-text-spaced m-opacity-tiny">Copyright@-Lirenml Designed by Lirenmi</p></div></footer><!--/*/<th:block th:replace="_fragments :: script">/*/--><!--加/*/静态页面注释有效,动态页面注释无效--><script src="/npm/jquery@3.2/dist/jquery.min.js"></script><script src="/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script><!--/*/</th:block>/*/--><script>$('.menu.toggle').click(function () {$('.m-item').toggleClass('m-mobile-hide');});$('.ui.dropdown').dropdown({on : 'hover'});$('.ui.form').form({fields : {title: {identifier : 'name',rules : [{type :'empty',prompt : '请输入分类名称'}]}}});</script></body></html>
(三)TagService接口
(四)TagServiceImpl实现类
package net.lbj.service;import net.lbj.NotFoundException;import net.lbj.dao.TagRepository;import net.lbj.po.Tag;import org.springframework.beans.BeanUtils;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.data.domain.Page;import org.springframework.data.domain.Pageable;import org.springframework.stereotype.Service;import org.springframework.transaction.annotation.Transactional;/*** 0630*/@Servicepublic class TagServiceImpl implements TagService{@Autowiredprivate TagRepository tagRepository;@Transactional@Overridepublic Tag saveTag(Tag tag) {return tagRepository.save(tag);}@Transactional@Overridepublic Tag getTag(Long id) {return tagRepository.findById(id).orElse(null);}@Overridepublic Tag getTagByName(String name) {return tagRepository.findByName(name);}@Transactional@Overridepublic Page<Tag> listTag(Pageable pageable) {return tagRepository.findAll(pageable);}@Transactional@Overridepublic Tag updateTag(Long id, Tag tag) {Tag t = tagRepository.findById(id).orElse(null);if (t == null) {throw new NotFoundException("不存在该标签");}BeanUtils.copyProperties(tag,t);return tagRepository.save(t);}@Transactional@Overridepublic void deleteTag(Long id) {tagRepository.deleteById(id);}}
(五)TagRepository接口
(六)TagController控制器
package net.lbj.web.admin;import net.lbj.po.Tag;import net.lbj.service.TagService;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.data.domain.Pageable;import org.springframework.data.domain.Sort;import org.springframework.data.web.PageableDefault;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.validation.BindingResult;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.servlet.mvc.support.RedirectAttributes;import javax.validation.Valid;/*** 0630*/@Controller@RequestMapping("/admin")public class TagController {@Autowiredprivate TagService tagService;@GetMapping("/tags")public String tags(@PageableDefault(size = 3,sort = {"id"},direction = Sort.Direction.DESC)Pageable pageable, Model model) {model.addAttribute("page",tagService.listTag(pageable));return "admin/tags";}@GetMapping("/tags/input")public String input(Model model) {model.addAttribute("tag", new Tag());return "admin/tags-input";}@GetMapping("/tags/{id}/input")public String editInput(@PathVariable Long id, Model model) {model.addAttribute("tag", tagService.getTag(id));return "admin/tags-input";}@PostMapping("/tags")public String post(@Valid Tag tag, BindingResult result, RedirectAttributes attributes) {Tag tag1 = tagService.getTagByName(tag.getName());if (tag1 != null) {result.rejectValue("name","nameError","不能添加重复的分类");}if (result.hasErrors()) {return "admin/tags-input";}Tag t = tagService.saveTag(tag);if (t == null ) {attributes.addFlashAttribute("message", "新增失败");} else {attributes.addFlashAttribute("message", "新增成功");}return "redirect:/admin/tags";}@PostMapping("/tags/{id}")public String editPost(@Valid Tag tag, BindingResult result,@PathVariable Long id, RedirectAttributes attributes) {Tag tag1 = tagService.getTagByName(tag.getName());if (tag1 != null) {result.rejectValue("name","nameError","不能添加重复的分类");}if (result.hasErrors()) {return "admin/tags-input";}Tag t = tagService.updateTag(id,tag);if (t == null ) {attributes.addFlashAttribute("message", "更新失败");} else {attributes.addFlashAttribute("message", "更新成功");}return "redirect:/admin/tags";}@GetMapping("/tags/{id}/delete")public String delete(@PathVariable Long id,RedirectAttributes attributes) {tagService.deleteTag(id);attributes.addFlashAttribute("message", "删除成功");return "redirect:/admin/tags";}}
(七)运行效果
登录后点击标签点击新增按钮实现跳转
不输数据直接点击提交,弹出提示
输入重复的数据弹出提示信息
新增成功弹出提示
编辑按钮实现修改数据功能
删除按钮,实现删除数据功能