boyue2025/boyue-ui-admin-vue3
3
0
Fork 0
mirror of https://gitee.com/myxzgzs/boyue-ui-admin-vue3 synced 2025-08-08 16:32:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat:home

Browse Source
This commit is contained in:
alwayssuper 2025-02-28 15:29:26 +08:00
parent 5137b4a4cb
commit 9640531c2a
1 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/views/iot/home/index.vue
View File

@ -373,17 +373,30 @@ const initGaugeChart = (el: any, value: number, color: string) => {
/** 初始化消息统计图表 */ /** 初始化消息统计图表 */
const initMessageChart = () => { const initMessageChart = () => {
// 获取所有时间戳并排序
const timestamps = Array.from( const timestamps = Array.from(
new Set([ new Set([
...Object.keys(messageStats.value.upstreamCounts), ...messageStats.value.upstreamCounts.map(item => Number(Object.keys(item)[0])),
...Object.keys(messageStats.value.downstreamCounts) ...messageStats.value.downstreamCounts.map(item => Number(Object.keys(item)[0]))
]) ])
).sort() ).sort((a, b) => a - b) // 确保时间戳从小到大排序
const xdata = timestamps.map(ts => formatDate(Number(ts), 'YYYY-MM-DD HH:mm')) // 准备数据
const upData = timestamps.map(ts => messageStats.value.upstreamCounts[Number(ts)] || 0) const xdata = timestamps.map(ts => formatDate(ts, 'YYYY-MM-DD HH:mm'))
const downData = timestamps.map(ts => messageStats.value.downstreamCounts[Number(ts)] || 0) const upData = timestamps.map(ts => {
const item = messageStats.value.upstreamCounts.find(
count => Number(Object.keys(count)[0]) === ts
)
return item ? Object.values(item)[0] : 0
})
const downData = timestamps.map(ts => {
const item = messageStats.value.downstreamCounts.find(
count => Number(Object.keys(count)[0]) === ts
)
return item ? Object.values(item)[0] : 0
})
// 配置图表
echarts.init(chartMsgStat.value).setOption({ echarts.init(chartMsgStat.value).setOption({
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
@ -439,7 +452,7 @@ const initMessageChart = () => {
{ {
name: '上行消息量', name: '上行消息量',
type: 'line', type: 'line',
stack: 'Total', smooth: true, // 添加平滑曲线
data: upData, data: upData,
itemStyle: { itemStyle: {
color: '#3B82F6' color: '#3B82F6'
@ -457,7 +470,7 @@ const initMessageChart = () => {
{ {
name: '下行消息量', name: '下行消息量',
type: 'line', type: 'line',
stack: 'Total', smooth: true, // 添加平滑曲线
data: downData, data: downData,
itemStyle: { itemStyle: {
color: '#10B981' color: '#10B981'