@michalrakus/x-react-web-lib 1.9.0 → 1.11.0

package/lib/components/XCalendar.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="react" />
+import React from "react";
 export declare const XCalendar: (props: {
     id?: string | undefined;
     value: Date | null;
     onChange: (value: Date | null) => void;
+    onBlur?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
     readOnly?: boolean | undefined;
     datetime?: boolean | undefined;
 }) => JSX.Element;

package/lib/components/XCalendar.js

@@ -22,6 +22,6 @@ var XCalendar = function (props) {
         }
     };
     var datetime = (_a = props.datetime) !== null && _a !== void 0 ? _a : false;
-    return (react_1.default.createElement(calendar_1.Calendar, { id: props.id, value: props.value, onChange: onChange, disabled: props.readOnly, showIcon: true, showOnFocus: false, dateFormat: (0, XUtilsConversions_1.dateFormatCalendar)(), showTime: datetime, showSeconds: datetime, inputClassName: datetime ? 'x-input-datetime' : 'x-input-date' }));
+    return (react_1.default.createElement(calendar_1.Calendar, { id: props.id, value: props.value, onChange: onChange, disabled: props.readOnly, showIcon: true, showOnFocus: false, dateFormat: (0, XUtilsConversions_1.dateFormatCalendar)(), showTime: datetime, showSeconds: datetime, inputClassName: datetime ? 'x-input-datetime' : 'x-input-date', onBlur: props.onBlur }));
 };
 exports.XCalendar = XCalendar;

package/lib/components/XDropdownDT.d.ts

@@ -1,11 +1,14 @@
 /// <reference types="react" />
 import { XFormBase } from "./XFormBase";
 import { XDropdownOptionsMap } from "./XFormDataTable2";
+import { XCustomFilter } from "../serverApi/FindParam";
 export declare const XDropdownDT: (props: {
     form: XFormBase;
     entity: string;
     assocField: string;
     displayField: string;
+    sortField?: string | undefined;
+    filter?: XCustomFilter | undefined;
     dropdownOptionsMap: XDropdownOptionsMap;
     onDropdownOptionsMapChange: (dropdownOptionsMap: XDropdownOptionsMap) => void;
     rowData: any;

package/lib/components/XDropdownDT.js

@@ -63,17 +63,22 @@ exports.XDropdownDT = void 0;
 var react_1 = __importStar(require("react"));
 var XUtils_1 = require("./XUtils");
 var dropdown_1 = require("primereact/dropdown");
+var XUtilsMetadata_1 = require("./XUtilsMetadata");
 var XDropdownDT = function (props) {
     // poznamka: nacitanie/ulozenie options je vytiahnute do parent komponentu XFormDataTable koli tomu aby sme nenacitavali options pre kazdy riadok tabulky
+    // "members"
+    var xAssoc = XUtilsMetadata_1.XUtilsMetadata.getXAssocToOne(XUtilsMetadata_1.XUtilsMetadata.getXEntity(props.entity), props.assocField);
+    var idField = XUtilsMetadata_1.XUtilsMetadata.getXEntity(xAssoc.entityName).idField;
     // parameter [] zabezpeci ze sa metoda zavola len po prvom renderingu (a nie po kazdej zmene stavu (zavolani setNieco()))
     (0, react_1.useEffect)(function () {
         //console.log("XDropdownDT - zavolany useEffect *******************")
         findOptions();
     }, []); // eslint-disable-line react-hooks/exhaustive-deps
     var findOptions = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var options;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
+        var options, xAssoc_1;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
                 case 0:
                     options = props.dropdownOptionsMap[props.assocField];
                     if (!(options === undefined)) return [3 /*break*/, 2];
@@ -83,15 +88,17 @@ var XDropdownDT = function (props) {
                     // Nacitanie z DB sa koli asynchronnosti vykona az po zavolani tejto metody pre vsetky riadky tabulky, co je pre nas neskoro.
                     // ak by tu tento riadok nebol, tak by sa options nacitavali tolkokrat, kolko je riadkov v tabulke
                     props.dropdownOptionsMap[props.assocField] = [];
-                    return [4 /*yield*/, XUtils_1.XUtils.fetchMany('findRowsForAssoc', { entity: props.entity, assocField: props.assocField })];
+                    xAssoc_1 = XUtilsMetadata_1.XUtilsMetadata.getXAssocToOne(XUtilsMetadata_1.XUtilsMetadata.getXEntity(props.entity), props.assocField);
+                    return [4 /*yield*/, XUtils_1.XUtils.fetchRows(xAssoc_1.entityName, props.filter, (_a = props.sortField) !== null && _a !== void 0 ? _a : props.displayField)];
                 case 1:
-                    options = _a.sent();
+                    //options = await XUtils.fetchMany('findRowsForAssoc', {entity: props.entity, assocField: props.assocField});
+                    options = _b.sent();
                     options.splice(0, 0, {}); // null polozka (nepridavat pre not null atributy)
                     props.dropdownOptionsMap[props.assocField] = options;
                     //console.log("XDropdownDT - findOptions - citali sme options pre field = " + props.assocField);
                     //console.log(props.dropdownOptionsMap);
                     props.onDropdownOptionsMapChange(props.dropdownOptionsMap); // vyrenderujeme nacitane hodnoty
-                    _a.label = 2;
+                    _b.label = 2;
                 case 2: return [2 /*return*/];
             }
         });
@@ -123,6 +130,6 @@ var XDropdownDT = function (props) {
     }
     var options = props.dropdownOptionsMap[props.assocField] !== undefined ? props.dropdownOptionsMap[props.assocField] : []; // mozno mozme do options prasknut rovno undefined...
     // appendTo={document.body} appenduje overlay panel na element body - eliminuje problem s overflow (pozri poznamku v XDropdownDTFilter)
-    return (react_1.default.createElement(dropdown_1.Dropdown, { appendTo: document.body, id: props.assocField, optionLabel: props.displayField, value: assocObject, options: options, onChange: function (e) { return onValueChange(props.assocField, props.rowData, e.target.value); } }));
+    return (react_1.default.createElement(dropdown_1.Dropdown, { appendTo: document.body, id: props.assocField, optionLabel: props.displayField, value: assocObject, options: options, dataKey: idField, onChange: function (e) { return onValueChange(props.assocField, props.rowData, e.target.value); } }));
 };
 exports.XDropdownDT = XDropdownDT;

