mirror of
https://github.com/turt2live/matrix-dimension.git
synced 2024-10-01 01:05:53 -04:00
Use templating for the edit/add views
This commit is contained in:
parent
0b63c8eb85
commit
c95ab2bbb2
@ -2,37 +2,7 @@
|
|||||||
<my-spinner></my-spinner>
|
<my-spinner></my-spinner>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div *ngIf="!isLoading">
|
<ng-template #widgetParams let-widget="widget">
|
||||||
<my-ibox title="Add {{ defaultName }}" [isCollapsible]="true" [defaultCollapsed]="defaultExpandedWidgetId">
|
|
||||||
<div class="my-ibox-content">
|
|
||||||
<form (submit)="addWidget()" novalidate name="addForm">
|
|
||||||
<label class="label-block">
|
|
||||||
Widget Name
|
|
||||||
<input type="text" class="form-control"
|
|
||||||
placeholder="{{ defaultName }}"
|
|
||||||
[(ngModel)]="newWidget.dimension.newName" name="widget-name-new"
|
|
||||||
[disabled]="isUpdating"/>
|
|
||||||
</label>
|
|
||||||
<label class="label-block">
|
|
||||||
Widget URL
|
|
||||||
<input type="text" class="form-control"
|
|
||||||
placeholder="https://matrix.org"
|
|
||||||
[(ngModel)]="newWidget.dimension.newUrl" name="widget-url-new"
|
|
||||||
[disabled]="isUpdating"/>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
<button type="submit" class="btn btn-sm btn-success" [disabled]="isUpdating">
|
|
||||||
<i class="fa fa-plus"></i> Add Widget
|
|
||||||
</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</my-ibox>
|
|
||||||
|
|
||||||
<my-ibox *ngFor="let widget of widgets trackById"
|
|
||||||
[isCollapsible]="true" [defaultCollapsed]="widget.id !== defaultExpandedWidgetId"
|
|
||||||
title="{{ widget.name || widget.url || defaultName }}">
|
|
||||||
<div class="my-ibox-content">
|
|
||||||
<form (submit)="saveWidget(widget)" novalidate name="addForm">
|
|
||||||
<label class="label-block">
|
<label class="label-block">
|
||||||
Widget Name
|
Widget Name
|
||||||
<input type="text" class="form-control"
|
<input type="text" class="form-control"
|
||||||
@ -47,17 +17,38 @@
|
|||||||
[(ngModel)]="widget.dimension.newUrl" name="widget-url-{{widget.id}}"
|
[(ngModel)]="widget.dimension.newUrl" name="widget-url-{{widget.id}}"
|
||||||
[disabled]="isUpdating"/>
|
[disabled]="isUpdating"/>
|
||||||
</label>
|
</label>
|
||||||
|
</ng-template>
|
||||||
|
|
||||||
|
<div *ngIf="!isLoading">
|
||||||
|
<my-ibox title="Add {{ defaultName }}" [isCollapsible]="true" [defaultCollapsed]="defaultExpandedWidgetId">
|
||||||
|
<div class="my-ibox-content">
|
||||||
|
<form (submit)="addWidget()" novalidate name="addForm">
|
||||||
|
<ng-container *ngTemplateOutlet="widgetParams;context:{widget:newWidget}"></ng-container>
|
||||||
|
|
||||||
|
<div style="margin-top: 25px">
|
||||||
|
<button type="submit" class="btn btn-sm btn-success" [disabled]="isUpdating">
|
||||||
|
<i class="fa fa-plus"></i> Add Widget
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</my-ibox>
|
||||||
|
|
||||||
|
<my-ibox *ngFor="let widget of widgets trackById"
|
||||||
|
[isCollapsible]="true" [defaultCollapsed]="widget.id !== defaultExpandedWidgetId"
|
||||||
|
title="{{ widget.name || widget.url || defaultName }}">
|
||||||
|
<div class="my-ibox-content">
|
||||||
|
<form (submit)="saveWidget(widget)" novalidate name="addForm">
|
||||||
|
<ng-container *ngTemplateOutlet="widgetParams;context:{widget:widget}"></ng-container>
|
||||||
|
|
||||||
|
<div style="margin-top: 25px">
|
||||||
<button type="submit" class="btn btn-sm btn-primary" [disabled]="isUpdating">
|
<button type="submit" class="btn btn-sm btn-primary" [disabled]="isUpdating">
|
||||||
<i class="fa fa-save"></i> Save Widget
|
<i class="fa fa-save"></i> Save Widget
|
||||||
</button>
|
</button>
|
||||||
<button type="button" class="btn btn-sm btn-danger" [disabled]="isUpdating">
|
<button type="button" class="btn btn-sm btn-danger" [disabled]="isUpdating">
|
||||||
<i class="fa fa-times"></i> Remove Widget
|
<i class="fa fa-times"></i> Remove Widget
|
||||||
</button>
|
</button>
|
||||||
<button type="button" class="btn btn-sm btn-white" [disabled]="isUpdating" (click)="resetWidget(widget)"
|
</div>
|
||||||
*ngIf="hasChanges(widget)">
|
|
||||||
<i class="fa fa-undo"></i> Undo Changes
|
|
||||||
</button>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</my-ibox>
|
</my-ibox>
|
||||||
|
@ -313,21 +313,4 @@ export class NewWidgetComponent {
|
|||||||
this.unpackWidget(widget);
|
this.unpackWidget(widget);
|
||||||
this.OnWidgetPreparedForEdit.emit(widget);
|
this.OnWidgetPreparedForEdit.emit(widget);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Determines if a widget has had any changes made to it
|
|
||||||
* @param {EditableWidget} widget The widget to check
|
|
||||||
* @returns {boolean} True if the widget has been edited
|
|
||||||
*/
|
|
||||||
public hasChanges(widget: EditableWidget): boolean {
|
|
||||||
if (widget.dimension.newUrl !== this.unwrapUrl(widget.url)) return true;
|
|
||||||
if (widget.dimension.newName !== widget.name) return true;
|
|
||||||
if (widget.dimension.newTitle !== widget.data.title) return true;
|
|
||||||
|
|
||||||
const currentData = JSON.parse(JSON.stringify(widget.data || "{}"));
|
|
||||||
const newData = JSON.parse(JSON.stringify(widget.dimension.newData || "{}"));
|
|
||||||
if (currentData !== newData) return true;
|
|
||||||
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user