仪表盘页面
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
<div nz-row>
|
||||
<nz-card nzTitle="统计" nz-col nzSpan="12" nzSize="small">
|
||||
<nz-row [nzGutter]="24">
|
||||
<nz-col [nzSpan]="6">
|
||||
<nz-statistic [nzValue]="(counts.articleCount | number)!" nzTitle="文章数量"></nz-statistic>
|
||||
</nz-col>
|
||||
<nz-col [nzSpan]="6">
|
||||
<nz-statistic [nzValue]="(counts.tagCount | number)!" nzTitle="标签量"></nz-statistic>
|
||||
</nz-col>
|
||||
<nz-col [nzSpan]="6">
|
||||
<nz-statistic [nzValue]="(counts.categoryCount | number)!" nzTitle="分类数量"></nz-statistic>
|
||||
</nz-col>
|
||||
<nz-col [nzSpan]="6">
|
||||
<nz-statistic [nzValue]="(counts.commentCount | number)!" nzTitle="评论量"></nz-statistic>
|
||||
</nz-col>
|
||||
</nz-row>
|
||||
</nz-card>
|
||||
<nz-card nzTitle="信息" nz-col nzSpan="11" nzOffset="1" nzSize="small">
|
||||
<nz-row [nzGutter]="24">
|
||||
<nz-col [nzSpan]="8">
|
||||
<nz-statistic [nzValue]="(counts.visitorCount | number)!" nzTitle="总访问量"></nz-statistic>
|
||||
</nz-col>
|
||||
<nz-col [nzSpan]="8">
|
||||
<nz-statistic [nzValue]="(dayVisitCount | number)!" nzTitle="日访问量"></nz-statistic>
|
||||
</nz-col>
|
||||
<nz-col [nzSpan]="8">
|
||||
<nz-statistic [nzValue]="userInfo.recentlyLandedDate" nzTitle="上次登录"></nz-statistic>
|
||||
</nz-col>
|
||||
</nz-row>
|
||||
</nz-card>
|
||||
</div>
|
||||
<div nz-row style="margin-top: 30px">
|
||||
<nz-card style="width:100%;" nzSize="small" nzTitle="日志" [nzExtra]="reload">
|
||||
<ng-template #reload>
|
||||
<a (click)="getLog()" title="刷新"><i nz-icon nzType="reload" nzTheme="outline"></i></a>
|
||||
</ng-template>
|
||||
<nz-spin [nzSpinning]="logLoading" style="width: 100%;">
|
||||
<pre style="width: 100%;max-height: 500px;overflow: auto;">{{logText}}</pre>
|
||||
</nz-spin>
|
||||
</nz-card>
|
||||
</div>
|
||||
@@ -0,0 +1,55 @@
|
||||
import {Component, OnInit} from '@angular/core';
|
||||
import {HttpClient} from '@angular/common/http';
|
||||
import {ApiService} from '../../../api/api.service';
|
||||
import {GlobalUserService} from '../../../services/global-user.service';
|
||||
import {User} from '../../../class/User';
|
||||
|
||||
@Component({
|
||||
selector: 'app-admin-dashboard',
|
||||
templateUrl: './admin-dashboard.component.html',
|
||||
styleUrls: ['./admin-dashboard.component.less']
|
||||
})
|
||||
export class AdminDashboardComponent implements OnInit {
|
||||
constructor(private apiService: ApiService, private userService: GlobalUserService, private http: HttpClient) {
|
||||
this.getLog();
|
||||
this.getCounts();
|
||||
this.getDayVisitCount();
|
||||
this.getUserInfo();
|
||||
}
|
||||
|
||||
logLoading: true;
|
||||
logText: string;
|
||||
counts: {
|
||||
articleCount: number,
|
||||
visitorCount: number,
|
||||
categoryCount: number,
|
||||
leaveMsgCount: number,
|
||||
tagCount: number,
|
||||
commentCount: number
|
||||
}
|
||||
dayVisitCount: number
|
||||
userInfo: User;
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
getLog() {
|
||||
this.http.get('https://api.celess.cn/blog.log', {responseType: 'text'}).subscribe(data => {
|
||||
this.logText = data;
|
||||
});
|
||||
}
|
||||
|
||||
getCounts = () => this.apiService.counts().subscribe({
|
||||
next: data => this.counts = data.result
|
||||
})
|
||||
|
||||
getDayVisitCount = () => this.apiService.dayVisitCount().subscribe({
|
||||
next: data => this.dayVisitCount = data.result
|
||||
})
|
||||
|
||||
getUserInfo = () => this.userService.watchUserInfo({
|
||||
next: data => this.userInfo = data.result,
|
||||
error: null,
|
||||
complete: null
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
import {NgModule} from '@angular/core';
|
||||
import {CommonModule} from '@angular/common';
|
||||
import {AdminDashboardComponent} from './admin-dashboard.component';
|
||||
import {RouterModule} from '@angular/router';
|
||||
import {NzButtonModule, NzCardModule, NzGridModule, NzIconModule, NzSpinModule, NzStatisticModule} from 'ng-zorro-antd';
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [AdminDashboardComponent],
|
||||
imports: [
|
||||
CommonModule,
|
||||
RouterModule.forChild([{path: '', component: AdminDashboardComponent}]),
|
||||
NzGridModule,
|
||||
NzCardModule,
|
||||
NzButtonModule,
|
||||
NzSpinModule,
|
||||
NzIconModule,
|
||||
NzStatisticModule
|
||||
]
|
||||
})
|
||||
export class AdminDashboardModule {
|
||||
}
|
||||
@@ -47,7 +47,7 @@ const routes: Routes = [
|
||||
},
|
||||
{
|
||||
path: '**',
|
||||
loadChildren: () => import('./admin-index/admin-index.module').then(mod => mod.AdminIndexModule),
|
||||
loadChildren: () => import('./admin-dashboard/admin-dashboard.module').then(mod => mod.AdminDashboardModule),
|
||||
canActivate: [AuthGuard]
|
||||
}
|
||||
]
|
||||
|
||||
Reference in New Issue
Block a user