diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + + diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + + diff --git a/src/components/title/Title2.vue b/src/components/title/Title2.vue new file mode 100644 index 0000000..b8324a0 --- /dev/null +++ b/src/components/title/Title2.vue @@ -0,0 +1,62 @@ + + + + diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + + diff --git a/src/components/title/Title2.vue b/src/components/title/Title2.vue new file mode 100644 index 0000000..b8324a0 --- /dev/null +++ b/src/components/title/Title2.vue @@ -0,0 +1,62 @@ + + + + diff --git a/src/views/screen/mainComponents/bizStatistic.vue b/src/views/screen/mainComponents/bizStatistic.vue index 8c64313..637f439 100644 --- a/src/views/screen/mainComponents/bizStatistic.vue +++ b/src/views/screen/mainComponents/bizStatistic.vue @@ -7,7 +7,7 @@ - + @@ -22,13 +22,13 @@ data(){ return { data:[ - {name:'路灯亮灯率', value:{already:34, total:100,rate:34}}, + {name:'路灯亮灯率', value:{already:34, total:100,rate:34}, color:'#009eec'}, // {name:'地下管线监测设备报警率', value:[{already:34, total:100,rate:34}]}, - {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}}, - {name:'液位监测仪', value:{already:34, total:100,rate:79}}, - {name:'有害气体监测仪', value:{already:34, total:100,rate:20}}, - {name:'噪声监测仪', value:{already:34, total:100,rate:15}}, - {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}} + {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}, color:'#9fe6b8'}, + {name:'液位监测仪', value:{already:34, total:100,rate:79}, color:'#99ccff'}, + {name:'有害气体监测仪', value:{already:34, total:100,rate:20, color:'#ffdb5c'}}, + {name:'噪声监测仪', value:{already:34, total:100,rate:15}, color:'#ff9f7f'}, + {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}, color:'#fb7293'} ] } }, diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + + diff --git a/src/components/title/Title2.vue b/src/components/title/Title2.vue new file mode 100644 index 0000000..b8324a0 --- /dev/null +++ b/src/components/title/Title2.vue @@ -0,0 +1,62 @@ + + + + diff --git a/src/views/screen/mainComponents/bizStatistic.vue b/src/views/screen/mainComponents/bizStatistic.vue index 8c64313..637f439 100644 --- a/src/views/screen/mainComponents/bizStatistic.vue +++ b/src/views/screen/mainComponents/bizStatistic.vue @@ -7,7 +7,7 @@ - + @@ -22,13 +22,13 @@ data(){ return { data:[ - {name:'路灯亮灯率', value:{already:34, total:100,rate:34}}, + {name:'路灯亮灯率', value:{already:34, total:100,rate:34}, color:'#009eec'}, // {name:'地下管线监测设备报警率', value:[{already:34, total:100,rate:34}]}, - {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}}, - {name:'液位监测仪', value:{already:34, total:100,rate:79}}, - {name:'有害气体监测仪', value:{already:34, total:100,rate:20}}, - {name:'噪声监测仪', value:{already:34, total:100,rate:15}}, - {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}} + {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}, color:'#9fe6b8'}, + {name:'液位监测仪', value:{already:34, total:100,rate:79}, color:'#99ccff'}, + {name:'有害气体监测仪', value:{already:34, total:100,rate:20, color:'#ffdb5c'}}, + {name:'噪声监测仪', value:{already:34, total:100,rate:15}, color:'#ff9f7f'}, + {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}, color:'#fb7293'} ] } }, diff --git a/src/views/screen/mainComponents/deviceAlarmHistory.vue b/src/views/screen/mainComponents/deviceAlarmHistory.vue index e715459..e160447 100644 --- a/src/views/screen/mainComponents/deviceAlarmHistory.vue +++ b/src/views/screen/mainComponents/deviceAlarmHistory.vue @@ -4,9 +4,16 @@ * @Date: 2021-07-14 16:53:48 --> @@ -19,12 +26,14 @@ components: {GradientLineChart, Container1}, data(){ return { + currentTab:'井盖状态监测仪', + tabList:['井盖状态监测仪','液位监测仪','有害气体监测仪','消防栓防盗水监测仪'], xAxisData:['周一','周二','周三','周四','周五','周六','周日'], seriesData:[ - {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'}, - {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'}, - {name:'有害气体',data:[3, 2, 1, 2, 0, 2, 1],color:'248,211,81'}, - {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'}, + // {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'}, + // {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'}, + {name:'有害气体',data:[120, 252, 101, 134, 290, 230, 110],color:'0,255,204'}, + // {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'}, ] } }, @@ -32,5 +41,41 @@ diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + + diff --git a/src/components/title/Title2.vue b/src/components/title/Title2.vue new file mode 100644 index 0000000..b8324a0 --- /dev/null +++ b/src/components/title/Title2.vue @@ -0,0 +1,62 @@ + + + + diff --git a/src/views/screen/mainComponents/bizStatistic.vue b/src/views/screen/mainComponents/bizStatistic.vue index 8c64313..637f439 100644 --- a/src/views/screen/mainComponents/bizStatistic.vue +++ b/src/views/screen/mainComponents/bizStatistic.vue @@ -7,7 +7,7 @@ - + @@ -22,13 +22,13 @@ data(){ return { data:[ - {name:'路灯亮灯率', value:{already:34, total:100,rate:34}}, + {name:'路灯亮灯率', value:{already:34, total:100,rate:34}, color:'#009eec'}, // {name:'地下管线监测设备报警率', value:[{already:34, total:100,rate:34}]}, - {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}}, - {name:'液位监测仪', value:{already:34, total:100,rate:79}}, - {name:'有害气体监测仪', value:{already:34, total:100,rate:20}}, - {name:'噪声监测仪', value:{already:34, total:100,rate:15}}, - {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}} + {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}, color:'#9fe6b8'}, + {name:'液位监测仪', value:{already:34, total:100,rate:79}, color:'#99ccff'}, + {name:'有害气体监测仪', value:{already:34, total:100,rate:20, color:'#ffdb5c'}}, + {name:'噪声监测仪', value:{already:34, total:100,rate:15}, color:'#ff9f7f'}, + {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}, color:'#fb7293'} ] } }, diff --git a/src/views/screen/mainComponents/deviceAlarmHistory.vue b/src/views/screen/mainComponents/deviceAlarmHistory.vue index e715459..e160447 100644 --- a/src/views/screen/mainComponents/deviceAlarmHistory.vue +++ b/src/views/screen/mainComponents/deviceAlarmHistory.vue @@ -4,9 +4,16 @@ * @Date: 2021-07-14 16:53:48 --> @@ -19,12 +26,14 @@ components: {GradientLineChart, Container1}, data(){ return { + currentTab:'井盖状态监测仪', + tabList:['井盖状态监测仪','液位监测仪','有害气体监测仪','消防栓防盗水监测仪'], xAxisData:['周一','周二','周三','周四','周五','周六','周日'], seriesData:[ - {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'}, - {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'}, - {name:'有害气体',data:[3, 2, 1, 2, 0, 2, 1],color:'248,211,81'}, - {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'}, + // {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'}, + // {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'}, + {name:'有害气体',data:[120, 252, 101, 134, 290, 230, 110],color:'0,255,204'}, + // {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'}, ] } }, @@ -32,5 +41,41 @@ diff --git a/src/views/screen/mainComponents/deviceAlarmRank.vue b/src/views/screen/mainComponents/deviceAlarmRank.vue index 213e240..021d404 100644 --- a/src/views/screen/mainComponents/deviceAlarmRank.vue +++ b/src/views/screen/mainComponents/deviceAlarmRank.vue @@ -5,8 +5,8 @@ --> @@ -27,8 +27,8 @@ {name: "消防栓防盗水监测仪", value: 80}, {name: "噪声监测仪", value: 80} ], - carousel: "single", - unit: "次" + unit: "次", + showValue: true }, } }, diff --git a/package.json b/package.json index ef441df..fcd5682 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "1.0.1", "private": true, "scripts": { - "serve": "vue-cli-service serve", + "serve": "vue-cli-service serve --open", "build": "vue-cli-service build --no-clean", "lint": "vue-cli-service lint" }, @@ -16,6 +16,7 @@ "core-js": "^3.6.4", "echarts": "^4.6.0", "js-cookie": "^2.2.1", + "leaflet": "^1.7.1", "vue": "^2.6.11", "vue-awesome": "^4.0.2", "vue-router": "^3.1.5", @@ -51,7 +52,8 @@ "semi": [ "warn", "never" - ] + ], + "no-debugger": ["off"] } }, "browserslist": [ diff --git a/public/static/project.config.json b/public/static/project.config.json index 8a5913e..cec4541 100644 --- a/public/static/project.config.json +++ b/public/static/project.config.json @@ -2,15 +2,15 @@ "title": "数据可视化", "baseUrl": "http://111.198.10.15:11409/", "singleSys": true, - "city":"北京市", + "city":"三溪小镇", "mapType":[ - "gaode" + "leaflet" ], - "center":[39.9, 116.4], - "zoom":15, - "mapUrl":"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", - "labelUrl":"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", - "satelliteUrl":"http://223.82.47.232:11502/crtiles005/{z}/{x}/{y}.png", + "center":[22.289656,113.497393], + "zoom":14, + "mapUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "labelUrl":"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=adbdd8e08c292f6cb4e3f0289f7d0447", + "satelliteUrl":"http://t0.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=adbdd8e08c292f6cb4e3f0289f7d0447", "defaultRefresh": 60000, "status": "online" } diff --git a/src/assets/img/main_screen/pipe-alarm.png b/src/assets/img/main_screen/pipe-alarm.png new file mode 100644 index 0000000..c1eb5b0 --- /dev/null +++ b/src/assets/img/main_screen/pipe-alarm.png Binary files differ diff --git a/src/assets/img/main_screen/pipe-device.png b/src/assets/img/main_screen/pipe-device.png new file mode 100644 index 0000000..ee2bb62 --- /dev/null +++ b/src/assets/img/main_screen/pipe-device.png Binary files differ diff --git a/src/assets/img/map/little-circle.png b/src/assets/img/map/little-circle.png new file mode 100644 index 0000000..7eb6e29 --- /dev/null +++ b/src/assets/img/map/little-circle.png Binary files differ diff --git a/src/assets/img/map/mapBlu.png b/src/assets/img/map/mapBlu.png new file mode 100644 index 0000000..f9162a8 --- /dev/null +++ b/src/assets/img/map/mapBlu.png Binary files differ diff --git a/src/assets/img/map/mapGray.png b/src/assets/img/map/mapGray.png new file mode 100644 index 0000000..ac3685e --- /dev/null +++ b/src/assets/img/map/mapGray.png Binary files differ diff --git a/src/assets/img/map/mapVector.png b/src/assets/img/map/mapVector.png new file mode 100644 index 0000000..831719c --- /dev/null +++ b/src/assets/img/map/mapVector.png Binary files differ diff --git a/src/common/flexible.js b/src/common/flexible.js index e8f83ca..693b592 100644 --- a/src/common/flexible.js +++ b/src/common/flexible.js @@ -82,15 +82,23 @@ } function refreshRem() { - var width = docEl.getBoundingClientRect().width; + // var width = docEl.getBoundingClientRect().width; // 最小1366px，最大适配2560px - if (width / dpr < 1366) { - width = 1366 * dpr; - } else if (width / dpr > 3072) { - width = 3072 * dpr; + // if (width / dpr < 1366) { + // width = 1366 * dpr; + // } else if (width / dpr > 3072) { + // width = 3072 * dpr; + // } + // // 设置成24等份，设计稿时1920px的，这样1rem就是80px + // var rem = width / 24; + var height = docEl.getBoundingClientRect().height; + if (height / dpr < 500) { + height = 607 * dpr; + } else if (height / dpr > 1296) { + height = 1296 * dpr; } // 设置成24等份，设计稿时1920px的，这样1rem就是80px - var rem = width / 24; + var rem = height / 24; console.log('rem = '+ rem) setRem(rem) docEl.style.fontSize = rem + "px"; diff --git a/src/components/block/simpleBlock.vue b/src/components/block/simpleBlock.vue index 8f219e3..9763891 100644 --- a/src/components/block/simpleBlock.vue +++ b/src/components/block/simpleBlock.vue @@ -6,22 +6,22 @@ @@ -38,8 +38,13 @@ type: Object, default: () => { return { + titleSize:'0.3rem', + valueSize:'0.4rem', + unitSize:'0.2rem', bgColor: '', // 背景颜色, - color: '' // 数值颜色 + titleColor: '#99ccff', // 标题颜色 + color: '#fffff', // 数值颜色 + unitColor: '#99ccff' // 单位颜色 } } }, @@ -93,11 +98,11 @@ align-items: center; .index-left{ /*width:2rem;*/ - width:0.47rem; + /*width:0.47rem;*/ height:100%; display: flex; justify-content: center; - align-items: center; + align-items: flex-end; img{ /*width:68%;*/ width:0.32rem; @@ -107,11 +112,13 @@ .index-right{ color:white; flex:1; + padding-left: 0.3rem; .index-name{ color:white; font-size:0.09rem; font-weight: bold; margin-bottom: 0.03rem; + line-height: 1.5; } .index-data{ width: 100%; @@ -119,14 +126,13 @@ justify-content: start; align-items: flex-end; text-align: right; + line-height: 1.5; .index-value{ - font-size:0.20rem; font-weight: bolder; } .data-right{ display: flex; justify-content: start; - font-size:0.07rem; margin-left:0.01rem; } } diff --git a/src/components/block/simpleBlock2.vue b/src/components/block/simpleBlock2.vue new file mode 100644 index 0000000..6d4be77 --- /dev/null +++ b/src/components/block/simpleBlock2.vue @@ -0,0 +1,122 @@ + + + + + + diff --git a/src/components/container/container1.vue b/src/components/container/container1.vue index eeeeb4c..362f9e1 100644 --- a/src/components/container/container1.vue +++ b/src/components/container/container1.vue @@ -6,22 +6,22 @@ @@ -41,8 +45,9 @@ .block-container{ height: 100%; width:100%; + display: flex; + flex-direction: column; .block-title{ - height: 0.5rem; display: flex; justify-content: start; align-items: flex-end; @@ -54,10 +59,8 @@ } } .block-content{ - height: calc(100% - 0.5rem); - padding: 0.05rem; - padding-top:0.1rem; - /*background-color: rgba(255,255,255,0.5);*/ + flex:1; + /*height: calc(100% - 0.5rem);*/ } } diff --git a/src/components/echart/gauge/gauge1.vue b/src/components/echart/gauge/gauge1.vue index 89c3e3e..5a6b9da 100644 --- a/src/components/echart/gauge/gauge1.vue +++ b/src/components/echart/gauge/gauge1.vue @@ -8,7 +8,7 @@ + + + diff --git a/src/components/title/Title2.vue b/src/components/title/Title2.vue new file mode 100644 index 0000000..b8324a0 --- /dev/null +++ b/src/components/title/Title2.vue @@ -0,0 +1,62 @@ + + + + diff --git a/src/views/screen/mainComponents/bizStatistic.vue b/src/views/screen/mainComponents/bizStatistic.vue index 8c64313..637f439 100644 --- a/src/views/screen/mainComponents/bizStatistic.vue +++ b/src/views/screen/mainComponents/bizStatistic.vue @@ -7,7 +7,7 @@ - + @@ -22,13 +22,13 @@ data(){ return { data:[ - {name:'路灯亮灯率', value:{already:34, total:100,rate:34}}, + {name:'路灯亮灯率', value:{already:34, total:100,rate:34}, color:'#009eec'}, // {name:'地下管线监测设备报警率', value:[{already:34, total:100,rate:34}]}, - {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}}, - {name:'液位监测仪', value:{already:34, total:100,rate:79}}, - {name:'有害气体监测仪', value:{already:34, total:100,rate:20}}, - {name:'噪声监测仪', value:{already:34, total:100,rate:15}}, - {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}} + {name:'井盖状态检测仪', value:{already:34, total:100,rate:50}, color:'#9fe6b8'}, + {name:'液位监测仪', value:{already:34, total:100,rate:79}, color:'#99ccff'}, + {name:'有害气体监测仪', value:{already:34, total:100,rate:20, color:'#ffdb5c'}}, + {name:'噪声监测仪', value:{already:34, total:100,rate:15}, color:'#ff9f7f'}, + {name:'消防栓防盗水监测仪', value:{already:34, total:100,rate:54}, color:'#fb7293'} ] } }, diff --git a/src/views/screen/mainComponents/deviceAlarmHistory.vue b/src/views/screen/mainComponents/deviceAlarmHistory.vue index e715459..e160447 100644 --- a/src/views/screen/mainComponents/deviceAlarmHistory.vue +++ b/src/views/screen/mainComponents/deviceAlarmHistory.vue @@ -4,9 +4,16 @@ * @Date: 2021-07-14 16:53:48 --> @@ -19,12 +26,14 @@ components: {GradientLineChart, Container1}, data(){ return { + currentTab:'井盖状态监测仪', + tabList:['井盖状态监测仪','液位监测仪','有害气体监测仪','消防栓防盗水监测仪'], xAxisData:['周一','周二','周三','周四','周五','周六','周日'], seriesData:[ - {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'}, - {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'}, - {name:'有害气体',data:[3, 2, 1, 2, 0, 2, 1],color:'248,211,81'}, - {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'}, + // {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'}, + // {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'}, + {name:'有害气体',data:[120, 252, 101, 134, 290, 230, 110],color:'0,255,204'}, + // {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'}, ] } }, @@ -32,5 +41,41 @@ diff --git a/src/views/screen/mainComponents/deviceAlarmRank.vue b/src/views/screen/mainComponents/deviceAlarmRank.vue index 213e240..021d404 100644 --- a/src/views/screen/mainComponents/deviceAlarmRank.vue +++ b/src/views/screen/mainComponents/deviceAlarmRank.vue @@ -5,8 +5,8 @@ --> @@ -27,8 +27,8 @@ {name: "消防栓防盗水监测仪", value: 80}, {name: "噪声监测仪", value: 80} ], - carousel: "single", - unit: "次" + unit: "次", + showValue: true }, } }, diff --git a/src/views/screen/mainComponents/lampAlarmHistory.vue b/src/views/screen/mainComponents/lampAlarmHistory.vue index 4f32f7b..d21b279 100644 --- a/src/views/screen/mainComponents/lampAlarmHistory.vue +++ b/src/views/screen/mainComponents/lampAlarmHistory.vue @@ -5,13 +5,18 @@ -->