First round of internationlization
This commit is contained in:
@@ -1,36 +1,32 @@
|
||||
<div>
|
||||
<form cForm [formGroup]="form" (ngSubmit)="onSubmit(model)">
|
||||
<span class="col col-form-label" *ngIf="formLoading$ || modelLoading$ | async">Loading...</span>
|
||||
<span class="col col-form-label" i18n *ngIf="formLoading$ || modelLoading$ | async">Loading...</span>
|
||||
<formly-form [form]="form" [fields]="fields" [model]="model"></formly-form>
|
||||
<div class="d-grid gap-2 d-md-flex">
|
||||
<button class="btn btn-success btn-lg" type="submit"
|
||||
[disabled]="!form.valid && (formLoading$ || modelLoading$ | async)">
|
||||
{{ this.isCreateForm() ? "Create" : "Update" }}
|
||||
{{ submitText }}
|
||||
</button>
|
||||
<button class="btn btn-primary btn-lg" type="button" *ngIf="!this.isCreateForm()"
|
||||
<button class="btn btn-primary btn-lg" i18n type="button" *ngIf="!this.isCreateForm()"
|
||||
[disabled]="!form.valid && (formLoading$ || modelLoading$ | async)"
|
||||
(click)="open(duplicationModal)">
|
||||
Duplicate
|
||||
</button>
|
||||
<button class="btn btn-danger btn-lg" type="button" *ngIf="!this.isCreateForm()"
|
||||
(click)="open(duplicationModal)">Duplicate</button>
|
||||
<button class="btn btn-danger btn-lg" i18n type="button" *ngIf="!this.isCreateForm()"
|
||||
[disabled]="formLoading$ || modelLoading$ | async"
|
||||
(click)="open(confirmDeleteModal)">
|
||||
Delete
|
||||
</button>
|
||||
(click)="open(confirmDeleteModal)">Delete</button>
|
||||
<ng-template #confirmDeleteModal let-modal>
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title">Are you sure you want to delete this {{ this.schema }}?</h4>
|
||||
<button type="button" class="btn-close" aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')"></button>
|
||||
<h4 class="modal-title" i18n>Are you sure you want to delete this {{ this.schema }}?</h4>
|
||||
<button type="button" class="btn-close" i18n-aria-label aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')"></button>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-light" aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')">Cancel</button>
|
||||
<button type="button" class="btn btn-danger" (click)="modal.close('Save click')">Delete</button>
|
||||
<button type="button" class="btn btn-light" i18n i18n-aria-label aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')">Cancel</button>
|
||||
<button type="button" class="btn btn-danger" i18n (click)="modal.close('Save click')">Delete</button>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template #duplicationModal let-modal>
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title">Duplicate {{ this.schema }}</h4>
|
||||
<button type="button" class="btn-close" aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')"></button>
|
||||
<h4 class="modal-title" i18n>Duplicate {{ this.schema }}</h4>
|
||||
<button type="button" class="btn-close" i18n-aria-label aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<crud-card [resource]="this.resource"
|
||||
|
||||
@@ -9,15 +9,15 @@ import { CrudFormlyJsonschemaService } from "../crud-formly-jsonschema.service";
|
||||
import {NgbModal} from "@ng-bootstrap/ng-bootstrap";
|
||||
|
||||
@Component({
|
||||
selector: 'crud-card',
|
||||
templateUrl: './card.component.html',
|
||||
styleUrls: ['./card.component.css']
|
||||
selector: 'crud-card',
|
||||
templateUrl: './card.component.html',
|
||||
styleUrls: ['./card.component.css']
|
||||
})
|
||||
export class CardComponent implements OnInit {
|
||||
@Input() resource: string | undefined;
|
||||
@Input() resource_id: string | null = null;
|
||||
@Input() schema: string | undefined;
|
||||
@Input() is_modal: Boolean = false;
|
||||
@Input() resource: string | undefined;
|
||||
@Input() resource_id: string | null = null;
|
||||
@Input() schema: string | undefined;
|
||||
@Input() is_modal: Boolean = false;
|
||||
|
||||
private _model: {} = {};
|
||||
|
||||
@@ -39,10 +39,10 @@ export class CardComponent implements OnInit {
|
||||
@Output() error: EventEmitter<string> = new EventEmitter();
|
||||
|
||||
|
||||
form = new FormGroup({});
|
||||
fields: FormlyFieldConfig[] = [];
|
||||
form = new FormGroup({});
|
||||
fields: FormlyFieldConfig[] = [];
|
||||
|
||||
schemas = JSON.parse(`{}`);
|
||||
schemas = JSON.parse(`{}`);
|
||||
|
||||
private _formLoading$ = new BehaviorSubject<boolean>(true);
|
||||
private _modelLoading$ = new BehaviorSubject<boolean>(true);
|
||||
@@ -55,12 +55,16 @@ export class CardComponent implements OnInit {
|
||||
return this._modelLoading$.asObservable();
|
||||
}
|
||||
|
||||
constructor(private crudService: CrudService,
|
||||
private formlyJsonschema: CrudFormlyJsonschemaService,
|
||||
private router: Router,
|
||||
private route: ActivatedRoute,
|
||||
private modalService: NgbModal,
|
||||
) { }
|
||||
get submitText() {
|
||||
return this.isCreateForm() ? $localize`Create` : $localize`Update`
|
||||
}
|
||||
|
||||
constructor(private crudService: CrudService,
|
||||
private formlyJsonschema: CrudFormlyJsonschemaService,
|
||||
private router: Router,
|
||||
private route: ActivatedRoute,
|
||||
private modalService: NgbModal,
|
||||
) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
this._formLoading$.next(true);
|
||||
@@ -136,9 +140,9 @@ export class CardComponent implements OnInit {
|
||||
this.modalService.dismissAll();
|
||||
}
|
||||
|
||||
isCreateForm() {
|
||||
return this.resource_id === null;
|
||||
}
|
||||
isCreateForm() {
|
||||
return this.resource_id === null;
|
||||
}
|
||||
|
||||
open(content: any) {
|
||||
this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' }).result.then(
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
<form>
|
||||
|
||||
<button class="btn btn-success btn-lg float-end" type="button" (click)="onCreate()">
|
||||
<button class="btn btn-success btn-lg float-end" type="button" i18n (click)="onCreate()">
|
||||
Create {{ this.schema }}
|
||||
</button>
|
||||
<div class="mb-3 row">
|
||||
<label for="table-complete-search" class="col-xs-3 col-sm-auto col-form-label">Full text search:</label>
|
||||
<label for="table-complete-search" i18n class="col-xs-3 col-sm-auto col-form-label">Full text search:</label>
|
||||
<div class="col-xs-3 col-sm-auto">
|
||||
<input
|
||||
id="table-complete-search"
|
||||
@@ -14,7 +13,7 @@
|
||||
[(ngModel)]="searchTerm"
|
||||
/>
|
||||
</div>
|
||||
<span class="col col-form-label" *ngIf="loading$ | async">Loading...</span>
|
||||
<span class="col col-form-label" i18n *ngIf="loading$ | async">Loading...</span>
|
||||
</div>
|
||||
<div class="table-responsive-md">
|
||||
<table class="table table-striped">
|
||||
@@ -38,11 +37,11 @@
|
||||
</ngb-pagination>
|
||||
|
||||
<select class="form-select" style="width: auto" name="pageSize" [(ngModel)]="pageSize">
|
||||
<option [ngValue]="10">10 items per page</option>
|
||||
<option [ngValue]="15">15 items per page</option>
|
||||
<option [ngValue]="25">25 items per page</option>
|
||||
<option [ngValue]="50">50 items per page</option>
|
||||
<option [ngValue]="100">100 items per page</option>
|
||||
<option i18n [ngValue]="10">10 items per page</option>
|
||||
<option i18n [ngValue]="15">15 items per page</option>
|
||||
<option i18n [ngValue]="25">25 items per page</option>
|
||||
<option i18n [ngValue]="50">50 items per page</option>
|
||||
<option i18n [ngValue]="100">100 items per page</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
Reference in New Issue
Block a user