Start page versions modal
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
parent
36d97c9eca
commit
0e0d237d4f
@ -0,0 +1,25 @@
|
||||
<div class="container">
|
||||
<div class="header">
|
||||
<div class="title">Page Versions</div>
|
||||
<button title="Close" class="close" (click)="dismiss()">
|
||||
<i class="fa fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="contents">
|
||||
<ion-list>
|
||||
<ion-item button *ngFor="let version of pageVersions" (click)="onVersionClick(version)" [color]="selectedVersion === version ? 'primary' : ''">
|
||||
<ion-label>
|
||||
<h4 style="font-weight: bold">
|
||||
#{{ version.versionNum }}
|
||||
<span class="version-date">({{ version.versionCreateDate.toLocaleString() }})</span>
|
||||
<span class="current-version"><i *ngIf="version.currentVersion" class="fa fa-asterisk" title="Current version"></i></span>
|
||||
</h4>
|
||||
<h5>{{ version.versionMessage }} by {{ version.userDisplay }}</h5>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
<div class="preview">
|
||||
Page preview will be here.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,49 @@
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
.header {
|
||||
background: lightgrey;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.title {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.close {
|
||||
padding: 10px 15px;
|
||||
background: #ff6666;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.contents {
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
ion-list {
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
max-width: 325px;
|
||||
}
|
||||
|
||||
.preview {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.version-date {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.current-version {
|
||||
color: darkgreen;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
@ -0,0 +1,36 @@
|
||||
import {Component, Input, OnInit} from '@angular/core';
|
||||
import {AlertController, ModalController} from '@ionic/angular';
|
||||
import {EditorService} from '../../service/editor.service';
|
||||
import {PageVersionRecord} from '../../structures/PageRecord';
|
||||
|
||||
@Component({
|
||||
selector: 'app-version-modal',
|
||||
templateUrl: './version-modal.component.html',
|
||||
styleUrls: ['./version-modal.component.scss'],
|
||||
})
|
||||
export class VersionModalComponent implements OnInit {
|
||||
@Input() pageId: string;
|
||||
public pageVersions: PageVersionRecord[] = [];
|
||||
public selectedVersion?: PageVersionRecord;
|
||||
|
||||
constructor(
|
||||
protected alerts: AlertController,
|
||||
protected modals: ModalController,
|
||||
protected editorService: EditorService,
|
||||
) {
|
||||
console.log('version modal', this);
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
this.pageVersions = await this.editorService.loadPageVersions(this.pageId);
|
||||
await this.onVersionClick(this.pageVersions[0]);
|
||||
}
|
||||
|
||||
dismiss() {
|
||||
this.modals.dismiss();
|
||||
}
|
||||
|
||||
async onVersionClick(version: PageVersionRecord) {
|
||||
this.selectedVersion = version;
|
||||
}
|
||||
}
|
Loading…
Reference in new issue