awing-library 2.1.124-beta → 2.1.124

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 interface ParameterProps {
     templateId: string;
 }
@@ -17,5 +17,5 @@ export declare const OmitListType: {
     COLOR: string;
     URL: string;
 };
-declare const _default: import("react").NamedExoticComponent<ParameterProps>;
+declare const _default: React.NamedExoticComponent<ParameterProps>;
 export default _default;

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.js

@@ -10,6 +10,29 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
@@ -28,10 +51,10 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var icons_material_1 = require("@mui/icons-material");
 var Add_1 = __importDefault(require("@mui/icons-material/Add"));
 var material_1 = require("@mui/material");
-var immer_1 = __importDefault(require("immer"));
 var Enum_1 = require("../../../../ACM-AXN/ViewTemplate/Enum");
 var AWING_1 = require("../../../../AWING");
-var react_1 = require("react");
+var immer_1 = require("immer");
+var react_1 = __importStar(require("react"));
 var react_i18next_1 = require("react-i18next");
 var recoil_1 = require("recoil");
 var Recoils_1 = require("../Recoils");
@@ -41,6 +64,7 @@ delete exports.OmitListType.LIST;
 var Parameter = function (_a) {
     var templateId = _a.templateId;
     var _b = (0, recoil_1.useRecoilState)(Recoils_1.templateParametersState), rows = _b[0], handleSetParameter = _b[1];
+    var setErrors = (0, recoil_1.useSetRecoilState)(Recoils_1.isErrorParameterState);
     var t = (0, react_i18next_1.useTranslation)().t;
     var defaultParam = {
         id: String(Date.now()),
@@ -50,36 +74,44 @@ var Parameter = function (_a) {
         defaultValue: undefined,
         labelName: undefined,
         isRequired: false,
+        isAdvanced: false,
         childrens: [],
     };
+    var tableRow = react_1.default.useMemo(function () { return (0, Utils_1.flattenParameter)(rows); }, [rows]);
+    react_1.default.useEffect(function () {
+        setErrors(tableRow.some(function (item) { return item.errField; }));
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [tableRow]);
     var handleAddParameter = function () {
         handleSetParameter(function (prev) { return __spreadArray(__spreadArray([], prev, true), [defaultParam], false); });
     };
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     var handleChange = function (event) {
-        var _a = event.target, name = _a.name, value = _a.value, checked = _a.checked;
-        var _b = name.split('-').filter(Boolean), field = _b[0], ids = _b.slice(1);
-        handleSetParameter((0, immer_1.default)(function (rows) {
-            (0, Utils_1.enhancedUpdate)(rows, ids, field, [Utils_1.CUSTOM_FIELD_NAME.IS_REQUIRED, Utils_1.CUSTOM_FIELD_NAME.IS_ADVANCED].includes(field) ? checked : value, defaultParam);
+        var _a, _b;
+        var _c = event.target, name = _c.name, value = _c.value, checked = _c.checked;
+        var _d = name.split('-').filter(Boolean), field = _d[0], ids = _d.slice(1);
+        var handleValue = [
+            Utils_1.FIELDS.IS_REQUIRED,
+            Utils_1.FIELDS.IS_ADVANCED,
+        ].includes(field)
+            ? checked
+            : field === Utils_1.FIELDS.FIELD_NAME ? ((_b = (_a = value === null || value === void 0 ? void 0 : value.split('.')) === null || _a === void 0 ? void 0 : _a.at(ids.length - 1)) !== null && _b !== void 0 ? _b : '').trim() : value;
+        handleSetParameter((0, immer_1.produce)(function (rows) {
+            (0, Utils_1.enhancedUpdate)(rows, ids, field, handleValue, defaultParam);
         }));
     };
     var handleRemoveRow = function (id) {
         handleChange({
             target: {
-                name: [Utils_1.CUSTOM_FIELD_NAME.REMOVE, id].join('-'),
+                name: [Utils_1.FIELDS.REMOVE, id].join('-'),
                 value: defaultParam,
             },
         });
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    // const handleChangeParameter = useCallback(
-    //     debounce(handleChange, DEBOUNCE_TIME),
-    //     []
-    // )
     var handleAddChildren = function (id) {
         handleChange({
             target: {
-                name: [Utils_1.CUSTOM_FIELD_NAME.CHILDRENS, id].join('-'),
+                name: [Utils_1.FIELDS.CHILDRENS, id].join('-'),
                 value: defaultParam,
             },
         });
@@ -94,7 +126,7 @@ var Parameter = function (_a) {
                 }, component: 'form', onChange: handleChange, children: (0, jsx_runtime_1.jsx)(AWING_1.DataGrid, { getRowId: function (obj) { return [obj.parentId, obj.id].flat().join('-'); }, columns: [
                         {
                             // width: '150px',
-                            field: 'fieldType',
+                            field: Utils_1.FIELDS.FIELD_TYPE,
                             headerName: t('TemplateManagement.fieldType'),
                             dynamicTableCellProps: function (row) {
                                 return {
@@ -133,7 +165,7 @@ var Parameter = function (_a) {
                             },
                         },
                         {
-                            field: 'fieldName',
+                            field: Utils_1.FIELDS.FIELD_NAME,
                             headerName: t('TemplateManagement.FieldName'),
                             TableCellProps: {
                                 sx: {
@@ -145,24 +177,17 @@ var Parameter = function (_a) {
                                 // inputProps={{}}
                                 , { 
                                     // inputProps={{}}
-                                    error: row.errField, InputProps: {
-                                        startAdornment: ((0, jsx_runtime_1.jsx)(material_1.Box, { component: 'span', sx: {
-                                                padding: '4px 0 5px',
-                                            }, children: row.parentFieldName.length
-                                                ? (row.parentFieldName.push(''),
-                                                    row.parentFieldName).join('.')
-                                                : null })),
-                                    }, fullWidth: true, name: [
+                                    error: row.errField, required: true, fullWidth: true, name: [
                                         'fieldName',
                                         row.parentId,
                                         row.id,
                                     ]
                                         .flat()
-                                        .join('-'), variant: "standard", defaultValue: row.fieldName }, idx));
+                                        .join('-'), variant: "standard", value: (0, Utils_1.getFieldName)(row) }, idx));
                             },
                         },
                         {
-                            field: 'labelName',
+                            field: Utils_1.FIELDS.LABEL_NAME,
                             headerName: t('Common.Label'),
                             TableCellProps: {
                                 sx: {
@@ -171,7 +196,7 @@ var Parameter = function (_a) {
                             },
                             valueGetter: function (row, idx) {
                                 return ((0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, name: [
-                                        'labelName',
+                                        Utils_1.FIELDS.LABEL_NAME,
                                         row.parentId,
                                         row.id,
                                     ]
@@ -180,7 +205,7 @@ var Parameter = function (_a) {
                             },
                         },
                         {
-                            field: 'defaultValue',
+                            field: Utils_1.FIELDS.DEFAULT_VALUE,
                             headerName: t('Common.DefaultValue'),
                             TableCellProps: {
                                 sx: {
@@ -201,7 +226,7 @@ var Parameter = function (_a) {
                             },
                         },
                         {
-                            field: 'isRequired',
+                            field: Utils_1.FIELDS.IS_REQUIRED,
                             width: '85px',
                             headerName: t('Common.Require'),
                             TableCellProps: {
@@ -225,7 +250,7 @@ var Parameter = function (_a) {
                             },
                             valueGetter: function (row, idx) {
                                 return ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { name: [
-                                        'isRequired',
+                                        Utils_1.FIELDS.IS_REQUIRED,
                                         row.parentId,
                                         row.id,
                                     ]
@@ -234,7 +259,7 @@ var Parameter = function (_a) {
                             },
                         },
                         {
-                            field: 'isAdvanced',
+                            field: Utils_1.FIELDS.IS_ADVANCED,
                             width: '85px',
                             headerName: t('Common.Advance'),
                             TableCellProps: {
@@ -261,7 +286,7 @@ var Parameter = function (_a) {
                                         .join('-'), color: "primary", defaultChecked: row.isAdvanced }, idx));
                             },
                         },
-                    ], rows: (0, Utils_1.flattenParameter)(rows), rowActions: [
+                    ], rows: tableRow, rowActions: [
                         {
                             icon: (0, jsx_runtime_1.jsx)(icons_material_1.DeleteForever, {}),
                             tooltipTitle: t('Common.Delete'),
@@ -278,6 +303,6 @@ var Parameter = function (_a) {
                                 return !(Enum_1.TYPE_FIELD_TEMPLATE.OBJECT === row.fieldType);
                             },
                         },
-                    ] }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { mt: 3, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, justifyContent: "space-between", alignItems: "center", children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { xs: 6, container: true, item: true, children: (0, jsx_runtime_1.jsx)(material_1.Button, { "aria-label": "button-add", variant: "contained", onClick: handleAddParameter, disabled: false, title: t('Common.Add'), children: (0, jsx_runtime_1.jsx)(Add_1.default, {}) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { xs: 6, container: true, item: true, justifyContent: "flex-end", children: (0, jsx_runtime_1.jsx)(material_1.Typography, { sx: { padding: '8px' }, children: t('TemplateManagement.NamingFieldNotice') }) })] }) })] }));
+                    ] }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { mt: 3, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, justifyContent: "space-between", alignItems: "center", children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { xs: 6, container: true, item: true, children: (0, jsx_runtime_1.jsx)(material_1.Button, { name: "master-add-parameter", "aria-label": "button-add", variant: "contained", onClick: handleAddParameter, disabled: false, title: t('Common.Add'), children: (0, jsx_runtime_1.jsx)(Add_1.default, {}) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { xs: 6, container: true, item: true, justifyContent: "flex-end", children: (0, jsx_runtime_1.jsx)(material_1.Typography, { sx: { padding: '8px' }, children: t('TemplateManagement.NamingFieldNotice') }) })] }) })] }));
 };
 exports.default = (0, react_1.memo)(Parameter);

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.test.d.ts

@@ -1 +1 @@
-import '@testing-library/jest-dom/extend-expect';
+export {};

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.test.js

@@ -77,7 +77,6 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 /* eslint-disable testing-library/no-node-access */
 /* eslint-disable testing-library/no-container */
 /* eslint-disable testing-library/no-wait-for-side-effects */
-require("@testing-library/jest-dom/extend-expect");
 var react_1 = require("@testing-library/react");
 var Parameter_1 = __importDefault(require("./Parameter"));
 var Utils = __importStar(require("./Utils"));
@@ -111,27 +110,6 @@ var rows = [
         isRequired: true,
         childrens: [],
     },
-    {
-        id: '14896',
-        templateId: '4671435926616395650',
-        fieldName: 'video_inbanner_2',
-        fieldType: 'object',
-        defaultValue: null,
-        labelName: 'File banner nền video',
-        isRequired: true,
-        childrens: [
-            {
-                id: '148967',
-                templateId: '4671435926616395650',
-                fieldName: 'video_inbanner_2',
-                fieldType: 'image',
-                defaultValue: null,
-                labelName: 'File banner nền video',
-                isRequired: true,
-                childrens: [],
-            },
-        ],
-    },
     {
         id: '148961',
         templateId: '4671435926616395650',
@@ -154,13 +132,11 @@ var rows = [
         ],
     },
 ];
-var props = {
-    handleSetParameter: function (fn) {
-        return fn(rows);
-    },
-};
 describe('Template Infomation Tab Component', function () {
-    beforeAll(function () { });
+    beforeAll(function () {
+        ;
+        Utils.enhancedUpdate.mockImplementation(utils.enhancedUpdate);
+    });
     var renderUi = function () {
         return (0, react_1.render)((0, jsx_runtime_1.jsx)(recoil_1.RecoilRoot, { initializeState: function (_a) {
                 var set = _a.set;
@@ -170,33 +146,62 @@ describe('Template Infomation Tab Component', function () {
     it('renders without crashing', function () {
         renderUi();
     });
-    it('trigger add rows', function () {
-        var updateSpy = jest.spyOn(props, 'handleSetParameter');
-        renderUi();
-        var addBtn = react_1.screen.getByRole('button', { name: /button-add/i });
-        react_1.fireEvent.click(addBtn);
-        expect(updateSpy).toBeCalled();
-        // expect(addBtn).toBeInTheDocument()
-    });
+    it('trigger add rows', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var addBtn;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    renderUi();
+                    addBtn = react_1.screen.getByRole('button', { name: /button-add/i });
+                    react_1.fireEvent.click(addBtn);
+                    return [4 /*yield*/, (0, react_1.waitFor)(function () {
+                            expect(react_1.screen.getAllByText('image')[0]).toBeInTheDocument();
+                        })];
+                case 1:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('trigger add Object Children', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var addBtn;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    renderUi();
+                    addBtn = react_1.screen.getAllByTitle('Common.Add');
+                    addBtn.forEach(function (btn) {
+                        react_1.fireEvent.click(btn);
+                    });
+                    return [4 /*yield*/, (0, react_1.waitFor)(function () {
+                            expect(react_1.screen.getAllByText('image')[0]).toBeInTheDocument();
+                        })];
+                case 1:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
     it('trigger edit cell', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var updateSpy, container, labelNameInput, fieldTypeInput;
+        var container, labelNameInput, fieldTypeInput;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    updateSpy = jest.spyOn(props, 'handleSetParameter');
                     container = renderUi().container;
-                    labelNameInput = container.querySelector("input[name=\"labelName--148961-148967s\"]");
-                    fieldTypeInput = container.querySelector("input[name=\"fieldType--148961-148967s\"]");
+                    labelNameInput = container.querySelector("input[name=\"labelName-148961-148967s\"]");
+                    fieldTypeInput = container.querySelector("input[name=\"fieldType-148961-148967s\"]");
                     react_1.fireEvent.change(labelNameInput, {
                         target: { value: 'fieldInput-change' },
                     });
                     react_1.fireEvent.change(fieldTypeInput, {
                         target: { value: 'video' },
                     });
+                    // expect(screen.getAllByText('color')[0]).toBeInTheDocument()
                     return [4 /*yield*/, (0, react_1.waitFor)(function () {
-                            expect(updateSpy).toBeCalledTimes(1);
+                            expect(Utils.enhancedUpdate).toBeCalledTimes(3);
                         })];
                 case 1:
+                    // expect(screen.getAllByText('color')[0]).toBeInTheDocument()
                     _a.sent();
                     return [2 /*return*/];
             }
@@ -205,16 +210,22 @@ describe('Template Infomation Tab Component', function () {
     it('Remove row', function () { return __awaiter(void 0, void 0, void 0, function () {
         var removeBtn;
         return __generator(this, function (_a) {
-            ;
-            Utils.enhancedUpdate.mockImplementation(utils.enhancedUpdate);
-            renderUi();
-            removeBtn = react_1.screen.getAllByRole('button', {
-                name: /Common.Delete/i,
-            });
-            removeBtn.forEach(function (btn) {
-                react_1.fireEvent.click(btn);
-            });
-            return [2 /*return*/];
+            switch (_a.label) {
+                case 0:
+                    renderUi();
+                    removeBtn = react_1.screen.getAllByRole('button', {
+                        name: /Common.Delete/i,
+                    });
+                    removeBtn.forEach(function (btn) {
+                        react_1.fireEvent.click(btn);
+                    });
+                    return [4 /*yield*/, (0, react_1.waitFor)(function () {
+                            expect(Utils.enhancedUpdate).toBeCalledTimes(2);
+                        })];
+                case 1:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
         });
     }); });
 });

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Utils.d.ts

@@ -1,15 +1,36 @@
+/// <reference types="lodash" />
 import { ITemplateParameter } from '../../Types';
 import { DataObject } from '../../../../AWING';
-export declare const CUSTOM_FIELD_NAME: {
+export interface IFlatParameter {
+    parentFieldType: string | undefined;
+    parentId: string[];
+    parentFieldName: string[];
+    errField: boolean;
+    shouldRemove: boolean;
+    id: string;
+    templateId: string;
+    fieldName: string;
+    fieldType: string;
+    defaultValue: string | number | boolean | null;
+    labelName: string;
+    isRequired: boolean;
+    childrens: IFlatParameter[];
+    isAdvanced: boolean;
+}
+export declare const FIELDS: {
     CHILDRENS: string;
     REMOVE: string;
     FIELD_TYPE: string;
+    FIELD_NAME: string;
     IS_REQUIRED: string;
     IS_ADVANCED: string;
+    LABEL_NAME: string;
+    DEFAULT_VALUE: string;
+    PARENT_ID: string;
 };
 export declare const removeFiledName: (templateParameters: ITemplateParameter[]) => ITemplateParameter[];
-export declare const flattenParameter4Parent: (rows: DataObject[], parentFieldName?: string[]) => DataObject[];
-export declare const flattenParameter: (parameters: DataObject[], parentId?: string[], parentFieldType?: string, parentFieldName?: string[]) => DataObject[];
+export declare const flattenParameter4Parent: ((rows: DataObject[], parentFieldName?: string[]) => DataObject[]) & import("lodash").MemoizedFunction;
+export declare const flattenParameter: ((parameters: DataObject[], parentId?: string[], parentFieldType?: string, parentFieldName?: string[]) => IFlatParameter[]) & import("lodash").MemoizedFunction;
 export declare const enhancedFindIndex: (rows: DataObject[], ids: string[]) => number[];
 /**
  * function enhancedUpdate
@@ -22,4 +43,7 @@ export declare const enhancedFindIndex: (rows: DataObject[], ids: string[]) => n
  * @param defaultParam
  */
 export declare const enhancedUpdate: (rows: DataObject[], ids: string[], field: string, value: any, defaultParam: ITemplateParameter) => void;
-export declare const enhancedRemove: (ids: string[]) => void;
+/**
+ * viết type là DataObject thôi nhưng type của nó là:
+ */
+export declare const getFieldName: ((row: IFlatParameter) => string) & import("lodash").MemoizedFunction;

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Utils.js

@@ -20,22 +20,26 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.enhancedRemove = exports.enhancedUpdate = exports.enhancedFindIndex = exports.flattenParameter = exports.flattenParameter4Parent = exports.removeFiledName = exports.CUSTOM_FIELD_NAME = void 0;
+exports.getFieldName = exports.enhancedUpdate = exports.enhancedFindIndex = exports.flattenParameter = exports.flattenParameter4Parent = exports.removeFiledName = exports.FIELDS = void 0;
 var Enum_1 = require("../../../../ACM-AXN/ViewTemplate/Enum");
 var lodash_1 = require("lodash");
-exports.CUSTOM_FIELD_NAME = {
+exports.FIELDS = {
     CHILDRENS: 'childrens',
     REMOVE: 'remove',
     FIELD_TYPE: 'fieldType',
+    FIELD_NAME: 'fieldName',
     IS_REQUIRED: 'isRequired',
     IS_ADVANCED: 'isAdvanced',
+    LABEL_NAME: 'labelName',
+    DEFAULT_VALUE: 'defaultValue',
+    PARENT_ID: 'parentId',
 };
 var removeFiledName = function (templateParameters) { return templateParameters.map(function (item) {
     var _a;
     return (__assign(__assign({}, item), { childrens: (0, exports.removeFiledName)(item.childrens), fieldName: (_a = item === null || item === void 0 ? void 0 : item.fieldName) === null || _a === void 0 ? void 0 : _a.split('.').at(-1) }));
 }); };
 exports.removeFiledName = removeFiledName;
-var flattenParameter4Parent = function (rows, parentFieldName) {
+exports.flattenParameter4Parent = (0, lodash_1.memoize)(function (rows, parentFieldName) {
     if (parentFieldName === void 0) { parentFieldName = []; }
     parentFieldName = parentFieldName.filter(Boolean);
     return rows
@@ -50,15 +54,14 @@ var flattenParameter4Parent = function (rows, parentFieldName) {
         ], false).flat()), true);
     })
         .flat();
-};
-exports.flattenParameter4Parent = flattenParameter4Parent;
-var flattenParameter = function (parameters, parentId, parentFieldType, parentFieldName) {
+});
+exports.flattenParameter = (0, lodash_1.memoize)(function (parameters, parentId, parentFieldType, parentFieldName) {
     if (parentId === void 0) { parentId = []; }
     if (parentFieldName === void 0) { parentFieldName = []; }
     var shouldRemove = parameters.length > 1;
     return parameters
         .map(function (item) {
-        var errField = !!parameters.find(function (el) { return el.id !== item.id && el.fieldName === item.fieldName; });
+        var errField = !!parameters.find(function (el) { return el.id !== item.id && el.fieldName === item.fieldName; }) || item.fieldName === '';
         var childrens = __spreadArray([], item.childrens, true);
         parentFieldName = parentFieldName.filter(function (field) { return field !== undefined; });
         // delete item.childrens
@@ -69,9 +72,17 @@ var flattenParameter = function (parameters, parentId, parentFieldType, parentFi
             item.fieldName,
         ], false).flat()), true);
     })
-        .flat();
-};
-exports.flattenParameter = flattenParameter;
+        .flat().map(function (item) {
+        Object.keys(item).forEach(function (key) {
+            var value = item[key];
+            if (Array.isArray(value)) {
+                ;
+                item[key] = value.filter(Boolean);
+            }
+        });
+        return item;
+    });
+});
 var enhancedFindIndex = function (rows, ids) {
     var indexs = [];
     var index = (0, lodash_1.findIndex)(rows, { id: ids[0] });
@@ -102,14 +113,14 @@ var enhancedUpdate = function (rows, ids, field, value, defaultParam) {
         }
         else {
             switch (field) {
-                case exports.CUSTOM_FIELD_NAME.CHILDRENS:
+                case exports.FIELDS.CHILDRENS:
                     rowsUpdate[indexs[turn]].childrens.push(value);
                     break;
-                case exports.CUSTOM_FIELD_NAME.REMOVE: {
+                case exports.FIELDS.REMOVE: {
                     rowsUpdate.splice(indexs[turn], 1);
                     break;
                 }
-                case exports.CUSTOM_FIELD_NAME.FIELD_TYPE: {
+                case exports.FIELDS.FIELD_TYPE: {
                     ;
                     rowsUpdate[indexs[turn]][field] = value;
                     rowsUpdate[indexs[turn]].childrens = [];
@@ -134,5 +145,22 @@ var enhancedUpdate = function (rows, ids, field, value, defaultParam) {
     }
 };
 exports.enhancedUpdate = enhancedUpdate;
-var enhancedRemove = function (ids) { };
-exports.enhancedRemove = enhancedRemove;
+/**
+ * viết type là DataObject thôi nhưng type của nó là:
+ */
+exports.getFieldName = (0, lodash_1.memoize)(function (row) {
+    var value = '';
+    var parentName = row.parentFieldName.length
+        ? __spreadArray(__spreadArray([], row.parentFieldName, true), [''], false).join('.')
+        : '';
+    if (parentName.split('.').length === row.parentId.length) {
+        parentName += '.';
+    }
+    if (row.fieldName) {
+        value += parentName + row.fieldName;
+    }
+    if (row.parentId.length && !value.split('.').at(row.parentId.length)) {
+        value = parentName;
+    }
+    return value;
+});

package/lib/ACM-AXN/Template/CreateOrEdit/index.js

@@ -58,7 +58,7 @@ var TabFile_1 = __importDefault(require("../../../ACM-AXN/Page/CreateOrEdit/TabF
 var enums_1 = require("../../../ACM-AXN/Page/enums");
 var AWING_1 = require("../../../AWING");
 var Wrapper_1 = __importDefault(require("../../../AWING/HOC/Wrapper"));
-var immer_1 = __importDefault(require("immer"));
+var immer_1 = require("immer");
 var Router_1 = require("../../../AWING/Router");
 var validation_1 = require("../../../AWING/ultis/validation");
 var ClassicDrawer_1 = __importDefault(require("../../../Commons/Components/ClassicDrawer"));
@@ -90,6 +90,7 @@ var CreateOrEdit = function () {
     var _e = (0, react_1.useState)([]), templateTypes = _e[0], setTemplateTypes = _e[1];
     var _f = (0, recoil_1.useRecoilState)(Recoils_1.templateState), templateData = _f[0], setTemplateData = _f[1];
     var confirmExit = (0, recoil_1.useRecoilValue)(Recoils_1.isEditState);
+    var isError = (0, recoil_1.useRecoilValue)(Recoils_1.isErrorParameterState);
     var _g = (0, react_1.useState)('0'), value = _g[0], setValue = _g[1];
     (0, react_1.useEffect)(function () {
         setLoading(true);
@@ -104,7 +105,7 @@ var CreateOrEdit = function () {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
     (0, react_1.useEffect)(function () {
-        setTemplateData((0, immer_1.default)(function (prev) {
+        setTemplateData((0, immer_1.produce)(function (prev) {
             var _a;
             prev.template.directoryId =
                 prev.template.directoryId ||
@@ -152,7 +153,7 @@ var CreateOrEdit = function () {
     var fetchTemplateData = function () {
         if (templateId) {
             return service.templatesGet(templateId).then(function (res) {
-                setTemplateData(__assign(__assign({}, res), { templateParameters: (0, Utils_1.removeFiledName)(res.templateParameters) }));
+                setTemplateData(__assign(__assign({}, res), { template: __assign(__assign({}, res.template), { pageCode: isNaN(Number(res.template.pageCode)) ? res.template.pageCode : Number(res.template.pageCode) ? 'lgn' : 'wlc' }), templateParameters: (0, Utils_1.removeFiledName)(res.templateParameters) }));
             });
         }
     };
@@ -205,7 +206,10 @@ var CreateOrEdit = function () {
         }
         return service.templatesPost(data4Update);
     };
-    return ((0, jsx_runtime_1.jsx)(ClassicDrawer_1.default, { title: "".concat(t(['TemplateManagement', templateId ? 'Edit' : 'Create'].join('.'))).concat(templateId ? ": ".concat((_a = templateData === null || templateData === void 0 ? void 0 : templateData.template) === null || _a === void 0 ? void 0 : _a.description) : '', "\n               "), onSubmit: handleSubmit, disableButtonSubmit: !((_b = templateData.template) === null || _b === void 0 ? void 0 : _b.templateTypeId) || !descriptionValid.valid || !confirmExit, confirmExit: confirmExit, childrenWrapperStyle: { padding: 0 }, children: (0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, sx: {
+    return ((0, jsx_runtime_1.jsx)(ClassicDrawer_1.default, { title: "".concat(t(['TemplateManagement', templateId ? 'Edit' : 'Create'].join('.'))).concat(templateId ? ": ".concat((_a = templateData === null || templateData === void 0 ? void 0 : templateData.template) === null || _a === void 0 ? void 0 : _a.description) : '', "\n               "), onSubmit: handleSubmit, disableButtonSubmit: !((_b = templateData.template) === null || _b === void 0 ? void 0 : _b.templateTypeId) ||
+            !descriptionValid.valid ||
+            !confirmExit ||
+            isError, confirmExit: confirmExit, childrenWrapperStyle: { padding: 0 }, children: (0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, sx: {
                 display: 'flex',
                 flexDirection: 'column',
                 flexGrow: 1,

package/lib/ACM-AXN/Template/Import.js

@@ -51,13 +51,16 @@ var ImportTemplate = function () {
     };
     var handleSubmit = function () {
         var directoryId = bussinessData.directoryId, id = bussinessData.id, name = bussinessData.name;
-        return service.templatesImport(directoryId, id, name, {
+        return service.templatesImport(directoryId, id || '0', name, {
             data: tempFile,
             fileName: tempFile === null || tempFile === void 0 ? void 0 : tempFile.name,
         });
     };
-    var handleChangeFormData = (0, react_1.useCallback)(function (obj) {
-        setBussinessData(function (prev) { return (__assign(__assign(__assign(__assign({}, prev), { id: prev.id || '0' }), obj), { directoryId: (obj === null || obj === void 0 ? void 0 : obj.directoryId) || rootDirectoryId })); });
+    var handleChangeFormData = (0, react_1.useCallback)(function (obj, valid, key) {
+        setBussinessData(function (prev) {
+            var _a;
+            return (__assign(__assign({}, prev), (_a = {}, _a[key] = obj[key], _a.directoryId = (obj === null || obj === void 0 ? void 0 : obj.directoryId) || rootDirectoryId, _a)));
+        });
     }, [rootDirectoryId]);
     return ((0, jsx_runtime_1.jsxs)(ClassicDrawer_1.default, { title: t('TemplateManagement.ImportTemplate'), onSubmit: handleSubmit, disableButtonSubmit: !(tempFile === null || tempFile === void 0 ? void 0 : tempFile.name), confirmExit: true, childrenWrapperStyle: { padding: 0 }, children: [(0, jsx_runtime_1.jsx)(AWING_1.DataForm, { fields: [
                     {

package/lib/ACM-AXN/Template/Import.test.js

@@ -114,11 +114,11 @@ jest.mock('react-i18next', function () { return (__assign(__assign({}, jest.requ
 // Mock React
 jest.mock('react', function () { return (__assign(__assign({}, jest.requireActual('react')), { forwardRef: jest.fn(function (arg) { return arg; }), useRef: function () { return ({ current: { click: function () { } } }); } })); });
 // Mock Drawer
-jest.mock('awing-library/lib/Commons/Components/ClassicDrawer', function () { return function (props) {
+jest.mock('Commons/Components/ClassicDrawer', function () { return function (props) {
     return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("button", { "data-testid": "onSubmit", onClick: props.onSubmit, children: "submit" }), props.children] }));
 }; });
 // Mock DataForm
-jest.mock('awing-library/lib/AWING', function () { return ({
+jest.mock('AWING', function () { return ({
     DataForm: function (props) {
         var _a, _b, _c;
         props.fields.forEach(function (element) {