awing-library 2.1.130-beta → 2.1.130

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/Event/container.js

@@ -38,14 +38,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = __importStar(require("react"));
-var component_1 = __importDefault(require("./component"));
-var Helpers_1 = require("../../../../../Utils/Helpers");
-var Context_1 = __importDefault(require("../Context"));
-var moment_1 = __importDefault(require("moment"));
 var Enum_1 = require("../../../../../ACM-AXN/Campaign/Enum");
+var exportFile_1 = require("../../../../../ACM-AXN/CampaignSchedule/exportFile");
 var Enum_2 = require("../../../../../ACM-AXN/Common/Enum");
+var moment_1 = __importDefault(require("moment"));
+var react_1 = __importStar(require("react"));
+var Context_1 = __importDefault(require("../Context"));
 var Util_1 = require("./Util");
+var component_1 = __importDefault(require("./component"));
 var EventContainer = function (props) {
     var campaignId = props.campaignId, startDate = props.startDate, endDate = props.endDate, subCampaigns = props.subCampaigns, domains = props.domains;
     var client = (0, Context_1.default)().services;
@@ -68,92 +68,44 @@ var EventContainer = function (props) {
     }, [subCampaigns]);
     var getEventData = function (time, placeIds, ids) {
         setIsLoading(true);
-        client.campaignStatisticGet({
+        client
+            .campaignStatisticGet({
             startDate: (0, moment_1.default)(time.startDate).format(Enum_1.DATE_FORMAT),
             endDate: (0, moment_1.default)(time.endDate).format(Enum_1.DATE_FORMAT),
             timelineType: Enum_2.TimelineType.Day,
-            campaignAdGroups: [__assign({ campaignId: "5344841815813731135" }, ids)],
+            campaignAdGroups: [
+                __assign({ campaignId: campaignId }, ids),
+            ],
             analyticGroupBies: [
                 Enum_2.AnalyticGroupBy.GbEventLabel,
                 Enum_2.AnalyticGroupBy.GbTimeline,
             ],
             ignoredEventLabels: Object.values(Enum_1.BaseEvent),
             placeIds: placeIds,
-        }).then(function (res) { return setEventData((0, Util_1.convertEventData)(res)); }).finally(function () { return setIsLoading(false); });
-        // client
-        //     .statisticCampaignGetAnalyticEvent({
-        //         startDate: time.startDate.toDateString(),
-        //         endDate: time.endDate.toDateString(),
-        //         campaignAdGroups: [{ campaignId, ...ids }],
-        //         placeIds,
-        //     } as any)
-        //     .then(setEventData)
-        //     .finally(() => setIsLoading(false))
+        })
+            .then(function (res) { return setEventData((0, Util_1.convertEventData)(res)); })
+            .finally(function () { return setIsLoading(false); });
     };
     var exportData = function (time, placeIds, ids) {
-        var places = placesOfCampaign.filter(function (p) {
+        var places = placeIds.length ? placesOfCampaign.filter(function (p) {
             return placeIds.includes(p.placeId);
-        });
-        client.campaignStatisticGetEvents({
+        }) : placesOfCampaign;
+        return client
+            .campaignStatisticGetEvents({
             startDate: (0, moment_1.default)(time.startDate).format(Enum_1.DATE_FORMAT),
             endDate: (0, moment_1.default)(time.endDate).format(Enum_1.DATE_FORMAT),
             timelineType: Enum_2.TimelineType.Day,
-            campaignAdGroups: [__assign({ campaignId: "5344841815813731135" }, ids)],
+            campaignAdGroups: [
+                __assign({ campaignId: campaignId }, ids),
+            ],
             analyticGroupBies: Object.values(Enum_2.AnalyticGroupBy).filter(function (g) { return !isNaN(Number(g)); }),
             ignoredEventLabels: Object.values(Enum_1.BaseEvent),
             placeIds: placeIds,
+        })
+            .then(function (res) {
+            (0, exportFile_1.downloadWithDataSet)("export_analytic_event_campaign_".concat(campaignId), (0, Util_1.convertToExportData)(res, places));
         });
-        // client
-        //     .statisticCampaignGetEvents({
-        //         startDate: time.startDate.toDateString(),
-        //         endDate: time.endDate.toDateString(),
-        //         campaignAdGroups: [{ campaignId, ...ids }],
-        //         placeIds,
-        //     } as any)
-        //     .then((responses) => {
-        //         // if (responses.data.status === STATUS_CODE.OK) {
-        //         downloadWithDataSet(
-        //             `export_analytic_event_campaign_${campaignId}`,
-        //             convertToExportData(responses, places)
-        //         )
-        //     })
     };
-    function convertToExportData(data, places) {
-        var columns = ['Place', 'Mac Address', 'Created date', 'Event label'];
-        var exportData = [];
-        data === null || data === void 0 ? void 0 : data.forEach(function (el) {
-            var place = places.find(function (x) { return x.placeId === el.placeId; });
-            var rowData = [
-                place ? place.name : el.placeId,
-                el.macAddress,
-                (0, Helpers_1.dateTimeToString)((0, Helpers_1.convertTimestampToDateTime)(el.createdDate), 'DD/MM/YYYY, HH'),
-                el.eventLabel,
-            ];
-            var eventObject = JSON.parse(el.eventObject);
-            var keyNames = Object.keys(eventObject);
-            var _loop_1 = function (i) {
-                if (!columns.some(function (x) { return x === keyNames[i]; })) {
-                    columns.push(keyNames[i]);
-                }
-            };
-            for (var i = 0; i < keyNames.length; i++) {
-                _loop_1(i);
-            }
-            for (var i = 4; i < columns.length; i++) {
-                var dataObj = eventObject[columns[i]];
-                rowData.push(typeof dataObj === 'string'
-                    ? dataObj
-                    : JSON.stringify(dataObj));
-            }
-            exportData.push(rowData);
-        });
-        return [
-            {
-                columns: columns,
-                data: exportData,
-            },
-        ];
-    }
     return ((0, jsx_runtime_1.jsx)(component_1.default, { startDate: startDate, endDate: endDate, subCampaigns: subCampaigns, isLoading: isLoading, eventData: eventData, getEventData: getEventData, exportData: exportData, domains: domains }));
 };
 exports.default = EventContainer;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/SplitButtonExportType.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 interface Props {
     onSubmit: (value: string) => void;
+    loading?: boolean;
 }
 declare const SplitButtonExportType: React.FC<Props>;
 export default SplitButtonExportType;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/SplitButtonExportType.js

@@ -20,13 +20,25 @@ var material_1 = require("@mui/material");
 var ArrowDropDown_1 = __importDefault(require("@mui/icons-material/ArrowDropDown"));
 var common_1 = require("./common");
 var react_i18next_1 = require("react-i18next");
-var options = Object.values(common_1.EXPORT_TYPES).map(function (type, idx) { return type; });
+var i18n_1 = __importDefault(require("../../../../i18n"));
+var lab_1 = require("@mui/lab");
+var Context_1 = __importDefault(require("./Context"));
 var SplitButtonExportType = function (props) {
-    var onSubmit = props.onSubmit;
+    var onSubmit = props.onSubmit, loading = props.loading;
+    var services = (0, Context_1.default)().services;
     var _a = react_1.default.useState(false), open = _a[0], setOpen = _a[1];
     var anchorRef = react_1.default.useRef(null);
     var _b = react_1.default.useState(0), selectedIndex = _b[0], setSelectedIndex = _b[1];
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var options = react_1.default.useMemo(function () {
+        return Object.values(common_1.EXPORT_TYPES)
+            .map(function (type, idx) { return type; })
+            .filter(function (type) {
+            return services.domainsGetAll ? true : type !== 'Domain';
+        });
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    var t = (0, react_i18next_1.useTranslation)(undefined, { i18n: i18n_1.default }).t;
     var handleClick = function () {
         onSubmit(options[selectedIndex]);
     };
@@ -49,8 +61,9 @@ var SplitButtonExportType = function (props) {
         Domain: t("Campaign.ExportType.Domain"),
         Location: t('Campaign.ExportType.Location'),
         LocationGroup: t('Campaign.ExportType.LocationGroup'),
+        Ad: t('Campaign.ExportType.Ad'),
     };
-    return ((0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, direction: "column", alignItems: "center", children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: 12, children: [(0, jsx_runtime_1.jsxs)(material_1.ButtonGroup, { variant: "outlined", color: "inherit", ref: anchorRef, "aria-label": "split button", children: [(0, jsx_runtime_1.jsx)(material_1.Button, { onClick: handleClick, children: translationText[options[selectedIndex]] }), (0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", "aria-controls": open ? 'split-button-menu' : undefined, "aria-expanded": open ? 'true' : undefined, "aria-label": "select merge strategy", "aria-haspopup": "menu", onClick: handleToggle, children: (0, jsx_runtime_1.jsx)(ArrowDropDown_1.default, {}) })] }), (0, jsx_runtime_1.jsx)(material_1.Popper, { style: { zIndex: 99999 }, open: open, anchorEl: anchorRef.current, transition: true, children: function (_a) {
+    return ((0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, direction: "column", alignItems: "center", children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: 12, children: [(0, jsx_runtime_1.jsxs)(material_1.ButtonGroup, { disabled: loading, variant: "outlined", color: "inherit", ref: anchorRef, "aria-label": "split button", children: [(0, jsx_runtime_1.jsx)(lab_1.LoadingButton, { variant: 'outlined', onClick: handleClick, loading: loading, children: translationText[options[selectedIndex]] }), (0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", "aria-controls": open ? 'split-button-menu' : undefined, "aria-expanded": open ? 'true' : undefined, "aria-label": "select merge strategy", "aria-haspopup": "menu", onClick: handleToggle, children: (0, jsx_runtime_1.jsx)(ArrowDropDown_1.default, {}) })] }), (0, jsx_runtime_1.jsx)(material_1.Popper, { style: { zIndex: 99999 }, open: open, anchorEl: anchorRef.current, transition: true, children: function (_a) {
                         var TransitionProps = _a.TransitionProps, placement = _a.placement;
                         return ((0, jsx_runtime_1.jsx)(material_1.Grow, __assign({}, TransitionProps, { style: {
                                 transformOrigin: placement === 'bottom'

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/Types.d.ts

@@ -2,6 +2,7 @@
 import { CampaignGroupModel, PlaceFilter } from '../../../../ACM-AXN/Campaign/Types';
 import { ShareType } from '../../../../ACM-AXN/Common/Enum';
 import { IStatisticDTO, Timestamp } from '../../../../ACM-AXN/Common/Types';
+import { AdministrativeUnitType } from '../../../../ACM-AXN/Page/enums';
 import { BaseChartComponent } from 'react-chartjs-2/dist/types';
 export interface IAudienceObjectOverview {
     timeline?: number;
@@ -34,19 +35,27 @@ export interface AnalyticEventModelResponse {
     timeline: number;
     total: number;
 }
-export interface AnalyticEvent {
+export interface IEvent {
     eventLabel: string;
     eventObject: string;
+    viewNumber: number;
+    createdDate: Timestamp;
+}
+export interface AnalyticEvent {
+    id: number;
+    sessionId: string;
     placeId: string;
     domainId: string;
-    pageId: string;
     campaignId: string;
     campaignGroupId: number;
+    campaignAdId: number;
     macAddress: string;
     apMac: string;
-    sessionId: string;
+    isNetwork: boolean;
+    url: string;
+    userAgent: string;
+    events: IEvent[];
     createdDate: Timestamp;
-    campaignAdId: number;
 }
 export interface IDomain {
     domainId?: string;
@@ -73,6 +82,12 @@ export type DateRange = {
     startDate: Date;
     endDate: Date;
 };
+export type AdministrativeUnit = {
+    code?: string | undefined;
+    parentUnitCode?: string | undefined;
+    name?: string | undefined;
+    type?: AdministrativeUnitType;
+};
 export interface CampaignAnalyticService {
     campaignStatisticGetEvents(body: IStatisticDTO | undefined): Promise<AnalyticEvent[]>;
     campaignStatisticGetCustomer(startDate: string | undefined, endDate: string | undefined, campaignId: string | undefined): Promise<AudienceObjectReply>;
@@ -80,12 +95,15 @@ export interface CampaignAnalyticService {
     domainsGetAll?: () => Promise<IDomain[]>;
     placesGetPagingByPlaceFilter: (pageIndex?: number, pageSize?: number, body?: PlaceFilter) => Promise<any>;
     placesGetByPlaceFilter: (body?: PlaceFilter) => Promise<any[]>;
+    administrativeUnitsGet: () => Promise<AdministrativeUnit[]>;
 }
 export interface CampaignAnalyticProps {
     placeMultiSelectComponent: (p?: any) => JSX.Element;
+    fullPlaces?: AdministrativeUnit[];
     chart: BaseChartComponent;
     services: CampaignAnalyticService;
     campaignId: string;
+    campaignName?: string;
     isNetwork?: boolean;
     subCampaigns: CampaignGroupModel[];
 }

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/Utils.js

@@ -27,7 +27,10 @@ var getTime = function (subCampaigns) {
 exports.getTime = getTime;
 var extractEvent = function (eventLabel) {
     if (eventLabel === void 0) { eventLabel = ''; }
-    var _a = eventLabel.match(/^(\d+)_([\s\S]*)$/) || [], view = _a[1], eventName = _a[2];
+    if (!eventLabel) {
+        throw new Error('Event label is required');
+    }
+    var _a = eventLabel.match(/^(\d+)_([\s\S]*)$/) || ['', '1', eventLabel], view = _a[1], eventName = _a[2];
     return { view: view, eventName: eventName };
 };
 exports.extractEvent = extractEvent;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/common.d.ts

@@ -3,4 +3,5 @@ export declare const EXPORT_TYPES: {
     Domain: string;
     LocationGroup: string;
     Location: string;
+    Ad: string;
 };

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/common.js

@@ -4,6 +4,7 @@ exports.EXPORT_TYPES = void 0;
 exports.EXPORT_TYPES = {
     Export: "Export",
     Domain: "Domain",
-    LocationGroup: "LocationGroup",
-    Location: "Location",
+    LocationGroup: "LocationGroup", // Chiến dịch con
+    Location: "Location", // Địa điểm
+    Ad: "Ad" // Quảng cáo
 };

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/component.js

@@ -1,14 +1,18 @@
 "use strict";
+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_i18next_1 = require("react-i18next");
 var material_1 = require("@mui/material");
 var react_1 = require("react");
 var container_1 = require("./container");
+var i18n_1 = __importDefault(require("../../../../i18n"));
 var color = ['inherit', 'primary'];
 var variant = ['outlined', 'contained'];
 var TabStatistic = function (props) {
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)(undefined, { i18n: i18n_1.default }).t;
     var tabIndex = props.tabIndex, onChangeTab = props.onChangeTab, tabPanel = props.tabPanel, isNetwork = props.isNetwork;
     var translationText = (0, react_1.useMemo)(function () { return ({
         analytic: t('Campaign.Analytic'),
@@ -19,7 +23,7 @@ var TabStatistic = function (props) {
     var handleChangeTab = function (event) {
         onChangeTab(Number(event.target.tabIndex));
     };
-    return ((0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, sx: { padding: function (theme) { return theme.spacing(2); } }, className: "ahihu", children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 12, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 3, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, sx: { padding: function (theme) { return theme.spacing(2); } }, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 12, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 3, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", sx: {
                                     marginTop: function (theme) { return theme.spacing(1); },
                                     marginLeft: function (theme) { return theme.spacing(2); },
                                 }, children: translationText.title }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(material_1.ButtonGroup, { sx: {

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabStatistic/container.js

@@ -37,18 +37,44 @@ var component_1 = __importDefault(require("./component"));
 var AWING_1 = require("../../../../AWING");
 var Context_1 = __importStar(require("./Context"));
 var Hooks_1 = require("../../../../AWING/Hooks");
-var fakeCampaignData_json_1 = __importDefault(require("./fakeCampaignData.json"));
 exports.tabs = { ANALYTIC: 0, EVENT: 1, CUSTOMER: 2 };
 function TabStatisticsContainer() {
-    var _a = (0, Context_1.default)(), client = _a.services, xxy = _a.campaignId, xxx = _a.subCampaigns, isNetwork = _a.isNetwork;
-    var campaignId = fakeCampaignData_json_1.default.campaign.id;
-    var subCampaigns = fakeCampaignData_json_1.default.campaignGroups;
+    var _a = (0, Context_1.default)(), client = _a.services, campaignId = _a.campaignId, subCampaigns = _a.subCampaigns, isNetwork = _a.isNetwork, campaignName = _a.campaignName, fullPlaces = _a.fullPlaces;
     var _b = (0, react_1.useState)(exports.tabs.ANALYTIC), tabIndex = _b[0], setTabIndex = _b[1];
     var time = (0, react_1.useMemo)(function () { return (0, Utils_1.getTime)(subCampaigns); }, [subCampaigns]);
+    var _c = (0, Hooks_1.useGetData)([], function () {
+        return client.domainsGetAll
+            ? client === null || client === void 0 ? void 0 : client.domainsGetAll().then(function (res) {
+                var campaignDomains = [];
+                subCampaigns.forEach(function (s) {
+                    var _a;
+                    (_a = s === null || s === void 0 ? void 0 : s.ads) === null || _a === void 0 ? void 0 : _a.forEach(function (ad) {
+                        var _a;
+                        (_a = ad === null || ad === void 0 ? void 0 : ad.places) === null || _a === void 0 ? void 0 : _a.forEach(function (p) {
+                            var _a;
+                            var idx = campaignDomains.findIndex(function (c) { return c.domainId === p.domainId; });
+                            if (idx > -1) {
+                                campaignDomains[idx].places.push(p);
+                            }
+                            else {
+                                var domainName = (_a = res.find(function (d) { return d.domainId === p.domainId; })) === null || _a === void 0 ? void 0 : _a.name;
+                                campaignDomains.push({
+                                    domainId: p.domainId,
+                                    domainName: domainName,
+                                    places: [p],
+                                });
+                            }
+                        });
+                    });
+                });
+                return campaignDomains;
+            })
+            : Promise.resolve([]);
+    }), isLoading = _c.isLoading, data = _c.data;
     var tabPanel = function () {
         switch (tabIndex) {
             case exports.tabs.ANALYTIC:
-                return ((0, jsx_runtime_1.jsx)(Analytic_1.default, { campaignId: campaignId, subCampaigns: subCampaigns, startDate: time.startDate, endDate: time.endDate, domains: data }));
+                return ((0, jsx_runtime_1.jsx)(Analytic_1.default, { campaignId: campaignId, subCampaigns: subCampaigns, startDate: time.startDate, endDate: time.endDate, domains: data, campaignName: campaignName, fullPlaces: fullPlaces }));
             case exports.tabs.EVENT:
                 return ((0, jsx_runtime_1.jsx)(Event_1.default, { campaignId: campaignId, startDate: time.startDate, endDate: time.endDate, subCampaigns: subCampaigns, domains: data }));
             case exports.tabs.CUSTOMER:
@@ -57,33 +83,6 @@ function TabStatisticsContainer() {
                 return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
         }
     };
-    var _c = (0, Hooks_1.useGetData)([], function () {
-        return client.domainsGetAll ? client === null || client === void 0 ? void 0 : client.domainsGetAll().then(function (res) {
-            var campaignDomains = [];
-            subCampaigns.forEach(function (s) {
-                var _a;
-                (_a = s === null || s === void 0 ? void 0 : s.ads) === null || _a === void 0 ? void 0 : _a.forEach(function (ad) {
-                    var _a;
-                    (_a = ad === null || ad === void 0 ? void 0 : ad.places) === null || _a === void 0 ? void 0 : _a.forEach(function (p) {
-                        var _a;
-                        var idx = campaignDomains.findIndex(function (c) { return c.domainId === p.domainId; });
-                        if (idx > -1) {
-                            campaignDomains[idx].places.push(p);
-                        }
-                        else {
-                            var domainName = (_a = res.find(function (d) { return d.domainId === p.domainId; })) === null || _a === void 0 ? void 0 : _a.name;
-                            campaignDomains.push({
-                                domainId: p.domainId,
-                                domainName: domainName,
-                                places: [p],
-                            });
-                        }
-                    });
-                });
-            });
-            return campaignDomains;
-        }) : Promise.resolve([]);
-    }), isLoading = _c.isLoading, data = _c.data;
     var handleChangeTab = function (newValue) {
         setTabIndex(newValue);
     };

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AdList.js

@@ -136,6 +136,7 @@ function AdList(props) {
             setAdOpen({
                 subCampaignId: newAd.campaignGroupId,
                 adId: newAd.id,
+                loginId: newAd.loginId,
             });
             handleChangeAdStatus(newAd, (0, Utils_1.campaignAdValid)(newAd));
         }
@@ -269,6 +270,7 @@ function AdList(props) {
                                                             ? ads.map(function (ad) { return ({
                                                                 subCampaignId: ad.campaignGroupId,
                                                                 adId: ad.id,
+                                                                loginId: ad.loginId,
                                                             }); })
                                                             : [];
                                                     });
@@ -283,7 +285,7 @@ function AdList(props) {
                                                                 } }, getDatePropsForWeight()));
                                                         }, "aria-label": "weight", children: (0, jsx_runtime_1.jsx)(AvTimer_1.default, { fontSize: "small" }) }) }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: translationText.advanced, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: function () {
                                                             return setIsAdvancedDrawerOpen(true);
-                                                        }, "aria-label": "advanced", disabled: hasClassC, children: (0, jsx_runtime_1.jsx)(StarHalf_1.default, { fontSize: "small" }) }) }), isAdvancedDrawerOpen && ((0, jsx_runtime_1.jsx)(Advanced_1.default, { service: service, isOpen: isAdvancedDrawerOpen, onClose: function () {
+                                                        }, "aria-label": "advanced", disabled: hasClassC, children: (0, jsx_runtime_1.jsx)(StarHalf_1.default, { fontSize: "small" }) }) }), isAdvancedDrawerOpen && ((0, jsx_runtime_1.jsx)(Advanced_1.default, { loginIds: Array.from(new Set(adSelected.map(function (x) { return x.loginId; }))), service: service, isOpen: isAdvancedDrawerOpen, onClose: function () {
                                                         return setIsAdvancedDrawerOpen(false);
                                                     }, onChange: function (setStateAction) {
                                                         return onChange(adSelected, function (preCampaignAd) {
@@ -339,13 +341,14 @@ function AdList(props) {
                                                         {
                                                             subCampaignId: ad.campaignGroupId,
                                                             adId: ad.id,
+                                                            loginId: ad.loginId,
                                                         },
                                                     ]);
                                             });
                                         } }, idx));
                                 }) })] })] }), open &&
                 (0, jsx_runtime_1.jsx)(PreviewButton_1.default, { anchorEl: anchorEl, open: open, domainIds: previewId.domainIds, handlePreviewClose: handlePreviewClose, handlePreviewDomain: function (event, domainId) {
-                        handlePreview(event, ads.find(function (x) { return x.loginId === previewId.loginId; }), domainId);
+                        handlePreview(event, ads.find(function (x) { return x.loginId === previewId.loginId && x.welcomeId === previewId.welcomeId; }), domainId);
                         // handlePreview(previewId, domainId)
                     }, service: service })] }));
 }

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AdRow.js

@@ -185,7 +185,7 @@ function AdRow(props) {
                                             action: onDelete,
                                             name: translationText.delete,
                                         },
-                                    ]), true), size: "medium" }), (0, jsx_runtime_1.jsxs)("div", { onClick: function (e) { return e.stopPropagation(); }, children: [(0, jsx_runtime_1.jsx)(material_1.Snackbar, { open: openCopiedMessage, autoHideDuration: 2000, onClose: function () { return setOpenCopiedMessage(false); }, message: translationText.copied }), showTheSource && ((0, jsx_runtime_1.jsx)(ShowTheSource_1.default, { isOpen: showTheSource, onClose: function () { return setShowTheSource(false); }, loginId: ad.loginId, welcomeId: ad.welcomeId })), isAdvancedDrawerOpen && ((0, jsx_runtime_1.jsx)(Advanced_1.default, { service: service, isOpen: isAdvancedDrawerOpen, onClose: function () { return setIsAdvancedDrawerOpen(false); }, initialCampaignAdAdvanced: ad.advanced, onChange: function (setStateAction) {
+                                    ]), true), size: "medium" }), (0, jsx_runtime_1.jsxs)("div", { onClick: function (e) { return e.stopPropagation(); }, children: [(0, jsx_runtime_1.jsx)(material_1.Snackbar, { open: openCopiedMessage, autoHideDuration: 2000, onClose: function () { return setOpenCopiedMessage(false); }, message: translationText.copied }), showTheSource && ((0, jsx_runtime_1.jsx)(ShowTheSource_1.default, { isOpen: showTheSource, onClose: function () { return setShowTheSource(false); }, loginId: ad.loginId, welcomeId: ad.welcomeId })), isAdvancedDrawerOpen && ((0, jsx_runtime_1.jsx)(Advanced_1.default, { service: service, isOpen: isAdvancedDrawerOpen, onClose: function () { return setIsAdvancedDrawerOpen(false); }, loginIds: [ad.loginId], initialCampaignAdAdvanced: ad.advanced, onChange: function (setStateAction) {
                                             return onChange(function (preCampaignAd) {
                                                 return (__assign(__assign({}, preCampaignAd), { advanced: typeof setStateAction ===
                                                         'function'
@@ -200,6 +200,6 @@ function AdRow(props) {
                             paddingBottom: 0,
                             paddingTop: 0,
                             borderBottomWidth: open ? 1 : 0,
-                        }, colSpan: 3, children: (0, jsx_runtime_1.jsx)(material_1.Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: (0, jsx_runtime_1.jsx)(material_1.Box, { margin: 1, children: (0, jsx_runtime_1.jsx)(AdDetail_1.default, __assign({ ad: ad, onChange: onChange }, other)) }) }) })] })] }));
+                        }, colSpan: 3, children: (0, jsx_runtime_1.jsx)(material_1.Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: (0, jsx_runtime_1.jsx)(material_1.Box, { margin: 1, sx: { height: '416px' }, children: (0, jsx_runtime_1.jsx)(AdDetail_1.default, __assign({ ad: ad, onChange: onChange }, other)) }) }) })] })] }));
 }
 exports.default = AdRow;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AddOrEditRule/AddOrEditRule.js

