diff --git a/config/index.js b/config/index.js index 02f9f20..9c8344c 100644 --- a/config/index.js +++ b/config/index.js @@ -10,19 +10,20 @@ assetsSubDirectory: "static", assetsPublicPath: "/", proxyTable: { - '/queueadmin': { // 使用"/queue-admin"来代替 API头部，可随意命名 - //target: 'http://192.168.11.12:8080', // 源地址 本地开发的API头部 - target: "https://geo.datav.aliyun.com", // 配置到服务器后端的API头部 - pathRewrite: { - '^/queueadmin': '' // 路径重写，第一个与上面相同，第二个/queue-admin 为server.context-path（服务器的上下文） - }, - // 以下解决https 访问问题。上面的可以访问http - changeOrigin: true, - secure: false, - headers: { - Referer: 'https://geo.datav.aliyun.com' - } - }, + "/queueadmin": { + // 使用"/queue-admin"来代替 API头部，可随意命名 + //target: 'http://192.168.11.12:8080', // 源地址 本地开发的API头部 + target: "https://geo.datav.aliyun.com", // 配置到服务器后端的API头部 + pathRewrite: { + "^/queueadmin": "" // 路径重写，第一个与上面相同，第二个/queue-admin 为server.context-path（服务器的上下文） + }, + // 以下解决https 访问问题。上面的可以访问http + changeOrigin: true, + secure: false, + headers: { + Referer: "https://geo.datav.aliyun.com" + } + }, "/warnApi": { // target: "http://139.155.49.237:8286", //服务器接口 */ @@ -113,7 +114,7 @@ }, // Various Dev Server settings - host: "192.168.30.144", // can be overwritten by process.env.HOST + host: "192.168.30.113", // can be overwritten by process.env.HOST port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/config/index.js b/config/index.js index 02f9f20..9c8344c 100644 --- a/config/index.js +++ b/config/index.js @@ -10,19 +10,20 @@ assetsSubDirectory: "static", assetsPublicPath: "/", proxyTable: { - '/queueadmin': { // 使用"/queue-admin"来代替 API头部，可随意命名 - //target: 'http://192.168.11.12:8080', // 源地址 本地开发的API头部 - target: "https://geo.datav.aliyun.com", // 配置到服务器后端的API头部 - pathRewrite: { - '^/queueadmin': '' // 路径重写，第一个与上面相同，第二个/queue-admin 为server.context-path（服务器的上下文） - }, - // 以下解决https 访问问题。上面的可以访问http - changeOrigin: true, - secure: false, - headers: { - Referer: 'https://geo.datav.aliyun.com' - } - }, + "/queueadmin": { + // 使用"/queue-admin"来代替 API头部，可随意命名 + //target: 'http://192.168.11.12:8080', // 源地址 本地开发的API头部 + target: "https://geo.datav.aliyun.com", // 配置到服务器后端的API头部 + pathRewrite: { + "^/queueadmin": "" // 路径重写，第一个与上面相同，第二个/queue-admin 为server.context-path（服务器的上下文） + }, + // 以下解决https 访问问题。上面的可以访问http + changeOrigin: true, + secure: false, + headers: { + Referer: "https://geo.datav.aliyun.com" + } + }, "/warnApi": { // target: "http://139.155.49.237:8286", //服务器接口 */ @@ -113,7 +114,7 @@ }, // Various Dev Server settings - host: "192.168.30.144", // can be overwritten by process.env.HOST + host: "192.168.30.113", // can be overwritten by process.env.HOST port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/src/components/site/previewOfSiteStatus.vue b/src/components/site/previewOfSiteStatus.vue index 2dda8e5..031adba 100644 --- a/src/components/site/previewOfSiteStatus.vue +++ b/src/components/site/previewOfSiteStatus.vue @@ -68,7 +68,6 @@ placeholder="全部项目" @change="ListClick" size="medium" - clearable >

- 现有设备 + 设备统计

-
+
@@ -659,7 +658,7 @@ // 项目设备总览A myChart: {}, XianYou: "", //现有设备总数 - DaJian: "", //搭建设备总数 + // DaJian: "", //搭建设备总数 // 项目设备总览B // 项目设备环比增长A myChart2: {}, @@ -766,9 +765,8 @@ // console.log(response); if (response.status === 200) { var qwe = response.data.data === "" ? [] : response.data.data; - + this.ProjectList = this.ProjectList.concat(qwe); - } else { message(response); } @@ -866,23 +864,23 @@ // 加载 项目设备总览 loadQuyuShebei() { this.$http - .post(this.nozzle.platEquipmentGetEquipStatistics, { + .post(this.nozzle.getEquipStatistics, { data: { - platform: this.ChecksplatformCode + platformCode: this.ChecksplatformCode } }) .then(response => { - if (response.data.code === 200) { - this.loadRegionEcharts( - response.data.data.title, - response.data.data.exiting, - response.data.data.tobebuilt - ); - this.XianYou = response.data.data.exitingsum; - this.DaJian = response.data.data.tobebuiltsum; - } else { - message(response); - } + // if (response.data.code === 1) { + this.loadRegionEcharts( + response.data.data.title, + response.data.data.exiting, + response.data.data.tobebuiltsum + ); + this.XianYou = response.data.data.tobebuiltsum; + // this.DaJian = response.data.data.tobebuiltsum; + // } else { + // message(response); + // } }) .catch(response => { message(response); @@ -945,14 +943,13 @@ }, // 点击项目ZZJ ListClick(index) { - this.ChecksplatformCode = this.ProjectList[index]["groupNo"]; - - //刷新联动地图上的点位按照项目实际的个数 - console.log(this.ChecksplatformCode) - this.initPointToMap(this.ChecksplatformCode) - if(this.ProjectList[index]["areaCode"]) - this.gotoProgramArea(this.ProjectList[index]["areaCode"]) + + //刷新联动地图上的点位按照项目实际的个数 + console.log(this.ChecksplatformCode); + this.initPointToMap(this.ChecksplatformCode); + if (this.ProjectList[index]["areaCode"]) + this.gotoProgramArea(this.ProjectList[index]["areaCode"]); // 限制数组的长度不超过10个 // console.log(this.historyList.length); @@ -1000,9 +997,8 @@ if (item1["groupName"] == item) { this.ChecksplatformCode = item1["groupNo"]; //地图联动响应的项目 - this.initPointToMap(this.ChecksplatformCode) - if(item1["areaCode"]) - this.gotoProgramArea(item1["areaCode"]) + this.initPointToMap(this.ChecksplatformCode); + if (item1["areaCode"]) this.gotoProgramArea(item1["areaCode"]); // 根据平台渲染站点数量统计及状态统计 this.loadSiteNumForOroject(); // 根据平台渲染项目设备总览 @@ -1056,77 +1052,37 @@ // 绘制图表 this.myChart.clear(); this.myChart.setOption({ - color: ["red"], + title: { + text: "某站点用户访问来源", + subtext: "纯属虚构", + left: "center" + }, tooltip: { - trigger: "axis" + trigger: "item" }, legend: { - x: "center", - data: ["现有设备", "搭建设备"], - show: false + orient: "vertical", + left: "left" }, - radar: [ - { - indicator: SheBeiLeiXing, - radius: 70, - shape: "circle", - name: { - formatter: "{value}", - textStyle: { - color: "red" - } - } - } - ], series: [ { - type: "radar", - itemStyle: { normal: { areaStyle: { type: "default" } } }, - tooltip: { - trigger: "item" - }, + name: "访问来源", + type: "pie", + radius: "50%", data: [ - { - name: "现有设备", - value: XianYouData, - areaStyle: { - normal: { - color: "rgb(255, 217, 0)" - } - }, - itemStyle: { - normal: { - color: "rgb(255, 217, 0)", - lineStyle: { - color: "rgb(255, 217, 0)" - }, - areaStyle: { - type: "default" - } - } - } - }, - { - name: "搭建设备", - value: DaJianData, - areaStyle: { - normal: { - color: "rgb(0, 119, 254)" // 选择项目颜色 - } - }, - itemStyle: { - normal: { - color: "rgb(0, 119, 254)", - lineStyle: { - color: "rgb(0, 119, 254)" - }, - areaStyle: { - type: "default" - } - } - } + { value: 1048, name: "搜索引擎" }, + { value: 735, name: "直接访问" }, + { value: 580, name: "邮件营销" }, + { value: 484, name: "联盟广告" }, + { value: 300, name: "视频广告" } + ], + emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: "rgba(0, 0, 0, 0.5)" } - ] + } } ] }); @@ -1228,6 +1184,8 @@ ScrollUp() { var box = document.getElementById("previewOfSiteStatusCentent6"); var con1 = document.getElementById("GisRightCententBox2UL"); + + // console.log(box.scrollTop, con1.scrollHeight, box.offsetHeight); if (box.scrollTop >= con1.scrollHeight - box.offsetHeight) { box.scrollTop = 0; } else { @@ -1550,63 +1508,61 @@ }, gotoProgramArea1(areaCode) { this.$http - .get(this.nozzle.queueadmin+"/310000"+".json") + .get(this.nozzle.queueadmin + "/310000" + ".json") .then(response => { - console.log(response) - - - }) + console.log(response); + }); }, - - gotoProgramArea(areaCode) { + + gotoProgramArea(areaCode) { //初始化项目行政区域边框 // Create layer if (this.vectorSourceArea) { this.vectorSourceArea.clear(); } - /* let response = await fetch( + /* let response = await fetch( "http://geo.datav.aliyun.com/areas_v2/bound/" + areaCode + ".json" ); let dataJson = await response.json(); */ - this.$http - .get(this.nozzle.queueadmin+"/"+areaCode+".json") + this.$http + .get(this.nozzle.queueadmin + "/" + areaCode + ".json") .then(response => { - console.log(response) + console.log(response); let dataJson = response.data.features[0]; - console.log(dataJson) + console.log(dataJson); - let areaFeature = new GeoJSON().readFeatures(dataJson); + let areaFeature = new GeoJSON().readFeatures(dataJson); - this.vectorSourceArea = new SourceVector({ - features: areaFeature - }); - - var vectorArea = new LayerVector({ - renderMode: "image", - maxResolution: 2, - zIndex: 2, - source: this.vectorSourceArea, - style: feature => { - return new Style({ - stroke: new Stroke({ - color: "#8A2BE2", - lineCap: "butt", - width: 3 - }) + this.vectorSourceArea = new SourceVector({ + features: areaFeature }); - } - }); - this.map.addLayer(vectorArea); - //定位过去 - //开始根据routeFeature定位 - /* console.log(areaFeature[0].getGeometry().getExtent()) + var vectorArea = new LayerVector({ + renderMode: "image", + maxResolution: 2, + zIndex: 2, + source: this.vectorSourceArea, + style: feature => { + return new Style({ + stroke: new Stroke({ + color: "#8A2BE2", + lineCap: "butt", + width: 3 + }) + }); + } + }); + this.map.addLayer(vectorArea); + + //定位过去 + //开始根据routeFeature定位 + /* console.log(areaFeature[0].getGeometry().getExtent()) console.log(areaFeature[0].geometryChangeKey_.target.extent_) */ - var extent = areaFeature[0].getGeometry().getExtent(); - this.map.getView().fit(extent, this.map.getSize()); - }) + var extent = areaFeature[0].getGeometry().getExtent(); + this.map.getView().fit(extent, this.map.getSize()); + }); }, //显示cluster聚簇界面 showCluster(clusterData) { @@ -1734,10 +1690,8 @@ //飞行到指定的城市项目中心点 // this.flyToCity() //?要判断currentZoom加哪一个 - if (this.currentZoom >= 8) this.map.addLayer(this.vector); - else this.map.addLayer(this.layer); - - + if (this.currentZoom >= 8) this.map.addLayer(this.vector); + else this.map.addLayer(this.layer); }, getStyleOfCar(feature) { @@ -1820,18 +1774,18 @@ // this.map.addLayer(this.vector); - this.$http - .post(this.nozzle.listStationBase, { - data: { - /* platformCode:projectNo */ - } - }) - .then(response => { - console.log(response) - if (response.data.code === 1) { - this.showCluster(response.data.data); - } - }) + this.$http + .post(this.nozzle.listStationBase, { + data: { + /* platformCode:projectNo */ + } + }) + .then(response => { + console.log(response); + if (response.data.code === 1) { + this.showCluster(response.data.data); + } + }); //鼠标监听 //鼠标点击事件 diff --git a/config/index.js b/config/index.js index 02f9f20..9c8344c 100644 --- a/config/index.js +++ b/config/index.js @@ -10,19 +10,20 @@ assetsSubDirectory: "static", assetsPublicPath: "/", proxyTable: { - '/queueadmin': { // 使用"/queue-admin"来代替 API头部，可随意命名 - //target: 'http://192.168.11.12:8080', // 源地址 本地开发的API头部 - target: "https://geo.datav.aliyun.com", // 配置到服务器后端的API头部 - pathRewrite: { - '^/queueadmin': '' // 路径重写，第一个与上面相同，第二个/queue-admin 为server.context-path（服务器的上下文） - }, - // 以下解决https 访问问题。上面的可以访问http - changeOrigin: true, - secure: false, - headers: { - Referer: 'https://geo.datav.aliyun.com' - } - }, + "/queueadmin": { + // 使用"/queue-admin"来代替 API头部，可随意命名 + //target: 'http://192.168.11.12:8080', // 源地址 本地开发的API头部 + target: "https://geo.datav.aliyun.com", // 配置到服务器后端的API头部 + pathRewrite: { + "^/queueadmin": "" // 路径重写，第一个与上面相同，第二个/queue-admin 为server.context-path（服务器的上下文） + }, + // 以下解决https 访问问题。上面的可以访问http + changeOrigin: true, + secure: false, + headers: { + Referer: "https://geo.datav.aliyun.com" + } + }, "/warnApi": { // target: "http://139.155.49.237:8286", //服务器接口 */ @@ -113,7 +114,7 @@ }, // Various Dev Server settings - host: "192.168.30.144", // can be overwritten by process.env.HOST + host: "192.168.30.113", // can be overwritten by process.env.HOST port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/src/components/site/previewOfSiteStatus.vue b/src/components/site/previewOfSiteStatus.vue index 2dda8e5..031adba 100644 --- a/src/components/site/previewOfSiteStatus.vue +++ b/src/components/site/previewOfSiteStatus.vue @@ -68,7 +68,6 @@ placeholder="全部项目" @change="ListClick" size="medium" - clearable >

- 现有设备 + 设备统计

-
+
@@ -659,7 +658,7 @@ // 项目设备总览A myChart: {}, XianYou: "", //现有设备总数 - DaJian: "", //搭建设备总数 + // DaJian: "", //搭建设备总数 // 项目设备总览B // 项目设备环比增长A myChart2: {}, @@ -766,9 +765,8 @@ // console.log(response); if (response.status === 200) { var qwe = response.data.data === "" ? [] : response.data.data; - + this.ProjectList = this.ProjectList.concat(qwe); - } else { message(response); } @@ -866,23 +864,23 @@ // 加载 项目设备总览 loadQuyuShebei() { this.$http - .post(this.nozzle.platEquipmentGetEquipStatistics, { + .post(this.nozzle.getEquipStatistics, { data: { - platform: this.ChecksplatformCode + platformCode: this.ChecksplatformCode } }) .then(response => { - if (response.data.code === 200) { - this.loadRegionEcharts( - response.data.data.title, - response.data.data.exiting, - response.data.data.tobebuilt - ); - this.XianYou = response.data.data.exitingsum; - this.DaJian = response.data.data.tobebuiltsum; - } else { - message(response); - } + // if (response.data.code === 1) { + this.loadRegionEcharts( + response.data.data.title, + response.data.data.exiting, + response.data.data.tobebuiltsum + ); + this.XianYou = response.data.data.tobebuiltsum; + // this.DaJian = response.data.data.tobebuiltsum; + // } else { + // message(response); + // } }) .catch(response => { message(response); @@ -945,14 +943,13 @@ }, // 点击项目ZZJ ListClick(index) { - this.ChecksplatformCode = this.ProjectList[index]["groupNo"]; - - //刷新联动地图上的点位按照项目实际的个数 - console.log(this.ChecksplatformCode) - this.initPointToMap(this.ChecksplatformCode) - if(this.ProjectList[index]["areaCode"]) - this.gotoProgramArea(this.ProjectList[index]["areaCode"]) + + //刷新联动地图上的点位按照项目实际的个数 + console.log(this.ChecksplatformCode); + this.initPointToMap(this.ChecksplatformCode); + if (this.ProjectList[index]["areaCode"]) + this.gotoProgramArea(this.ProjectList[index]["areaCode"]); // 限制数组的长度不超过10个 // console.log(this.historyList.length); @@ -1000,9 +997,8 @@ if (item1["groupName"] == item) { this.ChecksplatformCode = item1["groupNo"]; //地图联动响应的项目 - this.initPointToMap(this.ChecksplatformCode) - if(item1["areaCode"]) - this.gotoProgramArea(item1["areaCode"]) + this.initPointToMap(this.ChecksplatformCode); + if (item1["areaCode"]) this.gotoProgramArea(item1["areaCode"]); // 根据平台渲染站点数量统计及状态统计 this.loadSiteNumForOroject(); // 根据平台渲染项目设备总览 @@ -1056,77 +1052,37 @@ // 绘制图表 this.myChart.clear(); this.myChart.setOption({ - color: ["red"], + title: { + text: "某站点用户访问来源", + subtext: "纯属虚构", + left: "center" + }, tooltip: { - trigger: "axis" + trigger: "item" }, legend: { - x: "center", - data: ["现有设备", "搭建设备"], - show: false + orient: "vertical", + left: "left" }, - radar: [ - { - indicator: SheBeiLeiXing, - radius: 70, - shape: "circle", - name: { - formatter: "{value}", - textStyle: { - color: "red" - } - } - } - ], series: [ { - type: "radar", - itemStyle: { normal: { areaStyle: { type: "default" } } }, - tooltip: { - trigger: "item" - }, + name: "访问来源", + type: "pie", + radius: "50%", data: [ - { - name: "现有设备", - value: XianYouData, - areaStyle: { - normal: { - color: "rgb(255, 217, 0)" - } - }, - itemStyle: { - normal: { - color: "rgb(255, 217, 0)", - lineStyle: { - color: "rgb(255, 217, 0)" - }, - areaStyle: { - type: "default" - } - } - } - }, - { - name: "搭建设备", - value: DaJianData, - areaStyle: { - normal: { - color: "rgb(0, 119, 254)" // 选择项目颜色 - } - }, - itemStyle: { - normal: { - color: "rgb(0, 119, 254)", - lineStyle: { - color: "rgb(0, 119, 254)" - }, - areaStyle: { - type: "default" - } - } - } + { value: 1048, name: "搜索引擎" }, + { value: 735, name: "直接访问" }, + { value: 580, name: "邮件营销" }, + { value: 484, name: "联盟广告" }, + { value: 300, name: "视频广告" } + ], + emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: "rgba(0, 0, 0, 0.5)" } - ] + } } ] }); @@ -1228,6 +1184,8 @@ ScrollUp() { var box = document.getElementById("previewOfSiteStatusCentent6"); var con1 = document.getElementById("GisRightCententBox2UL"); + + // console.log(box.scrollTop, con1.scrollHeight, box.offsetHeight); if (box.scrollTop >= con1.scrollHeight - box.offsetHeight) { box.scrollTop = 0; } else { @@ -1550,63 +1508,61 @@ }, gotoProgramArea1(areaCode) { this.$http - .get(this.nozzle.queueadmin+"/310000"+".json") + .get(this.nozzle.queueadmin + "/310000" + ".json") .then(response => { - console.log(response) - - - }) + console.log(response); + }); }, - - gotoProgramArea(areaCode) { + + gotoProgramArea(areaCode) { //初始化项目行政区域边框 // Create layer if (this.vectorSourceArea) { this.vectorSourceArea.clear(); } - /* let response = await fetch( + /* let response = await fetch( "http://geo.datav.aliyun.com/areas_v2/bound/" + areaCode + ".json" ); let dataJson = await response.json(); */ - this.$http - .get(this.nozzle.queueadmin+"/"+areaCode+".json") + this.$http + .get(this.nozzle.queueadmin + "/" + areaCode + ".json") .then(response => { - console.log(response) + console.log(response); let dataJson = response.data.features[0]; - console.log(dataJson) + console.log(dataJson); - let areaFeature = new GeoJSON().readFeatures(dataJson); + let areaFeature = new GeoJSON().readFeatures(dataJson); - this.vectorSourceArea = new SourceVector({ - features: areaFeature - }); - - var vectorArea = new LayerVector({ - renderMode: "image", - maxResolution: 2, - zIndex: 2, - source: this.vectorSourceArea, - style: feature => { - return new Style({ - stroke: new Stroke({ - color: "#8A2BE2", - lineCap: "butt", - width: 3 - }) + this.vectorSourceArea = new SourceVector({ + features: areaFeature }); - } - }); - this.map.addLayer(vectorArea); - //定位过去 - //开始根据routeFeature定位 - /* console.log(areaFeature[0].getGeometry().getExtent()) + var vectorArea = new LayerVector({ + renderMode: "image", + maxResolution: 2, + zIndex: 2, + source: this.vectorSourceArea, + style: feature => { + return new Style({ + stroke: new Stroke({ + color: "#8A2BE2", + lineCap: "butt", + width: 3 + }) + }); + } + }); + this.map.addLayer(vectorArea); + + //定位过去 + //开始根据routeFeature定位 + /* console.log(areaFeature[0].getGeometry().getExtent()) console.log(areaFeature[0].geometryChangeKey_.target.extent_) */ - var extent = areaFeature[0].getGeometry().getExtent(); - this.map.getView().fit(extent, this.map.getSize()); - }) + var extent = areaFeature[0].getGeometry().getExtent(); + this.map.getView().fit(extent, this.map.getSize()); + }); }, //显示cluster聚簇界面 showCluster(clusterData) { @@ -1734,10 +1690,8 @@ //飞行到指定的城市项目中心点 // this.flyToCity() //?要判断currentZoom加哪一个 - if (this.currentZoom >= 8) this.map.addLayer(this.vector); - else this.map.addLayer(this.layer); - - + if (this.currentZoom >= 8) this.map.addLayer(this.vector); + else this.map.addLayer(this.layer); }, getStyleOfCar(feature) { @@ -1820,18 +1774,18 @@ // this.map.addLayer(this.vector); - this.$http - .post(this.nozzle.listStationBase, { - data: { - /* platformCode:projectNo */ - } - }) - .then(response => { - console.log(response) - if (response.data.code === 1) { - this.showCluster(response.data.data); - } - }) + this.$http + .post(this.nozzle.listStationBase, { + data: { + /* platformCode:projectNo */ + } + }) + .then(response => { + console.log(response); + if (response.data.code === 1) { + this.showCluster(response.data.data); + } + }); //鼠标监听 //鼠标点击事件 diff --git a/src/util/projectSet.js b/src/util/projectSet.js index a6dd7e9..1c4d729 100644 --- a/src/util/projectSet.js +++ b/src/util/projectSet.js @@ -6,6 +6,8 @@ let host = "/projectApi"; let nozzle = { + getEquipStatistics: "/sys/equipinfo/getEquipStatistics", //项目设备总览 + statement: "/statistical/statement", //数据分析//数据总览 service: "/statistical/service", //数据分析//数据总览 Conn: "/statistical/Conn", //数据分析/统计报表 @@ -41,7 +43,7 @@ listStationBase: "/sys/stationbase/listStationBase", //所有站点 getTempData: "/sys/stationbase/getTempData", //单个站点 - sysPlatformGetAllSiteCount: "/sys/sysplatform/getAllSiteCount", //站点状况预览图-----获取所有平台站点数目统计 + sysPlatformGetAllSiteCount: "/sys/sysplatform/getAllSiteCount" //站点状况预览图-----获取所有平台站点数目统计 }; for (let item in nozzle) {