|
|
@@ -7,15 +7,18 @@
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
|
<title>新闻发布</title>
|
|
|
- <link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}">
|
|
|
+ <link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}">
|
|
|
<link rel="stylesheet" href="{% static '/lib/css/reset.css' %}">
|
|
|
- <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=EpbgpqakDpXGN9E3ejg6e93ffsi83b0t"></script>
|
|
|
- <!--加载鼠标绘制工具-->
|
|
|
- <script type="text/javascript" src="//api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
|
|
|
- <link rel="stylesheet" href="//api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" />
|
|
|
- <!--加载检索信息窗口-->
|
|
|
- <script type="text/javascript" src="//api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.js"></script>
|
|
|
- <link rel="stylesheet" href="//api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.css" />
|
|
|
+ <script type="text/javascript"
|
|
|
+ src="https://api.map.baidu.com/api?v=2.0&ak=EpbgpqakDpXGN9E3ejg6e93ffsi83b0t"></script>
|
|
|
+ <!--加载鼠标绘制工具-->
|
|
|
+ <script type="text/javascript"
|
|
|
+ src="//api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
|
|
|
+ <link rel="stylesheet" href="//api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" />
|
|
|
+ <!--加载检索信息窗口-->
|
|
|
+ <script type="text/javascript"
|
|
|
+ src="//api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.js"></script>
|
|
|
+ <link rel="stylesheet" href="//api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.css" />
|
|
|
<style>
|
|
|
.breadcrumbs {
|
|
|
padding: 12px 0 12px 30px;
|
|
|
@@ -150,36 +153,42 @@
|
|
|
background: url(../../static/imgs/uploadImgIcon.png) no-repeat center;
|
|
|
background-size: 80% 80%;
|
|
|
}
|
|
|
- /* 地图 */
|
|
|
- .layui-form-label{
|
|
|
- width: 102px;
|
|
|
- }
|
|
|
- .mapBox{
|
|
|
- display: flex;
|
|
|
- }
|
|
|
- .map{
|
|
|
- width: 55%;
|
|
|
- height: 400px;
|
|
|
- border: 1px solid #878787;
|
|
|
- }
|
|
|
- .locatPoint button{
|
|
|
- padding: 5px 10px;
|
|
|
- border-radius: 4px;
|
|
|
- margin: 10px 20px 5px;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- .locatPoint button.sw{
|
|
|
- background-color: #ed9c22;
|
|
|
- }
|
|
|
- .locatPoint button.ne{
|
|
|
- background-color: #22a3ed;
|
|
|
-
|
|
|
- }
|
|
|
- .locatPoint button.center{
|
|
|
- background-color: #ed2289;
|
|
|
-
|
|
|
- }
|
|
|
|
|
|
+ /* 地图 */
|
|
|
+ .layui-form-label {
|
|
|
+ width: 102px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mapBox {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .map {
|
|
|
+ width: 55%;
|
|
|
+ height: 400px;
|
|
|
+ border: 1px solid #878787;
|
|
|
+ }
|
|
|
+
|
|
|
+ .locatPoint button {
|
|
|
+ padding: 5px 10px;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin: 10px 20px 5px;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .locatPoint button.sw {
|
|
|
+ background-color: #ed9c22;
|
|
|
+ }
|
|
|
+
|
|
|
+ .locatPoint button.ne {
|
|
|
+ background-color: #22a3ed;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .locatPoint button.center {
|
|
|
+ background-color: #ed2289;
|
|
|
+
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
@@ -191,7 +200,7 @@
|
|
|
<span class="layui-breadcrumb">
|
|
|
<a target="BoardRight">首页</a>
|
|
|
<a>
|
|
|
- <cite>信息发布</cite>
|
|
|
+ <cite>首页设置</cite>
|
|
|
</a>
|
|
|
</span>
|
|
|
</div>
|
|
|
@@ -216,39 +225,39 @@
|
|
|
<!-- 隐藏的input -->
|
|
|
<input type="hidden" id="img_url" name="upload" value="" />
|
|
|
<div class="layui-upload-list">
|
|
|
- <img class="layui-upload-img" id="demo1" :src=head_img>
|
|
|
+ <img class="layui-upload-img" id="demo1" :src=''>
|
|
|
<p id="demoText"></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="layui-form-item">
|
|
|
+ </div>
|
|
|
+ <div class="layui-form-item">
|
|
|
<label class="layui-form-label">图片定位：</label>
|
|
|
<div class="layui-input-block">
|
|
|
<div class="mapBox">
|
|
|
- <div id="imgmap" class="map"></div>
|
|
|
- <div class="locatPoint">
|
|
|
+ <div id="imgmap" class="map"></div>
|
|
|
+ <div class="locatPoint">
|
|
|
圈出当前图片展示位置
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="layui-form-item">
|
|
|
+ </div>
|
|
|
+ <div class="layui-form-item">
|
|
|
<label class="layui-form-label">地图中心点：</label>
|
|
|
<div class="layui-input-block">
|
|
|
<div class="mapBox">
|
|
|
- <div id="centermap" class="map"></div>
|
|
|
- <div class="locatPoint">
|
|
|
- 拖动标注，定位中心点
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div id="centermap" class="map"></div>
|
|
|
+ <div class="locatPoint">
|
|
|
+ 拖动标注，定位中心点
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<div class="layui-form-item">
|
|
|
<div class="layui-input-block">
|
|
|
<button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
|
|
|
<!-- <button type="reset" class="layui-btn layui-btn-primary">重置</button> -->
|
|
|
- <button class="layui-btn layui-btn-primary clearForm" type="button" >取消</button>
|
|
|
+ <button class="layui-btn layui-btn-primary clearForm" type="button">取消</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
@@ -265,7 +274,7 @@
|
|
|
<script src="{% static '/js/backstageNet/common.js'%}"></script>
|
|
|
<script>
|
|
|
var element, form, upload;
|
|
|
- layui.use(['element', 'form', 'upload','layer'], function () {
|
|
|
+ layui.use(['element', 'form', 'upload', 'layer'], function () {
|
|
|
element = layui.element;
|
|
|
form = layui.form;
|
|
|
upload = layui.upload;
|
|
|
@@ -278,7 +287,7 @@
|
|
|
//新闻图片上传
|
|
|
var uploadInst = upload.render({
|
|
|
elem: '#newsUpImg'
|
|
|
- , url: 'news_photo'
|
|
|
+ , url: 'setMap'
|
|
|
, field: 'upicture'
|
|
|
, accept: 'images' //只允许上传图片
|
|
|
// , acceptMime: 'image/*' //只筛选图片
|
|
|
@@ -312,11 +321,11 @@
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
-
|
|
|
- // 百度地图API功能
|
|
|
- var map = new BMap.Map("imgmap", { mapType: BMAP_NORMAL_MAP, minZoom: 4 });//BMAP_HYBRID_MAP 卫星地图
|
|
|
- map.centerAndZoom(new BMap.Point(119.604114, 26.09877), 13);
|
|
|
- // 添加带有定位的导航控件
|
|
|
+
|
|
|
+ // 百度地图API功能
|
|
|
+ var map = new BMap.Map("imgmap", { mapType: BMAP_NORMAL_MAP, minZoom: 4 });//BMAP_HYBRID_MAP 卫星地图
|
|
|
+ map.centerAndZoom(new BMap.Point(119.604114, 26.09877), 13);
|
|
|
+ // 添加带有定位的导航控件
|
|
|
var navigationControl = new BMap.NavigationControl({
|
|
|
// 靠左上角位置
|
|
|
anchor: BMAP_ANCHOR_TOP_LEFT,
|
|
|
@@ -328,76 +337,64 @@
|
|
|
map.addControl(navigationControl);
|
|
|
|
|
|
map.enableScrollWheelZoom(); //启用鼠标滚动对地图放大缩小
|
|
|
- var styleOptions = {
|
|
|
- strokeColor: "red", //边线颜色。
|
|
|
- fillColor: "red", //填充颜色。当参数为空时，圆形将没有填充效果。
|
|
|
- strokeWeight: 3, //边线的宽度，以像素为单位。
|
|
|
- strokeOpacity: 0.5, //边线透明度，取值范围0 - 1。
|
|
|
- fillOpacity: 0.1, //填充的透明度，取值范围0 - 1。
|
|
|
- strokeStyle: 'solid' //边线的样式，solid或dashed。
|
|
|
- }
|
|
|
- //实例化鼠标绘制工具
|
|
|
- var drawingManager = new BMapLib.DrawingManager(map, {
|
|
|
- isOpen: false, //是否开启绘制模式
|
|
|
- drawingControl:false,
|
|
|
- draggable:false,
|
|
|
- enableDrawingTool: true, //是否显示工具栏
|
|
|
- drawingToolOptions: {
|
|
|
- anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
|
|
|
- offset: new BMap.Size(5, 40), //偏离值
|
|
|
- drawingModes: [
|
|
|
- BMAP_DRAWING_RECTANGLE
|
|
|
- ]
|
|
|
- },
|
|
|
- polygonOptions: styleOptions //多边形的样式
|
|
|
- });
|
|
|
-
|
|
|
- document.getElementsByClassName('BMapLib_rectangle')[0].addEventListener('click', e => {
|
|
|
- // 这里是你的执行操作
|
|
|
- clearAll()
|
|
|
- })
|
|
|
-
|
|
|
- //鼠标绘制完成回调方法 获取各个点的经纬度
|
|
|
- var overlays = [];
|
|
|
- var swneLatLng = [];
|
|
|
- var overlaycomplete = function (e) {
|
|
|
- drawingManager.close();
|
|
|
- swneLatLng = [];
|
|
|
- overlays.push(e.overlay);
|
|
|
-
|
|
|
+ var styleOptions = {
|
|
|
+ strokeColor: "red", //边线颜色。
|
|
|
+ fillColor: "red", //填充颜色。当参数为空时，圆形将没有填充效果。
|
|
|
+ strokeWeight: 3, //边线的宽度，以像素为单位。
|
|
|
+ strokeOpacity: 0.5, //边线透明度，取值范围0 - 1。
|
|
|
+ fillOpacity: 0.1, //填充的透明度，取值范围0 - 1。
|
|
|
+ strokeStyle: 'solid' //边线的样式，solid或dashed。
|
|
|
+ }
|
|
|
+ //实例化鼠标绘制工具
|
|
|
+ var drawingManager = new BMapLib.DrawingManager(map, {
|
|
|
+ isOpen: false, //是否开启绘制模式
|
|
|
+ drawingControl: false,
|
|
|
+ draggable: false,
|
|
|
+ enableDrawingTool: true, //是否显示工具栏
|
|
|
+ drawingToolOptions: {
|
|
|
+ anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
|
|
|
+ offset: new BMap.Size(5, 40), //偏离值
|
|
|
+ drawingModes: [
|
|
|
+ BMAP_DRAWING_RECTANGLE
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ polygonOptions: styleOptions //多边形的样式
|
|
|
+ });
|
|
|
+
|
|
|
+ document.getElementsByClassName('BMapLib_rectangle')[0].addEventListener('click', e => {
|
|
|
+ // 这里是你的执行操作
|
|
|
+ clearAll()
|
|
|
+ })
|
|
|
+
|
|
|
+ //鼠标绘制完成回调方法 获取各个点的经纬度
|
|
|
+ var overlays = [];
|
|
|
+ var swneLatLng = [];
|
|
|
+ var overlaycomplete = function (e) {
|
|
|
+ drawingManager.close();
|
|
|
+ swneLatLng = [];
|
|
|
+ overlays.push(e.overlay);
|
|
|
+
|
|
|
swneLatLng.push(e.overlay.zo[1])
|
|
|
swneLatLng.push(e.overlay.zo[3])
|
|
|
-
|
|
|
- e.overlay.enableEditing();
|
|
|
- };
|
|
|
-
|
|
|
- //添加鼠标绘制工具监听事件，用于获取绘制结果
|
|
|
- drawingManager.addEventListener('overlaycomplete', overlaycomplete);
|
|
|
- function clearAll() {
|
|
|
-
|
|
|
- for (var i = 0; i < overlays.length; i++) {
|
|
|
- map.removeOverlay(overlays[i]);
|
|
|
- }
|
|
|
- overlays.length = 0
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- // var point = new BMap.Point(119.578243,26.074887);
|
|
|
- // var swIcon = new BMap.Icon("../static/imgs/homeIcon2.png", new BMap.Size(21,25),{imageSize: new BMap.Size(21,25)});
|
|
|
- // var marker = new BMap.Marker(point,{icon:swIcon});// 西南
|
|
|
- // imgmap.addOverlay(marker);
|
|
|
- // var point = new BMap.Point(119.633435,26.109152);
|
|
|
- // var marker = new BMap.Marker(point);// 东北
|
|
|
- // imgmap.addOverlay(marker);
|
|
|
- // imgmap.addEventListener("click",function(e){
|
|
|
- // alert(e.point.lng + "," + e.point.lat);
|
|
|
- // });
|
|
|
-
|
|
|
-
|
|
|
- var centermap = new BMap.Map("centermap", { mapType: BMAP_NORMAL_MAP, minZoom: 4 });
|
|
|
- centermap.centerAndZoom(new BMap.Point(119.604114, 26.09877), 13);
|
|
|
- // 添加带有定位的导航控件
|
|
|
- var navigationControl = new BMap.NavigationControl({
|
|
|
+
|
|
|
+ e.overlay.enableEditing();
|
|
|
+ };
|
|
|
+
|
|
|
+ //添加鼠标绘制工具监听事件，用于获取绘制结果
|
|
|
+ drawingManager.addEventListener('overlaycomplete', overlaycomplete);
|
|
|
+ function clearAll() {
|
|
|
+
|
|
|
+ for (var i = 0; i < overlays.length; i++) {
|
|
|
+ map.removeOverlay(overlays[i]);
|
|
|
+ }
|
|
|
+ overlays.length = 0
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ var centermap = new BMap.Map("centermap", { mapType: BMAP_NORMAL_MAP, minZoom: 4 });
|
|
|
+ centermap.centerAndZoom(new BMap.Point(119.604114, 26.09877), 13);
|
|
|
+ // 添加带有定位的导航控件
|
|
|
+ var navigationControl = new BMap.NavigationControl({
|
|
|
// 靠左上角位置
|
|
|
anchor: BMAP_ANCHOR_TOP_LEFT,
|
|
|
// LARGE类型
|
|
|
@@ -409,64 +406,84 @@
|
|
|
|
|
|
centermap.enableScrollWheelZoom(); //启用鼠标滚动对地图放大缩小
|
|
|
var point = new BMap.Point(119.604114, 26.09877);
|
|
|
- var swIcon = new BMap.Icon("../static/imgs/homeIcon1.png", new BMap.Size(21,25),{imageSize: new BMap.Size(21,25)});
|
|
|
- var centermapMarker = new BMap.Marker(point,{icon:swIcon});// 东北
|
|
|
- centermap.addOverlay(centermapMarker);
|
|
|
+ var swIcon = new BMap.Icon("../static/imgs/homeIcon1.png", new BMap.Size(21, 25), { imageSize: new BMap.Size(21, 25) });
|
|
|
+ var centermapMarker = new BMap.Marker(point, { icon: swIcon });// 东北
|
|
|
+ centermap.addOverlay(centermapMarker);
|
|
|
centermapMarker.enableDragging();
|
|
|
|
|
|
+ function GetBasePolygon() {
|
|
|
+
|
|
|
+ var polygon = "";
|
|
|
+
|
|
|
+ for (var i = 0; i < overlays.length; i++) {
|
|
|
+ var path = overlays[i].getPath();//Array<Point> 返回多边型的点数组
|
|
|
+ var str = "";
|
|
|
+
|
|
|
+ for (var j = 0; j < path.length; j++) {
|
|
|
+
|
|
|
+ if (str != "")
|
|
|
+ str += ";";
|
|
|
+
|
|
|
+ str += path[j].lng + "," + path[j].lat;
|
|
|
+ // console.log("overlays" + i + "::lng:" + path2[j].lng + "\n lat:" + path2[j].lat);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (str != "") {
|
|
|
+ if (polygon != "")
|
|
|
+ polygon += "|";
|
|
|
+
|
|
|
+ polygon += str;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log('polygon');
|
|
|
+ return polygon;
|
|
|
+ }
|
|
|
+
|
|
|
//监听提交
|
|
|
form.on('submit(formDemo)', function (data) {
|
|
|
- console.log(swneLatLng)
|
|
|
+ console.log(swneLatLng)
|
|
|
var contentLngLat = [];
|
|
|
var allOverlay = centermap.getOverlays();
|
|
|
- for(var i= 0;i<allOverlay.length;i++){
|
|
|
- if(allOverlay[i].Pa){
|
|
|
+ for (var i = 0; i < allOverlay.length; i++) {
|
|
|
+ if (allOverlay[i].Pa) {
|
|
|
contentLngLat.push(allOverlay[i].point.lng)
|
|
|
contentLngLat.push(allOverlay[i].point.lat)
|
|
|
}
|
|
|
}
|
|
|
var img_url = $('#img_url').val();
|
|
|
- console.log(contentLngLat)
|
|
|
- console.log(img_url)
|
|
|
- var data = {
|
|
|
- swne:swneLatLng,
|
|
|
- contentPoint:contentLngLat,
|
|
|
- img_url:img_url
|
|
|
- }
|
|
|
+ console.log(contentLngLat)
|
|
|
+ console.log(img_url)
|
|
|
|
|
|
- // window.id = data.field.id
|
|
|
+
|
|
|
if (!img_url) {
|
|
|
layer.msg("请上传地图底图", { icon: 5 });
|
|
|
return false;
|
|
|
}
|
|
|
- // var content = editor1.getData();
|
|
|
- // // alert(content)
|
|
|
+
|
|
|
if (!swneLatLng.length) {
|
|
|
layer.msg("请绘制图片展示区域", { icon: 5 });
|
|
|
return false;
|
|
|
}
|
|
|
- // var fields = data.field;
|
|
|
- // CKupdate()
|
|
|
-
|
|
|
+ var polygon = GetBasePolygon();
|
|
|
+ console.log(polygon)
|
|
|
+
|
|
|
$.ajax({
|
|
|
- url: 'news_pub',
|
|
|
- data: JSON.stringify(data),
|
|
|
+ url: 'pic_locat',
|
|
|
+ data: {
|
|
|
+ "locat1": JSON.stringify(swneLatLng[0]),
|
|
|
+ "locat2": JSON.stringify(swneLatLng[1]),
|
|
|
+ "pic_center":JSON.stringify(contentLngLat),
|
|
|
+ "locat_info": polygon,
|
|
|
+ "addr": img_url
|
|
|
+ },
|
|
|
type: 'post',
|
|
|
success: function (data) {
|
|
|
- if (data) {
|
|
|
- if (window.id !== '') {
|
|
|
- layer.msg("发布成功，等待审核", { icon: 1 });
|
|
|
- } else {
|
|
|
- layer.msg("发布成功，等待审核", { icon: 1 });
|
|
|
- }
|
|
|
- msgTitleSaveFun(fields.title,5)
|
|
|
+ if (data == 1) {
|
|
|
+ layer.msg("修改成功", { icon: 1 });
|
|
|
clearForm()
|
|
|
- } else {
|
|
|
- if (window.id !== '') {
|
|
|
- parent.layer.msg("发布失败", { icon: 2 });
|
|
|
- } else {
|
|
|
- layer.msg("发布失败", { icon: 2 });
|
|
|
- }
|
|
|
+ }else{
|
|
|
+ layer.msg("修改失败", { icon: 2 });
|
|
|
}
|
|
|
},
|
|
|
error: function (type) {
|
|
|
@@ -476,11 +493,11 @@
|
|
|
return false;
|
|
|
|
|
|
});
|
|
|
-
|
|
|
- $('.clearForm').on('click',function(){
|
|
|
+
|
|
|
+ $('.clearForm').on('click', function () {
|
|
|
clearForm()
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
function clearForm() {
|
|
|
form.val('newsFormDiv', {
|
|
|
"title": "",
|
|
|
@@ -491,16 +508,16 @@
|
|
|
$('.uploadImg').addClass('uploadImgIcon');
|
|
|
$('#demo1').removeAttr('src'); //图片链接（base64）
|
|
|
clearAll()
|
|
|
- swneLatLng=''
|
|
|
+ swneLatLng = ''
|
|
|
}
|
|
|
});
|
|
|
|
|
|
-
|
|
|
|
|
|
-
|
|
|
-
|
|
|
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
|
|
|
windowAddMouseWheel();
|
|
|
function windowAddMouseWheel() {
|
