From e96e2c2f0d835fefc5f3923a84547c81390c8a59 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=8F=E6=B5=B7?= Date: Sat, 25 Apr 2020 15:33:57 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=99=BB=E5=BD=95=EF=BC=8C?= =?UTF-8?q?=E8=8E=B7=E5=8F=96=E7=94=A8=E6=88=B7=E4=BF=A1=E6=81=AF=E5=92=8C?= =?UTF-8?q?=E6=B3=A8=E9=94=80=E7=9A=84=E6=96=B9=E6=B3=95=E8=B0=83=E7=94=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/components/header/header.component.ts | 34 +++++++++--------- index/src/app/view/admin/auth.guard.ts | 14 +++++++- .../src/app/view/article/article.component.ts | 13 ++++--- .../components/login/login.component.ts | 35 ++++++++++--------- index/src/app/view/write/write.component.ts | 26 +++++++++----- 5 files changed, 76 insertions(+), 46 deletions(-) diff --git a/index/src/app/components/header/header.component.ts b/index/src/app/components/header/header.component.ts index b240920..709f805 100644 --- a/index/src/app/components/header/header.component.ts +++ b/index/src/app/components/header/header.component.ts @@ -4,6 +4,7 @@ import {windowWidthChange} from '../../utils/util'; import {ApiService} from '../../api/api.service'; import {User} from '../../class/User'; import {ComponentStateService} from '../../services/component-state.service'; +import {UserService} from '../../services/user.service'; @Component({ selector: 'app-header', @@ -13,8 +14,8 @@ import {ComponentStateService} from '../../services/component-state.service'; export class HeaderComponent implements OnInit { constructor(private router: Router, - private apiService: ApiService, - public componentStateService: ComponentStateService) { + public componentStateService: ComponentStateService, + private userService: UserService) { this.pageList = [ {name: '首页', path: '/', icon: 'home', iconType: 'fill', show: true}, {name: '分类', path: '/categories', icon: 'project', iconType: 'fill', show: true}, @@ -26,7 +27,7 @@ export class HeaderComponent implements OnInit { {name: '注册', path: '/registration', icon: 'user', iconType: 'outline', show: false} ]; - + this.getInfo(); this.showList = window.innerWidth > this.mobileMaxWidth; this.changeLoginButtonV(); // 监听宽度变化 @@ -41,7 +42,6 @@ export class HeaderComponent implements OnInit { } else { this.size = 'large'; } - this.getInfo(); }); } @@ -116,27 +116,27 @@ export class HeaderComponent implements OnInit { } getInfo() { - this.apiService.userInfo().subscribe(data => { - this.userInfo = data.result; - this.changeLoginButtonV(); - }, - error => { + this.userService.watchUserInfo({ + complete: () => null, + error: (err) => null, + next: data => { + this.userInfo = data.result; + this.changeLoginButtonV(); + } } ); } logout() { - this.apiService.logout().subscribe(data => { - location.reload(); - }, - error => { - } - ); - this.userInfo = null; + this.userService.logout({ + next: data => null, + error: err => null, + complete: () => null + }); } toAdminPage() { - window.location.href = '/admin'; + this.router.navigateByUrl('/admin') } } diff --git a/index/src/app/view/admin/auth.guard.ts b/index/src/app/view/admin/auth.guard.ts index a233ad1..5797d2d 100644 --- a/index/src/app/view/admin/auth.guard.ts +++ b/index/src/app/view/admin/auth.guard.ts @@ -2,21 +2,33 @@ import {Injectable} from '@angular/core'; import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree} from '@angular/router'; import {Observable} from 'rxjs'; import {User} from '../../class/User'; +import {UserService} from '../../services/user.service'; @Injectable({ providedIn: 'root' }) export class AuthGuard implements CanActivate { - constructor() { + constructor(private userService: UserService) { + userService.watchUserInfo({ + complete: () => null, + error: (err) => null, + next: data => { + this.userInfo = data.result + console.log(this.path); + // todo ：用户信息更新时 重新判断下path + } + }) } userInfo: User; + private path: string; canActivate( next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean | UrlTree { const path = state.url.indexOf('?') > 0 ? state.url.substr(0, state.url.indexOf('?')) : state.url; + this.path = path switch (path) { case '/admin/article': case '/admin/category': diff --git a/index/src/app/view/article/article.component.ts b/index/src/app/view/article/article.component.ts index 161b426..aadd841 100644 --- a/index/src/app/view/article/article.component.ts +++ b/index/src/app/view/article/article.component.ts @@ -7,6 +7,7 @@ import {User} from '../../class/User'; import {CommentReq} from '../../class/Comment'; import {PageList} from '../../class/HttpReqAndResp'; import {Comment} from '../../class/Comment'; +import {UserService} from '../../services/user.service'; declare var editormd; declare var $; @@ -20,6 +21,7 @@ export class ArticleComponent implements OnInit { constructor(private activatedRoute: ActivatedRoute, private apiService: ApiService, + private userService: UserService, private titleService: Title, private router: Router) { this.articleId = +activatedRoute.snapshot.paramMap.get('id'); @@ -41,10 +43,13 @@ export class ArticleComponent implements OnInit { ngOnInit() { this.toArticle(this.articleId); - this.apiService.userInfo().subscribe(data => { - this.user = data.result; - this.avatarImgUrl = data.result.avatarImgUrl; - }, error => { + this.userService.watchUserInfo({ + complete: () => null, + error: (err) => null, + next: data => { + this.user = data.result; + this.avatarImgUrl = data.result.avatarImgUrl; + } }); this.comment = new CommentReq(true); } diff --git a/index/src/app/view/login-registration/components/login/login.component.ts b/index/src/app/view/login-registration/components/login/login.component.ts index c323aa7..d5348a0 100644 --- a/index/src/app/view/login-registration/components/login/login.component.ts +++ b/index/src/app/view/login-registration/components/login/login.component.ts @@ -1,11 +1,10 @@ import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; import {NzMessageService} from 'ng-zorro-antd'; -import {ApiService} from '../../../../api/api.service'; import {LoginReq} from '../../../../class/User'; -import {LocalStorageService} from '../../../../services/local-storage.service'; import {ActivatedRoute, Router} from '@angular/router'; import {LoginRegistrationService} from '../../service/login-registration.service'; import {Title} from '@angular/platform-browser'; +import {UserService} from '../../../../services/user.service'; @Component({ selector: 'c-login', @@ -15,7 +14,7 @@ import {Title} from '@angular/platform-browser'; export class LoginComponent implements OnInit { constructor(private nzMessageService: NzMessageService, - private apiService: ApiService, + private userService: UserService, private activatedRoute: ActivatedRoute, private router: Router, private loginRegistrationService: LoginRegistrationService, @@ -54,20 +53,24 @@ export class LoginComponent implements OnInit { return; } - this.apiService.login(this.loginReq).subscribe( - data => { - this.submitting = false; - this.nzMessageService.success('登录成功，欢迎你' + data.result.displayName); - this.loginStatus.emit(true); - if (this.url) { - this.router.navigateByUrl(this.url); - } else { - window.location.href = '/admin/'; + this.userService.login(this.loginReq, { + complete: () => null, + error: (err) => { + this.nzMessageService.error(err.msg); + this.submitting = false; + this.loginStatus.emit(false); + }, + next: data => { + this.submitting = false; + this.nzMessageService.success('登录成功，欢迎你' + data.result.displayName); + this.loginStatus.emit(true); + if (this.url) { + this.router.navigateByUrl(this.url); + } else { + // window.location.href = '/admin/'; + this.router.navigateByUrl('/admin') + } } - }, error => { - this.nzMessageService.error(error.msg); - this.submitting = false; - this.loginStatus.emit(false); } ); } diff --git a/index/src/app/view/write/write.component.ts b/index/src/app/view/write/write.component.ts index bbe109c..4995426 100644 --- a/index/src/app/view/write/write.component.ts +++ b/index/src/app/view/write/write.component.ts @@ -7,6 +7,7 @@ import {NzMessageService} from 'ng-zorro-antd'; import {User} from '../../class/User'; import {Tag} from '../../class/Tag'; import {Title} from '@angular/platform-browser'; +import {UserService} from '../../services/user.service'; @Component({ selector: 'view-write', @@ -18,6 +19,7 @@ export class WriteComponent implements OnInit { constructor(private router: Router, private activatedRoute: ActivatedRoute, private apiService: ApiService, + private userService: UserService, private message: NzMessageService, private titleService: Title) { this.titleService.setTitle('小海博客 | 创作'); @@ -37,6 +39,8 @@ export class WriteComponent implements OnInit { // 发布新文章时，文章相同会被拦回 此处判断一下 title: string; + private lastShowTime: number; + // 同步属性内容 syncModel(str): void { this.article.mdContent = str; @@ -54,17 +58,23 @@ export class WriteComponent implements OnInit { } this.setSuitableHeight(); // 用户权限判断 - this.apiService.userInfo().subscribe({ - next: data => { - this.userInfo = data.result; - if (data.result.role !== 'admin') { - this.message.info('你暂时无发布文章的权限,所写文章将暂存在本地'); + this.userService.watchUserInfo({ + complete: () => null, + error: (err) => { + if (!this.lastShowTime || Date.now() - this.lastShowTime > 1000) { + this.message.info('你暂时还没有登录，请点击右上角登录后开始创作'); + this.lastShowTime = Date.now(); } }, - error: e => { - this.message.info('你暂时还没有登录，请点击右上角登录后开始创作'); + next: data => { + this.userInfo = data.result; + if ((!data.result || data.result.role !== 'admin') + && (!this.lastShowTime || Date.now() - this.lastShowTime > 1000)) { + this.message.info('你暂时无发布文章的权限,所写文章将暂存在本地'); + } } - }); + }) + ; this.apiService.tagsNac().subscribe(data => { this.tagNacList = data.result; this.tagNacList.sort((a, b) => a.name.length - b.name.length);