Fix bug of preview content.
This commit is contained in:
@@ -86,7 +86,7 @@
|
||||
<h1>{{ publication.title }}</h1>
|
||||
<h2>{{ publication.description }}</h2>
|
||||
</header>
|
||||
<main [innerHTML]="publication.parsedText"></main>
|
||||
<main [innerHTML]="publicationInEdition.parsedText"></main>
|
||||
}
|
||||
</div>
|
||||
</mat-tab>
|
||||
|
||||
@@ -1,20 +1,20 @@
|
||||
import { CommonModule, Location } from "@angular/common";
|
||||
import { Component, EventEmitter, inject, Input, OnChanges, OnDestroy, OnInit, Output } from "@angular/core";
|
||||
import { Component, EventEmitter, inject, Input, OnChanges, OnDestroy, Output } from "@angular/core";
|
||||
import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms";
|
||||
import { MatDialogModule } from "@angular/material/dialog";
|
||||
import { MatIconModule } from "@angular/material/icon";
|
||||
import { MatInputModule } from "@angular/material/input";
|
||||
import { MatProgressSpinnerModule } from "@angular/material/progress-spinner";
|
||||
import { MatSelectModule } from "@angular/material/select";
|
||||
import { MatTabsModule } from "@angular/material/tabs";
|
||||
import { MatTooltipModule } from "@angular/material/tooltip";
|
||||
import { filter, map, Observable, of, Subscription } from "rxjs";
|
||||
import { Publication } from "../../core/rest-services/publications/model/publication";
|
||||
import { PictureSelectionDialog } from "./picture-selection-dialog/picture-selection-dialog.component";
|
||||
import { SubmitButtonComponent } from "../submit-button/submit-button.component";
|
||||
import { PublicationEditionService } from "./publication-edition.service";
|
||||
import { MatSelectModule } from "@angular/material/select";
|
||||
import { CategoryService } from "../../core/service/category.service";
|
||||
import { map, Observable, of, Subscription } from "rxjs";
|
||||
import { Category } from "../../core/rest-services/category/model/category";
|
||||
import { Publication } from "../../core/rest-services/publications/model/publication";
|
||||
import { CategoryService } from "../../core/service/category.service";
|
||||
import { SubmitButtonComponent } from "../submit-button/submit-button.component";
|
||||
import { PictureSelectionDialog } from "./picture-selection-dialog/picture-selection-dialog.component";
|
||||
import { PublicationEditionService } from "./publication-edition.service";
|
||||
|
||||
@Component({
|
||||
selector: 'app-publication-edition',
|
||||
@@ -46,11 +46,11 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
|
||||
@Output()
|
||||
publicationSave = new EventEmitter<Publication>();
|
||||
|
||||
publicationInEdition!: Publication;
|
||||
private readonly categoryService = inject(CategoryService);
|
||||
private readonly formBuilder = inject(FormBuilder);
|
||||
private readonly location = inject(Location);
|
||||
private readonly publicationEditionService = inject(PublicationEditionService);
|
||||
private publicationInEdition!: Publication;
|
||||
private subscriptions: Subscription[] = [];
|
||||
|
||||
publicationEditionForm: FormGroup = this.formBuilder.group({
|
||||
@@ -92,7 +92,7 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
|
||||
ngOnChanges(): void {
|
||||
this.ngOnDestroy();
|
||||
|
||||
@@ -129,12 +129,13 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
|
||||
this.subscriptions.push(categoryIdChangeSubscription);
|
||||
|
||||
const publicationSubscription = this.publicationEditionService.state$.subscribe(state => {
|
||||
console.log(state.publication.parsedText.substring(0, 15));
|
||||
this.publicationInEdition = state.publication;
|
||||
this.publicationEditionForm.controls['title'].setValue(this.publication.title, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['description'].setValue(this.publication.description, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['text'].setValue(this.publication.text, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['illustrationId'].setValue(this.publication.illustrationId, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['categoryId'].setValue(this.publication.categoryId, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['title'].setValue(this.publicationInEdition.title, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['description'].setValue(this.publicationInEdition.description, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['text'].setValue(this.publicationInEdition.text, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['illustrationId'].setValue(this.publicationInEdition.illustrationId, { emitEvent: false });
|
||||
this.publicationEditionForm.controls['categoryId'].setValue(this.publicationInEdition.categoryId, { emitEvent: false });
|
||||
});
|
||||
this.subscriptions.push(publicationSubscription);
|
||||
}
|
||||
|
||||
@@ -9,6 +9,7 @@ import { PublicationRestService } from "../../core/rest-services/publications/pu
|
||||
import { copy } from "../../core/utils/ObjectUtils";
|
||||
import { CodeBlockDialog } from "./code-block-dialog/code-block-dialog.component";
|
||||
import { PictureSelectionDialog } from "./picture-selection-dialog/picture-selection-dialog.component";
|
||||
import { PreviewContentRequest } from "../../core/rest-services/publications/model/preview";
|
||||
|
||||
declare let Prism: any;
|
||||
|
||||
@@ -76,7 +77,7 @@ export class PublicationEditionService implements OnDestroy {
|
||||
}
|
||||
|
||||
private _save(state: PublicationEditionState): void {
|
||||
this.stateSubject.next(state);
|
||||
this.stateSubject.next(state);
|
||||
}
|
||||
|
||||
get isLoading$(): Observable<boolean> {
|
||||
@@ -268,9 +269,12 @@ export class PublicationEditionService implements OnDestroy {
|
||||
const state = this._state;
|
||||
|
||||
this.isPreviewingSubject.next(true);
|
||||
this.publicationRestService.preview(state.publication.text)
|
||||
.then(parsedText => {
|
||||
state.publication.parsedText = parsedText;
|
||||
const request: PreviewContentRequest = {
|
||||
text: state.publication.text
|
||||
};
|
||||
this.publicationRestService.preview(request)
|
||||
.then(response => {
|
||||
state.publication.parsedText = response.text;
|
||||
this._save(state);
|
||||
setTimeout(() => Prism.highlightAll(), 1000);
|
||||
})
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
export interface PreviewContentRequest {
|
||||
text: string;
|
||||
}
|
||||
|
||||
export interface PreviewContentResponse {
|
||||
text: string;
|
||||
}
|
||||
@@ -2,6 +2,7 @@ import { HttpClient, HttpParams } from '@angular/common/http';
|
||||
import { Injectable, inject } from '@angular/core';
|
||||
import { last, lastValueFrom } from 'rxjs';
|
||||
import { Publication } from './model/publication';
|
||||
import { PreviewContentRequest, PreviewContentResponse } from './model/preview';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
@@ -31,9 +32,8 @@ export class PublicationRestService {
|
||||
return lastValueFrom(this.httpClient.get<Publication[]>('/api/publications', { params }));
|
||||
}
|
||||
|
||||
preview(publicationText: string): Promise<string> {
|
||||
const request = { text: publicationText };
|
||||
return lastValueFrom(this.httpClient.post<string>('/api/publications/preview', request));
|
||||
preview(request: PreviewContentRequest): Promise<PreviewContentResponse> {
|
||||
return lastValueFrom(this.httpClient.post<PreviewContentResponse>('/api/publications/preview', request));
|
||||
}
|
||||
|
||||
delete(publicationId: string): Promise<void> {
|
||||
|
||||
Reference in New Issue
Block a user