package/lib/components/XDropdownForEntity.d.ts

@@ -14,6 +14,7 @@ export interface XDropdownForEntityProps {
     filter?: XCustomFilter;
 }
 export declare class XDropdownForEntity extends Component<XDropdownForEntityProps> {
+    protected idField: string;
     state: {
         options: any[];
     };

package/lib/components/XDropdownForEntity.js

@@ -89,6 +89,7 @@ exports.XDropdownForEntity = void 0;
 var react_1 = __importStar(require("react"));
 var dropdown_1 = require("primereact/dropdown");
 var XUtils_1 = require("./XUtils");
+var XUtilsMetadata_1 = require("./XUtilsMetadata");
 // vseobecny Dropdown ktoreho parametrom je entity, zobrazuje zaznamy danej entity, po selectnuti vracia zaznam danej entity
 // ambicia je pouzivat ho vsade - vo formulari, vo filtroch, vo form tabulke, priamo aplikacnym programmerom
 // dalo by sa vyclenit este XDropdownBase, ktory by dostaval ako parameter options (bol by nezavisly od DB), zatial ho nerobime,
@@ -100,6 +101,7 @@ var XDropdownForEntity = /** @class */ (function (_super) {
     __extends(XDropdownForEntity, _super);
     function XDropdownForEntity(props) {
         var _this = _super.call(this, props) || this;
+        _this.idField = XUtilsMetadata_1.XUtilsMetadata.getXEntity(_this.props.entity).idField;
         _this.state = {
             options: []
         };
@@ -142,7 +144,7 @@ var XDropdownForEntity = /** @class */ (function (_super) {
     XDropdownForEntity.prototype.render = function () {
         // TODO - mozno by nebolo od veci pouzivat InputText ak readOnly === true (chybala by len sipka (rozbalovac)) a dalo by sa copy-paste-ovat
         // propertiesy na Dropdown-e: readOnly vyseduje, disabled znemoznuje vyber polozky
-        return (react_1.default.createElement(dropdown_1.Dropdown, __assign({ id: this.props.id, options: this.state.options, optionLabel: this.props.displayField, value: this.props.value, onChange: this.onChange, readOnly: this.props.readOnly, disabled: this.props.readOnly }, XUtils_1.XUtils.createErrorProps(this.props.error))));
+        return (react_1.default.createElement(dropdown_1.Dropdown, __assign({ id: this.props.id, options: this.state.options, optionLabel: this.props.displayField, dataKey: this.idField, value: this.props.value, onChange: this.onChange, readOnly: this.props.readOnly, disabled: this.props.readOnly }, XUtils_1.XUtils.createErrorProps(this.props.error))));
     };
     return XDropdownForEntity;
 }(react_1.Component));

package/lib/components/{XBrowse.d.ts → XEditBrowse.d.ts}

@@ -1,11 +1,11 @@
 import { Component } from "react";
 import { XEditColumnDialogValues } from "./XEditColumnDialog";
 import { XBrowseMeta } from "../serverApi/XBrowseMetadata";
-export interface XBrowseProps {
+export interface XEditBrowseProps {
     entity: string;
     browseId?: string;
 }
-export declare class XBrowse extends Component<XBrowseProps> {
+export declare class XEditBrowse extends Component<XEditBrowseProps> {
     state: {
         xBrowseMeta: XBrowseMeta;
         editMode: boolean;
@@ -14,7 +14,7 @@ export declare class XBrowse extends Component<XBrowseProps> {
     indexForAddColumn?: number;
     addColumn: boolean;
     xEditColumnDialogValues?: XEditColumnDialogValues;
-    constructor(props: XBrowseProps);
+    constructor(props: XEditBrowseProps);
     getXBrowseMeta(): XBrowseMeta;
     createDefaultXBrowseMeta(): XBrowseMeta;
     onEditModeStart(): void;

package/lib/components/{XBrowse.js → XEditBrowse.js}

@@ -101,7 +101,7 @@ var __read = (this && this.__read) || function (o, n) {
     return ar;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.XBrowse = void 0;
+exports.XEditBrowse = void 0;
 var react_1 = __importStar(require("react"));
 var SourceCodeLinkEntity_1 = require("./SourceCodeLinkEntity");
 var XEditColumnDialog_1 = require("./XEditColumnDialog");
@@ -109,10 +109,10 @@ var _ = __importStar(require("lodash"));
 var XUtilsMetadata_1 = require("./XUtilsMetadata");
 var XUtils_1 = require("./XUtils");
 var XLazyDataTable_1 = require("./XLazyDataTable");
-// TODO - pouzit extends XBrowseBase, ako je tomu pri CarForm?
-var XBrowse = /** @class */ (function (_super) {
-    __extends(XBrowse, _super);
-    function XBrowse(props) {
+// TODO - pouzit extends XEditBrowseBase, ako je tomu pri CarForm?
+var XEditBrowse = /** @class */ (function (_super) {
+    __extends(XEditBrowse, _super);
+    function XEditBrowse(props) {
         var _this = _super.call(this, props) || this;
         console.log("************* XBrowse const entity = " + _this.props.entity);
         _this.getXBrowseMeta = _this.getXBrowseMeta.bind(_this);
@@ -137,14 +137,14 @@ var XBrowse = /** @class */ (function (_super) {
         _this.onEdit = _this.onEdit.bind(_this);
         return _this;
     }
-    XBrowse.prototype.getXBrowseMeta = function () {
+    XEditBrowse.prototype.getXBrowseMeta = function () {
         var xBrowseMeta = XUtilsMetadata_1.XUtilsMetadata.getXBrowseMeta(this.props.entity, this.props.browseId);
         if (xBrowseMeta === undefined) {
             xBrowseMeta = this.createDefaultXBrowseMeta();
         }
         return xBrowseMeta;
     };
-    XBrowse.prototype.createDefaultXBrowseMeta = function () {
+    XEditBrowse.prototype.createDefaultXBrowseMeta = function () {
         var e_1, _a;
         var xColumnMetaList = [];
         var xEntity = XUtilsMetadata_1.XUtilsMetadata.getXEntity(this.props.entity);
@@ -164,12 +164,12 @@ var XBrowse = /** @class */ (function (_super) {
         }
         return { entity: this.props.entity, rows: 15, columnMetaList: xColumnMetaList };
     };
-    XBrowse.prototype.onEditModeStart = function () {
+    XEditBrowse.prototype.onEditModeStart = function () {
         // zmeny budeme robit na klonovanych datach - aby sme sa vedeli cez cancel vratit do povodneho stavu
         var xBrowseMetaCloned = _.cloneDeep(this.state.xBrowseMeta);
         this.setState({ xBrowseMeta: xBrowseMetaCloned, editMode: true });
     };
-    XBrowse.prototype.onEditModeSave = function () {
+    XEditBrowse.prototype.onEditModeSave = function () {
         return __awaiter(this, void 0, void 0, function () {
             var xBrowseMeta, columnOrder, _a, _b, xColumnMeta, e_2;
             var e_3, _c;
@@ -213,19 +213,19 @@ var XBrowse = /** @class */ (function (_super) {
             });
         });
     };
-    XBrowse.prototype.onEditModeCancel = function () {
+    XEditBrowse.prototype.onEditModeCancel = function () {
         // vratime formular z cache, resp. defaultny formular
         var xBrowseMeta = this.getXBrowseMeta();
         this.setState({ editMode: false, xBrowseMeta: xBrowseMeta });
     };
-    XBrowse.prototype.onAddColumn = function (field) {
+    XEditBrowse.prototype.onAddColumn = function (field) {
         console.log("onAddColumn: " + field);
         this.indexForAddColumn = this.getIndexForColumn(field);
         this.addColumn = true;
         this.xEditColumnDialogValues = { field: "", header: "", dropdownInFilter: false }; // values are used for dialog initialization
         this.setState({ editColumnDialogOpened: true });
     };
-    XBrowse.prototype.editColumnDialogOnHide = function (xEditColumnDialogValues) {
+    XEditBrowse.prototype.editColumnDialogOnHide = function (xEditColumnDialogValues) {
         if (xEditColumnDialogValues !== null) {
             if (this.indexForAddColumn !== undefined) {
                 var xBrowseMeta = this.state.xBrowseMeta;
@@ -248,7 +248,7 @@ var XBrowse = /** @class */ (function (_super) {
         }
         this.setState({ editColumnDialogOpened: false });
     };
-    XBrowse.prototype.onEditColumn = function (field) {
+    XEditBrowse.prototype.onEditColumn = function (field) {
         var _a;
         console.log("onEditColumn: " + field);
         this.indexForAddColumn = this.getIndexForColumn(field);
@@ -260,7 +260,7 @@ var XBrowse = /** @class */ (function (_super) {
             this.setState({ editColumnDialogOpened: true });
         }
     };
-    XBrowse.prototype.onRemoveColumn = function (field) {
+    XEditBrowse.prototype.onRemoveColumn = function (field) {
         console.log("onRemoveColumn: " + field);
         var index = this.getIndexForColumn(field);
         if (index !== undefined) {
@@ -270,13 +270,13 @@ var XBrowse = /** @class */ (function (_super) {
             this.setState({ xBrowseMeta: xBrowseMeta });
         }
     };
-    XBrowse.prototype.onMoveColumnLeft = function (field) {
+    XEditBrowse.prototype.onMoveColumnLeft = function (field) {
         this.moveColumn(field, -1);
     };
-    XBrowse.prototype.onMoveColumnRight = function (field) {
+    XEditBrowse.prototype.onMoveColumnRight = function (field) {
         this.moveColumn(field, 1);
     };
-    XBrowse.prototype.moveColumn = function (field, offset) {
+    XEditBrowse.prototype.moveColumn = function (field, offset) {
         var index = this.getIndexForColumn(field);
         if (index !== undefined) {
             var xBrowseMeta = this.state.xBrowseMeta;
@@ -285,7 +285,7 @@ var XBrowse = /** @class */ (function (_super) {
             this.setState({ xBrowseMeta: xBrowseMeta });
         }
     };
-    XBrowse.prototype.getIndexForColumn = function (field) {
+    XEditBrowse.prototype.getIndexForColumn = function (field) {
         var e_4, _a;
         var searchedIndex = undefined;
         var xBrowseMeta = this.state.xBrowseMeta;
@@ -307,7 +307,7 @@ var XBrowse = /** @class */ (function (_super) {
         }
         return searchedIndex;
     };
-    XBrowse.prototype.onEdit = function (selectedRow) {
+    XEditBrowse.prototype.onEdit = function (selectedRow) {
         var formElement = XUtils_1.XUtils.getAppForm(this.props.entity);
         if (formElement !== undefined) {
             var xEntity = XUtilsMetadata_1.XUtilsMetadata.getXEntity(this.props.entity);
@@ -321,7 +321,7 @@ var XBrowse = /** @class */ (function (_super) {
             console.log("XBrowse entity = ".concat(this.props.entity, ": form not found/registered."));
         }
     };
-    XBrowse.prototype.render = function () {
+    XEditBrowse.prototype.render = function () {
         var xBrowseMeta = this.state.xBrowseMeta;
         var xEditModeHandlers = {
             onStart: this.onEditModeStart,
@@ -355,6 +355,6 @@ var XBrowse = /** @class */ (function (_super) {
             entitySourceCodeLink,
             react_1.default.createElement(XEditColumnDialog_1.XEditColumnDialog, { dialogOpened: this.state.editColumnDialogOpened, entity: xBrowseMeta.entity, addColumn: this.addColumn, xEditColumnDialogValues: this.xEditColumnDialogValues, onHideDialog: this.editColumnDialogOnHide })));
     };
-    return XBrowse;
+    return XEditBrowse;
 }(react_1.Component));
-exports.XBrowse = XBrowse;
+exports.XEditBrowse = XEditBrowse;

package/lib/components/XFormBase.d.ts

@@ -5,9 +5,9 @@ import { FieldOnChange, XFormComponent } from "./XFormComponent";
 import { TableFieldOnChange, XFormDataTable2, XRowTechData } from "./XFormDataTable2";
 import { XErrorMap, XErrors } from "./XErrors";
 export type XOnSaveOrCancelProp = (object: XObject | null, objectChange: OperationType) => void;
-export interface FormProps {
+export interface XFormProps {
     id?: number;
-    object?: XObject;
+    initValues?: object;
     onSaveOrCancel?: XOnSaveOrCancelProp;
 }
 export declare function Form(entity: string): <T extends new (...args: any[]) => {}>(constructor: T) => {
@@ -15,7 +15,7 @@ export declare function Form(entity: string): <T extends new (...args: any[]) =>
         entity: string;
     };
 } & T;
-export declare abstract class XFormBase extends Component<FormProps> {
+export declare abstract class XFormBase extends Component<XFormProps> {
     entity?: string;
     fields: Set<string>;
     state: {
@@ -24,7 +24,12 @@ export declare abstract class XFormBase extends Component<FormProps> {
     } | any;
     xFormComponentList: Array<XFormComponent<any, any>>;
     xFormDataTableList: Array<XFormDataTable2>;
-    constructor(props: FormProps);
+    assocToValidateList: Array<string>;
+    assocToSortList: Array<{
+        assoc: string;
+        sortField: string;
+    }>;
+    constructor(props: XFormProps);
     componentDidMount(): Promise<void>;
     getEntity(): string;
     getXObject(): XObject;
@@ -45,13 +50,18 @@ export declare abstract class XFormBase extends Component<FormProps> {
     addXFormComponent(xFormComponent: XFormComponent<any, any>): void;
     findXFormComponent(field: string): XFormComponent<any, any> | undefined;
     addXFormDataTable(xFormDataTable: XFormDataTable2): void;
+    addAssocToValidate(oneToManyAssoc: string): void;
+    addAssocToSort(oneToManyAssoc: string, sortField: string): void;
     formReadOnlyBase(field: string): boolean;
     onClickSave(): Promise<void>;
     onClickCancel(): void;
     validateSave(): boolean;
     validateForm(): XErrorMap;
     fieldValidation(): XErrorMap;
+    getErrorMessagesForAssoc(oneToManyAssoc: string): string;
+    static saveErrorsIntoXRowTechData(row: any, xErrors: XErrors): void;
     formReadOnly(object: XObject, field: string): boolean;
+    createNewObject(): XObject;
     preInitForm(object: XObject, operationType: OperationType.Insert | OperationType.Update): void;
     validate(object: XObject): XErrors;
     preSave(object: XObject): void;