angular-bootstrap-italia
Version:
<p align="center"> <h1 align="center">Bootstrap Italia + Angular 9</h1>
89 lines • 12.4 kB
JavaScript
import { __decorate } from "tslib";
import { Component, Input, Output, EventEmitter } from '@angular/core';
// Services
import { DynamicFormControlService } from '../dynamic-form-control.service';
let DynamicModalFormComponent = class DynamicModalFormComponent {
constructor(qcs) {
this.qcs = qcs;
this.rows = [];
this.submitEvent = new EventEmitter();
this.newInsertEvent = new EventEmitter();
}
ngOnInit() {
this.needConfirm = false;
const elements = [].concat(...this.rows.map(e => e.items));
this.form = this.qcs.toFormGroup(elements, this.defaultState);
}
ngOnChanges(changes) {
if (changes.defaultState && this.defaultState) {
Object.keys(this.defaultState).forEach(key => {
if (this.form.get(key)) {
this.form.get(key).setValue(this.defaultState[key]);
}
});
}
}
toggleConfirm(state) {
this.needConfirm = state;
}
resetForm() {
this.needConfirm = false;
this.form.reset();
}
get flatValues() {
const formKeys = Object.keys(this.form.getRawValue());
const elements = [].concat(...this.rows.map(e => e.items));
return formKeys.map(key => {
var _a, _b;
let value;
if (typeof this.form.get(key).value !== 'object') {
value = this.form.get(key).value;
}
else {
const elemKey = ((_b = (_a = elements.find(elem => elem.key === key)) === null || _a === void 0 ? void 0 : _a.asyncParams) === null || _b === void 0 ? void 0 : _b.searchField) || elements.find(elem => elem.key === key).formattedValueKey;
value = this.form.get(key).value[elemKey];
}
return {
label: elements.find(elem => elem.key === key).label,
value
};
});
}
onSubmit() {
const rawValue = this.form.getRawValue();
if (this.defaultState) {
const extraKeys = Object.keys(this.defaultState).filter(x => !Object.keys(rawValue).includes(x));
extraKeys.forEach(key => {
rawValue[key] = this.defaultState[key];
});
}
this.submitEvent.emit(rawValue);
}
emitNewInsert(event) {
this.newInsertEvent.emit(event);
}
};
DynamicModalFormComponent.ctorParameters = () => [
{ type: DynamicFormControlService }
];
__decorate([
Input()
], DynamicModalFormComponent.prototype, "rows", void 0);
__decorate([
Input()
], DynamicModalFormComponent.prototype, "defaultState", void 0);
__decorate([
Output()
], DynamicModalFormComponent.prototype, "submitEvent", void 0);
__decorate([
Output()
], DynamicModalFormComponent.prototype, "newInsertEvent", void 0);
DynamicModalFormComponent = __decorate([
Component({
selector: 'lib-dynamic-modal-form',
template: "<div>\n <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\n\n <div class=\"modal-body\">\n\n <div class=\"mt-3\" *ngIf=\"!needConfirm\">\n <div *ngFor=\"let row of rows\">\n <div class=\"form-row\">\n <div *ngFor=\"let item of row.items\" [ngClass]=\"item.class\">\n <lib-dynamic-form-element [field]=\"item\" [form]=\"form\" (newInsertEvent)=\"emitNewInsert($event)\">\n </lib-dynamic-form-element>\n </div>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"needConfirm\">\n\n <div class=\"link-list-wrapper\">\n <ul class=\"link-list\">\n <li *ngFor=\"let elem of flatValues\">\n <span class=\"font-weight-bold\">{{ elem.label }}: </span>\n {{ elem.value }}\n </li>\n </ul>\n </div>\n\n <p class=\"font-weight-bold\">Vuoi confermare il salvataggio?</p>\n\n </div>\n\n </div>\n\n <div class=\"modal-footer mt-3\">\n\n <button class=\"btn btn-outline-secondary btn-sm\" type=\"button\" data-dismiss=\"modal\" (click)=\"form.reset()\"\n *ngIf=\"!needConfirm\">Annulla</button>\n <button class=\"btn btn-primary btn-sm\" type=\"button\" [disabled]=\"!form.valid\" (click)=\"toggleConfirm(true)\"\n *ngIf=\"!needConfirm\">Salva</button>\n\n <button class=\"btn btn-outline-secondary btn-sm\" type=\"button\" (click)=\"toggleConfirm(false)\"\n *ngIf=\"needConfirm\">Annulla</button>\n <button class=\"btn btn-primary btn-sm\" type=\"submit\" [disabled]=\"!form.valid\"\n *ngIf=\"needConfirm\">Conferma</button>\n\n </div>\n\n </form>\n\n</div>\n",
styles: [""]
})
], DynamicModalFormComponent);
export { DynamicModalFormComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHluYW1pYy1tb2RhbC1mb3JtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL2FuZ3VsYXItYm9vdHN0cmFwLWl0YWxpYS8iLCJzb3VyY2VzIjpbImxpYi9jb21wb25lbnRzL2R5bmFtaWMtZm9ybS9keW5hbWljLW1vZGFsLWZvcm0vZHluYW1pYy1tb2RhbC1mb3JtLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBNEIsTUFBTSxlQUFlLENBQUM7QUFNekcsV0FBVztBQUNYLE9BQU8sRUFBRSx5QkFBeUIsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBUTVFLElBQWEseUJBQXlCLEdBQXRDLE1BQWEseUJBQXlCO0lBYXBDLFlBQW9CLEdBQThCO1FBQTlCLFFBQUcsR0FBSCxHQUFHLENBQTJCO1FBWHpDLFNBQUksR0FBc0IsRUFBRSxDQUFDO1FBRzVCLGdCQUFXLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUVqQyxtQkFBYyxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7SUFNUSxDQUFDO0lBRXZELFFBQVE7UUFDTixJQUFJLENBQUMsV0FBVyxHQUFHLEtBQUssQ0FBQztRQUV6QixNQUFNLFFBQVEsR0FBRyxFQUFFLENBQUMsTUFBTSxDQUFDLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztRQUMzRCxJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsV0FBVyxDQUFDLFFBQVEsRUFBRSxJQUFJLENBQUMsWUFBWSxDQUFDLENBQUM7SUFDaEUsQ0FBQztJQUVELFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxJQUFJLE9BQU8sQ0FBQyxZQUFZLElBQUksSUFBSSxDQUFDLFlBQVksRUFBRTtZQUM3QyxNQUFNLENBQUMsSUFB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QUFhLENBQUMsS0FBSztRQUNqQixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNsQyxDQUFDO0NBRUYsQ0FBQTs7WUFuRTBCLHlCQUF5Qjs7QUFYekM7SUFBUixLQUFLLEVBQUU7dURBQThCO0FBQzdCO0lBQVIsS0FBSyxFQUFFOytEQUFtQjtBQUVqQjtJQUFULE1BQU0sRUFBRTs4REFBa0M7QUFFakM7SUFBVCxNQUFNLEVBQUU7aUVBQXFDO0FBUG5DLHlCQUF5QjtJQUxyQyxTQUFTLENBQUM7UUFDVCxRQUFRLEVBQUUsd0JBQXdCO1FBQ2xDLG9xREFBa0Q7O0tBRW5ELENBQUM7R0FDVyx5QkFBeUIsQ0FnRnJDO1NBaEZZLHlCQUF5QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIE9uQ2hhbmdlcywgU2ltcGxlQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybUdyb3VwIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuXG4vLyBNb2RlbHNcbmltcG9ydCB7IEZvcm1Sb3cgfSBmcm9tICcuLi8uLi9mb3JtL2Zvcm0tcm93JztcblxuLy8gU2VydmljZXNcbmltcG9ydCB7IER5bmFtaWNGb3JtQ29udHJvbFNlcnZpY2UgfSBmcm9tICcuLi9keW5hbWljLWZvcm0tY29udHJvbC5zZXJ2aWNlJztcblxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdsaWItZHluYW1pYy1tb2RhbC1mb3JtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2R5bmFtaWMtbW9kYWwtZm9ybS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2R5bmFtaWMtbW9kYWwtZm9ybS5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIER5bmFtaWNNb2RhbEZvcm1Db21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG5cbiAgQElucHV0KCkgcm93czogRm9ybVJvdzxzdHJpbmc+W10gPSBbXTtcbiAgQElucHV0KCkgZGVmYXVsdFN0YXRlOiBhbnk7XG5cbiAgQE91dHB1dCgpIHN1Ym1pdEV2ZW50ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIEBPdXRwdXQoKSBuZXdJbnNlcnRFdmVudCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuICBmb3JtOiBGb3JtR3JvdXA7XG5cbiAgbmVlZENvbmZpcm06IGJvb2xlYW47XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBxY3M6IER5bmFtaWNGb3JtQ29udHJvbFNlcnZpY2UpIHsgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMubmVlZENvbmZpcm0gPSBmYWxzZTtcblxuICAgIGNvbnN0IGVsZW1lbnRzID0gW10uY29uY2F0KC4uLnRoaXMucm93cy5tYXAoZSA9PiBlLml0ZW1zKSk7XG4gICAgdGhpcy5mb3JtID0gdGhpcy5xY3MudG9Gb3JtR3JvdXAoZWxlbWVudHMsIHRoaXMuZGVmYXVsdFN0YXRlKTtcbiAgfVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgICBpZiAoY2hhbmdlcy5kZWZhdWx0U3RhdGUgJiYgdGhpcy5kZWZhdWx0U3RhdGUpIHtcbiAgICAgIE9iamVjdC5rZXlzKHRoaXMuZGVmYXVsdFN0YXRlKS5mb3JFYWNoKGtleSA9PiB7XG4gICAgICAgIGlmICh0aGlzLmZvcm0uZ2V0KGtleSkpIHtcbiAgICAgICAgICB0aGlzLmZvcm0uZ2V0KGtleSkuc2V0VmFsdWUodGhpcy5kZWZhdWx0U3RhdGVba2V5XSk7XG4gICAgICAgIH1cbiAgICAgIH0pO1xuICAgIH1cbiAgfVxuXG4gIHRvZ2dsZUNvbmZpcm0oc3RhdGU6IGJvb2xlYW4pIHtcbiAgICB0aGlzLm5lZWRDb25maXJtID0gc3RhdGU7XG4gIH1cblxuICByZXNldEZvcm0oKSB7XG4gICAgdGhpcy5uZWVkQ29uZmlybSA9IGZhbHNlO1xuICAgIHRoaXMuZm9ybS5yZXNldCgpO1xuICB9XG5cbiAgZ2V0IGZsYXRWYWx1ZXMoKSB7XG4gICAgY29uc3QgZm9ybUtleXMgPSBPYmplY3Qua2V5cyh0aGlzLmZvcm0uZ2V0UmF3VmFsdWUoKSk7XG4gICAgY29uc3QgZWxlbWVudHMgPSBbXS5jb25jYXQoLi4udGhpcy5yb3dzLm1hcChlID0+IGUuaXRlbXMpKTtcblxuICAgIHJldHVybiBmb3JtS2V5cy5tYXAoa2V5ID0+IHtcbiAgICAgIGxldCB2YWx1ZTtcbiAgICAgIGlmICh0eXBlb2YgdGhpcy5mb3JtLmdldChrZXkpLnZhbHVlICE9PSAnb2JqZWN0Jykge1xuICAgICAgICB2YWx1ZSA9IHRoaXMuZm9ybS5nZXQoa2V5KS52YWx1ZTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGNvbnN0IGVsZW1LZXkgPSBlbGVtZW50cy5maW5kKGVsZW0gPT4gZWxlbS5rZXkgPT09IGtleSk/LmFzeW5jUGFyYW1zPy5zZWFyY2hGaWVsZFxuICAgICAgICAgIHx8IGVsZW1lbnRzLmZpbmQoZWxlbSA9PiBlbGVtLmtleSA9PT0ga2V5KS5mb3JtYXR0ZWRWYWx1ZUtleTtcblxuICAgICAgICB2YWx1ZSA9IHRoaXMuZm9ybS5nZXQoa2V5KS52YWx1ZVtlbGVtS2V5XTtcbiAgICAgIH1cblxuICAgICAgcmV0dXJuIHtcbiAgICAgICAgbGFiZWw6IGVsZW1lbnRzLmZpbmQoZWxlbSA9PiBlbGVtLmtleSA9PT0ga2V5KS5sYWJlbCxcbiAgICAgICAgdmFsdWVcbiAgICAgIH07XG4gICAgfSk7XG4gIH1cblxuICBvblN1Ym1pdCgpIHtcbiAgICBjb25zdCByYXdWYWx1ZSA9IHRoaXMuZm9ybS5nZXRSYXdWYWx1ZSgpO1xuXG4gICAgaWYgKHRoaXMuZGVmYXVsdFN0YXRlKSB7XG4gICAgICBjb25zdCBleHRyYUtleXMgPSBPYmplY3Qua2V5cyh0aGlzLmRlZmF1bHRTdGF0ZSkuZmlsdGVyKHggPT4gIU9iamVjdC5rZXlzKHJhd1ZhbHVlKS5pbmNsdWRlcyh4KSk7XG4gICAgICBleHRyYUtleXMuZm9yRWFjaChrZXkgPT4ge1xuICAgICAgICByYXdWYWx1ZVtrZXldID0gdGhpcy5kZWZhdWx0U3RhdGVba2V5XTtcbiAgICAgIH0pO1xuICAgIH1cblxuICAgIHRoaXMuc3VibWl0RXZlbnQuZW1pdChyYXdWYWx1ZSk7XG4gIH1cblxuICBlbWl0TmV3SW5zZXJ0KGV2ZW50KSB7XG4gICAgdGhpcy5uZXdJbnNlcnRFdmVudC5lbWl0KGV2ZW50KTtcbiAgfVxuXG59XG4iXX0=