|
|
|
@ -13,17 +13,17 @@ |
|
|
|
|
|
|
|
<div class="jgitem"> |
|
|
|
<div class="jgimg"><img src="../assets/img/icon01.png" /></div> |
|
|
|
<span class="jgival">234,255</span> |
|
|
|
<span class="jgival">{{ tdnum }}</span> |
|
|
|
<span class="jgdesc">今日进馆人数</span> |
|
|
|
</div> |
|
|
|
<div class="jgitem"> |
|
|
|
<div class="jgimg"><img src="../assets/img/icon02.png" /></div> |
|
|
|
<span class="jgival">234,255</span> |
|
|
|
<span class="jgival">{{ tmdata }}</span> |
|
|
|
<span class="jgdesc">本月进馆人数</span> |
|
|
|
</div> |
|
|
|
<div class="jgitem"> |
|
|
|
<div class="jgimg"><img src="../assets/img/icon03.png" /></div> |
|
|
|
<span class="jgival">234,255</span> |
|
|
|
<span class="jgival">{{ tydata }}</span> |
|
|
|
<span class="jgdesc">本年进馆人数</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -38,18 +38,11 @@ |
|
|
|
<div class="pcb_title">各场馆人次占比</div> |
|
|
|
<div class="pcbcon"> |
|
|
|
|
|
|
|
<div class="pcbitem"> |
|
|
|
<div class="pcbval">50%</div> |
|
|
|
<div class="pcbdesc">体育场</div> |
|
|
|
</div> |
|
|
|
<div class="pcbitem"> |
|
|
|
<div class="pcbval">50%</div> |
|
|
|
<div class="pcbdesc">体育馆</div> |
|
|
|
</div> |
|
|
|
<div class="pcbitem"> |
|
|
|
<div class="pcbval">50%</div> |
|
|
|
<div class="pcbdesc">游泳场馆</div> |
|
|
|
<div class="pcbitem" v-for="cg in cgdata" :key="key"> |
|
|
|
<div class="pcbval">{{ cg.proportion }}</div> |
|
|
|
<div class="pcbdesc">{{cg. groupName }}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
@ -259,22 +252,97 @@ |
|
|
|
</style> |
|
|
|
<script> |
|
|
|
import * as echarts from 'echarts'; |
|
|
|
import * as btApi from '../api/home' |
|
|
|
import { ecMaxVal } from '@/utils/comm'; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'TycView', |
|
|
|
data() { |
|
|
|
return { |
|
|
|
// |
|
|
|
// 场馆数据 |
|
|
|
cgdata:[], |
|
|
|
// 柱子图 |
|
|
|
ecbardata:[], |
|
|
|
// 今日 |
|
|
|
tdnum:0, |
|
|
|
// month |
|
|
|
tmdata:0, |
|
|
|
// year |
|
|
|
tydata:0, |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
// 统计概况信息 |
|
|
|
this.csstat() |
|
|
|
|
|
|
|
// 进馆人数统计 |
|
|
|
this.cgsf_line() |
|
|
|
// this.cgsf_line() |
|
|
|
// 各场馆人数趋势 |
|
|
|
this.cg_line() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 山峰图 |
|
|
|
// 110,210,310 |
|
|
|
// 查询场馆统计情况 |
|
|
|
csstat(){ |
|
|
|
let groupId = "110|210|310" |
|
|
|
// 今日进馆数据 |
|
|
|
btApi.allGroupTimeNum({granularity:"daily",groupsId:groupId}).then(res=>{ |
|
|
|
const cgdata = res.data.data |
|
|
|
// 场馆人次占比 |
|
|
|
const tgdata = cgdata.groupsData |
|
|
|
this.cgdata = tgdata |
|
|
|
tgdata.forEach(item=>{ |
|
|
|
this.tdnum += item.noRepeatInNum |
|
|
|
}); |
|
|
|
|
|
|
|
// 24 小时 |
|
|
|
const vkdata = new Array; |
|
|
|
const vvdata = new Array; |
|
|
|
// |
|
|
|
const dkeys = cgdata.dkeys |
|
|
|
// allTimeData |
|
|
|
const allTdata = cgdata.allTimeData |
|
|
|
|
|
|
|
dkeys.forEach(function(item,idx){ |
|
|
|
// console.log(item) |
|
|
|
vvdata.push( allTdata[item].num) |
|
|
|
}); |
|
|
|
|
|
|
|
vkdata.push({ |
|
|
|
xname: dkeys, |
|
|
|
xval: vvdata |
|
|
|
}) |
|
|
|
|
|
|
|
this.ecbardata = vkdata |
|
|
|
// 24h |
|
|
|
this.cgsf_line() |
|
|
|
}); |
|
|
|
|
|
|
|
// 本月 |
|
|
|
btApi.allGroupTimeNum({granularity:"monthly",groupsId:groupId}).then(res=>{ |
|
|
|
const cgdata = res.data.data |
|
|
|
// 场馆人次占比 |
|
|
|
const tgdata = cgdata.groupsData |
|
|
|
this.cgdata = tgdata |
|
|
|
tgdata.forEach(item=>{ |
|
|
|
this.tmdata += item.noRepeatInNum |
|
|
|
}); |
|
|
|
}); |
|
|
|
// 年度 |
|
|
|
btApi.allGroupTimeNum({granularity:"yearly",groupsId:groupId}).then(res=>{ |
|
|
|
const cgdata = res.data.data |
|
|
|
// 场馆人次占比 |
|
|
|
const tgdata = cgdata.groupsData |
|
|
|
this.cgdata = tgdata |
|
|
|
tgdata.forEach(item=>{ |
|
|
|
this.tydata += item.noRepeatInNum |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 24H 进馆人数 |
|
|
|
cgsf_line() { |
|
|
|
|
|
|
|
// console.log(this.ecbardata[0].xname) |
|
|
|
var chartDom = document.getElementById('gcins_charts'); |
|
|
|
var myChart = echarts.init(chartDom); |
|
|
|
var option; |
|
|
|
@ -297,9 +365,10 @@ export default { |
|
|
|
containLabel: true |
|
|
|
}, |
|
|
|
xAxis: [{ |
|
|
|
data: [ |
|
|
|
'08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', |
|
|
|
], |
|
|
|
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', |
|
|
|
@ -341,7 +410,6 @@ export default { |
|
|
|
} |
|
|
|
}], |
|
|
|
series: [{ |
|
|
|
// name: '厂用电量', |
|
|
|
type: 'bar', |
|
|
|
barGap: '5%', |
|
|
|
barWidth: '10%', |
|
|
|
@ -363,17 +431,7 @@ export default { |
|
|
|
) |
|
|
|
} |
|
|
|
}, |
|
|
|
data: [ |
|
|
|
14000, |
|
|
|
11000, |
|
|
|
10000, |
|
|
|
9000, |
|
|
|
8000, |
|
|
|
7000, |
|
|
|
5000, |
|
|
|
4000, |
|
|
|
3000, |
|
|
|
], |
|
|
|
data: this.ecbardata[0].xval, |
|
|
|
zlevel: 11 |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -397,7 +455,8 @@ export default { |
|
|
|
type: 'bar', |
|
|
|
barWidth: '10%', |
|
|
|
barGap: '-100%', |
|
|
|
data: [15000, 15000, 15000, 15000, 15000, 15000, 15000, 15000, 15000], |
|
|
|
data:ecMaxVal(this.ecbardata[0].xval), |
|
|
|
//data: [15000, 15000, 15000, 15000, 15000, 15000, 15000, 15000, 15000], |
|
|
|
itemStyle: { |
|
|
|
normal: { |
|
|
|
color: '#004298', |
|
|
|
|