Spring Boot制作个人博客-后端管理（分类管理）

最新推荐文章于 2022-07-31 10:42:30 发布
最新推荐文章于 2022-07-31 10:42:30 发布
阅读量970 收藏
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_48838980/article/details/117875827
版权

文章目录

一、分类管理页面

1、修改types.html

在这里插入图片描述

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head th:replace="admin/_fragments::head(~{::title})">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=debice-width,initial-scale=1.0">
    <title>分类管理</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.css">
    <link rel="stylesheet" href="../../static/css/css.css">
</head>
<body>
<!--导航栏-->
<nav th:replace="admin/_fragments::menu(2)" class="ui inverted attached segment m-padded-tb-mini m-shadow-small" ><!--inverted 反色  attached 圆角变直角-->
    <!--设置log-->
    <div class="ui container">
        <div class="ui inverted secondary stackable menu"><!--stackable（可堆叠效果）会根据页面大小改变显示比例-->
            <h2 class="ui teal header item">管理后台</h2>
            <a href="#" class="m-item item m-mobile-hide"><i class="home icon"></i> 博客</a>
            <a href="#" class="active 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=1010">
                        Beauty
                    </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>
    </div>
</nav>

<!--二级导航-->
<div class="ui attached pointing menu">
    <div class="ui container">
        <div class="right menu">
            <a href="#" th:href="@{/admin/types/input}" class="item">新增</a>
            <a href="#" th:href="@{/admin/types}" class="teal active item">列表</a>
        </div>
    </div>
</div>
<!--中间内容-->
<div class="m-container-small m-padded-tb-large">
    <div class="ui m-container">
        <table class="ui celled table"><!--celled添加网格-->
            <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/types/{id}/input(id=${type.id})}" class="ui mini teal basic button">编辑</a>
                    <a href="#" th:href="@{/admin/types/{id}/delete(id=${type.id})}" class="ui mini red basic button">删除</a>
                </td>
            </tr>
            </tbody>

            <!--底部-->
            <tfoot>
            <tr>
                <th colspan="6">
                    <div class="ui mini floated pagination menu">
                        <a class="icon item">
                            <i class="left chevron icon"></i>
                        </a>
                        <a th:href="@{/admin/types(page=${page.number}-1)}" class="icon item">上一页</a>
                        <a th:href="@{/admin/types(page=${page.number}+1)}" class="icon item">下一页</a>

                        <a class="icon item">
                            <i class="right chevron icon"></i>
                        </a>
                    </div>
                    <a href="#" th:href="@{/admin/types/input}" class="ui mini right floated teal basic button">新增</a>
                </th>
            </tr>
            </tfoot>



        </table>
    </div>
</div>


<!--底部-->
<footer th:replace="admin/_fragments::footer" class="ui inverted vertical segment m-padded-tb-massive">
    <div class="ui center aligned container"><!--center aligned 居中-->
        <div class="ui inverted divided stackable grid"><!--grid会将div分为16份布局   inverted divided模块之间的线条显示-->
            <!--第一板块-->
            <div class="three wide column">
                <div class="ui inverted link list">
                    <div class="item">
                        <img src="../../static/imags/erweima.png" class="ui rounded image" alt="" style="width:100px">
                    </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">关于课余练习的清单</a>
                    <a href="#" class="item">成功要趁早</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:Everyone@162.com</a>
                    <a href="#" class="item">QQ:123456789</a>
                </div>
            </div>

            <!--第四板块-->
            <div class="seven wide column">
                <h4 class="ui inverted header m-text-thin m-text-spaced ">Blog</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 @ 2016-2017 Lirenmi Designed by Lirenmi</p>
    </div>
</footer>

<!--/*/<th:block th:replace="_fragments :: script">/*/-->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.js"></script>
<!--/*/</th:block>/*/-->
<script>
    $('.menu.toggle').click(function (){
        $('.m-item').toggleClass('m-mobile-hide');
    });

    /*用户名下拉*/
    $('.ui.dropdown').dropdown({
        on:'hover'
    });

</script>
</body>
</html>
  • 效果图

在这里插入图片描述

2、修改types-input.html

在这里插入图片描述

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head th:replace="admin/_fragments::head(~{::title})">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=debice-width,initial-scale=1.0">
    <title>分类新增</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.css">
    <link rel="stylesheet" href="../../static/lib/editormd/css/editormd.min.css">
    <link rel="stylesheet" href="../../static/css/css.css">
