onlineSchool 项目课 三 :上下级数据

本文介绍了如何在Java中处理上下级数据,包括分类数据和章节数据的封装、遍历与存储,以及如何过滤二级分类数据、处理点击事件和删除操作。详细讲解了如何创建bean,构建数据结构,使用map进行数据存储和遍历,以及在前端展示时的交互逻辑。
摘要由CSDN通过智能技术生成

一,上下级分类数据:实现
一级分类的 code 是二级分类的parentCode。一级分类的parentCode是0。
在这里插入图片描述

1,创建bean封装数据结构。(java类)

//放上下级数据
public class ClassifyBean extends Classify {

    private List<Classify> SubClassifyList = new ArrayList<Classify>();

    public List<Classify> getSubClassifyList() {
        return SubClassifyList;
    }

    public void setSubClassifyList(List<Classify> subClassifyList) {
        SubClassifyList = subClassifyList;
    }
}

2,创建一个 map,可以返回的 map,可以遍历的 map。
query All查询数据库表的所有数据,传入空的对象。
查询的分类数据返回到 list 中。
使用 iterator 把 list 中分类的数据,遍历到 domain。

public Map<String, ClassifyBean> queryAllClassifyMap() {
		Map<String,ClassifyBean> map = new LinkedHashMap<String, ClassifyBean>();
		List<Classify> list = entityDao.queryAll(new Classify());
		Iterator<Classify> it = list.iterator(); 
		while (it.hasNext()){ 
			Classify c = it.next();

筛选 domain 中 parentCode 为0的一级分类的数据复制到 bean。
把 bean 中的一级分类的 code 作为 map 的 key,一级分类的数据作为 map 的 value。
else是筛选domain中parentCode不为0的二级分类的数据。
获取二级分类数据的parentCode就是一级分类的code,通过map get key 获取一级分类的数据,返回到bean中作为parentBean作为bean中的父分类。
调用bean中二级分类的list,把筛选的domain中的二级分类的数据放到list中,作为bean中的子分类。

			if ("0".equals(c.getParentCode())){ 
				ClassifyBean bean = new ClassifyBean(); 
				BeanUtils.copyProperties(c,bean);
				map.put(bean.getCode(),bean); 
			}else {
				if (null != map.get(c.getParentCode())){ 
					ClassifyBean parentBean = map.get(c.getParentCode());
					parentBean.getSubClassifyList().add(c); 
				}
			}
		}
		return map;
	}

二,章节数据:
章的 parentId 是0,节的 parentId 是章的 id
在这里插入图片描述

1,创建bean封装数据结构。(java类)

public class chapterSectionBean {

    private String chapterName;
    private List<CourseSection> sections;
    private Integer time;
    private Long chapterId;
    
 	//下面是setter和getter方法
 ...
 }

2,创建map,可以返回map,可以遍历map。
去数据库中查询章节表中一个课程下的章节的数据,queryAll传入一个对象,
(如果传入的参数很多的话,可以传入一个对象。在sql中要对章节的parentId进行升序排序,先章后节。确保在筛选时,先把章的数据能全部筛选出来,章的parentId是0,节的parentId是章的id,parentId ASC确保先章后节)
获取的章节数据返回到list。
可能课程下没有创建章节的数据,判断list中有没有数据,iterator遍历list的数据到domain。

public Map<Long,chapterSectionBean> queryChapterSection(Long courseId){
		Map<Long,chapterSectionBean> map = new LinkedHashMap<Long,chapterSectionBean>();
		
		CourseSection queryEntity = new CourseSection();
		queryEntity.setCourseId(courseId);
		List<CourseSection> list =this.entityDao.queryChapterSection(queryEntity);
		
		if (!CollectionUtils.isEmpty(list)){
			
			Iterator<CourseSection> it = list.iterator();
			while (it.hasNext()){
				CourseSection item = it.next();

domain中筛选parentId是0的章的数据。
制作bean中章的数据,创建章下节的数组。
把章的数据放到map当中, map的key就是章的id,map的value就是章数据。
else parentId不为0的节的数据,节的parentId就是章的id,map get key获取章的id获取章,获取章下节的数组,把节的数据添加到数组中。

				if (Long.valueOf(0).equals(item.getParentId())){ 
					
					chapterSectionBean bean = new chapterSectionBean();
					bean.setChapterName(item.getName());
					bean.setChapterId(item.getId());
					bean.setTime(item.getTime());
					bean.setSections(new ArrayList<CourseSection>());
					
					map.put(item.getId(),bean);
				}else { 
					map.get(item.getParentId()).getSections().add(item);
				}
			}
		}
		return map;

	}

