<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
|
<%
|
String path = request.getContextPath();
|
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
|
%>
|
<%@ taglib uri="/struts-tags" prefix="s"%>
|
<!DOCTYPE HTML>
|
<html lang="en">
|
<head>
|
<!-- 默认使用最高内核 -->
|
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10" />
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
|
<base href="<%=basePath%>">
|
<meta charset="UTF-8">
|
<title><s:text name='Site_content_configuration'/></title> <!-- 配置页面内容 -->
|
<link type="text/css" rel="stylesheet" href="css/basic.css" />
|
<link type="text/css" rel="stylesheet" href="src/css/layui.css" />
|
<link type="text/css" rel="stylesheet" href="css/loading.css" />
|
<link type="text/css" rel="stylesheet" href="css/navConfigLayout.css" />
|
<link type="text/css" rel="stylesheet" href="css/index_layout.css" />
|
<link type="text/css" rel="stylesheet" href="jqueryui/jquery-ui.min.css">
|
<link type="text/css" rel="stylesheet" href="css/confirm.css">
|
<link type="text/css" rel="stylesheet" href="pages/css/base.css">
|
<link type="text/css" rel="stylesheet" href="pages/css/common.css">
|
<link type="text/css" rel="stylesheet" href="pages/css/pages/navconfig.css">
|
<link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
|
<style type="text/css">
|
#content{
|
height:600px;
|
overflow-y:scroll;
|
}
|
#content .china-map {
|
height: 100%;
|
}
|
#content .module {
|
width: 100% !important;
|
}
|
</style>
|
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
|
<script type="text/javascript" src="jqueryui/jquery-ui.min.js"></script>
|
<script type="text/javascript" src="js/createTab.js"></script>
|
<script type="text/javascript" src="js/echarts.js"></script>
|
<script type="text/javascript" src="js/loading.js"></script>
|
</head>
|
<body>
|
<div id="head"><s:text name='Site_content_configuration'/></div> <!-- 网站内容的配置 -->
|
<!--main内容开始-->
|
<div id="main">
|
<div class="piece-list">
|
<div class="piece">
|
<!--首页-->
|
<div class="piece-head read-only"></div>
|
<div class="piece-con piece-content"></div>
|
<div class="piece-child piece-content-special"></div>
|
</div>
|
<!--数据管理-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content"></div>
|
</div>
|
<!--测试数据-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content">
|
|
</div>
|
</div>
|
|
<!--清除浮动-->
|
<div class="clear"></div>
|
<!--统计报表-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content piece-content-special">
|
|
</div>
|
</div>
|
<!--故障管理-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content">
|
</div>
|
</div>
|
<!--告警管理-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content">
|
|
</div>
|
</div>
|
|
<!--清除浮动-->
|
<div class="clear"></div>
|
<!--作业管理-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content-special">
|
|
</div>
|
</div>
|
<!--用户管理-->
|
<div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content">
|
|
</div>
|
</div>
|
<!--参数设置-->
|
<!-- <div class="piece">
|
<div class="piece-head"></div>
|
<div class="piece-con piece-content"></div>
|
</div> -->
|
<!--清除浮动-->
|
<div class="clear"></div>
|
</div>
|
</div>
|
<!--main内容结束-->
|
<div id="previewNav">
|
<div class="preview-head">页面导航和首页预览<span title="退出">X</span></div>
|
<div id="nav"></div>
|
<div id="content">
|
<div class="nav-map small">
|
<!-- 电池分布图 -->
|
<div class="china-map"></div>
|
</div>
|
<!-- 电池故障与电池告警饼状图 -->
|
<div class="pie-con">
|
<!-- 电池故障饼状图 -->
|
<div class="brdn-pie module"></div>
|
<!-- 电池告警饼状图 -->
|
<div class="warn-pie module"></div>
|
<!--电池故障修改图-->
|
<div class="repair-pie module"></div>
|
<!--电池健康饼状图-->
|
<div class="health-pie module"></div>
|
<!--清除浮动-->
|
<div class="clear"></div>
|
</div>
|
</div>
|
</div>
|
|
<div id="rightFloat">
|
<ul>
|
<!-- <li class="preview"><s:text name='Preview'/></li> --> <!-- 预览 -->
|
<li onclick="GLOBAL.Nav.show()">导航配置</li>
|
<li class="ensure"><s:text name='Determine'/></li> <!-- 确定 -->
|
<li class="out"><s:text name='Exit'/></li> <!-- 退出 -->
|
</ul>
|
</div>
|
|
<div id="navSort">
|
<div class="navSort-title fb">子导航排序<div class="fr f16 mr10"><i class="fa fa-close navSort-close" onclick="GLOBAL.Nav.hide()"></i></div></div>
|
<div class="navSort-content clearfix">
|
<div class="navSort-content-item layui-col-md4"></div>
|
<div class="navSort-content-item layui-col-md4"></div>
|
<div class="navSort-content-item layui-col-md4"></div>
|
</div>
|
</div>
|
|
<!-- 导航排序遮罩层 -->
|
<div id="navSortShadow"></div>
|
<!--整体的遮罩层-->
|
<div id="allShade"></div>
|
</body>
|
|
<script type="text/javascript" src="js/changePinYin.js"></script>
|
<script type="text/javascript" src="js/createMap.js"></script>
|
<script type="text/javascript" src="js/createTab.js"></script>
|
<script type="text/javascript" src="js/myConfirm.js"></script>
|
<script type="text/javascript" src="pages/js/base.js"></script>
|
<script type="text/javascript" src="pages/js/common.js"></script>
|
<script type="text/javascript">
|
var permits = [];
|
<% Object obj=session.getAttribute("permits");
|
if(obj!=null){
|
String permits =obj.toString();%>
|
permits=<%=permits%>;
|
//console.info(json);
|
<% }%>
|
|
var custompages = [];
|
<% Object cPages=session.getAttribute("custompages_json");
|
if(obj!=null){
|
String custompages =cPages.toString(); %>
|
custompages=<%=custompages%>;
|
//console.info(permits);
|
<% } %>
|
var mainSqlArr=new Array();
|
var childSqlArr=new Array();
|
//计算预览窗口的高度
|
$(document).ready(function(){
|
var srnHeight=$(window).height();
|
var prevHd=$('#previewNav .preview-head').height();
|
var navHeight=$('#nav').height();
|
$('#content').height(srnHeight-prevHd-navHeight);
|
});
|
getMapHt();
|
// 设置map容器的高度
|
function getMapHt() {
|
var srnHt = $(window).height();
|
var navHt = $('#nav').height();
|
var topHt = $('#top').height();
|
var shiftHt = srnHt - navHt - topHt -32;
|
var pie_len = $('.pie-con .module').length;
|
$('.nav-map').height(shiftHt);
|
$('.pie-con .module').height(shiftHt/pie_len);
|
return shiftHt;
|
}
|
|
function changePage(mainArr,childNav){
|
var $head=$('#main .piece-list .piece .piece-head');
|
var $Content=$('#main .piece-list .piece .piece-con');
|
//清空内容
|
$head.text('');
|
$Content.text('');
|
//console.info(mainArr);
|
//创建页面内容
|
$head.each(function(i){
|
//console.info(mainArr);
|
var __span=$('<span>'+mainArr[i].subname+'</span>');
|
if(mainArr[i].subenable==1)
|
{
|
var __input=$('<input type="checkbox" value="'+mainArr[i].num+'" disabled="disabled" checked="checked"/>');
|
$(this).addClass('read-only');
|
}else if(mainArr[i].subflag==1){
|
var __input=$('<input type="checkbox" value="'+mainArr[i].num+'" checked="checked"/>');
|
}else if(mainArr[i].subflag==0){
|
var __input=$('<input type="checkbox" value="'+mainArr[i].num+'"/>');
|
}
|
$(this).append(__span);
|
$(this).append(__input);
|
});
|
$Content.each(function(i){
|
var __ul=$('<ul></ul>');
|
var __ulSpecial=$('<ul></ul>')
|
var __liArr=new Array();
|
for(var k=0;k<childNav[i].length;k++)
|
{
|
var __span=$('<span>'+childNav[i][k].subname+'</span>');
|
if(childNav[i][k].subenable==1)
|
{
|
if(childNav[i][k].subflag==1){
|
var __input=$('<input type="checkbox" value="'+childNav[i][k].num+'" disabled="disabled" checked="checked"/>');
|
}else{
|
var __input=$('<input type="checkbox" value="'+childNav[i][k].num+'" disabled="disabled"/>');
|
|
}
|
__liArr[k]=$('<li class="read-only"></li>');
|
|
}else if(childNav[i][k].subflag==1){
|
var __input=$('<input type="checkbox" value="'+childNav[i][k].num+'" checked="checked"/>');
|
__liArr[k]=$('<li></li>');
|
}else if(childNav[i][k].subflag==0){
|
var __input=$('<input type="checkbox" value="'+childNav[i][k].num+'"/>');
|
__liArr[k]=$('<li class="not-opt"></li>');
|
}
|
__liArr[k].append(__span);
|
__liArr[k].append(__input);
|
if(k<5)
|
{
|
__ul.append(__liArr[k]);
|
}else{
|
__ulSpecial.append(__liArr[k]);
|
}
|
}
|
$(this).append(__ul);
|
if(childNav[i].length>5)
|
{
|
$(this).append(__ulSpecial);
|
}
|
});
|
}
|
|
|
|
//页面中的点击内容
|
$(document).ready(function(){
|
// 子模块的文本描述
|
$('#main .piece-list').on('click', '.piece .piece-con li span', function(){
|
changeContent($(this));
|
changeHeaderStats($(this));
|
});
|
// 主模块的文本描述
|
$('#main .piece-list').on('click', '.piece .piece-head span', function(){
|
changeContent($(this));
|
changConStats($(this));
|
});
|
// 子模块的复选框
|
$('#main .piece-list').on('click', '.piece .piece-con li input', function(){
|
changeContentCheck($(this));
|
changeHeaderStats($(this));
|
});
|
// 主模块的复选框
|
$('#main .piece-list').on('click', '.piece .piece-head input', function(){
|
changeContentCheck($(this));
|
changConStats($(this));
|
});
|
|
|
var myHtml = $('#content').html();
|
//点击预览生成预览窗口
|
$('#rightFloat .preview').click(function(){
|
$('#content').text('');
|
$('#content').html(myHtml);
|
console.info(mainSqlArr);
|
console.info(childSqlArr);
|
setCheckVal();
|
//根据newMainArr和newChildArr创建导航
|
createNav($('#nav'),mainSqlArr,childSqlArr);
|
//显示预览窗口
|
$('#previewNav').show();
|
$('#allShade').show();
|
|
setHomePage();
|
});
|
//点击预览窗口的X退出预览
|
$('#previewNav .preview-head span').click(function(){
|
//显示预览窗口
|
$('#previewNav').hide();
|
$('#allShade').hide();
|
});
|
//点击页面的灰色部分退出预览
|
$('#allShade').click(function(){
|
//显示预览窗口
|
$('#previewNav').hide();
|
$('#allShade').hide();
|
});
|
});
|
|
function setHomePage(){
|
for(var i=0;i<moduleSqlArr.length;i++)
|
{
|
//给将要移除的内容添加class=“del-module”
|
if(moduleSqlArr[i].subflag==0)
|
{
|
$('#content .module').eq(i).addClass('del-module');
|
}
|
}
|
$('#content .del-module').remove(); //移除class="del-module"的内容
|
//根据饼状图的数量确定位置和大小
|
var pieLen=$('#content .pie-con .module').length;
|
$('#content .pie-con .module').width(100/pieLen+'%').height(200);
|
/* switch(pieLen){
|
case 0:
|
$('#content .china-map').remove();
|
break;
|
case 1:
|
$('#content .pie-con .module').css({
|
'width':'100%',
|
'height':'400px'
|
});
|
break;
|
case 2:
|
$('#content .pie-con .module').css('height','400px');
|
break;
|
case 3:
|
$('#content .pie-con .module').eq(pieLen-1).css('width','100%');
|
break;
|
}
|
if($('#content .mainte').length==0)
|
{
|
if($('#content .notice').length!=0)
|
{
|
$('#content .notice').css('width','100%');
|
}
|
}else{
|
if($('#content .notice').length==0)
|
{
|
$('#content .mainte').css('width','100%');
|
}
|
} */
|
|
//电池分布中国地图
|
var $map=$('#content .china-map'); //获取jquery对象
|
if($map.length!=0)
|
{
|
var map=$map.get(0); //将jquery对象转化为dom对象
|
var mapChart=echarts.init(map);
|
//生成地图
|
showprovince(mapChart,city[0]);
|
}
|
|
//生成电池告警率饼状图
|
var $warn=$('#content .pie-con .warn-pie'); //获取告警容器的jquery对象
|
if($warn.length!=0)
|
{
|
var warn=$warn.get(0); //将告警容器的jquery对象转化为dom对象
|
var warnPie=echarts.init(warn); //初始化图表容器
|
var warnTle='电池告警率';
|
var warnObj=[{name:'电池告警',val:'500'},{name:'正常工作',val:'400'}];
|
//创建电池告警饼状图
|
createPie(warnPie,warnTle,warnObj);
|
if(moduleSqlArr[0]==0)
|
{
|
warnPie.clear();
|
}
|
}
|
//生成电池故障率饼状图
|
var $brdn=$('#content .pie-con .brdn-pie'); //获取故障容器的jquery对象
|
if($brdn.length!=0)
|
{
|
var brdn=$brdn.get(0); //将故障容器的jquery对象转化为dom对象
|
var brdnPie=echarts.init(brdn); //初始化表格容器
|
var brdnTle='电池故障率';
|
var brdnObj=[{name:'电池故障',val:'100'},{name:'正常工作',val:'600'}];
|
//创建电池故障饼状图
|
createPie(brdnPie,brdnTle,brdnObj);
|
}
|
|
//生成电池故障修复率饼状图
|
var $repair=$('#content .pie-con .repair-pie'); //获取故障容器的jquery对象
|
if($repair.length!=0)
|
{
|
var repair=$repair.get(0); //将故障容器的jquery对象转化为dom对象
|
var repairPie=echarts.init(repair); //初始化表格容器
|
var repairTle='故障修复率';
|
var repairObj=[{name:'故障修复',val:'400'},{name:'未修复',val:'200'}];
|
//创建电池故障饼状图
|
createPie(repairPie,repairTle,repairObj);
|
}
|
//生成电池健康率
|
var $health=$('#content .pie-con .health-pie'); //获取故障容器的jquery对象
|
if($health.length!=0)
|
{
|
var health=$health.get(0); //将故障容器的jquery对象转化为dom对象
|
var healthPie=echarts.init(health); //初始化表格容器
|
var healthTle='电池健康率';
|
var healthObj=[{name:'健康电池',val:'200'},{name:'不健康电池',val:'500'}];
|
//创建电池故障饼状图
|
createPie(healthPie,healthTle,healthObj);
|
}
|
|
|
//生成电池未放电比例图
|
var $notdischarge=$('#content .discharge-test .test-pie'); //获取故障容器的jquery对象
|
if($notdischarge.length!=0){
|
notdischarge=$notdischarge.get(0)
|
var notdischargePie=echarts.init(notdischarge); //初始化表格容器
|
var notdischargeTle="未放电电池比例图";
|
notdischargePie.showLoading();
|
var notdischargeObj=[{name:'未放电电池',val:10},{name:'已放电电池',val:100}];
|
//创建电池故障饼状图
|
createPie(notdischargePie,notdischargeTle,notdischargeObj);
|
}
|
chartResize();
|
//让地图和饼状图随浏览器窗口的改变而改变
|
$(window).resize(function(){
|
chartResize();
|
});
|
|
function chartResize() {
|
if($map.length!=0)
|
{
|
mapChart.resize();
|
}
|
if($warn.length!=0)
|
{
|
warnPie.resize();
|
}
|
if($brdn.length!=0)
|
{
|
brdnPie.resize();
|
}
|
if($repair.length!=0)
|
{
|
repairPie.resize();
|
}
|
if($notdischarge.length!=0){
|
notdischargePie.resize();
|
}
|
}
|
}
|
|
|
function setCheckVal(){
|
//根据选择内容进行修改newMainArr和newChildArr
|
var $head=$('#main .piece-list .piece .piece-head');
|
var $Content=$('#main .piece-list .piece .piece-con');
|
var $Child=$('#main .piece-list .piece .piece-child input');
|
//遍历$head根据复选框进行修改主菜单内容
|
$head.each(function(i){
|
mainSqlArr[i].sublink="javascript:;";
|
if($(this).find('input').is(':checked'))
|
{
|
mainSqlArr[i].subflag=1;
|
}else{
|
mainSqlArr[i].subflag=0;
|
//console.info(mainSqlArr);
|
//console.info(allconfig);
|
}
|
});
|
//遍历$Content根据复选框进行修改子菜单内容
|
$Content.each(function(i){
|
//遍历复选框
|
if(childSqlArr[i].length>0) {
|
|
for(var k=0; k<childSqlArr[i].length;k++) {
|
console.info($(this).find('input').eq(k).val()+"="+childSqlArr[i][k].num);
|
var checkbox = $(this).find('input').eq(k);
|
if(checkbox.is(':checked')) {
|
childSqlArr[i][k].subflag=1;
|
}else {
|
childSqlArr[i][k].subflag=0;
|
}
|
}
|
}
|
|
});
|
//遍历$Child根据复选框修改子模块内容
|
$Child.each(function(i){
|
if($(this).is(':checked'))
|
{
|
moduleSqlArr[i].subflag=1;
|
}else{
|
moduleSqlArr[i].subflag=0;
|
}
|
});
|
}
|
|
var allconfig;
|
//查模块询所有的配置
|
function searchAllConfig(){
|
allconfig=new Array();
|
$.post('CustompageAction!searchAll',null,function(data){
|
var model=eval("("+data.result+")");
|
//console.info(model);
|
var newNavArr = new Array();
|
if(model.code==1){
|
allconfig=model.data;
|
|
for(var i=0;i<allconfig.length;i++){
|
allconfig[i].child = new Array();
|
allconfig[i].isAdd = false;
|
if(allconfig[i].subjudge==2){
|
newNavArr.push(allconfig[i]); //添加一级导航
|
allconfig[i].isAdd = true;
|
}
|
}
|
|
for(var i = 0;i<allconfig.length;i++){
|
if(allconfig[i].subjudge == 0 && allconfig[i].isAdd == false){
|
//console.info("%%%%%%");
|
for(var j = 0;j<newNavArr.length;j++){
|
//console.info(newNavArr[j].navigate_order+" =="+ allconfig[i].navigate_order);
|
if(newNavArr[j].navigate_order == allconfig[i].navigate_order){
|
newNavArr[j].child.push(allconfig[i]); //添加子模块
|
allconfig[i].isAdd = true;
|
break;
|
}
|
}
|
}
|
}
|
|
for(var i = 0;i<allconfig.length;i++){
|
if(allconfig[i].subjudge == 1 && allconfig[i].isAdd == false){
|
for(var j = 0;j<newNavArr.length;j++){
|
if(newNavArr[j].navigate_order == allconfig[i].navigate_order){
|
newNavArr[j].child.push(allconfig[i]); //添加二级导航
|
allconfig[i].isAdd = true;
|
break;
|
}
|
}
|
}
|
}
|
for(var i=0;i<allconfig.length;i++){
|
var flag = true;
|
if(allconfig[i].subjudge == 3 && allconfig[i].isAdd == false){
|
for(var j= 0;j<newNavArr.length && flag;j++){
|
for(var k=0;k<newNavArr[j].child.length && flag;k++){
|
//console.info(newNavArr[j].child[k].num +"=="+ allconfig[i].navigate_order);
|
if(newNavArr[j].child[k].num == allconfig[i].navigate_order){
|
newNavArr[j].child[k].child.push(allconfig[i]);
|
allconfig[i].isAdd == true;
|
flag = false;
|
}
|
}
|
}
|
}
|
}
|
console.info(newNavArr);
|
setModule(newNavArr);
|
//根据数组的0,1改变页面内容
|
setMenu(newNavArr);
|
}
|
});
|
}
|
|
$('#rightFloat .ensure').click(function(){
|
createAllMask($('body'),0.1);
|
loading.showLoading($('#main'));
|
if(allconfig!=undefined){
|
var temp = getListByCheckbox();
|
//console.info(allconfig);
|
var json=window.JSON.stringify(temp);
|
console.info(json);
|
$.post('CustompageAction!update','result='+json,function(data){
|
var model=eval("("+data.result+")");
|
myConfirm.show({
|
type: 'alert',
|
content: model.msg,
|
timeout: 2500,
|
fadeout: false
|
});
|
searchAllConfig();
|
$('body .mask').remove();
|
loading.hideLoading($('#main'));
|
}).error(function(){
|
loading.hideLoading($('#main'));
|
});
|
}
|
});
|
|
function getListByCheckbox(){
|
console.info($('#main .piece-list input[type="checkbox"]').length);
|
var temp = new Array();
|
$('#main .piece-list input[type="checkbox"]').each(function(){
|
console.info($(this).attr('disabled'));
|
temp.push({
|
num:$(this).val(),
|
subflag:$(this).is(':checked')?"1":"0",
|
subenable:$(this).attr('disabled')=='disabled'?1:0
|
});
|
});
|
return temp;
|
}
|
|
$('#rightFloat .out').click(function(){
|
$.ajax({
|
type: "post",
|
url: "LoginAction!exitVUser",
|
async:true,
|
dataType:'text',
|
data:null,
|
success: function(){
|
window.location.href="login.jsp";
|
}
|
});
|
});
|
|
|
var moduleSqlArr;
|
//给主菜单和子菜单数组赋值
|
function setMenu(){
|
mainSqlArr=new Array();
|
childSqlArr=new Array();
|
moduleSqlArr=new Array();
|
var main_index=-1;
|
var clild_index=-1;
|
//console.info('********');
|
//console.info(allconfig);
|
//console.info('********');
|
if(allconfig!=undefined && allconfig.length>0){
|
for(var i=0;i<allconfig.length;i++){
|
if(allconfig[i].subjudge==2){
|
mainSqlArr[++main_index]=allconfig[i];
|
childSqlArr[++clild_index]=new Array();
|
}else if(allconfig[i].subjudge==1){
|
childSqlArr[clild_index].push(allconfig[i]);
|
}else{
|
moduleSqlArr.push(allconfig[i]);
|
}
|
}
|
}
|
//creatrClildModel();
|
//根据数组的0,1改变页面内容
|
//changePage(mainSqlArr,childSqlArr);
|
}
|
|
$(document).ready(function(){
|
searchAllConfig();
|
checkVip();
|
});
|
|
//查询当前用户是否登陆以及检查当前用户是否在其他主机上登陆
|
function checkVip(){
|
$.post('LoginAction!checkVip',null,function(data,status){
|
var model=eval("("+data.result+")");
|
//console.info(model);
|
if(model.code==1){
|
alert(model.msg);
|
window.location.href="login.jsp";
|
}else{
|
setTimeout(checkVip,1000);
|
}
|
//alert(status);
|
});
|
}
|
|
function changeContentCheck(ele){
|
var isReadOnly=ele.parent().hasClass('read-only');
|
if(isReadOnly)
|
{
|
return;
|
}
|
var flag=ele.is(':checked');
|
if(flag)
|
{
|
ele.parent().removeClass('not-opt');
|
}else{
|
ele.parent().addClass('not-opt');
|
}
|
}
|
|
//改变内容的状态
|
function changeContent(ele){
|
var isReadOnly=ele.parent().hasClass('read-only');
|
if(isReadOnly)
|
{
|
return;
|
}
|
var flag=ele.next('input').is(':checked');
|
if(flag)
|
{
|
ele.next('input').prop('checked',false);
|
ele.parent().addClass('not-opt');
|
}else{
|
ele.next('input').prop('checked',true);
|
ele.parent().removeClass('not-opt');
|
}
|
}
|
|
//创建子模块
|
function creatrClildModel(){
|
//根据moduleSqlArr创建内容
|
var $Content=$('#main .piece-list .piece .piece-child');
|
$Content.text('');
|
var __ul=$('<ul></ul>');
|
var __specialUl=$('<ul></ul>');
|
var __li=new Array();
|
//根据moduleSqlArr[i].subflag和moduleSqlArr[i].subenable判断是否显示或者可写
|
for(var i=0;i<moduleSqlArr.length;i++)
|
{
|
var __span=$('<span>'+moduleSqlArr[i].subname+'</span>');
|
if(moduleSqlArr[i].subenable==1)
|
{
|
__li[i]=$('<li class="read-only"></li>');
|
var __input=$('<input type="checkbox" value="'+moduleSqlArr[i].num+'" disabled="disabled" checked="checked"/>"');
|
}else if(moduleSqlArr[i].subflag==1){
|
__li[i]=$('<li></li>');
|
var __input=$('<input type="checkbox" value="'+moduleSqlArr[i].num+'" checked="checked"/>');
|
}else if(moduleSqlArr[i].subflag==0){
|
__li[i]=$('<li class="not-opt"></li>');
|
var __input=$('<input type="checkbox" value="'+moduleSqlArr[i].num+'" />"');
|
}
|
__li[i].append(__span);
|
__li[i].append(__input);
|
if(i<Math.ceil(moduleSqlArr.length/2))
|
{
|
__ul.append(__li[i]);
|
}else{
|
__specialUl.append(__li[i]);
|
}
|
}
|
$Content.append(__ul);
|
$Content.append(__specialUl);
|
//点击文本或点击input修改文本内容
|
$('#main .piece-list .piece .piece-child').on('click','ul li span',function(){
|
changeContent($(this));
|
});
|
$('#main .piece-list .piece .piece-child').on('click','ul li input',function(){
|
changeContentCheck($(this));
|
});
|
}
|
|
//生成整体遮罩层()
|
function createAllMask(ele,opcy){
|
var __Ht=ele.height();
|
var __div=$('<div class="mask"></div>');
|
ele.prepend(__div);
|
//定义遮罩层的样式
|
ele.children('.mask').css({
|
// 'display':'block',
|
'position':'absolute',
|
'width':'100%',
|
'height':__Ht+'px',
|
'left':'0',
|
'top':'0',
|
'z-index':'9999999',
|
'opacity':opcy,
|
'background-color':'#000'
|
});
|
}
|
|
/**
|
* 创建中的模板
|
* @param object moduleItems 所有的模板数据
|
*/
|
function setModule(moduleItems) {
|
console.info(moduleItems);
|
var pieceList = $('#main .piece-list');
|
pieceList.text(" ");
|
// 第一层内容
|
for(var i = 0; i < moduleItems.length; i++) {
|
var piece = $('<div class="piece"></div>');
|
var pieceHeader;
|
if(moduleItems[i].subenable == 1) {
|
pieceHeader = $('<div class="piece-head read-only"></div>');
|
}else {
|
pieceHeader = $('<div class="piece-head"></div>');
|
|
}
|
var span = $('<span>'+moduleItems[i].subname+'</span>');
|
var input = getCheckbox({
|
checked:moduleItems[i].subflag,
|
disabled:moduleItems[i].subenable,
|
num: moduleItems[i].num
|
});
|
pieceHeader.append(span);
|
pieceHeader.append(input);
|
piece.append(pieceHeader);
|
|
var pieceContent = $('<div class="piece-con piece-content"></div>');
|
var ul = $('<ul></ul>'); // 定义子目录的列表容器
|
var ul_special = $('<ul></ul>'); // 定义子目录的列表容器
|
// 第二层内容
|
for(var k = 0; k < moduleItems[i].child.length; k++) {
|
var li = getLi({
|
disabled: moduleItems[i].child[k].subenable,
|
checked: moduleItems[i].child[k].subflag,
|
subname: moduleItems[i].child[k].subname,
|
num: moduleItems[i].child[k].num
|
});
|
if(k > moduleItems[i].child.length/2 && moduleItems[i].child.length > 4) {
|
ul_special.append(li);
|
}else {
|
ul.append(li);
|
}
|
|
// 第三层内容
|
for(var j = 0; j < moduleItems[i].child[k].child.length; j++) {
|
var liChild = getLi({
|
disabled: moduleItems[i].child[k].child[j].subenable,
|
checked: moduleItems[i].child[k].child[j].subflag,
|
subname: moduleItems[i].child[k].child[j].subname,
|
num: moduleItems[i].child[k].child[j].num
|
});
|
ul_special.append(liChild);
|
}
|
|
}
|
pieceContent.append(ul);
|
if(moduleItems[i].child.length > 4) {
|
pieceContent.addClass('piece-content-special');
|
pieceContent.append(ul_special);
|
}
|
piece.append(pieceContent);
|
|
if(i%3 == 0 && i !=0) {
|
pieceList.append($('<div class="clear"></div>'));
|
}
|
pieceList.append(piece);
|
}
|
pieceList.append($('<div class="clear"></div>'));
|
}
|
|
|
/**
|
* 获取模板中的li
|
* @param object obj 确定li是否被选中和是否可以更改
|
* @return {[type]} [description]
|
*/
|
function getLi (obj) {
|
var result = $('<li><span>'+obj.subname+'</span><input type="checkbox" checked="checked" value="'+obj.num+'"/></li>');
|
if (obj.checked && obj.disabled) {
|
result = $('<li class="read-only"><span>'+obj.subname+'</span><input type="checkbox" checked="checked" disabled="disabled" value="'+obj.num+'"/></li>');
|
}else if (obj.checked && !obj.disabled){
|
result = $('<li><span>'+obj.subname+'</span><input type="checkbox" checked="checked" value="'+obj.num+'"/></li>');
|
}else if (!obj.checked && obj.disabled) {
|
result = $('<li class="read-only not-opt"><span>'+obj.subname+'</span><input type="checkbox" disabled="disabled" value="'+obj.num+'"/></li>');
|
}else {
|
result = $('<li class="not-opt"><span>'+obj.subname+'</span><input type="checkbox" value="'+obj.num+'"/></li>');
|
}
|
|
return result;
|
}
|
|
/**
|
* 获取input
|
* @param object obj 确定input是否被选中和是否可以更改
|
* @return object result 返回指定的input对象
|
*/
|
function getCheckbox(obj) {
|
var result = $('<input type="checkbox" />');
|
if(obj.checked && obj.disabled) {
|
result = $('<input type="checkbox" checked="checked" disabled="disabled" value="'+obj.num+'" />');
|
}else if(obj.checked && !obj.disabled) {
|
result = $('<input type="checkbox" checked="checked" value="'+obj.num+'"/>');
|
}else if(!obj.checked && obj.disabled) {
|
result = $('<input type="checkbox" disabled="disabled" value="'+obj.num+'"/>');
|
}else {
|
result = $('<input type="checkbox" value="'+obj.num+'"/>');
|
}
|
return result;
|
}
|
|
/* 点击配置项的子模块 */
|
function changeHeaderStats(ele) {
|
// 根据点击的子模块ele获取piece-con和piece-head
|
var pieceCon = ele.parent().parent().parent();
|
var pieceHead = pieceCon.siblings('.piece-head');
|
var iptsCon = pieceCon.find('li input');
|
var flag = false;
|
|
// 遍历子模块内容
|
for(var i=0; i<iptsCon.length; i++) {
|
if(iptsCon.eq(i).is(':checked')) {
|
flag = true;
|
}
|
}
|
|
// 只能对于主导航为非只读模式的进行操作
|
if(!pieceHead.hasClass('read-only')) {
|
// 子模块全部被关闭，主导航也将被关闭
|
if(!flag) {
|
pieceHead.addClass('not-opt'); // 给主导航添加不被选择的class
|
pieceHead.find('input').prop('checked', false); // 主导航的复选框不被勾选
|
}
|
}
|
}
|
|
|
function changConStats(ele) {
|
// 根据点击的子模块ele获取piece-con和piece-head
|
var pieceHead = ele.parent();
|
var pieceCon = pieceHead.siblings('.piece-con');
|
var iptsCon = pieceCon.find('li input');
|
var flag = false;
|
|
// 遍历子模块内容
|
for(var i=0; i<iptsCon.length; i++) {
|
if(iptsCon.eq(i).is(':checked')) {
|
flag = true;
|
}
|
}
|
|
// 只能对于主导航为非只读模式的进行操作
|
if(!pieceHead.hasClass('read-only')) {
|
// 子模块全部被关闭，主导航也将被关闭
|
if(!flag) {
|
pieceHead.addClass('not-opt'); // 给主导航添加不被选择的class
|
pieceHead.find('input').prop('checked', false); // 主导航的复选框不被勾选
|
myConfirm.show({
|
type:'alert',
|
content: '<p style="color:#FF0000; font-size: 18px">请添加一个子模块</p>',
|
timeout: 2500,
|
fadeout: false
|
});
|
}
|
}
|
}
|
// 子导航位置配置模块
|
;(function($, window, document, gl, undefined) {
|
// 导航配置
|
gl.namespace('Nav');
|
|
searchNav();
|
function searchNav() {
|
// 请求后台获取导航数据
|
$.ajax({
|
type: "post",
|
url: "CustompageAction!searchAll",
|
async:true,
|
dataType:'text',
|
data:null,
|
success: function(rs){
|
rs = eval('('+rs+')');
|
var model = eval('('+rs.result+')')
|
if(model.code == 1) {
|
var data = formater(model.data);
|
//console.log(data);
|
createPanels($('#navSort .navSort-content-item'), data);
|
}
|
}
|
});
|
}
|
|
// 格式化导航数据
|
function formater(data) {
|
var nav = [];
|
// 获取所有的一级导航
|
for(var i=0;i<data.length; i++) {
|
if(data[i].subjudge == 2) {
|
data[i].child = [];
|
nav.push(data[i]);
|
}
|
}
|
// 根据一级导航获取二级导航
|
for(var k=0; k<data.length; k++) {
|
if(data[k].subjudge == 1) {
|
var _data = data[k];
|
var _order = _data.navigate_order;
|
for(var i=0; i<nav.length;i++) {
|
var _nav = nav[i];
|
if(_nav.navigate_order == _order) {
|
_data.child=[];
|
_nav.child.push(data[k]);
|
break;
|
}
|
}
|
}
|
}
|
|
// 添加三级导航
|
for(var k=0; k<data.length; k++) {
|
if(data[k].subjudge == 3) {
|
var _data = data[k];
|
var _order = _data.navigate_order;
|
for(var i=0; i<nav.length;i++) { // 遍历一级导航
|
var _nav = nav[i];
|
for(var j=0; j<_nav.child.length; j++) { // 遍历二级导航
|
var _navChild = _nav.child[j];
|
if(_order == _navChild.num) {
|
_data.child=[];
|
_navChild.child.push(_data);
|
break;
|
}
|
}
|
}
|
}
|
}
|
console.info(nav);
|
// 返回解析结果
|
return nav;
|
}
|
|
// 循环遍历data生成内容
|
function createPanels(container, data) {
|
// 清除容器内容
|
container.text(" ");
|
var k = 0;
|
// 遍历data数据生成内容
|
for(var i=0;i<data.length; i++) {
|
if(data[i].child.length>0) {
|
createPanel(container.eq(k), data[i], true);
|
k++;
|
if(k == 3) {
|
k=0;
|
}
|
}
|
}
|
$('.panel-content .sortable').sortable({
|
//connectWith:'.panel-content .sortable'
|
});
|
}
|
|
|
function createPanel(container, data, fl) {
|
// 存在子导航生成panel
|
if(data.child.length>0) {
|
var panel = $('<div class="panel panel-auto w mt5"></div>');
|
|
var panelHeader = $('<div class="panel-header panel-header-default fb"></div>');
|
var panelTitle = $('<span class="panel-header-title">'+data.subname+'</span>');
|
var tools = fl?'<i class="fa fa-plus panel-add mr5" title="添加"></i><i class="fa fa-save panel-save mr5" title="保存"></i><i class="fa fa-refresh panel-refresh" title="刷新"></i>':'<i class="fa fa-plus panel-add" title="添加"></i>'
|
var panelTools = $('<div class="panel-header-tools fr mr10 f16">'+tools+'</div>');
|
panelHeader.data('attr', data);
|
|
panelHeader.append(panelTitle);
|
panelHeader.append(panelTools);
|
panel.append(panelHeader);
|
|
var panelContent = $('<div class="panel-content pl10 pr10 panel-content-default"></div>');
|
|
createList(panelContent, data);
|
|
panel.append(panelContent);
|
// 添加到容器中
|
container.append(panel);
|
}
|
}
|
|
// 生成列表并添加到容器中
|
function createList(container, data) {
|
// 清空容器
|
container.text(" ");
|
var _ul = $('<ul class="sortable list list-default"></ul>');
|
for(var i=0; i<data.child.length; i++) {
|
var _child = data.child[i], _li;
|
// 存在子导航
|
if(_child.child.length>0) {
|
_li = $('<li class="noStyle"></li>');
|
createPanel(_li, _child);
|
}else {
|
_li = $('<li>'+_child.subname+'</li>');
|
}
|
_li.data('attr', _child);
|
_ul.append(_li);
|
}
|
|
container.append(_ul);
|
}
|
|
// 显示
|
function show() {
|
$('#navSort').show();
|
$('#navSortShadow').show();
|
}
|
// 隐藏
|
function hide() {
|
$('#navSort').hide();
|
$('#navSortShadow').hide();
|
}
|
// 绑定到命名空间中
|
gl.Nav.show = show;
|
gl.Nav.hide = hide;
|
|
// 构造查询对象
|
function searchData(list) {
|
var rs = [];
|
// 遍历li
|
list.each(function() {
|
var tmp = {
|
num: $(this).data('attr').num,
|
page_order: $(this).index()+1
|
};
|
rs.push(tmp);
|
});
|
|
return rs;
|
}
|
// 绑定到命名空间中
|
gl.Nav.searchData = searchData;
|
|
function updateNav(list){
|
loading.showLoading();
|
$.ajax({
|
type: "post",
|
url: "CustompageAction!updateOrder",
|
async:true,
|
dataType:'json',
|
data:"result = "+JSON.stringify(list),
|
success: function(data){
|
loading.hideLoading();
|
var model = eval('('+data.result+')');
|
console.info(model);
|
if(model.code == 1) {
|
myConfirm.show({
|
type: 'alert',
|
content: model.msg,
|
timeout: 2500,
|
fadeout: false
|
});
|
searchAllConfig();
|
}else {
|
myConfirm.show({
|
type: 'alert',
|
content: model.msg,
|
timeout: 2500,
|
fadeout: false
|
});
|
}
|
},
|
error:function(){
|
loading.hideLoading();
|
myConfirm.show({
|
type: 'alert',
|
content: '修改失败',
|
timeout: 2500,
|
fadeout: false
|
});
|
}
|
});
|
}
|
// 绑定到命名空间中
|
gl.Nav.updateNav = updateNav;
|
|
// 绑定到命名空间中
|
gl.Nav.refreshNav = createList;
|
|
})(jQuery, window, document, GLOBAL);
|
|
// 导航配置模块
|
$(function() {
|
var nav = GLOBAL.Nav;
|
// 点击保存
|
$('#navSort').on('click', '.panel-save', function() {
|
var panel = $(this).parent().parent().parent();
|
var ul = panel.find('.panel-content').children('ul');
|
var serchData = nav.searchData(ul.find('li'));
|
//console.info(serchData);
|
nav.updateNav(serchData);
|
});
|
|
// 点击刷新
|
$('#navSort').on('click', '.panel-refresh', function() {
|
var panel = $(this).parent().parent();
|
var attr = panel.data('attr');
|
console.info(attr);
|
var container = panel.siblings('.panel-content');
|
nav.refreshNav(container, attr);
|
// 定义可以拖动
|
container.find('.sortable').sortable();
|
});
|
|
// 添加
|
$('#navSort').on('click', '.panel-add', function() {
|
var panel = $(this).parent().parent();
|
var attr = panel.data('attr');
|
var subjudge = attr.subjudge == 1?3:1;
|
var navigate_order = attr.subjudge == 1?attr.num: attr.navigate_order;
|
var navigate = attr.subjudge == 1?attr.child[0].navigate: attr.navigate;
|
myConfirm.show({
|
title: '添加页面',
|
type: 'confirm',
|
content: addPage(navigate_order, subjudge, attr.child.length+1, navigate),
|
'class': 'show',
|
setContent: true,
|
enhide:false,
|
enfun:searchParams,
|
enparams: [panel]
|
});
|
});
|
|
// 添加页面
|
function addPage(order, subjudge, num, navigate) {
|
var str = '<div id="addPage" class="addPage">'
|
str +='<span class="addPage-iptName">页面名称:</span><input type="text" id="addPage-pageName" class="mt5"><br>';
|
str +='<span class="addPage-iptName">文件名称:</span><input type="text" id="addPage-fileName" class="mt5"><br>';
|
str +='<span class="addPage-iptName">国际名称:</span><input type="text" id="addPage-english" class="mt5 mb10"><br>';
|
str +='<span class="addPage-iptName">是否显示:</span><input type="checkbox" id="addPage-isShow" class="mr50" checked="checked">';
|
str +='<span class="addPage-iptName">是否可配置:</span><input type="checkbox" id="addPage-isChange"><br>';
|
str +='<input type="hidden" id="addPage-order" value='+order+'>';
|
str +='<input type="hidden" id="addPage-subjudge" value='+subjudge+'>';
|
str +='<input type="hidden" id="addPage-num" value='+num+'>';
|
str +='<input type="hidden" id="addPage-navigate" value='+navigate+'>';
|
str += '</div>';
|
return str;
|
}
|
|
// 构造查询条件
|
function searchParams(panel) {
|
var isReturn = false;
|
$('#addPage').find('input[type=text]').each(function() {
|
if($(this).val().trim().length == 0) {
|
isReturn = true;
|
}
|
});
|
|
// 如果有空值
|
if(isReturn) {
|
alert('存在空值,无法添加!');
|
return;
|
}
|
|
var tmp = {
|
navigate_order: $('#addPage-order').val(), // 页面所属上一级导航
|
page_order: $('#addPage-num').val(), // 页面的位置
|
subname: $('#addPage-pageName').val(), // 页面名称
|
sublink: $('#addPage-fileName').val(), // 文件的名称
|
submenu: $('#addPage-english').val(), // 国际化内容
|
subjudge: $('#addPage-subjudge').val(), // 菜单类型
|
navigate: $('#addPage-navigate').val(),
|
subflag: $('#addPage-isShow').is(':checked')?1:0, // 是否显示
|
subenable: $('#addPage-isChange').is(':checked')?1:0 // 是否可更改
|
};
|
// 判断是否添加
|
if(confirm('是否添加'+tmp.subname+'(文件名:'+tmp.sublink+')页面')) {
|
addPages(panel, tmp);
|
}
|
}
|
|
// 添加页面
|
function addPages(panel, temp) {
|
loading.showLoading();
|
// 请求添加
|
$.ajax({
|
type: "post",
|
url: "CustompageAction!add",
|
async:true,
|
dataType:'json',
|
data:"result = "+JSON.stringify(temp),
|
success: function(data){
|
loading.hideLoading();
|
var model = eval('('+data.result+')');
|
if(model.code == 1) {
|
myConfirm.hide();
|
console.info(temp.navigate);
|
setNewNav(panel, temp.navigate);
|
alert(model.msg);
|
}else {
|
alert(model.msg);
|
}
|
},
|
error:function(){
|
loading.hideLoading();
|
alert(model.msg);
|
}
|
});
|
}
|
|
// 设置最新导航内容
|
function setNewNav(panel, navigate) {
|
var temp = {
|
navigate: navigate
|
};
|
// 请求更新
|
$.ajax({
|
type: "post",
|
url: "CustompageAction!serchByInfo",
|
async:true,
|
dataType:'json',
|
data:"result = "+JSON.stringify(temp),
|
success: function(data){
|
loading.hideLoading();
|
var model = eval('('+data.result+')');
|
if(model.code == 1) {
|
var panelAttr = panel.data('attr');
|
var page_order = panelAttr.page_order
|
var data = model.data;
|
// 初始化panel的子导航的值
|
panelAttr.child = [];
|
for(var i=0; i<data.length; i++) {
|
if(data[i].page_order != 0) {
|
data[i].child= [];
|
panelAttr.child.push(data[i]);
|
}
|
}
|
console.log(panel.data('attr'));
|
var attr = panel.data('attr');
|
var container = panel.siblings('.panel-content');
|
nav.refreshNav(container, attr);
|
// 定义可以拖动
|
container.find('.sortable').sortable();
|
searchAllConfig();
|
}
|
},
|
error:function(){
|
loading.hideLoading();
|
alert(model.msg);
|
}
|
});
|
}
|
});
|
</script>
|
<script type="text/javascript" src="js/buildNav.js"></script>
|
</html>
|