</head>
<body>
    <!--导航栏-->
    <nav th:replace="admin/_fragments::menu(2)" class="ui inverted attached segment m-padded-tb-mini m-shadow-small" ><!--inverted 反色  attached 圆角变直角-->
        <!--设置log-->
        <div class="ui container">
            <div class="ui inverted secondary stackable menu"><!--stackable（可堆叠效果）会根据页面大小改变显示比例-->
                <h2 class="ui teal header item">管理后台</h2>
                <a href="#" class="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=1010">
                            Beauty
                        </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>
        </div>



    </nav>


    <!--二级导航-->
    <div class="ui attached pointing menu">
        <div class="ui container">
            <div class="right menu">
                <a href="#" class="teal active item">发布</a>
                <a href="#" class="item">列表</a>
            </div>
        </div>
    </div>


    <br>
    <br>
    <br>
    <br>
    <!--中间内容-->
    <div class="m-container-small m-padded-tb-large">
        <div class="ui m-container">
           <form action="#" method="post" class="ui form">
               <!--添加首页地址-->
               <div class="field">
                   <div class="ui left labeled input">
                       <label class="ui teal basic label">名称</label>
                       <input type="text" name="name" placeholder="分类名称">
                   </div>
               </div>


               <!--用于放置错误信息-->
               <div class="ui error message"></div>

               <!--按钮-->
               <div class="ui right aligned container">
                   <button type="button" class="ui button" onclick="window.history.go(-1)">返回</button>
                   <button class="ui teal button">提交</button>
               </div>

           </form>
        </div>
    </div>

    <br>
    <br>
    <br>
    <br>


    <!--底部-->
    <footer th:replace="admin/_fragments::footer" class="ui inverted vertical segment m-padded-tb-massive">
        <div class="ui center aligned container"><!--center aligned 居中-->
            <div class="ui inverted divided stackable grid"><!--grid会将div分为16份布局   inverted divided模块之间的线条显示-->
                <!--第一板块-->
                <div class="three wide column">
                    <div class="ui inverted link list">
                        <div class="item">
                            <img src="../../static/imags/erweima.png" class="ui rounded image" alt="" style="width:100px">
                        </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">关于课余练习的清单</a>
                        <a href="#" class="item">成功要趁早</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:Everyone@162.com</a>
                        <a href="#" class="item">QQ:123456789</a>
                    </div>
                </div>

                <!--第四板块-->
                <div class="seven wide column">
                    <h4 class="ui inverted header m-text-thin m-text-spaced ">Blog</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 @ 2016-2017 Lirenmi Designed by Lirenmi</p>
        </div>


    </footer>


    <!--/*/<th:block th:replace="_fragments :: script">/*/-->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.10/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:'title',
                rules:[{
                    type:'empty',
                    prompt:'标题：请输入博客标题'
                }]
            }
        }
    });

</script>
</body>
</html>
  • 效果图

在这里插入图片描述

二、分类列表分页

1、新建TypeRepository接口

在这里插入图片描述

package net.zjs.lrm.dao;

import net.zjs.lrm.po.Type;
import org.springframework.data.jpa.repository.JpaRepository;

/**
 * 功能：
 * 作者：zjs
 * 日期：2021-06-13
 */
public interface TypeRepository  extends JpaRepository<Type,Long> {
}

2、新建TypeService接口

在这里插入图片描述

package net.zjs.lrm.service;

import net.zjs.lrm.po.Type;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.Pageable;

/**
 * 功能：
 * 作者：zjs
 * 日期：2021-06-13
 */
public interface TypeService {
    Type saveType(Type type);//新增

    Type getType(Long id);//查询

    Page<Type> listType(Pageable pageable);//分页查询

    Type updateType(Long id,Type type);//更新

    void deleteType(Long id);//删除

}

3、新建TypeServceImpl服务实现类

在这里插入图片描述

package net.zjs.lrm.service;

import net.zjs.lrm.NotFoundException;
import net.zjs.lrm.dao.TypeRepository;
import net.zjs.lrm.po.Type;
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 javax.transaction.Transactional;

/**
 * 功能：服务实现类
 * 作者：zjs
 * 日期：2021-06-13
 */
public class TypeServiceImpl implements TypeService{

    @Autowired
    private TypeRepository typeRepository;

