增加动态表单自动排版配置界面的保存回显逻辑
This commit is contained in:
cuibaocheng
parent
481944dfaf
commit
29d63fb701
202
src/main/resources/static/assets/js/baidumap-select.js
Normal file
202
src/main/resources/static/assets/js/baidumap-select.js
Normal file
@ -0,0 +1,202 @@
|
|||||||
|
//#region 百度地图相关代码
|
||||||
|
/*************************百度地图 **************************/
|
||||||
|
function loadDefulatMap(initData) {
|
||||||
|
var point = new BMap.Point(initData && initData.lng ? initData.lng : 116.404 , initData && initData.lat ? initData.lat : 39.915); // 创建点坐标
|
||||||
|
map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别
|
||||||
|
map.addControl(new BMap.NavigationControl());
|
||||||
|
map.addControl(new BMap.ScaleControl());
|
||||||
|
map.addControl(new BMap.OverviewMapControl());
|
||||||
|
createMarker(point, true);
|
||||||
|
//map.addControl(new BMap.MapTypeControl()); //不同类型的百度地图
|
||||||
|
//map.setCurrentCity("北京"); // 仅当设置城市信息时，MapTypeControl的切换功能才能可用
|
||||||
|
}
|
||||||
|
|
||||||
|
function Autocomplete() {
|
||||||
|
//建立一个自动完成的对象
|
||||||
|
var ac = new BMap.Autocomplete(
|
||||||
|
{
|
||||||
|
"input": "baiduAddress",
|
||||||
|
"location": map
|
||||||
|
});
|
||||||
|
ac.addEventListener("onhighlight", function (e) { //鼠标放在下拉列表上的事件
|
||||||
|
var str = "";
|
||||||
|
var _value = e.fromitem.value;
|
||||||
|
var value = "";
|
||||||
|
if (e.fromitem.index > -1) {
|
||||||
|
value = _value.province + _value.city + _value.district + _value.street + _value.business;
|
||||||
|
}
|
||||||
|
str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
|
||||||
|
|
||||||
|
value = "";
|
||||||
|
if (e.toitem.index > -1) {
|
||||||
|
_value = e.toitem.value;
|
||||||
|
value = _value.province + _value.city + _value.district + _value.street + _value.business;
|
||||||
|
}
|
||||||
|
str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
|
||||||
|
$(".area_tip").innerHTML = str;
|
||||||
|
});
|
||||||
|
ac.addEventListener("onconfirm", function (e) {//鼠标点击下拉列表后的事件
|
||||||
|
var _value = e.item.value;
|
||||||
|
var myValue = _value.street + _value.business;
|
||||||
|
$(".area_tip").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
|
||||||
|
setPlace(myValue);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
//地图选点点击事件
|
||||||
|
function clickCoordinate(e) {
|
||||||
|
var point = e.point;
|
||||||
|
//请先选择省市区
|
||||||
|
//var area = $(".store_Area").val();
|
||||||
|
//if (area == null || area == "") {
|
||||||
|
// alert(baiduParam.SelectRegion_Error);
|
||||||
|
// return;
|
||||||
|
//}
|
||||||
|
createMarker(point);
|
||||||
|
}
|
||||||
|
function setPlace(value) {
|
||||||
|
function myFun() {
|
||||||
|
if (local.getResults().getPoi(0)) {
|
||||||
|
var point = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
|
||||||
|
createMarker(point);
|
||||||
|
} else {
|
||||||
|
alert("未搜索到结果，请重新输入");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var local = new BMap.LocalSearch(map, { //智能搜索
|
||||||
|
onSearchComplete: myFun
|
||||||
|
});
|
||||||
|
local.search(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
var baiduParam = {
|
||||||
|
oldPoint: null//记录旧值,用于地图拖拽失败后回到原来位置
|
||||||
|
, Exceed_Error: "定位地址失败，您搜索或定位超出县级范围，请重新选择定位"
|
||||||
|
, SelectRegion_Error: "定位地址失败，您搜索或定位超出县级范围，请先选择省市区"
|
||||||
|
, Location_Div: "<div id='descConten'>已将坐标定位为<hr/>{address}<br/><small style='color: #858585;line-height: 24px;'>地址：{title}</small><br/><br/><input type='button' value='确定' id='saveLngLat' style=' background: rgb(135,205,208);border: none;color: white;height: 30px;width: 60px;border-radius: 4px;' ></div> "
|
||||||
|
, Location_Sure_Div: "<img style='width:20px;top: 5px;position: relative;' src='data:image/png;base64,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' />已将坐标定位为<hr/>{address}<br/><small style='color: #858585;line-height: 24px;'>地址：{title}</small><br/><br/>"
|
||||||
|
}
|
||||||
|
|
||||||
|
function createMarker(point, isLoad) {
|
||||||
|
//反向解析地址
|
||||||
|
myGeo.getLocation(point, function (rs) {
|
||||||
|
|
||||||
|
//验证区域是否在区域内
|
||||||
|
//if (rs.addressComponents.province != $(".store_Province").find("option:selected").text() ||
|
||||||
|
// rs.addressComponents.city != $(".store_City").find("option:selected").text() ||
|
||||||
|
// rs.addressComponents.district != $(".store_Area").find("option:selected").text()) {
|
||||||
|
// alert(baiduParam.Exceed_Error);
|
||||||
|
// if (baiduParam.oldPoint) {
|
||||||
|
// createMarker(baiduParam.oldPoint);
|
||||||
|
// }
|
||||||
|
// return;
|
||||||
|
//}
|
||||||
|
map.clearOverlays();//清除之前所有的标志
|
||||||
|
|
||||||
|
//红点开始
|
||||||
|
var marker = new BMap.Marker(point);// 创建标注
|
||||||
|
map.addOverlay(marker); // 将标注添加到地图中
|
||||||
|
marker.enableDragging();//可拖拽 自定义拖拽
|
||||||
|
//拖拽前事件
|
||||||
|
marker.addEventListener("dragstart", function (e) {
|
||||||
|
baiduParam.oldPoint = e.point;
|
||||||
|
})
|
||||||
|
//拖拽完成事件
|
||||||
|
marker.addEventListener("dragend", function (e) {
|
||||||
|
createMarker(e.point);
|
||||||
|
})
|
||||||
|
//红点完成
|
||||||
|
|
||||||
|
baiduParam.oldPoint = null;
|
||||||
|
/******** 图层初始化 ********/
|
||||||
|
/**图层样式文字处理开始**/
|
||||||
|
var html = baiduParam.Location_Div;
|
||||||
|
if (isLoad == true) {
|
||||||
|
map.centerAndZoom(point, map.getZoom()); //重置地图位置
|
||||||
|
html = baiduParam.Location_Sure_Div;
|
||||||
|
}
|
||||||
|
//如果缩放等级小于当前的 ，则为18
|
||||||
|
if (map.getZoom() < 18) {
|
||||||
|
map.setZoom(18);
|
||||||
|
}
|
||||||
|
//解析地址
|
||||||
|
var rsaddress = rs.address;
|
||||||
|
var rstitle = rs.surroundingPois[0] != null ? rs.surroundingPois[0].title : "";
|
||||||
|
html = html.replace("{address}", rsaddress).replace("{title}", rstitle);
|
||||||
|
/**图层样式文字处理结束**/
|
||||||
|
|
||||||
|
var infoWindow = new BMap.InfoWindow(html, { offset: { width: 0, height: -25 } });
|
||||||
|
// 创建信息窗口对象
|
||||||
|
map.openInfoWindow(infoWindow, point); //开启信息窗口
|
||||||
|
//确定事件绑定
|
||||||
|
infoWindow.addEventListener("open", function (a) {
|
||||||
|
$("#saveLngLat").unbind("click");
|
||||||
|
$("#saveLngLat").click(function () {
|
||||||
|
infoWindow.setContent("<img style='width:20px;top: -2px;position: relative;' src='data:image/png;base64,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' />已将坐标定位为<hr/>" + rs.address + "<br/><small style='color: #858585;line-height: 24px;'>地址：" + (rs.surroundingPois[0] != null ? rs.surroundingPois[0].title : "") + "</small><br/><br/>");
|
||||||
|
$(".store_Address").val(rs.address + " " + (rs.surroundingPois[0] != null ? rs.surroundingPois[0].title : "") );
|
||||||
|
$(".store_Lng").val(rs.point.lng);
|
||||||
|
$(".store_Lat").val(rs.point.lat);
|
||||||
|
})
|
||||||
|
})
|
||||||
|
infoWindow.redraw(function () {
|
||||||
|
$("#saveLngLat").unbind("click");
|
||||||
|
$("#saveLngLat").click(function () {
|
||||||
|
infoWindow.setContent("<img style='width:20px;top: -2px;position: relative;' src='data:image/png;base64,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' />已将坐标定位为<hr/>" + rs.address + "<br/><small style='color: #858585;line-height: 24px;'>地址：" + (rs.surroundingPois[0] != null ? rs.surroundingPois[0].title : "") + "</small><br/><br/>");
|
||||||
|
$(".store_Address").val(rs.address + " " + (rs.surroundingPois[0] != null ? rs.surroundingPois[0].title : "") );
|
||||||
|
$(".store_Lng").val(rs.point.lng);
|
||||||
|
$(".store_Lat").val(rs.point.lat);
|
||||||
|
})
|
||||||
|
});
|
||||||
|
/******** 图层初始化 ********/
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//#region /****查询控件类****/
|
||||||
|
function BigZoomControl() {
|
||||||
|
// 设置默认停靠位置和偏移量
|
||||||
|
this.defaultAnchor = BMAP_ANCHOR_TOP_RIGHT;
|
||||||
|
this.defaultOffset = new BMap.Size(150, 20);
|
||||||
|
}
|
||||||
|
// 通过JavaScript的prototype属性继承于BMap.Control
|
||||||
|
BigZoomControl.prototype = new BMap.Control();
|
||||||
|
// 自定义控件必须实现自己的initialize方法,并且将控件的DOM元素返回
|
||||||
|
// 在本方法中创建个div元素作为控件的容器,并将其添加到地图容器中
|
||||||
|
BigZoomControl.prototype.initialize = function (map) {
|
||||||
|
// 创建一个DOM元素
|
||||||
|
var div = document.createElement("div");
|
||||||
|
// 设置样式
|
||||||
|
div.style.cursor = "pointer";
|
||||||
|
div.style.margin = "0 auto";
|
||||||
|
div.style.backgroundColor = "white";
|
||||||
|
div.innerHTML = "<div><input type='text' id = 'baiduAddress' name = 'baiduAddress' style='width: 350px;height: 33px;text-indent:1em;float:left;border: 1px solid #D2D2D2!important;border-right:none;' placeholder='输入门店详细地址, 越详细定位越精准' /><div class='searchMap' style='border:1px solid #f50;background-color:#f50;width:60px;height:33px;float:left;'></div><img class='searchMap' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAMAAACahl6sAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABgUExURQAAAP///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////3wlHLoAAAAfdFJOUwBQCfMW4yDsKhB1uNnL+P2vgDKL0kVjn8IEWadqPJWpmM3FAAAHgklEQVR42t1d2ZacOAw1mM2YnWKpgsL//5eZ5JxJejKNbQlvhd4b+haylitZIsSkFFE5HhtfHykVNH2s3TL2+xy9Y/IpkkzlwVNxKvUxD+GDiI6H0BC6jlEWLIiXHojfkm9ReCjYvAqE5Mc7JBTPqGsEVtKxCATGcOTimjzKAM7LxIUJ2Tx/lqgWhqT1COU5V8KgtJsnBZuMwvgFZfEAJeuEBXEOJe6FLXEKJUqFPclfzrRqFXalY05w7I2wLamDwIVx4ULGp+14JBVupLLrH8tWuJKmtJhxcOFSVluGOEuFW8ntqNeQC9dCbVivqRHupZmM43i1woe0pt18KXzJbBTHgfDOfJzfQ5ElPxk5lg1TNJfjSuEPKv3hoLw8JRSzaORAqzH60SteqnnEoQcxYIchHLP+0Vxn3cA1KwHpfm8m+dB9Xb0nMJp70UZigpJ8a/oPjjD5Sa95XJrrPr7QsjNthyTY412Pwkiv5lpMK75ar9QJ9Lix9SIQHa4kvep9Zx0FW66ltRrq21+vQSU6v9d+JeBVH3RD9KAGL9PiQ+FY+XRqrFTD1NFDjv7NNmVibTKHm5T2sbbl0TuzFdoitRMJZ24Ch69nXmWIaYJ57Oo45flZqNgs2ODIeRKqE2i/TVssaqvmH8mPfAVmIOV1A2qPB5zM5otZ4+V7/KI55CqdGTzprV2yXK4M3OBJt915sZh7e2UretMTKcecmvogi3UcJJZyEwAHJntO5aJzTGprHkYsYOOmQWE34hVXrwdE/T90uumUgWdYVa5W05dI8s6cuQIiVS49ErUIQLEUykW1fs/RhL0woVz0YsSVmwyir8h4zSlKbO/mFAdh9JJTXC4bCxfRo9p6xk0oH0T6SagyvpBkA+6bDiWfRJlpc0OJgJlPkqNdSdIGYrJUn6RCk3K1BxwkOdetDGuzdh9AJJqu+H9OSaCGeQHyQhrgzH/Yq+sN6BN3RHxd9dhwBnjB4bcoEc4Ap8F49d+8do4JxTNHPToQOa9kxRgb4e+myrluDQhHmnvDgdOSzSMpB0/0JKe9NkDuuXPuEtdGw4ngNfS9godo7dMjkAhutt7YmNnTaS/AAQr3CeT8tL/A/MvoFcgKZreWsHIRpdnqwaSv31vOG1hReEjpuka0tYCV0e9EgB7sER8h+kNJW8epMT2t5SZegcxgYidHRP4+Xfupnz5N9L3iOK8PnBYXxId9EQr+In7PyAsMJA8v0f0pOzhvTT/Mj6RgP+LXs49gq7WiqypWZQH7ER4eqyWNZTn4LwLNRw5wvNx5BZKCE6sxyJw9gVcI5g9jUQZwUBMmryUYnHgJkmlszv+m+SjuV1IgeZhoUXXGz3UI1xNkfWRERDVBVqx2RMAcYg1Rxrad95fmvjyJpA9Olu7RD6qzP1A2O7zOB3kke37FqfFDQLyQrWeDCMxuddhfllq7h40Shr7Zw0Np+lWpuqqHuTR1ucnMUafoVlHZvdagukyVvRi1CMe7y1qxlfH4fv3ahosPos6QEvERvfFC3WLJRSiGa7x29U52w9QpmyK7P6LDRrPG4JVfK7ycbjf1ZvyKv2lfqEmGTOau/F6QQjqPQ+8ZDxGActUGpk1IL5S3boo+0qvgra6CS6ckVC6a5AvpDELtJE8+EMVBrqiYIaXtzp658HpMYvl8lMqQ6bPOBD8Vs18BPAiTz/Ro7dYUFVNeQKmq4pM0Nk3XKH93C0uLFJPhcntJlmo2GXBoo2LMishtfRPVjGfwRXTVMDVLs4OU48LAfaKZamqbjWlOsXJWNSKRUC8dMN5Em6knnCJSO/UAOrEYnnimnnKISrY1ZpgaHe6unkEnGlw6tKmRmFMvpjNTGNlKojX+09BCB739GVj3NegMlk0NWK9EdysLFsmu9fT6qnPc9SdlY5Fo/lLLFU4CtnkJiYRpbiFoDiyd+oIukEIiGXTn97cdwlehFkghkbz031DvMAsWl7itE0gkO+AVLX/pOnv22qhAChLJCHpJw8u3srkg2fmllRNIJAv0PfJJ/n13fY8JEglqidi3uxW4qR0mOCSxsR175gSHhK13QRLzuyB5LndBArTCISPZb4PE074hC0je6V2QMH4XJC631llGMqR3QcI6B/9cXztAQl62t9c9Clh4h0bCDpsnhZbgQBVfrinsxcP/rnNkbpDo7dWBS/Wn0ukKCbMQRub71yzZFRJSLGaPCv17bZEzJCQ7zK2tzPv/k0nukOgvOVOdjf1btsIhEsLK63va19NmBpdI/glbxitxSzrK3u8WCSETkjfMDxVl7BoJeU59DbRi1Thp3HhikG2WqZmmSxYdugem4btuJQKEpDZ2GSyZN7khy+uljArI+0BIjG7XYsM09wuvqz+QmvTBl36fCkzxFILEWkdvkg3v4ur1AAiSg4QsACRNfBckEbkJkrB1C4CkJjdBUpHgkeh5Wxo8EJJUNwGih6QiN0GykpsgOchNkEzkHkiaJ7kHkoOQWyBpEnIPJCMht0DyiMktkKQJ+TD5fk91WpCPk/ibRvGVkU+Uv7u3/1uU+Cj5yqDTg5EPlmmpUyrSx/Y1Uf8BsOGVXPl6gTYAAAAASUVORK5CYII=' style='height: 22px;position: absolute;right: 18px;top: 7px;'/><div style='clear:both'></div></div>";
|
||||||
|
// 添加DOM元素到地图中
|
||||||
|
map.getContainer().appendChild(div);
|
||||||
|
// 将DOM元素返回
|
||||||
|
return div;
|
||||||
|
}
|
||||||
|
//#endregion
|
||||||
|
//#endregion
|
||||||
|
|
||||||
|
//#region 百度地图初始化
|
||||||
|
/****************百度地图初始化开始****************/
|
||||||
|
//去除默认点击
|
||||||
|
var map = new BMap.Map("myMap", { enableMapClick: false });
|
||||||
|
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
|
||||||
|
// 创建地址解析器实例
|
||||||
|
var myGeo = new BMap.Geocoder();
|
||||||
|
loadDefulatMap({});//初始化地图以及加载初始化数据
|
||||||
|
// 创建控件
|
||||||
|
var myZoomCtrl = new BigZoomControl();
|
||||||
|
//// 查询控件类到地图当中
|
||||||
|
map.addControl(myZoomCtrl);
|
||||||
|
//查询控件的点击事件
|
||||||
|
$(".searchMap").click(function () {
|
||||||
|
setPlace($("#baiduAddress").val());
|
||||||
|
});
|
||||||
|
Autocomplete();//构建自动
|
||||||
|
bindEvent();
|
||||||
|
function bindEvent() {
|
||||||
|
//查询百度地图
|
||||||
|
map.addEventListener("click", clickCoordinate); //地图点击事件
|
||||||
|
}
|
||||||
|
/****************百度地图初始化完成****************/
|
||||||
|
//#endregion
|
||||||
|
|
||||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,27 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html xmlns:th="http://www.thymeleaf.org">
|
||||||
|
<head>
|
||||||
|
<base th:href="${#request.getContextPath() + '/'}">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
||||||
|
<link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
|
||||||
|
<link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
|
||||||
|
<link rel="stylesheet" type="text/css" href="assets/js/vendor/viewer/viewer.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="layui-fluid layui-anim layui-anim-fadein">
|
||||||
|
<div class="layui-row" id="viewer">
|
||||||
|
<div class="layui-col-md12" >
|
||||||
|
<div class="layui-card" style="text-align: center;margin-top: 300px;">
|
||||||
|
<h1 th:text="${content}"></h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script src="assets/layuiadmin/layui/layui.js"></script>
|
||||||
|
<script src="assets/js/vendor/viewer/viewer.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -0,0 +1,26 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html xmlns:th="http://www.thymeleaf.org">
|
||||||
|
<head>
|
||||||
|
<base th:href="${#request.getContextPath() + '/'}">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
||||||
|
<link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
|
||||||
|
<link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
|
||||||
|
<link rel="stylesheet" type="text/css" href="assets/js/vendor/viewer/viewer.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="layui-fluid layui-anim layui-anim-fadein">
|
||||||
|
<div class="layui-row">
|
||||||
|
<div class="layui-col-md12" th:each="file,fileStat : ${fileList}">
|
||||||
|
<div class="layui-card">
|
||||||
|
<img th:src="${'route/file/download/false/'+ file}" style="width:100%">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script src="assets/layuiadmin/layui/layui.js"></script>
|
||||||
|
<script src="assets/js/vendor/viewer/viewer.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue
Block a user