目前想做一个权限管理的页面,最后考虑用Treeview实现,不过好像没有找到好的treeview实现方法,只好自己实现了,目前只是实现了页面的显示,具体的操作慢慢修改了。
<div class="row">
<div class="col-md-6">
<ul class="sidebar-menu" data-widget="tree">
<li class="treeview active">
<a href="#">
<i class="fa fa-share"></i> <span>Menu</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li><a href="#"><i class="fa fa-circle-o"></i> Document Template1</a></li>
<li class="treeview active">
<a href="#">
<i class="fa fa-circle-o"></i> Document Template
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li><a href="#"><input type="checkbox" /> Visable</a></li>
<li><a href="#"><input type="checkbox" /> Add</a></li>
<li><a href="#"><input type="checkbox" /> Delete</a></li>
<li><a href="#"><input type="checkbox" /> Delete1</a></li>
<li class="treeview">
<a href="#">
<i class="fa fa-circle-o"></i> Level Two
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li><a href="#"><input type="checkbox" /><i class="fa fa-circle-o"></i> Level Three</a></li>
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a><input type="checkbox" /></li>
</ul>
</li>
</ul>
</li>
<li class="treeview active">
<a href="#">
<i class="fa fa-circle-o"></i> Document Employee
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu active">
<li><a href="#"><input type="checkbox" /> Visable</a></li>
<li><a href="#"><input type="checkbox" /> Add</a></li>
<li><a href="#"><input type="checkbox" /> Delete</a></li>
<li><a href="#"><input type="checkbox" /> Delete1</a></li>
<li class="treeview">
<a href="#">
<i class="fa fa-circle-o"></i> Level Two
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li><a href="#"><input type="checkbox" /><i class="fa fa-circle-o"></i> Level Three</a></li>
<li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a><input type="checkbox" /></li>
</ul>
</li>
</ul>
</li>
<li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
</ul>
</li>
</ul>
</div>
</div>