mmhglobal-dynamicform 2.6.3 → 2.6.5
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/README.md +9 -0
- package/esm2020/lib/sfquerybuilder/sfquerybuilder.component.mjs +174 -94
- package/esm2020/lib/zudf/zudf.component.mjs +13 -7
- package/fesm2015/mmhglobal-dynamicform.mjs +189 -99
- package/fesm2015/mmhglobal-dynamicform.mjs.map +1 -1
- package/fesm2020/mmhglobal-dynamicform.mjs +185 -99
- package/fesm2020/mmhglobal-dynamicform.mjs.map +1 -1
- package/lib/sfquerybuilder/sfquerybuilder.component.d.ts +2 -0
- package/lib/zudf/zudf.component.d.ts +4 -4
- package/package.json +1 -1
|
@@ -11786,11 +11786,11 @@ class ZudfComponent extends ContainerFieldBase {
|
|
|
11786
11786
|
* @param group The ZGroup object to which the field elements will be added.
|
|
11787
11787
|
* @param jsonString The JSON string representing the field elements.
|
|
11788
11788
|
*/
|
|
11789
|
-
renderFieldElementByJsonString(group, jsonString) {
|
|
11789
|
+
renderFieldElementByJsonString(group, jsonString, fieldElementName = '') {
|
|
11790
11790
|
// Parse the JSON string into an array of field elements.
|
|
11791
11791
|
const fieldElementMasterCodeJsonArray = JSON.parse(jsonString);
|
|
11792
11792
|
// Render the field elements.
|
|
11793
|
-
this.renderFieldElement(fieldElementMasterCodeJsonArray);
|
|
11793
|
+
this.renderFieldElement(fieldElementMasterCodeJsonArray, fieldElementName);
|
|
11794
11794
|
}
|
|
11795
11795
|
//#region Display model
|
|
11796
11796
|
/**
|
|
@@ -11884,7 +11884,7 @@ class ZudfComponent extends ContainerFieldBase {
|
|
|
11884
11884
|
* Renders field elements as form controls in a new form group.
|
|
11885
11885
|
* @param {any} fieldElements - The field elements to be rendered.
|
|
11886
11886
|
*/
|
|
11887
|
-
renderFieldElement(fieldElements) {
|
|
11887
|
+
renderFieldElement(fieldElements, fieldElementName = '') {
|
|
11888
11888
|
this.clearZModel();
|
|
11889
11889
|
if (fieldElements) {
|
|
11890
11890
|
this.loadedFieldsSequence = {};
|
|
@@ -11928,6 +11928,12 @@ class ZudfComponent extends ContainerFieldBase {
|
|
|
11928
11928
|
}
|
|
11929
11929
|
});
|
|
11930
11930
|
}
|
|
11931
|
+
// need to call back field element "<field name>_loaded"
|
|
11932
|
+
if (fieldElementName != '') {
|
|
11933
|
+
if (this.group[fieldElementName + '_loaded']) {
|
|
11934
|
+
this.group[fieldElementName + '_loaded'](this.group);
|
|
11935
|
+
}
|
|
11936
|
+
}
|
|
11931
11937
|
// To consider: Trigger the "onchange" event or perform any other necessary actions here
|
|
11932
11938
|
});
|
|
11933
11939
|
}
|
|
@@ -12453,13 +12459,13 @@ class ZudfComponent extends ContainerFieldBase {
|
|
|
12453
12459
|
}
|
|
12454
12460
|
/**
|
|
12455
12461
|
* Validates a form and returns its ZModel if it is valid.
|
|
12456
|
-
*
|
|
12462
|
+
* @param skipRemoveMvgFieldValue Whether to skip removing the values of mvg fields from the zModel object.
|
|
12457
12463
|
* @returns The form's ZModel if it is valid, or undefined otherwise.
|
|
12458
12464
|
*/
|
|
12459
|
-
getValidatedFormZModel() {
|
|
12465
|
+
getValidatedFormZModel(skipRemovePrefix, skipRemoveMvgFieldValue) {
|
|
12460
12466
|
const isValidForm = this.validateAndShowErrorMessage();
|
|
12461
12467
|
if (isValidForm) {
|
|
12462
|
-
return this.getZModel();
|
|
12468
|
+
return this.getZModel(skipRemovePrefix, skipRemoveMvgFieldValue);
|
|
12463
12469
|
}
|
|
12464
12470
|
return undefined;
|
|
12465
12471
|
}
|
|
@@ -12764,8 +12770,11 @@ class SfquerybuilderComponent {
|
|
|
12764
12770
|
this.inOperators = ['in', 'notin'];
|
|
12765
12771
|
this.dropdownOperators = [
|
|
12766
12772
|
this.equalOperator,
|
|
12773
|
+
this.notequalOperator,
|
|
12767
12774
|
this.inOperator,
|
|
12768
|
-
this.notinOperator
|
|
12775
|
+
this.notinOperator,
|
|
12776
|
+
this.isnullOperator,
|
|
12777
|
+
this.isnotnullOperator
|
|
12769
12778
|
];
|
|
12770
12779
|
this.stringOperators = [
|
|
12771
12780
|
this.equalOperator,
|
|
@@ -12784,7 +12793,9 @@ class SfquerybuilderComponent {
|
|
|
12784
12793
|
this.greaterthanOperator,
|
|
12785
12794
|
this.greaterthanorequalOperator,
|
|
12786
12795
|
this.lessthanOperator,
|
|
12787
|
-
this.lessthanorequalOperator
|
|
12796
|
+
this.lessthanorequalOperator,
|
|
12797
|
+
this.isnullOperator,
|
|
12798
|
+
this.isnotnullOperator
|
|
12788
12799
|
];
|
|
12789
12800
|
this.dateOperators = [
|
|
12790
12801
|
this.equalOperator,
|
|
@@ -12792,16 +12803,26 @@ class SfquerybuilderComponent {
|
|
|
12792
12803
|
this.greaterthanOperator,
|
|
12793
12804
|
this.greaterthanorequalOperator,
|
|
12794
12805
|
this.lessthanOperator,
|
|
12795
|
-
this.lessthanorequalOperator
|
|
12806
|
+
this.lessthanorequalOperator,
|
|
12807
|
+
this.isnullOperator,
|
|
12808
|
+
this.isnotnullOperator
|
|
12809
|
+
];
|
|
12810
|
+
this.booleanOperators = [
|
|
12811
|
+
this.equalOperator,
|
|
12812
|
+
this.notequalOperator,
|
|
12813
|
+
this.isnullOperator,
|
|
12814
|
+
this.isnotnullOperator
|
|
12796
12815
|
];
|
|
12797
12816
|
this.selectionComponentList = [];
|
|
12798
12817
|
}
|
|
12799
12818
|
ngOnInit() {
|
|
12800
12819
|
ZComponentHelper.setComponentProperties(this);
|
|
12801
12820
|
ZComponentHelper.registerComponent(this);
|
|
12802
|
-
of(true).pipe(switchMap$1(
|
|
12821
|
+
of(true).pipe(switchMap$1(_ => {
|
|
12803
12822
|
return this.beforeLoadField(this.data);
|
|
12804
|
-
}),
|
|
12823
|
+
}), tap$1(data => {
|
|
12824
|
+
this.data = data;
|
|
12825
|
+
}), switchMap$1(_ => {
|
|
12805
12826
|
return this.loadQueryBuilder();
|
|
12806
12827
|
})).subscribe(() => {
|
|
12807
12828
|
// Where to update operator syntax
|
|
@@ -12823,67 +12844,81 @@ class SfquerybuilderComponent {
|
|
|
12823
12844
|
}
|
|
12824
12845
|
this.fields = this.fieldService.getFormFieldCode(this.data.Value, "FormField", null, null);
|
|
12825
12846
|
try {
|
|
12847
|
+
let isGrouped = true;
|
|
12826
12848
|
return this.fields.pipe(tap$1((data) => {
|
|
12849
|
+
// if [isGrouped = true] include grouping name as prefix
|
|
12850
|
+
if (data.length > 1) {
|
|
12851
|
+
isGrouped = false;
|
|
12852
|
+
}
|
|
12827
12853
|
data.forEach((field) => __awaiter(this, void 0, void 0, function* () {
|
|
12828
|
-
|
|
12829
|
-
if (field.Type == 'category' || field.Type == 'multiselect') {
|
|
12830
|
-
this.sdFilter.push({
|
|
12831
|
-
field: field.Value,
|
|
12832
|
-
label: field.Name,
|
|
12833
|
-
type: 'string',
|
|
12834
|
-
operators: this.dropdownOperators,
|
|
12835
|
-
template: yield this.generateColumnSelection(field),
|
|
12836
|
-
});
|
|
12837
|
-
}
|
|
12838
|
-
else if (field.Type === 'string') {
|
|
12839
|
-
this.sdFilter.push({
|
|
12840
|
-
field: field.Value,
|
|
12841
|
-
label: field.Name,
|
|
12842
|
-
operators: this.stringOperators,
|
|
12843
|
-
type: 'string'
|
|
12844
|
-
});
|
|
12845
|
-
}
|
|
12846
|
-
else if (field.Type === 'date') {
|
|
12847
|
-
this.sdFilter.push({
|
|
12848
|
-
field: field.Value,
|
|
12849
|
-
label: field.Name,
|
|
12850
|
-
operators: this.dateOperators,
|
|
12851
|
-
type: 'date'
|
|
12852
|
-
});
|
|
12853
|
-
}
|
|
12854
|
-
else if (field.Type === 'number') {
|
|
12855
|
-
this.sdFilter.push({
|
|
12856
|
-
field: field.Value,
|
|
12857
|
-
label: field.Name,
|
|
12858
|
-
operators: this.integerOperators,
|
|
12859
|
-
type: 'number'
|
|
12860
|
-
});
|
|
12861
|
-
}
|
|
12862
|
-
else if (field.Value === 'boolean') {
|
|
12863
|
-
this.sdFilter.push({
|
|
12864
|
-
field: field.Value,
|
|
12865
|
-
label: field.Name,
|
|
12866
|
-
type: 'boolean',
|
|
12867
|
-
template: yield this.generateColumnCheckbox(field.Name, false)
|
|
12868
|
-
});
|
|
12869
|
-
}
|
|
12870
|
-
else {
|
|
12871
|
-
this.sdFilter.push({
|
|
12872
|
-
field: field.Value,
|
|
12873
|
-
label: field.Name,
|
|
12874
|
-
type: 'string',
|
|
12875
|
-
operators: this.stringOperators,
|
|
12876
|
-
});
|
|
12877
|
-
}
|
|
12854
|
+
this.renderComponentType(field, isGrouped);
|
|
12878
12855
|
})); //end foreach
|
|
12879
12856
|
this.issfLoaded = true;
|
|
12880
12857
|
}));
|
|
12858
|
+
return of(true);
|
|
12881
12859
|
}
|
|
12882
12860
|
catch (error) {
|
|
12883
12861
|
console.error("error: ", error);
|
|
12884
12862
|
return of(false);
|
|
12885
12863
|
}
|
|
12886
12864
|
}
|
|
12865
|
+
renderComponentType(field, isGrouped, fieldTitle) {
|
|
12866
|
+
var _a;
|
|
12867
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
12868
|
+
let componentLabel = field.SubType ? field.Label : (_a = field.Label) !== null && _a !== void 0 ? _a : field.Name;
|
|
12869
|
+
componentLabel = !isGrouped && !ZComponentHelper.isNullUndefinedEmpty(fieldTitle) ? "[" + fieldTitle + "] " + field.Label : !ZComponentHelper.isNullUndefinedEmpty(field.Label) ? field.Label : field.Name;
|
|
12870
|
+
let componentField = !ZComponentHelper.isNullUndefinedEmpty(fieldTitle) ? fieldTitle + "_" + field.Value : field.Value;
|
|
12871
|
+
if (field.Type === 'category' || field.Type === 'multiselect' || field.Type === 'zuiselectmultiple') {
|
|
12872
|
+
this.sdFilter.push({
|
|
12873
|
+
field: componentField,
|
|
12874
|
+
label: componentLabel,
|
|
12875
|
+
type: 'string',
|
|
12876
|
+
operators: this.dropdownOperators,
|
|
12877
|
+
template: yield this.generateColumnSelection(field),
|
|
12878
|
+
});
|
|
12879
|
+
}
|
|
12880
|
+
else if (field.Type === 'date') {
|
|
12881
|
+
this.sdFilter.push({
|
|
12882
|
+
field: componentField,
|
|
12883
|
+
label: componentLabel,
|
|
12884
|
+
operators: this.dateOperators,
|
|
12885
|
+
type: 'date'
|
|
12886
|
+
});
|
|
12887
|
+
}
|
|
12888
|
+
else if (field.Type === 'number') {
|
|
12889
|
+
this.sdFilter.push({
|
|
12890
|
+
field: componentField,
|
|
12891
|
+
label: componentLabel,
|
|
12892
|
+
operators: this.integerOperators,
|
|
12893
|
+
type: 'number'
|
|
12894
|
+
});
|
|
12895
|
+
}
|
|
12896
|
+
else if (field.Value === 'boolean') {
|
|
12897
|
+
this.sdFilter.push({
|
|
12898
|
+
field: componentField,
|
|
12899
|
+
label: componentLabel,
|
|
12900
|
+
type: 'boolean',
|
|
12901
|
+
operators: this.booleanOperators,
|
|
12902
|
+
template: yield this.generateColumnCheckbox(field.Name, false)
|
|
12903
|
+
});
|
|
12904
|
+
}
|
|
12905
|
+
else if (field.Type === 'kcard') {
|
|
12906
|
+
if (field.Value.length > 0) {
|
|
12907
|
+
field.Value.forEach((item) => __awaiter(this, void 0, void 0, function* () {
|
|
12908
|
+
this.renderComponentType(item, isGrouped, field.Title);
|
|
12909
|
+
}));
|
|
12910
|
+
}
|
|
12911
|
+
}
|
|
12912
|
+
else {
|
|
12913
|
+
this.sdFilter.push({
|
|
12914
|
+
field: componentField,
|
|
12915
|
+
label: componentLabel,
|
|
12916
|
+
operators: this.stringOperators,
|
|
12917
|
+
type: 'string'
|
|
12918
|
+
});
|
|
12919
|
+
}
|
|
12920
|
+
});
|
|
12921
|
+
}
|
|
12887
12922
|
//#region checkbox
|
|
12888
12923
|
generateColumnCheckbox(label, value) {
|
|
12889
12924
|
return {
|
|
@@ -12915,7 +12950,8 @@ class SfquerybuilderComponent {
|
|
|
12915
12950
|
if (this.data['Filters']) {
|
|
12916
12951
|
this.filters = ZComponentHelper.getGroupEvalValue.call(this, this.data['Filters'], this.group);
|
|
12917
12952
|
}
|
|
12918
|
-
return createElement('input', { attrs: { 'type': 'text', 'style': 'display: none' } });
|
|
12953
|
+
//return createElement('input', { attrs: { 'type': 'text', 'style': 'display: none' } });
|
|
12954
|
+
return createElement('input', { attrs: { 'type': 'text' } });
|
|
12919
12955
|
},
|
|
12920
12956
|
// Destroy the custom component
|
|
12921
12957
|
destroy: (args) => {
|
|
@@ -12940,6 +12976,7 @@ class SfquerybuilderComponent {
|
|
|
12940
12976
|
},
|
|
12941
12977
|
// Wire events for the custom component.
|
|
12942
12978
|
write: (args) => {
|
|
12979
|
+
var _a;
|
|
12943
12980
|
//origin
|
|
12944
12981
|
if (fieldElementData['ValueOptions']) {
|
|
12945
12982
|
// convert to property name used in the component rendering
|
|
@@ -12953,49 +12990,102 @@ class SfquerybuilderComponent {
|
|
|
12953
12990
|
const selectionComponent = this.generateSelectionComponent(args, optionList);
|
|
12954
12991
|
selectionComponent.appendTo('#' + args.elements.id);
|
|
12955
12992
|
}
|
|
12993
|
+
// manual dropdown or zudf manual dropdown
|
|
12994
|
+
else if (fieldElementData['SelectOptions'] && Array.isArray(fieldElementData['SelectOptions'])) {
|
|
12995
|
+
// convert to property name used in the component rendering
|
|
12996
|
+
const optionList = [];
|
|
12997
|
+
fieldElementData['SelectOptions'].forEach((item) => {
|
|
12998
|
+
optionList.push({
|
|
12999
|
+
text: item['text'],
|
|
13000
|
+
value: item['value']
|
|
13001
|
+
});
|
|
13002
|
+
});
|
|
13003
|
+
const selectionComponent = this.generateSelectionComponent(args, optionList);
|
|
13004
|
+
selectionComponent.appendTo('#' + args.elements.id);
|
|
13005
|
+
}
|
|
13006
|
+
// zudf ResourceURL / Common Master dropdown
|
|
12956
13007
|
else {
|
|
12957
13008
|
const selectOptions = fieldElementData['SelectOptions'];
|
|
12958
13009
|
const selectOptionsResourceURL = selectOptions['ResourceURL'];
|
|
12959
|
-
|
|
12960
|
-
if (
|
|
12961
|
-
|
|
12962
|
-
if (this.
|
|
12963
|
-
|
|
13010
|
+
// ResourceURL dropdown
|
|
13011
|
+
if (selectOptionsResourceURL) {
|
|
13012
|
+
const prefixResourceURLChecking = selectOptionsResourceURL + '_' + args.elements.id;
|
|
13013
|
+
if (!this.loadedDropdownOptions.includes(prefixResourceURLChecking)) {
|
|
13014
|
+
this.loadedDropdownOptions.push(prefixResourceURLChecking);
|
|
13015
|
+
if (this.filters) {
|
|
13016
|
+
selectOptions['Filters'] = this.filters;
|
|
13017
|
+
}
|
|
13018
|
+
const param = Object.assign({}, DefaultPageSettingParams);
|
|
13019
|
+
param.pageSize = selectOptions['PageSize'];
|
|
13020
|
+
param.columns = selectOptions['Columns'];
|
|
13021
|
+
param.filters += selectOptions['Filters'];
|
|
13022
|
+
param.sortColumnName = selectOptions['SortColumnName'];
|
|
13023
|
+
param.sortOrder = selectOptions['SortOrder'];
|
|
13024
|
+
// Need delay 400ms if not 3rd segment (value) will not be rendered.
|
|
13025
|
+
this.webApiService.httpPost$(this.resourceApiService.getPageUrl(selectOptionsResourceURL), param).pipe(delay(400), map((resp) => {
|
|
13026
|
+
const optionList = [];
|
|
13027
|
+
resp.dataSet.forEach((item) => {
|
|
13028
|
+
optionList.push({
|
|
13029
|
+
text: item[selectOptions['Name']],
|
|
13030
|
+
value: item[selectOptions['Value']]
|
|
13031
|
+
});
|
|
13032
|
+
});
|
|
13033
|
+
const selectionComponent = this.generateSelectionComponent(args, optionList);
|
|
13034
|
+
selectionComponent.appendTo('#' + args.elements.id);
|
|
13035
|
+
//const xxx = document.getElementById(args.elements.id);
|
|
13036
|
+
////xxx.appendChild(inputElement);
|
|
13037
|
+
//xxx.style.display = 'block';
|
|
13038
|
+
//#region used for updateSelectionOption
|
|
13039
|
+
const existingIndex = this.selectionComponentList.findIndex((item) => item.componentId === args.elements.id);
|
|
13040
|
+
if (existingIndex !== -1) {
|
|
13041
|
+
// Object with the same componentId exists, replace resourceUrl
|
|
13042
|
+
this.selectionComponentList[existingIndex].resourceUrl = selectOptionsResourceURL;
|
|
13043
|
+
}
|
|
13044
|
+
else {
|
|
13045
|
+
// Object with componentId doesn't exist, push a new object
|
|
13046
|
+
this.selectionComponentList.push({
|
|
13047
|
+
resourceUrl: selectOptionsResourceURL,
|
|
13048
|
+
componentId: args.elements.id
|
|
13049
|
+
});
|
|
13050
|
+
}
|
|
13051
|
+
//#endregion
|
|
13052
|
+
})).subscribe();
|
|
12964
13053
|
}
|
|
12965
|
-
|
|
12966
|
-
|
|
12967
|
-
|
|
12968
|
-
|
|
12969
|
-
|
|
12970
|
-
|
|
12971
|
-
this.webApiService.httpPost$(this.resourceApiService.getPageUrl(selectOptionsResourceURL), param).pipe(delay(300), map((resp) => {
|
|
13054
|
+
}
|
|
13055
|
+
// zudf Common Master dropdown
|
|
13056
|
+
else if (fieldElementData.zudfDataSourceType && fieldElementData.zudfDataSourceType === "resource") {
|
|
13057
|
+
// extract zudf_dropdown from session storage
|
|
13058
|
+
const zudf_dropdown = sessionStorage.getItem("zudf_dropdown") ? JSON.parse(sessionStorage.getItem("zudf_dropdown")) : null;
|
|
13059
|
+
if (zudf_dropdown) {
|
|
12972
13060
|
const optionList = [];
|
|
12973
|
-
|
|
12974
|
-
|
|
12975
|
-
|
|
12976
|
-
value
|
|
12977
|
-
|
|
13061
|
+
zudf_dropdown.forEach(res => {
|
|
13062
|
+
const name = res.text.split("Options")[0];
|
|
13063
|
+
if (fieldElementData.Label === name) {
|
|
13064
|
+
res.value.forEach(val => {
|
|
13065
|
+
optionList.push({
|
|
13066
|
+
text: val['Name'],
|
|
13067
|
+
value: val['Id']
|
|
13068
|
+
});
|
|
13069
|
+
});
|
|
13070
|
+
}
|
|
12978
13071
|
});
|
|
12979
13072
|
const selectionComponent = this.generateSelectionComponent(args, optionList);
|
|
12980
13073
|
selectionComponent.appendTo('#' + args.elements.id);
|
|
12981
|
-
|
|
12982
|
-
|
|
12983
|
-
|
|
12984
|
-
|
|
12985
|
-
|
|
12986
|
-
|
|
12987
|
-
|
|
12988
|
-
|
|
12989
|
-
|
|
12990
|
-
|
|
12991
|
-
|
|
12992
|
-
|
|
12993
|
-
|
|
12994
|
-
|
|
12995
|
-
|
|
12996
|
-
}
|
|
12997
|
-
//#endregion
|
|
12998
|
-
})).subscribe();
|
|
13074
|
+
}
|
|
13075
|
+
}
|
|
13076
|
+
// User List dropdown
|
|
13077
|
+
else if (fieldElementData.zudfDataSourceType && fieldElementData.zudfDataSourceType === "user") {
|
|
13078
|
+
const optionList = [];
|
|
13079
|
+
const userList = JSON.parse((_a = sessionStorage === null || sessionStorage === void 0 ? void 0 : sessionStorage.getItem("userList")) !== null && _a !== void 0 ? _a : 'null');
|
|
13080
|
+
//const arrayTest = userList.map(({ SelectionName, Id }) => ({ text: SelectionName, value: Id }));
|
|
13081
|
+
userList.forEach((item) => {
|
|
13082
|
+
optionList.push({
|
|
13083
|
+
text: item['SelectionName'],
|
|
13084
|
+
value: item['Id']
|
|
13085
|
+
});
|
|
13086
|
+
});
|
|
13087
|
+
const selectionComponent = this.generateSelectionComponent(args, optionList);
|
|
13088
|
+
selectionComponent.appendTo('#' + args.elements.id);
|
|
12999
13089
|
}
|
|
13000
13090
|
}
|
|
13001
13091
|
} //end write
|
|
@@ -13097,10 +13187,10 @@ class SfquerybuilderComponent {
|
|
|
13097
13187
|
const callFunc = eval('this.' + beforeLoadField);
|
|
13098
13188
|
if (typeof callFunc === "function") {
|
|
13099
13189
|
const newFunc = callFunc.bind(this);
|
|
13100
|
-
return newFunc(event, this);
|
|
13190
|
+
return newFunc(event, this, fieldElementData);
|
|
13101
13191
|
}
|
|
13102
13192
|
}
|
|
13103
|
-
return of(
|
|
13193
|
+
return of(fieldElementData);
|
|
13104
13194
|
}
|
|
13105
13195
|
}
|
|
13106
13196
|
SfquerybuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SfquerybuilderComponent, deps: [{ token: i2.FieldService }, { token: i2.ResourceApiService }, { token: i2.WebApiService }], target: i0.ɵɵFactoryTarget.Component });
|