From 886ae93d02bf5350a67c84a7701f13f517801506 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Sat, 24 Apr 2021 08:53:33 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/jfpt-Vue
---
public/map/images/point.png | 0
public/map/images/edit.png | 0
vue.config.js | 76 ++++++------
src/views/supervisoryConsole/data.vue | 2
public/map/widgets/securityMap/template.html | 20 ++
src/views/policeTracking/policeTracking.vue | 35 +++--
public/map/widgets/securityMap/SecurityMap.js | 167 +++++++++++++++++++--------
public/map/widgets/securityMap/SecurityMap.css | 35 +++++
8 files changed, 230 insertions(+), 105 deletions(-)
diff --git a/public/map/images/edit.png b/public/map/images/edit.png
new file mode 100644
index 0000000..dbdecef
--- /dev/null
+++ b/public/map/images/edit.png
Binary files differ
diff --git a/public/map/images/point.png b/public/map/images/point.png
new file mode 100644
index 0000000..407e872
--- /dev/null
+++ b/public/map/images/point.png
Binary files differ
diff --git a/public/map/widgets/securityMap/SecurityMap.css b/public/map/widgets/securityMap/SecurityMap.css
index 666c505..1c5a942 100644
--- a/public/map/widgets/securityMap/SecurityMap.css
+++ b/public/map/widgets/securityMap/SecurityMap.css
@@ -1,10 +1,10 @@
.mapBtn {
background-color: #ffffff;
- width: 14vh;
+ width: 20.4vh;
height: 4vh;
position: relative;
top: 3vh;
- right: -45vh;
+ right: -22vh;
border-radius: 5px;
}
@@ -22,6 +22,10 @@
letter-spacing: 1.5px;
}
+.editBtn {
+ float: left;
+}
+
.mapBtn img {
position: relative;
left: 1.2vh;
@@ -31,4 +35,31 @@
a:hover {
color: #3385FF;
cursor: pointer;
+}
+
+.insBtn:hover {
+ cursor: pointer;
+ color: #3385FF;
+}
+
+.editBtn:hover {
+ cursor: pointer;
+}
+
+.delBtn:hover {
+ cursor: pointer;
+}
+
+.tips {
+ width: 120px;
+ height: 18px;
+ background-color: #ffffff;
+ position: absolute;
+ display: none;
+ border-radius: 5px;
+}
+
+.tips span {
+ line-height: 18px;
+ font-size: 10px;
}
\ No newline at end of file
diff --git a/public/map/widgets/securityMap/SecurityMap.js b/public/map/widgets/securityMap/SecurityMap.js
index afed30a..09b16d2 100644
--- a/public/map/widgets/securityMap/SecurityMap.js
+++ b/public/map/widgets/securityMap/SecurityMap.js
@@ -142,6 +142,9 @@
//当前处警员是否已有电子围栏
isEngineer: false,
+ //是否可编辑
+ isEdit: false,
+
// 用来记录巡逻区域或者巡逻路线的下标的
patrolIndex: 0,
@@ -151,6 +154,9 @@
y: 0,
offset: null,
moveThis: null,
+
+ //编辑工具激活后为true
+ editToolbarStatus: false,
//基础路径
//pathUrl: "http://localhost:89",
@@ -196,7 +202,13 @@
var that = this;
//删除电子围栏点击事件
- $(".mapBtn .delete").click(function() {
+ $(".mapBtn .delBtn").click(function() {
+ if (!that.isEngineer) {
+ layui.use('layer', function() {
+ layui.layer.msg('请先新增电子围栏信息!')
+ })
+ return;
+ }
//需选中电子围栏，然后进行删除
layer.confirm('是否确认删除', {
btn: ['确定', '取消'], //按钮
@@ -225,17 +237,39 @@
})
//新增电子围栏
- $('.mapBtn .insert').click(function() {
+ $('.mapBtn .insBtn').click(function() {
+ //修改按钮样式
+ $("#insertEngineeringMap").css("color", "#3385FF")
+ //判断
if (that.isEngineer) {
layui.use('layer', function() {
- layui.layer.msg('已存在电子围栏');
- })
+ layui.layer.msg('已存在电子围栏');
+ })
+ //新增按钮颜色改回
+ $("#insertEngineeringMap").css("color", "#757575");
} else {
layui.use('layer', function() {
layui.layer.msg('请开始划分电子围栏');
})
that.polygonFlag = true;
}
+ })
+
+
+ //编辑电子围栏
+ $('.mapBtn .editBtn').click(function() {
+ if (!that.isEngineer) {
+ layui.use('layer', function() {
+ layui.layer.msg('请先新增电子围栏信息!')
+ })
+ return;
+ }
+ $("#editEngineeringMap").css("color", "#3385FF");
+ //修改为可编辑状态
+ that.isEdit = true;
+ layui.use('layer', function() {
+ layui.layer.msg('点击电子围栏图形即可编辑');
+ })
})
},
@@ -307,13 +341,9 @@
//鼠标右击事件
document.getElementById('mainMapWidget').onmousedown = function(event) {
+ //去除系统默认右键功能
+ event.preventDefault();
if (event.button == 2) {
- if (that.polygonData.length < 2) {
- layui.use('layer', function() {
- layui.layer.msg('不能形成区域，请继续划分！！！')
- })
- return;
- }
if (that.polygonFlag == true) {
// 勾画最后一个点
var normalizedVal = webMercatorUtils.xyToLngLat(event.mapPoint.x, event.mapPoint.y);
@@ -350,8 +380,12 @@
success: function(result) {
if (result.code == 200) {
layui.use('layer', function() {
- layui.layer.msg('新增电子围栏成功!')
- })
+ layui.layer.msg('新增电子围栏成功!')
+ })
+ //清除点信息
+ that.polygonData = [];
+ //新增按钮颜色改回
+ $("#insertEngineeringMap").css("color", "#757575");
}
}
})
@@ -404,58 +438,75 @@
that.isChecked = true;
- self.modifyPolygon();
+ //self.modifyPolygon();
- self.activateToolbar(evt.graphic);
+ //进入编辑状态
+ //self.activateToolbar(evt.graphic);
} else { // 点击不在图形上
//修改电子围栏选中状态
that.isChecked = false;
+
self.modifyPolygon()
+ }
+
+ if (that.isEdit) {
+ that.isChecked = true;
+ self.modifyPolygon();
+ //进入编辑状态
+ self.activateToolbar(evt.graphic);
}
}
}
// 提示信息
- $(document).off('mousemove').mousemove(function(e) {
- var y = e.clientY + 10;
- var x = e.clientX + 20;
-
- if (e.clientX < 40) {
- var x = 40;
- }
-
- if (e.clientY < 42) {
- y = 42;
- }
-
- if (e.clientY > ($(window).height() - 82)) {
- y = ($(window).height() - 66);
- }
-
- if (e.clientX > ($(window).width() - 184)) {
- x = ($(window).width() - 184);
- }
-
+ $(document).off('mousemove').mousemove(function(ev) {
+ var oEvent = ev || event;
+ //鼠标移动
+ var oDiv1 = document.getElementById('securityMapTips1');
+ var oDiv2 = document.getElementById('securityMapTips2');
+ var oDiv3 = document.getElementById('securityMapTips3');
+ var oDiv4 = document.getElementById('securityMapTips4');
+ //新增电子围栏提示语
if (self.polygonFlag == true) {
- $('.securityMapTips').stop().show();
-
+ var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+ var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
if (self.polygonData.length == 0) {
- $('.securityMapTips').text('单击左键开始绘制。');
- } else {
- if (e.clientY > ($(window).height() - 98)) {
- y = ($(window).height() - 88);
- }
- $('.securityMapTips').text('单击左键新增加点。单击右键完成绘制。');
+ oDiv1.style.left = oEvent.clientX + scrollLeft + 15 + 'px';
+ oDiv1.style.top = oEvent.clientY + scrollTop + 'px';
+ oDiv1.style.display = 'block';
}
- $('.securityMapTips').css({
- 'top': y,
- 'left': x,
- })
+ if (self.polygonData.length == 1) {
+ oDiv1.style.display = 'none';
+ oDiv2.style.left = oEvent.clientX + scrollLeft + 15 + 'px';
+ oDiv2.style.top = oEvent.clientY + scrollTop + 'px';
+ oDiv2.style.display = 'block';
+ }
+
+ if (self.polygonData.length > 1) {
+ oDiv2.style.display = 'none';
+ oDiv3.style.left = oEvent.clientX + scrollLeft + 15 + 'px';
+ oDiv3.style.top = oEvent.clientY + scrollTop + 'px';
+ oDiv3.style.display = 'block';
+ }
} else {
- $('.securityMapTips').stop().hide();
+ oDiv3.style.display = 'none';
}
+
+ //编辑电子围栏提示语
+ if (that.editToolbarStatus) {
+ $("#securityMapTips4").css("width", "200px");
+ $("#securityMapTips4").css("height", "36");
+ var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+ var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
+ oDiv4.style.left = oEvent.clientX + scrollLeft + 15 + 'px';
+ oDiv4.style.top = oEvent.clientY + scrollTop + 'px';
+ oDiv4.style.display = 'block';
+ } else {
+ oDiv4.style.display = 'none';
+ }
+
})
},
@@ -510,18 +561,29 @@
routeInfo: dataStr
},
success: function(result) {
- if (result.code == 200) {}
+ if (result.code == 200) {
+ layui.use('layer', function() {
+ layui.layer.msg('电子围栏修改成功!');
+ })
+ $("#editEngineeringMap").css("color", "#757575");
+ $("#securityMapTips4").css("display", "none");
+ self.isEdit = false;
+ self.editToolbarStatus = false;
+ }
}
})
-
}
},
activateToolbar: function(graphic) {
+ var that = this;
+
+ that.editToolbarStatus = true;
var tool = 0;
this.editToolbar = new Edit(this._map);
+
// if (registry.byId("tool_move").checked) {
tool = tool | Edit.MOVE;
@@ -566,7 +628,11 @@
//在地图上新增点
addPoint: function(entitys, lgtd, lttd, img) {
- var symbol = new esri.symbol.PictureMarkerSymbol(img, 22, 22);
+ if (img == undefined) {
+ var symbol = new esri.symbol.PictureMarkerSymbol('./images/point.png', 22, 22);
+ } else {
+ var symbol = new esri.symbol.PictureMarkerSymbol(img, 22, 22);
+ }
var pt = new Point(lgtd, lttd, new SpatialReference({
wkid: 4326
}));
@@ -574,6 +640,7 @@
entitys.add(graphic);
},
+
//绘制多边形
addPolygon: function(entitys, rings) {
entitys.clear();
diff --git a/public/map/widgets/securityMap/template.html b/public/map/widgets/securityMap/template.html
index 507553e..ed51a59 100644
--- a/public/map/widgets/securityMap/template.html
+++ b/public/map/widgets/securityMap/template.html
@@ -2,15 +2,29 @@
<div class="mapBtn">
<div class="insBtn">
<img src="./images/add-0.png" style="width:14px;height:14px;">
- <a class=" insert " id="insertEngineeringMap ">新增 | </a>
+ <a class=" insert " id="insertEngineeringMap">新增 | </a>
+ </div>
+ <div class="editBtn">
+ <img src="./images/edit.png" style="width:14px;height:14px;">
+ <a class=" edit " id="editEngineeringMap">编辑 | </a>
</div>
<div class="delBtn">
<img src="./images/del.png" style="width:14px;height:14px;">
- <a class="delete " id="securityMapClearMap ">删除</a>
+ <a class="delete " id="securityMapClearMap">删除</a>
</div>
</div>
<!-- 提示语 -->
- <div class="securityMapTips">
+ <div id="securityMapTips1" class="tips">
+ <span>左键点击开始绘制</span>
+ </div>
+ <div id="securityMapTips2" class="tips">
+ <span>左键以继续绘制</span>
+ </div>
+ <div id="securityMapTips3" class="tips">
+ <span>右键点击完成绘制</span>
+ </div>
+ <div id="securityMapTips4" class="tips">
+ <span>拖动点或线来改变电子围栏区域,点击围栏区域外地图任意点完成修改</span>
</div>
</div>
\ No newline at end of file
diff --git a/src/views/policeTracking/policeTracking.vue b/src/views/policeTracking/policeTracking.vue
index a62d353..1d7858c 100644
--- a/src/views/policeTracking/policeTracking.vue
+++ b/src/views/policeTracking/policeTracking.vue
@@ -186,7 +186,9 @@
<i class="el-icon-document avue-group__icon"></i>
<h1 class="avue-group__title">人员信息</h1>
<el-button
- @click="onSubmit('通知' + ensureNames, 1), (flag = false)"
+ @click="
+ onSubmit('通知' + ensureNames, 1, ensureId), (flag = false)
+ "
size="small"
style="position: absolute; right: 0"
:disabled="!flag"
@@ -584,6 +586,7 @@
tableData: [],
multipleSelection: [],
ensureNames: "",
+ ensureId: "",
baseUrl: "",
oldVideoSatart: false,
vaddress: null,
@@ -729,23 +732,27 @@
currenS,
};
},
- onSubmit(zc, jtype) {
+ onSubmit(zc, jtype, ensureId) {
var that = this;
+ var subData = {
+ jid: this.form.id,
+ jtype: jtype,
+ rid: this.form.alarmId,
+ bz: this.form.bz,
+ snumber: this.form.alarmId,
+ sname: this.form.alarmPeople,
+ zc: zc,
+ zctime: this.getDate().current,
+ };
+ if (ensureId && ensureId != "") {
+ subData.securityArr = ensureId;
+ }
axios
.post(
"/api/blade-jfpts/alarm/alarm/updateJtype",
{},
{
- params: {
- jid: this.form.id,
- jtype: jtype,
- rid: this.form.alarmId,
- bz: this.form.bz,
- snumber: this.form.alarmId,
- sname: this.form.alarmPeople,
- zc: zc,
- zctime: this.getDate().current,
- },
+ params: subData,
}
)
.then(function (res) {
@@ -813,8 +820,12 @@
},
handleSelectionChange(val) {
+ console.log(val, 9898);
this.ensureNames = "";
+ this.ensureId = "";
val.forEach((item, index) => {
+ this.ensureId += item.id;
+ this.ensureId += ",";
if (index == val.length - 1) {
this.ensureNames += item.name;
this.ensureNames += "。";
diff --git a/src/views/supervisoryConsole/data.vue b/src/views/supervisoryConsole/data.vue
index 593130d..2e43caa 100644
--- a/src/views/supervisoryConsole/data.vue
+++ b/src/views/supervisoryConsole/data.vue
@@ -78,7 +78,7 @@
class="info-content-table"
:data="tableData"
stripe
- style="width: 100%; margin: 10px"
+ style="width: 100%; margin: 0 10px"
max-height="380px"
:resizable="false"
>
diff --git a/vue.config.js b/vue.config.js
index 906b7b2..35901e5 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -7,42 +7,44 @@
* @LastEditTime: 2021-01-29 15:58:39
*/
module.exports = {
- //路径前缀
- publicPath: "./",
- lintOnSave: true,
- productionSourceMap: false,
- chainWebpack: (config) => {
- //忽略的打包文件
- config.externals({
- 'vue': 'Vue',
- 'vue-router': 'VueRouter',
- 'vuex': 'Vuex',
- 'axios': 'axios',
- 'element-ui': 'ELEMENT',
- });
- const entry = config.entry('app');
- entry.add('babel-polyfill').end();
- entry.add('classlist-polyfill').end();
- entry.add('@/mock').end();
- },
- css: {
- extract: { ignoreOrder: true }
- },
- //开发模式反向代理配置，生产模式请使用Nginx部署并配置反向代理
- devServer: {
- port: 1888,
- proxy: {
- '/api': {
- //本地服务接口地址
- // target: 'http://localhost:82/',
- target: 'https://web.byisf.com/api/',
- //远程演示服务地址,可用于直接启动项目
- //target: 'https://saber.bladex.vip/api',
- ws: true,
- pathRewrite: {
- '^/api': '/'
- }
- }
- }
+ //路径前缀
+ publicPath: "./",
+ lintOnSave: true,
+ productionSourceMap: false,
+ chainWebpack: (config) => {
+ //忽略的打包文件
+ config.externals({
+ 'vue': 'Vue',
+ 'vue-router': 'VueRouter',
+ 'vuex': 'Vuex',
+ 'axios': 'axios',
+ 'element-ui': 'ELEMENT',
+ });
+ const entry = config.entry('app');
+ entry.add('babel-polyfill').end();
+ entry.add('classlist-polyfill').end();
+ entry.add('@/mock').end();
+ },
+ css: {
+ extract: {
+ ignoreOrder: true
}
+ },
+ //开发模式反向代理配置，生产模式请使用Nginx部署并配置反向代理
+ devServer: {
+ port: 1888,
+ proxy: {
+ '/api': {
+ //本地服务接口地址
+ // target: 'http://192.168.0.109:82/',
+ target: 'https://web.byisf.com/api/',
+ //远程演示服务地址,可用于直接启动项目
+ //target: 'https://saber.bladex.vip/api',
+ ws: true,
+ pathRewrite: {
+ '^/api': '/'
+ }
+ }
+ }
+ }
};
--
Gitblit v1.9.3