日记-js树

来源：互联网发布：华为如何开数据流量编辑：程序博客网时间：2024/06/05 21:53
<div class="page animation-fade">    <div class="page-content">        <div class="panel">            <div class="panel-body container-fluid">                <div class="input-search" style="width:30rem">                    <button type="button" class="input-search-btn">                        <i class="icon wb-search" aria-hidden="true"></i></button>                    <input class="form-control input-sm jstree-search" name="jstree_search" placeholder="快速查找..." type="text">                </div>                <div class="example-wrap">                    <div class="example">                        <div id="data"></div>                    </div>                </div>            </div>        </div>        <%--悬浮按钮--%>        <div class="panel area-jstree-buttons">            <div class="panel-body">                <div>                    <button type="button" class="btn btn-block btn-success select-id" data-status="1"                            data-url="${ctx}<%=Uri.SYS_AREA_JSTREE_SUBMIT%>">启用                    </button>                    <button type="button" class="btn btn-block btn-primary select-id" data-status="2"                            data-url="${ctx}<%=Uri.SYS_AREA_JSTREE_SUBMIT%>">停用                    </button>                </div>            </div>        </div>    </div></div>

<script>    var areaJson = ${jsonArray};    var $content = $("#admui-pageContent")    $(function () {        /*初始化jstree*/        $('#data').jstree({            'core': {                'data': areaJson            },            plugins: ["checkbox", "search"]        });                        $('.select-id').on('click', function () {            var button = $(this);            var buttonType = '';            if($(this).data("status") == "1"){                buttonType = 1            }else{                buttonType = 2            }            var status = $(this).data("status")            var url = $(this).data("url")            var lis = $('#data').find('li');            var trues = new Array();            $(this).removeClass("btn-primary btn-success")            $(this).addClass("btn-dark")            lis.each(function (index, obj) {                /*获取jstree节点*/                if ($(this).attr('aria-selected') == "true") {                    trues.push($(this).children('a').children('span').text());                    console.log($(this).children('a').children('span').text())                }            })            console.log(trues)            console.log(status);            $.ajax({                url: url,                type: 'post',                data: {                    'areas': trues,                    'status': status                },                success: function (data) {                    if (data.status == 200) {                        console.log(data.areaJson)                        /*-----------开启jstree刷新-----------*/                        $("#data").jstree().settings.core.data = data.areaJson;                        $("#data").jstree().refresh(true);                        /*-------------*/                        button.removeClass("btn-dark")                        if(buttonType == 1){                            button.addClass("btn-success")                        }else{                            button.addClass("btn-primary")                        }                        toastr.success('区域设置更新成功！')//                    }                }            })        })        //搜索        $(".input-search-btn").on("click",function(){            $("#data").jstree(true).search($(".jstree-search").val());        })    })</script>

/** * 区域管理启用停用 */@RequestMapping(value = Uri.SYS_AREA_JSTREE_SUBMIT)@ResponseBodypublic Object areasOnAndOff(HttpServletRequest request,String status){    Map map  = request.getParameterMap();    Integer sta = Integer.parseInt(status);    String[] areas = (String[])map.get("areas[]");    List<Long> parentIds = new ArrayList<Long>();    //插入所有选中目标    for(String s:areas){        parentIds.add(Long.parseLong(s));    }    //查出所有区域    List<SysAreaBean> allAreas = sysAreaService.findAllBeans();    List<Long> result = sysAreaService.findAllSons(parentIds);    //更新区域状态    sysAreaService.changeStatus(sta,result);    //更新jstree    List<SysAreaBean> sysAreaBeans = sysAreaService.findAllBeans();    List<JsTreeView> jsTreeViews = new ArrayList<JsTreeView>();    JsTreeView jsTreeView = null;    for(SysAreaBean s:sysAreaBeans){        jsTreeView = new JsTreeView();        jsTreeView.setId(s.getId().toString());        if(s.getParentId() == null) {            jsTreeView.setParent("#");        }else{            jsTreeView.setParent(s.getParentId().toString());        }        if(s.getStatus() == 1){            jsTreeView.setText(s.getName()+"<span class='area-id'data-id='"+s.getId()+"'>"+s.getId()+"</span>"+" <p class='areaOpen'>已启用</p>");        }else{            jsTreeView.setText(s.getName()+"<span class='area-id'>"+s.getId()+"</span>"+" <p class='areaOff'>未启用</p>");        }        jsTreeViews.add(jsTreeView);    }    JSONArray jsonArray =JSONArray.fromObject(jsTreeViews);    //返回数据    Map<String ,Object> resultMap = new HashMap<String,Object>();    map.put("areaJson",jsonArray);    map.put("status",200);    return map;}
阅读全文
0 0