Compare commits
12 Commits
| Author | SHA1 | Date |
|---|---|---|
 徐景良
|
672a7e95e6 | |
|
徐景良
|
f01a465789 | |
|
徐景良
|
2198bf507c | |
|
徐景良
|
985562506e | |
|
徐景良
|
83054c6541 | |
|
徐景良
|
2ceb4e95fe | |
|
徐景良
|
ee194ffaa5 | |
|
徐景良
|
becd519f65 | |
humiao
|
82ce2852fe | |
|
humiao
|
937006e3e7 | |
|
humiao
|
94b0869951 | |
 刘妍
|
0bb2552e1c |
|
|
@ -1268,7 +1268,7 @@
|
|||
},
|
||||
"minimist": {
|
||||
"version": "1.2.8",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/minimist/-/minimist-1.2.8.tgz",
|
||||
"integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA=="
|
||||
}
|
||||
}
|
||||
|
|
@ -1304,12 +1304,12 @@
|
|||
},
|
||||
"@mapbox/tiny-sdf": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/tiny-sdf/-/tiny-sdf-2.0.6.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/@mapbox/tiny-sdf/-/tiny-sdf-2.0.6.tgz",
|
||||
"integrity": "sha512-qMqa27TLw+ZQz5Jk+RcwZGH7BQf5G/TrutJhspsca/3SHwmgKQ1iq+d3Jxz5oysPVYTGP6aXxCo5Lk9Er6YBAA=="
|
||||
},
|
||||
"@mapbox/unitbezier": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/unitbezier/-/unitbezier-0.0.1.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/@mapbox/unitbezier/-/unitbezier-0.0.1.tgz",
|
||||
"integrity": "sha512-nMkuDXFv60aBr9soUG5q+GvZYL+2KZHVvsqFCzqnkGEf46U2fvmytHaEVc1/YZbiLn8X+eR3QzX1+dwDO1lxlw=="
|
||||
},
|
||||
"@mapbox/vector-tile": {
|
||||
|
|
@ -3320,80 +3320,6 @@
|
|||
"webpack-chain": "^6.4.0",
|
||||
"webpack-dev-server": "^3.11.0",
|
||||
"webpack-merge": "^4.2.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^4.1.0",
|
||||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-name": "~1.1.4"
|
||||
}
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"loader-utils": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.4.tgz",
|
||||
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"big.js": "^5.2.2",
|
||||
"emojis-list": "^3.0.0",
|
||||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"vue-loader-v16": {
|
||||
"version": "npm:vue-loader@16.8.3",
|
||||
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"chalk": "^4.1.0",
|
||||
"hash-sum": "^2.0.0",
|
||||
"loader-utils": "^2.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"@vue/cli-shared-utils": {
|
||||
|
|
@ -9250,9 +9176,9 @@
|
|||
}
|
||||
},
|
||||
"kdbush": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/kdbush/-/kdbush-3.0.0.tgz",
|
||||
"integrity": "sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew=="
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmmirror.com/kdbush/-/kdbush-4.0.2.tgz",
|
||||
"integrity": "sha512-WbCVYJ27Sz8zi9Q7Q0xHC+05iwkm3Znipc2XTlrnJbsHMYktW4hPhXUE8Ys1engBrvffoSCqbil1JQAa7clRpA=="
|
||||
},
|
||||
"killable": {
|
||||
"version": "1.0.1",
|
||||
|
|
@ -9608,9 +9534,9 @@
|
|||
}
|
||||
},
|
||||
"mapbox-gl": {
|
||||
"version": "2.13.0",
|
||||
"resolved": "https://registry.npmjs.org/mapbox-gl/-/mapbox-gl-2.13.0.tgz",
|
||||
"integrity": "sha512-G8pU1/I9HC7xNbhKPKFtRkdUDkWJBNbYPMeRjBig3lPaYtvHPIaFmXMR6BDyZ/gnwodElrwMZGdGsoH8kecX8w==",
|
||||
"version": "2.15.0",
|
||||
"resolved": "https://registry.npmmirror.com/mapbox-gl/-/mapbox-gl-2.15.0.tgz",
|
||||
"integrity": "sha512-fjv+aYrd5TIHiL7wRa+W7KjtUqKWziJMZUkK5hm8TvJ3OLeNPx4NmW/DgfYhd/jHej8wWL+QJBDbdMMAKvNC0A==",
|
||||
"requires": {
|
||||
"@mapbox/geojson-rewind": "^0.5.2",
|
||||
"@mapbox/jsonlint-lines-primitives": "^2.0.2",
|
||||
|
|
@ -9625,21 +9551,23 @@
|
|||
"geojson-vt": "^3.2.1",
|
||||
"gl-matrix": "^3.4.3",
|
||||
"grid-index": "^1.1.0",
|
||||
"kdbush": "^4.0.1",
|
||||
"murmurhash-js": "^1.0.0",
|
||||
"pbf": "^3.2.1",
|
||||
"potpack": "^2.0.0",
|
||||
"quickselect": "^2.0.0",
|
||||
"rw": "^1.3.3",
|
||||
"supercluster": "^7.1.5",
|
||||
"supercluster": "^8.0.0",
|
||||
"tinyqueue": "^2.0.3",
|
||||
"vt-pbf": "^3.1.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"earcut": {
|
||||
"version": "2.2.4",
|
||||
"resolved": "https://registry.npmjs.org/earcut/-/earcut-2.2.4.tgz",
|
||||
"integrity": "sha512-/pjZsA1b4RPHbeWZQn66SWS8nZZWLQQ23oE3Eam7aroEFGEvwKAsJfZ9ytiEMycfzXWpca4FA9QIOehf7PocBQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"mapbox-gl-draw-snap-mode": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/mapbox-gl-draw-snap-mode/-/mapbox-gl-draw-snap-mode-0.2.0.tgz",
|
||||
"integrity": "sha512-c6u8wL1cHgzFAAi6wtuoJVBKAF4qzGorpCn4IeninkzkUaYGVrNtUNPky3ECx9C3P9QbNOwD60j8bYj5wQI8hA==",
|
||||
"requires": {
|
||||
"@turf/turf": "^6.5.0"
|
||||
}
|
||||
},
|
||||
"mapbox-gl-utils": {
|
||||
|
|
@ -11477,7 +11405,7 @@
|
|||
},
|
||||
"potpack": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/potpack/-/potpack-2.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/potpack/-/potpack-2.0.0.tgz",
|
||||
"integrity": "sha512-Q+/tYsFU9r7xoOJ+y/ZTtdVQwTWfzjbiXBDMM/JKUux3+QPP02iUuIoeBQ+Ot6oEDlC+/PGjB/5A3K7KKb7hcw=="
|
||||
},
|
||||
"prelude-ls": {
|
||||
|
|
@ -13139,11 +13067,11 @@
|
|||
}
|
||||
},
|
||||
"supercluster": {
|
||||
"version": "7.1.5",
|
||||
"resolved": "https://registry.npmmirror.com/supercluster/-/supercluster-7.1.5.tgz",
|
||||
"integrity": "sha512-EulshI3pGUM66o6ZdH3ReiFcvHpM3vAigyK+vcxdjpJyEbIIrtbmBdY23mGgnI24uXiGFvrGq9Gkum/8U7vJWg==",
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/supercluster/-/supercluster-8.0.1.tgz",
|
||||
"integrity": "sha512-IiOea5kJ9iqzD2t7QJq/cREyLHTtSmUT6gQsweojg9WH2sYJqZK9SswTu6jrscO6D1G5v5vYZ9ru/eq85lXeZQ==",
|
||||
"requires": {
|
||||
"kdbush": "^3.0.0"
|
||||
"kdbush": "^4.0.2"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
|
|
@ -14041,6 +13969,80 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"vue-loader-v16": {
|
||||
"version": "npm:vue-loader@16.8.3",
|
||||
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"chalk": "^4.1.0",
|
||||
"hash-sum": "^2.0.0",
|
||||
"loader-utils": "^2.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^4.1.0",
|
||||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-name": "~1.1.4"
|
||||
}
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"loader-utils": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.4.tgz",
|
||||
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"big.js": "^5.2.2",
|
||||
"emojis-list": "^3.0.0",
|
||||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"vue-router": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
|
||||
|
|
|
|||
|
|
@ -19,7 +19,8 @@
|
|||
"element-ui": "^2.15.8",
|
||||
"jquery": "^3.6.4",
|
||||
"less-loader": "^6.0.0",
|
||||
"mapbox-gl": "^2.13.0",
|
||||
"mapbox-gl": "^2.0.0",
|
||||
"mapbox-gl-draw-snap-mode": "^0.2.0",
|
||||
"mapbox-gl-utils": "^0.39.0",
|
||||
"qs": "^6.11.1",
|
||||
"terraformer-wkt-parser": "^1.2.1",
|
||||
|
|
|
|||
|
|
@ -35,4 +35,11 @@ export const loginout = () => {
|
|||
url: '/api/Check/Logout',
|
||||
method: 'post',
|
||||
})
|
||||
}
|
||||
|
||||
export const checkAuth = () => {
|
||||
return request({
|
||||
url: '/api/Check/GetRoles',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
|
@ -1,8 +1,10 @@
|
|||
export const globalApi = {
|
||||
// 本地测试
|
||||
// BASE_URL: "http://192.168.10.116:8909", //测试 卢国栋
|
||||
// GEOSERVER_URL: "http://192.168.10.116:8909",
|
||||
// netBASE_URL: "https://py.hopetrytech.com:7001", //测试.net
|
||||
|
||||
BASE_URL: "http://192.168.10.121:8909", //测试 卢国栋
|
||||
GEOSERVER_URL: "http://192.168.10.121:8180",
|
||||
netBASE_URL: "http://123.132.248.154:9231", //测试.net
|
||||
|
||||
|
||||
// 测试服务器
|
||||
// BASE_URL: "http://123.132.248.154:9217", //测试 服务器
|
||||
|
|
@ -11,9 +13,11 @@ export const globalApi = {
|
|||
|
||||
|
||||
// 1240 测试服务器
|
||||
BASE_URL: "http://123.132.248.154:9236", //测试 服务器
|
||||
GEOSERVER_URL:"http://123.132.248.154:9235",
|
||||
netBASE_URL: "http://123.132.248.154:9231", //测试.net
|
||||
// BASE_URL: "http://111.17.207.220:9006", //测试 服务器
|
||||
// GEOSERVER_URL:"http://111.17.207.220:9007",
|
||||
// netBASE_URL: "http://111.17.207.220:9001", //测试.net
|
||||
// BASE_URL:"",
|
||||
// netBASE_URL:"http://123.132.248.154:9242"
|
||||
|
||||
|
||||
//正式环境
|
||||
|
|
@ -25,4 +29,8 @@ export const globalApi = {
|
|||
// GEOSERVER_URL:"https://fx.hopetrytech.com:7005", // geoserver
|
||||
// netBASE_URL: "https://py.hopetrytech.com:7001", //.net
|
||||
|
||||
// BASE_URL: "https://fx.hopetrytech.com:7006/", // java
|
||||
// GEOSERVER_URL:"https://fx.hopetrytech.com:7005", // geoserver
|
||||
// netBASE_URL: "https://py.hopetrytech.com:7001", //.net
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -87,6 +87,13 @@ export const constantRoutes = [
|
|||
component: () => import('@/views/burst_upload/BurstUpload'),
|
||||
meta: { name: "分片上传", iconfont: "/images/img9.png" },
|
||||
},
|
||||
// {
|
||||
// path: "/RouteDraw",
|
||||
// name: "RouteDraw",
|
||||
// show: true,//在导航栏是否显示
|
||||
// component: () => import('@/views/route_draw/index'),
|
||||
// meta: { name: "道路绘制", iconfont: "/images/img9.png" },
|
||||
// },
|
||||
{
|
||||
path: "/ServiceList",
|
||||
name: "Datadetails",
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
import mapboxgl from "mapbox-gl";
|
||||
import { globalApi } from "../../../api/urlPatterns.js";
|
||||
import { getLayer, getGeomData } from "../../../api/Datadetails";
|
||||
import { waiData } from "../../data_draw/lib/xianjiewai";
|
||||
mapboxgl.accessToken =
|
||||
"pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ";
|
||||
export default {
|
||||
|
|
@ -63,9 +64,70 @@ export default {
|
|||
projection: "globe",
|
||||
});
|
||||
this.map.on("load", () => {
|
||||
// 开启地形
|
||||
_this.map.addSource('mapbox-dem', {
|
||||
'type': 'raster-dem',
|
||||
'url': 'mapbox://mapbox.mapbox-terrain-dem-v1',
|
||||
'tileSize': 512,
|
||||
'maxzoom': 14
|
||||
});
|
||||
// add the DEM source as a terrain layer with exaggerated height
|
||||
_this.map.setTerrain({ 'source': 'mapbox-dem', 'exaggeration': 1.5 });
|
||||
_this.loadGaoQingLayer()
|
||||
_this.loadMengban();
|
||||
_this.addGeoJsonLayer(url, jwd);
|
||||
});
|
||||
},
|
||||
loadMengban() {
|
||||
this.map.addLayer({
|
||||
//蒙版图层 //通过边界数据反选 达到挖洞效果
|
||||
id: 'mb-tag',
|
||||
type: 'fill',
|
||||
source: {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'Feature',
|
||||
geometry: {
|
||||
type: 'Polygon',
|
||||
coordinates: [
|
||||
[
|
||||
// 多边形外围 需要进行遮罩的点 这里是给世界地图加遮罩 所以是世界的四个端点
|
||||
[-180, 90],
|
||||
[180, 90],
|
||||
[180, -90],
|
||||
[-180, -90],
|
||||
],
|
||||
waiData.DATA,
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
paint: {
|
||||
'fill-color': '#1a274b',
|
||||
'fill-opacity': 1 /* 透明度 */,
|
||||
},
|
||||
layout: {
|
||||
visibility: 'visible',
|
||||
},
|
||||
});
|
||||
},
|
||||
loadGaoQingLayer() {
|
||||
this.map.addLayer({
|
||||
'id': 'gaoqingyingxiang',
|
||||
'type': 'raster',
|
||||
'source': {
|
||||
'type': 'raster',
|
||||
'tiles': ["https://fx.hopetrytech.com:7005/geoserver/PY/wms?service=WMS&version=1.1.0&request=GetMap&layers=PY:yingxiang&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE"],
|
||||
'tileSize': 256
|
||||
},
|
||||
'layout': {
|
||||
'visibility': 'visible'
|
||||
},
|
||||
'paint': {
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
// 'http://localhost:8080/geoserver/wms?service=WMS&version=1.1.0&request=GetMap&layers=topp:states&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png'
|
||||
// http://123.132.248.154:9205/geoserver/gwc/service/tms/1.0.0/ksp:shp_1681969689@EPSG:4326@png
|
||||
addGeoJsonLayer(url, jwd) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
interface Point { x: number; y: number;}
|
||||
const getLineSegIntersection = ( p1: Point, p2: Point, p3: Point, p4: Point): Point | null => { const { x: x1, y: y1 } = p1; const { x: x2, y: y2 } = p2; const { x: x3, y: y3 } = p3; const { x: x4, y: y4 } = p4; const a = y2 - y1; const b = x1 - x2; const c = x1 * y2 - x2 * y1; const d = y4 - y3; const e = x3 - x4; const f = x3 * y4 - x4 * y3; // 计算分母 const denominator = a * e - b * d; // 判断分母是否为 0（代表平行） if (Math.abs(denominator) < 0.000000001) { // 这里有个特殊的重叠但只有一个交点的情况，可以考虑处理一下 return null; } const px = (c * e - f * b) / denominator; const py = (a * f - c * d) / denominator; // 判断交点是否在两个线段上 if ( px >= Math.min(x1, x2) && px <= Math.max(x1, x2) && py >= Math.min(y1, y2) && py <= Math.max(y1, y2) && px >= Math.min(x3, x4) && px <= Math.max(x3, x4) && py >= Math.min(y3, y4) && py <= Math.max(y3, y4) ) { return { x: px, y: py }; } return null;};
|
||||
|
|
@ -35,19 +35,23 @@
|
|||
<div class="form-box">
|
||||
<el-form ref="forms" :model="form" :rules="rules" label-width="120px" size="small">
|
||||
<el-form-item label="服务名称" prop="serverName">
|
||||
|
||||
<el-input placeholder="请输入服务名称" style="width: 360px" v-model="form.serverName"
|
||||
@change="servernameChange"></el-input>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="空间参考" label-width="" prop="spaceType">
|
||||
<el-select style="width: 360px;" v-model="form.spaceType" placeholder="请选择空间参考">
|
||||
<el-option v-for="(item, index) in getDictone" :key="index" :label="item.dictlabel"
|
||||
:value="item.dictlabel"></el-option>
|
||||
</el-select>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="表名" prop="tableName">
|
||||
<el-input placeholder="请输入表名" style="width: 360px" v-model="form.tableName"
|
||||
@change="tableNameChange">
|
||||
</el-input>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-top:165px;text-align:right;">
|
||||
<el-button type="default" @click="$router.push({'path':'/upload_type_selected'})">取消</el-button>
|
||||
|
|
@ -150,6 +154,7 @@
|
|||
callback();
|
||||
};
|
||||
return {
|
||||
|
||||
headers: {
|
||||
Authorization: localStorage.getItem("X-Token") || "",
|
||||
},
|
||||
|
|
@ -236,7 +241,6 @@
|
|||
}
|
||||
})
|
||||
},
|
||||
|
||||
beforeUpload(file) {
|
||||
console.log(file);
|
||||
this.file = file;
|
||||
|
|
|
|||
|
|
@ -148,6 +148,10 @@
|
|||
:style="{'background':layerShow['xianjie'] == 'visible'?'#108eff':'none','color':layerShow['xianjie'] == 'visible'?'#fff':'#108eff'}">
|
||||
<i class="el-icon el-icon-circle-check"></i> 县界界线
|
||||
</div>
|
||||
<!-- <div class="layer-button" @click="loadNearbyData"
|
||||
>
|
||||
<i class="el-icon el-icon-map-location"></i> 周边数据
|
||||
</div> -->
|
||||
</div>
|
||||
<div></div>
|
||||
<div class="map-container-outer"
|
||||
|
|
@ -221,13 +225,22 @@
|
|||
|
||||
<script>
|
||||
import axios from 'axios';
|
||||
import { postMethodCommon } from "../../api/Api"
|
||||
import { postMethodCommon,getMethodCommon } from "../../api/Api"
|
||||
import Editor from './widget/Editor.vue';
|
||||
import { getCenter } from './lib/getCenter'
|
||||
import { waiData } from "./lib/xianjiewai";
|
||||
import { globalApi } from '../../api/urlPatterns.js'
|
||||
// 图形绘制工具类
|
||||
import MapboxDraw from "@mapbox/mapbox-gl-draw"
|
||||
|
||||
import {
|
||||
SnapPolygonMode,
|
||||
SnapPointMode,
|
||||
SnapLineMode,
|
||||
SnapModeDrawStyles,
|
||||
SnapDirectSelect,
|
||||
} from "mapbox-gl-draw-snap-mode";
|
||||
|
||||
|
||||
// WKT和GeoJson数据转换工具类
|
||||
import WKT from 'terraformer-wkt-parser'
|
||||
|
|
@ -310,7 +323,12 @@
|
|||
clickMapData: {},
|
||||
drawTool: null,
|
||||
drowLat: '',
|
||||
drowLng: ''
|
||||
drowLng: '',
|
||||
nearbyGeoJson:{
|
||||
features:[],
|
||||
type:"FeatureCollection"
|
||||
},
|
||||
editId:null,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -330,7 +348,6 @@
|
|||
created() {
|
||||
// 初始化图层数据
|
||||
this.layerInfo = { ...this.$route.query };
|
||||
console.log(this.layerInfo)
|
||||
this.layerInfo.nameRef = JSON.parse(this.layerInfo.nameRef);
|
||||
this.listQuery.tableName = this.layerInfo.tableRef;
|
||||
this.getList();
|
||||
|
|
@ -345,8 +362,74 @@
|
|||
},
|
||||
|
||||
methods: {
|
||||
loadNearbyData(){
|
||||
// 获取当前区域范围
|
||||
let bounds = this.globalMap.getBounds();
|
||||
let boundsStr = Math.min(bounds._ne.lng,bounds._sw.lng)+"%2C"+Math.min(bounds._ne.lat,bounds._sw.lat)+"%2C"+Math.max(bounds._ne.lng,bounds._sw.lng)+"%2C"+Math.max(bounds._ne.lat,bounds._sw.lat);
|
||||
let queryInfo = {
|
||||
tablename:this.listQuery.tableName,
|
||||
startlng:bounds._ne.lng,
|
||||
startlat:bounds._ne.lat,
|
||||
endlng:bounds._sw.lng,
|
||||
endlat:bounds._sw.lat,
|
||||
num:this.currentData.id ? this.currentData.id : null
|
||||
}
|
||||
|
||||
axios({
|
||||
method:"get",
|
||||
url:globalApi.netBASE_URL+"/api/FireCodePC/GetLayerInfoByTable",
|
||||
params:queryInfo
|
||||
}).then((res)=>{
|
||||
if(res.data.code == 200){
|
||||
if(res.data.data.length>0){
|
||||
this.nearbyGeoJson.features = [];
|
||||
res.data.data.forEach((item,index)=>{
|
||||
let geom = item.geom;
|
||||
let geometry = WKT.parse(geom)
|
||||
let feature = {
|
||||
geometry:geometry,
|
||||
}
|
||||
// console.log("feature"+index,feature.geometry.coordinates);
|
||||
this.nearbyGeoJson.features.push(feature);
|
||||
})
|
||||
}
|
||||
}
|
||||
// 绘制区域范围内的图斑
|
||||
this.updateBBoxFeatures();
|
||||
})
|
||||
},
|
||||
// 绘制区域范围内的图斑
|
||||
updateBBoxFeatures(){
|
||||
let features = [];
|
||||
this.nearbyGeoJson.features.forEach((item,index)=>{
|
||||
let feature = {
|
||||
geometry:item.geometry,
|
||||
properties:{
|
||||
isOldData:true
|
||||
}
|
||||
}
|
||||
if (this.layerInfo.dataType == '面') {
|
||||
this.geojson.type = "Polygon";
|
||||
feature.geometry.coordinates = feature.geometry.coordinates[0]
|
||||
} else if (this.layerInfo.dataType == '点') {
|
||||
this.geojson.type = "Point";
|
||||
} else if (this.layerInfo.dataType == '线') {
|
||||
this.geojson.type = "LineString";
|
||||
feature.geometry.coordinates = feature.geometry.coordinates[0]
|
||||
}
|
||||
feature.geometry.type = this.geojson.type
|
||||
features.push(feature);
|
||||
})
|
||||
let geojson = {
|
||||
"type": "FeatureCollection",
|
||||
"features": features
|
||||
};
|
||||
// 隐藏原有图层
|
||||
this.globalMap.setLayoutProperty("pbfLayer", "visibility", "none");
|
||||
// console.log("nearbyGeoJson",geojson);
|
||||
this.drawTool.add(geojson);
|
||||
},
|
||||
changePo(name) {
|
||||
console.log(name)
|
||||
if (name == 'lng' || name == 'lat') {
|
||||
if (this.formData.lat && this.formData.lng) {
|
||||
var drow = [Number(this.formData.lng), Number(this.formData.lat)]
|
||||
|
|
@ -363,7 +446,7 @@
|
|||
]
|
||||
};
|
||||
this.globalMap.setLayoutProperty("pbfLayer", "visibility", "none");
|
||||
this.drawTool.set(geojson);
|
||||
this.drawTool.add(geojson);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -422,9 +505,7 @@
|
|||
} else {
|
||||
this.columnData = [];
|
||||
let item = this.layerInfo.nameRef;
|
||||
console.log(item)
|
||||
for (let column in item) {
|
||||
console.log(column)
|
||||
let obj = {
|
||||
label: column,
|
||||
value: column
|
||||
|
|
@ -444,7 +525,7 @@
|
|||
} else if (visibie == 'none') {
|
||||
this.globalMap.setLayoutProperty(layerName, 'visibility', 'visible');
|
||||
this.layerShow[layerName] = "visible"
|
||||
}
|
||||
}
|
||||
},
|
||||
toThere(row) {
|
||||
let _this = this;
|
||||
|
|
@ -470,7 +551,6 @@
|
|||
this.currentData = res.data.data;
|
||||
this.isLook = true;
|
||||
this.geojson = this.WktToGeoJson(res.data.data.geom);
|
||||
console.log("this.geojson", this.geojson);
|
||||
let center = this.getCenterPoint(this.geojson);
|
||||
if (center) {
|
||||
this.mapFlyTo(center);
|
||||
|
|
@ -479,12 +559,13 @@
|
|||
}
|
||||
})
|
||||
},
|
||||
editByMap() {
|
||||
editByMap(id) {
|
||||
this.currentData.id = id;
|
||||
this.editType = "edit";
|
||||
if (this.drawTool) {
|
||||
return null;
|
||||
}
|
||||
this.getData(parseInt(this.formData.id));
|
||||
this.getData(parseInt(id));
|
||||
this.randomForm = Math.random() * 10000;
|
||||
this.popup ? this.popup.remove() : null;
|
||||
this.isEdit = true;
|
||||
|
|
@ -493,14 +574,13 @@
|
|||
this.editType = "edit";
|
||||
if (this.drawTool) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
this.getData(parseInt(this.currentData.id));
|
||||
this.randomForm = Math.random() * 10000;
|
||||
this.popup ? this.popup.remove() : null;
|
||||
this.isEdit = true;
|
||||
},
|
||||
initDraw() {
|
||||
|
||||
let controlConfig = {}
|
||||
if (this.layerInfo.dataType == '面') {
|
||||
controlConfig = {
|
||||
|
|
@ -524,15 +604,39 @@
|
|||
trash: true
|
||||
}
|
||||
}
|
||||
|
||||
// this.drawTool = new MapboxDraw({
|
||||
// displayControlsDefault: false,
|
||||
// controls: controlConfig,
|
||||
// snap: {
|
||||
// vertex: true, // 开启 vertex 吸附
|
||||
// distance:30,
|
||||
// // 如果你想吸附到特定的图层，可以在 layer 属性中指定图层名称
|
||||
// // layers: ['your-layer-name']
|
||||
// }
|
||||
// })
|
||||
this.drawTool = new MapboxDraw({
|
||||
displayControlsDefault: false,
|
||||
controls: controlConfig
|
||||
})
|
||||
modes: {
|
||||
...MapboxDraw.modes,
|
||||
draw_point: SnapPointMode,
|
||||
draw_polygon: SnapPolygonMode,
|
||||
draw_line_string: SnapLineMode,
|
||||
direct_select: SnapDirectSelect,
|
||||
},
|
||||
// Styling guides
|
||||
styles: SnapModeDrawStyles,
|
||||
userProperties: true,
|
||||
// Config snapping features
|
||||
snap: true,
|
||||
snapOptions: {
|
||||
snapPx: 15, // defaults to 15
|
||||
snapToMidPoints: true, // defaults to false
|
||||
snapVertexPriorityDistance: 0.0025, // defaults to 1.25
|
||||
},
|
||||
guides: false,
|
||||
});
|
||||
|
||||
this.globalMap.addControl(this.drawTool, 'top-right');
|
||||
// this.geojson = this.clickMapData;
|
||||
|
||||
if (this.layerInfo.dataType == '面') {
|
||||
this.geojson.type = "Polygon";
|
||||
this.geojson.coordinates = this.geojson.coordinates[0];
|
||||
|
|
@ -545,9 +649,6 @@
|
|||
}
|
||||
this.formData.lat = this.geojson.coordinates[1]
|
||||
this.formData.lng = this.geojson.coordinates[0]
|
||||
|
||||
console.log(this.geojson);
|
||||
|
||||
let geojson = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
|
|
@ -557,9 +658,10 @@
|
|||
}
|
||||
]
|
||||
};
|
||||
console.log(geojson)
|
||||
// 隐藏PBF图层
|
||||
this.globalMap.setLayoutProperty("pbfLayer", "visibility", "none");
|
||||
this.drawTool.set(geojson);
|
||||
this.drawTool.add(geojson);
|
||||
this.loadNearbyData();
|
||||
},
|
||||
addData() {
|
||||
if (this.isEdit) {
|
||||
|
|
@ -569,9 +671,12 @@
|
|||
})
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.drawTool) {
|
||||
return null;
|
||||
}
|
||||
// 获取与加载周边数据
|
||||
|
||||
this.formData = {};
|
||||
this.editType = "add"
|
||||
|
||||
|
|
@ -598,13 +703,30 @@
|
|||
trash: true
|
||||
}
|
||||
}
|
||||
this.drawTool = new MapboxDraw({
|
||||
displayControlsDefault: false,
|
||||
controls: controlConfig,
|
||||
// defaultMode: 'draw_polygon'
|
||||
})
|
||||
this.drawTool = new MapboxDraw({
|
||||
modes: {
|
||||
...MapboxDraw.modes,
|
||||
draw_point: SnapPointMode,
|
||||
draw_polygon: SnapPolygonMode,
|
||||
draw_line_string: SnapLineMode,
|
||||
direct_select: SnapDirectSelect,
|
||||
},
|
||||
// Styling guides
|
||||
styles: SnapModeDrawStyles,
|
||||
userProperties: true,
|
||||
// Config snapping features
|
||||
snap: true,
|
||||
snapOptions: {
|
||||
snapPx: 15, // defaults to 15
|
||||
snapToMidPoints: true, // defaults to false
|
||||
snapVertexPriorityDistance: 0.0025, // defaults to 1.25
|
||||
},
|
||||
guides: false,
|
||||
});
|
||||
|
||||
this.globalMap.addControl(this.drawTool, 'top-right');
|
||||
this.isEdit = true;
|
||||
this.loadNearbyData();
|
||||
},
|
||||
saveData() {
|
||||
|
||||
|
|
@ -619,9 +741,10 @@
|
|||
}
|
||||
// POLYGON MULTIPOLYGON LINESTRING MULTILINESTRING POINT MULTIPOINT
|
||||
let geom = WKT.convert(this.geojson);
|
||||
|
||||
this.formData.tableName = this.layerInfo.tableRef;
|
||||
this.formData.spaceType = this.layerInfo.spaceType;
|
||||
delete this.formData.lng;
|
||||
delete this.formData.lat
|
||||
|
||||
if (this.layerInfo.dataType == '面') {
|
||||
geom = geom.replace("POLYGON ", "MULTIPOLYGON (");
|
||||
|
|
@ -633,11 +756,8 @@
|
|||
geom = geom + ")"
|
||||
}
|
||||
this.formData.geom = geom;
|
||||
console.log(this.formData);
|
||||
|
||||
if (this.editType == "edit") {
|
||||
console.log("111", this.currentData);
|
||||
console.log("222", this.formData)
|
||||
postMethodCommon("/geoserver/updateLayerData", this.formData).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
let _this = this;
|
||||
|
|
@ -682,9 +802,7 @@
|
|||
if (res.data.code == 200) {
|
||||
if (res.data.code == 200) {
|
||||
this.formData = res.data.data;
|
||||
console.log("geom", res.data.data.geom);
|
||||
this.geojson = this.WktToGeoJson(res.data.data.geom);
|
||||
console.log("this.geojson", this.geojson);
|
||||
this.initDraw();
|
||||
}
|
||||
}
|
||||
|
|
@ -692,13 +810,11 @@
|
|||
},
|
||||
getDetail(id) {
|
||||
postMethodCommon("/geoserver/getSingleDate", { tableName: this.layerInfo.tableRef, id: id }).then(res => {
|
||||
console.log(res);
|
||||
if (res.data.code == 200) {
|
||||
// this.formData = res.data.data;
|
||||
this.currentData = res.data.data;
|
||||
this.isLook = true;
|
||||
this.geojson = this.WktToGeoJson(res.data.data.geom);
|
||||
console.log("this.geojson", this.geojson);
|
||||
let center = this.getCenterPoint(this.geojson);
|
||||
if (center) {
|
||||
this.mapFlyTo(center);
|
||||
|
|
@ -781,7 +897,7 @@
|
|||
|
||||
},
|
||||
dealData() {
|
||||
this.geojson.features.forEach((item, index) => {
|
||||
this.geojson.features.forEach((item) => {
|
||||
this.tableData.push(item.properties);
|
||||
})
|
||||
},
|
||||
|
|
@ -798,8 +914,28 @@
|
|||
minZoom: 5,
|
||||
pitch: 0,
|
||||
// style:"mapbox://styles/mapbox/satellite-v9"
|
||||
style: "mapbox://styles/mapbox/streets-v11"
|
||||
// style: "mapbox://styles/mapbox/streets-v11"
|
||||
// style:"mapbox://styles/mapbox/dark-v10"
|
||||
style: {
|
||||
glyphs: "mapbox://fonts/mapbox/{fontstack}/{range}.pbf",
|
||||
"version": 8,
|
||||
"sources": {
|
||||
"raster-tiles": {
|
||||
"type": "raster",
|
||||
"tiles": ['https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=b6585bc41ee16251dbe6b1af64f375d9'],
|
||||
"tileSize": 256,
|
||||
}
|
||||
},
|
||||
"layers": [
|
||||
{
|
||||
"id": "tdt-img-tiles",
|
||||
"type": "raster",
|
||||
"source": "raster-tiles",
|
||||
"minzoom": 0,
|
||||
"maxzoom": 22
|
||||
},
|
||||
]
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
|
|
@ -816,6 +952,7 @@
|
|||
'tileSize': 512,
|
||||
'maxzoom': 14
|
||||
});
|
||||
//
|
||||
// add the DEM source as a terrain layer with exaggerated height
|
||||
_this.globalMap.setTerrain({ 'source': 'mapbox-dem', 'exaggeration': 1.5 });
|
||||
|
||||
|
|
@ -831,13 +968,13 @@
|
|||
});
|
||||
|
||||
_this.loadPBFLayer();
|
||||
_this.loadMengban()
|
||||
|
||||
// _this.loadLayer();
|
||||
|
||||
_this.globalMap.on('contextmenu', "myIconLayer", function (e) {
|
||||
// 在此处添加事件处理程序
|
||||
this.attributeInfo = e.features[0].properties;
|
||||
console.log("attributeInfo", this.attributeInfo);
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -847,7 +984,6 @@
|
|||
|
||||
_this.attributeInfo = e.features[0].properties;
|
||||
_this.formData = { ..._this.attributeInfo };
|
||||
console.log("formData", _this.formData);
|
||||
|
||||
|
||||
if (_this.popup) {
|
||||
|
|
@ -866,7 +1002,7 @@
|
|||
_this.popup.setLngLat(e.lngLat)
|
||||
.setHTML(`
|
||||
<div style="color:#333;padding:3px 12px;cursor:pointer;" type="primary" icon="el-icon-search" onclick="getDetail(${_this.attributeInfo.id})">查看信息</div>
|
||||
<div style="color:#333;padding:3px 12px;cursor:pointer;" type="primary" icon="el-icon-search" onclick="editByMap();">编辑信息</div>
|
||||
<div style="color:#333;padding:3px 12px;cursor:pointer;" type="primary" icon="el-icon-search" onclick="editByMap(${_this.attributeInfo.id});">编辑信息</div>
|
||||
<div style="color:#333;padding:3px 12px;cursor:pointer;" type="primary" icon="el-icon-search" onclick="deleteByContexmenu();">删除数据</div>`)
|
||||
.addTo(_this.globalMap);
|
||||
});
|
||||
|
|
@ -878,19 +1014,61 @@
|
|||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
// 鼠标移动事件
|
||||
_this.globalMap.on("mousemove",function(e){
|
||||
// // 鼠标移动的X-Y像素位置
|
||||
// let mousePosition = _this.globalMap.project([e.lngLat.lng, e.lngLat.lat])
|
||||
// let closestFeature = null;
|
||||
// let closestDistance = Infinity;
|
||||
// let threshold = 20; // 阈值，单位为像素
|
||||
// // 遍历每个点的像素位置
|
||||
// if(_this.geojson.coordinates){
|
||||
// _this.geojson.coordinates.forEach((feature,index)=>{
|
||||
// let targetPosition = _this.globalMap.project(feature)
|
||||
// // 计算两个点在屏幕上的像素距离
|
||||
// let distance = Math.sqrt(Math.pow(mousePosition.x - targetPosition.x, 2) + Math.pow(mousePosition.y - targetPosition.y, 2));
|
||||
// // 如果在范围内
|
||||
// if (distance < closestDistance && distance < threshold) {
|
||||
// closestFeature = feature;
|
||||
// closestDistance = distance;
|
||||
// // _this.updateAdsorptionPoint(feature)
|
||||
// }else{ // 在范围外
|
||||
// // console.log("clear");
|
||||
// // _this.updateAdsorptionPoint(null)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
})
|
||||
|
||||
// 鼠标在吸附点内，mouseup事件，设置吸附点为当前点的位置
|
||||
|
||||
|
||||
/**
|
||||
*
|
||||
* draw.create 是绘制完成事件
|
||||
* draw.update 是编辑完成事件
|
||||
*
|
||||
* */
|
||||
// 设置绘图监听事件
|
||||
_this.globalMap.on('draw.create', function (e) {
|
||||
var feature = e.features[0];
|
||||
_this.geojson = feature.geometry;
|
||||
_this.formData.lat = _this.geojson.coordinates[1]
|
||||
_this.formData.lng = _this.geojson.coordinates[0]
|
||||
console.log("features", _this.geojson);
|
||||
})
|
||||
|
||||
_this.globalMap.on('draw.update', function (e) {
|
||||
var feature = e.features[0];
|
||||
_this.geojson = feature.geometry;
|
||||
if(e.features[0].properties.isOldData){
|
||||
|
||||
}else{
|
||||
var feature = e.features[0];
|
||||
_this.geojson = feature.geometry;
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
})
|
||||
},
|
||||
// loadLayer(){
|
||||
|
|
@ -918,6 +1096,41 @@
|
|||
/*
|
||||
|
||||
*/
|
||||
updateAdsorptionPoint(lngLat){
|
||||
let geojson = {
|
||||
'type': 'FeatureCollection',
|
||||
'features': [
|
||||
{
|
||||
'type': 'Feature',
|
||||
'geometry': {
|
||||
'type': 'Point',
|
||||
'coordinates': lngLat ? lngLat : []
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
// 判断无 有更新数据，没有添加数据
|
||||
if(this.globalMap.getSource("adsorptionPointSource")){
|
||||
this.globalMap.getSource("adsorptionPointSource").setData(geojson);
|
||||
}else{
|
||||
this.globalMap.addSource("adsorptionPointSource",{
|
||||
type:"geojson",
|
||||
data:geojson
|
||||
})
|
||||
this.globalMap.addLayer({
|
||||
'id': 'adsorptionPointLayer',
|
||||
'type': 'circle',
|
||||
'source': 'adsorptionPointSource',
|
||||
'paint': {
|
||||
'circle-color': '#4264fb',
|
||||
'circle-radius': 10,
|
||||
'circle-stroke-width': 4,
|
||||
'circle-stroke-color': '#ffffff'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
loadDianZiLayer() {
|
||||
this.globalMap.addLayer({
|
||||
'id': 'tiandituzhuji',
|
||||
|
|
@ -938,7 +1151,7 @@
|
|||
'type': 'raster',
|
||||
'source': {
|
||||
'type': 'raster',
|
||||
'tiles': ["http://175.27.168.120:8080/geoserver/pingyixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=pingyixian:yingxiang&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE"],
|
||||
'tiles': ["https://fx.hopetrytech.com:7005/geoserver/PY/wms?service=WMS&version=1.1.0&request=GetMap&layers=PY:yingxiang&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE"],
|
||||
'tileSize': 256
|
||||
},
|
||||
'layout': {
|
||||
|
|
@ -966,6 +1179,39 @@
|
|||
}
|
||||
});
|
||||
},
|
||||
loadMengban() {
|
||||
this.globalMap.addLayer({
|
||||
//蒙版图层 //通过边界数据反选 达到挖洞效果
|
||||
id: 'mb-tag',
|
||||
type: 'fill',
|
||||
source: {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'Feature',
|
||||
geometry: {
|
||||
type: 'Polygon',
|
||||
coordinates: [
|
||||
[
|
||||
// 多边形外围 需要进行遮罩的点 这里是给世界地图加遮罩 所以是世界的四个端点
|
||||
[-180, 90],
|
||||
[180, 90],
|
||||
[180, -90],
|
||||
[-180, -90],
|
||||
],
|
||||
waiData.DATA,
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
paint: {
|
||||
'fill-color': '#1a274b',
|
||||
'fill-opacity': 1 /* 透明度 */,
|
||||
},
|
||||
layout: {
|
||||
visibility: 'visible',
|
||||
},
|
||||
});
|
||||
},
|
||||
loadSearchResultLayer(item) {
|
||||
let geojson = {
|
||||
"type": "FeatureCollection",
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,31 @@
|
|||
|
||||
分成编辑和添加两种情况：
|
||||
|
||||
一、添加图斑情况
|
||||
|
||||
1. 获取当前视角范围坐标，通过geoserver bbox查询条件，查询框选范围内的数据
|
||||
|
||||
2. 叠加查询的数据，设置为样式一
|
||||
|
||||
3. 绘制图形
|
||||
|
||||
方案一：可以吸附获取点
|
||||
|
||||
方案二：选中需要合并的线，通过按钮合并
|
||||
|
||||
5. 保存绘制图斑信息
|
||||
|
||||
二、编辑图斑情况
|
||||
|
||||
|
||||
1. 获取当前视角范围坐标，通过geoserver bbox查询条件，查询框选范围内的数据
|
||||
|
||||
2. 叠加查询的数据，设置为样式一
|
||||
|
||||
3. 编辑图形
|
||||
|
||||
方案一：可以吸附获取点
|
||||
|
||||
方案二：选中需要合并的线，通过按钮合并
|
||||
|
||||
5. 保存绘制图斑信息
|
||||
|
|
@ -1,28 +1,28 @@
|
|||
const validateMobile = function (rule, value, callback) {
|
||||
let newValue = value.replace(/[^0-9]/gi, '')
|
||||
if (value !== newValue) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else if (newValue.length !== 11) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
const validID = function(rule, value, callback) {
|
||||
// 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X
|
||||
let reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
||||
if (reg.test(value)) {
|
||||
callback();
|
||||
} else {
|
||||
callback(new Error("请输入正确的身份证号码"));
|
||||
}
|
||||
}
|
||||
var validateStock = (rule, value, callback) => {
|
||||
if (!value || value == 0) {
|
||||
callback(new Error("不能为空"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
|
||||
const validateMobile = function (rule, value, callback) {
|
||||
let newValue = value.replace(/[^0-9]/gi, '')
|
||||
if (value !== newValue) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else if (newValue.length !== 11) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
const validID = function(rule, value, callback) {
|
||||
// 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X
|
||||
let reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
||||
if (reg.test(value)) {
|
||||
callback();
|
||||
} else {
|
||||
callback(new Error("请输入正确的身份证号码"));
|
||||
}
|
||||
}
|
||||
var validateStock = (rule, value, callback) => {
|
||||
if (!value || value == 0) {
|
||||
callback(new Error("不能为空"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
|
||||
export { validateMobile ,validID,validateStock}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -24,7 +24,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { login } from "../../api/login";
|
||||
import { login,checkAuth } from "../../api/login";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -39,15 +39,38 @@ export default {
|
|||
if (res.data.code == 200) {
|
||||
// console.log(res);
|
||||
// localStorage.setItem("X-Token", res.data.msg);
|
||||
|
||||
localStorage.setItem("areaName",res.data.userInfo.areaENName);
|
||||
localStorage.setItem("areaENName",res.data.userInfo.areaENName);
|
||||
localStorage.setItem("X-Token", res.data.token);
|
||||
this.$message.success("登录成功");
|
||||
this.loading = false
|
||||
this.$router.push("/layout");
|
||||
|
||||
this.checkAuth();
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
checkAuth(){
|
||||
checkAuth().then(res=>{
|
||||
if(res.data.code == 200){
|
||||
let checked = false
|
||||
res.data.result.forEach((item)=>{
|
||||
if(item.name == '数据维护'){
|
||||
checked = true
|
||||
}
|
||||
})
|
||||
|
||||
if(checked){
|
||||
this.$message.success("登录成功！");
|
||||
this.loading = false
|
||||
this.$router.push("/layout");
|
||||
}else{
|
||||
this.$message.error("没有权限！");
|
||||
localStorage.clear();
|
||||
this.$router.push("/");
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,368 @@
|
|||
<template>
|
||||
<div class='route-draw-container'>
|
||||
<div class="filter-container">
|
||||
|
||||
<el-input type="text" placeholder="请输入人名搜索" size="mini" style="width:200px;margin:0px 12px;"></el-input>
|
||||
<el-button type="default" icon="el-icon-refresh-left" size="mini">重置</el-button>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini">搜索</el-button>
|
||||
</div>
|
||||
<div class="data-list-container">
|
||||
<el-table :data="tableData" height=" calc( 100% - 60px)" style="width: 100%;" size="mini"
|
||||
>
|
||||
<el-table-column
|
||||
show-overflow-tooltip prop="createuserName" width="120"
|
||||
label="用户名称"></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
show-overflow-tooltip prop="createTime"
|
||||
label="采集时间"></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
show-overflow-tooltip prop="roadtype"
|
||||
label="道路类型"></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
show-overflow-tooltip prop="remark"
|
||||
label="备注信息"></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
show-overflow-tooltip prop="createTime"
|
||||
label="编辑时间"></el-table-column>
|
||||
|
||||
<el-table-column fixed="right" label="操作" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="primary" style="margin-top:6px;"
|
||||
icon="el-icon el-icon-tickets" size="mini">
|
||||
查看
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="page-container">
|
||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageNum" :page-sizes="[20,50,100, 200, 300, 400]" :page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper" :total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props:[],
|
||||
data() {
|
||||
return {
|
||||
tableData:[
|
||||
{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
},{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
},{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
},{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
},{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
},{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
},{
|
||||
id:"",
|
||||
createTime:"2023-10-27 12:23:54",
|
||||
createuserId:"",
|
||||
createuserName:"徐景良",
|
||||
roadtype:2,
|
||||
remark:"备注信息"
|
||||
}
|
||||
],
|
||||
listQuery:{
|
||||
key:null,
|
||||
pageIndex:1,
|
||||
pageSize:10,
|
||||
},
|
||||
total:0,
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {
|
||||
handleSizeChange(e){
|
||||
|
||||
},
|
||||
handleCurrentChange(e){
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.route-draw-container{
|
||||
width:100%;
|
||||
margin-left:20px;
|
||||
height: calc(100% - 120px);
|
||||
padding:30px;
|
||||
}
|
||||
|
||||
.filter-container{
|
||||
width:100%;
|
||||
padding:20px 15px;
|
||||
border-bottom: 1px solid #108eff;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
.data-list-container{
|
||||
padding:30px 0px;
|
||||
|
||||
}
|
||||
.page-container{
|
||||
width:100%;
|
||||
padding:15px;
|
||||
border-top: 1px solid #108eff;
|
||||
}
|
||||
|
||||
::v-deep .el-table {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__label {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
::v-deep .el-table__fixed-right::before,
|
||||
.el-table__fixed::before {
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-table::before {
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-form--inline {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
::v-deep .mapboxgl-ctrl {
|
||||
display: block;
|
||||
}
|
||||
|
||||
::v-deep .el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell.is-leaf {
|
||||
border-bottom: 1px solid hsl(240, 100%, 37%, 0.2);
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background-color: transparent;
|
||||
border: 0.0625rem solid #00b2ff;
|
||||
color: #fff;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-button {
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__label {
|
||||
color: #00b2ff;
|
||||
/* line-height: 2.1875rem; */
|
||||
}
|
||||
|
||||
::v-deep .el-button--small {
|
||||
padding: 0.625rem 2.1875rem;
|
||||
}
|
||||
|
||||
::v-deep .el-form--inline .el-form-item {
|
||||
/* margin-left: 1.875rem; */
|
||||
}
|
||||
|
||||
::v-deep .el-table,
|
||||
.el-table__expanded-cell {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* “表格内背景颜色“ */
|
||||
::v-deep.el-table th,
|
||||
::v-deep.el-table tr,
|
||||
::v-deep.el-table td {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* 按钮样式修改 */
|
||||
::v-deep .el-button--success {
|
||||
background: #266a94;
|
||||
color: #00f261;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-button--info {
|
||||
background: #482c27;
|
||||
color: #8ac2da;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::v-deep.el-button--primary {
|
||||
background: #266a94;
|
||||
color: #8ac2da;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::v-deep.el-button--primary {
|
||||
background: #578ef0;
|
||||
color: #fff;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/*修改element-ui的table 在鼠标悬停hover时的高亮颜色*/
|
||||
::v-deep.el-table tbody tr:hover>td {
|
||||
background-color: black !important;
|
||||
}
|
||||
|
||||
/* 第一个 dialog修改 */
|
||||
::v-deep.dialog_one .el-dialog {
|
||||
background: #266a94 !important;
|
||||
border: 1px solid #10a2e1;
|
||||
}
|
||||
|
||||
::v-deep.dialog_one .el-dialog__title {
|
||||
color: #00b2ff;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
::v-deep.dialog_one .el-dialog__header {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 第二个 dialog 修改 */
|
||||
::v-deep.dialog_two .el-dialog {
|
||||
background: rgba(37, 61, 75, 0.7) !important;
|
||||
border: 1px solid #797979;
|
||||
}
|
||||
|
||||
::v-deep.dialog_two .el-dialog__body {
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
::v-deep.dialog_two .el-dialog__header {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-table__cell {
|
||||
background: none;
|
||||
padding: 0px;
|
||||
font-size: 14px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
::v-deep .cell {
|
||||
padding: 0px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
/* background:hsl(212, 43%, 49%,0.5); */
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
::v-deep .number {
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .btn-next {
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .btn-prev {
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__total {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__jump {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination button:disabled {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .disabled {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .el-descriptions__body {
|
||||
background: none;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
::v-deep .el-descriptions-row {
|
||||
background: none;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-descriptions-item__label {
|
||||
background: hsl(212, 43%, 49%, 0.5);
|
||||
color: #eee;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
::v-deep .el-descriptions .is-bordered .el-descriptions-item__cell {
|
||||
border-color: hsl(212, 43%, 49%, 1);
|
||||
}
|
||||
|
||||
::v-deep .mapboxgl-ctrl-logo {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<template>
|
||||
<div class='map-container'>
|
||||
<div class="map-content">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props:[],
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.map-container{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue