You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
125 lines
4.2 KiB
125 lines
4.2 KiB
11 months ago
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8" />
|
||
|
|
<title></title>
|
||
|
|
<link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
|
||
|
|
<script src="https://webapi.amap.com/maps?v=1.4.15&key=9a8223989b188cb6ef0fb1fde4fd748a"></script>
|
||
|
|
<script src="../../js/jquery-2.1.3.min.js"></script>
|
||
|
|
<script src="../../js/jq_extend.js"></script>
|
||
|
|
<style>
|
||
|
|
html, body, #container {
|
||
|
|
height: 100%;
|
||
|
|
width: 100%;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.amap-icon img {
|
||
|
|
width: 25px;
|
||
|
|
height: 34px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.amap-marker-label {
|
||
|
|
border: 0;
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
.info {
|
||
|
|
position: relative;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
min-width: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.amap-logo .amap-copyright {
|
||
|
|
display: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div id="container"></div>
|
||
|
|
<script>
|
||
|
|
var OrgId = JSON.parse(window.sessionStorage.getItem("userInfo")).OrgID;
|
||
|
|
//根据当前登陆人机构ID获取机构所在经纬度
|
||
|
|
$.ajax({
|
||
|
|
type: "post",
|
||
|
|
url: "../../ashx/FireOrgHandler.ashx",
|
||
|
|
data: { Action: "getFireOrgName", ID: OrgId },
|
||
|
|
dataType: "json",
|
||
|
|
success: function (result) {
|
||
|
|
initMap(result.data.LON, result.data.LAT, result.data.CITY);
|
||
|
|
initWork.getData();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
var TaskId = $.getUrlVar("TaskId");
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 初始化地图
|
||
|
|
* @param lon 经度（GCJ－02坐标系）
|
||
|
|
* @param lat 纬度（GCJ－02坐标系）
|
||
|
|
*/
|
||
|
|
var initMap = function (lon, lat) {
|
||
|
|
if (lon == null || lon == "" || lat == null || lat == "") {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
map = new AMap.Map('container', {
|
||
|
|
resizeEnable: true,
|
||
|
|
center: [lon, lat],
|
||
|
|
zoom: 16
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
var initWork = {
|
||
|
|
/**
|
||
|
|
* 根据请假ID获取请假期间打卡记录
|
||
|
|
* */
|
||
|
|
getData: function () {
|
||
|
|
$.ajax({
|
||
|
|
type: "post",
|
||
|
|
url: "../../ashx/OaRollcallRecordHandler.ashx",
|
||
|
|
data: { Action: "RollcallRecordList", TASK_ID: TaskId },
|
||
|
|
dataType: "json",
|
||
|
|
success: function (result) {
|
||
|
|
result.data.forEach(function (item) {
|
||
|
|
if (item.LOCATION.indexOf(",") >= 0) {
|
||
|
|
initWork.showData(
|
||
|
|
Number(item.LOCATION.split(",")[0]),
|
||
|
|
Number(item.LOCATION.split(",")[1]),
|
||
|
|
item.REPORT_TIME,
|
||
|
|
item.USERS_NAME,
|
||
|
|
item.REMARKS
|
||
|
|
);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 地图点位渲染
|
||
|
|
* @param lon 经度（GCJ－02坐标系）
|
||
|
|
* @param lat 纬度（GCJ－02坐标系）
|
||
|
|
* @param time 上报时间
|
||
|
|
* @param name 上报人姓名
|
||
|
|
* @param remarks
|
||
|
|
*/
|
||
|
|
showData: function (lon, lat, time, name, remarks) {
|
||
|
|
var marker = new AMap.Marker({
|
||
|
|
position: [lon, lat],
|
||
|
|
icon: '../../images/poi-marker-default.png',
|
||
|
|
offset: new AMap.Pixel(-13, -30)
|
||
|
|
});
|
||
|
|
marker.setMap(map);
|
||
|
|
marker.setTitle(name);
|
||
|
|
marker.setLabel({
|
||
|
|
offset: new AMap.Pixel(20, 20), //设置文本标注偏移量
|
||
|
|
content: "<div class='info'><span style='font-weight: bold'>" + time + "</span><p>" + name + "</p><p>" + remarks + "</p></div>", //设置文本标注内容
|
||
|
|
direction: 'top' //设置文本标注方位
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|