UNPKG

krp-react-form-component

Version:

KRP React Component for Form Preview Component

95 lines (94 loc) 5 kB
"use strict"; require("core-js/modules/es.weak-map.js"); require("core-js/modules/web.dom-collections.iterator.js"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; require("core-js/modules/esnext.iterator.constructor.js"); require("core-js/modules/esnext.iterator.filter.js"); require("core-js/modules/esnext.iterator.map.js"); var _react = _interopRequireWildcard(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _AppContext = require("../../../../context/AppContext"); var _SelectionContext = require("../../../../context/SelectionContext"); var _reactPdf = require("react-pdf"); var _Constants = require("../../../../constants/Constants"); require("./FactsheetPage.scss"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); } _reactPdf.pdfjs.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/".concat(_reactPdf.pdfjs.version, "/pdf.worker.min.js"); const FactsheetPage = _ref => { let { factsheetData, offerFactsheet } = _ref; const { mode, resolveLocale, locale } = (0, _react.useContext)(_AppContext.AppContext); const { campaign } = (0, _react.useContext)(_SelectionContext.SelectionContext); const limitReached = campaign.limit_reached || campaign.user_limit_reached || campaign.campaign_limit_reached; const getDocumentWidth = () => { switch (mode) { case 'mobile': return document.getElementsByClassName("body-content")[0].clientWidth - 32; case 'browser_mobile': return document.getElementsByClassName("body-content")[0].clientWidth - 32; case 'browser_desktop': return document.getElementsByClassName("body-content")[0].clientWidth; default: return ''; } }; const renderFactSheet = data => { switch (data.factsheet_type) { case 'text_input': return /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-text" }, data.factsheet_text); case 'upload_file': return /*#__PURE__*/_react.default.createElement(_reactPdf.Document, { file: data.factsheet_file }, /*#__PURE__*/_react.default.createElement(_reactPdf.Page, { pageNumber: 1, width: getDocumentWidth() })); case 'upload_image': return /*#__PURE__*/_react.default.createElement("img", { alt: "", src: data.factsheet_image }); default: return ""; } }; return /*#__PURE__*/_react.default.createElement("div", { className: "FactsheetPage " + mode }, /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-content ".concat(limitReached ? 'limit-reached' : ''), id: "factsheet-content" }, /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-header" }, resolveLocale('FACTSHEET_HEADER')), offerFactsheet.length !== 0 ? offerFactsheet.map(i => /*#__PURE__*/_react.default.createElement("div", { key: i.name }, /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-name" }, i.type === "promotion_offer" ? locale === _Constants.CONSTANTS.EN ? i.promotion_name_remark_en : i.promotion_name_remark_th : locale === _Constants.CONSTANTS.EN ? i.product_name_remark_en : i.product_name_remark_th), /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-body" }, i.is_show_fact_sheet === "yes" ? renderFactSheet(i) : ''))) : factsheetData.filter(i => i.is_show_fact_sheet === 'yes' && (i.factsheet_file !== "" || i.factsheet_image !== "" || i.factsheet_text !== "")).map(i => /*#__PURE__*/_react.default.createElement("div", { key: i.name }, /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-name" }, i.type === "promotion_offer" ? locale === _Constants.CONSTANTS.EN ? i.promotion_name_remark_en : i.promotion_name_remark_th : locale === _Constants.CONSTANTS.EN ? i.product_name_remark_en : i.product_name_remark_th), /*#__PURE__*/_react.default.createElement("div", { className: "factsheet-body" }, i.is_show_fact_sheet === "yes" ? renderFactSheet(i) : ''))))); }; FactsheetPage.propTypes = { factsheetData: _propTypes.default.array, offerFactsheet: _propTypes.default.array }; var _default = exports.default = FactsheetPage;