ngx-rs-ant 0.3.9 → 0.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/box-container/PluginManager.d.ts +1 -1
- package/box-container/box-container.component.d.ts +2 -3
- package/box-container/box-item/box-item.component.d.ts +1 -1
- package/esm2020/box-container/PluginManager.mjs +3 -9
- package/esm2020/box-container/box-container.component.mjs +4 -4
- package/esm2020/box-container/box-item/box-item.component.mjs +3 -3
- package/esm2020/box-container/plugin-active/plugin-active.component.mjs +3 -3
- package/esm2020/data-grid/data-grid.component.mjs +19 -1
- package/esm2020/form/form.component.mjs +30 -18
- package/fesm2015/ngx-rs-ant.mjs +53 -31
- package/fesm2015/ngx-rs-ant.mjs.map +1 -1
- package/fesm2020/ngx-rs-ant.mjs +56 -31
- package/fesm2020/ngx-rs-ant.mjs.map +1 -1
- package/form/form.component.d.ts +4 -4
- package/package.json +1 -1
package/fesm2020/ngx-rs-ant.mjs
CHANGED
|
@@ -6,7 +6,7 @@ import { CommonModule } from '@angular/common';
|
|
|
6
6
|
import { Subject, lastValueFrom } from 'rxjs';
|
|
7
7
|
import * as i2 from 'ng-devui/input-number';
|
|
8
8
|
import * as i3 from '@angular/forms';
|
|
9
|
-
import {
|
|
9
|
+
import { FormsModule, UntypedFormGroup, ReactiveFormsModule } from '@angular/forms';
|
|
10
10
|
import * as i1$1 from 'ng-devui/dragdrop';
|
|
11
11
|
import { DevUIModule, FormLayout } from 'ng-devui';
|
|
12
12
|
import CustomStore from 'devextreme/data/custom_store';
|
|
@@ -138,10 +138,10 @@ class PluginActiveComponent {
|
|
|
138
138
|
}
|
|
139
139
|
}
|
|
140
140
|
PluginActiveComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: PluginActiveComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
141
|
-
PluginActiveComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: PluginActiveComponent, selector: "rs-plugin-active", host: { properties: { "style": "this._style" } }, ngImport: i0, template: "<div class=\"active-bar\">\r\n <span>{{name}}</span>\r\n <i *ngIf=\"showClose\" class=\"icon-close\" (click)=\"onItemCloseIconClick($event)\"></i>\r\n</div>\r\n<rs-divider *ngIf=\"showDivider\" [targetElement]=\"targetElement\" direction=\"row\"\r\n
|
|
141
|
+
PluginActiveComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: PluginActiveComponent, selector: "rs-plugin-active", host: { properties: { "style": "this._style" } }, ngImport: i0, template: "<div class=\"active-bar\">\r\n <span>{{name}}</span>\r\n <i *ngIf=\"showClose\" class=\"icon-close\" (click)=\"onItemCloseIconClick($event)\"></i>\r\n</div>\r\n<rs-divider *ngIf=\"showDivider\" [targetElement]=\"targetElement\" direction=\"row\"\r\n (dividerClick)=\"splitItem('column')\"></rs-divider>\r\n<rs-divider *ngIf=\"showDivider\" [targetElement]=\"targetElement\" direction=\"column\"\r\n (dividerClick)=\"splitItem('row')\"></rs-divider>\r\n", styles: [":host{display:none;position:absolute;border:1px solid var(--devui-brand, #5e7ce0);pointer-events:none}:host .active-bar{padding:2px 4px;color:#fff;background-color:var(--devui-brand, #5e7ce0);position:absolute;top:-23px;right:-1px;display:flex;align-items:center;pointer-events:all;white-space:nowrap}:host .active-bar span{flex:auto}:host .active-bar i{flex:none;margin-left:8px;cursor:pointer}:host .active-bar i:hover{color:var(--devui-danger, #f66f6a)}.plugin-active>:host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DividerComponent, selector: "rs-divider", inputs: ["direction", "targetElement"], outputs: ["dividerClick"] }] });
|
|
142
142
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: PluginActiveComponent, decorators: [{
|
|
143
143
|
type: Component,
|
|
144
|
-
args: [{ selector: 'rs-plugin-active', template: "<div class=\"active-bar\">\r\n <span>{{name}}</span>\r\n <i *ngIf=\"showClose\" class=\"icon-close\" (click)=\"onItemCloseIconClick($event)\"></i>\r\n</div>\r\n<rs-divider *ngIf=\"showDivider\" [targetElement]=\"targetElement\" direction=\"row\"\r\n
|
|
144
|
+
args: [{ selector: 'rs-plugin-active', template: "<div class=\"active-bar\">\r\n <span>{{name}}</span>\r\n <i *ngIf=\"showClose\" class=\"icon-close\" (click)=\"onItemCloseIconClick($event)\"></i>\r\n</div>\r\n<rs-divider *ngIf=\"showDivider\" [targetElement]=\"targetElement\" direction=\"row\"\r\n (dividerClick)=\"splitItem('column')\"></rs-divider>\r\n<rs-divider *ngIf=\"showDivider\" [targetElement]=\"targetElement\" direction=\"column\"\r\n (dividerClick)=\"splitItem('row')\"></rs-divider>\r\n", styles: [":host{display:none;position:absolute;border:1px solid var(--devui-brand, #5e7ce0);pointer-events:none}:host .active-bar{padding:2px 4px;color:#fff;background-color:var(--devui-brand, #5e7ce0);position:absolute;top:-23px;right:-1px;display:flex;align-items:center;pointer-events:all;white-space:nowrap}:host .active-bar span{flex:auto}:host .active-bar i{flex:none;margin-left:8px;cursor:pointer}:host .active-bar i:hover{color:var(--devui-danger, #f66f6a)}.plugin-active>:host{display:block}\n"] }]
|
|
145
145
|
}], propDecorators: { _style: [{
|
|
146
146
|
type: HostBinding,
|
|
147
147
|
args: ['style']
|
|
@@ -250,7 +250,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
250
250
|
}] } });
|
|
251
251
|
|
|
252
252
|
class PluginManager {
|
|
253
|
-
static createComponent(boxItem, index, style, config, editMode = false,
|
|
253
|
+
static createComponent(boxItem, index, style, config, editMode = false, formGroup) {
|
|
254
254
|
const plugin = PluginFactory.get(config.name);
|
|
255
255
|
if (!plugin) {
|
|
256
256
|
console.error('undefined plugin: ' + config.name);
|
|
@@ -262,12 +262,7 @@ class PluginManager {
|
|
|
262
262
|
const instance = componentRef.instance;
|
|
263
263
|
Object.assign(instance, config.pluginConfig);
|
|
264
264
|
if (plugin.category === 'form') {
|
|
265
|
-
|
|
266
|
-
instance.control = new UntypedFormControl('');
|
|
267
|
-
}
|
|
268
|
-
else {
|
|
269
|
-
instance.control = control.get(config.pluginConfig.field);
|
|
270
|
-
}
|
|
265
|
+
instance.formGroup = formGroup;
|
|
271
266
|
}
|
|
272
267
|
if (editMode) {
|
|
273
268
|
instance.onRemove = () => {
|
|
@@ -440,7 +435,7 @@ class BoxItemComponent {
|
|
|
440
435
|
const item = this.config.list[i];
|
|
441
436
|
switch (item.type) {
|
|
442
437
|
case 'plugin':
|
|
443
|
-
PluginManager.createComponent(this, i, item.style, item.config, this.editMode, this.
|
|
438
|
+
PluginManager.createComponent(this, i, item.style, item.config, this.editMode, this.formGroup);
|
|
444
439
|
break;
|
|
445
440
|
case 'item':
|
|
446
441
|
const boxItemComponentRef = itemHost.viewContainerRef.createComponent(BoxItemComponent);
|
|
@@ -448,7 +443,7 @@ class BoxItemComponent {
|
|
|
448
443
|
instance.editMode = this.editMode;
|
|
449
444
|
instance.style = item.style;
|
|
450
445
|
instance.config = item.config;
|
|
451
|
-
instance.
|
|
446
|
+
instance.formGroup = this.formGroup;
|
|
452
447
|
instance.pDirection = this.config.direction;
|
|
453
448
|
if (this.editMode) {
|
|
454
449
|
instance.leaveOneItem.subscribe((item) => {
|
|
@@ -586,7 +581,7 @@ class BoxContainerComponent {
|
|
|
586
581
|
const instance = boxItemComponentRef.instance;
|
|
587
582
|
instance.editMode = this.editMode;
|
|
588
583
|
instance.config = this.config;
|
|
589
|
-
instance.
|
|
584
|
+
instance.formGroup = this.formGroup;
|
|
590
585
|
instance.leaveOneItem?.subscribe((item) => {
|
|
591
586
|
if (item.type === 'item') {
|
|
592
587
|
Object.assign(instance.config, item);
|
|
@@ -599,7 +594,7 @@ class BoxContainerComponent {
|
|
|
599
594
|
}
|
|
600
595
|
}
|
|
601
596
|
BoxContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: BoxContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
602
|
-
BoxContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: BoxContainerComponent, selector: "rs-box-container", inputs: { editMode: "editMode", config: "config",
|
|
597
|
+
BoxContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: BoxContainerComponent, selector: "rs-box-container", inputs: { editMode: "editMode", config: "config", formGroup: "formGroup" }, viewQueries: [{ propertyName: "boxContainerContent", first: true, predicate: ["boxContainerContent"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<ng-container #boxContainerContent></ng-container>\n", styles: [":host{flex:auto;position:relative;display:flex;overflow:auto}\n"] });
|
|
603
598
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: BoxContainerComponent, decorators: [{
|
|
604
599
|
type: Component,
|
|
605
600
|
args: [{ selector: 'rs-box-container', template: "<ng-container #boxContainerContent></ng-container>\n", styles: [":host{flex:auto;position:relative;display:flex;overflow:auto}\n"] }]
|
|
@@ -607,7 +602,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
607
602
|
type: Input
|
|
608
603
|
}], config: [{
|
|
609
604
|
type: Input
|
|
610
|
-
}],
|
|
605
|
+
}], formGroup: [{
|
|
611
606
|
type: Input
|
|
612
607
|
}], boxContainerContent: [{
|
|
613
608
|
type: ViewChild,
|
|
@@ -721,6 +716,24 @@ class DataGridComponent {
|
|
|
721
716
|
format: this.typeMap[column.dataType].format
|
|
722
717
|
});
|
|
723
718
|
}
|
|
719
|
+
else if (column.type === 'FILE') {
|
|
720
|
+
this.columns.push({
|
|
721
|
+
dataField: column.name,
|
|
722
|
+
caption: column.caption,
|
|
723
|
+
dataType: 'string',
|
|
724
|
+
alignment: 'left',
|
|
725
|
+
filterOperations: []
|
|
726
|
+
});
|
|
727
|
+
}
|
|
728
|
+
else if (column.type === 'RELATION') {
|
|
729
|
+
this.columns.push({
|
|
730
|
+
dataField: column.name,
|
|
731
|
+
caption: column.caption,
|
|
732
|
+
dataType: 'string',
|
|
733
|
+
alignment: 'left',
|
|
734
|
+
filterOperations: ['=']
|
|
735
|
+
});
|
|
736
|
+
}
|
|
724
737
|
}
|
|
725
738
|
});
|
|
726
739
|
this.dataSource = new CustomStore({
|
|
@@ -820,37 +833,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
820
833
|
class FormComponent {
|
|
821
834
|
constructor() {
|
|
822
835
|
this.layoutDirection = FormLayout.Vertical;
|
|
823
|
-
this.model = {};
|
|
824
|
-
this.items = [];
|
|
825
836
|
this.formGroup = new UntypedFormGroup({});
|
|
826
|
-
this.
|
|
837
|
+
this.submitCallback = new EventEmitter();
|
|
827
838
|
}
|
|
828
839
|
ngOnInit() {
|
|
829
|
-
this.formGroup.valueChanges.subscribe(model => {
|
|
830
|
-
this.model = model;
|
|
831
|
-
});
|
|
832
840
|
this.service.getMetadataByTemplate(this.tenant, this.className, this.template).subscribe((response) => {
|
|
833
|
-
this.config =
|
|
834
|
-
this.items = ["modifier", "createTime", "modifyTime", "creator", "number"];
|
|
835
|
-
for (let item of this.items) {
|
|
836
|
-
this.formGroup.addControl(item, new UntypedFormControl(this.model[item]));
|
|
837
|
-
}
|
|
841
|
+
this.config = response.data.template;
|
|
838
842
|
});
|
|
843
|
+
if (this.copyOid || this.oid) {
|
|
844
|
+
const attributes = encodeURIComponent(Object.keys(this.formGroup.controls).join(';'));
|
|
845
|
+
this.service.getOne(this.tenant, this.className, this.copyOid || this.oid, attributes).subscribe((response) => {
|
|
846
|
+
if (this.copyOid) {
|
|
847
|
+
delete response.data.oid;
|
|
848
|
+
}
|
|
849
|
+
this.formGroup.patchValue(response.data);
|
|
850
|
+
});
|
|
851
|
+
}
|
|
839
852
|
}
|
|
840
853
|
submit($event) {
|
|
841
|
-
|
|
842
|
-
|
|
854
|
+
if (!$event.valid) {
|
|
855
|
+
this.submitCallback.emit();
|
|
856
|
+
return;
|
|
857
|
+
}
|
|
858
|
+
this.service.createOrUpdate(this.tenant, this.className, {
|
|
859
|
+
oid: this.oid,
|
|
860
|
+
...this.formGroup.value
|
|
861
|
+
}).subscribe((response) => {
|
|
862
|
+
this.submitCallback.emit(response);
|
|
863
|
+
});
|
|
843
864
|
}
|
|
844
865
|
}
|
|
845
866
|
FormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: FormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
846
|
-
FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: FormComponent, selector: "rs-form", inputs: { tenant: "tenant", className: "className", template: "template", service: "service" }, outputs: {
|
|
867
|
+
FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: FormComponent, selector: "rs-form", inputs: { tenant: "tenant", className: "className", oid: "oid", copyOid: "copyOid", template: "template", service: "service" }, outputs: { submitCallback: "submitCallback" }, viewQueries: [{ propertyName: "formSubmitter", first: true, predicate: ["formSubmitter"], descendants: true }], ngImport: i0, template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submit($event)\">\n <ng-container *ngIf=\"config\">\n <rs-box-container [config]=\"config\" [formGroup]=\"formGroup\"></rs-box-container>\n </ng-container>\n <button #formSubmitter dFormSubmit=\"click\"></button>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.FormDirective, selector: "[dForm]", inputs: ["layout", "labelSize", "labelAlign", "dFeedbackType", "dHasFeedback"], outputs: ["dSubmit"], exportAs: ["dForm"] }, { kind: "directive", type: i2$2.DFormSubmitDirective, selector: "[dFormSubmit]", inputs: ["dFormSubmit", "dFormSubmitData"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: BoxContainerComponent, selector: "rs-box-container", inputs: ["editMode", "config", "formGroup"] }] });
|
|
847
868
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: FormComponent, decorators: [{
|
|
848
869
|
type: Component,
|
|
849
|
-
args: [{ selector: 'rs-form', template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submit($event)\">\n <ng-container *ngIf=\"config
|
|
870
|
+
args: [{ selector: 'rs-form', template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submit($event)\">\n <ng-container *ngIf=\"config\">\n <rs-box-container [config]=\"config\" [formGroup]=\"formGroup\"></rs-box-container>\n </ng-container>\n <button #formSubmitter dFormSubmit=\"click\"></button>\n</form>\n" }]
|
|
850
871
|
}], propDecorators: { tenant: [{
|
|
851
872
|
type: Input
|
|
852
873
|
}], className: [{
|
|
853
874
|
type: Input
|
|
875
|
+
}], oid: [{
|
|
876
|
+
type: Input
|
|
877
|
+
}], copyOid: [{
|
|
878
|
+
type: Input
|
|
854
879
|
}], template: [{
|
|
855
880
|
type: Input
|
|
856
881
|
}], service: [{
|
|
@@ -858,7 +883,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
858
883
|
}], formSubmitter: [{
|
|
859
884
|
type: ViewChild,
|
|
860
885
|
args: ['formSubmitter']
|
|
861
|
-
}],
|
|
886
|
+
}], submitCallback: [{
|
|
862
887
|
type: Output
|
|
863
888
|
}] } });
|
|
864
889
|
|