awing-library 2.1.145-beta → 2.1.145

package/lib/ACM-AXN/Page/CreateOrEdit/Tabview/ViewContent.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -72,60 +61,41 @@ var enums_1 = require("../../enums");
 var Recoil_1 = require("../Recoil");
 var Utils_1 = require("../Utils");
 var Styles_1 = require("./Styles");
+var ListenTemplate_1 = require("../ListenTemplate");
 var ViewContent = function (_a) {
     var _b, _c, _d, _e, _f;
     var viewInfoData = _a.viewInfoData, pageId = _a.pageId, viewNumber = _a.viewNumber, onChange = _a.onChange, isCreate = _a.isCreate;
     var _g = (0, Context_2.default)(), service = _g.service, pageCode = _g.pageCode, domainId = _g.domainId, CONFIGS = _g.configs;
     var appHelper = (0, Context_1.useAwing)().appHelper;
+    var getTemplate = (0, ListenTemplate_1.usePageCache)().getTemplate;
     var _h = react_1.default.useState(''), scriptValidationTemplate = _h[0], setScriptValidationTemplate = _h[1];
     var _j = react_1.default.useState(''), scriptAutoField = _j[0], setScriptAutoField = _j[1];
     var _k = react_1.default.useState(false), loading = _k[0], setLoading = _k[1];
-    var isUniq = react_1.default.useRef(false);
     var rootDirectory = (0, recoil_1.useRecoilValue)(Recoil_1.pageRootDeirectory);
-    var _l = (0, recoil_1.useRecoilState)(Recoil_1.pageEventState), events = _l[0], setEvent = _l[1];
+    // const [events, setEvent] = useRecoilState(pageEventState)
     react_1.default.useEffect(function () {
+        onChange(['viewDatas'], []);
         if (viewInfoData === null || viewInfoData === void 0 ? void 0 : viewInfoData.templateId) {
             setLoading(true);
-            service
-                .templatesGet(viewInfoData.templateId)
+            getTemplate(viewInfoData.templateId)
                 .then(handleResData)
                 .finally(function () {
                 setLoading(false);
             });
         }
-        else {
-            onChange(['viewDatas'], []);
-        }
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [viewInfoData.templateId, viewInfoData.viewDatas.length]);
-    react_1.default.useEffect(function () {
-        if (!isUniq.current) {
-            setEvent(function (prev) {
-                return (0, lodash_1.uniqBy)(prev, function (a) {
-                    return JSON.stringify({
-                        event: a.event,
-                        viewNumber: a.viewNumber,
-                        pageId: a.pageId,
-                    });
-                });
-            });
-            isUniq.current = true;
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [events]);
+    }, [viewInfoData.templateId]);
     var handleResData = function (res) {
+        var _a;
         onChange(['viewDatas'], (0, Utils_1.getTemplateDatas)(res.templateParameters, viewInfoData, pageId, viewNumber));
-        setEvent(function (prev) { var _a; return __spreadArray(__spreadArray([], (_a = res === null || res === void 0 ? void 0 : res.templateEvents) === null || _a === void 0 ? void 0 : _a.map(function (item) { return ({ id: item.id, event: item.event, viewNumber: viewNumber + 1, pageId: pageId, protected: true }); }), true), prev, true); });
-        isUniq.current = false;
+        onChange(['events'], (0, lodash_1.uniqBy)(__spreadArray(__spreadArray([], (_a = res === null || res === void 0 ? void 0 : res.templateEvents) === null || _a === void 0 ? void 0 : _a.map(function (item) { return ({ id: item.id, event: item.event, viewNumber: viewNumber, pageId: pageId, protected: true }); }), true), viewInfoData.events, true), 'event'));
         onChange(['templateValidation'], res.template.validation);
         onChange(['templateHandleEvent'], res.template.autoField);
         setScriptValidationTemplate(res.template.validation || '');
         setScriptAutoField(res.template.autoField || '');
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    var setChanged = react_1.default.useCallback((0, lodash_1.debounce)(function () {
-        onChange(['isChanged'], true);
-    }, 300), []);
+    var setChanged = function () { onChange(['isChanged'], true); };
     var handleOnChange = function (fieldPath, templateDatasUpdated) {
         var _a;
         var keys = fieldPath.split('.');
@@ -175,17 +145,14 @@ var ViewContent = function (_a) {
                             ? 'lgn'
                             : 'wlc', "/").concat((_d = (_c = viewInfoData.viewDatas) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pageId), enablePreview: pageCode === enums_1.PageCode.Lgn, advanceFields: (_f = (_e = viewInfoData.viewDatas) === null || _e === void 0 ? void 0 : _e.filter(function (item) { return item === null || item === void 0 ? void 0 : item.isAdvanced; })) === null || _f === void 0 ? void 0 : _f.map(function (field) { return field.fieldName; }), scriptValidate: scriptValidationTemplate, scriptAutoField: scriptAutoField, domainId: domainId, configs: CONFIGS, 
                         // validStatus={validStatus}
-                        validStatus: viewInfoData.validStatus, viewEvents: events === null || events === void 0 ? void 0 : events.filter(function (item) { return item.viewNumber === viewNumber + 1; }), onChange: handleOnChange, onChangeViewValid: function (status) {
+                        validStatus: viewInfoData.validStatus, viewEvents: viewInfoData.events, onChange: handleOnChange, onChangeViewValid: function (status) {
                             onChange(['isValidationFields'], [status]);
                         }, onChangeValidateProcess: function (processValue) {
                             onChange(['validProcessStatus'], processValue);
                         }, onNotifyError: function (errorMessage) {
                             appHelper.snackbar('error', errorMessage);
                         }, onUploadFile: onUploadFile, onChangeEvent: function (values) {
-                            setEvent(function (prev) {
-                                return prev.filter(function (item) { return item.viewNumber !== viewNumber + 1; }).concat(values.map(function (value) { return (__assign(__assign({}, value), { viewNumber: viewNumber + 1, pageId: pageId })); }));
-                            });
-                            isUniq.current = false;
+                            onChange(['events'], values);
                         } }) }) })) })) }));
 };
 exports.default = ViewContent;

