333 lines
15 KiB
Plaintext
333 lines
15 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8" %>
|
||
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
|
||
<!-- bootstrap switch -->
|
||
<link rel="stylesheet"
|
||
href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css"/>
|
||
<style type="text/css">
|
||
#container {
|
||
font: 62.5%/1 "楷体", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
|
||
background-color: hsl(200, 5%, 15%);
|
||
background-size: 8px 8px;
|
||
background-image: -webkit-linear-gradient(45deg, hsla(0, 0%, 0%, 0) 0px,
|
||
hsla(0, 0%, 0%, .10) 50%,
|
||
hsla(0, 0%, 0%, 0) 100%);
|
||
}
|
||
|
||
.has_active {
|
||
background: #aaa;
|
||
}
|
||
</style>
|
||
<script type="text/javascript"
|
||
src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
|
||
charset="utf-8"></script>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/JS/timeefficiency/LinkList.js"></script>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/JS/timeefficiency/path.js"></script>
|
||
<script type="text/javascript">
|
||
$(function () {
|
||
var modal = document.querySelector(".modal-content");
|
||
var modalWidth = getStyle(modal, 'width');
|
||
var unitId = '${patrolPlan.unitId}';
|
||
var patroPlanId = '${patrolPlan.id}';
|
||
localStorage.removeItem("configOptions");
|
||
getAllFloorList(unitId, function (floors) {
|
||
JSON.parse(floors).forEach(function (item, index) {
|
||
if (localStorage.getItem('configOptions')) {
|
||
if (item.id === JSON.parse(localStorage.getItem('configOptions')).floorId) {
|
||
var selectedIndex = index;
|
||
}
|
||
} else {
|
||
var selectedIndex = 0;
|
||
}
|
||
var floorHtml = $('<li id="' + item.id + '" class="' +
|
||
(index === selectedIndex ? 'has_active' : '')
|
||
+ '" style="list-style:none;padding:5px;cursor:pointer;border-radius:5px;">' + item.name + '</li>');
|
||
$('#flool-list').append(floorHtml);
|
||
if (selectedIndex === index) {
|
||
changeFloor(item.id, unitId);
|
||
}
|
||
$("#" + item.id).on("click", function () {
|
||
if ($(this).hasClass("has_active")) {
|
||
localStorage.removeItem("configOptions");
|
||
var floorId = item.id;
|
||
changeFloor(floorId, unitId);
|
||
localStorage.removeItem("configOptions");
|
||
return;
|
||
} else {
|
||
$(".has_active").removeClass("has_active");
|
||
$(this).addClass("has_active");
|
||
localStorage.removeItem("configOptions");
|
||
var floorId = item.id;
|
||
changeFloor(floorId, unitId);
|
||
localStorage.removeItem("configOptions");
|
||
}
|
||
});
|
||
});
|
||
});
|
||
$("#patrol-point-list").on("click", function () {
|
||
$("#patrol-point-container").toggle();
|
||
});
|
||
$("#floor-list-btn").on("click", function () {
|
||
$("#floor-list-container").toggle();
|
||
});
|
||
});
|
||
|
||
function changeFloor(floorId, unitId) {
|
||
//console.log(floorId)
|
||
// console.log(unitId)
|
||
getBgImg(floorId);
|
||
$("#patrol-point-container").html('<ul id="patro-list-' + floorId + '" style="padding: 0;"></ul>');
|
||
getRoutePointsFirst(floorId, '${patrolPlan.id}', function (data1) {
|
||
var data = deepClone(JSON.parse(data1).rows);
|
||
data.forEach(function (item, index) {
|
||
var insdt1 = item['insdt'].replace(' ', 'kongbai');
|
||
var infos = {
|
||
text: "新",
|
||
state: 0,
|
||
message: "新"
|
||
};
|
||
item['routeId'] = item.id;
|
||
item['insdt'] = insdt1;
|
||
item['infos'] = infos;
|
||
item['posX'] = item.posx;
|
||
item['posY'] = item.posy;
|
||
});
|
||
|
||
if (localStorage.getItem("configOptions") === null) {
|
||
var heightstr = 700;
|
||
if (floorId == 'acee444c90814a7a99287cbe0ebb36b3') {//厂外
|
||
heightstr = 2700;
|
||
} else {
|
||
heightstr = 700;
|
||
}
|
||
var configOptions = {
|
||
container: 'container', //容器id
|
||
containerWidth: 1150, //容器宽度
|
||
containerHeight: heightstr, //容器高度
|
||
// containerBgColor: '#fcc', //容器背景颜色
|
||
draggable: true, // 点是否可拖拽
|
||
//patrolAreaId: patrolAreaId,
|
||
patrolPlanId: '${patrolPlan.id}',
|
||
floorId: floorId,
|
||
type: 'P',
|
||
unitId: unitId,
|
||
pointsStyle: {
|
||
pointInflectionStyle: { // 拐点样式配置项
|
||
radius: 10,
|
||
borderWidth: 2,
|
||
borderColor: '#ddd',
|
||
borderStyle: 'solid',
|
||
// fontSize: 10,
|
||
// fontColor: '#ddd',
|
||
// shadow: '1px 4px 6px #1c1d1f, 0 0 0 #000000, 1px 4px 6px #1c1d1f'
|
||
},
|
||
pointDefaultStyle: {
|
||
radius: 10,
|
||
borderWidth: 2,
|
||
borderColor: '#ddd',
|
||
borderStyle: 'solid',
|
||
fontSize: 40,
|
||
fontColor: '#ddd',
|
||
// shadow: '1px 4px 6px #1c1d1f, 0 0 0 #000000, 1px 4px 6px #1c1d1f'
|
||
},
|
||
pointCompleteStyle: {
|
||
radius: 30,
|
||
borderWidth: 2,
|
||
borderColor: '#93c913',
|
||
borderStyle: 'solid',
|
||
fontSize: 40,
|
||
fontColor: '#93c913',
|
||
shadow: '0 0 24px rgba(147, 201, 19, 0.6)'
|
||
},
|
||
pointAbnormalStyle: {
|
||
radius: 30,
|
||
borderWidth: 2,
|
||
borderColor: '#daa520',
|
||
borderStyle: 'solid',
|
||
fontSize: 40,
|
||
fontColor: '#daa520',
|
||
shadow: '0 0 24px rgba(218,165,32, 0.6)'
|
||
},
|
||
pointAlarmStyle: {
|
||
radius: 30,
|
||
borderWidth: 2,
|
||
borderColor: '#ff4847',
|
||
borderStyle: 'solid',
|
||
fontSize: 40,
|
||
fontColor: '#ff4847',
|
||
shadow: '0 0 24px rgba(255, 72, 71, 0.6)'
|
||
}
|
||
},
|
||
linesStyle: {
|
||
lineDefaultStyle: {
|
||
lineWidth: 4,
|
||
lineColor: '#ddd',
|
||
lineStyle: 'dashed',
|
||
arrowPosition: 23
|
||
},
|
||
lineCompleteStyle: {
|
||
lineWidth: 2,
|
||
lineColor: '#93c913',
|
||
lineStyle: 'solid',
|
||
shadow: '0 0 24px rgba(147, 201, 19, 0.6)',
|
||
arrowPosition: 23
|
||
},
|
||
lineAbnormalStyle: {
|
||
lineWidth: 2,
|
||
lineColor: '#daa520',
|
||
lineStyle: 'dashed',
|
||
shadow: '0 0 24px rgba(218,165,32, 0.6)',
|
||
arrowPosition: 23
|
||
},
|
||
lineAlarmStyle: {
|
||
lineWidth: 2,
|
||
lineColor: '#ff4847',
|
||
lineStyle: 'dashed',
|
||
shadow: '0 0 24px rgba(255, 72, 71, 0.6)',
|
||
arrowPosition: 23
|
||
}
|
||
},
|
||
points: deepClone(data)
|
||
};
|
||
localStorage.setItem("configOptions", JSON.stringify(configOptions));
|
||
setContainer(configOptions);
|
||
var configOptions = JSON.parse(localStorage.getItem("configOptions"));
|
||
var patrolPointInContainer = configOptions.points.filter(function (item) {
|
||
return item['type'] === '0';
|
||
});
|
||
//console.log(patrolPointInContainer);
|
||
if (patrolPointInContainer.length === 0) {
|
||
getPatrolPointsList1(configOptions);
|
||
} else {
|
||
getPatrolPointsList(configOptions);
|
||
}
|
||
drawPath(configOptions);
|
||
} else {
|
||
var configOptions = JSON.parse(localStorage.getItem("configOptions"));
|
||
configOptions.points === data ? deepClone(data) : [];
|
||
configOptions.floorId = floorId;
|
||
localStorage.setItem("configOptions", JSON.stringify(configOptions));
|
||
setContainer(configOptions);
|
||
var configOptions = JSON.parse(localStorage.getItem("configOptions"));
|
||
var patrolPointInContainer = configOptions.points.filter(function (item) {
|
||
return item['type'] === '0';
|
||
});
|
||
if (patrolPointInContainer.length === 0) {
|
||
getPatrolPointsList1(configOptions);
|
||
} else {
|
||
getPatrolPointsList(configOptions);
|
||
}
|
||
drawPath(configOptions);
|
||
}
|
||
;
|
||
});
|
||
$("#patrol-point-container").show();
|
||
}
|
||
|
||
// 获取楼层背景底图
|
||
function getBgImg(floorId) {
|
||
// 数据表名
|
||
$("#container").css("background", "");
|
||
var tbName = 'TB_TimeEfficiency_PatrolArea_Floor_file';
|
||
// $.post(ext.contextPath + '/base/getInputFileList.do', {
|
||
$.post(ext.contextPath + '/base/getInputFileList_minio.do', {
|
||
masterId: floorId,
|
||
tbName: tbName,
|
||
bucketName: 'patrolfloor'
|
||
}, function (data) {
|
||
if (JSON.parse(data).length > 0) {
|
||
for (var i = 0; i < 1; i++) {
|
||
var str = $.parseJSON(data);
|
||
var path = str[i].abspath;
|
||
var filename = str[i].filename;
|
||
/*if (filename.indexOf("厂外") != -1) {
|
||
if (path) {
|
||
$("#container").css({
|
||
"background-color": "hsl(200,5%,15%)",
|
||
"background-image": "url(" + path + ")",
|
||
"background-repeat": "no-repeat",
|
||
"background-size": "90% 90%"
|
||
});
|
||
var img = $(this);
|
||
$("<img/>").attr("src", $(img).attr("src")).load(function () {
|
||
//console.log("图片的宽度为:"+this.width);
|
||
})
|
||
}
|
||
} else {
|
||
if (path) {
|
||
$("#container").css({
|
||
"background-color": "hsl(200,5%,15%)",
|
||
"background-image": "url(" + path + ")",
|
||
"background-repeat": "no-repeat",
|
||
"background-size": "contain"
|
||
});
|
||
var img = $(this);
|
||
$("<img/>").attr("src", $(img).attr("src")).load(function () {
|
||
//console.log("图片的宽度为:"+this.width);
|
||
})
|
||
}
|
||
}*/
|
||
if (path) {
|
||
$("#container").css({
|
||
"background-color": "hsl(200,5%,15%)",
|
||
"background-image": "url(" + path + ")",
|
||
"background-repeat": "no-repeat",
|
||
"background-size": "contain"
|
||
});
|
||
var img = $(this);
|
||
$("<img/>").attr("src", $(img).attr("src")).load(function () {
|
||
//console.log("图片的宽度为:"+this.width);
|
||
})
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
// $("#modalId").unbind("mousedown").bind("mousedown", function (e) {
|
||
// if (event.which == 3) {
|
||
// alert("click right！");
|
||
// }
|
||
// e.preventDefault();
|
||
// });
|
||
// $("#modalId").unbind("mousedown").bind("contextmenu", function (e) {
|
||
// e.preventDefault();
|
||
// return false;
|
||
// });
|
||
|
||
</script>
|
||
<div class="modal fade" id="subModal">
|
||
<div class="modal-dialog modal-xlg" style="width: 1150px" id="modalId">
|
||
<div class="modal-content">
|
||
<input name="id" type="hidden" value="${patrolArea.id}"/>
|
||
<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">巡检路线</h4>
|
||
<div style="position: fixed; right: 150px;top: 12px;">
|
||
<!-- <button class="btn btn-warning" id="clearBtn" onclick="clear()">清空</button> -->
|
||
<button class="btn btn-success" id="patrol-point-list">巡检点列表</button>
|
||
<button class="btn btn-primary" id="floor-list-btn">楼层列表</button>
|
||
</div>
|
||
</div>
|
||
<div id="patrol-point-container"
|
||
style="position: absolute;top:65px;left:5px;width: auto; height: auto;background: rgba(255,255,255,.8);border-radius: 5px;z-index: 920;">
|
||
|
||
</div>
|
||
<div id="floor-list-container"
|
||
style="position: absolute;top:65px;right:5px;width: 35px; height: auto;background: rgba(255,255,255,.8);border-radius: 5px;padding:2px;z-index: 920;">
|
||
<ul id="flool-list" style="padding: 0;margin: 0;"></ul>
|
||
|
||
</div>
|
||
<div class="modal-body" id="container">
|
||
|
||
</div>
|
||
<!-- <div class="modal-footer">
|
||
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
|
||
<button type="button" class="btn btn-primary" onclick="doupdate()" id="btn_save">保存</button>
|
||
</div> -->
|
||
</div>
|
||
<!-- /.modal-content -->
|
||
</div>
|
||
<!-- /.modal-dialog -->
|
||
</div>
|