当前课程知识点：软件开发实训--动态网站开发 > 10 分类管理实现 > 10.4分类删除实现 > 10.4.1分类删除实现
同学你好
欢迎回到软件开发实训课堂
上节课我们实现了分类数的功能
但是对于编辑
我们用的是一个大的按钮
这节课我们把它换成小图片
同时来实现它的删除功能
那么要换小图片
我们首先得去找一个小图片
让美工帮你处理
或者你去从网上去下载漂亮的小图片过来
好
我们首先在static下面新建一个文件夹
就叫做images
然后把我们找到的图片给他粘上
好
粘到我们这里来
这样我们就有了两个小图片
现在我们把它换掉
找到我们的碎片
打开我们的edittype文件
找到碎片在这
然后看编辑处
把回车一下
好
把文字编辑去掉
换成小图片AMGSrC等于
注意让它动态计算我们的路径
LT等于edit
我们说编辑
然后这里加上一个前缀
THSRC等于获取路径
用圈不是用刀了
然后斜杠images下面的
icon-edit.png
这样我们就把它的路径拿到了
同样的对删除来讲
我们直接把粘到这里
alt改为Delete
fail
然后删除的路径我们给它改成
Delete
type这实际上我们现在还没有路径
但是没有关系
我们先把它界面先填补上
保存
然后我们去浏览器查看一下
看看换完图片的效果
很显然我们没有去掉样式
我们把超链接的样式给它去掉
不要让他以按钮的形式显示了
直接显示小图片就可以了
打开浏览器再次刷新我们的左边区域有点窄
这里可以加上一个样式
如果我们在ul上加一个样式的话
那么它下面的所有的ul都会有样式了
这样的话它的效果就没有层次感了
好
如果我们去改变ul的样式
我们可以给他加一些区别
我们这里边通过一个level来给他区别一下
它是几级在后边
所有的我们都给它输入一
而前面给它输入零就可以了
好
我们来看一下
说th if
我们可以直接class
直接class
说如果我们这里可以这样写
level等于0
那么我们可以输出一个消息
我们看一下它的class的名称
unstyled
好
样式
名称给它拿到
然后如果说等于0
就输出样式
不等于0
这样我们把第一级就往左移了
其他的级别他不会去变
这样的话就能够节约一些空间出来
我们刷新界面后看一下有一个错误发生
模板解析出现了问题
这个解析是哪里出现问题
我们可以往下看
有一个level
说我们有俩参数
但实际上只提供了一个参数
那就是在调用的时候
我们没有给他提供
加上
好了
这样我们就能够很准确的显示起来
这些数据看起来就比较漂亮
当然你也可以把左边再加宽一个列
这样内容就放
这就更显得更好了
这样我们点击就可以去编辑它
而点击删除我们就可以删除它
好
我们还没有实现deleteType这个路径
现在我们来实现delete操作
打开我们的
内容类型控制器
删除我们用Mapping请求就可以了
deletetype
并且带一个tid
方法名就叫delete就可以了
它的第一个参数来自路径
model
如果我们删除成功了
我们先给它来一个OK
返回依然是redirect:/edittype
因为删了我们就直接返回新增的界面就可以了
这个ID是不能为空的
ID为空它无法去访问
所以我们可以直接调用服务contentType service.delete
这有个Byid
好
我们来看一下是否能够删除成功
我们先回到原界面
需要登录
edittype
我们把新闻中心11给它删掉
确实删了
但是没有任何提示
这是很危险的
你要不小心把这个点击了怎么办
好
我们增加提示
在删除这里
我们增加一个class
我们把它叫delete
btn删除按钮
然后我们在下边的脚本里给它加上
操作
当它被点击时执行这个函数
首先进行确认
confirm
确定要删除吗
这个操作无法恢复
如果说她需要删除
那么我们就返回true就可以了
否则的话我们返回false
那么实际上还
可以更简洁的去写这里边更简单的写法
是这样子的
直接return一下就行
因为它返回的就是真和假
好
我们再来看
当我们点击删除按钮时
我们取消他没有动作
看一下他不做任何动作
我们加一个
然后把它删除
这就可以了
好
有关内容类型的相关操作
咱们就介绍到这
这个界面美化还需要你去做
最后我们再把链接给它加到我们的主页
这是静态的
我们要找到我们的模板index
把它加上
这里叫内容分类管理
这样写
然后他直接进入edit
就可以了
我们重新login
进来后我们点击内容分类就可以
进行编辑了
好
有关分类的所有功能我们就实现完成了
下节课我们再见
-1.1课程介绍
--1.1.3随堂测试
-1.2网站需求分析
--1.2.4随堂测试
-1.3网站首页分析
--1.3.3随堂测试
-1.4导航菜单分析
--1.4.3随堂测试
-1.5内容区域分析
--1.5.3随堂测试
-1.6内容副页面分析
-1.7编写需求文档
-2.1后端页面总体分析
--2.1.3随堂测试
-2.2用户管理功能设计
--2.2.3随堂测试
-2.3内容与分类功能分析
--2.3.3随堂测试
-2.4网站配置功能设计
--2.4.4随堂测试
-2.5数据库及表结构分析
-总体设计文档
-3.1前台模板约定
--3.1.3随堂测试
-3.2网站配置接口设计
--3.2.3随堂测试
-3.3菜单接口设计
--3.3.3随堂测试
-3.4内容接口设计
--3.4.3随堂测试
-3.5幻灯片接口设计
--3.5.3随堂测试
-补充设计文档
-4.1用户管理功能设计
--4.1.3随堂测试
-4.2菜单管理功能设计
--4.2.3随堂测试
-4.3内容管理功能设计
--4.3.3随堂测试
-4.4网站配置信息设计
--4.4.3随堂测试
-完成设计文档
-4.6随堂测试
-5.1开发环境搭建
--5.1.2随堂测试
-5.2Web前端环境搭建
-5.3创建用户实体
--5.3.2随堂测试
-5.4用户实体表创建与初始化
--5.4.2随堂测试
-5.5用户数据访问接口实现
--5.5.2随堂测试
-5.6环境搭建问题
-6.1用户服务层接口实现
--6.1.2随堂测试
-6.2用户列表和编辑控制器实现
--6.2.2随堂测试
-6.3用户存储和删除控制器实现
-6.4用户添加、编辑界面实现
-6.5用户管理添加用户调试
-7.1用户查询模板实现
--7.1.2随堂测试
-7.2用户信息编辑的实现
-7.3单个用户删除实现
-7.4多个用户删除实现
-8.1用户列表分页基本实现
-8.2用户列表查询结果分页实现
-8.3通用日期处理
-8.4整型日期处理
--8.4.2随堂测试
-8.5枚举数据的应用
-9.1登录逻辑实现
--9.1.2随堂测试
-9.2登录界面及流程调试
--9.2.2随堂测试
-9.3管理主界面实现
--9.3.2随堂测试
-9.4授权验证拦截器实现
--9.4.2随堂测试
-9.5拦截器调试
-10.1分类接口实现
-10.2分类添加、编辑实现
-10.3分类树结构实现
-10.4分类删除实现
--10.4.2随堂测试
-11.1内容实体定义
-11.2相关接口定义
-11.3服务接口实现
-11.4内容添加、编辑模板实现
-11.5内容添加、编辑控制器实现
-11.6内容检索页面实现
-11.7内容分类树实现
-12.1修改UEditor相关问题
-12.2整合UEditor到内容编辑界面
-12.3UEditor图片对话框应用
-12.4文件上传问题处理
-13.1网站配置相关类实现
-13.2网站配置界面模板实现
-13.3网站配置调试
-14.1网站首页布局实现
-14.2菜单Vue组件实现
--14.2.2随堂测试
-14.3幻灯片Vue组件实现
-14.4滚动Vue组件实现
--14.4.2随堂测试
-14.5滚动接口实现
-14.6滚动接口调试
-14.7幻灯片接口实现
-15.1首页区域实现
-15.2首页内容脚本实现
-15.3首页完善
-15.4Vue组件放入单文件
-15.5详细页面实现
-16.1网站测试介绍
-16.2功能测试
-16.3打包发布
-16.4部署运行
--16.4.2随堂测试