3,当map的 key 是数字时,遍历的方式有点不同。

<#if chapterSectionMap??>
<#list chapterSectionMap as key ,chapter>
......
</#list>
</#if>

三,过滤对应的二级分类的数据
以分类的数据为例:
第一种方法
1,针对一级分类做点击事件,
可以是一级分类的样式做点击事件,点击时获取一级分类的code的属性的值,

$(function () {
        $(".tr-bg-gray").click(function () {
            let code = $(this).attr('code')
   

可以是一级分类的 id 做点击事件,点击时获取一级分类的 value 的值,

$(function () {
      $('#Classify').click(function () {
         let code = $(this).val()

2,在包含所有二级分类的父节点中,添加二级分类的 id,找到所有二级分类的操作栏的标签,去遍历。

        $("#_subClassifyList").find('tr').each(function (i,item) {
                pcode = $(item).attr('parentCode')
                if (code == pcode){
                    $(item).show()
                }else {
                    $(item).hide();
                }
            })

获取二级分类标签中定义的二级分类的属性 parents code 的值。
判断当一级分类的code等于二级分类的parent code相应的二级分类的数据显示,否则隐藏。

第二种方法:(项目的课程展示页部分有具体的内容)

四,点击一级分类数据时的背景色效果:
在这里插入图片描述

针对一级分类的样式做点击事件事件,点击时遍历所有使用这个样式的标签,去掉所有的底色,点击哪个就给哪个加上底色。

 $(".tr-bg-gray").click(function () {
            $(".tr-bg-gray").each(function (i,item) {
                $(item).removeClass("tr-bg-gray-hover")
            })
            	$(this).addClass("tr-bg-gray-hover")

五,上下级分类数据的删除:
效果演示
在这里插入图片描述

1,定义一个公共的model弹窗, id是 _osDialogModal,弹窗的信息是通过样式 os-content 显示的,通过点击确定或取消的样式 os-ok os-cancel 使用回调函数。

公共的 modal 弹窗:

<div class="modal" id="_osDialogModal" role="dialog" data-backdrop="static">
        <div class="modal_wapper">
            <div class="modal-dialog w-4">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title">提示信息</h4>
                    </div>

                    <div class="modal-body">
                        <div><span class="os-content"></span></div>
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary os-ok" >确 定</button>
                        <button type="button" class="btn btn-default os-cancel" >取 消</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

2,在删除课程分类中,点击确定的回调函数发起ajax请求。把当前操作的数据的id当作ajax的参数提交到controller。

function toDelete(id) {
        Modal.confirm("确定删除?",function(type){
            $.ajax({
                url:'${base}/deleteClassify',
                type:'POST',
                data:{"id":id},
                dataType: 'json',
                success: function(resp){
                    if(resp.errcode == 0){
                        window.location.reload();
                    }else{
                        Modal.alert(resp.message);
                    }
                }
            })
        });
    }

3,controller中根据id删除课程的分类数据。调用Service 的方法

	@RequestMapping("deleteClassify")
    @ResponseBody
    public String deleteClassify(Long id){
        return classifyService.deleteClassify(id);
    }

4,Service 中
删除前先判断是否有id传过来,没有返回错误信息。
是否能根据id获取被删除的数据,无法获取返回错误信息。

传入根据id获取的整条分类的数据,取出code与数据库中的parentCode比较,计算有几条parentCode与取出来的code相等,如果大于0,说明该分类下有子分类,就不允许删除。

public String deleteClassify(Long id){
		if(null == id){
			return JsonView.failureJson("id错误");
		}
		Classify entity = entityDao.getById(id);
		if(null == entity){
			return JsonView.failureJson("分类不存在");
		}
		
		int subCount = entityDao.querySubClassifyCount(entity);
		if(subCount > 0){
			return JsonView.failureJson("有子分类 不允许删除");
		}

		//分类下是否有课程?
		
		entityDao.delete(entity);
		return JsonView.successJson();
	}

5,mapper中

<select id="querySubClassifyCount" parameterType="com.langshan.onlineschoollangshan.domain.Classify" resultType="java.lang.Integer">
		SELECT COUNT(id) FROM classify
		WHERE parent_code = #{code}
	</select>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值