<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="js/bootstrap/css/bootstrap.css" /> <link rel="stylesheet" href="js/bootstrap-table/bootstrap-table.min.css" /> <link rel="stylesheet" href="js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css" /> <link rel="stylesheet" href="js/bootstrap-select/css/bootstrap-select.min.css" /> <link rel="stylesheet" href="js/zselect/zselect.css" /> <link rel="stylesheet" href="js/scroller/css/nicescroll.css" /> <link rel="stylesheet" href="js/zTree_v3/css/zTreeStyle/zTreeStyle.css" /> <link rel="stylesheet" href="js/puck-1.0.0/css/puck.css" /> <style type="text/css"> /*背景色*/ body{ background:#fafafa; } /*固定头部*/ #fixedTop{ position:fixed; top:0px; background:#6085FF; width:100%; height: 60px; line-height: 65px; padding:0 20px; /*z-index: 1030;*/ } /*logo样式*/ .logo{ background-image: url('image/logo.png'); width:40px; height: 40px; position:relative; top:50%; transform: translateY(-50%); background-repeat: no-repeat; background-position: 50% 50%; float:left; } /*标题样式*/ .systemName{ float:left; font-size: 18px !important; color:#ffffff; margin-left:10px; } /*content左右边距*/ @media(min-width: 768px) { .content{ left:0px; right: 0px; } } @media(min-width: 992px) { .content{ left:50px; right: 50px; } } @media(min-width: 1200px) { .content{ left:200px; right: 200px; } } /*content样式*/ .content{ top: 60px; position:absolute; background:#ffffff; bottom:0px; padding:20px; } /*table头部样式*/ #table0 thead { background:#fafafa; } /*操作按钮样式(查看,修改,删除)*/ .operator-button { display: inline-block; width: 30px; } /*按钮样式*/ .btn-hik-primary{ color: #fff; background-color: #2080f7; border-color: #2080f7; width:96px; height: 32px; display: inline-block; line-height: 1; white-space: nowrap; cursor: pointer; border: 1px solid #ccc; border-color: #e5e5e5; -webkit-appearance: none; text-align: center; box-sizing: border-box; outline: none; font-weight: 700; margin: 0; transition: all .2s; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; text-align: center; font-size: 12px; border-radius: 2px; } /*label文字不加粗*/ label{ font-weight: normal; } /*th文字不加粗*/ th{ font-weight: normal; } /*立刻执行按钮样式*/ .execute-icons{ color: green; margin-top: 5px; margin-left:20px; } /*立刻删除按钮样式*/ .stop-icons{ color: red; margin-top: 5px; margin-left:20px; } /*左对齐*/ .align-left{ text-align: left !important; font-weight: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /*正常图标样式*/ .icon-normal{ transform: rotate(0); -webkit-transform: rotate(0); transition: transform .3s; } /*翻转图标样式*/ .icon-inverse{ transform: rotate(180deg); -webkit-transform: rotate(180deg); transition: transform .3s; } /* */ .form-horizontal .form-group{ margin-right: 0; margin-left: 0; } /*弹出层居中*/ .modal { text-align: center; } @media screen and (min-width: 768px) { .modal:before { display: inline-block; vertical-align: middle; content: " "; height: 100%; } } .modal-dialog { display: inline-block; text-align: left; vertical-align: middle; } /*修改默认panel-heading 样式*/ .panel-heading{ background:#DDDDDD !important; } /* 修改默认panel-body 样式 */ .panel-body{ background: #F2F2F2; padding: 10px 0; } .form-horizontal .control-label{ padding-right: 0px; } </style> </head> <body style="background:#fbfbfb"> <div id="fixedTop"> <div class="logo"></div> <div class="systemName" >测试使用</div> </div> <div class="content"> <div id="toolbar"> <div class="btn-group"> <button class="btn-hik-primary" id="toolbar_add"> <span>新增</span> </button> </div> </div> <table id="table0"></table> </div> <div class="modal fade" id="row-view" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document" style="width:1200px;"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title" id="myModalLabel-view"> 计划查看 <a href="#" style="float:right;" data-dismiss="modal"><img src="image/close.png" style="height: 20px;width:20px;" aria-hidden="true"></a> </h4> </div> <div class="modal-body" style="overflow-y: auto;height: 700px;"> <form class="form-horizontal" role="form" > <div class="form-group"> <label class="col-md-2 control-label">计划名称:</label> <label class="col-md-2 control-label align-left" name="name"></label> <label class="col-md-1 control-label">开始日期:</label> <label class="col-md-2 control-label align-left" name="begindate"></label> <label class="col-md-1 control-label">结束日期:</label> <label class="col-md-3 control-label align-left" name="enddate"></label> </div> <div id="timeZone-view"></div> </form> </div> </div> </div> </div> <div class="modal fade" id="row-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document" style="width:1200px;"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title" id="myModalLabel-edit"> 计划新增/修改 <a href="#" style="float:right;" data-dismiss="modal"><img src="image/close.png" style="height: 20px;width:20px;" aria-hidden="true"></a> </h4> </div> <div class="modal-body" style="overflow-y: auto;height: 700px;"> <form class="form-horizontal" role="form"> <div class="form-group plan"> <input class="form-control" id="planID" type="text" style="display: none" > <label class="col-md-2 control-label">计划名称:</label> <div class="col-md-2"> <input class="form-control" id="name" type="text" required="required"> </div> <label class="col-md-1 control-label">开始日期:</label> <div class="col-md-2"> <input class="form-control datePicker" id="begindate" type="text" required="required"> </div> <label class="col-md-1 control-label">结束日期:</label> <div class="col-md-2"> <input class="form-control datePicker" id="enddate" type="text" required="required"> </div> <div class="col-md-2"> <button id="timeAdd" type="button" class="btn-hik-primary time-add">新增时间段</button> </div> </div> <div id="timeZone-edit"></div> </form> </div> <div class="modal-footer"> <button type="button" id="btn_submit" class="btn-hik-primary" style="margin-right: 100px;" data-dismiss="modal">保存</button> </div> </div> </div> </div> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.rotate.js"></script> <script type="text/javascript" src="js/bootstrap/js/bootstrap.min.js"></script> <script type="text/javascript" src="js/bootstrap-table/bootstrap-table.min.js"></script> <script type="text/javascript" src="js/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script> <script type="text/javascript" src="js/bootstrap-datetimepicker/js/moment.js"></script> <script type="text/javascript" src="js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script> <script type="text/javascript" src="js/bootstrap-datetimepicker/js/zh-cn.js"></script> <script type="text/javascript" src="js/bootstrap-select/js/bootstrap-select.js"></script> <script type="text/javascript" src="js/bootstrap-select/js/i18n/defaults-zh_CN.min.js"></script> <script type="text/javascript" src="js/zselect/zselect.js" ></script> <script type="text/javascript" src="js/scroller/jquery.nicescroll.js" ></script> <script type="text/javascript" src="js/zTree_v3/js/jquery.ztree.all-3.5.js" ></script> <script type="text/javascript"> var sfs = []; var kkTree = {}; $(function(){ $(".datePicker").datetimepicker({ locale: moment.locale('zh-cn'), format: 'YYYY-MM-DD' }); $.ajax({ url: "szAlg", method:'get', success: function(data) { sfs = JSON.parse(data); } }); $('#table0').bootstrapTable({ columns: [{ field: "name", title: '计划名称', valign: "middle", align: "center" }, { field: "begindate", title: '开始日期', valign: "middle", align: "center", }, { field: "enddate", title: '结束日期', valign: "middle", align: "center" }, { field: "operate", title: "操作", align: "center", valign: "middle", formatter: operateFormatter, edit: false }, ], classes:"table table-no-bordered", url: 'szAlgSched', rowStyle: function (row, index) { if(index % 2 == 0){ return {css:{'background':'#ffffff'}} }else{ return {css:{'background':'#fafafa'}} } }, method:'get', idField: "id", pagination: true, sidePagination: 'client', // searchOnEnterKey: true, pageList: [5,10,50], toolbar: "#toolbar", }); }) function operateFormatter(value, row, index) { return [ "<a class=\"operator-button\" href='javascript:viewRow(" + index + ")' title=\"查看\">", "<img src='image/search.png'>", "</a> ", "<a class=\"operator-button\" href='javascript:editRow(" + index + ")' title=\"修改\">", "<img src='image/edit.png'>", "</a> ", "<a class=\"operator-button\" href='javascript:removeRow(" + index + ")' title=\"删除\">", "<img src='image/trashcan.png'>", "</a> ", ].join(''); }; function viewRow(index) { $("#timeZone-view").html(''); $("#row-view label[name='name']").text(''); $("#row-view label[name='begindate']").text(''); $("#row-view label[name='enddate']").text(''); var planid = $("#table0").bootstrapTable('getData')[index].id; $.ajax({ url: "szAlgSched/"+planid, success: function(data) { data = JSON.parse(data); $("#row-view label[name='name']").text(data.name); $("#row-view label[name='begindate']").text(data.begindate); $("#row-view label[name='enddate']").text(data.enddate); var html = []; $.each(data.timeZone, function(index,item) { html.push('<div class="panel panel-default"> '); html.push(' <div class="panel-heading">'); html.push(' <h3 class="panel-title">时间段('+item.begintime+"-"+item.endtime+")"); html.push(' <a href="javascript:void(0)" title="立刻执行"><span class="glyphicon glyphicon-play execute-icons" name="executeImmediate" ><input name="timeZoneID" value="'+item.id+'" style="display:none" /></span></a>'); html.push(' <a href="javascript:void(0)" title="立刻停止"><span class="glyphicon glyphicon-stop stop-icons" name="stopImmediate" ></span></a>'); html.push(' <a href="#" style="float:right;text-decoration:none;" name="toggleBody"><span class="glyphicon glyphicon-chevron-down icon-normal" style="display: inline-block"></span></a>'); html.push(' </h3>'); html.push(' </div>'); html.push(' <div class="panel-body timeZoneDiv" >'); html.push(' <div class="form-group">'); html.push(' <label class="col-md-2 control-label">开始时间:</label>'); html.push(' <label class="col-md-2 control-label align-left" >' + item.begintime + '</label>'); html.push(' <label class="col-md-1 control-label">结束时间:</label>'); html.push(' <label class="col-md-2 control-label align-left" >' + item.endtime + '</label>'); html.push(' <label class="col-md-1 control-label">卡口:</label>'); html.push(' <label title="'+item.crossingname+'" class="col-md-3 control-label align-left" >' + item.crossingname + '</label>'); html.push(' <h5 class="page-header"></h5>'); $.each(item.sf, function(index, item) { html.push(' <div class="form-group sf">'); html.push(' <label class="col-md-2 control-label">厂商:</label>'); html.push(' <label class="col-md-2 control-label align-left" >' + item.vendorname + '</label>'); html.push(' <label class="col-md-1 control-label">算法:</label>'); html.push(' <label class="col-md-2 control-label align-left" >' + item.name + '</label>'); html.push(' <label class="col-md-1 control-label">违法业务:</label>'); var alarmName = ""; var alarms = ""; if(item.alarm != null){ alarms = item.alarm.split(","); $.each(alarms, function(index, item) { temp = (item == 1) ? "大货车闯禁行" : "危险品车闯禁行"; alarmName = alarmName + "," + temp; }); alarmName = alarmName.substring(1); } html.push(' <label class="col-md-3 control-label align-left" >' + alarmName + '</label>'); html.push(' </div>'); }); html.push(' </div>'); html.push(' </div>'); html.push('</div>'); }); $("#timeZone-view").append(html.join('')); toggleBodyListener(); executeImmediateListener(); } }); $("#row-view").modal({backdrop: 'static', keyboard: false}).on("shown.bs.modal",function () { }); }; function executeImmediateListener(){ $("[name='executeImmediate']").click(function(){ var id = $(this).children("[name='timeZoneID']").val(); $.ajax({ url:"executeTimeTasks/"+id, success:function(data){ data = JSON.parse(data); if(data.ecode == 0){ alert("任务已启动"); }else{ alert("任务启动错误,错误原因:"+data.msg); } }, err:function(){ alert("任务启动错误,错误原因:未知"); } }); }); $("[name='stopImmediate']").click(function(){ $.ajax({ url:"stopTimeTasks/", success:function(data){ data = JSON.parse(data); if(data.ecode == 0){ alert("任务已停止"); }else{ alert("任务启动错误,错误原因:"+data.msg); } }, err:function(){ alert("任务停止错误,错误原因:未知"); } }); }); } function toggleBodyListener(){ $("[name = 'toggleBody']").unbind('click').click(function(){ if($(this).children(".glyphicon-chevron-down").hasClass("icon-inverse")){ $(this).children(".glyphicon-chevron-down").removeClass("icon-inverse") }else{ $(this).children(".glyphicon-chevron-down").addClass("icon-inverse") } $(this).parents(".panel-default").find(".panel-body").slideToggle(); }); }; $("#toolbar_add").click(function() { $("#planID").val(-1); $("#name").val(""); $("#begindate").val(""); $("#enddate").val(""); $("#timeZone-edit").html(''); $("#row-edit").modal().on("shown.bs.modal"); timeAddListener(); $("#table0").bootstrapTable('refresh'); }); function editRow(index) { $("#planID").val(-1); $("#name").val(""); $("#begindate").val(""); $("#enddate").val(""); $("#timeZone-edit").html(''); var planid = $("#table0").bootstrapTable('getData')[index].id; $.ajax({ url: "szAlgSched/"+planid, success: function(data) { data = JSON.parse(data); $("#planID").val(planid); $("#name").val(data.name); $("#begindate").val(data.begindate); $("#enddate").val(data.enddate); var html = []; $.each(data.timeZone, function(index, item) { html.push('<div class="panel panel-default"> '); html.push(' <div class="panel-heading">'); html.push(' <h3 class="panel-title">时间段'); // html.push(' <a href="javascript:void(0)" title="删除时间段"><span class="glyphicon glyphicon-remove-circle delete-icons delete-timezone" name="executeImmediate" ></span></a>'); html.push(' <a href="javascript:void(0)" title="删除时间段" style="margin-left:934px;"><img src="image/trashcan.png" class="delete-timezone"></img> </a>'); // html.push(' <a href="#" style="float:right;text-decoration:none" name="toggleBody">>></a>'); html.push(' <a href="#" style="float:right;text-decoration:none" name="toggleBody"><span class="glyphicon glyphicon-chevron-down icon-normal"></span></a>'); html.push(' </h3>'); html.push(' </div>'); html.push(' <div class="panel-body timeZoneDiv" >'); html.push(' <div class="form-group timeZone">'); html.push(' <label class="col-md-2 control-label">开始时间:</label>'); html.push(' <div class="col-md-2">'); html.push(' <input class="form-control datetimePicker" name="begintime" type="text" value=' + item.begintime + '>'); html.push(' </div>'); html.push(' <label class="col-md-1 control-label">结束时间:</label>'); html.push(' <div class="col-md-2">'); html.push(' <input class="form-control datetimePicker" name="endtime" type="text" value=' + item.endtime + '>'); html.push(' </div>'); html.push(' <label class="col-md-1 control-label">卡口:</label>'); html.push(' <div class="col-md-2">'); html.push(' <input class="form-control" id="crossing'+index+'" name="crossingid" type="text" >'); html.push(' </div>'); html.push(' <div class="col-md-2">'); html.push(' <button type="button" class="btn-hik-primary sf-add level-3">新增算法</button>'); html.push(' </div>'); html.push(' <h5 class="page-header level-2"></h5>'); $.each(item.sf, function(value, item, index) { html.push(' <div class="form-group sf">'); html.push(' <label class="col-md-2 control-label">厂商:</label>'); html.push(' <div class="col-md-2">'); html.push(' <select class="form-control vendorSelect" name="vendorid">'); html.push('<option value="">请选择</option>'); $.each(sfs, function(value1, item1, index1) { if(item.vendorid == item1.vendorid){ html.push("<option value=" + item1.vendorid + " selected >" + item1.vendorname + "</option>"); }else{ html.push("<option value=" + item1.vendorid + ">" + item1.vendorname + "</option>"); } }); html.push(' </select>'); html.push(' </div>'); html.push(' <label class="col-md-1 control-label">算法:</label>'); html.push(' <div class="col-md-2">'); html.push(' <select class="form-control algidSelect" name="algid">'); $.each(sfs, function(value1, item1, index1) { if(item.vendorid == item1.vendorid){ $.each(item1.sf, function(value2, item2, index2) { if(item.algid == item2.algorithmID){ html.push("<option value=" + item2.algorithmID + " selected >" + item2.name + "</option>"); }else{ html.push("<option value=" + item2.algorithmID + " >" + item2.name + "</option>"); } }); } }); html.push('</select>'); html.push('</div>'); html.push('<label class="col-md-1 control-label">违法业务:</label>'); html.push('<div class="col-md-2">'); html.push('<select class="selectpicker show-tick form-control" multiple data-live-search="false" name="alarm">'); if(item.alarm != null){ if(item.alarm.indexOf("1") > -1){ html.push('<option value="1" selected>大货车闯禁行</option>'); }else{ html.push('<option value="1">大货车闯禁行</option>'); } if(item.alarm.indexOf("2") > -1){ html.push('<option value="2" selected>危险品车闯禁行</option>'); }else{ html.push('<option value="2">危险品车闯禁行</option>'); } }else{ html.push('<option value="1">大货车闯禁行</option>'); html.push('<option value="2">危险品车闯禁行</option>'); } html.push('</select>'); html.push('</div>'); html.push('<div class="col-md-1">'); html.push(' <a href="javascript:void(0)" title="删除算法"><img src="image/trashcan.png" class="delete-icons delete-sf"></img> </a>'); html.push('</div>'); html.push('</div>'); }); html.push('</div>'); html.push("</div>"); html.push("</div>"); }); $("#timeZone-edit").append(html.join('')); csChangeListener(); $(".selectpicker").selectpicker(); $(".datetimePicker").datetimepicker({ locale: moment.locale('zh-cn'), format: "HH:mm" }); toggleBodyListener(); kkTreeListenerAll(data.timeZone); delIconListener(); sfAddListener(); $.each(data.timeZone, function(index, item){ $("#crossing"+index).val(item.crossingid); $("#crossing"+index+"_").val(item.crossingname); var first = true; $("#crossing"+index+"_").click(function () { if(first){ var treeObj = $.fn.zTree.getZTreeObj("crossing"+index+"_ul"); var crossingids = item.crossingid.split(","); $.each(crossingids,function(index, item){ var node = treeObj.getNodeByParam("id", item, null); treeObj.checkNode(node, true, true); }); first = false; } }); }); } }); timeAddListener(); $("#row-edit").modal({backdrop: 'static', keyboard: false}).on("shown.bs.modal").on("hide.bs.modal", function() { $("#timeZone").html(''); }); } function removeRow(index) { if(confirm("确认删除吗")){ var planid = $("#table0").bootstrapTable('getData')[index].id; $.ajax({ url: "szAlgSched/"+planid, type: "post", data : {_method:"DELETE"}, success: function(data) { alert("删除成功"); $("#table0").bootstrapTable('refresh'); }, err: function(){ alert("删除失败"); } }); } else{ return; } } function timeAddListener() { $(".time-add").off().click(function() { var html = []; html.push('<div class="panel panel-default" > '); html.push(' <div class="panel-heading">'); html.push(' <h3 class="panel-title">时间段'); html.push(' <a href="javascript:void(0)" title="删除时间段" style="margin-left:918px;"><img src="image/trashcan.png" class="delete-timezone"></img> </a>'); html.push(' <a href="#" style="float:right;text-decoration:none;" name="toggleBody"><span class="glyphicon glyphicon-chevron-down icon-normal" style="display: inline-block"></span></a>'); html.push(' </h3>'); html.push(' </div>'); html.push(' <div class="panel-body timeZoneDiv" >'); html.push('<div class="form-group timeZone">'); html.push('<label class="col-md-2 control-label">开始时间:</label>'); html.push('<div class="col-md-2">'); html.push('<input class="form-control datetimePicker" name="begintime" type="text" >'); html.push('</div>'); html.push('<label class="col-md-1 control-label">结束时间:</label>'); html.push('<div class="col-md-2">'); html.push('<input class="form-control datetimePicker" name="endtime" type="text" >'); html.push('</div>'); html.push('<label class="col-md-1 control-label">卡口:</label>'); html.push('<div class="col-md-2">'); html.push('<input class="form-control" name="crossingid" type="text">' ); html.push('</div>'); html.push('<div class="col-md-2">'); html.push('<button type="button" class="btn-hik-primary sf-add">新增算法</button>'); html.push('</div>'); html.push('<h5 class="page-header"></h5>'); html.push('</div>'); html.push('</div>') html.push('</div>') $("#timeZone-edit").append(html.join('')); delIconListener(); sfAddListener(); kkTreeListener(); toggleBodyListener(); $(".datetimePicker").datetimepicker({ locale: moment.locale('zh-cn'), format: "HH:mm" }); }); } function sfAddListener() { $(".sf-add").off().click(function() { var html = []; html.push('<div class="form-group sf">'); html.push('<label class="col-md-2 control-label">厂商:</label>'); html.push('<div class="col-md-2">'); html.push('<select class="form-control vendorSelect" name="vendorid">'); html.push('<option value="">请选择</option>'); $.each(sfs, function(value, item, index) { html.push("<option value=" + item.vendorid + ">" + item.vendorname + "</option>"); }); html.push('</select>'); html.push('</div>'); html.push('<label class="col-md-1 control-label">算法:</label>'); html.push('<div class="col-md-2">'); html.push('<select class="form-control algidSelect" name="algid">'); html.push('<option value="">请选择</option>'); html.push('</select>'); html.push('</div>'); html.push('<label class="col-md-1 control-label">违法业务:</label>'); html.push('<div class="col-md-2">'); html.push('<select class="selectpicker show-tick form-control" multiple data-live-search="false" name="alarm">'); html.push('<option value="1">大货车闯禁行</option>'); html.push('<option value="2">危险品车闯禁行</option>'); html.push('</select>'); html.push('</div>'); html.push('<div class="col-md-1">'); html.push(' <a href="javascript:void(0)" title="删除算法"><img src="image/trashcan.png" class="delete-icons delete-sf"></img> </a>'); html.push('</div>'); html.push('</div>'); $(this).parent().parent().append(html.join('')) csChangeListener(); delIconListener(); $(".selectpicker").selectpicker(); $(this).parent().parent().find(".sf").find("[name='vendorid']").eq(-1).prop('selectedIndex', 1).trigger('change'); }); } function csChangeListener(){ $(".vendorSelect").change(function() { var algidSelect = $(this).parent().siblings().find(".algidSelect"); var vendorid = $(this).val(); algidSelect.html(''); if(vendorid != "") { var algidList = []; $.each(sfs, function(value, item, index) { if(item.vendorid == vendorid) { algidList = item.sf; } }); var html1 = []; $.each(algidList, function(value, item, index) { html1.push("<option value=" + item.algorithmID + ">" + item.name + "</option>"); }); algidSelect.append(html1.join('')); } else { algidSelect.append('<option value="">请选择</option>'); } }); } function delIconListener(){ $(".delete-timezone").click(function(){ var obj = $(this).parent().parent().parent().parent(); obj.slideToggle(1000); setInterval(function(){ obj.remove(); },1100); }); $(".delete-sf").click(function(){ var obj = $(this).parent().parent().parent(); obj.slideToggle(500); setInterval(function(){ obj.remove(); },600); }); } function kkTreeListener(){ $('[name="crossingid"]').eq(-1).zselect({ type:"tree", hasQuery: true, treeSetting:{ hasCache: true, url: "trafficCrossingInfo", setting:{ view: { showLine: false }, check: { chkboxType: { "Y": "ps", "N": "ps" }, chkStyle: "checkbox", enable: true } }, buttons : { submit: { filter: "CrossInfo" } } } }); } function kkTreeListenerAll(timeZone){ $('[name="crossingid"]').zselect({ type:"tree", hasQuery: true, treeSetting:{ hasCache: true, url: "trafficCrossingInfo", setting:{ view: { showLine: false }, check: { chkboxType: { "Y": "ps", "N": "ps" }, chkStyle: "checkbox", enable: true } }, buttons : { submit: { filter: "CrossInfo" } } } }); } function checkForm(){ if($("#name").val() == "") { alert("计划名称不能为空"); $("#name").focus(); return false; }else if($("#begindate").val() == ""){ alert("开始日期不能为空"); $("#begindate").trigger("click"); return false; }else if($("#enddate").val() == ""){ alert("结束日期不能为空"); $("#enddate").focus(); return false; }else if($("#begindate").val() > $("#enddate").val()){ alert("结束日期必须大于开始日期"); $("#enddate").focus(); return false; } var check = true; var timeZoneEdits = $("#timeZone-edit").find(".timeZone"); if(timeZoneEdits.length != 0 ){ var timeList = []; for(var i = 0; i< timeZoneEdits.length ; i++){ var begintime = timeZoneEdits.eq(i).find('[name="begintime"]').val(); var endtime = timeZoneEdits.eq(i).find('[name="endtime"]').val() if(begintime == ""){ alert("开始时间不能为空"); timeZoneEdits.eq(i).find('[name="begintime"]').focus(); check = false; return false; }else if(endtime == ""){ alert("结束时间不能为空"); timeZoneEdits.eq(i).find('[name="endtime"]').focus(); check = false; return false; }else if(timeZoneEdits.eq(i).find('[name="crossingid"]').val() == ""){ // }else if(timeZoneEdits.eq(i).find('[name="crossingid"]').val() == ""){ alert("卡口不能为空"); timeZoneEdits.eq(i).find('[name="crossingid"]').focus(); check = false; return false; }else if(begintime > endtime){ alert("开始时间不能大于结束时间"); timeZoneEdits.find('[name="endtime"]').focus(); check = false; return false; } timeList.push({"begintime":begintime, "endtime":endtime}); } var sfEdits = $("#timeZone-edit").find(".sf"); if(sfEdits.length == 0){ alert("请至少选择一个算法"); check = false; return false; } }else{ alert("请至少选择一个时间段"); check = false; return false; } check = checkTimeIsOverlay(timeList); return check; } function checkTimeIsOverlay(timelist){ var result = true; timelist.sort(function(a,b){ if(a.begintime > b.begintime){ return 1 }else if(a.begintime = b.begintime){ return 0 }else{ return -1; } }); var tmpstime = "00:00"; var tmpetime = "00:00"; $.each(timelist, function(index,item){ if(item.begintime <= tmpetime){ result = false; alert("时间段("+tmpstime+"-"+tmpetime+")与时间段("+item.begintime+"-"+item.endtime+")存在交叉"); result = false; return false; } tmpstime = item.begintime; tmpetime = item.endtime; }); return result; } $("#btn_submit").click(function(){ if(checkForm()){ var data = {}; data["id"] = $("#planID").val(); data["name"] = $("#name").val(); data["begindate"] = $("#begindate").val(); data["enddate"] = $("#enddate").val(); var timeZone = []; var timeZoneTmp = {}; var sfs = []; $.each($("#timeZone-edit").find(".timeZone"), function(value,item,index) { $.each($(item).children("div").children("input"), function(value1,item1,index1) { timeZoneTmp[$(item1).attr("name")] = $(item1).val(); }); $.each($(item).find(".sf"), function(value1,item1,index1) { var sf = {} sf["vendorid"] = $(item1).find("[name='vendorid']").val(); sf["algid"] = $(item1).find("[name='algid']").val(); var alarms = $(item1).find("[name='alarm']").val(); if(alarms != null){ alarms = alarms.join(',') }else{ alarms == ""; } sf["alarm"] = alarms sfs.push(sf); }); timeZoneTmp["sf"] = sfs; timeZone.push(timeZoneTmp); sfs = []; timeZoneTmp = {}; }); data["timeZone"] = timeZone; $.ajax({ url:"szAlgSched", data: JSON.stringify(data), type : 'post', contentType: 'application/json', success:function(){ alert("保存成功"); $("#table0").bootstrapTable('refresh'); }, err:function(){ alert("保存失败"); } }); }else{ return false; } }); </script> </body> </html>