diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/src/router/modules/map.js b/src/router/modules/map.js index 5c026bd..e968017 100644 --- a/src/router/modules/map.js +++ b/src/router/modules/map.js @@ -59,7 +59,7 @@ path: '/mapSearch', name: 'MapSearch', component: () => import('@/views/overview/mapSearch'), - meta: { title: '要素查询', icon: '', permission: ['/mapSearch'], keepAlive: true } + meta: { title: '地图查询', icon: '', permission: ['/mapSearch'], keepAlive: true } } ] }, { @@ -81,4 +81,27 @@ meta: { title: '服务地址', icon: '', permission: ['/mapServer'], keepAlive: true } } ] +}, { + path: 'addressSearch', + component: Layout, + redirect: '/addressSearch', + name: 'AddressSearch', + alwaysShow: true, + meta: { + title: '地址查询', + icon: 'icon-config' // 图标 + }, + children: [ + { + path: '/mapAddress', + name: 'MapAddress', + component: () => import('@/views/overview/mapSearch'), + meta: { title: '地图查询', icon: '' } + }, { + path: '/listSearch', + name: 'ListSearch', + component: () => import('@/views/address/address'), + meta: { title: '列表查询', icon: '' } + } + ] }] diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/src/router/modules/map.js b/src/router/modules/map.js index 5c026bd..e968017 100644 --- a/src/router/modules/map.js +++ b/src/router/modules/map.js @@ -59,7 +59,7 @@ path: '/mapSearch', name: 'MapSearch', component: () => import('@/views/overview/mapSearch'), - meta: { title: '要素查询', icon: '', permission: ['/mapSearch'], keepAlive: true } + meta: { title: '地图查询', icon: '', permission: ['/mapSearch'], keepAlive: true } } ] }, { @@ -81,4 +81,27 @@ meta: { title: '服务地址', icon: '', permission: ['/mapServer'], keepAlive: true } } ] +}, { + path: 'addressSearch', + component: Layout, + redirect: '/addressSearch', + name: 'AddressSearch', + alwaysShow: true, + meta: { + title: '地址查询', + icon: 'icon-config' // 图标 + }, + children: [ + { + path: '/mapAddress', + name: 'MapAddress', + component: () => import('@/views/overview/mapSearch'), + meta: { title: '地图查询', icon: '' } + }, { + path: '/listSearch', + name: 'ListSearch', + component: () => import('@/views/address/address'), + meta: { title: '列表查询', icon: '' } + } + ] }] diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js index 1f4fa38..fc603f5 100644 --- a/src/utils/baseConfig.js +++ b/src/utils/baseConfig.js @@ -1,5 +1,5 @@ const project = { - title: '后台管理系统前端基础框架' + title: '基础资源子系统' } export function getProject() { return project diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/src/router/modules/map.js b/src/router/modules/map.js index 5c026bd..e968017 100644 --- a/src/router/modules/map.js +++ b/src/router/modules/map.js @@ -59,7 +59,7 @@ path: '/mapSearch', name: 'MapSearch', component: () => import('@/views/overview/mapSearch'), - meta: { title: '要素查询', icon: '', permission: ['/mapSearch'], keepAlive: true } + meta: { title: '地图查询', icon: '', permission: ['/mapSearch'], keepAlive: true } } ] }, { @@ -81,4 +81,27 @@ meta: { title: '服务地址', icon: '', permission: ['/mapServer'], keepAlive: true } } ] +}, { + path: 'addressSearch', + component: Layout, + redirect: '/addressSearch', + name: 'AddressSearch', + alwaysShow: true, + meta: { + title: '地址查询', + icon: 'icon-config' // 图标 + }, + children: [ + { + path: '/mapAddress', + name: 'MapAddress', + component: () => import('@/views/overview/mapSearch'), + meta: { title: '地图查询', icon: '' } + }, { + path: '/listSearch', + name: 'ListSearch', + component: () => import('@/views/address/address'), + meta: { title: '列表查询', icon: '' } + } + ] }] diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js index 1f4fa38..fc603f5 100644 --- a/src/utils/baseConfig.js +++ b/src/utils/baseConfig.js @@ -1,5 +1,5 @@ const project = { - title: '后台管理系统前端基础框架' + title: '基础资源子系统' } export function getProject() { return project diff --git a/src/views/address/address.vue b/src/views/address/address.vue new file mode 100644 index 0000000..ee41dea --- /dev/null +++ b/src/views/address/address.vue @@ -0,0 +1,105 @@ + + + + + diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/src/router/modules/map.js b/src/router/modules/map.js index 5c026bd..e968017 100644 --- a/src/router/modules/map.js +++ b/src/router/modules/map.js @@ -59,7 +59,7 @@ path: '/mapSearch', name: 'MapSearch', component: () => import('@/views/overview/mapSearch'), - meta: { title: '要素查询', icon: '', permission: ['/mapSearch'], keepAlive: true } + meta: { title: '地图查询', icon: '', permission: ['/mapSearch'], keepAlive: true } } ] }, { @@ -81,4 +81,27 @@ meta: { title: '服务地址', icon: '', permission: ['/mapServer'], keepAlive: true } } ] +}, { + path: 'addressSearch', + component: Layout, + redirect: '/addressSearch', + name: 'AddressSearch', + alwaysShow: true, + meta: { + title: '地址查询', + icon: 'icon-config' // 图标 + }, + children: [ + { + path: '/mapAddress', + name: 'MapAddress', + component: () => import('@/views/overview/mapSearch'), + meta: { title: '地图查询', icon: '' } + }, { + path: '/listSearch', + name: 'ListSearch', + component: () => import('@/views/address/address'), + meta: { title: '列表查询', icon: '' } + } + ] }] diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js index 1f4fa38..fc603f5 100644 --- a/src/utils/baseConfig.js +++ b/src/utils/baseConfig.js @@ -1,5 +1,5 @@ const project = { - title: '后台管理系统前端基础框架' + title: '基础资源子系统' } export function getProject() { return project diff --git a/src/views/address/address.vue b/src/views/address/address.vue new file mode 100644 index 0000000..ee41dea --- /dev/null +++ b/src/views/address/address.vue @@ -0,0 +1,105 @@ + + + + + diff --git a/src/views/overview/mapSearch.vue b/src/views/overview/mapSearch.vue index b051fa1..750be39 100644 --- a/src/views/overview/mapSearch.vue +++ b/src/views/overview/mapSearch.vue @@ -18,13 +18,13 @@ 图层 - - {{ parts }} + + {{ parts }}
- +
共找到 {{ searchlist.length }} 条个查询结果 @@ -38,19 +38,20 @@
{{ scope.$index + 1 }}
- 名称：{{ scope.row.小类名称 }} - 编码：{{ scope.row.编码 }} - 地址：{{ scope.row.编码 }} + 名称：{{ scope.row.properties.小类名称 }} + 编码：{{ scope.row.properties.编码 }} + 地址：{{ scope.row.properties.OBJECTID }} @@ -68,9 +69,9 @@ const sewageHole = [37] const video = [35] const lamp = [1, 3, 4, 22, 25, 34] -const toilet = [12, 13] +const toilet = [12, 13, 41] const garbage = [24] -const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40] +const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40, 42, 43, 44, 45] export default { name: 'MapSearch', data() { @@ -80,61 +81,30 @@ offset: 1, btnList: false, listLoading: false, // 加载动画 - TianDiTu: { - Normal: { - Map: 'https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Satellite: { - Map: 'https://t{s}.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t{s}.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Terrain: { - Map: 'https://t{s}.tianditu.gov.cn/ter_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ter&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t{s}.tianditu.gov.cn/cta_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cta&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] - }, + showlist: [], // 列表展示项 + checkboxloading: false, + list: [], // url列表 + searchlist: [], + cansearch: true, + layerlist: [], map: null, + bounds: null, showtable: true, isShow: false, partsOptions: ['网格', '商户', '视频监控点', '路灯杆和灯箱', '雨水井盖', '污水井盖', '公共厕所', '垃圾箱', '其他部件'], selectParts: ['底图', '网格', '商户', '视频监控点', '路灯杆和灯箱', '雨水井盖', '污水井盖', '公共厕所', '垃圾箱', '其他部件'], - showlist: [], - searchlist: [ - { 编码: 11111, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 22222, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 3333, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 4444, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 55555, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 666, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 777, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 888, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 999, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 11111, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 2222, 小类名称: '雨水井盖', 地址: '海淀区' }], listQuery: { offset: 1, limit: 15 }, // 筛选条件 - list: [], maps: [], parts: [], baseUrl: '', partsUrl: '', mapUrl: '', multipleSelection: [], // 多选选中项 - iconlist: [], baselayer: [], - caselist: [], // 路灯（map） - statisticNum: { - work: 0, - todayCase: 0, - allCase: 0, - merchant: 0, - parts: 0 - }, - status: { - register: 0, - dispatch: 0, - disposal: 0, - disposaling: 0 - } + markerlist: [] } }, destroyed() { @@ -142,6 +112,9 @@ this.socket.close() }, mounted() { + var southWest = L.latLng(27.74, 116.06) + var northEast = L.latLng(27.77, 116.1) + this.bounds = L.latLngBounds(southWest, northEast) window.addEventListener('click', this.handleKeyup, true) this.init() }, @@ -151,15 +124,152 @@ this.btnList = false } }, + addPointsToMap(results) { + if (!results.hasOwnProperty('features') || + results.features.length === 0) { + return // no features, something went wrong + } + var features = results.features + console.log(features) + var feature + var items = [] + for (var i = 0; i < features.length; i++) { + var symbol11 = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0, 0, 255, 0.35]), 1), new dojo.Color([125, 125, 125, 0.35])) + feature = features[i] + feature.setSymbol(symbol11) + this.map.graphics.add(feature) + items.push(feature.attributes) + } + this.searchlist = items + }, search() { - this.offset = 1 - this.showlist = this.searchlist.slice(0, 5) - this.isShow = true + this.cansearch = false + var that = this + this.searchlist = [] + for (let i = 0; i < this.layerlist.length; i++) { + var str = ['编码', '小类名称', '大类名称'] + var query = esri.query({ + url: this.baseUrl + this.partsUrl + '/' + this.layerlist[i].toString() + }) + if (this.keyword === '') { + query.where('1=1') + query.within(this.bounds) + query.run(function(error, featureCollection, response) { + if (error) { + console.log(error) + return + } + for (let j = featureCollection.features.length - 1; j >= 0; j--) { + that.searchlist.push(featureCollection.features[j]) + } + if (i === that.layerlist.length - 1) { + that.offset = 1 + that.showlist = that.searchlist.slice(0, 5) + that.isShow = true + that.drawIcon() + } + console.log(featureCollection.features) + }) + } else { + for (let j = 0; j < str.length; j++) { + query.where(str[j] + " like '%" + this.keyword + "%'") + query.within(this.bounds) + query.run(function(error, featureCollection, response) { + if (error) { + console.log(error) + return + } + for (let k = featureCollection.features.length - 1; k >= 0; k--) { + that.searchlist.push(featureCollection.features[k]) + } + console.log(featureCollection.features) + if (i === that.layerlist.length - 1) { + that.offset = 1 + that.showlist = that.searchlist.slice(0, 5) + that.isShow = true + that.drawIcon() + } + }) + } + } + } + }, + drawIcon() { + var that = this + for (var i = 0; i < that.markerlist.length; i++) { + that.map.removeLayer(that.markerlist[i]) + } + that.markerlist = [] + for (let num = 0; num < that.showlist.length; num++) { + var Icon + switch (num) { + case 0: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point1.png'), + iconSize: [25, 25] + }) + break + case 1: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point2.png'), + iconSize: [25, 25] + }) + break + case 2: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point3.png'), + iconSize: [25, 25] + }) + break + case 3: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point4.png'), + iconSize: [25, 25] + }) + break + case 4: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point5.png'), + iconSize: [25, 25] + }) + break + default: + break + } + var item = L.marker([that.showlist[num].geometry.coordinates[1], that.showlist[num].geometry.coordinates[0]], { + icon: Icon, + id: that.showlist[num].properties + }).addTo(that.map) + that.markerlist.push(item) + item.on('click', function(e) { + console.log(e) + if (e.target.dragging._marker._popup) { + e.target.dragging._marker.unbindPopup() + } + var str = '
' + + '
' + + '
' + e.target.options.id.小类名称 + '
' + + '
大类：' + e.target.options.id.大类名称 + '
' + + '
小类：' + e.target.options.id.小类名称 + '
' + + '
部件编码：' + e.target.options.id.编码 + '
' + + '
权属单位：' + e.target.options.id.权属单位 + '
' + + '
详细地址：' + e.target.options.id.详细地址 + '
' + + '
' + var popup = L.popup().setContent(str) + e.target.dragging._marker.bindPopup(popup).openPopup() + e.target.dragging._marker.openPopup() + }) + } + this.cansearch = true }, drawDelete() { if (this.drawLayer) { this.drawLayer.layer.remove() } + var southWest = L.latLng(27.74, 116.06) + var northEast = L.latLng(27.77, 116.1) + this.bounds = L.latLngBounds(southWest, northEast) + this.search() }, drawSquare() { if (this.drawLayer) { @@ -193,7 +303,7 @@ } }, partsChange(val, item) { - console.log(val, item.target.defaultValue) + this.checkboxloading = true var selectItem switch (item.target.defaultValue) { case '视频监控点': @@ -224,27 +334,31 @@ if (!val) { // 隐藏底图 for (let i = 0; i < selectItem.length; i++) { this.map.removeLayer(this.parts[selectItem[i] - 1]) + for (let j = 0; j < this.layerlist.length; j++) { + if (this.layerlist[j] === selectItem[i]) { + this.layerlist.splice(j, 1) + } + } } - } else { + } else if (val) { for (let i = 0; i < selectItem.length; i++) { this.map.addLayer(this.parts[selectItem[i] - 1]) + var res = -1 + for (let j = 0; j < this.layerlist.length; j++) { + if (this.layerlist[j] === selectItem[i]) { + res = j + } + } + if (res === -1) { + this.layerlist.push(selectItem[i]) + } } } + this.checkboxloading = false }, tableclick() { this.showtable = !this.showtable }, - removemarkers() { - for (var i = 0; i < this.iconlist.length; i++) { - this.map.removeLayer(this.iconlist[i]) - } - var base = this.baselayer - this.map.eachLayer(function(layer) { - if (layer !== base[0] && layer !== base[1]) { - layer.remove() - } - }) - }, setZoom(points) { if (points.length > 0) { var maxLng = points[0][1] @@ -293,14 +407,6 @@ map.doubleClickZoom.disable() this.map = map // data上需要挂载 window.map = map - // this.baselayer.push(L.tileLayer( - // 'https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } - // ).addTo(map)) - // this.baselayer.push(L.tileLayer( - // 'https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } - // ).addTo(map)) var that = this this.map.on('pm:create', e => { if (that.drawLayer) { @@ -320,23 +426,24 @@ } } // 底图 - for (i = 0; i <= 21; i++) { - var item = { url: this.baseUrl + this.mapUrl + '/' + i.toString() } - this.maps.push(esri.featureLayer(item).addTo(map)) - } + this.maps.push(esri.dynamicMapLayer({ + url: this.baseUrl + this.mapUrl, + minZoom: 4, // 最小缩放等级 + maxZoom: 21// 最大缩放等级 + }).addTo(map)) // 部件 - for (i = 1; i <= 40; i++) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } + for (let i = 1; i <= 45; i++) { + this.layerlist.push(i) + let item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 10 } if (i === 15) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18, + item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 10, style: function(feature) { return { color: '#ff0000', opacity: 0.75, weight: 5 } } } } var layer = esri.featureLayer(item).addTo(map) layer.on('click', function(e) { - console.log(e) - console.log(e.layer.feature.properties) + // console.log(e) var str = '
' + '
' + '
' + e.layer.feature.properties.小类名称 + '
' + @@ -352,13 +459,18 @@ }) this.parts.push(layer) } + this.map.on('pm:create', e => { + // console.log(e) + this.bounds = e.layer._bounds + this.search() + }) this.map.setZoom(15) }, handleCurrentChange(val) { - console.log(val, this.searchlist) this.offset = val var num = 5 * val >= this.searchlist.length ? this.searchlist.length : 5 * val this.showlist = this.searchlist.slice(5 * (val - 1), num) + this.drawIcon() } } } @@ -378,11 +490,11 @@ $tableTitleHeight:35px; .leaflet_container{ width: 100%; - height: 85vh; + height: 84vh; } .search-total{ background-color: white; width: 300px;height: 35px; - margin-top: 10px;border: 1px solid #DCDFE6; + margin-top: 6px;border: 1px solid #DCDFE6; padding-left: 15px;color: #409eff; padding-top: 8px; font-size: 13px; diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/src/router/modules/map.js b/src/router/modules/map.js index 5c026bd..e968017 100644 --- a/src/router/modules/map.js +++ b/src/router/modules/map.js @@ -59,7 +59,7 @@ path: '/mapSearch', name: 'MapSearch', component: () => import('@/views/overview/mapSearch'), - meta: { title: '要素查询', icon: '', permission: ['/mapSearch'], keepAlive: true } + meta: { title: '地图查询', icon: '', permission: ['/mapSearch'], keepAlive: true } } ] }, { @@ -81,4 +81,27 @@ meta: { title: '服务地址', icon: '', permission: ['/mapServer'], keepAlive: true } } ] +}, { + path: 'addressSearch', + component: Layout, + redirect: '/addressSearch', + name: 'AddressSearch', + alwaysShow: true, + meta: { + title: '地址查询', + icon: 'icon-config' // 图标 + }, + children: [ + { + path: '/mapAddress', + name: 'MapAddress', + component: () => import('@/views/overview/mapSearch'), + meta: { title: '地图查询', icon: '' } + }, { + path: '/listSearch', + name: 'ListSearch', + component: () => import('@/views/address/address'), + meta: { title: '列表查询', icon: '' } + } + ] }] diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js index 1f4fa38..fc603f5 100644 --- a/src/utils/baseConfig.js +++ b/src/utils/baseConfig.js @@ -1,5 +1,5 @@ const project = { - title: '后台管理系统前端基础框架' + title: '基础资源子系统' } export function getProject() { return project diff --git a/src/views/address/address.vue b/src/views/address/address.vue new file mode 100644 index 0000000..ee41dea --- /dev/null +++ b/src/views/address/address.vue @@ -0,0 +1,105 @@ + + + + + diff --git a/src/views/overview/mapSearch.vue b/src/views/overview/mapSearch.vue index b051fa1..750be39 100644 --- a/src/views/overview/mapSearch.vue +++ b/src/views/overview/mapSearch.vue @@ -18,13 +18,13 @@ 图层 - - {{ parts }} + + {{ parts }}
- +
共找到 {{ searchlist.length }} 条个查询结果 @@ -38,19 +38,20 @@
{{ scope.$index + 1 }}
- 名称：{{ scope.row.小类名称 }} - 编码：{{ scope.row.编码 }} - 地址：{{ scope.row.编码 }} + 名称：{{ scope.row.properties.小类名称 }} + 编码：{{ scope.row.properties.编码 }} + 地址：{{ scope.row.properties.OBJECTID }} @@ -68,9 +69,9 @@ const sewageHole = [37] const video = [35] const lamp = [1, 3, 4, 22, 25, 34] -const toilet = [12, 13] +const toilet = [12, 13, 41] const garbage = [24] -const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40] +const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40, 42, 43, 44, 45] export default { name: 'MapSearch', data() { @@ -80,61 +81,30 @@ offset: 1, btnList: false, listLoading: false, // 加载动画 - TianDiTu: { - Normal: { - Map: 'https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Satellite: { - Map: 'https://t{s}.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t{s}.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Terrain: { - Map: 'https://t{s}.tianditu.gov.cn/ter_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ter&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t{s}.tianditu.gov.cn/cta_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cta&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] - }, + showlist: [], // 列表展示项 + checkboxloading: false, + list: [], // url列表 + searchlist: [], + cansearch: true, + layerlist: [], map: null, + bounds: null, showtable: true, isShow: false, partsOptions: ['网格', '商户', '视频监控点', '路灯杆和灯箱', '雨水井盖', '污水井盖', '公共厕所', '垃圾箱', '其他部件'], selectParts: ['底图', '网格', '商户', '视频监控点', '路灯杆和灯箱', '雨水井盖', '污水井盖', '公共厕所', '垃圾箱', '其他部件'], - showlist: [], - searchlist: [ - { 编码: 11111, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 22222, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 3333, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 4444, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 55555, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 666, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 777, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 888, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 999, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 11111, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 2222, 小类名称: '雨水井盖', 地址: '海淀区' }], listQuery: { offset: 1, limit: 15 }, // 筛选条件 - list: [], maps: [], parts: [], baseUrl: '', partsUrl: '', mapUrl: '', multipleSelection: [], // 多选选中项 - iconlist: [], baselayer: [], - caselist: [], // 路灯（map） - statisticNum: { - work: 0, - todayCase: 0, - allCase: 0, - merchant: 0, - parts: 0 - }, - status: { - register: 0, - dispatch: 0, - disposal: 0, - disposaling: 0 - } + markerlist: [] } }, destroyed() { @@ -142,6 +112,9 @@ this.socket.close() }, mounted() { + var southWest = L.latLng(27.74, 116.06) + var northEast = L.latLng(27.77, 116.1) + this.bounds = L.latLngBounds(southWest, northEast) window.addEventListener('click', this.handleKeyup, true) this.init() }, @@ -151,15 +124,152 @@ this.btnList = false } }, + addPointsToMap(results) { + if (!results.hasOwnProperty('features') || + results.features.length === 0) { + return // no features, something went wrong + } + var features = results.features + console.log(features) + var feature + var items = [] + for (var i = 0; i < features.length; i++) { + var symbol11 = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0, 0, 255, 0.35]), 1), new dojo.Color([125, 125, 125, 0.35])) + feature = features[i] + feature.setSymbol(symbol11) + this.map.graphics.add(feature) + items.push(feature.attributes) + } + this.searchlist = items + }, search() { - this.offset = 1 - this.showlist = this.searchlist.slice(0, 5) - this.isShow = true + this.cansearch = false + var that = this + this.searchlist = [] + for (let i = 0; i < this.layerlist.length; i++) { + var str = ['编码', '小类名称', '大类名称'] + var query = esri.query({ + url: this.baseUrl + this.partsUrl + '/' + this.layerlist[i].toString() + }) + if (this.keyword === '') { + query.where('1=1') + query.within(this.bounds) + query.run(function(error, featureCollection, response) { + if (error) { + console.log(error) + return + } + for (let j = featureCollection.features.length - 1; j >= 0; j--) { + that.searchlist.push(featureCollection.features[j]) + } + if (i === that.layerlist.length - 1) { + that.offset = 1 + that.showlist = that.searchlist.slice(0, 5) + that.isShow = true + that.drawIcon() + } + console.log(featureCollection.features) + }) + } else { + for (let j = 0; j < str.length; j++) { + query.where(str[j] + " like '%" + this.keyword + "%'") + query.within(this.bounds) + query.run(function(error, featureCollection, response) { + if (error) { + console.log(error) + return + } + for (let k = featureCollection.features.length - 1; k >= 0; k--) { + that.searchlist.push(featureCollection.features[k]) + } + console.log(featureCollection.features) + if (i === that.layerlist.length - 1) { + that.offset = 1 + that.showlist = that.searchlist.slice(0, 5) + that.isShow = true + that.drawIcon() + } + }) + } + } + } + }, + drawIcon() { + var that = this + for (var i = 0; i < that.markerlist.length; i++) { + that.map.removeLayer(that.markerlist[i]) + } + that.markerlist = [] + for (let num = 0; num < that.showlist.length; num++) { + var Icon + switch (num) { + case 0: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point1.png'), + iconSize: [25, 25] + }) + break + case 1: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point2.png'), + iconSize: [25, 25] + }) + break + case 2: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point3.png'), + iconSize: [25, 25] + }) + break + case 3: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point4.png'), + iconSize: [25, 25] + }) + break + case 4: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point5.png'), + iconSize: [25, 25] + }) + break + default: + break + } + var item = L.marker([that.showlist[num].geometry.coordinates[1], that.showlist[num].geometry.coordinates[0]], { + icon: Icon, + id: that.showlist[num].properties + }).addTo(that.map) + that.markerlist.push(item) + item.on('click', function(e) { + console.log(e) + if (e.target.dragging._marker._popup) { + e.target.dragging._marker.unbindPopup() + } + var str = '
' + + '
' + + '
' + e.target.options.id.小类名称 + '
' + + '
大类：' + e.target.options.id.大类名称 + '
' + + '
小类：' + e.target.options.id.小类名称 + '
' + + '
部件编码：' + e.target.options.id.编码 + '
' + + '
权属单位：' + e.target.options.id.权属单位 + '
' + + '
详细地址：' + e.target.options.id.详细地址 + '
' + + '
' + var popup = L.popup().setContent(str) + e.target.dragging._marker.bindPopup(popup).openPopup() + e.target.dragging._marker.openPopup() + }) + } + this.cansearch = true }, drawDelete() { if (this.drawLayer) { this.drawLayer.layer.remove() } + var southWest = L.latLng(27.74, 116.06) + var northEast = L.latLng(27.77, 116.1) + this.bounds = L.latLngBounds(southWest, northEast) + this.search() }, drawSquare() { if (this.drawLayer) { @@ -193,7 +303,7 @@ } }, partsChange(val, item) { - console.log(val, item.target.defaultValue) + this.checkboxloading = true var selectItem switch (item.target.defaultValue) { case '视频监控点': @@ -224,27 +334,31 @@ if (!val) { // 隐藏底图 for (let i = 0; i < selectItem.length; i++) { this.map.removeLayer(this.parts[selectItem[i] - 1]) + for (let j = 0; j < this.layerlist.length; j++) { + if (this.layerlist[j] === selectItem[i]) { + this.layerlist.splice(j, 1) + } + } } - } else { + } else if (val) { for (let i = 0; i < selectItem.length; i++) { this.map.addLayer(this.parts[selectItem[i] - 1]) + var res = -1 + for (let j = 0; j < this.layerlist.length; j++) { + if (this.layerlist[j] === selectItem[i]) { + res = j + } + } + if (res === -1) { + this.layerlist.push(selectItem[i]) + } } } + this.checkboxloading = false }, tableclick() { this.showtable = !this.showtable }, - removemarkers() { - for (var i = 0; i < this.iconlist.length; i++) { - this.map.removeLayer(this.iconlist[i]) - } - var base = this.baselayer - this.map.eachLayer(function(layer) { - if (layer !== base[0] && layer !== base[1]) { - layer.remove() - } - }) - }, setZoom(points) { if (points.length > 0) { var maxLng = points[0][1] @@ -293,14 +407,6 @@ map.doubleClickZoom.disable() this.map = map // data上需要挂载 window.map = map - // this.baselayer.push(L.tileLayer( - // 'https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } - // ).addTo(map)) - // this.baselayer.push(L.tileLayer( - // 'https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } - // ).addTo(map)) var that = this this.map.on('pm:create', e => { if (that.drawLayer) { @@ -320,23 +426,24 @@ } } // 底图 - for (i = 0; i <= 21; i++) { - var item = { url: this.baseUrl + this.mapUrl + '/' + i.toString() } - this.maps.push(esri.featureLayer(item).addTo(map)) - } + this.maps.push(esri.dynamicMapLayer({ + url: this.baseUrl + this.mapUrl, + minZoom: 4, // 最小缩放等级 + maxZoom: 21// 最大缩放等级 + }).addTo(map)) // 部件 - for (i = 1; i <= 40; i++) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } + for (let i = 1; i <= 45; i++) { + this.layerlist.push(i) + let item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 10 } if (i === 15) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18, + item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 10, style: function(feature) { return { color: '#ff0000', opacity: 0.75, weight: 5 } } } } var layer = esri.featureLayer(item).addTo(map) layer.on('click', function(e) { - console.log(e) - console.log(e.layer.feature.properties) + // console.log(e) var str = '
' + '
' + '
' + e.layer.feature.properties.小类名称 + '
' + @@ -352,13 +459,18 @@ }) this.parts.push(layer) } + this.map.on('pm:create', e => { + // console.log(e) + this.bounds = e.layer._bounds + this.search() + }) this.map.setZoom(15) }, handleCurrentChange(val) { - console.log(val, this.searchlist) this.offset = val var num = 5 * val >= this.searchlist.length ? this.searchlist.length : 5 * val this.showlist = this.searchlist.slice(5 * (val - 1), num) + this.drawIcon() } } } @@ -378,11 +490,11 @@ $tableTitleHeight:35px; .leaflet_container{ width: 100%; - height: 85vh; + height: 84vh; } .search-total{ background-color: white; width: 300px;height: 35px; - margin-top: 10px;border: 1px solid #DCDFE6; + margin-top: 6px;border: 1px solid #DCDFE6; padding-left: 15px;color: #409eff; padding-top: 8px; font-size: 13px; diff --git a/src/views/overview/overview.vue b/src/views/overview/overview.vue index 7af6e16..08d42b9 100644 --- a/src/views/overview/overview.vue +++ b/src/views/overview/overview.vue @@ -19,9 +19,9 @@ const sewageHole = [37] const video = [35] const lamp = [1, 3, 4, 22, 25, 34] -const toilet = [12, 13] +const toilet = [12, 13, 41] const garbage = [24] -const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40] +const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40, 42, 43, 44, 45] export default { name: 'Overview', data() { @@ -57,22 +57,7 @@ partsUrl: '', mapUrl: '', multipleSelection: [], // 多选选中项 - iconlist: [], - baselayer: [], - caselist: [], // 路灯（map） - statisticNum: { - work: 0, - todayCase: 0, - allCase: 0, - merchant: 0, - parts: 0 - }, - status: { - register: 0, - dispatch: 0, - disposal: 0, - disposaling: 0 - } + baselayer: [] } }, mounted() { @@ -132,17 +117,6 @@ tableclick() { this.showtable = !this.showtable }, - removemarkers() { - for (var i = 0; i < this.iconlist.length; i++) { - this.map.removeLayer(this.iconlist[i]) - } - var base = this.baselayer - this.map.eachLayer(function(layer) { - if (layer !== base[0] && layer !== base[1]) { - layer.remove() - } - }) - }, setZoom(points) { if (points.length > 0) { var maxLng = points[0][1] @@ -211,14 +185,14 @@ // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } // ).addTo(map)) - // 底图 - for (i = 0; i <= 21; i++) { - var item = { url: this.baseUrl + this.mapUrl + '/' + i.toString() } - this.maps.push(esri.featureLayer(item).addTo(map)) - } + this.maps.push(esri.dynamicMapLayer({ + url: this.baseUrl + this.mapUrl, + minZoom: 4, // 最小缩放等级 + maxZoom: 21// 最大缩放等级 + }).addTo(map)) // 部件 - for (i = 1; i <= 40; i++) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } + for (let i = 1; i <= 45; i++) { + let item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } if (i === 15) { item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18, style: function(feature) { diff --git a/README.md b/README.md index 7758dc6..e2b5201 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,61 @@ +<<<<<<< HEAD +# 城管基础资源子系统前端 + +> 城管基础资源子系统WEB前端，系统管理模块基于基础权限管理的基础框架 ，整个系统模块包括资源管理、角色管理、组织结构管理、用户管理、日志管理。 + +> 使用leaflet加载arcgis地图 + + +## 安装前提 + +1. 安装nodejs + +去[nodejs官网](https://nodejs.org/zh-cn/)下载安装包 + + +安装完成之后，在cmd中检查Node.js版本，输出版本号则表示安装成功 +``` +node --version +``` + +## 安装步骤 + +```bash +# 克隆项目 +git clone http://192.168.0.203:8080/gitbucket/root/smartwell_front + +# 安装依赖 +npm install + +# 建议不要用cnpm 安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 +npm install --registry=https://registry.npm.taobao.org + +# Serve with hot reload at localhost:9528 +npm run dev + +# Build for production with minification +npm run build + +# Build for production and view the bundle analyzer report +npm run build --report +``` + +## 界面 + +![demo](http://192.168.0.203:8080/gitbucket/root/BaseFrontEnd/tree/master/static/images/demo.gif) + +## 浏览器支持情况 + +主流浏览器和IE 10+. + +| [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | +| --------- | --------- | --------- | --------- | +| IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions + +## License + +Copyright (c) 2019-present WangXiaoying +======= smartcity_map_front =============== @@ -10,3 +68,4 @@ npm install esri-leaflet-renderers npm install leaflet.pm +>>>>>>> 62e2cbd45b21f3b3de9dba282151fdf455d08506 diff --git a/package.json b/package.json index d3b9d3b..c7871ba 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "babel-polyfill": "^6.26.0", "echarts": "^4.2.1", "element-ui": "2.13.0", + "esri": "0.0.1-security", "esri-leaflet": "^3.0.1", "esri-leaflet-renderers": "^2.1.2", + "esri-loader": "^3.0.0", "event-source-polyfill": "^1.0.5", "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", diff --git a/src/api/server.js b/src/api/server.js index 51c3f45..25a3d1e 100644 --- a/src/api/server.js +++ b/src/api/server.js @@ -15,3 +15,10 @@ params: params }) } +export function merchantListPage(params) { + return request({ + url: '/shop/merchant/listPage', + method: 'get', + params + }) +} diff --git a/src/assets/global_images/point1.png b/src/assets/global_images/point1.png new file mode 100644 index 0000000..28a9723 --- /dev/null +++ b/src/assets/global_images/point1.png Binary files differ diff --git a/src/assets/global_images/point2.png b/src/assets/global_images/point2.png new file mode 100644 index 0000000..f295fd1 --- /dev/null +++ b/src/assets/global_images/point2.png Binary files differ diff --git a/src/assets/global_images/point3.png b/src/assets/global_images/point3.png new file mode 100644 index 0000000..2815e21 --- /dev/null +++ b/src/assets/global_images/point3.png Binary files differ diff --git a/src/assets/global_images/point4.png b/src/assets/global_images/point4.png new file mode 100644 index 0000000..ddf5eac --- /dev/null +++ b/src/assets/global_images/point4.png Binary files differ diff --git a/src/assets/global_images/point5.png b/src/assets/global_images/point5.png new file mode 100644 index 0000000..5ea0f1a --- /dev/null +++ b/src/assets/global_images/point5.png Binary files differ diff --git a/src/router/modules/map.js b/src/router/modules/map.js index 5c026bd..e968017 100644 --- a/src/router/modules/map.js +++ b/src/router/modules/map.js @@ -59,7 +59,7 @@ path: '/mapSearch', name: 'MapSearch', component: () => import('@/views/overview/mapSearch'), - meta: { title: '要素查询', icon: '', permission: ['/mapSearch'], keepAlive: true } + meta: { title: '地图查询', icon: '', permission: ['/mapSearch'], keepAlive: true } } ] }, { @@ -81,4 +81,27 @@ meta: { title: '服务地址', icon: '', permission: ['/mapServer'], keepAlive: true } } ] +}, { + path: 'addressSearch', + component: Layout, + redirect: '/addressSearch', + name: 'AddressSearch', + alwaysShow: true, + meta: { + title: '地址查询', + icon: 'icon-config' // 图标 + }, + children: [ + { + path: '/mapAddress', + name: 'MapAddress', + component: () => import('@/views/overview/mapSearch'), + meta: { title: '地图查询', icon: '' } + }, { + path: '/listSearch', + name: 'ListSearch', + component: () => import('@/views/address/address'), + meta: { title: '列表查询', icon: '' } + } + ] }] diff --git a/src/utils/baseConfig.js b/src/utils/baseConfig.js index 1f4fa38..fc603f5 100644 --- a/src/utils/baseConfig.js +++ b/src/utils/baseConfig.js @@ -1,5 +1,5 @@ const project = { - title: '后台管理系统前端基础框架' + title: '基础资源子系统' } export function getProject() { return project diff --git a/src/views/address/address.vue b/src/views/address/address.vue new file mode 100644 index 0000000..ee41dea --- /dev/null +++ b/src/views/address/address.vue @@ -0,0 +1,105 @@ + + + + + diff --git a/src/views/overview/mapSearch.vue b/src/views/overview/mapSearch.vue index b051fa1..750be39 100644 --- a/src/views/overview/mapSearch.vue +++ b/src/views/overview/mapSearch.vue @@ -18,13 +18,13 @@ 图层 - - {{ parts }} + + {{ parts }}
- +
共找到 {{ searchlist.length }} 条个查询结果 @@ -38,19 +38,20 @@
{{ scope.$index + 1 }}
- 名称：{{ scope.row.小类名称 }} - 编码：{{ scope.row.编码 }} - 地址：{{ scope.row.编码 }} + 名称：{{ scope.row.properties.小类名称 }} + 编码：{{ scope.row.properties.编码 }} + 地址：{{ scope.row.properties.OBJECTID }} @@ -68,9 +69,9 @@ const sewageHole = [37] const video = [35] const lamp = [1, 3, 4, 22, 25, 34] -const toilet = [12, 13] +const toilet = [12, 13, 41] const garbage = [24] -const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40] +const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40, 42, 43, 44, 45] export default { name: 'MapSearch', data() { @@ -80,61 +81,30 @@ offset: 1, btnList: false, listLoading: false, // 加载动画 - TianDiTu: { - Normal: { - Map: 'https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Satellite: { - Map: 'https://t{s}.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t{s}.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Terrain: { - Map: 'https://t{s}.tianditu.gov.cn/ter_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ter&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - Annotion: 'https://t{s}.tianditu.gov.cn/cta_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cta&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8' - }, - Subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] - }, + showlist: [], // 列表展示项 + checkboxloading: false, + list: [], // url列表 + searchlist: [], + cansearch: true, + layerlist: [], map: null, + bounds: null, showtable: true, isShow: false, partsOptions: ['网格', '商户', '视频监控点', '路灯杆和灯箱', '雨水井盖', '污水井盖', '公共厕所', '垃圾箱', '其他部件'], selectParts: ['底图', '网格', '商户', '视频监控点', '路灯杆和灯箱', '雨水井盖', '污水井盖', '公共厕所', '垃圾箱', '其他部件'], - showlist: [], - searchlist: [ - { 编码: 11111, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 22222, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 3333, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 4444, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 55555, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 666, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 777, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 888, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 999, 小类名称: '视频监控点', 地址: '江西省福州市' }, { 编码: 11111, 小类名称: '视频监控点', 地址: '江西省福州市' }, - { 编码: 2222, 小类名称: '雨水井盖', 地址: '海淀区' }], listQuery: { offset: 1, limit: 15 }, // 筛选条件 - list: [], maps: [], parts: [], baseUrl: '', partsUrl: '', mapUrl: '', multipleSelection: [], // 多选选中项 - iconlist: [], baselayer: [], - caselist: [], // 路灯（map） - statisticNum: { - work: 0, - todayCase: 0, - allCase: 0, - merchant: 0, - parts: 0 - }, - status: { - register: 0, - dispatch: 0, - disposal: 0, - disposaling: 0 - } + markerlist: [] } }, destroyed() { @@ -142,6 +112,9 @@ this.socket.close() }, mounted() { + var southWest = L.latLng(27.74, 116.06) + var northEast = L.latLng(27.77, 116.1) + this.bounds = L.latLngBounds(southWest, northEast) window.addEventListener('click', this.handleKeyup, true) this.init() }, @@ -151,15 +124,152 @@ this.btnList = false } }, + addPointsToMap(results) { + if (!results.hasOwnProperty('features') || + results.features.length === 0) { + return // no features, something went wrong + } + var features = results.features + console.log(features) + var feature + var items = [] + for (var i = 0; i < features.length; i++) { + var symbol11 = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0, 0, 255, 0.35]), 1), new dojo.Color([125, 125, 125, 0.35])) + feature = features[i] + feature.setSymbol(symbol11) + this.map.graphics.add(feature) + items.push(feature.attributes) + } + this.searchlist = items + }, search() { - this.offset = 1 - this.showlist = this.searchlist.slice(0, 5) - this.isShow = true + this.cansearch = false + var that = this + this.searchlist = [] + for (let i = 0; i < this.layerlist.length; i++) { + var str = ['编码', '小类名称', '大类名称'] + var query = esri.query({ + url: this.baseUrl + this.partsUrl + '/' + this.layerlist[i].toString() + }) + if (this.keyword === '') { + query.where('1=1') + query.within(this.bounds) + query.run(function(error, featureCollection, response) { + if (error) { + console.log(error) + return + } + for (let j = featureCollection.features.length - 1; j >= 0; j--) { + that.searchlist.push(featureCollection.features[j]) + } + if (i === that.layerlist.length - 1) { + that.offset = 1 + that.showlist = that.searchlist.slice(0, 5) + that.isShow = true + that.drawIcon() + } + console.log(featureCollection.features) + }) + } else { + for (let j = 0; j < str.length; j++) { + query.where(str[j] + " like '%" + this.keyword + "%'") + query.within(this.bounds) + query.run(function(error, featureCollection, response) { + if (error) { + console.log(error) + return + } + for (let k = featureCollection.features.length - 1; k >= 0; k--) { + that.searchlist.push(featureCollection.features[k]) + } + console.log(featureCollection.features) + if (i === that.layerlist.length - 1) { + that.offset = 1 + that.showlist = that.searchlist.slice(0, 5) + that.isShow = true + that.drawIcon() + } + }) + } + } + } + }, + drawIcon() { + var that = this + for (var i = 0; i < that.markerlist.length; i++) { + that.map.removeLayer(that.markerlist[i]) + } + that.markerlist = [] + for (let num = 0; num < that.showlist.length; num++) { + var Icon + switch (num) { + case 0: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point1.png'), + iconSize: [25, 25] + }) + break + case 1: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point2.png'), + iconSize: [25, 25] + }) + break + case 2: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point3.png'), + iconSize: [25, 25] + }) + break + case 3: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point4.png'), + iconSize: [25, 25] + }) + break + case 4: + Icon = L.icon({ + iconUrl: require('../../assets/global_images/point5.png'), + iconSize: [25, 25] + }) + break + default: + break + } + var item = L.marker([that.showlist[num].geometry.coordinates[1], that.showlist[num].geometry.coordinates[0]], { + icon: Icon, + id: that.showlist[num].properties + }).addTo(that.map) + that.markerlist.push(item) + item.on('click', function(e) { + console.log(e) + if (e.target.dragging._marker._popup) { + e.target.dragging._marker.unbindPopup() + } + var str = '
' + + '
' + + '
' + e.target.options.id.小类名称 + '
' + + '
大类：' + e.target.options.id.大类名称 + '
' + + '
小类：' + e.target.options.id.小类名称 + '
' + + '
部件编码：' + e.target.options.id.编码 + '
' + + '
权属单位：' + e.target.options.id.权属单位 + '
' + + '
详细地址：' + e.target.options.id.详细地址 + '
' + + '
' + var popup = L.popup().setContent(str) + e.target.dragging._marker.bindPopup(popup).openPopup() + e.target.dragging._marker.openPopup() + }) + } + this.cansearch = true }, drawDelete() { if (this.drawLayer) { this.drawLayer.layer.remove() } + var southWest = L.latLng(27.74, 116.06) + var northEast = L.latLng(27.77, 116.1) + this.bounds = L.latLngBounds(southWest, northEast) + this.search() }, drawSquare() { if (this.drawLayer) { @@ -193,7 +303,7 @@ } }, partsChange(val, item) { - console.log(val, item.target.defaultValue) + this.checkboxloading = true var selectItem switch (item.target.defaultValue) { case '视频监控点': @@ -224,27 +334,31 @@ if (!val) { // 隐藏底图 for (let i = 0; i < selectItem.length; i++) { this.map.removeLayer(this.parts[selectItem[i] - 1]) + for (let j = 0; j < this.layerlist.length; j++) { + if (this.layerlist[j] === selectItem[i]) { + this.layerlist.splice(j, 1) + } + } } - } else { + } else if (val) { for (let i = 0; i < selectItem.length; i++) { this.map.addLayer(this.parts[selectItem[i] - 1]) + var res = -1 + for (let j = 0; j < this.layerlist.length; j++) { + if (this.layerlist[j] === selectItem[i]) { + res = j + } + } + if (res === -1) { + this.layerlist.push(selectItem[i]) + } } } + this.checkboxloading = false }, tableclick() { this.showtable = !this.showtable }, - removemarkers() { - for (var i = 0; i < this.iconlist.length; i++) { - this.map.removeLayer(this.iconlist[i]) - } - var base = this.baselayer - this.map.eachLayer(function(layer) { - if (layer !== base[0] && layer !== base[1]) { - layer.remove() - } - }) - }, setZoom(points) { if (points.length > 0) { var maxLng = points[0][1] @@ -293,14 +407,6 @@ map.doubleClickZoom.disable() this.map = map // data上需要挂载 window.map = map - // this.baselayer.push(L.tileLayer( - // 'https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } - // ).addTo(map)) - // this.baselayer.push(L.tileLayer( - // 'https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=216ee92889e17ab1b083fae665d522b8', - // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } - // ).addTo(map)) var that = this this.map.on('pm:create', e => { if (that.drawLayer) { @@ -320,23 +426,24 @@ } } // 底图 - for (i = 0; i <= 21; i++) { - var item = { url: this.baseUrl + this.mapUrl + '/' + i.toString() } - this.maps.push(esri.featureLayer(item).addTo(map)) - } + this.maps.push(esri.dynamicMapLayer({ + url: this.baseUrl + this.mapUrl, + minZoom: 4, // 最小缩放等级 + maxZoom: 21// 最大缩放等级 + }).addTo(map)) // 部件 - for (i = 1; i <= 40; i++) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } + for (let i = 1; i <= 45; i++) { + this.layerlist.push(i) + let item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 10 } if (i === 15) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18, + item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 10, style: function(feature) { return { color: '#ff0000', opacity: 0.75, weight: 5 } } } } var layer = esri.featureLayer(item).addTo(map) layer.on('click', function(e) { - console.log(e) - console.log(e.layer.feature.properties) + // console.log(e) var str = '
' + '
' + '
' + e.layer.feature.properties.小类名称 + '
' + @@ -352,13 +459,18 @@ }) this.parts.push(layer) } + this.map.on('pm:create', e => { + // console.log(e) + this.bounds = e.layer._bounds + this.search() + }) this.map.setZoom(15) }, handleCurrentChange(val) { - console.log(val, this.searchlist) this.offset = val var num = 5 * val >= this.searchlist.length ? this.searchlist.length : 5 * val this.showlist = this.searchlist.slice(5 * (val - 1), num) + this.drawIcon() } } } @@ -378,11 +490,11 @@ $tableTitleHeight:35px; .leaflet_container{ width: 100%; - height: 85vh; + height: 84vh; } .search-total{ background-color: white; width: 300px;height: 35px; - margin-top: 10px;border: 1px solid #DCDFE6; + margin-top: 6px;border: 1px solid #DCDFE6; padding-left: 15px;color: #409eff; padding-top: 8px; font-size: 13px; diff --git a/src/views/overview/overview.vue b/src/views/overview/overview.vue index 7af6e16..08d42b9 100644 --- a/src/views/overview/overview.vue +++ b/src/views/overview/overview.vue @@ -19,9 +19,9 @@ const sewageHole = [37] const video = [35] const lamp = [1, 3, 4, 22, 25, 34] -const toilet = [12, 13] +const toilet = [12, 13, 41] const garbage = [24] -const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40] +const othersParts = [2, 5, 6, 7, 8, 9, 10, 11, 15, 16, 17, 18, 19, 20, 21, 23, 26, 27, 28, 29, 30, 31, 32, 33, 35, 36, 38, 39, 40, 42, 43, 44, 45] export default { name: 'Overview', data() { @@ -57,22 +57,7 @@ partsUrl: '', mapUrl: '', multipleSelection: [], // 多选选中项 - iconlist: [], - baselayer: [], - caselist: [], // 路灯（map） - statisticNum: { - work: 0, - todayCase: 0, - allCase: 0, - merchant: 0, - parts: 0 - }, - status: { - register: 0, - dispatch: 0, - disposal: 0, - disposaling: 0 - } + baselayer: [] } }, mounted() { @@ -132,17 +117,6 @@ tableclick() { this.showtable = !this.showtable }, - removemarkers() { - for (var i = 0; i < this.iconlist.length; i++) { - this.map.removeLayer(this.iconlist[i]) - } - var base = this.baselayer - this.map.eachLayer(function(layer) { - if (layer !== base[0] && layer !== base[1]) { - layer.remove() - } - }) - }, setZoom(points) { if (points.length > 0) { var maxLng = points[0][1] @@ -211,14 +185,14 @@ // { subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'] } // ).addTo(map)) - // 底图 - for (i = 0; i <= 21; i++) { - var item = { url: this.baseUrl + this.mapUrl + '/' + i.toString() } - this.maps.push(esri.featureLayer(item).addTo(map)) - } + this.maps.push(esri.dynamicMapLayer({ + url: this.baseUrl + this.mapUrl, + minZoom: 4, // 最小缩放等级 + maxZoom: 21// 最大缩放等级 + }).addTo(map)) // 部件 - for (i = 1; i <= 40; i++) { - item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } + for (let i = 1; i <= 45; i++) { + let item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18 } if (i === 15) { item = { url: this.baseUrl + this.partsUrl + '/' + i.toString(), minZoom: 18, style: function(feature) { diff --git a/static/project.config.json b/static/project.config.json index f8cc6fe..a2cede2 100644 --- a/static/project.config.json +++ b/static/project.config.json @@ -1,5 +1,5 @@ { - "title": "基础资源系统", + "title": "基础资源子系统", "baseUrl": "http://111.198.10.15:11409/", "mainPage": "http://111.198.10.15:11404/dcms/", "singleSys": true,