| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652 |
- <%@ page import="org.apache.commons.lang3.StringUtils" %>
- <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme() + "://"
- + request.getServerName() + ":" + request.getServerPort()
- + path + "/";
- Boolean bAll = Boolean.FALSE;
- String strAll = (String)request.getParameter("all");
- if (StringUtils.isNotBlank(strAll)){
- bAll = strAll.equalsIgnoreCase("1");
- System.out.println(bAll);
- }
- Boolean bSS = Boolean.FALSE;
- bSS = Boolean.parseBoolean(request.getParameter("ss"));
- //bAll 为true时加载所有的报警记录
- %>
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="utf-8">
- <meta http-equiv="x-ua-compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>报警详细列表</title>
- <link rel="stylesheet" href="css/bootstrap.min.css">
- <link rel="stylesheet" href="css/bootstrap-table.min.css">
- <link rel="stylesheet" href="css/sweetalert2.min.css" >
- <link rel="icon" href="favicon.ico">
- <style type="text/css">
- .handle
- {
- padding-left: 3px;
- padding-right: 3px;
- }
- </style>
- </head>
- <body>
- <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
- aria-labelledby="exampleModalLabel">
- <div class="modal-dialog" role="document">
- <div class="modal-content">
- <div class="modal-header">
- <button type="button" class="close" data-dismiss="modal"
- aria-label="Close">
- <span aria-hidden="true">×</span>
- </button>
- <h4 class="modal-title" id="exampleModalLabel">处理报警记录</h4>
- </div>
- <div class="modal-body">
- <form id="updatewarnhandles" class="form-horizontal">
- <div class="from-group">
- <input id="tb_id" name="tb_id" type="hidden">
- </div>
- <div class="form-group">
- <label class="col-sm-2 control-label">报警校对:</label>
- <!--<input type="text" class="form-control" id="recipient-name"> -->
- <div class="col-sm-10">
- <label class="radio-inline"> <input type="radio"
- name="tb_handleresult" id="tb_handleresult1" value="1">
- 误报
- </label> <label class="radio-inline"> <input type="radio"
- name="tb_handleresult" id="tb_handleresult2"
- value="2">
- 已修复
- </label> <label class="radio-inline"> <input type="radio"
- name="tb_handleresult" id="tb_handleresult3"
- value="3">
- 其他
- </label>
- </div>
- </div>
- <div class="form-group">
- <label class="col-sm-2 control-label">备注:</label>
- <div class="col-sm-10">
- <textarea class="form-control" id="tb_remark" name="tb_remark"></textarea>
- </div>
- </div>
- </form>
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
- <button type="button" class="btn btn-primary" onclick="updateWarnHandles()">处理</button>
- </div>
- </div>
- </div>
- </div>
- <div class="container-fluid">
- <div id="toolbar">
- <button id="resetcondition" class="btn btn-danger">
- <i class="glyphicon glyphicon-cog"></i> 重置搜索条件
- </button>
- <button id="result" class="btn btn-danger">
- <i class="glyphicon glyphicon-cog"></i> 显示所有记录
- </button>
- </div>
- <table id="table" data-toolbar="#toolbar"
- data-search="true" data-advanced-search="true"
- data-sort-order="desc" data-sort-name="alarmtime"
- data-sort-field="alarmtime" data-show-refresh="true"
- data-show-toggle="true" data-show-columns="true"
- data-show-export="true" data-detail-view="true"
- data-detail-formatter="detailFormatter" data-unique-id="guid"
- data-minimum-count-columns="2" data-show-pagination-switch="false"
- data-pagination="true" data-id-field="guid" data-id-table="advancedTable"
- data-page-list="[50, 100, 200, 500, 1000]" data-show-footer="false"
- data-query-params="queryParam" data-search-on-enter-key="true"
- data-side-pagination="server" data-url="getalarmdetail.cpp?<%=request.getQueryString() + "×tamp=" + System.currentTimeMillis()%>"
- data-response-handler="responseHandler">
- </table>
- <!--data-filter-control="true" data-filter-show-clear="true"-->
- </div>
- <script src="js/jquery-3.1.1.min.js"></script>
- <script src="js/bootstrap.min.js"></script>
- <script src="js/sweetalert2.min.js"></script>
- <!-- for IE support -->
- <script src="js/es6-promise.auto.min.js"></script>
- <!-- END FOOTER -->
- <script>
- var $modal = $('#exampleModal');
- var recipient;
- var curindex;
- function queryParam(params) {
- return params;
- }
- //处理报警
- function updateWarnHandles() {
- var $handleresult = $("input[name='tb_handleresult']");
- var handleresult = 2;
- for (var i = 0; i < $handleresult.length; i++) {
- if ($handleresult[i].checked) {
- handleresult = $handleresult[i].value;
- break;
- }
- }
- var remark = $("#tb_remark").val();
- $.post("updatewarnhandles.cpp", {
- guid: recipient,
- result: handleresult,
- mark: remark
- }, function (data, status) {
- // 关闭对话框
- $modal.modal('toggle');
- //$modal.modal('toggle');
- //$modal.modal('hide')
- if (data) {
- //成功是更新列表里的内容
- swal("成功", "", "success");
- //var curdata = JSON.parse(data.msg);
- //$table.bootstrapTable('updateRow', {
- // index: curindex,
- // row: curdata
- //});
- } else {
- //失败时弹出框
- swal("失败", "", "error");
- }
- });
- /*
- //TODO
- $modal.modal('toggle');
- swal({
- title: 'Sorry!',
- text: '暂时未实现此功能.',
- timer: 2500,
- confirmButtonText: "确定"
- }).then(
- function () {},
- // handling the promise rejection
- function (dismiss) {
- if (dismiss === 'timer') {
- console.log('I was closed by the timer')
- }
- }
- );
- */
- }
- //处理模块
- $modal.on('show.bs.modal', function (event) {
- var button = $(event.relatedTarget) // Button that triggered the modal
- recipient = button.data('whatever') // Extract info from data-* attributes
- // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
- // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
- curindex = button.data('index')
- var modal = $(this)
- //modal.find('.modal-title').text('处理报警')
- // modal.find('.modal-body input').val(recipient)
- modal.find("#tb_id").val(recipient);
- })
- //表格
- var $table = $('#table');
- function initTable() {
- $table.bootstrapTable({
- height: getHeight(),
- exportDataType: "basic",
- columns: [[{
- field: 'guid',
- title: "GUID",
- visible: false
- }, {
- title: '通道名称',
- field: 'taskname',
- align: 'center',
- valign: 'middle',
- sortable: true,
- //filterControl:"select",
- }, {
- field: 'alarmtime',
- title: '报警时间',
- searchable: true,
- align: 'center',
- sortable: true
- }, {
- field: 'alarmtype',
- title: '报警类型',
- searchable: true,
- align: 'center',
- filterControl:"select",
- formatter: function (value) {
- return getAlarmTypeName(value);
- }
- //visible: false,
- }, {
- field: 'result',
- title: '处理结果',
- align: 'center',
- formatter: function (value) {
- return getResult(value);
- }
- }, {
- field: 'level',
- title: '报警等级',
- align: 'center',
- formatter: function (value) {
- return getLevel(value);
- }
- }, {
- field: 'mark',
- title: '备注',
- align: 'center',
- visible: false
- <% if (bAll){ %>
- }, {
- field: 'filterresult',
- title: '过滤结果',
- align: 'center',
- formatter: function (value) {
- return getFilterResult(value);
- }
- <%}%>
- }, {
- field: 'operate',
- title: '操作',
- align: 'center',
- searchable: false,
- events: operateEvents,
- formatter: operateFormatter
- }],]
- });
- // sometimes footer render error.
- setTimeout(function () {
- $table.bootstrapTable('resetView');
- }, 200);
- $table.on('expand-row.bs.table', function (e, index, row, $detail) {
- });
- $table.on('all.bs.table', function (e, name, args) {
- console.log(name, args);
- });
- $(window).resize(function () {
- $table.bootstrapTable('resetView', {
- height: getHeight()
- });
- });
- }
- function getFilterResult(result) {
- switch (result){
- case -1:
- return "未过滤";
- case 0:
- return "匹配到一致";
- case 1:
- return "匹配到相似";
- case 2:
- return "匹配到部分相似";
- case 3:
- return "未匹配到";
- case 4:
- return "宽高比例过滤";
- case 5:
- return "最小像素值过滤";
- case 6:
- return "连续播报过滤";
- case 7:
- return "水平框过滤";
- case 8:
- return "行人报警过滤";
- case 10:
- return "白线过滤";
- case 11:
- return "梯形过滤";
- case 12:
- return "树叶过滤";
- case 13:
- return "地面过滤";
- case 14:
- return "无明显无标过滤";
- case 15:
- return "最小高度过滤";
- case 18:
- return "分类器过滤";
- case 20:
- return "夜晚亮度过滤";
- default:
- return result;
- }
- }
- function getLaneName(laneno)
- {
- switch (laneno)
- {
- case 92:
- return "福建方向";
- case 91:
- return "安徽方向";
- case 273:
- case 301678153:
- return "江西方向";
- case 270:
- return "杭州方向";
- case 271:
- return "上海方向";
- case 272:
- case 1028415928:
- case 404:
- return "杭州方向";
- case 401:
- return "金华方向";
- case 402:
- return "宁波方向";
- case 403:
- return "东阳方向";
- case 2135407016:
- return "友谊关方向";
- case 2135407017:
- return "南宁方向";
- case 2135407014:
- return "靖西方向";
- case 2135407015:
- return "崇左方向";
- case 0:
- case undefined:
- return "未知";
- default:
- return laneno;
- }
- }
- function getLevel(level) {
- switch (level){
- case 1:
- return "紧急";
- case 2:
- return "重要";
- case 3:
- return "警告";
- case 4:
- return "提示";
- default:
- return "未知";
- }
- }
- function getResult(result) {
- switch (result) {
- case 0:
- return "未处理";
- case 1:
- return "已处理";
- case 2:
- return "误报警";
- default :
- return "其他";
- }
- }
- function getAlarmTypeName(alarmtype) {
- switch (alarmtype){
- case 0x50:
- return "停驶";
- case 0x51:
- return "超速";
- case 0x52:
- return "事故";
- case 0x53:
- return "拥堵";
- case 0x54:
- return "行人";
- case 0x55:
- return "逆行";
- case 0x56:
- return "火灾";
- case 0x57:
- return "抛洒物";
- case 0x58:
- return "排队超限";
- case 0x59:
- return "交通状态信息";
- case 0x5a:
- return "抓拍";
- case 0x5b:
- return "抓拍";
- case 0x5c:
- return "光线异常";
- case 0x5d:
- return "烟雾";
- case 0x5e:
- return "转动";
- case 0x5f:
- return "低速";
- case 0xFF:
- return "测试";
- default:
- return "未知";
- }
- }
- function getIdSelections() {
- return $.map($table.bootstrapTable('getSelections'), function (row) {
- return row.guid
- });
- }
- function responseHandler(res) {
- return res;
- }
- function detailFormatter(index, row) {
- var html = [];
- html.push('<div class="well well-sm">');
- html.push('<ul>');
- html.push('<li>GUID:' + row.guid);
- html.push('<li>通道名称:' + row.taskname);
- html.push('<li>报警时间:' + row.alarmtime);
- html.push('<li>方向:' + getLaneName(row.laneno));
- html.push('<li>报警类型:' + getAlarmTypeName(row.alarmtype));
- html.push('<li>报警等级:' + getLevel(row.level));
- if (row.result === 0){
- html.push('<li>处理结果:未处理');
- } else if (row.result === 1){
- html.push('<li>处理结果:已处理');
- html.push('<li>处理信息:' + row.mark);
- } else if (row.result === 2) {
- html.push('<li>处理结果:误报警');
- html.push('<li>误报信息:' + row.mark);
- }
- <% if (bAll){ %>
- html.push('<li>过滤结果' + getFilterResult(row.filterresult));
- <% } %>
- var filefullname = "http://<%=request.getServerName()%>:<%=request.getServerPort()%>/DB/pic/" + row.imagepath1 + ".jpg";
- //var filefullname = "http://192.168.2.251:21006/DB/pic/" + row.imagepath1 + ".jpg";
- html.push('<li>报警图片:<img src="' + filefullname + '" width="352" height="288" />');
- html.push('</ul>');
- html.push('</div>');
- return html.join('');
- }
- function operateFormatter(value, row, index) {
- //var picpath = "http://<%=request.getServerName()%>:<%=request.getServerPort()%>/DB/pic/" + row.imagepath1 + ".jpg";
- var videopath = "http://<%=request.getServerName()%>:<%=request.getServerPort()%>/DB/video/" + row.imagepath1 + ".mp4";
- return [
- '<a class="handle" title="查看图片" data-guid="' + row.guid + '" onclick="viewpic(this)">',
- '<i class="glyphicon glyphicon-picture"></i>', '</a>',
- //'<a class="handle" title="查看报警视频" data-guid="' + row.guid + '" onclick="viewvideo(this)">',
- //'<i class="glyphicon glyphicon-video"></i>', '</a>',
- '<a class="handle" title="查看录像" target="_blank" href="' + videopath + '">',
- '<i class="glyphicon glyphicon-facetime-video"></i>', '</a>',
- '<a class="handle" title="处理报警" data-toggle="modal" data-target="#exampleModal" data-whatever="'
- + row.guid + '" data-index="' + index + '">',
- '<i class="glyphicon glyphicon-apple"></i>', '</a>'<% if(bSS){%>,
- '<a class="handle" title="删除记录" data-guid="' + row.guid + '" onclick="removealarm(this)">',
- '<i class="glyphicon glyphicon-remove"></i>', '</a>'<%}%>]
- .join('');
- }
- function removealarm(t) {
- if (t.dataset.guid){
- $.post("deletealarm.cpp", {guid : t.dataset.guid}, function (data, status) {
- if (data)
- {
- swal({
- title: 'success',
- text: '删除成功.',
- type: 'success',
- timer: 2500,
- confirmButtonText: "确定"
- }).then(
- function () {},
- // handling the promise rejection
- function (dismiss) {
- if (dismiss === 'timer') {
- console.log('I was closed by the timer')
- }
- }
- );
- var obj = $table.bootstrapTable('removeByUniqueId', t.dataset.guid);
- return ;
- }
- swal({
- title: 'error!',
- text: '删除失败.',
- timer: 2500,
- type: 'error',
- confirmButtonText: "确定"
- }).then(
- function () {},
- // handling the promise rejection
- function (dismiss) {
- if (dismiss === 'timer') {
- console.log('I was closed by the timer')
- }
- }
- );
- });
- }
- }
- function viewvideo(t) {
- swal({
- title: 'Sorry!',
- text: '暂时未实现此功能.',
- timer: 2500,
- confirmButtonText: "确定"
- }).then(
- function () {},
- // handling the promise rejection
- function (dismiss) {
- if (dismiss === 'timer') {
- console.log('I was closed by the timer')
- }
- }
- );
- }
- function viewpic(t) {
- if (t.dataset.guid) {
- var obj = $table.bootstrapTable('getRowByUniqueId', t.dataset.guid);
- //var filefullname = "ftp://12.1.89.30:21010/pic/" + obj.imagepath1 + ".jpg";
- var filefullname = "http://<%=request.getServerName()%>:<%=request.getServerPort()%>/DB/pic/" + obj.imagepath1 + ".jpg";
- console.log(filefullname);
- swal({
- title: getAlarmTypeName(obj.alarmtype),
- text: obj.taskname,
- //imageUrl: 'https://unsplash.it/400/200/?random',
- //imageUrl: 'ftp://127.0.0.1:21010/pic/201612/{D7EE7FCC-CC00-466A-94E8-CEFEB20CB5F7}.jpg',
- imageUrl: filefullname,
- //imageWidth: 400,
- //imageHeight: 400,
- animation: false,
- confirmButtonText: "关闭"
- }).catch(swal.noop)
- }
- }
- window.operateEvents = {};
- function getHeight() {
- return $(window).height();
- //return $(window).height() - $('h1').outerHeight(true);
- return $(window).height() - $('.page-footer').outerHeight(true)
- - $('.page-header').outerHeight(true);
- }
- $resetcondition = $('#resetcondition');
- $resetcondition.click(function () {
- var ur = '<%=request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/"%>' + 'alarmdetaillist.cpp';
- window.location.href = ur;
- });
-
- $('#result').click(function () {
- var ur = '<%=request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/"%>' + 'alarmdetaillist.cpp?result=1';
- window.location.href = ur;
- })
- $(function () {
- var scripts = [
- //location.search.substring(1) ||
- 'js/bootstrap-table.min.js', 'js/bootstrap-table-zh-CN.min.js',
- 'js/bootstrap-table-export.min.js', 'js/tableExport.js',
- 'js/bootstrap-table-editable.min.js',
- //"js/bootstrap-table-filter-control.js",
- //'js/bootstrap-editable.js',
- 'js/bootstrap-table-toolbar.min.js'], eachSeries = function (arr, iterator, callback) {
- callback = callback || function () {
- };
- if (!arr.length) {
- return callback();
- }
- var completed = 0;
- var iterate = function () {
- iterator(arr[completed], function (err) {
- if (err) {
- callback(err);
- callback = function () {
- };
- } else {
- completed += 1;
- if (completed >= arr.length) {
- callback(null);
- } else {
- iterate();
- }
- }
- });
- };
- iterate();
- };
- eachSeries(scripts, getScript, initTable);
- });
- function getScript(url, callback) {
- var head = document.getElementsByTagName('head')[0];
- var script = document.createElement('script');
- script.src = url;
- var done = false;
- // Attach handlers for all browsers
- script.onload = script.onreadystatechange = function () {
- if (!done
- && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
- done = true;
- if (callback)
- callback();
- // Handle memory leak in IE
- script.onload = script.onreadystatechange = null;
- }
- };
- head.appendChild(script);
- // We handle everything using the script element injection
- return undefined;
- }
- </script>
- </body>
- </html>
|