diff --git a/src/app/presentation/case-study/case-study.component.html b/src/app/presentation/case-study/case-study.component.html index cc90f749..2001c778 100644 --- a/src/app/presentation/case-study/case-study.component.html +++ b/src/app/presentation/case-study/case-study.component.html @@ -3,13 +3,13 @@

案例（出处见来源）

- + diff --git a/src/app/presentation/case-study/case-study.component.ts b/src/app/presentation/case-study/case-study.component.ts index a9da97e5..8666ba39 100644 --- a/src/app/presentation/case-study/case-study.component.ts +++ b/src/app/presentation/case-study/case-study.component.ts @@ -1,45 +1,53 @@ -import {Component, OnInit} from '@angular/core'; -import {Title} from '@angular/platform-browser'; -import {StorageMap} from '@ngx-pwa/local-storage'; -import {ActivatedRoute, Params, Router} from '@angular/router'; +import { Component, OnInit } from '@angular/core'; +import { Title } from '@angular/platform-browser'; +import { StorageMap } from '@ngx-pwa/local-storage'; +import { ActivatedRoute, Params, Router } from '@angular/router'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; @Component({ selector: 'app-case-study', templateUrl: './case-study.component.html', - styleUrls: ['./case-study.component.scss'] + styleUrls: ['./case-study.component.scss'], }) export class CaseStudyComponent implements OnInit { cases = [ - {displayName: '美团', source: 'meituan'}, - {displayName: 'Ledge', source: 'ledge'}, - {displayName: '大型银行转型', source: 'tw-banks'}, - {displayName: 'DaoCloud', source: 'daocloud'}, - {displayName: '招商银行', source: 'cmb'}, - {displayName: 'HP', source: 'hp'}, - {displayName: 'Etsy', source: 'etsy'}, - {displayName: '中国银行', source: 'china-bank'}, - {displayName: '携程', source: 'xuecheng'}, - {displayName: '农业银行', source: 'nonghang'}, - {displayName: '华为', source: 'huawei'}, - {displayName: '百度', source: 'baidu'}, - {displayName: '腾讯', source: 'tencent'}, - {displayName: '博云', source: 'bocloud'}, - {displayName: '阿里巴巴', source: 'alibaba'}, - {displayName: 'Atlassian', source: 'atlassian'}, - {displayName: '政采云', source: 'zhengcaiyun'}, - {displayName: '大搜车', source: 'dasouche'}, - {displayName: '小米', source: 'xiaomi'}, - {displayName: '微博', source: 'weibo'} + { displayName: '美团', source: 'meituan' }, + { displayName: 'Ledge', source: 'ledge' }, + { displayName: '大型银行转型', source: 'tw-banks' }, + { displayName: 'DaoCloud', source: 'daocloud' }, + { displayName: '招商银行', source: 'cmb' }, + { displayName: 'HP', source: 'hp' }, + { displayName: 'Etsy', source: 'etsy' }, + { displayName: '中国银行', source: 'china-bank' }, + { displayName: '携程', source: 'xuecheng' }, + { displayName: '农业银行', source: 'nonghang' }, + { displayName: '华为', source: 'huawei' }, + { displayName: '百度', source: 'baidu' }, + { displayName: '腾讯', source: 'tencent' }, + { displayName: '博云', source: 'bocloud' }, + { displayName: '阿里巴巴', source: 'alibaba' }, + { displayName: 'Atlassian', source: 'atlassian' }, + { displayName: '政采云', source: 'zhengcaiyun' }, + { displayName: '大搜车', source: 'dasouche' }, + { displayName: '小米', source: 'xiaomi' }, + { displayName: '微博', source: 'weibo' }, ]; currentSource: string; src: string; + content: string; - constructor(title: Title, private storage: StorageMap, private activatedRoute: ActivatedRoute, private router: Router) { + constructor( + title: Title, + private storage: StorageMap, + private activatedRoute: ActivatedRoute, + private router: Router, + private http: HttpClient + ) { title.setTitle('DevOps 知识平台 Ledge - 案例学习'); } ngOnInit(): void { - this.activatedRoute.queryParams.subscribe(params => { + this.activatedRoute.queryParams.subscribe((params) => { const source = params.source; if (source) { this.configSource(source); @@ -60,23 +68,28 @@ export class CaseStudyComponent implements OnInit { } private configSource(value: string) { - this.currentSource = value; - this.src = this.buildSrc(this.currentSource); + this.getCase(value); } - clickCase(source: string) { + getCase(source: string) { this.src = this.buildSrc(source); this.currentSource = source; - this.storage.set('casestudy.last', source).subscribe(); - - const queryParams: Params = { source }; - this.router.navigate( - [], - { - relativeTo: this.activatedRoute, - queryParams, - queryParamsHandling: 'merge', // remove to replace all query params by provided + const headers = new HttpHeaders().set( + 'Content-Type', + 'text/plain; charset=utf-8' + ); + this.http + .get(this.src, { headers, responseType: 'text' }) + .subscribe((response) => { + this.storage.set('casestudy.last', source).subscribe(); + this.content = response; + const queryParams: Params = { source }; + this.router.navigate([], { + relativeTo: this.activatedRoute, + queryParams, + queryParamsHandling: 'merge', // remove to replace all query params by provided + }); }); } diff --git a/src/app/presentation/mobile/mobile.component.html b/src/app/presentation/mobile/mobile.component.html index 7bdaa83b..b11c5ff2 100644 --- a/src/app/presentation/mobile/mobile.component.html +++ b/src/app/presentation/mobile/mobile.component.html @@ -1 +1 @@ - + diff --git a/src/app/presentation/mobile/mobile.component.ts b/src/app/presentation/mobile/mobile.component.ts index e3b500e7..e4cd3b42 100644 --- a/src/app/presentation/mobile/mobile.component.ts +++ b/src/app/presentation/mobile/mobile.component.ts @@ -1,15 +1,15 @@ import { Component, OnInit } from '@angular/core'; +import * as mdData from 'raw-loader!../../../assets/docs/mobile-andorid.md'; @Component({ selector: 'app-mobile', templateUrl: './mobile.component.html', - styleUrls: ['./mobile.component.scss'] + styleUrls: ['./mobile.component.scss'], }) export class MobileComponent implements OnInit { + data = mdData.default; - constructor() { } - - ngOnInit(): void { - } + constructor() {} + ngOnInit(): void {} } diff --git a/src/app/presentation/resources/resources.component.html b/src/app/presentation/resources/resources.component.html index 13f638ce..b11c5ff2 100644 --- a/src/app/presentation/resources/resources.component.html +++ b/src/app/presentation/resources/resources.component.html @@ -1 +1 @@ - + diff --git a/src/app/presentation/resources/resources.component.ts b/src/app/presentation/resources/resources.component.ts index 974e0895..57b18410 100644 --- a/src/app/presentation/resources/resources.component.ts +++ b/src/app/presentation/resources/resources.component.ts @@ -1,18 +1,18 @@ import { Component, OnInit } from '@angular/core'; -import {Title} from '@angular/platform-browser'; +import { Title } from '@angular/platform-browser'; +import * as mdData from 'raw-loader!../../../assets/docs/resources.md'; @Component({ selector: 'app-resources', templateUrl: './resources.component.html', - styleUrls: ['./resources.component.scss'] + styleUrls: ['./resources.component.scss'], }) export class ResourcesComponent implements OnInit { + data = mdData.default; constructor(title: Title) { title.setTitle('DevOps 知识平台 Ledge - 相关资源'); } - ngOnInit(): void { - } - + ngOnInit(): void {} } diff --git a/src/app/presentation/solution/solution.component.html b/src/app/presentation/solution/solution.component.html index f942a1ad..42f41862 100644 --- a/src/app/presentation/solution/solution.component.html +++ b/src/app/presentation/solution/solution.component.html @@ -3,13 +3,13 @@

解决方案

- + diff --git a/src/app/presentation/solution/solution.component.ts b/src/app/presentation/solution/solution.component.ts index 4ecacba4..160a35b5 100644 --- a/src/app/presentation/solution/solution.component.ts +++ b/src/app/presentation/solution/solution.component.ts @@ -2,25 +2,31 @@ import { Component, OnInit } from '@angular/core'; import { Title } from '@angular/platform-browser'; import { StorageMap } from '@ngx-pwa/local-storage'; import { ActivatedRoute, Params, Router } from '@angular/router'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; @Component({ selector: 'app-solution', templateUrl: './solution.component.html', - styleUrls: ['./solution.component.scss'] + styleUrls: ['./solution.component.scss'], }) export class SolutionComponent implements OnInit { - solutions = [ - {displayName: 'Coding', source: 'coding'}, - ]; + solutions = [{ displayName: 'Coding', source: 'coding' }]; currentSource: string; src: string; + content: string; - constructor(title: Title, private storage: StorageMap, private activatedRoute: ActivatedRoute, private router: Router) { + constructor( + title: Title, + private storage: StorageMap, + private activatedRoute: ActivatedRoute, + private router: Router, + private http: HttpClient + ) { title.setTitle('DevOps 知识平台 Ledge - 解决方案'); } ngOnInit(): void { - this.activatedRoute.queryParams.subscribe(params => { + this.activatedRoute.queryParams.subscribe((params) => { const source = params.source; if (source) { this.configSource(source); @@ -41,23 +47,29 @@ export class SolutionComponent implements OnInit { } private configSource(value: string) { - this.currentSource = value; - this.src = this.buildSrc(this.currentSource); + this.getCase(value); } - clickCase(source: string) { + getCase(source: string) { this.src = this.buildSrc(source); this.currentSource = source; - this.storage.set('solution.last', source).subscribe(); + const headers = new HttpHeaders().set( + 'Content-Type', + 'text/plain; charset=utf-8' + ); + this.http + .get(this.src, { headers, responseType: 'text' }) + .subscribe((response) => { + const queryParams: Params = { source }; + this.storage.set('solution.last', source).subscribe(); + this.content = response; - const queryParams: Params = { source }; - this.router.navigate( - [], - { - relativeTo: this.activatedRoute, - queryParams, - queryParamsHandling: 'merge', // remove to replace all query params by provided + this.router.navigate([], { + relativeTo: this.activatedRoute, + queryParams, + queryParamsHandling: 'merge', // remove to replace all query params by provided + }); }); } diff --git a/src/app/shared/components/markdown-render/markdown-render.component.ts b/src/app/shared/components/markdown-render/markdown-render.component.ts index 75e95e68..603eadac 100644 --- a/src/app/shared/components/markdown-render/markdown-render.component.ts +++ b/src/app/shared/components/markdown-render/markdown-render.component.ts @@ -25,9 +25,6 @@ import Tocify, { TocItem } from './tocify'; }) export class MarkdownRenderComponent implements OnInit, OnChanges, AfterViewInit { - @Input() - src: string; - @Input() showToc = false; @Input()