<!DOCTYPE html>
|
<html>
|
|
<head>
|
<title>菜单管理</title>
|
<meta charset="UTF-8">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
|
<script src="../../../js/paramconfig.js"></script>
|
<script type="text/javascript">
|
remoteToLoadCss('BootStrap4/assets/css/style.css');
|
remoteToLoadCss('BootStrap4/expand/css/bootstrap-extract.css');
|
loadLocalCss('../../../css/main.css');
|
loadLocalCss('../../../plugins/jqgrid/ui.jqgrid-bootstrap.css');
|
loadLocalCss('../../../plugins/ztree/css/metroStyle/metroStyle.css');
|
loadLocalCss('../../../css/bootstrap-table.min.css');
|
loadLocalCss('../../../plugins/treegrid/jquery.treegrid.css');
|
remoteToLoadJs('BootStrap4/assets/js/jquery.min.js');
|
loadLocalJs('../../../plugins/layer/layer.js');
|
remoteToLoadJs('BootStrap4/assets/js/tether.min.js');
|
remoteToLoadJs('BootStrap4/assets/js/bootstrap.min.js')
|
loadLocalJs('../../../libs/vue.min.js');
|
loadLocalJs('../../../libs/bootstrap-table.min.js');
|
loadLocalJs('../../../plugins/treegrid/jquery.treegrid.min.js');
|
loadLocalJs('../../../plugins/treegrid/jquery.treegrid.bootstrap3.js');
|
loadLocalJs('../../../plugins/treegrid/jquery.treegrid.extension_new.js');
|
loadLocalJs('../../../plugins/treegrid/tree.table.js');
|
loadLocalJs('../../../plugins/jqgrid/grid.locale-cn.js');
|
loadLocalJs('../../../plugins/jqgrid/jquery.jqGrid.min.js');
|
loadLocalJs('../../../plugins/ztree/jquery.ztree.all.min.js');
|
loadLocalJs('../../../js/common.js');
|
</script>
|
<style>
|
.form-control-label {
|
text-align: right;
|
}
|
|
#tabBase td {
|
padding: 2px;
|
}
|
|
.SearchLeft {
|
width: 7%;
|
min-width: 90px;
|
line-height: 30px;
|
}
|
|
.SearchRight {
|
width: 18%;
|
}
|
|
.Control-label-long {
|
padding-top: 0px !important;
|
}
|
|
.DivHeight {
|
height: 45px;
|
}
|
|
.form-control {
|
padding: 0.3rem 0.7rem;
|
height: 30px;
|
}
|
|
.col-sm-3{
|
padding-left: 0;
|
padding-right: 0;
|
}
|
|
.btn_arrow {
|
width: 19px;
|
height: 25px;
|
float: left;
|
background: url('/image/arrow.png') no-repeat 0px 0px;
|
margin-left: 15px;
|
margin-bottom: 10px;
|
cursor: pointer;
|
}
|
|
.treegrid-table tbody {
|
text-align: center;
|
}
|
</style>
|
</head>
|
<body>
|
<div id="rapp" v-cloak>
|
<div class="panel panel-default">
|
<div class="panel-heading">
|
查询区
|
</div>
|
<div class="panel-body">
|
<div id="tabBase" class="row">
|
<div class="col-sm-3 responsive fix-offset DivHeight" data-desktop="col-sm-3 fix-offset" data-tablet="col-sm-4 fix-offset">
|
<div class="SearchLeft" align="right" style="display:table-cell;">
|
<label class="control-label">菜单名称 </label>
|
</div>
|
<div style="display:table-cell;vertical-align:top;padding-right: 0.75em;">
|
<input type="text" id="name" class="form-control" />
|
</div>
|
</div>
|
<div class="col-sm-3 responsive fix-offset DivHeight" data-desktop="col-sm-3 fix-offset" data-tablet="col-sm-4 fix-offset">
|
<div class="SearchLeft" align="right" style="display:table-cell;">
|
<label class="control-label">上级菜单 </label>
|
</div>
|
<div style="display:table-cell;vertical-align:top;padding-right: 0.75em;">
|
<input type="text" id="parentName" name="parentName" class="form-control" />
|
</div>
|
</div>
|
<div class="col-sm-3 responsive fix-offset DivHeight" data-desktop="col-sm-3 fix-offset" data-tablet="col-sm-4 fix-offset">
|
<div class="SearchLeft" align="right" style="display:table-cell;">
|
<label class="control-label">类型 </label>
|
</div>
|
<div style="display:table-cell;vertical-align:top;padding-right: 0.75em;">
|
<select class="form-control" id="type">
|
<option value="">全部</option>
|
<option value="0">目录</option>
|
<option value="1">菜单</option>
|
<option value="2">按钮</option>
|
</select>
|
</div>
|
</div>
|
<div class="col-sm-3 responsive fix-offset DivHeight" data-desktop="col-sm-3 fix-offset" data-tablet="col-sm-4 fix-offset">
|
<div class="SearchLeft" align="right" style="display:table-cell;">
|
<label class="control-label">授权标识 </label>
|
</div>
|
<div style="display:table-cell;vertical-align:top;padding-right: 0.75em;">
|
<input type="text" id="perms" name="perms" class="form-control" />
|
</div>
|
</div>
|
</div>
|
<div class="row" style="display:block;">
|
<div style="float:left;">
|
<a v-if="hasPermission('sys:menu:edit')" class="btn btn-success" @click="add"><i class="fa fa-plus"></i> 新增</a>
|
<a v-if="hasPermission('sys:menu:edit')" class="btn btn-warning" data-toggle="modal" data-target="#orderModal" onclick="ShowOrderList()" style="margin-left: 3px;">
|
<i class="fa fa-sort"></i> 排序</a>
|
</div>
|
<div style="float:right;padding-right: 0.75em;">
|
<a class="btn btn-primary-outline" @click="query"><i class="fa fa-search"></i> 查询</a>
|
<a class="btn btn-primary-outline" onclick="clearForm()"><i class="fa fa-trash-o"></i> 清除</a>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
<table id="menuTable" data-mobile-responsive="true" data-click-to-select="true">
|
<thead>
|
<tr>
|
<th data-field="selectItem" data-checkbox="true"></th>
|
</tr>
|
</thead>
|
</table>
|
<div class="modal fade" id="orderModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
<div class="modal-dialog" style="width: 360px;">
|
<div class="modal-content">
|
<div class="modal-header">
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
|
×
|
</button>
|
<h4 class="modal-title" id="myModalLabel">
|
排序-列表
|
</h4>
|
</div>
|
<div class="modal-body">
|
<div style="-ms-overflow-y: auto;height: 370px;overflow: auto;">
|
<div class="row-fluid">
|
<div style="float:left;">
|
<div class="controls">
|
<select class="ui-jqgrid" multiple="multiple" id="menu_order" style="width:278px;">
|
</select>
|
</div>
|
</div>
|
<!--<div> </div>-->
|
<!--<div><a href="javascript:;" onclick="UpdateOrder('up')" class="icon-arrow-up"></a></div>-->
|
<!--<div> </div>-->
|
<!--<div><a href="javascript:;" onclick="UpdateOrder('down')" class="icon-arrow-down"></a></div>-->
|
<div style="padding:80px 0 0 20px;">
|
<div class="btn_arrow" onclick="UpdateOrder('allup')" title="置顶"></div>
|
<div class="btn_arrow" onclick="UpdateOrder('up')" title="上移" style="background-position: 0px -85px; margin-bottom: 25px;"></div>
|
<div class="btn_arrow" onclick="UpdateOrder('down')" title="下移" style="background-position: 0px -49px"></div>
|
<div class="btn_arrow" onclick="UpdateOrder('alldown')" title="置底" style="background-position: 0px -125px"></div>
|
</div>
|
<div style="float: right;margin-right: 10px;margin-top:20px;">
|
<a class="btn btn-primary" onclick="submitOrder()"><i class="fa fa-eyes"></i>确定排序</a>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<script src="../../../js/modules/sys/menu.js"></script>
|
</body>
|
|
</html>
|
