From a9657a9b188b6b3318e1737a3619e6712e4e62aa Mon Sep 17 00:00:00 2001 From: luyisha Date: Fri, 11 Aug 2023 11:45:23 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BD=93=E8=82=B2=E5=AF=B9=E6=8E=A5=E5=AE=9E?= =?UTF-8?q?=E6=97=B6=E9=93=BE=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/HomeView.vue | 11 ++++-- src/views/TycView.vue | 87 +++++++++++++++++++++++++++++++++++++++--- 2 files changed, 88 insertions(+), 10 deletions(-) diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index a2bd82c..838b570 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -142,7 +142,7 @@ import { numGrow,ecMaxVal,numberGrow} from '@/utils/comm'; // 引入api import * as homeApi from '@/api/home' - +let ws = null; export default { name: 'HomeView', data() { @@ -700,12 +700,12 @@ export default { getsckdata(){ let that = this; // websocket - const ws = new WebSocket(publicConfig.WS_URL_ZL); + ws = new WebSocket(publicConfig.WS_URL_ZL); ws.onopen = function() { - console.log("ws connected success!") + // console.log("ws connected success!") }; ws.onclose = function(event) { - console.log('WebSocket连接已关闭'); + // console.log('WebSocket连接已关闭'); }; ws.onmessage = (e)=> { var jstr = JSON.parse(e.data); @@ -822,6 +822,9 @@ export default { }); } + }, + beforeUnmount(){ + ws.close(); } } diff --git a/src/views/TycView.vue b/src/views/TycView.vue index 1d3436d..1d927a0 100644 --- a/src/views/TycView.vue +++ b/src/views/TycView.vue @@ -402,6 +402,7 @@ import * as echarts from 'echarts'; import * as btApi from '../api/home' import { ecMaxVal,numGrow } from '@/utils/comm'; +let ws = null; export default { name: 'TycView', data() { @@ -431,6 +432,8 @@ export default { this.cg_line() // this.getTdcg() + + this.getsckdata() }, methods: { // 110,210,310 @@ -495,7 +498,7 @@ export default { }); // 2 }, - // 24H 进馆人数 + // 24H 服务人次绘制柱形图 cgsf_line() { var chartDom = document.getElementById('gcins_charts'); var myChart = echarts.init(chartDom); @@ -625,19 +628,19 @@ export default { ] } - option && myChart.setOption(option); + // option && myChart.setOption(option); //消停几秒后开始,动画 - setInterval(()=>{ + // setInterval(()=>{ myChart.clear() option && myChart.setOption(option); - },4000); + // },4000); }, // 获取各场馆的趋势 getTdcg(){ let guids = "110|210|310" - btApi.tdGroupRealTimeEnter({groupsId:guids}).then(res=>{ + btApi.tdGroupRealTimeEnter({type:1}).then(res=>{ console.log(res) const tmpdata = res.data.data // X 轴的名称字段 @@ -658,7 +661,7 @@ export default { }) }, - // 场馆人流趋势 + // 场馆人流趋势绘制线图 cg_line() { var chartDom = document.getElementById("gc_charts"); var myChart = echarts.init(chartDom); @@ -817,9 +820,81 @@ export default { series: series, } + myChart.clear() option && myChart.setOption(option); }, + getsckdata(){ + let that = this; + // websocket + ws = new WebSocket(publicConfig.WS_URL_TY); + ws.onopen = function() { + // console.log("ws connected success!") + }; + ws.onclose = function(event) { + // console.log('WebSocket连接已关闭'); + }; + ws.onmessage = (e)=> { + var jstr = JSON.parse(e.data); + if(!jstr){ + return; + } + + // 24 小时柱形图数据 + const vkdata = new Array; + vkdata.push({ + xname: jstr.getPassHoursData.data.dkeys.slice(-8, jstr.getPassHoursData.data.dkeys.length), + xval: jstr.getPassHoursData.data.dvalue.slice(-8, jstr.getPassHoursData.data.dvalue.length) + }) + that.ecbardata = vkdata; + that.cgsf_line(); + // 线图数据 + function linedata(){ + that.zxliddata=[]; + that.rsqsDataName=[],that.rsqsDatas=[]; + const tmpdata = jstr.toDayGroupsEnterNum.data; + tmpdata.forEach((item) => { + that.rsqsDataName.push(item.groupName); + that.rsqsDatas.push(item.list) + }) + + that.zxlindata = jstr.toDayGroupsEnterNum.data[0].list.dkeys; + that.rsqsDatas.forEach((item) => { + let rsqsData = [] + Object.getOwnPropertyNames(item).forEach((value) => { + if(value=='dvalue'){ + rsqsData = item[value]; + } + }); + that.zxliddata.push(rsqsData) + }) + that.cg_line() + } + linedata(); + // 占比、顶部数据 + function proportion(){ + // 场馆人次占比 + const tgdata = jstr.allGroupTimeNum.data.data.groupsData + that.cgdata = tgdata + // today in + // tgdata.forEach(item=>{ + // that.tdnum += item.noRepeatInNum + // }); + } + proportion(); + // 服务人数数据 + const rtdata = jstr.allGroupNum.data + that.tdnum = rtdata.day.noRepeatInNum + that.wdnum = rtdata.week.noRepeatInNum + that.tmdata = rtdata.month.noRepeatInNum + that.tydata = rtdata.year.noRepeatInNum + } + } + }, + beforeUnmount(){ + // console.log('体育关闭链接'); + ws.close(); + } } \ No newline at end of file