package/lib/ACM-AXN/Page/CreateOrEdit/Tabview/ViewInfo.d.ts

@@ -1,12 +1,11 @@
+import { ITemplateType } from '../../../../ACM-AXN/Template/Types';
 import React from 'react';
-import { Directory } from '../../../Campaign/Types';
 import { ViewModel } from '../../Types';
-import { ITemplateType } from '../../../../ACM-AXN/Template/Types';
 interface ViewInfoProps {
     templateTypes: ITemplateType[];
-    directories: Directory[];
     onChange: (keys: string[], value: unknown) => void;
     viewInfoData: ViewModel;
+    viewNumber: number;
 }
 declare const ViewInfo: React.FC<ViewInfoProps>;
 export default ViewInfo;

package/lib/ACM-AXN/Page/CreateOrEdit/Tabview/ViewInfo.js

@@ -10,67 +10,40 @@ 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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = __importStar(require("react"));
-var AWING_1 = require("../../../../AWING");
-var react_i18next_1 = require("react-i18next");
-var Context_1 = __importDefault(require("../../Context"));
+var Constant_1 = require("../../../../ACM-AXN/Common/Constant");
+var Constant_2 = require("../../../../ACM-AXN/Page/Constant");
 var lodash_1 = require("lodash");
-var enums_1 = require("../../enums");
-var Utils_1 = require("../Utils");
-var Constant_1 = require("../../../../ACM-AXN/Page/Constant");
+var react_1 = __importDefault(require("react"));
+var react_i18next_1 = require("react-i18next");
 var react_router_dom_1 = require("react-router-dom");
 var recoil_1 = require("recoil");
+var AWING_1 = require("../../../../AWING");
+var Context_1 = __importDefault(require("../../Context"));
+var enums_1 = require("../../enums");
+var ListenTemplate_1 = require("../ListenTemplate");
 var Recoil_1 = require("../Recoil");
