sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(client): add instances doughnuts charts for dashboard

Browse Source
This commit is contained in:
syuilo
2022-06-28 10:42:26 +09:00
parent d7c6e2e61c
commit fe460c022c
2 changed files with 155 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
packages/client/src/pages/admin/overview.vue
View File

@@ -43,7 +43,12 @@
</div>
</div>
<!--<XMetrics/>-->
<div class="container files">
<div class="title">Recent files</div>
<div class="body">
<MkFileListForAdmin :pagination="filesPagination" view-mode="grid"/>
</div>
</div>
<div class="container env">
<div class="title">Enviroment</div>
@@ -103,10 +108,18 @@
</div>
</div>
</div>
<div class="container files">
<div class="title">Recent files</div>
<div v-if="fedStats" class="container federationPies">
<div class="body">
<MkFileListForAdmin :pagination="filesPagination" view-mode="grid"/>
<div class="chart deliver">
<div class="title">Sub</div>
<XPie :data="fedStats.topSubInstances.map(x => ({ name: x.host, value: x.followersCount }))"/>
<div class="subTitle">Top 10</div>
</div>
<div class="chart inbox">
<div class="title">Pub</div>
<XPie :data="fedStats.topPubInstances.map(x => ({ name: x.host, value: x.followingCount }))"/>
<div class="subTitle">Top 10</div>
</div>
</div>
</div>
</div>
@@ -140,6 +153,7 @@ import XMetrics from './metrics.vue';
import XFederation from './overview.federation.vue';
import XQueueChart from './overview.queue-chart.vue';
import XUser from './overview.user.vue';
import XPie from './overview.pie.vue';
import MkInstanceStats from '@/components/instance-stats.vue';
import MkNumberDiff from '@/components/number-diff.vue';
import { version, url } from '@/config';
@@ -175,6 +189,7 @@ const rootEl = $ref<HTMLElement>();
const chartEl = $ref<HTMLCanvasElement>(null);
let stats: any = $ref(null);
let serverInfo: any = $ref(null);
let fedStats: any = $ref(null);
let usersComparedToThePrevDay: any = $ref(null);
let notesComparedToThePrevDay: any = $ref(null);
let federationPubActive = $ref<number | null>(null);
@@ -257,7 +272,7 @@ async function renderChart() {
layout: {
padding: {
left: 0,
right: 8,
right: 0,
top: 0,
bottom: 0,
},
@@ -380,6 +395,10 @@ onMounted(async () => {
federationSubActiveDiff = chart.subActive[0] - chart.subActive[1];
});
os.apiGet('federation/stats').then(res => {
fedStats = res;
});
os.api('admin/server-info').then(serverInfoResponse => {
serverInfo = serverInfoResponse;
});
@@ -529,6 +548,35 @@ definePageMetadata({
}
}
}
&.federationPies {
> .body {
display: grid;
grid-gap: 16px;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
> .chart {
position: relative;
padding: 20px;
background: var(--panel);
border-radius: var(--radius);
> .title {
position: absolute;
top: 20px;
left: 20px;
font-size: 90%;
}
> .subTitle {
position: absolute;
bottom: 20px;
right: 20px;
font-size: 85%;
}
}
}
}
}
}