@@ -63,6 +63,7 @@ var AddOrEditRule = function (props) {
             _a[Utils_1.RuleType.TargetOS] = t('Campaign.RuleType.TargetOS'),
             _a[Utils_1.RuleType.TargetDevice] = t('Campaign.RuleType.TargetDevice'),
             _a[Utils_1.RuleType.RetargetMacAddress] = t('Campaign.RuleType.RetargetMacAddress'),
+            _a[Utils_1.RuleType.Authentication] = t('Campaign.RuleType.Engagement'),
             _a),
         save: t('Common.Save'),
         invalidData: t('Common.InvalidData'),
@@ -90,6 +91,9 @@ var AddOrEditRule = function (props) {
                     eventLabel: Boolean(rule.parameter &&
                         rule.parameter.eventLabel &&
                         rule.parameter.eventLabel.length > 0),
+                    viewNumber: Boolean(rule.parameter &&
+                        rule.parameter.viewNumber &&
+                        (0, Helpers_1.validateNumber)(rule.parameter.viewNumber)),
                 };
             case Utils_1.RuleType.TargetGender:
                 return {
@@ -160,6 +164,8 @@ var AddOrEditRule = function (props) {
                 return ((0, jsx_runtime_1.jsx)(RuleForm_1.TargetDevice, { valids: valids, rule: currentRule, onChange: handleOnChange, deviceInfoGetAllRuleDevices: service === null || service === void 0 ? void 0 : service.deviceInfoGetAllRuleDevices }));
             case Utils_1.RuleType.RetargetMacAddress:
                 return ((0, jsx_runtime_1.jsx)(RuleForm_1.RetargetMacAddress, { valids: valids, rule: currentRule, onChange: handleOnChange, remarketingListGetAll: service === null || service === void 0 ? void 0 : service.remarketingListGetAll }));
+            case Utils_1.RuleType.Authentication:
+                return ((0, jsx_runtime_1.jsx)(RuleForm_1.AuthenCation, { valids: valids, rule: currentRule, onChange: handleOnChange }));
             default:
                 return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
         }

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AddOrEditRule/RuleForm/Authentication.d.ts

@@ -0,0 +1,8 @@
+import { AdvancedRule } from '../AddOrEditRule';
+interface Props {
+    rule: AdvancedRule;
+    valids: any;
+    onChange: (rule: AdvancedRule) => void;
+}
+declare const LimitAuthencation: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export default LimitAuthencation;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AddOrEditRule/RuleForm/Authentication.js

@@ -0,0 +1,47 @@
+"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);
+};
+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 Enum_1 = require("../../../../Enum");
+var LimitAuthencation = function (props) {
+    var rule = props.rule, valids = props.valids, onChange = props.onChange;
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var handleChange = function (fieldName, fieldValue) {
+        var _a;
+        onChange(__assign(__assign({}, rule), (_a = {}, _a[fieldName] = fieldValue, _a)));
+    };
+    var handleChangeParameter = function (fieldName, fieldValue) {
+        var _a;
+        handleChange('parameter', __assign(__assign({}, rule.parameter), (_a = {}, _a[fieldName] = fieldValue, _a)));
+    };
+    var translationText = {
+        operator: t('Campaign.Operator'),
+        period: t('Campaign.Period'),
+        value: t('Campaign.Detail.Value'),
+        periodHelperText: t('Campaign.PeriodHelperText'),
+        helperText: t('Common.Required'),
+    };
+    return ((0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, spacing: 2, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(material_1.TextField, { id: 'operator', variant: "standard", name: 'operator', select: true, fullWidth: true, label: translationText.operator, value: rule.operator, onChange: function (e) { return handleChange('operator', e.target.value); }, children: Object.entries(Enum_1.EnumOperator).map(function (_a) {
+                        var key = _a[0], val = _a[1];
+                        return ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: val.id, children: val.text }, val.id));
+                    }) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(material_1.TextField, { id: "value", name: "value", variant: "standard", type: "number", fullWidth: true, label: translationText.value, value: rule.value, onChange: function (e) { return handleChange('value', e.target.value); }, error: valids && !valids.value, helperText: valids && !valids.value
+                        ? translationText.helperText
+                        : '' }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 12, children: (0, jsx_runtime_1.jsx)(material_1.TextField, { id: "period", variant: "standard", name: "period", type: "number", fullWidth: true, label: translationText.period, value: rule.parameter.period, onChange: function (e) {
+                        return handleChangeParameter('period', e.target.value);
+                    }, error: valids && !valids.period, helperText: valids && !valids.period
+                        ? translationText.helperText
+                        : translationText.periodHelperText }) })] }));
+};
+exports.default = LimitAuthencation;