    /*增加*/
    @Transactional
    @Override
    public Type saveType(Type type) {
        return typeRepository.save(type);
    }

    /*根据id查询*/
    @Transactional
    @Override
    public Type getType(Long id) {
        return typeRepository.findById(id).orElse(null);
    }

    /*查询全部*/
    @Transactional
    @Override
    public Page<Type> listType(Pageable pageable) {
        return typeRepository.findAll(pageable);
    }

    /*更新*/
    @Transactional
    @Override
    public Type updateType(Long id, Type type) {
        Type t =typeRepository.findById(id).orElse(null);
        if(t==null){
            throw new NotFoundException("不存在该类型！");
        }
        BeanUtils.copyProperties(type,t);
        return typeRepository.save(t);
    }

    /*删除*/
    @Transactional
    @Override
    public void deleteType(Long id) {
        typeRepository.delete(id);
    }
}

4、新建TypeController控制器

在这里插入图片描述

package net.zjs.lrm.web.admin;

import net.zjs.lrm.service.TypeService;
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.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * 功能：
 * 作者：zjs
 * 日期：2021-06-13
 */

@Controller
@RequestMapping("/admin")
public class TypeController {

    @Autowired
    private TypeService typeService;

    @GetMapping("/types")
    public String type(@PageableDefault(size = 10,sort = {"id"},direction = Sort.Direction.DESC) /*@PageableDefault（）根据id进行倒叙的方式排序*/
                                   Pageable pageable, Model model){
        model.addAttribute("page",typeService.listType(pageable));
        return "admin/types";
    }
}

5、查看效果

在这里插入图片描述

在这里插入图片描述

三、分类增，删，改

1、新增

（1）给TypeController.java添加代码

在这里插入图片描述### （2）点击新增按钮
在这里插入图片描述

（3）跳转到新增页面

在这里插入图片描述

（4）修改types-input.html

在这里插入图片描述

（5）运行测试数据提交是否能成功

在这里插入图片描述

（6）添加成功

在这里插入图片描述

2、上下页按钮处理

（1）判断是否为第一页或最后一页，是就不跳转

在这里插入图片描述

  • 效果图

在这里插入图片描述

（2）修改新增条数

在这里插入图片描述

（3）新增4条数据，测试上一页，下一页效果

在这里插入图片描述

  • 点击下一页

在这里插入图片描述

  • 此按钮没作用

在这里插入图片描述

（4）修改其代码实现动作

在这里插入图片描述

（5）添加新增成功后消息提示

在这里插入图片描述

（6）接收添加成功与否的消息

在这里插入图片描述

（7）添加可关闭

在这里插入图片描述

（4）最终效果

在这里插入图片描述

  • 点击按钮关闭

在这里插入图片描述

3、添加数据重复验证、非空验证

在这里插入图片描述

（1）添加后端校验

  • 注意：NotBlank不要引用错误

在这里插入图片描述

  • 修改TypeController

在这里插入图片描述

  • types-input.html添加代码

在这里插入图片描述

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/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="https://cdn.jsdelivr.net/semantic-ui/2.2.4/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(2)"  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="mini home icon"></i>博客</a>
            <a href="#" class=" m-item item m-mobile-hide"><i class="mini idea icon"></i>分类</a>
            <a href="#" class="m-item item m-mobile-hide"><i class="mini 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/types/input}" class="active item">新增</a>
            <a href="#" th:href="@{/admin/types}" 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="${type}" th:action="*{id}==null ? @{/admin/types} : @{/admin/types/{id}(id=*{id})} "  class="ui form">
            <input type="hidden" name="id" th:value="*{id}">
            <div class=" 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 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>
<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/imags/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 m-text-thin">用户故事（User Story）</a>
                    <a href="#" class="item m-text-thin">用户故事（User Story）</a>
                    <a href="#" class="item m-text-thin">用户故事（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 m-text-thin">Email：lirenmi@163.com</a>
                    <a href="#" class="item m-text-thin">QQ：865729312</a>
                </div>
            </div>
            <div class="seven wide column">
                <h4 class="ui inverted header m-text-thin m-text-spaced ">Blog</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 © 2016 - 2017 Lirenmi Designed by Lirenmi</p>
    </div>

</footer>

<!--/*/<th:block th:replace="_fragments :: script">/*/-->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/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>
  • 效果

在这里插入图片描述

（2）数据重复校验

