255 lines
9.2 KiB
JavaScript
255 lines
9.2 KiB
JavaScript
|
let element, layer, table, tree, from, $, colorpicker;
|
|||
|
|
const bidCode = parent.$('#bidPro').val();
|
|||
|
|
let map;
|
|||
|
|
let overlays = [];
|
|||
|
|
let coordinates = []; //电子围栏坐标存放处
|
|||
|
|
|
|||
|
|
layui.use(['layer', 'element', 'table', 'tree', 'form', 'jquery'], function () {
|
|||
|
|
element = layui.element;
|
|||
|
|
colorpicker = layui.colorpicker;
|
|||
|
|
layer = layui.layer;
|
|||
|
|
table = layui.table;
|
|||
|
|
tree = layui.tree;
|
|||
|
|
form = layui.form;
|
|||
|
|
$ = layui.jquery;
|
|||
|
|
|
|||
|
|
colorpicker.render({
|
|||
|
|
elem: '#ID-colorpicker-demo-form',
|
|||
|
|
color: '#1c97f5',
|
|||
|
|
done: function(color){
|
|||
|
|
$('#color').val(color);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
mapInit();
|
|||
|
|
|
|||
|
|
$('#addButton').on('click', function(){
|
|||
|
|
$('#hiddenContent').toggle(); // 切换显示与隐藏
|
|||
|
|
$('#content').toggle(); // 切换显示与隐藏
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$('#return').on('click', function(){
|
|||
|
|
$('#hiddenContent').toggle(); // 切换显示与隐藏
|
|||
|
|
$('#content').toggle(); // 切换显示与隐藏
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
form.on('submit(demo1)', function(data){
|
|||
|
|
let field = data.field; // 获取表单字段值
|
|||
|
|
field.arrayField = coordinates.toString();
|
|||
|
|
|
|||
|
|
field.roleCode = roleCode;
|
|||
|
|
field.orgId = orgId;
|
|||
|
|
field.userId = userId;
|
|||
|
|
field.bidCode = bidCode;
|
|||
|
|
console.log(field);
|
|||
|
|
const url = commonUrl + "screen/largeScreen/personnelControl/addNewFence";
|
|||
|
|
let encryptStr = encryptCBC(JSON.stringify(field));
|
|||
|
|
ajaxRequest(url, "POST", encryptStr, true, function () {
|
|||
|
|
}, function (result) {
|
|||
|
|
console.log(result);
|
|||
|
|
if (result.code === 200) {
|
|||
|
|
$('#hiddenContent').toggle(); // 切换显示与隐藏
|
|||
|
|
$('#content').toggle(); // 切换显示与隐藏
|
|||
|
|
} else if (result.code === 500) {
|
|||
|
|
layer.msg(result.msg, { icon: 2 });
|
|||
|
|
}else if(result.code === 401){
|
|||
|
|
loginout(1)
|
|||
|
|
}
|
|||
|
|
}, function (xhr) {
|
|||
|
|
error(xhr)
|
|||
|
|
} , "application/json",aqEnnable);
|
|||
|
|
|
|||
|
|
// return false; // 阻止默认 form 跳转
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
//穿戴装备
|
|||
|
|
wearGarList();
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
//穿戴装备
|
|||
|
|
function wearGarList(){
|
|||
|
|
const url = commonUrl + "screen/largeScreen/personnelControl/getNewFenceList";
|
|||
|
|
|
|||
|
|
table.render({
|
|||
|
|
elem: '#dome',
|
|||
|
|
url: url,
|
|||
|
|
skin: 'line',
|
|||
|
|
page: false,
|
|||
|
|
headers:{
|
|||
|
|
decrypt:"decrypt",
|
|||
|
|
"Authorization":token
|
|||
|
|
},
|
|||
|
|
where: {
|
|||
|
|
roleCode: roleCode,
|
|||
|
|
orgId: orgId,
|
|||
|
|
userId: userId,
|
|||
|
|
bidCode: bidCode
|
|||
|
|
},
|
|||
|
|
cols: [[
|
|||
|
|
{field: 'number', width:80,title: '序号', align: 'center', type: 'numbers'},
|
|||
|
|
{field: 'fenceName', width:120, align: 'center', title: '围栏名称'},
|
|||
|
|
{field: 'fenceType', width:120, align: 'center', title: '围栏类型'},
|
|||
|
|
{field: 'alarmType', width:80, align: 'center', title: '报警类型'},
|
|||
|
|
{field: 'alertType', width:80, align: 'center', title: '警戒等级'},
|
|||
|
|
{field: 'color', width:80, align: 'center', title: '颜色', templet: d => {
|
|||
|
|
return '<div style="width: 20px;height: 20px;background-color: '+d.color+'"></div>';
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{field: 'status', align: 'center', title: '状态', templet: '#switchTpl'},
|
|||
|
|
{
|
|||
|
|
fixed: 'right', width:80, title: '操作', align: 'center', templet: d => {
|
|||
|
|
let text = "";
|
|||
|
|
text +='<a lay-event="del" style="color: #f80b37;cursor: pointer;font-size: 16px">删除</a>';
|
|||
|
|
return text;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]],
|
|||
|
|
initComplete: function () {
|
|||
|
|
// 在表格渲染完成后，重新渲染序号列
|
|||
|
|
var that = this.elem.next();
|
|||
|
|
var tool = that.children('.layui-table-box').children('.layui-table-fixed').children('.layui-table-body').children('.layui-table');
|
|||
|
|
tool.find("tr").each(function (index, item) {
|
|||
|
|
$(this).find('td[data-field="LAY_TABLE_INDEX"]').text(index + 1);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
done:function(res, curr, count, origin){
|
|||
|
|
console.log(res);
|
|||
|
|
},
|
|||
|
|
page: true, //开启分页
|
|||
|
|
loading: true, //数据加载中。。。
|
|||
|
|
limits: [5, 10, 20, 100],
|
|||
|
|
limit: 7
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
table.on('tool(test)', function (obj) {
|
|||
|
|
debugger
|
|||
|
|
var data = obj.data; //当前行数据
|
|||
|
|
var rowIndex = obj.index;
|
|||
|
|
var layEvent = obj.event; //当前点击的事件名
|
|||
|
|
if (layEvent === 'del') {
|
|||
|
|
layer.confirm('确定要删除吗？', {
|
|||
|
|
btn : [ '确定', '取消' ]
|
|||
|
|
}, function(index) {
|
|||
|
|
const url = commonUrl + "screen/largeScreen/personnelControl/delSubcontractorById";
|
|||
|
|
|
|||
|
|
const params = {
|
|||
|
|
"roleCode": roleCode,
|
|||
|
|
"orgId": orgId,
|
|||
|
|
"userId": userId,
|
|||
|
|
"bidCode": bidCode,
|
|||
|
|
"id": data.id
|
|||
|
|
}
|
|||
|
|
let encryptStr = encryptCBC(JSON.stringify(params));
|
|||
|
|
ajaxRequest(url, "POST", encryptStr, true, function () {
|
|||
|
|
}, function (result) {
|
|||
|
|
if (result.code === 200) {
|
|||
|
|
layer.close(index);
|
|||
|
|
table.reload('dome');
|
|||
|
|
} else if (result.code === 500) {
|
|||
|
|
layer.msg(result.msg, { icon: 2 });
|
|||
|
|
}else if(result.code === 401){
|
|||
|
|
loginout(1)
|
|||
|
|
}
|
|||
|
|
}, function (xhr) {
|
|||
|
|
// error(xhr)
|
|||
|
|
}, "application/json",aqEnnable);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
//权限判断
|
|||
|
|
form.on('switch(statusSwitch)', function(data){
|
|||
|
|
debugger
|
|||
|
|
var isChecked = data.elem.checked; // 获取复选框的当前状态
|
|||
|
|
var value = data.value; // 获取复选框的值
|
|||
|
|
let status = isChecked ? 1 : 0;
|
|||
|
|
const url = commonUrl + "screen/largeScreen/personnelControl/subcontractorSwitchListen";
|
|||
|
|
|
|||
|
|
const params = {
|
|||
|
|
"roleCode": roleCode,
|
|||
|
|
"orgId": orgId,
|
|||
|
|
"userId": userId,
|
|||
|
|
"bidCode": bidCode,
|
|||
|
|
"id": value,
|
|||
|
|
"status": status
|
|||
|
|
}
|
|||
|
|
let encryptStr = encryptCBC(JSON.stringify(params));
|
|||
|
|
ajaxRequest(url, "POST", encryptStr, true, function () {
|
|||
|
|
}, function (result) {
|
|||
|
|
if (result.code === 200) {
|
|||
|
|
layer.msg('状态更新成功');
|
|||
|
|
} else if (result.code === 500) {
|
|||
|
|
layer.msg(result.msg, { icon: 2 });
|
|||
|
|
}else if(result.code === 401){
|
|||
|
|
loginout(1)
|
|||
|
|
}
|
|||
|
|
}, function (xhr) {
|
|||
|
|
// error(xhr)
|
|||
|
|
}, "application/json",aqEnnable);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function mapInit(){
|
|||
|
|
// 获取经纬度
|
|||
|
|
var lat,lon;
|
|||
|
|
if (navigator.geolocation) {
|
|||
|
|
navigator.geolocation.getCurrentPosition(function (position) {
|
|||
|
|
lat = position.coords.latitude;
|
|||
|
|
lon = position.coords.longitude;
|
|||
|
|
console.log(lon,lat)
|
|||
|
|
map= new BMap.Map("map");
|
|||
|
|
map.centerAndZoom(new BMap.Point(lon,lat), 11);
|
|||
|
|
map.enableScrollWheelZoom(true);
|
|||
|
|
|
|||
|
|
|
|||
|
|
var marker = new BMap.Marker(new BMap.Point(lon,lat)); // 创建标注
|
|||
|
|
map.addOverlay(marker);
|
|||
|
|
|
|||
|
|
|
|||
|
|
var overlaycomplete = function (e) {
|
|||
|
|
overlays.push(e.overlay);
|
|||
|
|
debugger
|
|||
|
|
if (overlays.length > 0) {
|
|||
|
|
const polygon = overlays[0].Po;
|
|||
|
|
for (let i = 0; i < polygon.length; i++) {
|
|||
|
|
coordinates.push(polygon[i].lng + '@' +polygon[i].lat);
|
|||
|
|
}
|
|||
|
|
console.log("多边形顶点坐标:", coordinates);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
var styleOptions = {
|
|||
|
|
strokeColor: "red", //边线颜色。
|
|||
|
|
fillColor: "red", //填充颜色。当参数为空时，圆形将没有填充效果。
|
|||
|
|
strokeWeight: 3, //边线的宽度，以像素为单位。
|
|||
|
|
strokeOpacity: 0.8, //边线透明度，取值范围0 - 1。
|
|||
|
|
fillOpacity: 0.6, //填充的透明度，取值范围0 - 1。
|
|||
|
|
strokeStyle: 'solid' //边线的样式，solid或dashed。
|
|||
|
|
}
|
|||
|
|
//实例化鼠标绘制工具
|
|||
|
|
var drawingManager = new BMapLib.DrawingManager(map, {
|
|||
|
|
isOpen: false, //是否开启绘制模式
|
|||
|
|
enableDrawingTool: true, //是否显示工具栏
|
|||
|
|
drawingToolOptions: {
|
|||
|
|
anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
|
|||
|
|
offset: new BMap.Size(5, 5), //偏离值
|
|||
|
|
},
|
|||
|
|
circleOptions: styleOptions, //圆的样式
|
|||
|
|
polylineOptions: styleOptions, //线的样式
|
|||
|
|
polygonOptions: styleOptions, //多边形的样式
|
|||
|
|
rectangleOptions: styleOptions //矩形的样式
|
|||
|
|
});
|
|||
|
|
//添加鼠标绘制工具监听事件，用于获取绘制结果
|
|||
|
|
drawingManager.addEventListener('overlaycomplete', overlaycomplete);
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
console.log("浏览器不支持 Geolocation API");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|