+var Utils_1 = require("../Utils");
 var ViewInfo = function (_a) {
-    var directories = _a.directories, templateTypes = _a.templateTypes, onChange = _a.onChange, viewInfoData = _a.viewInfoData;
+    var templateTypes = _a.templateTypes, onChange = _a.onChange, viewInfoData = _a.viewInfoData, viewNumber = _a.viewNumber;
     var pageId = (0, react_router_dom_1.useParams)().pageId;
-    var defaultDirectory = react_1.default.useMemo(function () { return directories.find(function (item) { return item.parentDirectoryId === '99'; }); }, [directories]);
-    var cacheDirectoryId = react_1.default.useRef('');
-    var _b = react_1.default.useState([]), templates = _b[0], setTemplates = _b[1];
-    var _c = react_1.default.useState(false), loadingTemplate = _c[0], setLoadingTemplate = _c[1];
-    var _d = (0, recoil_1.useRecoilState)(Recoil_1.wiewMounted), isMounted = _d[0], setIsMounted = _d[1];
-    var setDeprecated = (0, recoil_1.useSetRecoilState)(Recoil_1.hasDeprecated);
-    var _e = (0, Context_1.default)(), service = _e.service, pageCode = _e.pageCode, domainId = _e.domainId;
+    var _b = (0, Context_1.default)(), pageCode = _b.pageCode, domainId = _b.domainId;
+    var getTemplateList = (0, ListenTemplate_1.usePageCache)().getTemplateList;
     var t = (0, react_i18next_1.useTranslation)().t;
-    (0, react_1.useEffect)(function () {
-        var savedDirectoryId = JSON.parse(localStorage.getItem(Constant_1.PAGE_LOGIN_DIRECTORY_SELECTED) || '{}')[Array.isArray(domainId) ? 'awingPge' : domainId];
-        if (savedDirectoryId && !pageId && !isMounted) {
-            setIsMounted(true);
-            handleChangeForm({ directoryId: savedDirectoryId }, true, 'directoryId');
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    var directories = (0, recoil_1.useRecoilValue)(Recoil_1.templateDirectoriesState);
+    var _c = (0, recoil_1.useRecoilState)(Recoil_1.wiewMounted), isMounted = _c[0], setIsMounted = _c[1];
+    var setDeprecated = (0, recoil_1.useSetRecoilState)(Recoil_1.hasDeprecated);
+    var _d = react_1.default.useState([]), templates = _d[0], setTemplates = _d[1];
+    var _e = react_1.default.useState(false), loadingTemplate = _e[0], setLoadingTemplate = _e[1];
+    var defaultDirectory = react_1.default.useMemo(function () { return directories.find(function (item) { return item.parentDirectoryId === '99'; }); }, [directories]);
     var overWriteOnChange = function (keys, value) {
         if (keys.includes('templateId')) {
             setDeprecated(false);
+            onChange(['viewDatas'], []);
         }
         onChange(keys, value);
     };
@@ -80,14 +53,22 @@ var ViewInfo = function (_a) {
             return;
         if (['templateTypeId', 'directoryId'].includes(keyUpdate)) {
             if (keyUpdate === 'directoryId') {
-                localStorage.setItem(Constant_1.PAGE_LOGIN_DIRECTORY_SELECTED, JSON.stringify((_a = {}, _a[Array.isArray(domainId) ? 'awingPge' : domainId] = obj[keyUpdate], _a)));
+                localStorage.setItem(Constant_2.PAGE_LOGIN_DIRECTORY_SELECTED, JSON.stringify((_a = {}, _a[Array.isArray(domainId) ? 'awingPge' : domainId] = obj[keyUpdate], _a)));
             }
-            overWriteOnChange(['templateId'], null);
+            overWriteOnChange(['templateId'], '');
         }
         overWriteOnChange([keyUpdate], obj[keyUpdate]);
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []);
+    react_1.default.useEffect(function () {
+        var savedDirectoryId = JSON.parse(localStorage.getItem(Constant_2.PAGE_LOGIN_DIRECTORY_SELECTED) || '{}')[Array.isArray(domainId) ? 'awingPge' : domainId];
+        if (savedDirectoryId && !pageId && !isMounted) {
+            setIsMounted(true);
+            handleChangeForm({ directoryId: savedDirectoryId }, true, 'directoryId');
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
     react_1.default.useEffect(function () {
         var fieldsRequireStatus = !(0, Utils_1.getFieldsValid)(viewInfoData.viewDatas).includes(false);
         onChange(['fieldsRequireStatus'], fieldsRequireStatus);
@@ -98,6 +79,10 @@ var ViewInfo = function (_a) {
         var validStatus = !(isValidationFields === null || isValidationFields === void 0 ? void 0 : isValidationFields.includes(false)) &&
             fieldsRequireStatus &&
             validProcessStatus === enums_1.VALID_PROCESS_CODE.VALIDATED;
+        var directoryId = viewInfoData.directoryId;
+        if (directoryId) {
+            getTemplates(directoryId, viewInfoData.templateId);
+        }
         onChange(['validStatus'], validStatus);
         // onChangeCompletedTab("1", validStatus);
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -108,24 +93,17 @@ var ViewInfo = function (_a) {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [viewInfoData, defaultDirectory]);
-    react_1.default.useEffect(function () {
-        var directoryId = viewInfoData.directoryId;
-        if (directoryId && cacheDirectoryId.current !== directoryId) {
-            cacheDirectoryId.current = directoryId;
-            getTemplates(directoryId);
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [viewInfoData]);
-    var getTemplates = function (directoryId) {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    var getTemplates = react_1.default.useCallback((0, lodash_1.debounce)(function (directoryId, templateId) {
+        if (templateId === void 0) { templateId = ''; }
         setLoadingTemplate(true);
-        service
-            .templatesGetByDirectoryId(directoryId)
+        getTemplateList(directoryId)
             .then(function (res) {
-            var viewDeprecate = res.find(function (x) { return x.id === viewInfoData.templateId && x.isDeprecated; });
+            var viewDeprecate = res.find(function (x) { return x.id === templateId && x.isDeprecated; });
             setTemplates(res.filter(function (x) { return !x.isDeprecated; }).concat(viewDeprecate ? [viewDeprecate] : []));
         })
             .finally(function () { return setLoadingTemplate(false); });
-    };
+    }, Constant_1.Constants.DEBOUNCE_TIME_300), []);
     var templateOptions = react_1.default.useMemo(function () {
         var result = [];
         if (viewInfoData.templateTypeId) {

package/lib/ACM-AXN/Page/CreateOrEdit/Tabview/index.js

@@ -38,12 +38,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var immer_1 = __importDefault(require("immer"));
+var Helpers_1 = require("../../../../Utils/Helpers");
+var immer_1 = require("immer");
+var lodash_1 = require("lodash");
 var react_1 = __importStar(require("react"));
 var react_i18next_1 = require("react-i18next");
 var recoil_1 = require("recoil");
+var Context_1 = require("../../../../Context");
 var Constant_1 = require("../../Constant");
-var Context_1 = __importDefault(require("../../Context"));
+var Context_2 = __importDefault(require("../../Context"));
 var enums_1 = require("../../enums");
 var Recoil_1 = require("../Recoil");
 var Utils_1 = require("../Utils");
@@ -51,39 +54,30 @@ var Panel_1 = __importDefault(require("./Components/Panel"));
 var ViewList_1 = __importDefault(require("./Components/ViewList"));
 var ViewContent_1 = __importDefault(require("./ViewContent"));
 var ViewInfo_1 = __importDefault(require("./ViewInfo"));
-var Context_2 = require("../../../../Context");
-var Helpers_1 = require("../../../../Utils/Helpers");
 var TabView = function (_a) {
     var isCreate = _a.isCreate;
     var _b = (0, recoil_1.useRecoilState)((0, Recoil_1.pageState)('views')), _c = _b[0], views = _c.views, page = _c.page, setView = _b[1];
     var _d = react_1.default.useState(0), activeViewIndex = _d[0], setActiveViewIndex = _d[1];
-    var _e = react_1.default.useState([]), directories = _e[0], setDirectories = _e[1];
-    var _f = react_1.default.useState([]), templateTypes = _f[0], setTemplateTypes = _f[1];
-    var _g = (0, Context_1.default)(), service = _g.service, pageCode = _g.pageCode;
-    var appHelper = (0, Context_2.useAwing)().appHelper;
+    var _e = (0, recoil_1.useRecoilState)(Recoil_1.templateDirectoriesState), directories = _e[0], setDirectories = _e[1];
+    var _f = (0, recoil_1.useRecoilState)(Recoil_1.templateTypeState), templateTypes = _f[0], setTemplateTypes = _f[1];
+    var _g = (0, Context_2.default)(), service = _g.service, pageCode = _g.pageCode;
+    var appHelper = (0, Context_1.useAwing)().appHelper;
     var t = (0, react_i18next_1.useTranslation)().t;
     react_1.default.useEffect(function () {
         fetchData();
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    // React.useLayoutEffect(() => {
-    //     const tempId = setTimeout(() => {
-    //         setTempLoading(false)
-    //     }, 0)
-    //     return () => {
-    //         clearTimeout(tempId)
-    //         setTempLoading(true)
-    //     }
-    // }, [activeViewIndex])
     var fetchData = function () {
         Promise.all([
-            service.templatesGetDirectories(),
-            service.templateTypesGet(),
+            !directories.length ? service.templatesGetDirectories() : Promise.resolve(directories),
+            !templateTypes.length ? service.templateTypesGet() : Promise.resolve(templateTypes),
         ]).then(function (_a) {
-            var directories = _a[0], templateTypes = _a[1];
-            setDirectories(directories);
-            setTemplateTypes(function () {
-                var result = templateTypes.filter(function (item) {
+            var resDir = _a[0], resTemplateTypes = _a[1];
+            setDirectories(function (prev) { return (0, lodash_1.isEqual)(prev, resDir) ? prev : resDir; });
+            setTemplateTypes(function (prev) {
+                if ((0, lodash_1.isEqual)(prev, resTemplateTypes))
+                    return prev;
+                var result = resTemplateTypes.filter(function (item) {
                     return item.templateTypeCode ===
                         (pageCode === enums_1.PageCode.Lgn ? 'lgn' : 'wlc');
                 });
@@ -97,12 +91,13 @@ var TabView = function (_a) {
         });
     };
     var addPageView = function () {
-        setView((0, immer_1.default)(function (draft) {
+        setView((0, immer_1.produce)(function (draft) {
+            var _a;
             var viewsValid = !views
                 .map(function (viewStatus) { return viewStatus.validStatus; })
                 .includes(false);
             if (viewsValid) {
-                draft.views.push(__assign(__assign({}, Constant_1.defaultView), { isChanged: true }));
+                draft.views.push(__assign(__assign({}, Constant_1.defaultView), { viewId: crypto.randomUUID(), isChanged: true, viewNumber: (((_a = (0, lodash_1.maxBy)(draft.views, 'viewNumber')) === null || _a === void 0 ? void 0 : _a.viewNumber) || 0) + 1 }));
                 setActiveViewIndex(draft.views.length - 1);
             }
             else {
@@ -115,31 +110,33 @@ var TabView = function (_a) {
         }));
     };
     var deletePageView = function (tabID) {
-        setView((0, immer_1.default)(function (draft) {
+        setView((0, immer_1.produce)(function (draft) {
             if (draft.views.length === 1)
                 return;
             draft.views = draft.views
                 .filter(function (value, index) { return (index !== tabID ? value : ''); })
-                .map(function (x) { return (__assign(__assign({}, x), { isChanged: true })); });
+                .map(function (x, idx) { return (__assign(__assign({}, x), { viewNumber: idx + 1, isChanged: true })); });
             setActiveViewIndex(draft.views.length - 1);
         }));
     };
     var onChange = function (keys, value) {
+        // console.log("keys", keys, "value", value, views, activeViewIndex)
         if (keys.includes('activeViewIndex')) {
             setActiveViewIndex(Number(value));
             return;
         }
-        setView((0, immer_1.default)(function (draf) {
-            (0, Helpers_1.setObject)(draf, keys, value);
+        setView((0, immer_1.produce)(function (draft) {
+            if (draft.views.length < Number(keys[1] || 0) + 1)
+                return;
+            (0, Helpers_1.setObject)(draft, keys, value);
         }));
     };
     var handleChange = function (key) {
         if (key === void 0) { key = []; }
         return (0, Utils_1.composeKey)(onChange, (0, Utils_1.concatKey)(key));
     };
-    var handleChangeView = react_1.default.useMemo(function () { return handleChange(['views', String(activeViewIndex)]); }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [activeViewIndex]);
-    return ((0, jsx_runtime_1.jsx)(ViewList_1.default, { isDisableTabHeader: false, activeViewIndex: activeViewIndex, viewCount: views.length, onChangeView: handleChange(), addView: addPageView, deleteView: deletePageView, children: (0, jsx_runtime_1.jsx)(Panel_1.default, { value: activeViewIndex, index: activeViewIndex, children: views.map(function (view, index) { return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: activeViewIndex === index && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ViewInfo_1.default, { onChange: handleChangeView, directories: directories, templateTypes: templateTypes, viewInfoData: view }), (0, jsx_runtime_1.jsx)(ViewContent_1.default, { viewInfoData: view, pageId: page.pageId, viewNumber: index, onChange: handleChangeView, isCreate: Boolean(isCreate) })] })) }, index)); }) }) }));
+    var handleChangeView = react_1.default.useMemo(function () { return handleChange(['views', String(activeViewIndex)]); }, [activeViewIndex]);
+    return ((0, jsx_runtime_1.jsx)(ViewList_1.default, { isDisableTabHeader: false, activeViewIndex: activeViewIndex, viewCount: views.length, onChangeView: handleChange(), addView: addPageView, deleteView: deletePageView, children: (0, jsx_runtime_1.jsx)(Panel_1.default, { value: activeViewIndex, index: activeViewIndex, children: views.map(function (view, index) { return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: activeViewIndex === index && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ViewInfo_1.default, { onChange: handleChangeView, templateTypes: templateTypes, viewInfoData: view, viewNumber: index + 1 }), (0, jsx_runtime_1.jsx)(ViewContent_1.default, { viewInfoData: view, pageId: page.pageId, viewNumber: index + 1, onChange: handleChangeView, isCreate: Boolean(isCreate) })] })) }, index)); }) }) }));
 };
 exports.default = TabView;

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

@@ -11,14 +11,11 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     }
     return to.concat(ar || Array.prototype.slice.call(from));
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getTemplateDatas = exports.updateStateByPageModel = exports.getFieldsValid = exports.convertValueByType = exports.convertTreeArrayToFlatArray = exports.concatKey = exports.composeKey = exports.isObject = exports.isObjectType = void 0;
 var Enum_1 = require("../../ViewTemplate/Enum");
 var lodash_1 = require("lodash");
-var immer_1 = __importDefault(require("immer"));
+var immer_1 = require("immer");
 var common_1 = require("../../ViewTemplate/common");
 var enums_1 = require("../enums");
 var Helpers_1 = require("../../../Utils/Helpers");
@@ -205,7 +202,8 @@ var objectFieldValid = function (fieldDatas, indexOfField, fieldValue, isSubFiel
 };
 function updateStateByPageModel(pageModel) {
     var page = pageModel.page, commonHtml = pageModel.commonHtml, views = pageModel.views, viewEvents = pageModel.viewEvents;
-    this.setPageRoot((0, immer_1.default)(function (draft) {
+    var randomUUID = crypto.randomUUID();
+    this.setPageRoot((0, immer_1.produce)(function (draft) {
         draft.views = views.map(function (view) { return ({
             templateId: view.templateId,
             viewDatas: view.viewDatas,
@@ -219,10 +217,12 @@ function updateStateByPageModel(pageModel) {
             fieldsRequireStatus: false,
             isChanged: false,
             verifiedStatus: enums_1.VERIFIED_STATUS.NOT_VERIFIED,
+            events: view.events || viewEvents.filter(function (event) { return event.viewNumber === view.viewDatas[0].viewNumber; }),
+            viewId: randomUUID,
+            viewNumber: view.viewNumber || view.viewDatas[0].viewNumber,
         }); }).sort(function (view1, view2) { return view1.viewDatas.at(-1).viewNumber - view2.viewDatas.at(-1).viewNumber; });
         draft.page = page;
         draft.commonHtml = commonHtml;
-        draft.viewEvents = viewEvents;
     }));
 }
 exports.updateStateByPageModel = updateStateByPageModel;

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

@@ -1,4 +1,15 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    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);
@@ -63,7 +74,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var immer_1 = __importDefault(require("immer"));
+var immer_1 = require("immer");
 var react_1 = __importStar(require("react"));
 var react_i18next_1 = require("react-i18next");
 var react_router_dom_1 = require("react-router-dom");
@@ -81,12 +92,14 @@ var Helpers_1 = require("../../../Utils/Helpers");
 var lodash_1 = require("lodash");
 var Wrapper_1 = __importDefault(require("../../../AWING/HOC/Wrapper"));
 var Context_2 = require("../../../Context");
+var ListenTemplate_1 = require("./ListenTemplate");
 var CreateOrEdit = function (_a) {
     var type = _a.type;
     var t = (0, react_i18next_1.useTranslation)().t;
     var pageId = (0, react_router_dom_1.useParams)().pageId;
     var na = (0, react_router_dom_1.useNavigate)();
     var appHelper = (0, Context_2.useAwing)().appHelper;
+    var getTemplate = (0, ListenTemplate_1.usePageCache)().getTemplate;
     var _b = (0, Context_1.default)(), service = _b.service, pageCode = _b.pageCode;
     var _c = react_1.default.useState(false), loading = _c[0], setLoading = _c[1];
     var _d = (0, recoil_1.useRecoilState)(Recoil_1.hasDeprecated), isDeprecated = _d[0], setDeprecated = _d[1];
@@ -102,7 +115,7 @@ var CreateOrEdit = function (_a) {
                     case 0:
                         if (!(type === enums_1.PathType.CREATE)) return [3 /*break*/, 2];
                         return [4 /*yield*/, service.pagesGenerateId().then(function (res) {
-                                setPageRoot((0, immer_1.default)(function (draf) {
+                                setPageRoot((0, immer_1.produce)(function (draf) {
                                     var _a;
                                     draf.page.createdDate = (0, Helpers_1.convertDateTimeToTimestamp)(new Date());
                                     draf.page.directoryId = ((_a = (0, lodash_1.minBy)(directories, 'level')) === null || _a === void 0 ? void 0 : _a.directoryId) || '';
@@ -143,7 +156,7 @@ var CreateOrEdit = function (_a) {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
     var checkDeprecated = function (templateIds) {
-        return Promise.all(templateIds.map(function (id) { return service.templatesGet(id); })).then(function (res) { return res.some(function (x) { return x.template.isDeprecated; }); });
+        return Promise.all(templateIds.map(function (id) { return getTemplate(id); })).then(function (res) { return res.some(function (x) { return x.template.isDeprecated; }); });
     };
     var fetchDirectories = function () {
         return service
@@ -154,7 +167,9 @@ var CreateOrEdit = function (_a) {
             appHelper.snackbar('error', t('Page.DeprecatedTemplate'));
             return;
         }
-        var params = [pageRoot];
+        var params = [
+            __assign(__assign({}, pageRoot), { viewEvents: pageRoot.views.map(function (x, idx) { return x.events.map(function (e) { var _a; return (__assign(__assign({}, e), { viewNumber: ((_a = x.viewDatas[0]) === null || _a === void 0 ? void 0 : _a.viewNumber) || idx + 1, pageId: pageRoot.page.pageId })); }); }).flat() })
+        ];
         if (type === enums_1.PathType.EDIT)
             params.unshift(pageId);
         return service[type === enums_1.PathType.EDIT ? 'pagesPut' : 'pagesPost'].apply(service, params);

package/lib/ACM-AXN/Page/Import/index.js

@@ -87,7 +87,7 @@ var ImportPage = function () {
                         fieldName: 'fileName',
                         type: 'text',
                         disabled: !(tempFile === null || tempFile === void 0 ? void 0 : tempFile.name),
-                        label: 'File',
+                        label: t('Common.File'),
                         inputProps: {
                             value: tempFile === null || tempFile === void 0 ? void 0 : tempFile.name,
                             readOnly: true,
@@ -117,7 +117,7 @@ var ImportPage = function () {
                         fieldName: 'Page',
                         type: 'text',
                         disabled: !((_a = importData === null || importData === void 0 ? void 0 : importData.pageSelected) === null || _a === void 0 ? void 0 : _a.title),
-                        label: 'Page',
+                        label: t('Notification.Page'),
                         inputProps: {
                             value: (_b = importData === null || importData === void 0 ? void 0 : importData.pageSelected) === null || _b === void 0 ? void 0 : _b.title,
                         },

package/lib/ACM-AXN/Page/Types.d.ts

@@ -32,6 +32,7 @@ export interface IPage {
     createdDate: Timestamp;
 }
 export interface ViewModel {
+    viewId: string;
     templateId: string;
     templateTypeId: number;
     directoryId: string;
@@ -44,6 +45,8 @@ export interface ViewModel {
     isValidationFields: any[];
     validProcessStatus: VALID_PROCESS_CODE;
     viewDatas: TemplateData[];
+    events: PageViewEvent[];
+    viewNumber?: number;
 }
 export interface PageViewEvent {
     id?: number;

package/lib/ACM-AXN/Page/enums.d.ts

@@ -26,3 +26,8 @@ export declare enum VERIFIED_STATUS {
     NOT_VERIFIED = 0,
     VERIFIED_ERROR = 1
 }
+export declare enum AdministrativeUnitType {
+    Province = 0,
+    District = 1,
+    Commune = 2
+}

package/lib/ACM-AXN/Page/enums.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VERIFIED_STATUS = exports.VALID_PROCESS_CODE = exports.TrackingType = exports.PathType = exports.FileTypeCode = exports.PageCode = void 0;
+exports.AdministrativeUnitType = exports.VERIFIED_STATUS = exports.VALID_PROCESS_CODE = exports.TrackingType = exports.PathType = exports.FileTypeCode = exports.PageCode = void 0;
 var PageCode;
 (function (PageCode) {
     PageCode[PageCode["Wlc"] = 0] = "Wlc";
@@ -36,3 +36,9 @@ var VERIFIED_STATUS;
     VERIFIED_STATUS[VERIFIED_STATUS["NOT_VERIFIED"] = 0] = "NOT_VERIFIED";
     VERIFIED_STATUS[VERIFIED_STATUS["VERIFIED_ERROR"] = 1] = "VERIFIED_ERROR";
 })(VERIFIED_STATUS || (exports.VERIFIED_STATUS = VERIFIED_STATUS = {}));
+var AdministrativeUnitType;
+(function (AdministrativeUnitType) {
+    AdministrativeUnitType[AdministrativeUnitType["Province"] = 0] = "Province";
+    AdministrativeUnitType[AdministrativeUnitType["District"] = 1] = "District";
+    AdministrativeUnitType[AdministrativeUnitType["Commune"] = 2] = "Commune";
+})(AdministrativeUnitType || (exports.AdministrativeUnitType = AdministrativeUnitType = {}));

package/lib/ACM-AXN/Permission/Components/Styles.d.ts

@@ -1,3 +1,2 @@
-import { SxProps } from '@mui/material';
-import { Theme } from '@mui/system';
+import { SxProps, Theme } from '@mui/material';
 export declare const styles: Record<string, SxProps<Theme>>;

package/lib/ACM-AXN/PlaceFilter/DataTable/component/index.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var react_i18next_1 = require("react-i18next");
+var Pagination_1 = __importDefault(require("../../../../AWING/Pagination"));
 var NoData_1 = __importDefault(require("./NoData"));
-var Pagination_1 = __importDefault(require("./Pagination"));
 var styles_1 = require("@mui/styles");
 var Enum_1 = require("../../Enum");
 var constants_1 = require("../../constants");
@@ -48,10 +48,7 @@ function DataTableComponent(props) {
                                                         !isChecked), inputProps: {
                                                     "aria-labelledby": "enhanced-table-checkbox-".concat(id),
                                                 } }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: row.name })] }, id));
-                            })] }) }) }), (0, jsx_runtime_1.jsx)(Pagination_1.default, { rowsPerPageOptions: constants_1.DEFAULT_ROWS_PER_PAGE, colSpan: 3, count: pages.total, rowsPerPage: pages.pageSize, page: pages.pageIndex, SelectProps: {
-                    inputProps: { "aria-label": "rows per page" },
-                    native: true,
-                }, onPageChange: function (e, page) {
+                            })] }) }) }), (0, jsx_runtime_1.jsx)(Pagination_1.default, { rowsPerPageOptions: constants_1.DEFAULT_ROWS_PER_PAGE, colSpan: 3, count: pages.total, rowsPerPage: pages.pageSize, page: pages.pageIndex, onPageChange: function (e, page) {
                     pages.onPageIndexChange && pages.onPageIndexChange(page);
                 }, onRowsPerPageChange: function (e) {
                     pages.onPageSizeChange &&

package/lib/ACM-AXN/PlaceFilter/Input/component/index.js

@@ -85,8 +85,7 @@ function FieldInputComponent(props) {
         return ((0, jsx_runtime_1.jsx)(GeoFencing_1.default, { initValue: filterField.value, onChange: function (value) {
                 onChange(value, index);
             }, label: filterField.label, configs: {
-                GOONG_API_KEY: (filterField === null || filterField === void 0 ? void 0 : filterField.GOONG_API_KEY) || "",
-                GOONG_MAP_KEY: (filterField === null || filterField === void 0 ? void 0 : filterField.GOONG_MAP_KEY) || "",
+                GOOGLE_MAP_KEY: (filterField === null || filterField === void 0 ? void 0 : filterField.GOOGLE_MAP_KEY) || "",
             }, value: filterField.value, limit: filterField === null || filterField === void 0 ? void 0 : filterField.radiusLimit }));
     };
     var renderMultiSelect = function (filterField, index) {

package/lib/ACM-AXN/PlaceFilter/Tag/component/TagChip.js

@@ -83,7 +83,7 @@ function TagChip(props) {
         title =
             (title.length >= constants_1.MAX_TAG_TITLE_LENGTH
                 ? "".concat(title.slice(0, constants_1.MAX_TAG_TITLE_LENGTH - 1), "...")
-                : title) || "ALL";
+                : title) || t("Common.All");
         return ((0, jsx_runtime_1.jsxs)("span", { children: ["".concat(title, ": "), numOfPreviousPlaces === numOfPlaces ? ((0, jsx_runtime_1.jsx)(TagAll_1.CustomSpan, { color: constants_1.NORMAL_COLOR, children: numOfPlaces })) : numOfPreviousPlaces < numOfPlaces ? ((0, jsx_runtime_1.jsx)(TagAll_1.CustomSpan, { color: constants_1.POSITIVE_COLOR, children: "".concat(numOfPlaces, " (+").concat(numOfPlaces - numOfPreviousPlaces, ")") })) : ((0, jsx_runtime_1.jsx)(TagAll_1.CustomSpan, { color: constants_1.NEGATIVE_COLOR, children: "".concat(numOfPlaces, " (-").concat(numOfPreviousPlaces - numOfPlaces, ")") }))] }));
     };
     var getTagInputDetail = function (tag) {