90 lines
3.2 KiB
HTML
90 lines
3.2 KiB
HTML
<mat-card appearance="outlined">
|
|
<mat-card-content >
|
|
<form [formGroup]="form" novalidate>
|
|
<mat-form-field class="example-full-width">
|
|
<mat-label class="label-style">Title</mat-label>
|
|
<input matInput
|
|
formControlName="title"
|
|
>
|
|
</mat-form-field>
|
|
|
|
<mat-label class="label-style">Title image</mat-label>
|
|
<mat-divider></mat-divider>
|
|
<table class="example-full-width">
|
|
<tr>
|
|
<td>
|
|
<mat-form-field class="example-full-width">
|
|
<mat-label>Title image</mat-label>
|
|
<input matInput
|
|
formControlName="titleimage"
|
|
[disabled]="true"
|
|
>
|
|
</mat-form-field>
|
|
<div>
|
|
<button mat-raised-button color="primary" (click)="openSelectImageDialog('100ms', '5ms')">Select image</button>
|
|
<button mat-raised-button color="primary" (click)="openUploadImageDialog('100ms', '5ms')">Upload image</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
@if(tutorial.titleimage){
|
|
<div class="example-full-width content-center">
|
|
<img style="width: 716px; height: 400px" src="{{tutorial.titleimage}}" alt="">
|
|
</div>
|
|
}
|
|
<div class="example-full-width">
|
|
<mat-label class="label-style">Body</mat-label>
|
|
<mat-divider></mat-divider>
|
|
<mat-tab-group>
|
|
<mat-tab label="Markdown text | Result">
|
|
<textarea class="variable-textarea"
|
|
|
|
formControlName = "body"
|
|
(input)="onBodyChange($event)"
|
|
>
|
|
|
|
</textarea>
|
|
<markdown class="variable-binding" [data]="tutorial.body"></markdown>
|
|
</mat-tab>
|
|
<!--<mat-tab label="Editor">
|
|
<form novalidate>
|
|
<angular-markdown-editor style="color: #1a1a1a"
|
|
textareaId="editor2"
|
|
[options]="editorOptions"
|
|
name="markdownText"
|
|
[(ngModel)]="tutorial.body"
|
|
(onFullscreenExit)="hidePreview()"
|
|
>
|
|
</angular-markdown-editor>
|
|
</form>
|
|
</mat-tab>-->
|
|
<mat-tab label="Result">
|
|
<markdown class="preview" [data]="tutorial.body"></markdown>
|
|
</mat-tab>
|
|
<mat-tab label="Example">
|
|
<textarea class="variable-textarea" [value]="markdown"></textarea>
|
|
<markdown class="variable-binding" [data]="markdown"></markdown>
|
|
</mat-tab>
|
|
</mat-tab-group>
|
|
</div>
|
|
</form>
|
|
</mat-card-content>
|
|
<mat-divider></mat-divider>
|
|
<mat-card-actions>
|
|
|
|
<button matButton (click)="updateTutorial()" [disabled]="form.invalid">Save</button>
|
|
@if (hasError){
|
|
<mat-error>
|
|
{{errorMessage}}
|
|
</mat-error>
|
|
}
|
|
@if(submitted) {
|
|
<h4>Tutorial was submitted successfully!</h4>
|
|
<button matButton routerLink="../tutorial-add">Add new tutorial</button>
|
|
<button matButton routerLink="../tutorials-list">Back to list</button>
|
|
}
|
|
|
|
</mat-card-actions>
|
|
</mat-card>
|
|
|