test/ipad/js/monitor.js

$(function(){
    let width = 0;
    let id = setInterval(frame, 10);
    function frame() {
        if (width >= 60) {
            clearInterval(id);
        } else {
            width++;
            $('#progress-bar').css('width', width + '%');
        }
    }
    // 编辑弹窗
    $("#setTask").click(()=>{
        // 淡入元素
        $("#editDialog").fadeIn();
    })
    $("#closeEdit").click(()=>{
        $("#editDialog").fadeOut();
    })
    // 拖拽排序逻辑
    //第一步，获取拖动容器
    let wrap = document.getElementById('top1');
    //第二步，设置拖动项的拖动规则
    let rules = {
        animation: 500,
        swap: true,
        //拖动结束后的回调函数
        onEnd: function (event) {
            console.log('参数是拖动事件对象', event);
            // 交换
            console.log($("#top1"))
            //获取拖动后容器中的每一项的位置排序
            // var arr = sortable.toArray();
            // console.log('位置排序', arr);
        }
    };
    //第三步，初始化 --> 给拖动容器添加拖动规则 
    let sortable = Sortable.create(wrap, rules);

})