From f6ccb2f295b0549bec5af69a8eae50209f0689d9 Mon Sep 17 00:00:00 2001 From: Phodal Huang Date: Sat, 18 Apr 2020 13:59:01 +0800 Subject: [PATCH] feat: support for multiple think tank --- .../ledge-checklist.component.ts | 1 + src/app/app.component.html | 12 ++++- .../markdown-render.component.ts | 7 ++- .../presentation/mobile/mobile.component.ts | 2 +- .../think-tank/think-tank.component.html | 4 +- .../think-tank/think-tank.component.ts | 49 +++++++++++++++++-- .../think-tank/think-tank.module.ts | 2 + src/app/presentation/think-tank/thinktanks.ts | 13 +++++ src/assets/docs/help.md | 2 +- .../mobile-android.md} | 0 10 files changed, 81 insertions(+), 11 deletions(-) create mode 100644 src/app/presentation/think-tank/thinktanks.ts rename src/assets/docs/{mobile-andorid.md => think-tank/mobile-android.md} (100%) diff --git a/projects/ledge-render/src/lib/components/ledge-checklist/ledge-checklist.component.ts b/projects/ledge-render/src/lib/components/ledge-checklist/ledge-checklist.component.ts index 35a1cf8c..887f17eb 100644 --- a/projects/ledge-render/src/lib/components/ledge-checklist/ledge-checklist.component.ts +++ b/projects/ledge-render/src/lib/components/ledge-checklist/ledge-checklist.component.ts @@ -37,6 +37,7 @@ export class LedgeChecklistComponent implements OnInit, OnChanges { subitems: [] }; for (const child of item.children) { + console.log(child); const splitName = child.name.split('：'); checklist.subitems.push({ title: splitName[0], diff --git a/src/app/app.component.html b/src/app/app.component.html index 84bdb27c..fd3542fb 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -34,10 +34,18 @@ - + + + + + + + - diff --git a/src/app/features/markdown-render/markdown-render.component.ts b/src/app/features/markdown-render/markdown-render.component.ts index 9c0cbc4f..ba197f8e 100644 --- a/src/app/features/markdown-render/markdown-render.component.ts +++ b/src/app/features/markdown-render/markdown-render.component.ts @@ -65,7 +65,12 @@ export class MarkdownRenderComponent this.render(); } - ngOnChanges(changes: SimpleChanges): void {} + ngOnChanges(changes: SimpleChanges): void { + if (changes.data) { + this.markdownService.compile(changes.data.currentValue); + this.render(); + } + } @HostListener('window:scroll', ['$event']) handleScroll(event) { diff --git a/src/app/presentation/mobile/mobile.component.ts b/src/app/presentation/mobile/mobile.component.ts index e4cd3b42..25f2a48f 100644 --- a/src/app/presentation/mobile/mobile.component.ts +++ b/src/app/presentation/mobile/mobile.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import * as mdData from 'raw-loader!../../../assets/docs/mobile-andorid.md'; +import * as mdData from 'raw-loader!../../../assets/docs/think-tank/mobile-android.md'; @Component({ selector: 'app-mobile', diff --git a/src/app/presentation/think-tank/think-tank.component.html b/src/app/presentation/think-tank/think-tank.component.html index b11c5ff2..ebb979d6 100644 --- a/src/app/presentation/think-tank/think-tank.component.html +++ b/src/app/presentation/think-tank/think-tank.component.html @@ -1 +1,3 @@ - +
+ +
diff --git a/src/app/presentation/think-tank/think-tank.component.ts b/src/app/presentation/think-tank/think-tank.component.ts index 739cbab4..a47bd456 100644 --- a/src/app/presentation/think-tank/think-tank.component.ts +++ b/src/app/presentation/think-tank/think-tank.component.ts @@ -1,6 +1,8 @@ import { Component, OnInit } from '@angular/core'; -import * as mdData from 'raw-loader!../../../assets/docs/think-tank/qa.md'; import { Title } from '@angular/platform-browser'; +import { ActivatedRoute } from '@angular/router'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; +import { Thinktanks, thinktanks } from './thinktanks'; @Component({ selector: 'app-think-tank', @@ -8,11 +10,48 @@ import { Title } from '@angular/platform-browser'; styleUrls: ['./think-tank.component.scss'], }) export class ThinkTankComponent implements OnInit { - data = mdData.default; + currentSource: string; + src: string; + content: string; + tanks: Thinktanks = thinktanks; - constructor(title: Title) { - title.setTitle('Ledge DevOps 知识平台 - 智库'); + constructor( + private title: Title, + private activatedRoute: ActivatedRoute, + private http: HttpClient + ) {} + + ngOnInit(): void { + this.activatedRoute.paramMap.subscribe((p) => { + const param = p.get('tank'); + const currentCase = this.tanks.find((ca) => ca.source === param); + this.title.setTitle( + `${currentCase.displayName} DevOps 案例学习（互联网公司/传统公司） - Ledge DevOps 知识平台` + ); + this.configSource(param); + }); + } + + private configSource(value: string) { + this.getCase(value); } - ngOnInit(): void {} + async getCase(source: string) { + this.src = this.buildSrc(source); + this.currentSource = source; + + const headers = new HttpHeaders().set( + 'Content-Type', + 'text/plain; charset=utf-8' + ); + this.http + .get(this.src, { headers, responseType: 'text' }) + .subscribe((response) => { + this.content = response; + }); + } + + private buildSrc(source: string) { + return `assets/docs/think-tank/${source}.md`; + } } diff --git a/src/app/presentation/think-tank/think-tank.module.ts b/src/app/presentation/think-tank/think-tank.module.ts index 9b139065..2e259de5 100644 --- a/src/app/presentation/think-tank/think-tank.module.ts +++ b/src/app/presentation/think-tank/think-tank.module.ts @@ -4,11 +4,13 @@ import { CustomMaterialModule } from '../../shared/custom-material.module'; import { SharedModule } from '../../shared/shared.module'; import { RouterModule } from '@angular/router'; import { ThinkTankComponent } from './think-tank.component'; +import { HttpClientModule } from '@angular/common/http'; @NgModule({ declarations: [ThinkTankComponent], imports: [ CommonModule, + HttpClientModule, CustomMaterialModule, SharedModule, RouterModule.forChild([ diff --git a/src/app/presentation/think-tank/thinktanks.ts b/src/app/presentation/think-tank/thinktanks.ts new file mode 100644 index 00000000..2212285f --- /dev/null +++ b/src/app/presentation/think-tank/thinktanks.ts @@ -0,0 +1,13 @@ +export interface Thinktank { + displayName: string; + source: string; + default?: boolean; +} + +export type Thinktanks = Array; + +// todo: 优先级根据内容的质量重新排序。现在的是后来的在后面 + 内容多的在前面，随机组合 +export const thinktanks: Thinktanks = [ + { displayName: 'QA', source: 'qa', default: true }, + { displayName: 'Android', source: 'mobile-android', default: true }, +]; diff --git a/src/assets/docs/help.md b/src/assets/docs/help.md index e9ee481c..d852f389 100644 --- a/src/assets/docs/help.md +++ b/src/assets/docs/help.md @@ -3,7 +3,7 @@ ```checklist - [ ] Eating - [ ] Today - - [ ] breakfast + - [x] breakfast - [ ] brunch - [ ] elevenses - [ ] lunch diff --git a/src/assets/docs/mobile-andorid.md b/src/assets/docs/think-tank/mobile-android.md similarity index 100% rename from src/assets/docs/mobile-andorid.md rename to src/assets/docs/think-tank/mobile-android.md