目录的上移,下移,置顶,置底的实现

本文详细介绍了如何使用SQL查询实现目录(dir_)表中的数据上移、下移、置顶和置底操作,主要依赖于sort关键字进行排序。通过查询比当前对象sort值小或大的记录进行交换,或者找出sort的最小值和最大值来调整位置。同时提供了DAO层和Service层的方法实现这些操作。
摘要由CSDN通过智能技术生成

思路:

        1、上移,下移,置底,置顶是根据数据库表中 sort 关键字进行排序。

        2、上移:查出比当前对象sort小的一条数据(lowerSort),交换两个sort。

        3、下移:查出比当前对象sort大的一条数据(upperSort),交换两个sort。

        4、置顶:查出当前层级中sort最小的一条数据(minSort),将当前sort设为min(sort)- 1。

        5、置底:查出当前层级中sort最大的一条数据(maxSort),将当前sort设为max(sort)+ 1

sql实现:

<select id="selectSortUp">
        SELECT 
        <include refid="allColumns"/>
        FROM dir_
        WHERE deleted_ = 0
        AND parent_id_ = #{parentId,jdbcType=BIGINT}
        <![CDATA[ AND sort_ < #{sort,jdbcType=INTEGER} ]]>
        order by sort_ desc
        LIMIT 1
</select>

<select id="selectSortDown" >
        SELECT 
        <include refid="allColumns"/>
        FROM dir_
        WHERE deleted_ = 0
        AND parent_id_ = #{parentId,jdbcType=BIGINT}
        <![CDATA[ AND sort_ > #{sort,jdbcType=INTEGER} ]]>
        order by sort_
        LIMIT 1
</select>

<select id="selectMinSort" >
        SELECT 
        <include refid="allColumns"/>
        from dir_
        where (parent_id_, sort_) in (
                SELECT parent_id_, MIN(sort_)
                FROM dir_
                WHERE deleted_ = 0
                AND parent_id_ = #{parentId,jdbcType=BIGINT}
                group BY parent_id_)
        order by update_time_ LIMIT 1
</select>

<select id="selectMaxSort" >
        SELECT 
        <include refid="allColumns"/>
        from dir_
        where (parent_id_, sort_) in (
                SELECT parent_id_, MAX(sort_)
                FROM dir_
                WHERE deleted_ = 0
                AND parent_id_ = #{parentId,jdbcType=BIGINT}
                group BY parent_id_)
        order by update_time_ LIMIT 1
</select>

dao层

public dirVO selectMaxSort(Long parentId);

public dirVO selectMinSort(Long parentId);

public dirVO selectSortUp(Long parentId,Integer sort);

public dirVO selectSortDown(Long parentId,Integer sort);

service层

//上移操作,下移同理
public DirVO moveUpDir(DirVO dirVO) {

        //获取比当前sort小的一位
        DirVO lowerDir = dirMapper.selectSortUp(dirVO.getParentId(), dirVO.getSort());
        if (lowerDir == null) {
            // 为空结果为空,说明当前DirSort最小,返回自身
            return dirVO;
        }
        //lowerSort大小
        Integer lowerDirSort = lowerDir.getSort();
        //当前sort大小
        Integer localDirSort = dirVO.getSort();
        //交换
        dirVO.setSort(lowerDirSort);
        lowerDir.setSort(localDirSort);

        updateSort(dirVO.getId(), dirVO.getSort());
        updateSort(lowerDir.getId(), lowerDir.getSort());

        return dirVO;
    }

//置顶操作,置底同理
public DirVO topDir(DirVO dirVO) {

        DirVO minDir = dirMapper.selectMinSort(dirVO.getParentId());

        if(minDir == null){
            //若父节点下没子节点,返回自身
            return dirVO;
        }

        //置顶
        dirVO.setSort(minDir.getSort() - 1);
        updateSort(dirVO.getId(), dirVO.getSort());
        return dirVO;

    }

前端实现上移下移置顶置底需要使用 JavaScript 来操作 DOM 元素。 具体实现可以参考以下代码: ```html <ul id="list"> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> <li>列表项4</li> <li>列表项5</li> </ul> <button onclick="moveUp()">上移</button> <button onclick="moveDown()">下移</button> <button onclick="moveTop()">置顶</button> <button onclick="moveBottom()">置底</button> ``` ```javascript // 获取列表元素和当前选中的项 var list = document.getElementById("list"); var selectedItem; // 上移操作 function moveUp() { if (selectedItem) { var prevItem = selectedItem.previousElementSibling; if (prevItem) { list.insertBefore(selectedItem, prevItem); } } } // 下移操作 function moveDown() { if (selectedItem) { var nextItem = selectedItem.nextElementSibling; if (nextItem) { list.insertBefore(nextItem, selectedItem); } } } // 置顶操作 function moveTop() { if (selectedItem) { list.insertBefore(selectedItem, list.firstChild); } } // 置底操作 function moveBottom() { if (selectedItem) { list.appendChild(selectedItem); } } // 监听列表项点击事件,记录当前选中的项 list.addEventListener("click", function(e) { selectedItem = e.target; }); ``` 这段代码实现了一个简单的列表操作,通过点击按钮可以实现上移下移置顶置底等操作。需要注意的是,这里的操作只是在前端进行了 DOM 元素的移动,如果需要将这些操作的结果保存到后端,还需要进行相应的 AJAX 请求。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值