awing-library 2.1.2-beta → 2.1.3

package/README.md

@@ -35,63 +35,32 @@ yarn build
 -   Step 2: Tạo link thư viện
 
 ```shell
+yarn build
 yarn link
-```
-
--   Step 3: Xoá dependencies trong node_modules
-
-```shell
-rm -rf node_modules/react node_modules/react-dom node_modules/@mui/styles node_modules/@mui/material
-```
-
-## In project
-
-_Sau khi thực hiện mỗi lệnh đều phải trở về thư mục gốc của project_
-
--   Xoá thư mục awing-library tại project
-
-```shell
-rm -rf node_modules/awing-library
-```
-
--   Link awing-library to project
-
-```shell
-yarn link awing-library
-```
-
--   Tạo Link react
-
-```shell
 cd node_modules/react
 yarn link
-```
-
--   Tạo Link react-dom
-
-```shell
+cd ../..
 cd node_modules/react-dom
 yarn link
-```
-
--   Tạo Link @mui/material
-
-```shell
+cd ../..
 cd node_modules/@mui/material
 yarn link
-```
-
--   Tạo Link @mui/styles
-
-```shell
+cd ../../..
 cd node_modules/@mui/styles
 yarn link
 ```
 
-**Sau đó qua lại library**
+## In project
 
--   liên kết các dependencies vừa tạo link
+_Sau khi thực hiện mỗi lệnh đều phải trở về thư mục gốc của project_
+
+-   Xoá dependencies trong node_modules
+
+```shell
+rm -rf node_modules/react node_modules/react-dom node_modules/@mui/styles node_modules/@mui/material node_modules/awing-library
+```
 
+-   Link library to project
 ```shell
-yarn link react react-dom @mui/material @mui/styles
+yarn link react react-dom @mui/material @mui/styles awing-library
 ```

package/lib/ACM-AXN/Campaign/Container.js

@@ -256,20 +256,19 @@ var CampaignContainer = function () {
                 },
                 {
                     field: 'booking',
-                    headerName: t('Campaign.BookingText'),
+                    headerName: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '150px', textAlign: 'right' }, children: t('Campaign.BookingText') }),
                     valueGetter: function (row) {
                         var _a;
+                        var text = '';
                         if ((_a = row === null || row === void 0 ? void 0 : row.campaign) === null || _a === void 0 ? void 0 : _a.id) {
-                            return (0, Utils_1.getTotalBooking)(row === null || row === void 0 ? void 0 : row.campaignGroups);
+                            text = (0, Utils_1.getTotalBooking)(row === null || row === void 0 ? void 0 : row.campaignGroups);
                         }
                         else {
-                            return (0, Utils_1.checkPriority)(row.campaignGroup.priority, Types_1.CampaignPriority.ClassB)
+                            text = (0, Utils_1.checkPriority)(row.campaignGroup.priority, Types_1.CampaignPriority.ClassB)
                                 ? (0, Helpers_1.roundDecimalNumber)(row.campaignGroup.bookingAmount)
                                 : 'N/A';
                         }
-                    },
-                    TableCellProps: {
-                        align: 'right',
+                        return (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '150px', textAlign: 'right' }, children: text });
                     },
                 },
             ], rows: (0, Utils_1.formatListCampaign)(listCampaign === null || listCampaign === void 0 ? void 0 : listCampaign.items, collapseIds) || [], rowActions: [

package/lib/ACM-AXN/Campaign/Container.test.js

@@ -244,7 +244,7 @@ jest.mock('CustomHooks/useAppHelper', function () { return ({
     }); },
 }); });
 // Mock PageManagement
