|
|
|
@ -54,18 +54,18 @@ |
|
|
|
<!-- 24小时总服务人次趋势 --> |
|
|
|
<div class="gcins"> |
|
|
|
<div class="gcins_title">24小时总服务人次趋势</div> |
|
|
|
<div id="gcins_charts" style="height:16rem"></div> |
|
|
|
<div ref="wgcins_charts" id="wgcins_charts" style="height:16rem"></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 各场馆服务人次趋势 --> |
|
|
|
<div class="gcgrs"> |
|
|
|
<div class="gcgrs_title">各场馆服务人次趋势</div> |
|
|
|
<div id="gc_charts" class="gcgrs_charts"></div> |
|
|
|
<div ref="wgc_charts" id="wgc_charts" class="gcgrs_charts"></div> |
|
|
|
</div> |
|
|
|
<!-- 各场馆人数趋势 --> |
|
|
|
<div class="tsgbox"> |
|
|
|
<div class="tsg_title">图书馆数据统计</div> |
|
|
|
<div id="tsgchart" class="tsgc_charts"></div> |
|
|
|
<div ref="tsgchart" id="tsgchart" class="tsgc_charts"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
@ -328,6 +328,7 @@ import * as echarts from 'echarts'; |
|
|
|
import * as homeApi from '@/api/home' |
|
|
|
import { ecMaxVal, numGrow } from '@/utils/comm'; |
|
|
|
|
|
|
|
let hws = null; |
|
|
|
export default { |
|
|
|
name: 'TycView', |
|
|
|
data() { |
|
|
|
@ -353,9 +354,6 @@ export default { |
|
|
|
zxlindata: [], |
|
|
|
// 图书馆借阅 |
|
|
|
libleaData: [], |
|
|
|
// ws |
|
|
|
ws:null, |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
@ -366,12 +364,11 @@ export default { |
|
|
|
this.getWh24hdata() |
|
|
|
// |
|
|
|
this.whtdrs() |
|
|
|
// this.gc_line() |
|
|
|
|
|
|
|
// 图书借阅信息 |
|
|
|
this.libinfoData() |
|
|
|
|
|
|
|
// websocket |
|
|
|
this.ws = new WebSocket(publicConfig.WS_URL_WH); |
|
|
|
this.getsckdata() |
|
|
|
|
|
|
|
}, |
|
|
|
@ -394,27 +391,18 @@ export default { |
|
|
|
this.gkwhg = sgdata[2].incount |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 24 小时总服务人次趋势 |
|
|
|
getWh24hdata() { |
|
|
|
homeApi.wh24ServiceTrends().then(res => { |
|
|
|
// const whtdata = res.data.data |
|
|
|
// this.wh24xdata = whtdata.dkeys |
|
|
|
// this.wh24ydata = whtdata.dvalue |
|
|
|
const temcgData = res.data.data |
|
|
|
// 24 小时 |
|
|
|
const temcgData = res.data.data |
|
|
|
|
|
|
|
const vkdata = new Array; |
|
|
|
const vvdata = new Array; |
|
|
|
// |
|
|
|
const dkeys = temcgData.dkeys |
|
|
|
dkeys.forEach(function(item,idx){ |
|
|
|
vvdata.push( item) |
|
|
|
}); |
|
|
|
|
|
|
|
vkdata.push({ |
|
|
|
xname: dkeys, |
|
|
|
xval: vvdata |
|
|
|
xname: temcgData.dkeys.slice(-8, temcgData.dkeys.length), |
|
|
|
xval: temcgData.dvalue.slice(-8, temcgData.dvalue.length), |
|
|
|
mxarr: ecMaxVal(temcgData.dvalue.slice(-8, temcgData.dvalue.length)) |
|
|
|
}) |
|
|
|
|
|
|
|
this.ecbardata = vkdata |
|
|
|
// do line |
|
|
|
this.cgsf_line() |
|
|
|
@ -423,7 +411,8 @@ export default { |
|
|
|
// 山峰图---24小时总服务人次趋势 |
|
|
|
// 24H 服务人次绘制柱形图 |
|
|
|
cgsf_line() { |
|
|
|
var chartDom = document.getElementById('gcins_charts'); |
|
|
|
//var chartDom = document.getElementById('wgcins_charts'); |
|
|
|
var chartDom = this.$refs.wgcins_charts |
|
|
|
var myChart = echarts.init(chartDom); |
|
|
|
var option; |
|
|
|
|
|
|
|
@ -446,9 +435,6 @@ export default { |
|
|
|
}, |
|
|
|
xAxis: [{ |
|
|
|
data: this.ecbardata[0].xname, |
|
|
|
// data: [ |
|
|
|
// '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', |
|
|
|
// ], |
|
|
|
axisLine: { |
|
|
|
lineStyle: { |
|
|
|
color: '#0095FF', |
|
|
|
@ -538,7 +524,9 @@ export default { |
|
|
|
type: 'bar', |
|
|
|
barWidth: '10%', |
|
|
|
barGap: '-100%', |
|
|
|
data: ecMaxVal(this.ecbardata[0].xval), |
|
|
|
//data: ecMaxVal(Object.values(this.ecbardata[0].xval)), |
|
|
|
data: this.ecbardata[0].mxarr, |
|
|
|
//data: ecMaxVal(this.ecbardata[0].xval), |
|
|
|
//data: [15000, 15000, 15000, 15000, 15000, 15000, 15000, 15000, 15000], |
|
|
|
itemStyle: { |
|
|
|
normal: { |
|
|
|
@ -563,7 +551,6 @@ export default { |
|
|
|
// 今日人流 |
|
|
|
whtdrs() { |
|
|
|
homeApi.whtdrs().then(res => { |
|
|
|
console.log("whtd", res) |
|
|
|
// get allTimeData |
|
|
|
const tmpdata = res.data.data |
|
|
|
// X 轴的名称字段 |
|
|
|
@ -574,7 +561,6 @@ export default { |
|
|
|
const list = item.list |
|
|
|
darr.push(list.dvalue) |
|
|
|
}) |
|
|
|
// console.log(darr) |
|
|
|
|
|
|
|
this.zxlindata = xarr |
|
|
|
this.zxliddata = darr |
|
|
|
@ -593,7 +579,8 @@ export default { |
|
|
|
}, |
|
|
|
// 图书馆 |
|
|
|
tsg_line() { |
|
|
|
var chartDom = document.getElementById("tsgchart"); |
|
|
|
var chartDom = this.$refs.tsgchart; |
|
|
|
// var chartDom = document.getElementById("tsgchart"); |
|
|
|
var myChart = echarts.init(chartDom); |
|
|
|
var option; |
|
|
|
|
|
|
|
@ -839,15 +826,17 @@ export default { |
|
|
|
// 场馆人流趋势绘制线图 |
|
|
|
// 场馆人流趋势绘制线图 |
|
|
|
cg_line() { |
|
|
|
|
|
|
|
let that = this; |
|
|
|
var chartDom = document.getElementById("gc_charts"); |
|
|
|
var chartDom = this.$refs.wgc_charts; |
|
|
|
// var chartDom = document.getElementById("wgc_charts"); |
|
|
|
var myChart = echarts.init(chartDom); |
|
|
|
|
|
|
|
var option |
|
|
|
var xData = ['09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00',]; |
|
|
|
var color = ['#FF99CC', '#6666FF', '#FF6600', '#7049f0', '#fa704d', '#01babc',] |
|
|
|
var name = this.zxlindata.slice(-10, this.zxlindata.length) |
|
|
|
var data = this.zxliddata.slice(-10, this.zxliddata.length) |
|
|
|
var name = that.zxlindata.slice(-10, that.zxlindata.length) |
|
|
|
var data = that.zxliddata.slice(-10, that.zxliddata.length) |
|
|
|
|
|
|
|
var series = []; |
|
|
|
for (var i = 0; i < data.length; i++) { |
|
|
|
@ -988,14 +977,14 @@ export default { |
|
|
|
// 从ws 中实时获取数据 |
|
|
|
getsckdata() { |
|
|
|
let that = this; |
|
|
|
|
|
|
|
this.ws.onopen = function () { |
|
|
|
hws = new WebSocket(publicConfig.WS_URL_WH); |
|
|
|
hws.onopen = function () { |
|
|
|
// console.log("ws connected success!") |
|
|
|
}; |
|
|
|
this.ws.onclose = function (event) { |
|
|
|
hws.onclose = function (event) { |
|
|
|
// console.log('WebSocket连接已关闭'); |
|
|
|
}; |
|
|
|
this.ws.onmessage = (e) => { |
|
|
|
hws.onmessage = (e) => { |
|
|
|
var jstr = JSON.parse(e.data); |
|
|
|
if (!jstr) { |
|
|
|
return; |
|
|
|
@ -1054,7 +1043,7 @@ export default { |
|
|
|
|
|
|
|
}, |
|
|
|
beforeUnmount() { |
|
|
|
this.ws.close(); |
|
|
|
hws.close(); |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
453530270@qq.com
3 years ago