refa(status): support incremental reload

plugins/frontend/logger/client/index.ts

@@ -1,6 +1,7 @@
 import { registerPage } from '~/client'
 import type {} from '@koishijs/plugin-logger/src'
 import Logs from './logs.vue'
+import './index.scss'
 
 registerPage({
   path: '/logs',

plugins/frontend/status/client/index.ts

@@ -1,14 +1,66 @@
-import { registerPage } from '~/client'
-import Database from './database/index.vue'
-
-import './home'
-import './index.scss'
-
-registerPage({
-  path: '/database',
-  name: '数据库',
-  icon: 'database',
-  order: 410,
-  fields: ['meta'],
-  component: Database,
+import { Card, registerView } from '~/client'
+import {} from '@koishijs/plugin-status/src'
+import LoadChart from './components/load-chart.vue'
+
+import './charts'
+
+registerView({
+  type: 'numeric',
+  component: Card.numeric({
+    title: '近期消息频率',
+    icon: 'history',
+    fields: ['stats'],
+    content({ stats }) {
+      return Object.values(stats.botSend).reduce((sum, value) => sum + value, 0).toFixed(1) + ' / d'
+    },
+  }),
+})
+
+registerView({
+  id: 'database',
+  type: 'numeric',
+  component: Card.numeric({
+    title: '数据库体积',
+    icon: 'database',
+    type: 'size',
+    fields: ['meta'],
+    content: ({ meta }) => meta.databaseSize,
+  }),
+})
+
+registerView({
+  id: 'assets',
+  type: 'numeric',
+  component: Card.numeric({
+    title: '资源服务器',
+    icon: 'hdd',
+    type: 'size',
+    fields: ['meta'],
+    content: ({ meta }) => meta.assetSize,
+  }),
+})
+
+registerView({
+  type: 'numeric',
+  component: Card.numeric({
+    title: '活跃用户数量',
+    icon: 'heart',
+    fields: ['meta'],
+    content: ({ meta }) => meta.activeUsers,
+  }),
+})
+
+registerView({
+  type: 'numeric',
+  component: Card.numeric({
+    title: '活跃群数量',
+    icon: 'users',
+    fields: ['meta'],
+    content: ({ meta }) => meta.activeGuilds,
+  }),
+})
+
+registerView({
+  type: 'home',
+  component: LoadChart,
 })

plugins/frontend/status/src/index.ts

@@ -1,25 +1,17 @@
 import { Context, Schema } from 'koishi'
 import { resolve } from 'path'
 import {} from '@koishijs/plugin-console'
-import { MetaProvider } from './meta'
-import { ProfileProvider } from './profile'
-import { StatisticsProvider } from './stats'
+import MetaProvider from './meta'
+import ProfileProvider from './profile'
+import StatisticsProvider from './stats'
 
 export type Activity = Record<number, number>
 
 declare module 'koishi' {
-  interface Database {
-    stats(): Promise<MetaProvider.Stats>
-  }
-
   interface Channel {
     name: string
     activity: Activity
   }
-
-  interface Modules {
-    manager: typeof import('.')
-  }
 }
 
 declare module '@koishijs/plugin-console' {
@@ -30,6 +22,12 @@ declare module '@koishijs/plugin-console' {
   }
 }
 
+export {
+  MetaProvider,
+  ProfileProvider,
+  StatisticsProvider,
+}
+
 export * from './meta'
 export * from './profile'
 export * from './stats'
@@ -48,6 +46,7 @@ export const Config = Schema.intersect([
 export function apply(ctx: Context, config: Config) {
   const filename = ctx.console.config.devMode ? '../client/index.ts' : '../dist/index.js'
   ctx.console.addEntry(resolve(__dirname, filename))
+
   ctx.plugin(MetaProvider, config)
   ctx.plugin(ProfileProvider, config)
   ctx.plugin(StatisticsProvider, config)

plugins/frontend/status/src/meta.ts

@@ -1,4 +1,4 @@
-import { Argv, Assets, Context, Dict, noop, Schema, Time } from 'koishi'
+import { Argv, Assets, Context, noop, Schema, Time } from 'koishi'
 import { DataSource } from '@koishijs/plugin-console'
 
 declare module 'koishi' {
@@ -7,7 +7,7 @@ declare module 'koishi' {
   }
 }
 
-export class MetaProvider extends DataSource<MetaProvider.Payload> {
+class MetaProvider extends DataSource<MetaProvider.Payload> {
   timestamp = 0
   cached: Promise<MetaProvider.Payload>
   callbacks: MetaProvider.Extension[] = []
@@ -16,7 +16,10 @@ export class MetaProvider extends DataSource<MetaProvider.Payload> {
     super(ctx, 'meta')
 
     this.extend(async () => ctx.assets?.stats())
-    this.extend(async () => ctx.database?.stats())
+    this.extend(async () => {
+      const stats = await ctx.database?.stats()
+      return { databaseSize: stats.size }
+    })
 
     this.extend(async () => {
       const activeUsers = await ctx.database?.eval('user', { $count: 'id' }, {
@@ -57,7 +60,7 @@ export class MetaProvider extends DataSource<MetaProvider.Payload> {
   }
 }
 
-export namespace MetaProvider {
+namespace MetaProvider {
   export interface Config {
     metaInterval?: number
   }
@@ -66,17 +69,13 @@ export namespace MetaProvider {
     metaInternal: Schema.number().description('元数据推送的时间间隔。').default(Time.hour),
   })
 
-  export interface Stats {
-    size: number
+  export interface Payload extends Assets.Stats {
     activeUsers: number
     activeGuilds: number
-    tables: Dict<{
-      count: number
-      size: number
-    }>
+    databaseSize: number
   }
 
-  export interface Payload extends Stats, Assets.Stats {}
-
   export type Extension = () => Promise<Partial<Payload>>
 }
+
+export default MetaProvider

plugins/frontend/status/src/profile.ts

@@ -42,7 +42,7 @@ function updateCpuUsage() {
   usage = newUsage
 }
 
-export class ProfileProvider extends DataSource<ProfileProvider.Payload> {
+class ProfileProvider extends DataSource<ProfileProvider.Payload> {
   cached: ProfileProvider.Payload
 
   constructor(ctx: Context, private config: ProfileProvider.Config) {
@@ -65,7 +65,7 @@ export class ProfileProvider extends DataSource<ProfileProvider.Payload> {
   }
 }
 
-export namespace ProfileProvider {
+namespace ProfileProvider {
   export interface Config {
     tickInterval?: number
   }
@@ -79,3 +79,5 @@ export namespace ProfileProvider {
     cpu: LoadRate
   }
 }
+
+export default ProfileProvider

plugins/frontend/status/src/stats.ts

@@ -52,7 +52,7 @@ Session.prototype.send = function (this: Session, ...args) {
 const customTag = Symbol('custom-send')
 Session.prototype.send[customTag] = send
 
-export class StatisticsProvider extends DataSource<StatisticsProvider.Payload> {
+class StatisticsProvider extends DataSource<StatisticsProvider.Payload> {
   static using = ['database'] as const
 
   lastUpdate = new Date()
@@ -305,7 +305,7 @@ export class StatisticsProvider extends DataSource<StatisticsProvider.Payload> {
   }
 }
 
-export namespace StatisticsProvider {
+namespace StatisticsProvider {
   export type DailyField = typeof dailyFields[number]
   export const dailyFields = [
     'command', 'dialogue', 'botSend', 'botReceive', 'group',
@@ -348,3 +348,5 @@ export namespace StatisticsProvider {
 
   export type Extension = (payload: Payload, data: StatisticsProvider.Data) => Promise<void>
 }
+
+export default StatisticsProvider