-jest.mock('awing-library/lib/AWING/PageManagement', function () { return ({
+jest.mock('AWING/PageManagement', function () { return ({
     PageManagement: function (props) {
         return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("button", { "data-testid": "onChangeQueryInput", onClick: function () {
                         props.onChangeQueryInput({

package/lib/ACM-AXN/Campaign/CreateOrEdit/Recoils.d.ts

@@ -1,6 +1,7 @@
-import { CampaignModel, Directory, CampaignGroupModel } from '../Types';
+import { CampaignModel, Directory, CampaignGroupModel, Attribute } from '../Types';
 import { WeightContainerProps } from './TabSubCampaign/Weight';
 export declare const directoriesState: import("recoil").RecoilState<Directory[]>;
+export declare const attributesState: import("recoil").RecoilState<Attribute[]>;
 export declare const isCreateState: import("recoil").RecoilState<boolean>;
 /**
  * Đánh dấu việc cần xác nhận lại trước khi đóng (set thành true khi có bất kỳ chỉnh sửa campaign nào)
@@ -17,6 +18,7 @@ export declare const campaignState: import("recoil").RecoilState<import("../Type
 /**
  * State lưu thông tin của CampaignAttributes
  */
+export declare const campaignAttributesState: import("recoil").RecoilState<import("../Types").CampaignAttribute[]>;
 /**
  * State lưu thông tin của chiến dịch con
  */

package/lib/ACM-AXN/Campaign/CreateOrEdit/Recoils.js

@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.weightState = exports.readyForSubmitState = exports.tabPartnerValidState = exports.tabSubCampaignValidState = exports.tabInfomationValidState = exports.campaignPartnerState = exports.campaignGroupsState = exports.campaignState = exports.campaignModelState = exports.confirmExitState = exports.isCreateState = exports.directoriesState = void 0;
+exports.weightState = exports.readyForSubmitState = exports.tabPartnerValidState = exports.tabSubCampaignValidState = exports.tabInfomationValidState = exports.campaignPartnerState = exports.campaignGroupsState = exports.campaignAttributesState = exports.campaignState = exports.campaignModelState = exports.confirmExitState = exports.isCreateState = exports.attributesState = exports.directoriesState = void 0;
 var recoil_1 = require("recoil");
 var Types_1 = require("../Types");
 var Utils_1 = require("../Utils");
@@ -20,6 +20,10 @@ exports.directoriesState = (0, recoil_1.atom)({
     key: 'DirectoriesCampaignState',
     default: [],
 });
+exports.attributesState = (0, recoil_1.atom)({
+    key: 'attributesState',
+    default: [],
+});
 exports.isCreateState = (0, recoil_1.atom)({
     key: 'isCreateState',
     default: false,
@@ -82,25 +86,22 @@ exports.campaignState = (0, recoil_1.selector)({
 /**
  * State lưu thông tin của CampaignAttributes
  */
-// export const campaignAttributesState = selector({
-//     key: 'campaignAttributes',
-//     get: ({get}) => {
-//         const campaignModel = get(campaignModelState);
-//         return campaignModel.campaignAttributes;
-//     },
-//     set: ({set, get}, newAttributes) => {
-//         const campaignModel = get(campaignModelState);
-//         set(campaignModelState,
-//             newAttributes instanceof DefaultValue ?
-//             newAttributes :
-//             {
-//                 ...campaignModel,
-//                 campaignAttributes: newAttributes
-//             });
-//         if (!get(confirmExitState))
-//             set(confirmExitState, true);
-//     }
-// })
+exports.campaignAttributesState = (0, recoil_1.selector)({
+    key: 'campaignAttributes',
+    get: function (_a) {
+        var get = _a.get;
+        var campaignModel = get(exports.campaignModelState);
+        return campaignModel.campaignAttributes;
+    },
+    set: function (_a, campaignAttributes) {
+        var set = _a.set, get = _a.get;
+        var campaignModel = get(exports.campaignModelState);
+        set(exports.campaignModelState, campaignAttributes instanceof recoil_1.DefaultValue ?
+            campaignAttributes : __assign(__assign({}, campaignModel), { campaignAttributes: campaignAttributes }));
+        if (!get(exports.confirmExitState))
+            set(exports.confirmExitState, true);
+    }
+});
 /**
  * State lưu thông tin của chiến dịch con
  */
@@ -151,7 +152,7 @@ exports.tabInfomationValidState = (0, recoil_1.atom)({
         get: function (_a) {
             var get = _a.get;
             var campaignModel = get(exports.campaignModelState);
-            return (0, Utils_1.tabInfomationValid)(campaignModel.campaign, campaignModel.campaignAttributes.length ? campaignModel.campaignAttributes.length : [""]);
+            return (0, Utils_1.tabInfomationValid)(campaignModel.campaign, campaignModel.campaignAttributes);
         },
     }),
 });

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabInfomation.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import React from 'react';
 declare const Infomation: React.FC;
 export default Infomation;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabInfomation.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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -18,14 +41,18 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var immer_1 = __importDefault(require("immer"));
 var lodash_1 = require("lodash");
-var react_1 = require("react");
+var react_1 = __importStar(require("react"));
 var react_i18next_1 = require("react-i18next");
 var recoil_1 = require("recoil");
 var AWING_1 = require("../../../AWING");
 var Recoils_1 = require("./Recoils");
+var Hooks_1 = __importDefault(require("../Hooks"));
 var Infomation = function () {
+    var service = (0, Hooks_1.default)().service;
     var directories = (0, recoil_1.useRecoilValue)(Recoils_1.directoriesState);
+    var attributes = (0, recoil_1.useRecoilValue)(Recoils_1.attributesState);
     var _a = (0, recoil_1.useRecoilState)(Recoils_1.campaignState), campaign = _a[0], setCampaign = _a[1];
+    var _b = (0, recoil_1.useRecoilState)(Recoils_1.campaignAttributesState), campaignAttributes = _b[0], setCampaignAttributes = _b[1];
     var setCampaignModel = (0, recoil_1.useSetRecoilState)(Recoils_1.campaignModelState);
     var t = (0, react_i18next_1.useTranslation)().t;
     (0, react_1.useEffect)(function () {
@@ -37,36 +64,64 @@ var Infomation = function () {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [directories]);
-    var handleUpdate = (0, react_1.useCallback)(function (obj, formValid) {
-        if (!(0, lodash_1.isEmpty)(obj)) {
-            setCampaign(function (prev) { return (__assign(__assign({}, prev), obj)); });
+    (0, react_1.useEffect)(function () {
+        if (!service.attributesGetByObjectTypeCode) {
+            setCampaignAttributes([""]);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps     
+    }, [service]);
+    var handleUpdate = (0, react_1.useCallback)(function (obj, formValid, fieldUpdate) {
+        if (fieldUpdate) {
+            if (fieldUpdate === 'attributeIds') {
+                setCampaignAttributes(obj['attributeIds'].map(function (item) { return ({ attributeId: item }); }));
+            }
+            else {
+                setCampaign(function (prev) { return (__assign(__assign({}, prev), obj)); });
+            }
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
+    var fieldDefine = react_1.default.useMemo(function () {
+        var fields = [
+            {
+                fieldName: 'directoryId',
+                type: 'select',
+                label: t('Common.Directory'),
+                required: true,
+                options: directories.map(function (directory) { return ({
+                    value: directory.directoryId,
+                    text: directory.name,
+                    level: directory.level,
+                }); }),
+            },
+            {
+                length: 200,
+                fieldName: 'name',
+                type: 'text',
+                label: t('Campaign.Name'),
+                required: true,
+            },
+        ];
+        if (attributes.length) {
+            fields.push({
+                fieldName: 'attributeIds',
+                type: 'autocomplete',
+                multiple: true,
+                label: t('Campaign.Attributes'),
+                required: true,
+                options: attributes.map(function (attribute) { return ({
+                    value: attribute.id,
+                    text: attribute.name,
+                }); }),
+            });
+        }
+        return fields;
+    }, [attributes, directories, t]);
     return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
             '&>div': {
                 padding: 0,
                 boxShadow: 'none',
             },
-        }, children: (0, jsx_runtime_1.jsx)(AWING_1.DataForm, { fields: [
-                {
-                    fieldName: 'directoryId',
-                    type: 'select',
-                    label: t('Common.Directory'),
-                    required: true,
-                    options: directories.map(function (directory) { return ({
-                        value: directory.directoryId,
-                        text: directory.name,
-                        level: directory.level,
-                    }); }),
-                },
-                {
-                    length: 200,
-                    fieldName: 'name',
-                    type: 'text',
-                    label: t('Campaign.Name'),
-                    required: true,
-                },
-            ], checkAllRequiredFields: !(campaign.directoryId && campaign.name), oldValue: campaign, onUpdate: handleUpdate }) }));
+        }, children: (0, jsx_runtime_1.jsx)(AWING_1.DataForm, { fields: fieldDefine, checkAllRequiredFields: !(campaign.directoryId && campaign.name), oldValue: __assign(__assign({}, campaign), { attributeIds: campaignAttributes.map(function (item) { return item.attributeId; }) }), onUpdate: handleUpdate }) }));
 };
 exports.default = Infomation;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AdDetail.test.js

@@ -16,7 +16,7 @@ function MockComponent(props) {
 // const MockComponentFactory = (name: string) => () => (props: any) => <div><div/>
 jest.mock('Features/PlaceFilter', function () { return MockComponent; });
 jest.mock("Components/Typescript/AsynchronousAutocomplete", function () { return MockComponent; });
-jest.mock("awing-library/lib/AWING/DateRangePicker", function () { return MockComponent; });
+jest.mock("AWING/DateRangePicker", function () { return MockComponent; });
 jest.mock('Services/DirectoryPermission', function () { return ({
     getByObjectTypeCode: function () { return new Promise(function (resolve) {
         resolve({

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

@@ -60,6 +60,9 @@ var Utils_1 = require("../../Utils");
 var Helpers_1 = require("../../../../Utils/Helpers");
 var Context_1 = require("../../../../Context");
 var Recoils_1 = require("../Recoils");
+var DomainPreview_1 = __importDefault(require("../../../../ACM-AXN/DomainPreview"));
+var Constant_1 = require("../../../../ACM-AXN/Campaign/Constant");
+var PreviewButton_1 = __importDefault(require("../../../../ACM-AXN/DomainPreview/PreviewButton"));
 function AdList(props) {
     var onCreate = props.onCreate, onChange = props.onChange, onDelete = props.onDelete, onAdsValidChange = props.onAdsValidChange;
     var t = (0, react_i18next_1.useTranslation)().t;
@@ -70,11 +73,18 @@ function AdList(props) {
     var _c = (0, recoil_1.useRecoilState)(atoms_1.adOpenState), adOpen = _c[0], setAdOpen = _c[1];
     var copiedAd = (0, recoil_1.useRecoilValue)(atoms_1.copiedAdState);
     var hasClassC = (0, recoil_1.useRecoilValue)((0, atoms_1.checkGroupsClassCState)(adSelected.map(function (x) { return x.subCampaignId; })));
+    var _d = (0, react_1.useState)({
+        welcomeId: '',
+        loginId: '',
+        domainIds: [],
+    }), previewId = _d[0], setPreviewId = _d[1];
+    var _e = react_1.default.useState(), anchorEl = _e[0], setAnchorEl = _e[1];
+    var open = Boolean(anchorEl);
     // valid theo cấu trúc { [campaignGroupId]: { [adId]: boolean } }
-    var _d = (0, react_1.useState)({}), adsValid = _d[0], setAdsValid = _d[1];
-    var _e = (0, react_1.useState)(false), isAdvancedDrawerOpen = _e[0], setIsAdvancedDrawerOpen = _e[1];
-    var _f = (0, recoil_1.useRecoilState)(Recoils_1.weightState), weightProps = _f[0], setWeightState = _f[1];
-    var _g = (0, react_1.useState)(false), isMultiEditDrawerOpen = _g[0], setIsMultiEditDrawerOpen = _g[1];
+    var _f = (0, react_1.useState)({}), adsValid = _f[0], setAdsValid = _f[1];
+    var _g = (0, react_1.useState)(false), isAdvancedDrawerOpen = _g[0], setIsAdvancedDrawerOpen = _g[1];
+    var _h = (0, recoil_1.useRecoilState)(Recoils_1.weightState), weightProps = _h[0], setWeightState = _h[1];
+    var _j = (0, react_1.useState)(false), isMultiEditDrawerOpen = _j[0], setIsMultiEditDrawerOpen = _j[1];
     (0, react_1.useEffect)(function () {
         var newAdValid = {};
         ads.forEach(function (ad) {
@@ -219,6 +229,33 @@ function AdList(props) {
         advanced: t('Campaign.Advanced'),
         delete: t('Common.Delete'),
     };
+    /**
+     * Hàm khi xem preview
+     */
+    var handlePreview = function (e, ad, doaminId) {
+        e.stopPropagation();
+        var url = "".concat(Constant_1.Constants.CAPTIVE_DOMAIN, "/").concat(Constant_1.Constants.PAGE_LOGIN_PREVIEW, "?loginId=").concat(ad.loginId, "&isNetworkCampaign=false");
+        if (ad.welcomeId.length)
+            url += "&welcomeId=".concat(ad.welcomeId);
+        if (doaminId)
+            url += "&doaminId=".concat(doaminId);
+        window.open(url, '_blank');
+    };
+    var handlePreviewPage = function (e, ad) {
+        var _a, _b;
+        e.stopPropagation();
+        setPreviewId({
+            welcomeId: ad.welcomeId,
+            loginId: ad.loginId,
+            domainIds: (_b = (_a = ad.places) === null || _a === void 0 ? void 0 : _a.map(function (x) { return x.domainId; })) !== null && _b !== void 0 ? _b : [],
+        });
+        setAnchorEl(e.currentTarget);
+    };
+    var handlePreviewClose = function (event) {
+        event.stopPropagation();
+        setPreviewId({});
+        setAnchorEl(null);
+    };
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [weightProps.isOpen && ((0, jsx_runtime_1.jsx)(Weight_1.default, {})), (0, jsx_runtime_1.jsxs)(material_1.TableContainer, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h4", sx: {
                             padding: function (theme) { return theme.spacing(2); },
                             fontSize: '16px!important',
@@ -261,6 +298,7 @@ function AdList(props) {
                                                     }, onChange: handleMultiUpdate })), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: translationText.delete, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: function () {
                                                             return handleMultiDelete(adSelected);
                                                         }, "aria-label": "delete", children: (0, jsx_runtime_1.jsx)(Delete_1.default, { fontSize: "small" }) }) })] })), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: onCreate && ((0, jsx_runtime_1.jsxs)(material_1.ButtonGroup, { variant: "outlined", color: "error", children: [(0, jsx_runtime_1.jsx)(material_1.Button, { startIcon: (0, jsx_runtime_1.jsx)(Add_1.default, {}), onClick: function () { return handleAddAd(); }, children: t('Common.Create') }), copiedAd !== undefined && ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", "aria-label": "paste", onClick: function () { return handleAddAd(true); }, children: (0, jsx_runtime_1.jsx)(Assignment_1.default, {}) }))] })) })] }) }), (0, jsx_runtime_1.jsx)(material_1.TableBody, { children: ads.map(function (ad, idx) {
+                                    var _a;
                                     var isOpen = adOpen !== undefined &&
                                         adOpen.adId === ad.id &&
                                         adOpen.subCampaignId === ad.campaignGroupId;
@@ -270,7 +308,9 @@ function AdList(props) {
                                     };
                                     return ((0, jsx_runtime_1.jsx)(AdRow_1.default, { ad: ad, onChange: function (adSetStateAction) {
                                             return onChange([adDefine], adSetStateAction);
-                                        }, onChangeStatus: function (status) {
+                                        }, previewButton: (0, jsx_runtime_1.jsx)("span", { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { "aria-label": "preview", onClick: function (e) {
+                                                    handlePreview(e, ad);
+                                                }, disabled: !((_a = ad.loginId) === null || _a === void 0 ? void 0 : _a.length), sx: { borderRadius: '15%' }, children: (0, jsx_runtime_1.jsx)(DomainPreview_1.default, { handlePreviewPage: function (e) { return handlePreviewPage(e, ad); }, isSelectDomain: Boolean(service.domainsGetAll) }) }) }), onChangeStatus: function (status) {
                                             return handleChangeAdStatus(ad, status);
                                         }, onDelete: function () {
                                             return handleMultiDelete([adDefine]);
@@ -302,6 +342,10 @@ function AdList(props) {
                                                     ]);
                                             });
                                         } }, 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(previewId, domainId)
+                    }, service: service })] }));
 }
 exports.default = AdList;

package/lib/ACM-AXN/Campaign/CreateOrEdit/TabSubCampaign/AdRow.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { AdDetailProps } from './AdDetail';
 type AdRowProps = AdDetailProps & {
     /**
@@ -24,6 +25,10 @@ type AdRowProps = AdDetailProps & {
      * Trạng thái lỗi hay không của quảng cáo
      */
     error?: boolean;
+    /**
+     * Preview Button
+     */
+    previewButton: React.ReactNode;
 };
 export default function AdRow(props: AdRowProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -62,7 +62,6 @@ var react_1 = __importStar(require("react"));
 var react_i18next_1 = require("react-i18next");
 var recoil_1 = require("recoil");
 var material_1 = require("@mui/material");
-var Visibility_1 = __importDefault(require("@mui/icons-material/Visibility"));
 var KeyboardArrowDown_1 = __importDefault(require("@mui/icons-material/KeyboardArrowDown"));
 var KeyboardArrowUp_1 = __importDefault(require("@mui/icons-material/KeyboardArrowUp"));
 var CheckCircle_1 = __importDefault(require("@mui/icons-material/CheckCircle"));
@@ -87,27 +86,16 @@ var AWING_1 = require("../../../../AWING");
 var Constant_1 = require("../../Constant");
 var Recoils_1 = require("../Recoils");
 function AdRow(props) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d;
     var t = (0, react_i18next_1.useTranslation)().t;
-    var ad = props.ad, onChange = props.onChange, onDelete = props.onDelete, open = props.open, onToggle = props.onToggle, isSelected = props.isSelected, onCheck = props.onCheck, error = props.error, other = __rest(props, ["ad", "onChange", "onDelete", "open", "onToggle", "isSelected", "onCheck", "error"]);
+    var ad = props.ad, onChange = props.onChange, onDelete = props.onDelete, open = props.open, onToggle = props.onToggle, isSelected = props.isSelected, onCheck = props.onCheck, error = props.error, previewButton = props.previewButton, other = __rest(props, ["ad", "onChange", "onDelete", "open", "onToggle", "isSelected", "onCheck", "error", "previewButton"]);
     var service = (0, Hooks_1.default)().service;
     var setCopiedAd = (0, recoil_1.useSetRecoilState)(atoms_1.copiedAdState);
     var setWeightState = (0, recoil_1.useSetRecoilState)(Recoils_1.weightState);
-    var _f = (0, react_1.useState)(false), openCopiedMessage = _f[0], setOpenCopiedMessage = _f[1];
-    var _g = (0, react_1.useState)(false), showTheSource = _g[0], setShowTheSource = _g[1];
-    var _h = (0, react_1.useState)(false), isAdvancedDrawerOpen = _h[0], setIsAdvancedDrawerOpen = _h[1];
-    var _j = (0, react_1.useState)(false), isWeightDrawerOpen = _j[0], setIsWeightDrawerOpen = _j[1];
+    var _e = (0, react_1.useState)(false), openCopiedMessage = _e[0], setOpenCopiedMessage = _e[1];
+    var _f = (0, react_1.useState)(false), showTheSource = _f[0], setShowTheSource = _f[1];
+    var _g = (0, react_1.useState)(false), isAdvancedDrawerOpen = _g[0], setIsAdvancedDrawerOpen = _g[1];
     var isClassC = (0, recoil_2.useRecoilValue)((0, atoms_2.checkGroupsClassCState)([ad.campaignGroupId]));
-    /**
-     * Hàm khi xem preview
-     */
-    var handlePreview = function (e) {
-        e.stopPropagation();
-        var url = "".concat(Constant_1.Constants.CAPTIVE_DOMAIN, "/").concat(Constant_1.Constants.PAGE_LOGIN_PREVIEW, "?loginId=").concat(ad.loginId, "&isNetworkCampaign=false");
-        if (ad.welcomeId.length)
-            url += "&welcomeId=".concat(ad.welcomeId);
-        window.open(url, '_blank');
-    };
     var translationText = {
         preview: t('Common.Preview'),
         copy: t('Common.Copy'),
@@ -147,7 +135,7 @@ function AdRow(props) {
                                                 Constant_1.Constants.CAMPAIGN_EDIT_PAGE,
                                                 Enum_1.PAGE_CODES.PageCodeWelcome,
                                                 ad.welcomeId,
-                                            ].join('/'), children: (_d = ad.welcomePage) === null || _d === void 0 ? void 0 : _d.title }) })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.TableCell, { sx: { padding: function (theme) { return theme.spacing(0, 2); } }, align: "right", children: [(0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: translationText.preview, children: (0, jsx_runtime_1.jsx)("span", { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { "aria-label": "preview", onClick: handlePreview, disabled: !((_e = ad.loginId) === null || _e === void 0 ? void 0 : _e.length), children: (0, jsx_runtime_1.jsx)(Visibility_1.default, { fontSize: "small" }) }) }) }), (0, jsx_runtime_1.jsx)(AWING_1.Actions, { menus: __spreadArray([
+                                            ].join('/'), children: (_d = ad.welcomePage) === null || _d === void 0 ? void 0 : _d.title }) })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.TableCell, { sx: { padding: function (theme) { return theme.spacing(0, 2); } }, align: "right", children: [(0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: translationText.preview, children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: previewButton }) }), (0, jsx_runtime_1.jsx)(AWING_1.Actions, { menus: __spreadArray([
                                     {
                                         icon: (0, jsx_runtime_1.jsx)(FileCopyOutlined_1.default, {}),
                                         action: function () {

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

@@ -62,6 +62,7 @@ var AddOrEditRule = function (props) {
             _a[Utils_1.RuleType.TargetAge] = t('Campaign.RuleType.TargetAge'),
             _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),
         save: t('Common.Save'),
         invalidData: t('Common.InvalidData'),
@@ -109,10 +110,10 @@ var AddOrEditRule = function (props) {
                 return {
                     value: Array.isArray(rule.value) && rule.value.length > 0,
                 };
-            // case RuleType.RetargetMacAddress:
-            //     return {
-            //         value: Array.isArray(rule.value) && rule.value.length > 0
-            //     };
+            case Utils_1.RuleType.RetargetMacAddress:
+                return {
+                    value: Array.isArray(rule.value) && rule.value.length > 0,
+                };
             default:
                 return {};
         }
@@ -157,14 +158,8 @@ var AddOrEditRule = function (props) {
                 return ((0, jsx_runtime_1.jsx)(RuleForm_1.TargetOS, { valids: valids, rule: currentRule, onChange: handleOnChange, deviceInfoGetAllRuleOsVersions: service === null || service === void 0 ? void 0 : service.deviceInfoGetAllRuleOsVersions }));
             case Utils_1.RuleType.TargetDevice:
                 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 RuleType.RetargetMacAddress:
-            //     return (
-            //         <RetargetMacAddress
-            //             valids={valids}
-            //             rule={currentRule}
-            //             onChange={handleOnChange}
-            //         />
-            //     );
+            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 }));
             default:
                 return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
         }

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

@@ -3,6 +3,7 @@ interface Props {
     rule: AdvancedRule;
     valids: any;
     onChange: (rule: AdvancedRule) => void;
+    remarketingListGetAll: () => Promise<any[]>;
 }
 declare const RetargetMacAddressContainer: (props: Props) => import("react/jsx-runtime").JSX.Element;
 export default RetargetMacAddressContainer;

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

@@ -19,19 +19,11 @@ var react_1 = __importDefault(require("react"));
 var component_1 = __importDefault(require("./component"));
 var RetargetMacAddressContainer = function (props) {
     var _a = react_1.default.useState([]), remarketingLists = _a[0], setRemarketingLists = _a[1];
+    var remarketingListGetAll = props.remarketingListGetAll;
     react_1.default.useEffect(function () {
-        // client.
-        // RemarketingListService.getAllRemarketingList()
-        //     .then((res) => {
-        //         if (res.data.status === STATUS_CODE.OK)
-        //         {
-        //             setRemarketingLists(res.data.data);
-        //         }
-        //         else {
-        //             Snackbar(SNACKBAR_TYPES.ERROR);
-        //         }
-        //     })
-        //     .catch(() => Snackbar(SNACKBAR_TYPES.ERROR));
+        remarketingListGetAll()
+            .then(setRemarketingLists)
+            .catch(function (err) { return console.log(err); });
     }, []);
     return (0, jsx_runtime_1.jsx)(component_1.default, __assign({ remarketingLists: remarketingLists }, props));
 };

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

@@ -33,6 +33,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -189,10 +200,14 @@ var Advanced = function (props) {
             onClose();
         }
     };
+    var ruleType = react_1.default.useMemo(function () {
+        var RetargetMacAddress = Utils_1.RuleType.RetargetMacAddress, other = __rest(Utils_1.RuleType, ["RetargetMacAddress"]);
+        return (service === null || service === void 0 ? void 0 : service.remarketingListGetAll) ? Utils_1.RuleType : other;
+    }, [service]);
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ClassicBaseDrawer_1.default, { title: translationText.advanced, open: isOpen, onSubmit: handleSubmit, onClose: handleClose, children: (0, jsx_runtime_1.jsx)(material_1.Paper, { sx: classes.paper, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: 12, container: true, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, md: true }), (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, sx: classes.buttonGroup, children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "outlined", color: "primary", endIcon: (0, jsx_runtime_1.jsx)(icons_material_1.ExpandMore, {}), "aria-controls": "simple-menu", "aria-haspopup": "true", onClick: function (e) {
                                                     e.stopPropagation();
                                                     setAnchorElRule(e.currentTarget);
-                                                }, children: translationText.addRule }), (0, jsx_runtime_1.jsx)(material_1.Menu, { id: "simple-menu", anchorEl: anchorElRule, keepMounted: true, open: Boolean(anchorElRule), onClose: function () { return handleButtonMenuClose(); }, children: Object.keys(Utils_1.RuleType).map(function (type, idx) {
+                                                }, children: translationText.addRule }), (0, jsx_runtime_1.jsx)(material_1.Menu, { id: "simple-menu", anchorEl: anchorElRule, keepMounted: true, open: Boolean(anchorElRule), onClose: function () { return handleButtonMenuClose(); }, children: Object.keys(ruleType).map(function (type, idx) {
                                                     var _a;
                                                     return ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: function () { return handleAddRule(type); }, children: ((_a = Object.entries(translationText.type).find(function (_a) {
                                                             var k = _a[0], val = _a[1];