在这里插入图片描述

  • 修改TypeRepository

在这里插入图片描述

  • 添加名称查询

在这里插入图片描述

  • 添加重复校验

在这里插入图片描述

  • 效果

在这里插入图片描述

（3）编辑按钮功能

在这里插入图片描述

  • 效果

在这里插入图片描述

在这里插入图片描述

（4）添加修改方法

在这里插入图片描述

  • 添加代码

在这里插入图片描述

  • 效果

在这里插入图片描述
修改成功
在这里插入图片描述

（5）删除按钮功能

在这里插入图片描述

  • 效果

在这里插入图片描述

在这里插入图片描述

（6）点击新增，列表可进行跳转

在这里插入图片描述

  • 效果

在这里插入图片描述

qq_48838980
关注
SpringBoot个人博客开发（十三）----功能实现2.分类管理
ce121的博客
07-04 311
功能实现2.博客新增。 此时登录和登出以及简单非法访问控制已经弄好了，但是上一章忘记放效果图了。这一章在这里放一下。此时登录没问题了，该做分类新增了。 由于之前后台页面只弄了博客管理博客新增后来做了登录和登录成功页。所以接下来按页面重构后的博客的头部来弄一个分类管理和分类新增，我已经将这两个页面弄完了，点击跳转什么的后面控制器来负责 types.html <!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org/
【SpringBoot搭建个人博客】- 后台登录，程序员Java基础案例教程
澎湖Java架构师的博客
12-23 730
欢迎给star以鼓励(^_−)☆ 本文将从MVC架构、MD5加密、登录拦截器来讲述个人博客系统的后台登录实现 MVC架构 后台开发采用的是MVC架构，MVC 全名是 Model View Controller，是模型(model)－视图(view)－控制器(controller)的缩写， 是一种用于设计创建 Web 应用程序表现层的模式。MVC 中每个部分各司其职： Model（模型）： 通常指的是我们的数据模型，一般情况下用于封装数据 View（视图）： 通常指 jsp 或者 html，一般...
Spring Boot开发个人博客--后台分类管理
weixin_38172229的博客
07-02 452
—— 本文转自onestar：【SpringBoot搭建个人博客】- 分类管理（六） 本文将从MVC架构，分类的新增、编辑修改、删除来讲述SpringBoot搭建个人博客的分类管理 1.持久层接口 正常情况下自己写代码的时候是一个一个功能来完成，为了方便书写，这里就将分类管理中所有功能一次列出来。 分析： 问：持久层需要哪些接口？ 答：分类管理有查询分类、保存分类、修改编辑分类、删除分类、因此需要有getAllType、saveType、updateType、deleteType接口 问：分类可是会涉及到
SpringBoot开源项目个人博客——(6)分类管理
qq_45678967的博客
05-30 349
SpringBoot开源项目个人博客——(6)分类管理
【项目实战】个人博客系统(3)——分类管理
历乱的日记簿
07-15 454
一、分页管理的各个模块 查询分类：查询所有分类、修改分类时根据分类名称查询分类、跳转修改分类页面时根据id查询分类。 新增保存分类 修改编辑分类 删除分类 二、分页管理在三层架构中的分工 1、TypeDao @Mapper @Repository public interface TypeDao { //新增保存分类 int saveType(Type type); //根据id查询分类 Type getType(Long id); //查询所有分类
Spring Boot制作个人博客-后端管理（登录）
qq_48838980的博客
06-11 5559
文章目录一、构建页面1、构建登录页面2、构建后台管理页面3、复制_fragments二、实现登录1、创建用户接口2、创建用户实现类3、创建UserRepository4、初始化一个用户5、访问：http://localhost:8080/admin6、输入用户名密码没有反应，更改login.html代码7、登录成功8、添加非空验证9、添加错误提示10、效果 一、构建页面 1、构建登录页面 <!DOCTYPE html> <html lang="en"> <head>
基于 Spring boot 的个人博客系统设计与实现（源码+数据库）.zip
06-22
基于 Spring boot 的个人博客系统设计与实现（源码+数据库）。介绍 基于SpringBoot的个人博客系统 ； 包含用户端-管理端 实现 博客展示、 归档、友链、关于等用户端功能； 实现登录、仪表盘、发布文章、文章管理...
Elasticsearch---spring-boot-starter-data-elasticsearch整合攻略详解
m0_67393295的博客
07-31 1415
首先要确保自己引入的spring-boot-starter-data-elasticsearch版本与elasticsearch一直，通常情况下会遇到使用了如，spring-boot-dependencies，parent等版本依赖管理导致es版本不对应的情况。
基于Spring Boot框架的趣报名小程序后端管理系统.zip
最新发布
09-06
基于Spring Boot框架的趣报名小程序后端管理系统 项目概述 趣报名小程序后端管理系统是一个基于Spring Boot框架开发的项目，旨在为趣报名小程序提供后端支持。该项目包含了丰富的功能模块，如活动管理、用户管理...
个人博客后台系统分类管理
小生不才的博客
08-29 624
1.在admin下添加分类页面types.html
Spring Boot制作个人博客-后端管理（标签管理）
qq_48838980的博客
06-15 473
文章目录一、标签管理页面1、拷贝types.html做修改2、拷贝types-input.html做修改二、标签列表分页1、TagService接口2、TagServiceImpl服务实现类3、TagRepository接口4、TagController控制器三、测试效果 一、标签管理页面 标签管理与分类管理为相同的做法，以下都是拷贝分类管理的相关代码作更改实现的效果 1、拷贝types.html做修改 <!DOCTYPE html> <html lang="en" xmlns:th
（十八）博客--分类管理（1）
weixin_48102099的博客
04-18 283
1.概述 2.建一个分类页面 <!-- -----二级导航----- --> <div class="ui container"> <div class="ui menu"> <div class="right menu"> <a href="#" class="item">发布</a> <a href="#" class="ui active item">列表</a>
04-分类管理页面的开发
qq_54591711的博客
07-22 160
后台分类管理页面的开发
新闻分类管理页面源码
weixin_30794851的博客
03-13 352
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NewsTypeList.aspx.cs" Inherits="zj123.UI.images.Expro.NewsTypeList" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN...
项目开发之分类管理的分页
hardtomakeaname的博客
12-09 145
很简单的啊 1. .xml文件中 <mapper namespace=""> <select id="list" resultType="Category"> select * from category order by id desc <if test="start!=null and count!=null"> lim...
全栈项目-乐优商场-分类管理-前端-页面渲染
gaogzhen的博客
08-18 468
全栈项目-乐优商场-分类管理-前端-页面渲染 目录 文章目录1、效果分析2、组件3、页面实现***后记*** ： 内容 1、效果分析 效果图示1-1： 2、组件 根据效果图所示，需要用到el-card,el-breadcrumb,vue-table-with-tree-grid,el-pagination组件。组件详细使用参考本人写的相关博文或者自行搜索查阅相关文档。 3、页面实现 源代码3-1： <!-- --> <template> <d
SSM实训： 14、分类管理
qq_46300856的博客
07-05 201
文章目录Spring Boot开发小而美的个人博客-李哥一、分类管理页面(+标签管理页面)二、分类列表分页三、分类新增、修改、删除 Spring Boot开发小而美的个人博客-李哥 一、分类管理页面(+标签管理页面) 二、分类列表分页 三、分类新增、修改、删除 ...
SpringBoot个人博客后台管理中分类管理-----学习15
uoprewqsnh的博客
06-16 443
文章目录一、思维导图二、分类管理1、分类管理页面（1）、创建分页页面（2）、创建新增页面2、分类列表分页（1）、创建分页接口（2）、创建实现分页的结果（3）、创建数据库操作（4）、创建外部层次3、分类新增、修改、删除（1）、返回新增页面（2）、运行查看效果（3）、判断非空（4）、添加提示（5）、判断新增是否添加成功（6）、运行查看效果（7）、添加删除（8）、运行查看效果 一、思维导图 二、分类管理 分类管理页面 分类列表分页 分类新增、修改、删除 1、分类管理页面 （1）、创建分页页面 （2）、创
十七、网站分类列表页面设计
jiangjingxuan的博客
01-25 4328
上一节我们完成了高大上的主页，并展示了每个分类，那么按照常理，用户点击分类项怎么能展示出这一分类的博客列表呢？我们这一节来制作分类列表页 请尊重原创，转载请注明来源网站www.shareditor.com以及原始链接地址 创建一些文章   首先，为了能展示我们的效果，我们先在后台创建几篇文章，例如如下：       安装分页插件   列表性质的页面一般都需要做分页处理，这个
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值