{fieldErrors}
\r\n } \r\n return null;\r\n }\r\n\r\n}\r\n\r\nexport const BootstrapError = connect(BootstrapErrorInner);\r\n\r\n\r\n","export default class PaymentRequest {\r\n constructor(payerData, paymentDetail, documents) {\r\n this.payer_data = payerData;\r\n this.payment_detail = paymentDetail;\r\n this.documents = documents;\r\n }\r\n}\r\n","export default class DepositRequest {\r\n constructor(payerData, paymentDetail, deposit_detail) {\r\n this.payer_data = payerData;\r\n this.payment_detail = paymentDetail;\r\n this.deposit_detail = deposit_detail;\r\n }\r\n }","import {createSelector} from 'reselect';\r\nimport * as appConstants from '../../constants/ApplicationConstants';\r\n\r\nimport moment from 'moment';\r\n\r\nconst getSelectedInvoices = state => state.invoice.selected;\r\nconst getLineItems = state => state.invoice.invoiceDetail;\r\nconst getPaymentOptions = state => state.default.payerDetails.payment_cards;\r\nconst getSelectedPaymentOptionIndex = state => state.default.selectedCard;\r\nconst getCurrentUser = state => state.default.currentUser;\r\nconst getAccountType = state => state.user_options.accountType;\r\nconst getSelectedSecondaryAccountIndex = state => state.user_options.selectedSecondaryAccount;\r\nconst getSelectedPrimaryAccountIndex = state => state.user_options.selectedPrimaryAccountIndex;\r\nconst getPrimaryAccounts = state => state.user_options.primaryAccounts;\r\nconst getSecondaryAccounts = state => state.user_options.secondaryAccounts;\r\nconst getInvoiceSearchToDate = state => state.user_options.invoiceSearchToDate;\r\nconst getInvoiceSearchFromDate = state => state.user_options.invoiceSearchFromDate;\r\nconst getInvoiceSearchStatus = state => state.user_options.invoiceSearchStatus;\r\nconst getInvoiceSearchDueDateFrom = state => state.user_options.invoiceSearchDueDateFrom;\r\nconst getInvoiceSearchDueDateTo = state => state.user_options.invoiceSearchDueDateTo;\r\nconst getInvoiceSearchFilter = state => state.user_options.filter;\r\nconst _getImpersonatedUserId = state => state.user_options.impersonatedUserId;\r\nconst getCnbsConfig = state => state.app.cnbsConfig;\r\n\r\n\r\n//Added\r\nconst getSoldToSearchParams = (state) => state.user_options.SoldTo_SearchParams;\r\nconst getCurrency = (state) => state.default.selectedCurrencyOptionValue;\r\n\r\n\r\n\r\n\r\n\r\nexport const getImpersonatedUserId = createSelector([getCurrentUser, _getImpersonatedUserId], (user, impersonatedUserId) => {\r\n if (impersonatedUserId === null || typeof impersonatedUserId === \"undefined\") {\r\n return user.UserId;\r\n }\r\n return impersonatedUserId;\r\n});\r\n\r\nexport const getInvoiceTotal = createSelector([getSelectedInvoices], items => {\r\n let total = Object.keys(items)\r\n .map(key => items[key])\r\n .reduce((total, item) => {\r\n total += item.open_amount;\r\n return Math.round(total * 100) / 100;\r\n }, 0);\r\n return total.toFixed(2);\r\n});\r\n\r\nexport const getSelectedPrimaryAccount = createSelector(\r\n [getSelectedPrimaryAccountIndex, getPrimaryAccounts],\r\n (index, accounts) => {\r\n if (typeof accounts === \"undefined\" || accounts.length === 0) {\r\n return null;\r\n }\r\n if (index >= accounts.length)\r\n index = 0;\r\n return accounts[index];\r\n }\r\n);\r\n\r\nexport const getCanUseChecks = createSelector(\r\n [getSelectedPrimaryAccount],\r\n (account) => {\r\n if(account == null){\r\n return true;\r\n }\r\n return account.CompanyCode !== \"0020\";\r\n }\r\n);\r\n\r\nexport const getSelectedSecondaryAccount = createSelector(\r\n [getSelectedSecondaryAccountIndex, getSecondaryAccounts],\r\n (index, accounts) => {\r\n if (typeof accounts === \"undefined\" || accounts == null || accounts.length === 0) {\r\n return null;\r\n }\r\n return accounts[index];\r\n }\r\n);\r\n\r\nexport const getPayTotal = createSelector([getLineItems], items => {\r\n let total = Object.keys(items)\r\n .map(key => items[key])\r\n .reduce((total, item) => {\r\n total += parseFloat(item.amount);\r\n return (Math.round(parseFloat(total) * 100) / 100);\r\n }, 0);\r\n return total.toFixed(2);\r\n});\r\n\r\n// Represents the amount the will be paid with credit card or EC.\r\nexport const getBeforeCreditTotal = createSelector([getLineItems, getSelectedInvoices], (items, selected) => {\r\n return Object.keys(items)\r\n .map(key => {\r\n return {details: items[key], invoice: selected[key]}\r\n })\r\n .reduce((total, item) => {\r\n if (item.invoice.open_amount >= 0) {\r\n total += item.details.amount;\r\n }\r\n return total;\r\n }, 0);\r\n});\r\n\r\nexport const getCreditTotal = createSelector([getLineItems, getSelectedInvoices], (items, selected) => {\r\n return Object.keys(items)\r\n .map(key => {\r\n return {details: items[key], invoice: selected[key]}\r\n })\r\n .reduce((total, item) => {\r\n if (item.invoice.open_amount < 0) {\r\n total += item.details.amount;\r\n }\r\n return total;\r\n }, 0);\r\n});\r\n\r\nexport const getSelectedInvoiceKeys = createSelector([getSelectedInvoices], items => {\r\n return Object.keys(items);\r\n});\r\n\r\nexport const getOverpayingAmount = createSelector([getInvoiceTotal, getPayTotal], (total, payTotal) => {\r\n return (Math.round(parseFloat(payTotal - total) * 100) / 100).toFixed(2);\r\n});\r\n\r\nexport const getPayerAccount = createSelector(\r\n [getSelectedPrimaryAccount, getSelectedSecondaryAccount, getAccountType],\r\n (primary, secondary, accountType) => {\r\n if (accountType === appConstants.SOLD_TO_COMPARE) {\r\n return secondary;\r\n } else {\r\n return primary;\r\n }\r\n }\r\n);\r\n\r\n\r\nexport const getAllPaymentOptions = createSelector(\r\n [getPaymentOptions, state => state.payment.sessionCards, state => state.payment.sessionChecks, getPayerAccount],\r\n (options, sessionCards, sessionChecks, payerAccount) => {\r\n let newCardData = options.slice(0);\r\n newCardData.forEach(c => c.is_session = false);\r\n\r\n if (payerAccount) {\r\n let account = payerAccount.PrimaryAcct;\r\n for (let prop in sessionCards[account]) {\r\n if (sessionCards[account].hasOwnProperty(prop)) {\r\n let card = sessionCards[account][prop];\r\n card.is_session = true;\r\n newCardData.push(sessionCards[account][prop]);\r\n }\r\n }\r\n\r\n for (let prop in sessionChecks[account]) {\r\n if (sessionChecks[account].hasOwnProperty(prop)) {\r\n let check = sessionChecks[account][prop];\r\n check.is_session = true;\r\n newCardData.push(sessionChecks[account][prop]);\r\n }\r\n }\r\n }\r\n\r\n return newCardData;\r\n }\r\n);\r\n\r\nexport const getSelectedPaymentOption = createSelector(\r\n [getAllPaymentOptions, getSelectedPaymentOptionIndex],\r\n (options, selectedIndex) => {\r\n if (selectedIndex === null) {\r\n return null;\r\n }\r\n return options[selectedIndex];\r\n }\r\n);\r\n\r\nexport const getCustomerNumber = createSelector(\r\n [getAccountType, getSelectedSecondaryAccount, getSelectedPrimaryAccount],\r\n (accountType, selectedSecondaryAccount, selectedPrimaryAccount) => {\r\n if (accountType === appConstants.SOLD_TO_COMPARE) {\r\n return selectedSecondaryAccount.PrimaryAcct;\r\n } else {\r\n return selectedPrimaryAccount.PrimaryAcct;\r\n }\r\n }\r\n);\r\n\r\n//TODO move out of selectors.\r\nexport function getPayerSoldToForInvoiceQuery(accountType, secondaryAccount, primaryAccount) {\r\n let payer_data;\r\n let soldto_data = {customer_number: \"\", company_code: \"\"};\r\n if (accountType === appConstants.SOLD_TO_COMPARE) {\r\n payer_data = {\r\n customer_number: secondaryAccount.PrimaryAcct,\r\n company_code: primaryAccount.CompanyCode\r\n };\r\n soldto_data = {\r\n customer_number: primaryAccount.PrimaryAcct,\r\n accounts: primaryAccount.TransactionalAccounts,\r\n };\r\n } else {\r\n payer_data = {\r\n customer_number: primaryAccount.PrimaryAcct,\r\n company_code: primaryAccount.CompanyCode\r\n };\r\n soldto_data = null;\r\n }\r\n return {payer_data, soldto_data};\r\n}\r\n\r\n//TODO move out of selectors.\r\nexport function getDefaultFilters(accountType, impersonatedUserId) {\r\n let defaultFilters = [];\r\n if (accountType === appConstants.ACCOUNT_PAYER_ALL) {\r\n defaultFilters.push({\r\n filter_type: '90',\r\n value: impersonatedUserId,\r\n });\r\n }\r\n return defaultFilters;\r\n}\r\n\r\n\r\nexport const getInvoiceSearchQuery = createSelector(\r\n [\r\n getAccountType,\r\n getSoldToSearchParams,\r\n getSelectedPrimaryAccount,\r\n getSelectedSecondaryAccount,\r\n getInvoiceSearchFromDate,\r\n getInvoiceSearchToDate,\r\n getInvoiceSearchStatus,\r\n getInvoiceSearchDueDateFrom,\r\n getInvoiceSearchDueDateTo,\r\n getInvoiceSearchFilter,\r\n getImpersonatedUserId,\r\n ],\r\n (\r\n accountType,\r\n SoldToSearchParams,\r\n primaryAccount,\r\n secondaryAccount,\r\n fromDate,\r\n toDate,\r\n status,\r\n dueDateFrom,\r\n dueDateTo,\r\n filter,\r\n impersonatedUserId\r\n ) => {\r\n try {\r\n let { payer_data, soldto_data } = getPayerSoldToForInvoiceQuery(\r\n accountType,\r\n secondaryAccount,\r\n primaryAccount\r\n );\r\n return {\r\n payer_data,\r\n soldto_data,\r\n search_parameters: {\r\n document_type: \"01\",\r\n status: status,\r\n SoldTo_SearchParams: SoldToSearchParams,\r\n date_from:\r\n fromDate === \"\" ? appConstants.INV_LIST_REQ_BEGIN_DATE : fromDate,\r\n date_to:\r\n toDate === \"\" ? moment(new Date()).format(\"MM-DD-YYYY\") : toDate,\r\n due_date_from: dueDateFrom,\r\n due_date_to: dueDateTo,\r\n currency_key: \"\",\r\n filter: getDefaultFilters(accountType, impersonatedUserId).concat(\r\n filter\r\n ),\r\n },\r\n } ;\r\n } catch (e) {\r\n return null;\r\n }\r\n }\r\n);\r\n\r\n\r\n\r\nexport const getInvoiceQuery = createSelector(\r\n [\r\n getAccountType,\r\n getSelectedPrimaryAccount,\r\n getSelectedSecondaryAccount,\r\n getInvoiceSearchFromDate,\r\n getInvoiceSearchToDate,\r\n getInvoiceSearchStatus,\r\n getInvoiceSearchDueDateFrom,\r\n getInvoiceSearchDueDateTo,\r\n getInvoiceSearchFilter,\r\n getImpersonatedUserId,\r\n ],\r\n (\r\n accountType,\r\n primaryAccount,\r\n secondaryAccount,\r\n fromDate,\r\n toDate,\r\n status,\r\n dueDateFrom,\r\n dueDateTo,\r\n filter,\r\n impersonatedUserId\r\n ) => {\r\n try {\r\n let {payer_data, soldto_data} = getPayerSoldToForInvoiceQuery(accountType, secondaryAccount, primaryAccount);\r\n return {\r\n payer_data,\r\n soldto_data,\r\n search_parameters: {\r\n document_type: '01',\r\n status: '01',\r\n date_from: appConstants.INV_LIST_REQ_BEGIN_DATE,\r\n date_to: moment(new Date()).format('MM-DD-YYYY'),\r\n due_date_from: dueDateFrom,\r\n due_date_to: dueDateTo,\r\n currency_key: '',\r\n filter: getDefaultFilters(accountType, impersonatedUserId).concat(filter),\r\n }\r\n };\r\n } catch (e) {\r\n return null;\r\n }\r\n }\r\n);\r\n\r\nexport const getDepositReasonCodes = createSelector([getCnbsConfig], config => {\r\n const reasonCodes = [];\r\n if (config && config.payment_reason_codes) {\r\n for (let i = 0; i < config.payment_reason_codes.length; i += 1) {\r\n const code = config.payment_reason_codes[i];\r\n if (code.payment_type === 'D') {\r\n reasonCodes.push({\r\n value: code.reason_code,\r\n label: code.description,\r\n commentsRequired: code.comments_required,\r\n });\r\n }\r\n }\r\n }\r\n return reasonCodes;\r\n});\r\n\r\nexport const getPayerAccounts = createSelector(\r\n [getPrimaryAccounts, getSecondaryAccounts, getAccountType],\r\n (primaryAccounts, secondaryAccounts, accountType) => {\r\n if (accountType === appConstants.SOLD_TO_COMPARE) {\r\n return secondaryAccounts;\r\n } else {\r\n return primaryAccounts;\r\n }\r\n }\r\n);\r\n\r\nexport const hasDeposits = createSelector(\r\n [getCnbsConfig],\r\n (config) => {\r\n try {\r\n return typeof config && config.payment_types && config.payment_types.find(t => t.payment_type === \"D\") !== \"undefined\" && config.payment_types.find(t => t.payment_type === \"D\").active === \"X\";\r\n } catch (e) {\r\n return false;\r\n }\r\n }\r\n);\r\n\r\n\r\nexport const getCurrentAccount = createSelector(\r\n [getSelectedPrimaryAccount, getSelectedSecondaryAccount, getAccountType],\r\n (primary, secondary, accountType) => {\r\n let request;\r\n if (accountType === appConstants.SOLD_TO_COMPARE) {\r\n // Use Secondary Account\r\n request = {\r\n company_code: primary && primary.CompanyCode,\r\n sales_organization: secondary && secondary.SalesOrganization,\r\n distribution_channel: secondary && secondary.DistributionChannel,\r\n division: secondary && secondary.Division\r\n };\r\n } else {\r\n // Use Primary Account\r\n request = {\r\n company_code: primary && primary.CompanyCode,\r\n sales_organization: primary && primary.SalesOrganization,\r\n distribution_channel: primary && primary.DistributionChannel,\r\n division: primary && primary.Division\r\n };\r\n }\r\n return request;\r\n }\r\n);\r\n","export default class payer_data {\r\n constructor(customerNumber, companyCode) {\r\n this.customer_number = customerNumber;\r\n this.company_code = companyCode;\r\n this.action = '';\r\n }\r\n}\r\n","import PayerData from '../../models/payer_data';\r\n\r\nexport function getValue(property, defaultVal) {\r\n if (typeof property === 'undefined'){\r\n return defaultVal;\r\n }\r\n return property;\r\n}\r\nexport function valueEquals(property, equals) {\r\n if (typeof property === 'undefined'){\r\n return false;\r\n }\r\n return property === equals;\r\n}\r\n\r\nexport function mapInvoiceToPaymentDocument(invoice, details, payment_reason_codes) {\r\n let reason_description = \"\";\r\n if(details.reason !== \"\" && typeof details.reason !== \"undefined\"){\r\n reason_description = payment_reason_codes.find(r => r.reason_code === details.reason).description;\r\n }\r\n \r\n return {\r\n billing_document_number: invoice.billing_document_number,\r\n document_number_finance: invoice.document_number_finance,\r\n line_item_in_the_relevant_invoice: invoice.line_item_in_the_relevant_invoice,\r\n fiscal_year_of_the_relevant_invoice: invoice.fiscal_year_of_the_relevant_invoice,\r\n open_amount: invoice.open_amount,\r\n amount_to_process: details.amount,\r\n currency_key: invoice.currency_key,\r\n reason_code: details.reason,\r\n reason_description: reason_description,\r\n comment: details.comment,\r\n reference_number: invoice.reference_number,\r\n zzcustom: invoice.zzcustom\r\n }\r\n}\r\n\r\nexport function mapInvoiceListToPaymentDocuments(invoices, details, payment_reason_codes) {\r\n return Object.keys(invoices).map((key) => {\r\n return mapInvoiceToPaymentDocument(invoices[key], details[key], payment_reason_codes);\r\n });\r\n}\r\n\r\nexport function mapPaymentDetails(payment_card, cvv = '', address = {}) {\r\n const paymentMethod = payment_card.payment_card_type === 'EC' ? 'EC' : 'CC';\r\n return {\r\n payment_method: paymentMethod,\r\n payment_card_type: payment_card.payment_card_type,\r\n payment_card_token: payment_card.payment_card_token,\r\n payment_card_name: payment_card.payment_card_name,\r\n electronic_check_account_type: payment_card.electronic_check_account_type,\r\n electronic_check_rdfi_number: payment_card.electronic_check_rdfi_number,\r\n valid_to: payment_card.valid_to,\r\n card_validation_code: cvv,\r\n address_data: {\r\n name: getValue(address.name, ''),\r\n name_2: getValue(address.name_2, ''),\r\n city: getValue(address.city, ''),\r\n district: getValue(address.district, ''),\r\n street: getValue(address.street, ''),\r\n postal_code_city: getValue(address.postal_code_city, ''),\r\n region: getValue(address.region, ''),\r\n country: getValue(address.country, ''),\r\n }\r\n };\r\n}\r\n\r\nexport function createPayerData(customerNumber, companyCode) {\r\n return new PayerData(customerNumber, companyCode);\r\n}\r\n\r\nexport function mapDepositDetails(values){\r\n return {\r\n amount_to_process: values.amount_to_process,\r\n currency_key: 'USD',\r\n reason_code: values.reason_code,\r\n reference_number: values.reference_number,\r\n comment: values.comment\r\n }\r\n}\r\n","import {createSelector} from 'reselect';\r\nimport {getAllPaymentOptions} from \"../invoice/Selectors\";\r\n\r\nexport const getChecksSelector = createSelector([getAllPaymentOptions], (payment_cards) => {\r\n return payment_cards.filter(_ => _.payment_card_type === 'EC');\r\n});\r\nexport const getCreditCardsSelector = createSelector([getAllPaymentOptions ], (payment_cards, sessionCards) => {\r\n return payment_cards.filter(_ => _.payment_card_type !== 'EC');\r\n});\r\n","import axios from '../axios';\r\nimport * as axios2 from 'axios';\r\nimport * as apiTypes from \"../constants/ApiConstants\";\r\nimport moment from \"moment\";\r\n\r\n/**\r\n *\r\n * @param type: 'EC' | 'CC'\r\n * @returns Promise<{merchant_id, access_token, paymetric_xi_url}>\r\n */\r\nexport function getPaymentAccessToken(type) {\r\n if (!(type === 'EC' || type === 'CC')) {\r\n return Promise.reject({error: \"Invalid payment type.\"});\r\n }\r\n return axios.post(apiTypes.GET_PAYMENT_ACCESS_TOKEN, {\r\n action: '01',\r\n payment_method: type\r\n }).then(response => {\r\n return response.data;\r\n });\r\n}\r\n\r\nexport function buildCCRequest(card_details, merchant_id, access_token) {\r\n let data = window.$XIPlugin.createJSRequestPacket(merchant_id, access_token);\r\n data.addField(window.$XIPlugin.createField('PAYMET', false, 'CC'));\r\n data.addField(window.$XIPlugin.createField('CCINS', false, card_details.card_type));\r\n data.addField(window.$XIPlugin.createField('CCNUM', true, card_details.card_number.replace(/\\s/g, '')));\r\n data.addField(window.$XIPlugin.createField('CCNAME', false, card_details.card_name));\r\n data.addField(window.$XIPlugin.createField('VALTM', false, parseInt(card_details.card_month, 10)));\r\n data.addField(window.$XIPlugin.createField('VALTY', false, parseInt(card_details.card_year, 10)));\r\n data.addField(window.$XIPlugin.createField('CVVAL', false, card_details.card_validation_code));\r\n return data;\r\n}\r\n\r\nexport function buildECRequest(ec_details, merchant_id, access_token) {\r\n let data = window.$XIPlugin.createJSRequestPacket(merchant_id, access_token);\r\n data.addField(window.$XIPlugin.createField('PAYMET', false, 'EC'));\r\n data.addField(window.$XIPlugin.createField('CCINS', false, 'EC'));\r\n data.addField(window.$XIPlugin.createField('CCNUM', true, ec_details.account_number.replace(/\\s/g, '').replace(/-/g, '').padStart(10, \"0\")));\r\n data.addField(window.$XIPlugin.createField('CCNAME', false, ec_details.name));\r\n data.addField(window.$XIPlugin.createField('ECRDFI', false, ec_details.routing_number));\r\n data.addField(window.$XIPlugin.createField('ECACTTYP', false, ec_details.type));\r\n return data;\r\n}\r\n\r\nconst encodeForm = (data) => {\r\n return Object.keys(data)\r\n .map(key => encodeURIComponent(key) + '=' + encodeURIComponent(data[key]))\r\n .join('&');\r\n}\r\n\r\nexport function getPaymetricResponse(paymetricUrl, data) {\r\n return new Promise((resolve, reject) => {\r\n window.$XIPlugin.ajax({\r\n url: paymetricUrl + \"/Ajax\",\r\n type: \"POST\",\r\n data: data,\r\n success: function(a) {\r\n console.log(a);\r\n resolve(a);\r\n },\r\n error: function(a) {\r\n reject(a);\r\n }\r\n });\r\n });\r\n // return axios2.post(paymetricUrl + '/Ajax', encodeForm(data), {\r\n // headers: {\r\n // 'Content-Type': 'application/x-www-form-urlencoded'\r\n // }\r\n // }).then(response => {\r\n // return response.data;\r\n // });\r\n}\r\n\r\nexport function getPaymentResponse(access_token) {\r\n return axios.post(apiTypes.GET_PAYMENT_RESPONSE, {\r\n action: '02',\r\n access_token: access_token\r\n }).then(response => {\r\n return response.data;\r\n });\r\n}\r\n\r\nexport function addPaymentMethod(customer_number, company_code, payment_card, make_default = false, cvv = \"\") {\r\n let action = '01';\r\n return sendManagePaymentCardsRequest(action, customer_number, company_code, payment_card, make_default, cvv);\r\n}\r\n\r\nexport function updatePaymentMethod(customer_number, company_code, payment_card, make_default = false) {\r\n let action = '02';\r\n return sendManagePaymentCardsRequest(action, customer_number, company_code, payment_card, make_default);\r\n}\r\n\r\nexport function deletePaymentMethod(customer_number, company_code, payment_card, make_default = false) {\r\n let action = '03';\r\n return sendManagePaymentCardsRequest(action, customer_number, company_code, payment_card, make_default);\r\n}\r\n\r\n\r\nexport function preAuthCCPaymentMethod(customer_number, company_code, payment_card, make_default = false, cvv = \"\") {\r\n let action = '04';\r\n return sendManagePaymentCardsRequest(action, customer_number, company_code, payment_card, make_default, cvv);\r\n}\r\n\r\nfunction sendManagePaymentCardsRequest(action, customer_number, company_code, payment_cards, make_default, cvv = \"\") {\r\n return axios.post(apiTypes.MANAGE_PAYMENTS_URL, {\r\n payer_data: {\r\n customer_number: customer_number,\r\n company_code: company_code,\r\n },\r\n action: action,\r\n payment_cards: [{\r\n payment_card_name: payment_cards.payment_card_name,\r\n payment_card_token: payment_cards.payment_card_token,\r\n payment_card_type: payment_cards.payment_card_type,\r\n valid_from: \"\",\r\n valid_to: payment_cards.valid_to,\r\n default: make_default ? 'X' : '',\r\n card_validation_code: cvv,\r\n electronic_check_account_type: payment_cards.electronic_check_account_type,\r\n electronic_check_rdfi_number: payment_cards.electronic_check_rdfi_number,\r\n }]\r\n }).then(response => {\r\n if (response.data && response.data.message_type === \"S\") {\r\n return response.data;\r\n } else if (response.data && response.data.status && response.data.status.message_type === \"S\") {\r\n return response.data;\r\n } else {\r\n throw {message_number: response.data.message_number, message_string: response.data.message_line_string};\r\n }\r\n });\r\n}\r\n\r\nexport function cardFormToUpdateObject(card, token) {\r\n let valid_to = moment();\r\n valid_to.year(card.card_year);\r\n valid_to.month(parseInt(card.card_month) - 1);\r\n valid_to.endOf('month');\r\n return {\r\n payment_card_name: card.card_name,\r\n payment_card_token: token,\r\n payment_card_type: card.card_type,\r\n valid_from: \"\",\r\n valid_to: valid_to.format('MM-DD-YYYY'),\r\n card_validation_code: card.card_validation_code,\r\n electronic_check_account_type: card.electronic_check_account_type,\r\n electronic_check_rdfi_number: card.electronic_check_rdfi_number,\r\n }\r\n}\r\n\r\nexport function checkFormToUpdateObject(card, token) {\r\n return {\r\n payment_card_name: card.name,\r\n payment_card_token: token,\r\n payer_account: card.payer_account,\r\n payment_card_type: \"EC\",\r\n }\r\n}\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {connect} from 'react-redux';\r\nimport {extractLastCardNumbers, getPayerDetailsBuilder} from \"../../actions/InvoiceActions\";\r\nimport {getPayerAccount, getSelectedPrimaryAccount, getSelectedSecondaryAccount} from \"../invoice/Selectors\";\r\nimport {deletePaymentMethod} from \"../../requests/TokenRequests\";\r\nimport {deleteSessionCard, deleteSessionCheck} from \"../../reducers/PaymentReducer\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome/index.es\";\r\n\r\nexport class PaymentTypeDetails extends Component {\r\n\r\n constructor() {\r\n super();\r\n this.displayText = this.displayText.bind(this);\r\n this.getIconImage = this.getIconImage.bind(this);\r\n this.deletePaymentCard = this.deletePaymentCard.bind(this);\r\n }\r\n\r\n displayText() {\r\n let p = this.props.payment_card;\r\n let digits = extractLastCardNumbers(p.payment_card_token);\r\n if (p.payment_card_type === 'EC') {\r\n return `eCheck ending with *${digits}`;\r\n } else {\r\n return `${p.payment_card_type} ending with *${digits}`;\r\n }\r\n }\r\n\r\n displayText2() {\r\n let p = this.props.payment_card;\r\n return `${p.payment_card_name}`;\r\n }\r\n\r\n getIconImage() {\r\n if (this.props.payment_card.payment_card_type === 'EC') {\r\n return \r\n \r\n
\r\n\r\n \r\n }\r\n}\r\n\r\nPaymentTypeDetails.propTypes = {\r\n payment_card_index: PropTypes.number,\r\n payment_card: PropTypes.object.isRequired,\r\n onEdit: PropTypes.func.isRequired,\r\n onDelete: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n payerAccount: getPayerAccount(state, props),\r\n primaryAccount: getSelectedPrimaryAccount(state, props),\r\n secondaryAccount: getSelectedSecondaryAccount(state, props),\r\n currentUser: state.default.currentUser,\r\n }\r\n}, (dispatch) => {\r\n return {\r\n deletePaymentMethod: async (comp) => {\r\n if (comp.props.payment_card.is_session) {\r\n dispatch(deleteSessionCard(comp.props.payment_card, comp.props.payerAccount.PrimaryAcct));\r\n dispatch(deleteSessionCheck(comp.props.payment_card, comp.props.payerAccount.PrimaryAcct));\r\n } else {\r\n await deletePaymentMethod(comp.props.payerAccount.PrimaryAcct, comp.props.primaryAccount.CompanyCode, comp.props.payment_card);\r\n getPayerDetailsBuilder(dispatch, comp.props.primaryAccount, comp.props.secondaryAccount, comp.props.currentUser);\r\n }\r\n comp.props.onDelete(comp.props.payment_card);\r\n }\r\n }\r\n})(PaymentTypeDetails);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {connect} from 'react-redux';\r\nimport {getChecksSelector} from \"./PaymentCardsSelectors\";\r\nimport PaymentTypeDetails from \"./PaymentTypeDetails\";\r\n\r\nexport class ChecksList extends Component {\r\n\r\n render() {\r\n\r\n return \r\n {this.getIconImage()}\r\n {this.props.payment_card.isDefault ?
\r\n \r\n
\r\n \r\n {this.displayText2()}\r\n
\r\n \r\n \r\n {this.displayText()}\r\n {this.props.payment_card.is_session && (Session)}\r\n \r\n
\r\n \r\n \r\n Delete \r\n {this.props.onEdit(this.props.payment_card)}}>\r\n Edit \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n ×\r\n \r\n
\r\n \r\n Confirm Deletion\r\n
\r\n\t\t\r\n Are you sure you want to delete your credit card from the payment method list?\r\n
\r\n \r\n \r\n \r\n Cancel\r\n \r\n
\r\n {\r\n this.props.checks.map((check, index) => {\r\n return
\r\n }\r\n}\r\n\r\nChecksList.propTypes = {\r\n checks: PropTypes.array,\r\n onEdit: PropTypes.func.isRequired,\r\n onDelete: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n checks: getChecksSelector(state, props),\r\n }\r\n})(ChecksList);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport {getCreditCardsSelector as getCrediCardsSelector} from \"./PaymentCardsSelectors\";\r\nimport PaymentTypeDetails from \"./PaymentTypeDetails\";\r\n\r\nexport class CreditCardsList extends Component {\r\n \r\n render() {\r\n return {\r\n this.props.cards.map((card, index) => {\r\n return
\r\n }\r\n}\r\n\r\nCreditCardsList.propTypes = {\r\n cards: PropTypes.array,\r\n onEdit: PropTypes.func.isRequired,\r\n onDelete: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n cards: getCrediCardsSelector(state, props),\r\n }\r\n})(CreditCardsList);\r\n","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport ChecksList from \"../ChecksList\";\r\nimport CreditCardsList from \"../CreditCardsList\";\r\nimport classNames from \"classnames\";\r\nimport PropTypes from 'prop-types';\r\nimport {getCanUseChecks, getSelectedPrimaryAccount} from \"../../invoice/Selectors\";\r\n\r\nexport class PaymentCardLists extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showCards: true,\r\n };\r\n this.showCards = this.showCards.bind(this);\r\n this.showChecks = this.showChecks.bind(this);\r\n }\r\n showCards(){\r\n this.setState({showCards: true});\r\n this.props.onTabChange('CC');\r\n }\r\n showChecks(){\r\n this.setState({showCards: false});\r\n this.props.onTabChange('EC');\r\n }\r\n render() {\r\n return \r\n
\r\n }\r\n\r\n}\r\n\r\nPaymentCardLists.propTypes = {\r\n onEdit: PropTypes.func.isRequired,\r\n onDelete: PropTypes.func.isRequired\r\n};\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(state),\r\n canUseChecks: getCanUseChecks(state),\r\n }\r\n})(PaymentCardLists);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {toast} from 'react-toastify';\r\nimport {extractLastCardNumbers} from \"../../actions/InvoiceActions\";\r\nimport {Formik} from \"formik\";\r\nimport {AddCreditCardSchema, EditCreditCardSchema} from './schemas';\r\nimport {BootstrapError, BootstrapField} from \"../../helpers/Field\";\r\nimport {ERROR_PAYMENT_METHOD} from \"../../constants/ErrorMessages\";\r\nimport moment from \"moment\";\r\nimport * as cardValidator from 'card-validator';\r\nimport {connect} from \"react-redux\";\r\nimport {faChevronDown} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nexport class AddCreditCardForm extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.saveCard = this.saveCard.bind(this);\r\n this.buttonText = this.buttonText.bind(this);\r\n this.renderPaymentMethods = this.renderPaymentMethods.bind(this);\r\n }\r\n\r\n async saveCard(card) {\r\n this.props.save(card);\r\n }\r\n\r\n buttonText() {\r\n if(this.props.alwaysSaveOnFile){\r\n return this.props.isEditing ? \"Update Card\" : \"Save Card\";\r\n } else {\r\n return \"Next\";\r\n }\r\n }\r\n\r\n renderPaymentMethods(){\r\n return (\r\n
\r\n My Cards
\r\n {this.props.canUseChecks && My eChecks
}\r\n \r\n {this.state.showCards ?\r\n :\r\n \r\n }\r\n
\r\n \r\n
;\r\n }\r\n\r\n}\r\n\r\nAddCreditCardForm.defaultProps = {\r\n alwaysSaveOnFile: false,\r\n};\r\n\r\nAddCreditCardForm.propTypes = {\r\n payment: PropTypes.object.isRequired,\r\n save: PropTypes.func.isRequired,\r\n isEditing: PropTypes.bool.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n paymentMethods: state.app.paymentMethods,\r\n }\r\n})(AddCreditCardForm)\r\n\r\n","export const ERROR_PAYMENT_METHOD = \"There was an error processing payment method.\";","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport {toast} from 'react-toastify';\r\nimport {getPayerAccount, getSelectedPrimaryAccount, getSelectedSecondaryAccount} from \"../invoice/Selectors\";\r\nimport {extractLastCardNumbers} from \"../../actions/InvoiceActions\";\r\nimport {Formik} from \"formik\";\r\nimport {AddCheckSchema, EditCheckSchema} from \"./schemas\";\r\nimport {BootstrapError, BootstrapField} from \"../../helpers/Field\";\r\nimport {ERROR_PAYMENT_METHOD} from \"../../constants/ErrorMessages\";\r\nimport {faChevronDown} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nexport class AddCheckForm extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.saveCard = this.saveCard.bind(this);\r\n this.buttonText = this.buttonText.bind(this);\r\n }\r\n\r\n async saveCard(card) {\r\n this.props.save(card);\r\n }\r\n \r\n buttonText() {\r\n if(this.props.alwaysSaveOnFile){\r\n return this.props.isEditing ? \"Update eCheck\" : \"Save eCheck\";\r\n } else {\r\n return \"Next\";\r\n }\r\n }\r\n\r\n render() {\r\n let initialValues = {\r\n type: \"\",\r\n name: \"\",\r\n routing_number: \"\",\r\n account_number: \"\",\r\n save_on_file: this.props.alwaysSaveOnFile,\r\n make_default: false,\r\n };\r\n let schema = AddCheckSchema;\r\n if (this.props.isEditing) {\r\n initialValues = {\r\n type: \"\",\r\n name: this.props.payment.payment_card_name,\r\n routing_number: \"*********\",\r\n account_number: `ending in *${extractLastCardNumbers(this.props.payment.payment_card_token, '-')}`,\r\n save_on_file: !this.props.payment.is_session,\r\n make_default: this.props.isDefault,\r\n };\r\n schema = EditCheckSchema;\r\n }\r\n return \r\n
\r\n \r\n {\r\n let errors = {};\r\n if ( !cardValidator.expirationDate({month: values.card_month, year: values.card_year}).isValid){\r\n errors.card_month = 'Invalid expiration date.';\r\n }\r\n return errors;\r\n }}\r\n enableReinitialize={true}\r\n onSubmit={(values, bag) => {\r\n bag.setSubmitting(true);\r\n this.saveCard(values).then((paymentcard) => {\r\n bag.setSubmitting(false);\r\n if (this.props.onCardConfirmed) {\r\n this.props.onCardConfirmed(paymentcard);\r\n }\r\n }).catch(() => {\r\n toast.error(ERROR_PAYMENT_METHOD, {position: toast.POSITION.TOP_RIGHT});\r\n bag.setSubmitting(false);\r\n });\r\n }}\r\n render={(props) => (\r\n \r\n )}\r\n />\r\n
\r\n \r\n {\r\n bag.setSubmitting(true);\r\n this.saveCard(values).then((paymentcard) => {\r\n bag.setSubmitting(false);\r\n if (this.props.onCardConfirmed) {\r\n this.props.onCardConfirmed(paymentcard);\r\n }\r\n }).catch(() => {\r\n toast.error(ERROR_PAYMENT_METHOD, {position: toast.POSITION.TOP_RIGHT});\r\n bag.setSubmitting(false);\r\n });\r\n }}\r\n render={(props) => (\r\n \r\n )}/>\r\n
;\r\n }\r\n}\r\n\r\nAddCheckForm.defaultProps = {\r\n alwaysSaveOnFile: false,\r\n save: PropTypes.func.isRequired,\r\n isEditing: PropTypes.bool.isRequired,\r\n};\r\n\r\nAddCheckForm.propTypes = {\r\n payment: PropTypes.object.isRequired,\r\n save: PropTypes.func.isRequired,\r\n isEditing: PropTypes.bool.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n payerAccount: getPayerAccount(state, props),\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(state, props),\r\n selectedSecondaryAccount: getSelectedSecondaryAccount(state, props),\r\n }\r\n }\r\n)(AddCheckForm);\r\n","import axios from '../axios';\r\n\r\n\r\nexport function getAppConfiguration() {\r\n return axios.get(`/api/config`).then((response) => response.data);\r\n}\r\n\r\nexport function getConfiguration() {\r\n return axios.get(`/api/configuration`).then((response) => response.data);\r\n}\r\n\r\nexport function updateConfiguration(config) {\r\n return axios.put(`/api/configuration`, config).then((response) => response.data);\r\n}\r\n\r\nexport function uploadImage(file) {\r\n const config = { headers: { 'Content-Type': 'multipart/form-data' } };\r\n return axios.post(`/api/configuration/upload`, file, config).then((response) => response.data);\r\n}\r\n\r\nexport function smtpTest(smtpConfig) {\r\n return axios.post(`/api/configuration/smtp-test`, smtpConfig).then((response) => response.data);\r\n}\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PaymentCardLists from \"../payment-card-lists/PaymentCardLists\";\r\nimport AddCreditCardForm from \"../AddCreditCardForm\";\r\nimport AddCheckForm from \"../AddCheckForm\";\r\nimport { getPayerAccount, getSelectedPrimaryAccount, getSelectedSecondaryAccount } from \"../../invoice/Selectors\";\r\nimport { toast } from 'react-toastify';\r\nimport {\r\n addPaymentMethod,\r\n buildCCRequest, buildECRequest, cardFormToUpdateObject, checkFormToUpdateObject,\r\n getPaymentAccessToken,\r\n getPaymentResponse,\r\n getPaymetricResponse, preAuthCCPaymentMethod, updatePaymentMethod\r\n} from \"../../../requests/TokenRequests\";\r\nimport { getPayerDetailsBuilder } from \"../../../actions/InvoiceActions\";\r\nimport { addSessionCard, addSessionCheck, updateSessionCard, updateSessionCheck } from \"../../../reducers/PaymentReducer\";\r\nimport PlayArrow from \"../../../images/playarrow.png\"\r\nimport PdfIcon from \"../../../images/pdf.jpg\"\r\nimport { getConfiguration} from \"../../../requests/ConfigRequests\";\r\n\r\nexport class ManagePaymentMethods extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n config: null,\r\n type: 'CC',\r\n editingPayment: null,\r\n isEditing: false,\r\n };\r\n this.addPaymentMethod = this.addPaymentMethod.bind(this);\r\n this.onTabChange = this.onTabChange.bind(this);\r\n this.isCC = this.isCC.bind(this);\r\n this.isEC = this.isEC.bind(this);\r\n this.onCardConfirmed = this.onCardConfirmed.bind(this);\r\n this.editPayment = this.editPayment.bind(this);\r\n this.saveCard = this.saveCard.bind(this);\r\n this.saveCheck = this.saveCheck.bind(this);\r\n this.processCard = this.processCard.bind(this);\r\n this.processCheck = this.processCheck.bind(this);\r\n this.deletePayment = this.deletePayment.bind(this);\r\n this.CCVideoClick = this.CCVideoClick.bind(this);\r\n this.CCPdfClick = this.CCPdfClick.bind(this);\r\n this.ECVideoClick = this.ECVideoClick.bind(this);\r\n this.ECPdfClick = this.ECPdfClick.bind(this);\r\n this.isValidURL = this.isValidURL.bind(this);\r\n \r\n }\r\n\r\n componentDidMount() {\r\n getConfiguration().then(\r\n config => this.setState({ config: config }\r\n ));\r\n }\r\n\r\n addPaymentMethod() {\r\n this.setState({ ...this.state, editingPayment: {}, isEditing: false });\r\n }\r\n\r\n isEditing() {\r\n return this.props.editingPayment !== null;\r\n }\r\n\r\n onTabChange(type) {\r\n this.setState({ ...this.state, type: type });\r\n // this.props.setEditingPayment(null);\r\n }\r\n\r\n isEC() {\r\n return this.state.type === 'EC';\r\n }\r\n\r\n isCC() {\r\n return this.state.type === 'CC';\r\n }\r\n\r\n async onCardConfirmed(payment_card) {\r\n this.setState({ ...this.state });\r\n // this.props.setEditingPayment(null);\r\n }\r\n\r\n editPayment(payment) {\r\n this.setState({\r\n editingPayment: payment,\r\n isEditing: true,\r\n });\r\n }\r\n\r\n async saveCard(card) {\r\n await this.processCard(card);\r\n getPayerDetailsBuilder(this.props.dispatch, this.props.primaryAccount, this.props.secondaryAccount, this.props.currentUser);\r\n this.setState({ editingPayment: null });\r\n }\r\n\r\n async saveCheck(card) {\r\n await this.processCheck(card);\r\n getPayerDetailsBuilder(this.props.dispatch, this.props.primaryAccount, this.props.secondaryAccount, this.props.currentUser);\r\n this.setState({ editingPayment: null });\r\n }\r\n\r\n\r\n async processCheck(card) {\r\n if (this.state.isEditing) {\r\n if (card.save_on_file) {\r\n let response = await updatePaymentMethod(\r\n this.props.payerAccount.PrimaryAcct,\r\n this.props.primaryAccount.CompanyCode,\r\n checkFormToUpdateObject(card, this.state.editingPayment.payment_card_token),\r\n card.make_default);\r\n return response;\r\n } else {\r\n this.props.dispatch(updateSessionCheck(checkFormToUpdateObject(card, this.state.editingPayment.payment_card_token), this.props.payerAccount.PrimaryAcct));\r\n }\r\n } else {\r\n const { access_token, merchant_guid, paymetric_xi_url } = await getPaymentAccessToken('EC');\r\n let body = buildECRequest(card, merchant_guid, access_token);\r\n\r\n try {\r\n await getPaymetricResponse(paymetric_xi_url, body);\r\n } catch (e) {\r\n toast.error(`Unable to save account details, please try again.`, { position: toast.POSITION.TOP_RIGHT });\r\n return;\r\n }\r\n\r\n let { paymentcard } = await getPaymentResponse(access_token);\r\n // We don't want to do this. pass payment card to props method\r\n if (card.save_on_file) {\r\n try {\r\n await addPaymentMethod(this.props.payerAccount.PrimaryAcct, this.props.primaryAccount.CompanyCode, paymentcard, card.make_default);\r\n } catch (error) {\r\n if (error.message_number === 74) {\r\n let matches = error.message_string.match(/Payment card (CCINS) (.*) already exist, action ([0-9]*) not possible/);\r\n toast.error(`${matches[2]} already exists.`, { position: toast.POSITION.TOP_RIGHT });\r\n } else if (error.message_number === 76) {\r\n let matches = error.message_string.match(/Payment card (CCINS) (.*) already assigned to account ([0-9]*)/);\r\n toast.error(`${matches[2]} already assigned to account ${matches[3]}`, { position: toast.POSITION.TOP_RIGHT });\r\n } else {\r\n toast.error(error.message_string, { position: toast.POSITION.TOP_RIGHT });\r\n }\r\n }\r\n } else {\r\n this.props.dispatch(addSessionCheck(paymentcard, this.props.payerAccount.PrimaryAcct));\r\n }\r\n return paymentcard;\r\n }\r\n }\r\n\r\n async processCard(card) {\r\n if (this.state.isEditing) {\r\n if (card.save_on_file) {\r\n let response = await updatePaymentMethod(\r\n this.props.payerAccount.PrimaryAcct,\r\n this.props.primaryAccount.CompanyCode,\r\n cardFormToUpdateObject(card, this.state.editingPayment.payment_card_token),\r\n card.make_default);\r\n return response;\r\n } else {\r\n this.props.dispatch(updateSessionCard(cardFormToUpdateObject(card, this.state.editingPayment.payment_card_token), this.props.payerAccount.PrimaryAcct));\r\n }\r\n return null;\r\n } else {\r\n const { access_token, merchant_guid, paymetric_xi_url } = await getPaymentAccessToken('CC');\r\n let body = buildCCRequest(card, merchant_guid, access_token);\r\n\r\n try {\r\n await getPaymetricResponse(paymetric_xi_url, body);\r\n } catch (e) {\r\n toast.error(`Unable to save account details, please try again.`, { position: toast.POSITION.TOP_RIGHT });\r\n return;\r\n }\r\n\r\n let { paymentcard } = await getPaymentResponse(access_token);\r\n // We don't want to do this. pass payment card to props method\r\n if (card.save_on_file) {\r\n try {\r\n await addPaymentMethod(this.props.payerAccount.PrimaryAcct, this.props.primaryAccount.CompanyCode, paymentcard, card.make_default, card.card_validation_code);\r\n } catch (error) {\r\n if (error.message_number === 74) {\r\n let matches = error.message_string.match(/Payment card (CCINS) (.*) already exist, action ([0-9]*) not possible/);\r\n toast.error(`${matches[2]} already exists.`, { position: toast.POSITION.TOP_RIGHT });\r\n } else if (error.message_number === 76) {\r\n let matches = error.message_string.match(/Payment card (CCINS) (.*) already assigned to account ([0-9]*)/);\r\n toast.error(`${matches[2]} already assigned to account ${matches[3]}`, { position: toast.POSITION.TOP_RIGHT });\r\n } else {\r\n toast.error(error.message_string, { position: toast.POSITION.TOP_RIGHT });\r\n }\r\n }\r\n } else {\r\n try {\r\n //Add to session payment methods.\r\n await preAuthCCPaymentMethod(this.props.payerAccount.PrimaryAcct, this.props.primaryAccount.CompanyCode, paymentcard, card.make_default, card.card_validation_code);\r\n this.props.dispatch(addSessionCard(paymentcard, this.props.payerAccount.PrimaryAcct));\r\n } catch (error) {\r\n toast.error(`Credit Card not approved.`, { position: toast.POSITION.TOP_RIGHT });\r\n }\r\n }\r\n return paymentcard;\r\n }\r\n }\r\n\r\n deletePayment(payment) {\r\n if (this.state.editingPayment && payment.payment_card_token === this.state.editingPayment.payment_card_token) {\r\n this.setState({ editingPayment: null });\r\n }\r\n }\r\n\r\n isValidURL(url) {\r\n const isAbsoluteUrl = /^([a-zA-Z][a-zA-Z\\d+\\-.]*):/.test(url);\r\n const normalizedUrl = isAbsoluteUrl ? url : `http://${url}`;\r\n return normalizedUrl;\r\n }\r\n \r\n CCVideoClick (){\r\n \r\n const url = this.state.config.CcvideoUrl; // Replace with your URL\r\n const normalizedUrl = this.isValidURL(url);\r\n window.open(normalizedUrl, '_blank');\r\n\r\n };\r\n\r\n CCPdfClick (){\r\n const url = this.state.config.CcpdfUrl; // Replace with your URL\r\n const normalizedUrl = this.isValidURL(url);\r\n window.open(normalizedUrl, '_blank');\r\n };\r\n\r\n ECVideoClick() {\r\n\r\n const url = this.state.config.EcvideoUrl; // Replace with your URL\r\n const normalizedUrl = this.isValidURL(url);\r\n window.open(normalizedUrl, '_blank');\r\n\r\n };\r\n\r\n ECPdfClick() {\r\n const url = this.state.config.EcpdfUrl; // Replace with your URL\r\n const normalizedUrl = this.isValidURL(url);\r\n window.open(normalizedUrl, '_blank');\r\n };\r\n\r\n\r\n render() {\r\n return \r\n
\r\n \r\n
\r\n \r\n {this.isCC() && }\r\n {this.isEC() && }\r\n
\r\n \r\n {(this.state.editingPayment && this.isCC()) &&\r\n
\r\n\r\n\r\n \r\n\r\n \r\n Important Notice: Do not save credit card information if you have multiple accounts\r\n\r\n\r\n {/*
\r\n */}\r\n {/* */}\r\n {/* {\"Do not save credit card information if you have multiple accounts\"}*/}\r\n {/*
*/}\r\n\r\n\r\n\r\n \r\n
\r\n \r\n \r\n {\"Click below for instructions to set up an E-Pay credit card: \"}\r\n
\r\n\r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n 
\r\n
\r\n \r\n \r\n {\"Click below for instructions to set up an E-Pay eCheck: \"}\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
);\r\n return (\r\n
\r\n \r\n Pay
);\r\n }\r\n\r\n customMultiSelect = props => {\r\n const { mode, checked, disabled } = props;\r\n return (\r\n \r\n {!disabled ? (\r\n
\r\n );\r\n };\r\n\r\n onSelectAll(isSelect, rows, e) {\r\n rows.forEach(row => {\r\n if (isSelect) {\r\n this.props.dispatch(addInvoiceToSelected(row));\r\n } else {\r\n this.props.dispatch(removeInvoiceFromSelected(row));\r\n }\r\n });\r\n }\r\n\r\n clickSelectAll(e) {\r\n this.props.invoices.filter((invoice) => !this.isNotSelectable(invoice))\r\n .filter(this.filterFilteredInvoices)\r\n .forEach(invoice => {\r\n this.props.dispatch(addInvoiceToSelected(invoice));\r\n });\r\n }\r\n\r\n filterFilteredInvoices(invoice) {\r\n if (this.props.accountType === PAYER_COMPARE || this.props.accountType === ACCOUNT_PAYER_ALL) {\r\n return this.props.selectedSoldTos.indexOf(_.trimStart(invoice.soldto_number, '0')) !== -1;\r\n }\r\n return true;\r\n\r\n }\r\n\r\n isPdfFilenotExists(invoicesWithKeys): boolean {\r\n const PDFFileIds: string[] = [];\r\n if (sessionStorage.getItem(\"invoicesWithKeysData\") != null) {\r\n sessionStorage.removeItem(\"invoicesWithKeysData\");\r\n }\r\n var pdfExists = false;\r\n invoicesWithKeys.forEach((invoice) => {\r\n if (invoice.pdf_document_available === \"X\") {\r\n pdfExists = true;\r\n if (\r\n invoice.billing_document_number != null &&\r\n invoice.billing_document_type !== \"01\" && invoice.soldto_number != null\r\n ) {\r\n PDFFileIds.push(invoice.billing_document_number, invoice.soldto_number);\r\n }\r\n }\r\n });\r\n sessionStorage.setItem(\"invoicesWithKeysData\", JSON.stringify(PDFFileIds));\r\n return pdfExists;\r\n }\r\n\r\n clickDeselectAll(e) {\r\n this.props.invoices.filter((invoice) => !this.isNotSelectable(invoice))\r\n .filter(this.filterFilteredInvoices)\r\n .forEach(invoice => {\r\n this.props.dispatch(removeInvoiceFromSelected(invoice));\r\n });\r\n }\r\n\r\n isNotSelectable(invoice) {\r\n if ((invoice.read_only_flag && invoice.read_only_flag === 'X')) {\r\n return true;\r\n }\r\n return this.props.isSearch;\r\n }\r\n\r\n render() {\r\n let hideSelect = this.props.isSearch || !this.props.canMakePayment;\r\n const selectRowProp = {\r\n mode: 'checkbox',\r\n onSelect: this.onRowSelect,\r\n onSelectAll: this.onSelectAll,\r\n selected: this.props.selectedInvoicesKeys,\r\n selectionRenderer: this.customMultiSelect,\r\n selectionHeaderRenderer: this.renderHeaderCheckbox,\r\n nonSelectable: this.props.invoices.filter((invoice) => this.isNotSelectable(invoice)).map(invoice => {\r\n return invoice.billing_document_number + '__' + invoice.document_number_finance;\r\n }),\r\n hideSelectColumn: hideSelect,\r\n };\r\n const tab = 'table';\r\n const top = 'Top';\r\n\r\n let invoices = this.props.invoices;\r\n if (!this.props.isSearch) {\r\n if (this.props.accountType === PAYER_COMPARE || this.props.accountType === ACCOUNT_PAYER_ALL) {\r\n invoices = this.props.invoices.filter(this.filterFilteredInvoices);\r\n }\r\n }\r\n\r\n const columnConfigs = [\r\n {\r\n headerClasses: \"column-header\",\r\n dataField: \"billing_document_type\",\r\n formatter: statusFormatter,\r\n text: \"Status\",\r\n headerStyle: { width: '65px' },\r\n headerAlign: \"center\",\r\n align: \"center\",\r\n },\r\n {\r\n headerClasses: \"column-header\",\r\n dataField: \"reference_number\",\r\n formatter: referenceFormatter,\r\n text: \"Ref #\",\r\n sort: true,\r\n sortCaret: renderCaret,\r\n headerStyle: { width: '95px' },\r\n headerAlign: \"center\",\r\n align: \"center\",\r\n },\r\n {\r\n headerClasses: \"column-header\",\r\n dataField: \"document_number_finance\",\r\n formatter: documentNumberFormatter,\r\n text: \"Doc #\",\r\n sortCaret: renderCaret,\r\n headerStyle: { width: '95px' },\r\n sort: true,\r\n headerAlign: \"center\",\r\n align: \"center\",\r\n },\r\n {\r\n headerClasses: \"column-header\",\r\n dataField: \"document_date\",\r\n formatter: dateFormatter,\r\n text: \"Date\",\r\n sort: true,\r\n sortCaret: renderCaret,\r\n headerStyle: { width: '65px' },\r\n headerAlign: \"center\",\r\n sortFunc: sortStringDate,\r\n align: \"center\",\r\n },\r\n {\r\n headerClasses: \"column-header\",\r\n dataField: \"total_amount\",\r\n formatter: totalFormatter,\r\n headerFormatter: (col, colIndex, components) => {\r\n return (\r\n
\r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n {/*\r\n {!hideSelect && }\r\n
\r\n \r\n {\r\n invoices.length === 0 ||\r\n this.isPdfFilenotExists(invoices) ? (\r\n \r\n \r\n // {props.isSearch ? (\r\n //
\r\n \r\n
);\r\n}\r\n\r\nexport function payerFormatter(cell, row) {\r\n if (row.zzcustom && row.zzcustom.payerad) {\r\n let address = row.zzcustom.payerad;\r\n return renderAddressForTable(address);\r\n } else {\r\n return cell;\r\n }\r\n}\r\n\r\nexport function reasonFormatter(cell, row) {\r\n if(row.reason){\r\n return ({row.reason.description}{address.name}
\r\n {address.street}
\r\n {address.city}, {address.region}, {address.country}
\r\n {row.reason_message})\r\n } else {\r\n return ()\r\n }\r\n}\r\n","import {useEffect, useRef} from \"react\";\r\n\r\nexport function usePrevious(value) {\r\n const ref = useRef();\r\n useEffect(() => {\r\n ref.current = value;\r\n });\r\n return ref.current;\r\n}","import * as React from \"react\";\r\nimport {connect} from 'react-redux';\r\nimport {\r\n getInvoiceQuery,\r\n} from './Selectors';\r\nimport _ from 'lodash';\r\nimport {getInvoices, setSelectedSoldTos, updateSecondaryAccounts} from '../../actions/InvoiceActions';\r\nimport {withRouter} from \"react-router-dom\";\r\nimport {useState} from \"react\";\r\nimport {useEffect} from \"react\";\r\nimport * as appConstants from \"../../constants/ApplicationConstants\";\r\nimport {getSoldToNames} from \"../../requests/InvoiceRequests\";\r\nimport {usePrevious} from \"../../hooks\";\r\n\r\nexport const InvoicesContext = React.createContext([]);\r\n\r\nfunction computeSoldToSelectAll(invoices, dispatch) {\r\n let soldTos = invoices.map(invoice => invoice.soldto_number);\r\n soldTos = soldTos.filter((soldTo, pos) => soldTos.indexOf(soldTo) === pos);\r\n // If we have zzcustom soldtoad use the soldto for that data. \r\n if (invoices.length > 0 && invoices[0].zzcustom && invoices[0].zzcustom.soldtoad) {\r\n let listSet = {};\r\n invoices.forEach(invoice => {\r\n listSet[invoice.soldto_number] = {\r\n PrimaryAcct: invoice.soldto_number,\r\n Name: invoice.zzcustom.soldtoad.name,\r\n }\r\n });\r\n dispatch(setSelectedSoldTos(soldTos));\r\n updateSecondaryAccounts(dispatch, Object.values(listSet));\r\n } else {\r\n getSoldToNames(soldTos).then((soldTosResults) => {\r\n let list = [];\r\n for (let prop in soldTosResults) {\r\n list.push({\r\n PrimaryAcct: prop,\r\n Name: soldTosResults[prop],\r\n });\r\n }\r\n dispatch(setSelectedSoldTos(soldTos));\r\n updateSecondaryAccounts(dispatch, list);\r\n });\r\n }\r\n}\r\n\r\nfunction InvoiceDataManager(props) {\r\n\r\n const [invoices, setInvoices] = useState([]);\r\n\r\n let invoiceSearchQuery = props.invoiceSearchQuery;\r\n let forceRefresh = props.forceRefresh;\r\n\r\n const prev = usePrevious({invoiceSearchQuery, forceRefresh});\r\n\r\n useEffect(() => {\r\n if (props.invoiceSearchQuery !== null ) {\r\n if(typeof prev === \"undefined\" ||!_.isEqual(prev.invoiceSearchQuery, invoiceSearchQuery) || prev.forceRefresh !== forceRefresh ){\r\n getInvoices(props.dispatch, props.invoiceSearchQuery).then(([invoices, _]) => {\r\n if (props.accountType === appConstants.ACCOUNT_PAYER_ALL) {\r\n computeSoldToSelectAll(invoices, props.dispatch);\r\n }\r\n });\r\n }\r\n }\r\n }, [\r\n props.invoiceSearchQuery,\r\n props.forceRefresh\r\n ]);\r\n\r\n useEffect(() => {\r\n setInvoices(props.invoices);\r\n }, [\r\n props.invoices,\r\n ]);\r\n\r\n return
\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nPayment.propTypes = {};\r\n\r\nexport default connect((store, props) => ({\r\n cvvRequired: store.default.cvvRequired,\r\n isInvoiceOverpaymentAllowed: store.app.isInvoiceOverpaymentAllowed,\r\n isPartialPaymentsAllowed: store.app.isPartialPaymentsAllowed,\r\n totalAmountWithCredit: store.default.totalAmountWithCredit,\r\n payerDetails: store.default.payerDetails,\r\n selectedSecondaryAccount: store.user_options.selectedSecondaryAccount,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n currentUser: store.default.currentUser,\r\n reasonNotRequired: store.default.reasonNotRequired,\r\n overPayNote: store.default.overPayNote,\r\n payTotal: getPayTotal(store, props),\r\n invoiceTotal: getInvoiceTotal(store, props),\r\n creditTotal: getCreditTotal(store, props),\r\n beforeCreditTotal: getBeforeCreditTotal(store, props),\r\n overPayingAmount: getOverpayingAmount(store, props),\r\n selectedPaymentOption: getSelectedPaymentOption(store, props),\r\n selectedCardIndex: store.default.selectedCard,\r\n customerNumber: getCustomerNumber(store, props),\r\n invoices: store.invoice.selected,\r\n invoiceDetails: store.invoice.invoiceDetail,\r\n reason_codes: store.app.cnbsConfig.payment_reason_codes,\r\n allPaymentOptions: getAllPaymentOptions(store, props),\r\n impersonatedUserId: store.user_options.impersonatedUserId,\r\n canManagePaymentMethods: canManagePaymentMethods(store, props),\r\n canMakePayment: canMakePayment(store, props),\r\n invoiceSearchQuery: getInvoiceQuery(store, props),\r\n}))(Payment);\r\n","export default class sales_area_data {\r\n constructor(sales_organization, distribution_channel, division) {\r\n this.sales_organization = sales_organization;\r\n this.distribution_channel = distribution_channel;\r\n this.division = division;\r\n }\r\n}\r\n","export default class PayerDetailRequest {\r\n constructor(customerNumber, companyCode, action, salesAreaData) {\r\n this.customer_number = customerNumber;\r\n this.company_code = companyCode;\r\n this.action = action;\r\n this.sales_area_data = salesAreaData;\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport cookie from 'react-cookies';\r\nimport {\r\n updateSelectedSecondaryAccountValue,\r\n clearSelectedInvoices\r\n} from \"../../actions/InvoiceActions\";\r\nimport SalesAreaData from '../../models/sales_area_data';\r\nimport PayerDetailRequest from '../../models/payer/PayerDetailRequest';\r\nimport { getInvoiceQuery, getSelectedPrimaryAccount, getPayerAccounts } from \"./Selectors\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\nimport {faChevronDown} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\n\r\nexport class PayerSelect extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.handleCustomerChange = this.handleCustomerChange.bind(this);\r\n }\r\n\r\n handleCustomerChange = (e) => {\r\n clearSelectedInvoices(this.props.dispatch);\r\n updateSelectedSecondaryAccountValue(this.props.dispatch, e.target.value);\r\n };\r\n truncateOption(text) {\r\n const maxLength = 24;\r\n if (text.length > maxLength) {\r\n return text.substr(0, maxLength) + '...';\r\n }\r\n return text;\r\n }\r\n\r\n buildPayerDetailRequest() {\r\n const customerNumber = this.props.customerNumber;//cookie.load(`${this.props.currentUser.Login}${'_'}${'selectedHeaderPrimaryAcct'}`);\r\n const companyCode = cookie.load(`${this.props.currentUser.Login}${'_'}${'selectedCompanyCode'}`);\r\n const salesOrganization = cookie.load(`${this.props.currentUser.Login}${'_'}${'selectedSalesOrganization'}`);\r\n const selectedDistributionChannel = cookie.load(`${this.props.currentUser.Login}${'_'}${'selectedDistributionChannel'}`);\r\n const selectedDivision = cookie.load(`${this.props.currentUser.Login}${'_'}${'selectedDivision'}`);\r\n\r\n const salesAreaData = new SalesAreaData(\r\n salesOrganization,\r\n selectedDistributionChannel,\r\n selectedDivision,\r\n );\r\n return new PayerDetailRequest(customerNumber, companyCode, '', salesAreaData);\r\n }\r\n\r\n render() {\r\n let value = this.props.selectedSecondaryAccount;\r\n let options = this.props.payerAccounts.map((account, index) => {\r\n return { value: index, label: `${account.PrimaryAcct}-${account.Name}`, account_number: account.PrimaryAcct }\r\n });\r\n return Payment
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n }\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {this.props.mode ? 'Deposit Total' : 'Invoice Total'}\r\n
\r\n \r\n {`$ ${depositAmount ? formatMoney(depositAmount) : formatMoney(this.props.invoiceTotal)}`}\r\n
\r\n \r\n
\r\n {this.props.overPayingAmount > 0 &&\r\n \r\n
\r\n \r\n Pay\r\n
\r\n \r\n {`$ ${depositAmount ? formatMoney(depositAmount) : formatMoney(this.props.payTotal)}`}\r\n
\r\n \r\n
\r\n {this.props.isInvoiceOverpaymentAllowed && \r\n
\r\n \r\n Overpaying\r\n
\r\n \r\n {`$ ${formatMoney(this.props.overPayingAmount)}`} \r\n
\r\n \r\n
\r\n }\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {`$ ${formatMoney(this.props.overPayingAmount)}`} will be applied as an additional deposit to\r\n your account\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Payment\r\n Method\r\n
\r\n \r\n \r\n \r\n {paymentCardOptions.map(option => {\r\n return (\r\n \r\n )\r\n })}\r\n \r\n \r\n
\r\n \r\n \r\n {!this.state.showManagePayments &&\r\n
\r\n Manage Payment\r\n Methods
}\r\n {this.state.showManagePayments &&\r\n Hide Payment\r\n Methods
}\r\n \r\n {this.cvvRequired() &&\r\n
\r\n \r\n {this.state.cvvValidationMessage}\r\n
\r\n }\r\n\r\n (\r\n {\r\n !isDepositMode ? this.onPayClick(e, history) : this.onDepositClick(e, history)\r\n }}\r\n >\r\n Pay\r\n \r\n )}/>\r\n
\r\n \r\n
\r\n \r\n {this.state.showManagePayments &&
\r\n \r\n \r\n
\r\n }\r\n \r\n
\r\n \r\n (\r\n {\r\n !isDepositMode ? this.onPayClick(e, history) : this.onDepositClick(e, history)\r\n }}\r\n >\r\n Pay\r\n \r\n )}/>\r\n
\r\n \r\n \r\n \r\n
\r\n }\r\n}\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n selectedSecondaryAccount: state.user_options.selectedSecondaryAccount,\r\n secondaryAccounts: state.user_options.secondaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(state, props),\r\n currentUser: state.default.currentUser,\r\n customerNumber: state.user_options.selectedPrimaryAccount && state.user_options.selectedPrimaryAccount.PrimaryAcct,\r\n invoiceSearchQuery: getInvoiceQuery(state, props),\r\n payerAccounts: getPayerAccounts(state, props),\r\n }\r\n})(PayerSelect);","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { MakeDepositSchema } from '../payment-methods/schemas';\r\nimport { BootstrapError, BootstrapField } from \"../../helpers/Field\";\r\nimport Payment from '../invoice/Payment';\r\nimport PayerSelect from '../invoice/PayerSelect';\r\nimport { getDepositReasonCodes, getPayerAccounts } from \"../invoice/Selectors\";\r\nimport { Formik } from \"formik\";\r\nimport * as appConstants from '../../constants/ApplicationConstants';\r\nimport {faChevronDown} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nclass Deposits extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n selectedReasonCode: appConstants.DEFAULT_DEPOSIT_REASON_CODE,\r\n };\r\n\r\n this.handleReasonCodeChange = this.handleReasonCodeChange.bind(this);\r\n }\r\n\r\n // TODO Delete\r\n // componentWillUnmount() {\r\n // updateInvoiceSearchQuery(this.props.dispatch, false, '01', '', '', '', '', []);\r\n // }\r\n\r\n handleReasonCodeChange = (e) => {\r\n this.setState({ selectedReasonCode: e.target.value });\r\n };\r\n\r\n render() {\r\n const reasonCodes = this.props.depositReasonCodes;\r\n const { selectedReasonCode } = this.state;\r\n\r\n let initialValues = {\r\n payer_option: '',\r\n reason_code: selectedReasonCode,\r\n amount_to_process: '',\r\n reference_number: '',\r\n comment: '',\r\n };\r\n\r\n let schema = MakeDepositSchema;\r\n const isSoldToAccount = this.props.accountType === appConstants.SOLD_TO_COMPARE;\r\n\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\nexport default Statements;\r\n","import React, { Component } from 'react';\r\n\r\nclass Help extends Component {\r\n constructor() {\r\n super();\r\n this.state = {};\r\n }\r\n render() {\r\n return (\r\n Statements Page
\r\n\r\n
\r\n );\r\n }\r\n}\r\nexport default Help;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { setSelectedSoldTos, updatePrimaryAccount, clearSelectedInvoices } from \"../../actions/InvoiceActions\";\r\nimport { getSelectedPrimaryAccount } from \"../invoice/Selectors\";\r\nimport { ACCOUNT_PAYER_ALL } from \"../../constants/ApplicationConstants\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport { isStringNotEmptyOrNull } from \"../../utils\";\r\nexport class NavAccountSelect extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n hasMorethanOneHeaderItems: true,\r\n };\r\n this.onHeaderDropdownSelected = this.onHeaderDropdownSelected.bind(this);\r\n this.createSelectItems = this.createSelectItems.bind(this);\r\n this.dropdownRef = React.createRef(null);\r\n }\r\n \r\n componentDidMount() {\r\n this.props.dispatch(setSelectedSoldTos(this.props.secondaryAccounts.map(account => account.PrimaryAcct)));\r\n }\r\n\r\n onHeaderDropdownSelected(i) {\r\n if (this.props.selectedPrimaryAccountIndex !== i) {\r\n clearSelectedInvoices(this.props.dispatch);\r\n updatePrimaryAccount(this.props.dispatch, i, this.props.accountType !== ACCOUNT_PAYER_ALL);\r\n }\r\n this.dropdownRef.current.click();\r\n }\r\n\r\n createSelectItems() {\r\n\r\n const items = [];\r\n\r\n const { primaryAccounts, selectedPrimaryAccountIndex } = this.props;\r\n\r\n // Validate selectedPrimaryAccountIndex to ensure it is within bounds\r\n\r\n const validSelectedIndex = selectedPrimaryAccountIndex >= 0 && selectedPrimaryAccountIndex < primaryAccounts.length\r\n\r\n ? selectedPrimaryAccountIndex\r\n\r\n : 0; // Default to the first item if out of bounds\r\n\r\n for (let i = 0; i < primaryAccounts.length; i++) {\r\n\r\n const headerItem = primaryAccounts[i];\r\n\r\n let activeClass = 'dropdown-item';\r\n\r\n // Set active class for the valid selected index\r\n\r\n if (validSelectedIndex === i) {\r\n activeClass = 'dropdown-item headerDropdownItemColor';\r\n }\r\n\r\n items.push(\r\n If you need help with Schindler E-Pay please contact us at epayhelp@schindler.com
\r\n{headerItem.Name}
\r\n {headerItem.PrimaryAcct}
\r\n \r\n\r\n );\r\n\r\n }\r\n\r\n return items;\r\n }\r\n\r\n render() {\r\n let name;\r\n let overflowClass;\r\n const { selectedPrimaryAccount, primaryAccounts } = this.props;\r\n\r\n if (primaryAccounts != null) {\r\n overflowClass = primaryAccounts.length > 10 ? \"header-dropdown-overflow\" : \"\";\r\n }\r\n \r\n if (selectedPrimaryAccount != null) {\r\n name = this.props.selectedPrimaryAccount.Name;\r\n if (\r\n this.props.selectedPrimaryAccount.CompanyCode.startsWith(\"JP\") &&\r\n isStringNotEmptyOrNull(this.props.selectedPrimaryAccount.name_2)\r\n ) {\r\n name = this.props.selectedPrimaryAccount.name_2;\r\n }\r\n\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n\r\n {this.props.primaryAccounts.length > 1 && (\r\n \r\n
\r\n \r\n {this.props.primaryAccounts.length > 1 && (\r\n \r\n \r\n \r\n )}\r\n \r\n {this.props.selectedPrimaryAccount && name}\r\n
\r\n \r\n {this.props.selectedPrimaryAccount &&\r\n this.props.selectedPrimaryAccount.PrimaryAcct}\r\n
\r\n \r\n //
\r\n // \r\n // \r\n // {this.createSelectItems()}\r\n //
\r\n // : ''\r\n // }\r\n // \r\n //\r\n
)\r\n }\r\n}\r\n\r\nMenuDrawer.propTypes = {\r\n dispatch: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default withRouter(connect((state, props) => ({\r\n accountType: state.user_options.accountType,\r\n canEditSystemConfig: canEditSystemConfig(state, props),\r\n canManagePaymentMethods: canManagePaymentMethods(state, props),\r\n canManageRegistrationRequests: canManageRegistrationRequests(state, props),\r\n canManageUsers: canManageUsers(state, props),\r\n canViewUsers: canViewUsers(state, props),\r\n currentUser: state.default.currentUser,\r\n hasDeposits: hasDeposits(state, props),\r\n primaryAccounts: state.user_options.primaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(state, props)\r\n}))(MenuDrawer));\r\n","/* eslint-env browser */\r\n/* eslint-disable no-console */\r\nimport React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { NavLink, withRouter, Link } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport { toast } from 'react-toastify';\r\nimport IdleTimer from 'react-idle-timer';\r\nimport { Logout, getUserCustomers, ResetPassword, refreshToken } from '../../actions/UserActions';\r\nimport {\r\n updateSecondaryAccounts,\r\n updateSelectedSecondaryAccountValue,\r\n getCustomData,\r\n clearSelectedInvoices\r\n} from '../../actions/InvoiceActions';\r\nimport NavAccountSelect from \"./NavAccountSelect\";\r\nimport { getSelectedPrimaryAccount, hasDeposits } from \"../invoice/Selectors\";\r\nimport Drawer from '@material-ui/core/Drawer';\r\nimport MenuDrawer from \"./MenuDrawer\";\r\nimport Logo from \"../Logo\";\r\nimport { faCog } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nclass Header extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n collapsed: true,\r\n drawerIsOpen: false,\r\n };\r\n\r\n this.navLinkClick = this.navLinkClick.bind(this);\r\n this.navLinkLogoutClick = this.navLinkLogoutClick.bind(this);\r\n this.navLinkResetPasswordClick = this.navLinkResetPasswordClick.bind(this);\r\n this.mapTableDropdownItems = this.mapTableDropdownItems.bind(this);\r\n\r\n this.idleTimer = null;\r\n this.onAction = this.onAction.bind(this)\r\n this.onIdle = this.onIdle.bind(this)\r\n this.toggleDrawer = this.toggleDrawer.bind(this)\r\n }\r\n\r\n componentDidMount() {\r\n getUserCustomers(this.props.dispatch);\r\n getCustomData(this.props.dispatch);\r\n }\r\n\r\n mapTableDropdownItems = (dropdownItems) => {\r\n if (dropdownItems) {\r\n const accountType = this.props.accountType;\r\n let secondaryAccounts = [];\r\n if (accountType === 'Payer') {\r\n secondaryAccounts = dropdownItems.map(subItem => ({\r\n value: subItem.PrimaryAcct,\r\n label: `${subItem.PrimaryAcct}${'-'}${subItem.Name}`,\r\n clearableValue: false,\r\n className: 'truncate',\r\n checked: 'checked',\r\n }));\r\n } else {\r\n secondaryAccounts = dropdownItems.map(subItem => ({\r\n value: subItem.PrimaryAcct,\r\n label: `${subItem.PrimaryAcct}${'-'}${subItem.Name}`,\r\n clearableValue: false,\r\n className: 'truncate',\r\n checked: '',\r\n }));\r\n }\r\n updateSecondaryAccounts(this.props.dispatch, secondaryAccounts);\r\n updateSelectedSecondaryAccountValue(this.props.dispatch, secondaryAccounts[0]);\r\n }\r\n };\r\n\r\n navLinkInvoiceClick = () => {\r\n this.setState({ collapsed: true });\r\n };\r\n\r\n navLinkClick = () => {\r\n clearSelectedInvoices(this.props.dispatch);\r\n this.setState({ collapsed: true });\r\n };\r\n\r\n navLinkLogoutClick = (event) => {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.setState({ collapsed: true });\r\n sessionStorage.setItem('impersonatedUserId', \"\");\r\n Logout(this.props.dispatch);\r\n };\r\n\r\n navLinkResetPasswordClick = () => {\r\n this.setState({ collapsed: true });\r\n ResetPassword(this.props.dispatch);\r\n };\r\n\r\n navBarToggleClick = () => {\r\n this.setState({ collapsed: !this.state.collapsed });\r\n };\r\n\r\n toggleDrawer = (isOpen) => {\r\n this.setState({ drawerIsOpen: isOpen });\r\n };\r\n\r\n onAction(e) {\r\n // Refresh Token\r\n refreshToken(this.props.dispatch);\r\n }\r\n\r\n onIdle(e) {\r\n toast.info(\"Session timeout occured, Please log in again.\", { position: toast.POSITION.TOP_RIGHT, autoClose: false });\r\n Logout(this.props.dispatch);\r\n }\r\n\r\n render() {\r\n let collapsedClass = `${'collapse navbar-collapse webar-navbar-collapse'}`;\r\n\r\n if (!this.state.collapsed) {\r\n collapsedClass = 'navbar-collapse webar-navbar-collapse';\r\n }\r\n return (\r\n \r\n \r\n }\r\n {!this.state.showAccounts && \r\n }\r\n
\r\n - \r\n
- \r\n {this.props.primaryAccounts.map((account, index) => {\r\n return (
- \r\n
- \r\n
- \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nSoldToSelect.propTypes = {\r\n dispatch: PropTypes.func.isRequired,\r\n};\r\nexport default connect((store,props) => ({\r\n secondaryAccounts: store.user_options.secondaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n selectedSoldTos: store.user_options.selectedSoldTos\r\n}))(SoldToSelect);\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n addSoldToToSelected,\r\n removeSoldToFromSelected,\r\n clearSelectedInvoices,\r\n setSelectedSoldTos\r\n} from '../../actions/InvoiceActions';\r\nimport { getSelectedPrimaryAccount } from \"./Selectors\";\r\nimport { getSoldToNames } from \"../../requests/InvoiceRequests\";\r\nimport { faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nclass SoldToSelectAll extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n allSelected: true\r\n };\r\n this.handleCustomerCheckChange = this.handleCustomerCheckChange.bind(this);\r\n this.createSelectItems = this.createSelectItems.bind(this);\r\n // this.getSoldToDetailsForInvoices = this.getSoldToDetailsForInvoices.bind(this);\r\n this.selectAll = this.selectAll.bind(this);\r\n this.allSelected = this.allSelected.bind(this);\r\n }\r\n\r\n // componentDidMount(){\r\n // this.getSoldToDetailsForInvoices();\r\n // }\r\n\r\n\r\n selectAll() {\r\n if (this.allSelected()) {\r\n this.props.dispatch(setSelectedSoldTos([]));\r\n } else {\r\n this.props.dispatch(setSelectedSoldTos(this.props.secondaryAccounts.map(s => s.PrimaryAcct)));\r\n }\r\n }\r\n\r\n allSelected() {\r\n return this.props.secondaryAccounts.length === this.props.selectedSoldTos.length;\r\n }\r\n\r\n\r\n handleCustomerCheckChange = (target) => {\r\n clearSelectedInvoices(this.props.dispatch);\r\n const value = target.currentTarget.id;\r\n const isChecked = target.currentTarget.checked;\r\n\r\n if (isChecked) {\r\n this.props.dispatch(addSoldToToSelected(value));\r\n } else {\r\n this.props.dispatch(removeSoldToFromSelected(value));\r\n }\r\n };\r\n\r\n getName(customer) {\r\n let name = \"\" + customer.PrimaryAcct;\r\n if (typeof customer.Name !== \"undefined\" && customer.Name !== null) {\r\n return name + \" - \" + customer.Name;\r\n }\r\n return name;\r\n }\r\n\r\n createSelectItems() {\r\n const account = this.props.selectedPrimaryAccount && this.props.selectedPrimaryAccount.PrimaryAcct ? this.props.selectedPrimaryAccount.PrimaryAcct : '';\r\n const selectedItems = this.props.selectedSoldTos;\r\n\r\n let items = [];\r\n for (let l = 0; l < this.props.secondaryAccounts.length; l += 1) {\r\n const customer = this.props.secondaryAccounts[l];\r\n\r\n let itemColor = 'checkbox checkbox-primary dropdown-item truncate ';\r\n let isChecked = '';\r\n if (selectedItems.indexOf(customer.PrimaryAcct) !== -1) {\r\n itemColor = 'checkbox checkbox-primary dropdown-item truncate multiSelectItemColor';\r\n isChecked = 'checked';\r\n }\r\n\r\n items.push(- \r\n
- \r\n \r\n \r\n\r\n \r\n {/*{this.createSelectItems()}*/}\r\n
\r\n \r\n
\r\n \r\n\r\n \r\n
\r\n )}\r\n}\r\n\r\nSoldToSelectAll.propTypes = {\r\n dispatch: PropTypes.func.isRequired,\r\n};\r\nexport default connect((store, props) => ({\r\n secondaryAccounts: store.user_options.secondaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n selectedSoldTos: store.user_options.selectedSoldTos,\r\n invoices: store.default.invoices,\r\n}))(SoldToSelectAll);\r\n","import * as React from \"react\";\r\n\r\nexport default class BasePageErrorBoundary extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = { hasError: false };\r\n }\r\n\r\n static getDerivedStateFromError(error) {\r\n // Update state so the next render will show the fallback UI.\r\n return { hasError: true };\r\n }\r\n\r\n componentDidCatch(error, info) {\r\n // You can also log the error to an error reporting service\r\n }\r\n\r\n render() {\r\n if (this.state.hasError) {\r\n // You can render any custom fallback UI\r\n return - \r\n
- \r\n \r\n \r\n\r\n \r\n {this.createSelectItems()}\r\n
There was an error showing this page.
\r\n
\r\n );\r\n }\r\n}\r\n\r\nInvoices.propTypes = {\r\n dispatch: PropTypes.func.isRequired,\r\n reasonNotRequired: PropTypes.string.isRequired\r\n};\r\n\r\n// TODO cleanup unused props.\r\nexport default connect((store, props) => ({\r\n accountType: store.user_options.accountType,\r\n cnbsConfig: store.default.cnbsConfig,\r\n currencyOptions: store.default.currencyOptions,\r\n currentUser: store.default.currentUser,\r\n dueOptions: store.default.dueOptions,\r\n invoiceListRequest: store.default.invoiceListRequest,\r\n invoiceSearchDueDateTo: store.user_options.invoiceSearchDueDateTo,\r\n invoiceSearchFromDate: store.default.invoiceSearchFromDate,\r\n invoiceSearchToDate: store.user_options.invoiceSearchToDate,\r\n invoiceTotal: getInvoiceTotal(store, props),\r\n listHeight: store.default.listHeight,\r\n payerDetails: store.default.payerDetails,\r\n paymentCardOptions: store.default.paymentCardOptions,\r\n paymentStatusOptions: store.default.paymentStatusOptions,\r\n paymentStatuses: store.default.paymentStatuses,\r\n reasonNotRequired: store.default.reasonNotRequired,\r\n secondaryAccounts: store.user_options.secondaryAccounts,\r\n selectedCurrencyOptionValue: store.default.selectedCurrencyOptionValue,\r\n selectedInvoices: store.invoice.selected,\r\n selectedInvoicesKeys: getSelectedInvoiceKeys(store, props),\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n selectedSecondaryAccount: store.user_options.selectedSecondaryAccount,\r\n totalAmountWithCredit: store.default.totalAmountWithCredit,\r\n userCustomerDetails: store.user_options.primaryAccounts,\r\n canMakePayment: canMakePayment(store),\r\n}))(Invoices);\r\n","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport {getCurrency, formatMoney} from '../../common/invoiceHelpers';\r\nimport {\r\n removeInvoiceFromSelected,\r\n updatePayAmountForInvoice,\r\n updateReason,\r\n updateReasonComment\r\n} from \"../../actions/InvoiceActions\";\r\nimport * as appConstants from \"../../constants/ApplicationConstants\";\r\nimport {getSelectedPrimaryAccount, getPayerAccount} from \"./Selectors\";\r\nimport moment from 'moment';\r\nimport {trimLeadingZeroes} from \"../../utils\";\r\nimport {isCredit} from \"./InvoiceList\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\nimport {faChevronDown, faTimes} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\nclass InvoiceDetail extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n payValidation: '',\r\n reasonDescriptionValidation: '',\r\n readOnly: (!this.props.isPartialPaymentsAllowed && !this.props.isInvoiceOverpaymentAllowed) || isCredit(this.props.invoice),\r\n isCredit: isCredit(this.props.invoice),\r\n reasonNotRequired: this.props.reasonNotRequired !== 'X' ? 'Reason code required' : '',\r\n isItemPayment: this.props.invoice.item_is_a_payment === 'X',\r\n showReasonDescription: false,\r\n isModelStateValid: true,\r\n };\r\n this.onRemoveInvoiceFromSelected = this.onRemoveInvoiceFromSelected.bind(this);\r\n this.handleReasonChange = this.handleReasonChange.bind(this);\r\n this.onChangePayAmount = this.onChangePayAmount.bind(this);\r\n this.handleReasonCodeChange = this.handleReasonCodeChange.bind(this);\r\n this.isReasonCodeValid = this.isReasonCodeValid.bind(this);\r\n this.reasonCodeRequired = this.reasonCodeRequired.bind(this);\r\n this.getSoldToName = this.getSoldToName.bind(this);\r\n }\r\n\r\n isReasonCodeValid() {\r\n return this.props.reason && this.props.reason.length !== 0;\r\n }\r\n\r\n getSoldToName() {\r\n let custOption = '';\r\n if (this.props.accountType === appConstants.SOLD_TO_COMPARE) {\r\n const headerItems = this.props.userCustomerDetails;\r\n for (let l = 0; l < headerItems.length; l += 1) {\r\n const headerItem = headerItems[l];\r\n if (headerItem && headerItem.PrimaryAcct === this.props.selectedPrimaryAccount.PrimaryAcct) {\r\n custOption = `${headerItem.PrimaryAcct}${'-'}${headerItem.Name}`;\r\n }\r\n }\r\n } else {\r\n for (let l = 0; l < this.props.secondaryAccounts.length; l += 1) {\r\n const customer = this.props.secondaryAccounts[l];\r\n if (this.props.invoice.soldto_number === customer.value) {\r\n custOption = customer.label;\r\n break;\r\n }\r\n }\r\n }\r\n return custOption;\r\n }\r\n\r\n reasonCodeRequired() {\r\n return this.props.invoice.open_amount > this.props.payAmount;\r\n }\r\n\r\n onRemoveInvoiceFromSelected = (e) => {\r\n this.props.dispatch(removeInvoiceFromSelected(this.props.invoice));\r\n };\r\n\r\n onChangePayAmount = (e) => {\r\n const {value} = e.target;\r\n this.props.dispatch(updatePayAmountForInvoice(\r\n this.props.documentId,\r\n value ? parseFloat(value) : null,\r\n this.props.invoice.open_amount,\r\n this.props.isPartialPaymentsAllowed,\r\n this.props.isInvoiceOverpaymentAllowed\r\n ));\r\n };\r\n\r\n handleReasonChange = (e) => {\r\n this.props.dispatch(updateReasonComment(this.props.documentId, e.target.value));\r\n };\r\n\r\n mapSoldToolTip(soldTo) {\r\n this.props.onMapSoldTo(soldTo);\r\n }\r\n\r\n handleReasonCodeChange = (selectedReasonCodeOption) => {\r\n this.props.dispatch(updateReason(this.props.documentId, selectedReasonCodeOption.target.value));\r\n };\r\n\r\n errorClass = valid => (valid ? '' : 'invalid');\r\n\r\n render() {\r\n const payerCompanyCode = this.props.payerAccount && this.props.payerAccount.CompanyCode ? this.props.payerAccount.CompanyCode : '';\r\n\r\n const reasonCodes = this.props.cnbsConfig.payment_reason_codes\r\n .filter(obj => obj.company_code === payerCompanyCode && obj.payment_type === 'O')\r\n .map(code => {\r\n return {\r\n value: code.reason_code,\r\n label: code.description,\r\n commentsRequired: code.comments_required,\r\n clearableValue: false,\r\n }\r\n });\r\n\r\n let selectedReasonCode = this.props.cnbsConfig.payment_reason_codes.find((reason) => {\r\n return reason.reason_code === this.props.reason;\r\n });\r\n const postingDate = this.props.invoice && this.props.invoice.posting_date ? moment(this.props.invoice.posting_date).format('MM/DD/YYYY') : '';\r\n const dueDate = this.props.invoice && this.props.invoice.due_date ? moment(this.props.invoice.due_date).format('MM/DD/YYYY') : '';\r\n const payAmount = this.props.payAmount;\r\n return (\r\n \r\n
\r\n \r\n {this.renderSecondarySelect()}\r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {this.state.selectedDueOption !== 'all' && (\r\n \r\n
\r\n )}\r\n {/* SCHINDLER DOES NOT WANT INVOICE SEARCH HERE.*/}\r\n {/*\r\n \r\n
\r\n */}\r\n {/**/}\r\n {/**/}\r\n {/**/}\r\n {/*
*/}\r\n \r\n Pay \r\n = 0 ? 'credit-positive' : 'credit-negative'}>\r\n ${formatMoney(this.props.invoiceTotal)}\r\n \r\n
\r\n {this.state.selectedDueOption === 'all' && (\r\n \r\n
\r\n )}\r\n \r\n {this.props.canMakePayment &&\r\n \r\n Continue \r\n }\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Doc #
\r\n {trimLeadingZeroes(this.props.invoice.billing_document_number)}
\r\n \r\n {this.props.invoice.open_amount < 0 ? 'Credit' : 'Open'}
\r\n \r\n {getCurrency(this.props.invoice)} {formatMoney(this.props.invoice.open_amount)}\r\n
\r\n \r\n
\r\n Date
\r\n \r\n {postingDate}\r\n
\r\n \r\n
\r\n Due
\r\n \r\n {dueDate}\r\n
\r\n \r\n
\r\n \r\n Cust#
\r\n {trimLeadingZeroes(this.props.invoice.soldto_number)}
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {trimLeadingZeroes(this.props.invoice.reference_number)}\r\n
\r\n \r\n Ref #\r\n
\r\n \r\n \r\n
\r\n }\r\n \r\n \r\n \r\n {this.props.invoice.open_amount >= 0 && \r\n \r\n Pay\r\n
\r\n \r\n {this.props.amountValidation}\r\n
: ''}\r\n\r\n
\r\n \r\n \r\n {\r\n this.reasonCodeRequired() ?\r\n \r\n Reason\r\n
\r\n : ''\r\n }\r\n {\r\n this.reasonCodeRequired() ?\r\n \r\n \r\n value={this.props.reason}\r\n \r\n {reasonCodes.map(code => {\r\n return (\r\n \r\n )\r\n })}\r\n \r\n \r\n {this.isReasonCodeValid() ? '' :
\r\n : ''\r\n }\r\n \r\n Reason Code Required.\r\n
}\r\n\r\n
\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nInvoiceDetail.propTypes = {\r\n documentId: PropTypes.string.isRequired,\r\n};\r\n\r\nexport default connect((store, props) => ({\r\n cnbsConfig: store.app.cnbsConfig,\r\n isPartialPaymentsAllowed: store.app.isPartialPaymentsAllowed,\r\n isInvoiceOverpaymentAllowed: store.app.isInvoiceOverpaymentAllowed,\r\n payAmount: store.invoice.invoiceDetail[props.documentId].amount,\r\n amountValidation: store.invoice.invoiceDetail[props.documentId].amountValidation,\r\n reason: store.invoice.invoiceDetail[props.documentId].reason,\r\n comment: store.invoice.invoiceDetail[props.documentId].comment,\r\n invoice: store.invoice.selected[props.documentId],\r\n userCustomerDetails: store.user_options.primaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n secondaryAccounts: store.user_options.secondaryAccounts,\r\n accountType: store.user_options.accountType,\r\n payerAccount: getPayerAccount(store, props),\r\n}))(InvoiceDetail);\r\n","import InvoiceDetail from \"./InvoiceDetail\";\r\nimport Payment from \"./Payment\";\r\nimport {Link, Redirect} from 'react-router-dom';\r\nimport React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport 'react-select/dist/react-select.css';\r\nimport 'react-bootstrap-table/dist/react-bootstrap-table-all.min.css';\r\nimport 'react-activity/dist/react-activity.css';\r\nimport '../../../node_modules/flatpickr/dist/themes/material_blue.css';\r\nimport '../../common/webar_flatpickr.css';\r\nimport {getSelectedPrimaryAccount} from \"./Selectors\";\r\nimport {faAngleDoubleLeft} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nexport class PaymentPageComponent extends Component {\r\n\r\n render() {\r\n return \r\n \r\n
\r\n \r\n {\r\n this.reasonCodeRequired() && selectedReasonCode && selectedReasonCode.comments_required && selectedReasonCode.comments_required === \"X\" ?\r\n
\r\n \r\n Reason Required\r\n
\r\n }\r\n\r\n
\r\n
\r\n}\r\n
\r\n }\r\n}\r\n\r\nexport default connect((store, props) => ({\r\n selectedInvoices: store.invoice.selected,\r\n secondaryAccounts: store.user_options.secondaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n userCustomerDetails: store.user_options.primaryAccounts,\r\n}))(PaymentPageComponent);\r\n","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table';\r\nimport InvoiceDetailModel from '../../models/InvoiceDetail';\r\nimport PropTypes from 'prop-types';\r\nimport {amountFormatter, payerFormatter, reasonFormatter, soldToFormatter} from '../../common/invoiceHelpers';\r\nimport {FormattedDate, FormattedMessage} from \"react-intl\";\r\nimport {trimLeadingZeroes} from \"../../utils\";\r\nimport {getSelectedPaymentOption} from \"./Selectors\";\r\nimport {extractLastCardNumbers} from \"../../actions/InvoiceActions\";\r\nimport Logo from \"../Logo\";\r\n\r\nclass PaymentStatus extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n\r\n render() {\r\n const statuses = this.props.paymentStatuses;\r\n const paymentStatus = statuses && statuses.length > 0 ? statuses[0] : null;\r\n const success = paymentStatus && paymentStatus.message_type === 'S';\r\n const alertClass = success ? 'alert alert-success' : 'alert alert-danger';\r\n const status = paymentStatus && paymentStatus.message_type ? paymentStatus.message_line_string : '';\r\n const documentNumber = paymentStatus && paymentStatus.document_number_finance ? paymentStatus.document_number_finance : '';\r\n const referenceCode = paymentStatus && paymentStatus.authorization_reference_code ? paymentStatus.authorization_reference_code : '';\r\n const top = 'Top';\r\n\r\n let invoices = Object.keys(this.props.invoices).map((key) => {\r\n let invoice = this.props.invoices[key];\r\n let details = this.props.details[key];\r\n return {\r\n billing_document_number: invoice.billing_document_number,\r\n document_number_finance: invoice.document_number_finance,\r\n open_amount: invoice.open_amount,\r\n amount_to_process: success ? details.amount : '',\r\n sold_to: invoice.soldto_number,\r\n payer: invoice.payer_number,\r\n currency_key: invoice.currency_key,\r\n reason: this.props.cnbsConfig.payment_reason_codes.find(r => r.reason_code === details.reason),\r\n reason_message: details.comment,\r\n zzcustom: invoice.zzcustom,\r\n };\r\n });\r\n\r\n return (\r\n \r\n {/* we duplicate this heading section for response purposes*/}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Invoices ({\r\n Object.keys(this.props.selectedInvoices).length\r\n }){' '}\r\n
\r\n\r\n
\r\n \r\n Make Payments\r\n
\r\n\r\n \r\n {' '}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Invoices ({\r\n Object.keys(this.props.selectedInvoices).length\r\n }){' '}\r\n
\r\n\r\n
\r\n \r\n Make Payments\r\n
\r\n\r\n \r\n {' '}\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {Object.keys(this.props.selectedInvoices)\r\n .map((key, index) => (\r\n
\r\n \r\n \r\n
\r\n ))}\r\n \r\n
\r\n
\r\n {Object.keys(this.props.selectedInvoices).length === 0 && \r\n
\r\n \r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nPaymentStatus.propTypes = {\r\n selectedInvoices: PropTypes.arrayOf(PropTypes.instanceOf(InvoiceDetailModel)).isRequired,\r\n};\r\n\r\nexport default connect((store, props) => ({\r\n paymentStatuses: store.default.paymentStatuses,\r\n invoices: store.invoice.completed.invoices,\r\n details: store.invoice.completed.details,\r\n paymentCard: getSelectedPaymentOption(store, props),\r\n currentUser: store.default.currentUser,\r\n cnbsConfig: store.app.cnbsConfig,\r\n}))(PaymentStatus);\r\n","import {Route} from 'react-router-dom';\r\nimport React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport PaymentStatus from './PaymentStatus';\r\nimport {getSelectedPrimaryAccount} from './Selectors';\r\nimport {faAngleDoubleLeft} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nclass PaymentStatusPage extends Component {\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n: {documentNumber.replace(/^0+/, '')}\r\n
\r\n: {referenceCode.replace(/^0+/, '')}\r\n
\r\n {this.props.paymentCard &&\r\n: \r\n
\r\n: {this.props.currentUser.Login}
\r\n: \r\n
\r\n \r\n
\r\n
\r\n {this.props.paymentCard &&\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default connect((store, props) => ({\r\n selectedInvoices: store.default.selectedInvoices,\r\n secondaryAccounts: store.user_options.secondaryAccounts,\r\n selectedPrimaryAccount: getSelectedPrimaryAccount(store, props),\r\n userCustomerDetails: store.user_options.primaryAccounts,\r\n}))(PaymentStatusPage);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {connect} from 'react-redux';\r\nimport {Link, withRouter} from 'react-router-dom';\r\nimport moment from 'moment';\r\nimport {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table';\r\nimport {addInvoiceToSelected, getInvoiceDetail} from '../../actions/InvoiceActions';\r\nimport {\r\n calculateUnitPrice,\r\n formatTotal,\r\n formatColumn,\r\n removePreceedingZero,\r\n getCurrency,\r\n formatMoney\r\n} from '../../common/invoiceHelpers';\r\nimport {trimLeadingZeroes} from \"../../utils\";\r\nimport {canMakePayment} from \"../../PermissionSelectors\";\r\nimport {isCredit} from \"./InvoiceList\";\r\nimport {faAngleLeft} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nclass Detail extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n itemData: null,\r\n billingDocumentNumber: '',\r\n documentDate: '',\r\n totalAmount: '',\r\n currencyKey: '',\r\n customerAddress: '',\r\n invoiceRecipientAddress: '',\r\n backPage: '/invoices',\r\n };\r\n this.goBack = this.goBack.bind(this);\r\n this.pay = this.pay.bind(this);\r\n }\r\n\r\n pay(invoice) {\r\n this.props.dispatch(addInvoiceToSelected(invoice));\r\n this.props.history.push(\"/invoices/pay\");\r\n }\r\n\r\n goBack() {\r\n this.props.history.goBack();\r\n }\r\n\r\n componentDidMount() {\r\n const docNumber = this.props.match.params.billingDocumentNumber;\r\n\r\n if (docNumber) {\r\n getInvoiceDetail(this.props.dispatch, docNumber, '01').then((result) => {\r\n if (result) {\r\n if (result.header_data) {\r\n this.setState({billingDocumentNumber: result.header_data.billing_document_number ? result.header_data.billing_document_number : ''});\r\n this.setState({billingDocumentType: result.header_data.billing_document_type ? result.header_data.billing_document_type : ''});\r\n this.setState({documentDate: result.header_data.document_date ? result.header_data.document_date : ''});\r\n this.setState({totalAmount: result.header_data.total_amount ? result.header_data.total_amount : ''});\r\n this.setState({currencyKey: result.header_data.currency_key ? result.header_data.currency_key : ''});\r\n }\r\n if (result.partner_data) {\r\n const customer = result.partner_data.filter(obj => obj.partner_function === 'WE'); //TODO this should be configurable.\r\n const invoiceRecipient = result.partner_data.filter(obj => obj.partner_function === 'RG');\r\n this.setState({customerAddress: customer[0].address_data});\r\n this.setState({invoiceRecipientAddress: invoiceRecipient[0].address_data});\r\n }\r\n if (result.item_data) {\r\n this.setState({itemData: result.item_data});\r\n }\r\n }\r\n }).catch(() => { /* TODO: Catch error */\r\n });\r\n }\r\n }\r\n\r\n formatHeaderDate(headerDate) {\r\n const format = 'MM/DD/YYYY';\r\n const localeDate = moment(headerDate, format);\r\n return localeDate.format(format);\r\n }\r\n\r\n getInvoice() {\r\n }\r\n\r\n render() {\r\n\r\n const {\r\n customerAddress,\r\n invoiceRecipientAddress,\r\n billingDocumentNumber,\r\n billingDocumentType,\r\n documentDate,\r\n itemData,\r\n totalAmount,\r\n currencyKey,\r\n backPage,\r\n } = this.state;\r\n let headerDate = documentDate ? this.formatHeaderDate(documentDate) : '';\r\n const docNumber = billingDocumentNumber ? removePreceedingZero(billingDocumentNumber) : '';\r\n const customerCity = customerAddress ? customerAddress.city : '';\r\n const customerRegion = customerAddress ? customerAddress.region : '';\r\n const customerPostalCode = customerAddress ? customerAddress.postal_code_city : '';\r\n\r\n const invoiceRecipientCity = invoiceRecipientAddress ? invoiceRecipientAddress.city : '';\r\n const invoiceRecipientRegion = invoiceRecipientAddress ? invoiceRecipientAddress.region : '';\r\n const invoiceRecipientCode = invoiceRecipientAddress ? invoiceRecipientAddress.postal_code_city : '';\r\n const currencySymbol = getCurrency(currencyKey);\r\n\r\n let invoice = this.props.invoices.find(i => trimLeadingZeroes(i.billing_document_number) === trimLeadingZeroes(docNumber));\r\n let showDetail = this.state.itemData !== null;\r\n let allowPay = false;\r\n let _isCredit = false;\r\n if (invoice && invoice.zzcustom && invoice.zzcustom.nodetail === \"X\") {\r\n showDetail = false;\r\n\r\n }\r\n if (invoice) {\r\n allowPay = this.props.canMakePayment && !isCredit(invoice);\r\n _isCredit = isCredit(invoice);\r\n }\r\n\r\n return (\r\n \r\n
\r\n \r\n {\r\n return {\r\n history.goBack()\r\n }}\r\n >\r\n {' '}\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {showDetail &&
\r\n );\r\n }\r\n}\r\n\r\nDetail.propTypes = {\r\n dispatch: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default withRouter(connect((state, props) => ({\r\n invoices: state.default.invoices,\r\n canMakePayment: canMakePayment(state, props)\r\n}))(Detail));\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport { toast } from 'react-toastify';\r\nimport Flatpickr from 'react-flatpickr';\r\nimport moment from 'moment';\r\nimport { Link } from 'react-router-dom';\r\nimport * as appConstants from '../../constants/ApplicationConstants';\r\nimport * as validationTypes from '../../constants/ValidationConstants';\r\nimport '../../../node_modules/flatpickr/dist/themes/material_blue.css';\r\nimport '../../common/webar_flatpickr.css';\r\nimport {\r\n getDefaultFilters, getImpersonatedUserId,\r\n getPayerSoldToForInvoiceQuery,\r\n getSelectedPrimaryAccount,\r\n getSelectedSecondaryAccount\r\n} from \"./Selectors\";\r\nimport { getInvoicesAjax, getInvoiceSearchPDF } from \"../../actions/InvoiceActions\";\r\nimport { InvoiceSearchList } from \"./InvoiceList\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCalendar, faCalendarAlt, faChevronDown, faTimes } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { updateInvoiceListQuery } from \"../../actions/InvoiceActions\";\r\n\r\nclass InvoiceSearch extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n invoices: [],\r\n searched: false,\r\n status: '03',\r\n dueDateFrom: '',\r\n dueDateTo: '',\r\n period: '30',\r\n dateFrom: '',\r\n dateTo: '',\r\n characteristics: '',\r\n characteristicsValue: '',\r\n characteristicsLabel: '',\r\n showDatesDue: false,\r\n showPeriod: true,\r\n showDatesPeriod: false,\r\n showCharacteristicsValue: false,\r\n };\r\n this.onDateChange = this.onDateChange.bind(this);\r\n this.onSelectChange = this.onSelectChange.bind(this);\r\n this.onFindClick = this.onFindClick.bind(this);\r\n this.exportToPdf = this.exportToPdf.bind(this);\r\n this.getSearch = this.getSearch.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n }\r\n\r\n static getDerivedStateFromProps(props, state) {\r\n if (props.primaryAccountIndex !== state.currentPrimaryAccountIndex) {\r\n return {\r\n ...state,\r\n currentPrimaryAccountIndex: props.primaryAccountIndex,\r\n invoices: [],\r\n searched: false,\r\n }\r\n }\r\n return { ...state };\r\n }\r\n\r\n\r\n onDateChange(selectedDates, dateStr, instance) {\r\n let from = '';\r\n let to = '';\r\n if (selectedDates && selectedDates.length > 0) {\r\n from = selectedDates[0] && selectedDates[1] ? moment(selectedDates[0]).format('MM-DD-YYYY') : '';\r\n to = selectedDates[0] && selectedDates[1] ? moment(selectedDates[1]).format('MM-DD-YYYY') : '';\r\n }\r\n const controlId = instance.input.id;\r\n switch (controlId) {\r\n case 'datesDue':\r\n this.setState({ dueDateFrom: from, dueDateTo: to });\r\n break;\r\n case 'datesPeriod':\r\n this.setState({ dateFrom: from, dateTo: to });\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n\r\n onSelectChange(name, e) {\r\n let option = e.target.value;\r\n switch (name) {\r\n case 'status':\r\n this.setState({\r\n status: option,\r\n showDatesDue: option && option === '01',\r\n showPeriod: option && option !== '01'\r\n });\r\n break;\r\n case 'period':\r\n this.setState({\r\n period: option,\r\n showDatesPeriod: option && option === '-1',\r\n });\r\n break;\r\n case 'characteristics':\r\n this.setState({\r\n characteristics: option ? option : '',\r\n showCharacteristicsValue: option && option,\r\n characteristicsLabel: option ? e.target.options[e.target.selectedIndex].text : '',\r\n });\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n\r\n onCharacteristicsValueChange = (e) => {\r\n this.setState({ characteristicsValue: e.target.value });\r\n };\r\n\r\n getSearch() {\r\n let {\r\n dueDateFrom, dueDateTo, dateFrom, dateTo,\r\n } = this.state;\r\n const {\r\n status, period, characteristics, characteristicsValue,\r\n } = this.state;\r\n let datesRequired = false;\r\n let filterValueRequired = false;\r\n if (status === '01') {\r\n dateFrom = appConstants.INV_LIST_REQ_BEGIN_DATE;\r\n dateTo = appConstants.INV_LIST_REQ_END_DATE;\r\n if (!dueDateFrom || !dueDateTo) {\r\n toast.warn(validationTypes.DUE_DATES_REQUIRED, { position: toast.POSITION.TOP_RIGHT });\r\n datesRequired = true;\r\n }\r\n } else {\r\n dueDateFrom = '';\r\n dueDateTo = '';\r\n }\r\n if (period === '-1') {\r\n if (!dateFrom || !dateTo) {\r\n toast.warn(validationTypes.DOCUMENT_DATES_REQUIRED, { position: toast.POSITION.TOP_RIGHT });\r\n datesRequired = true;\r\n }\r\n } else {\r\n dateFrom = this.getDateFrom(period);\r\n dateTo = moment(new Date()).format('MM-DD-YYYY');\r\n }\r\n const filters = [];\r\n if (characteristics) {\r\n if (!characteristicsValue) {\r\n toast.warn(validationTypes.CHARACTERISTICS_VALUE_REQUIRED, { position: toast.POSITION.TOP_RIGHT });\r\n filterValueRequired = true;\r\n } else {\r\n const filter = { filter_type: characteristics, value: characteristicsValue };\r\n filters.push(filter);\r\n }\r\n }\r\n \r\n\r\n let { payer_data, soldto_data } = getPayerSoldToForInvoiceQuery(this.props.accountType, this.props.secondaryAccount, this.props.primaryAccount);\r\n let search = {\r\n payer_data,\r\n soldto_data,\r\n search_parameters: {\r\n document_type: '01',\r\n status: status,\r\n date_from: dateFrom,\r\n date_to: dateTo,\r\n due_date_from: dueDateFrom,\r\n due_date_to: dueDateTo,\r\n currency_key: '',\r\n filter: getDefaultFilters(this.props.accountType, this.props.impersonatedUserId).concat(filters),\r\n }\r\n };\r\n if (!datesRequired && !filterValueRequired) {\r\n //InvoiceListRequest\r\n updateInvoiceListQuery(this.props.dispatch, search);\r\n }\r\n\r\n return search;\r\n }\r\n\r\n exportToPdf() {\r\n try {\r\n let search = this.getSearch();\r\n getInvoiceSearchPDF(this.props.dispatch, search);\r\n } catch (e) {\r\n return null;\r\n }\r\n\r\n }\r\n\r\n onFindClick() {\r\n try {\r\n let search = this.getSearch();\r\n getInvoicesAjax(search).then((response) => {\r\n this.setState({ invoices: response.data.document_list, searched: true });\r\n });\r\n } catch (e) {\r\n return null;\r\n }\r\n\r\n // let searchQuery = {\r\n // payer_data,\r\n // soldto_data,\r\n // search_parameters: {\r\n // document_type: '01',\r\n // status: status,\r\n // date_from: fromDate ? fromDate : appConstants.INV_LIST_REQ_BEGIN_DATE,\r\n // date_to: toDate ? toDate : moment(new Date()).format('MM-DD-YYYY'),\r\n // due_date_from: dueDateFrom,\r\n // due_date_to: dueDateTo,\r\n // currency_key: '',\r\n // filter: tempFilter,\r\n // }\r\n // };\r\n }\r\n\r\n getDateFrom = (days) => {\r\n const date = new Date();\r\n date.setDate(date.getDate() - days);\r\n return moment(date).format('MM-DD-YYYY');\r\n }\r\n\r\n render() {\r\n const countOfInvoices = this.state.invoices ? this.state.invoices.length : 0;\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {invoice && allowPay && }\r\n
\r\n \r\n
\r\n {`${'Invoice'}${' '}${docNumber}`}\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n \r\n Customer\r\n {customerAddress.name}\r\n
\r\n \r\n {customerAddress.street}\r\n
\r\n \r\n {`${customerCity}${' '}${customerRegion}${' '}${customerPostalCode}`}\r\n
\r\n \r\n
\r\n \r\n Invoice Recipient\r\n {invoiceRecipientAddress.name}\r\n
\r\n \r\n {invoiceRecipientAddress.street}\r\n
\r\n \r\n {`${invoiceRecipientCity}${' '}${invoiceRecipientRegion}${' '}${invoiceRecipientCode}`}\r\n
\r\n \r\n
\r\n \r\n Date\r\n {headerDate}\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n {showDetail &&
\r\n
\r\n }\r\n \r\n \r\n \r\n Item\r\n \r\n \r\n Qty\r\n \r\n \r\n Article #\r\n \r\n \r\n Description\r\n \r\n \r\n Unit Price\r\n \r\n \r\n Total\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {`${'Invoice Total: '}`}\r\n \r\n {`${currencySymbol}${formatMoney(totalAmount)}`}\r\n
\r\n \r\n \r\n \r\n {this.props.periodOptions.map(period => {\r\n return (\r\n \r\n )\r\n })}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Invoice Search
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n Due\r\n
\r\n \r\n Status\r\n
\r\n \r\n \r\n {this.props.invoiceStatusOptions.map(status => {\r\n return (\r\n \r\n )\r\n })}\r\n \r\n
\r\n \r\n \r\n Period\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n Search Options\r\n
\r\n \r\n \r\n \r\n {this.props.characteristicsOptions.map(characterstic => {\r\n return (\r\n \r\n )\r\n })}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {this.state.invoices && this.state.invoices.length > 0 &&
\r\n
\r\n }\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {this.props.searched && {countOfInvoices} Invoices found!}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nInvoiceSearch.propTypes = {\r\n dispatch: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store, props) => ({\r\n accountType: store.user_options.accountType,\r\n primaryAccount: getSelectedPrimaryAccount(store, props),\r\n primaryAccountIndex: store.user_options.selectedPrimaryAccountIndex,//getSelectedPrimaryAccountIndex(store, props),\r\n secondaryAccount: getSelectedSecondaryAccount(store, props),\r\n invoiceStatusOptions: store.default.invoiceStatusOptions,\r\n periodOptions: store.default.periodOptions,\r\n characteristicsOptions: store.default.characteristicsOptions,\r\n filter: store.user_options.filter,\r\n impersonatedUserId: getImpersonatedUserId(store, props),\r\n}), null, null, { pure: false })(InvoiceSearch);\r\n","import { useEffect, useRef } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { getCurrentAccount, getPayerAccount, getSelectedPrimaryAccount, getSelectedSecondaryAccount } from \"./Selectors\";\r\nimport { getPayerDetailsBuilder } from \"../../actions/InvoiceActions\";\r\nimport _ from 'lodash';\r\nimport { getPaymentMethods } from \"../../requests/InvoiceRequests\";\r\nimport { SET_PAYMENT_METHODS } from \"../../constants/ActionTypes\";\r\nimport * as React from \"react\";\r\nimport * as appConstants from \"../../constants/ApplicationConstants\";\r\nimport { usePrevious } from \"../../hooks\";\r\n\r\nexport const PayerDetailsContext = React.createContext([]);\r\n\r\nfunction PayerDetailsDataManager(props) {\r\n const selectedPayer = props.accountType === appConstants.SOLD_TO_COMPARE ? props.selectedSecondaryAccount : props.selectedPrimaryAccount;\r\n const prevAmount = usePrevious({ selectedPayer });\r\n\r\n useEffect(() => {\r\n if (prevAmount != undefined) {\r\n if (props.selectedPrimaryAccount !== null && !_.isEqual(prevAmount.selectedPayer, selectedPayer)) {\r\n getPayerDetailsBuilder(props.dispatch, props.selectedPrimaryAccount, props.selectedSecondaryAccount, props.accountType);\r\n getPaymentMethods(props.currentAccount).then((paymentMethods) => {\r\n props.dispatch({ type: SET_PAYMENT_METHODS, payload: paymentMethods }, () => { });\r\n });\r\n }\r\n }\r\n }, [\r\n props.selectedSecondaryAccount,\r\n props.selectedPrimaryAccount,\r\n props.accountType,\r\n props.currentAccount,\r\n ]);\r\n\r\n return
\r\n {\r\n bag.setSubmitting(true);\r\n this.props.saveAccount(values).then(() => {\r\n bag.setSubmitting(false);\r\n })\r\n }}\r\n initialValues={this.props.account}\r\n enableReinitialize={true}\r\n render={(props) =>\r\n \r\n } />\r\n
\r\n );\r\n }\r\n}\r\n\r\nManageUserSapAccount.propTypes = {\r\n account: PropTypes.object,\r\n saveAccount: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store, props) => ({\r\n salesOrgs: store.app.config.sap.data.sales_area_data,\r\n companyCodes: store.app.config.sap.data.company_codes,\r\n}))(ManageUserSapAccount);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport ManageUserSapAccount from \"./ManageUserSapAccount\";\r\nimport {saveUserSapAccount} from \"../../requests/UserRequests\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome/index.es\";\r\nimport {connect} from \"react-redux\";\r\n\r\nclass LinkedSapAccounts extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n account: null,\r\n accounts: [],\r\n };\r\n this.addNewAccount = this.addNewAccount.bind(this);\r\n this.editAccount = this.editAccount.bind(this);\r\n this.deleteAccount = this.deleteAccount.bind(this);\r\n this.close = this.close.bind(this);\r\n }\r\n \r\n componentDidMount() {\r\n if(this.props.accounts){\r\n this.setState({\r\n accounts: this.props.accounts\r\n });\r\n } else {\r\n this.refreshAccounts();\r\n }\r\n }\r\n\r\n addNewAccount() {\r\n let accountType = \"\";\r\n if(this.props.accountTypes.length === 1){\r\n accountType = this.props.accountTypes[0].AccountTypeId;\r\n }\r\n this.setState({\r\n account: {\r\n primaryAcct: '',\r\n accountTypeId: accountType,\r\n SalesOrganization: this.props.defaults.account.sales_organization,\r\n companyCode: '',\r\n division: this.props.defaults.account.division,\r\n distributionChannel: this.props.defaults.account.distribution_channel,\r\n }\r\n });\r\n }\r\n\r\n close() {\r\n this.setState({account: null});\r\n }\r\n\r\n refreshAccounts() {\r\n this.props.getAccounts(this.props.userId).then(accounts => {\r\n this.setState({accounts: accounts});\r\n })\r\n }\r\n\r\n editAccount(account) {\r\n this.setState({account: account});\r\n }\r\n\r\n deleteAccount(account) {\r\n this.props.deleteAccount(this.props.userId, account).then(() => {\r\n if (this.state.account && (this.state.account.AccountId === account.AccountId)) {\r\n this.setState({account: null});\r\n }\r\n this.refreshAccounts();\r\n });\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nLinkedSapAccounts.propTypes = {\r\n userId: PropTypes.number.isRequired,\r\n getAccounts: PropTypes.func.isRequired,\r\n deleteAccount: PropTypes.func.isRequired,\r\n};\r\nLinkedSapAccounts.defaultProps = {\r\n accountTypes: [],\r\n};\r\nexport default connect(state => ({\r\n defaults: state.app.config.defaults\r\n })\r\n)(LinkedSapAccounts);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nclass ExclusionItem extends Component {\r\n \r\n constructor(props){\r\n super(props); \r\n \r\n this._deleteItem = this._deleteItem.bind(this);\r\n }\r\n \r\n _deleteItem(){\r\n this.props.onDelete(this.props.index); \r\n }\r\n \r\n render() {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Linked SAP Accounts
\r\n\r\n
\r\n \r\n {this.state.accounts.map((account) =>\r\n
\r\n \r\n
\r\n )}\r\n \r\n {account.PrimaryAcct}-{account.CompanyCode}-{account.SalesOrganization}-{account.DistributionChannel}-{account.Division}\r\n
\r\n \r\n this.deleteAccount(account)}> Delete \r\n this.editAccount(account)}> Edit \r\n
\r\n \r\n \r\n
\r\n \r\n {this.state.account &&
\r\n \r\n \r\n \r\n \r\n {\r\n return saveUserSapAccount(this.props.userId, account).then(() => {\r\n this.refreshAccounts();\r\n this.setState({account: null});\r\n });\r\n }}/>
}\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nExclusionItem.propTypes = {\r\n value: PropTypes.string.isRequired,\r\n index: PropTypes.number.isRequired,\r\n onDelete: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default ExclusionItem;","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nclass AddExclusionItem extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n inputValue: \"\",\r\n };\r\n\r\n this._updateInput = this._updateInput.bind(this);\r\n this._submit = this._submit.bind(this);\r\n }\r\n\r\n _updateInput(event) {\r\n this.setState({\r\n inputValue: event.target.value,\r\n });\r\n }\r\n\r\n _submit(event) {\r\n event.preventDefault();\r\n if(this.state.inputValue.length > 0){\r\n this.props.onSubmit(this.state.inputValue);\r\n this.setState({\r\n inputValue: \"\",\r\n });\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nAddExclusionItem.propTypes = {\r\n onSubmit: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default AddExclusionItem;","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport ExclusionItem from \"./ExclusionItem\";\r\nimport AddExclusionItem from \"./AddExclusionItem\";\r\nimport {toast} from \"react-toastify\";\r\nimport {refreshInvoices} from \"../../../reducers/InvoiceReducer\";\r\nimport {getImpersonatedUserId} from \"../../invoice/Selectors\";\r\nimport {connect} from \"react-redux\";\r\n\r\nclass ExclusionList extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n exclusions: [],\r\n };\r\n\r\n \r\n this._addExclusion = this._addExclusion.bind(this);\r\n this._removeExclusion = this._removeExclusion.bind(this);\r\n }\r\n \r\n componentDidMount() {\r\n this.props.getExclusions(this.props.userId).then((list) => {\r\n this.setState({\r\n exclusions: list\r\n });\r\n });\r\n }\r\n\r\n _addExclusion(value) {\r\n let newList = this.state.exclusions.slice(0);\r\n newList.push(value);\r\n this._updateExclusionList(newList);\r\n }\r\n \r\n _updateExclusionList(newList){\r\n this.props.updateExclusions(this.props.userId, newList).then((list) => {\r\n if(typeof list.status !== 'undefined' && list.status.message_type === \"E\" ){\r\n toast.error(list.status.message_line_string, { position: toast.POSITION.TOP_RIGHT });\r\n } else {\r\n this.setState({\r\n exclusions: list\r\n });\r\n this._refreshInvoices();\r\n }\r\n });\r\n \r\n }\r\n \r\n _refreshInvoices(){\r\n if(this.props.userId === this.props.impersonatedUserId){\r\n this.props.dispatch(refreshInvoices())\r\n } \r\n }\r\n\r\n _removeExclusion(index) {\r\n let newList = this.state.exclusions.slice(0);\r\n newList.splice(index, 1);\r\n this._updateExclusionList(newList);\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.props.value}\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {goToPage(i, e)}}>{i} )\r\n } else {\r\n items.push( {goToPage(i,e)}}>{i} )\r\n }\r\n }\r\n \r\n let isFirstDisabled = currentPage === 1? \"disabled\": \"\";\r\n let isLastDisabled = currentPage === numOfPages? \"disabled\": \"\";\r\n \r\n return (\r\n \r\n );\r\n};\r\n\r\nPagination.propTypes = {\r\n goTo: PropTypes.func.isRequired,\r\n currentPage: PropTypes.number.isRequired,\r\n totalItems: PropTypes.any.isRequired,\r\n};\r\n\r\nexport default Pagination;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { BootstrapTable, TableHeaderColumn } from \"react-bootstrap-table\";\r\nimport UserImpersonate from './UserImpersonate';\r\nimport { Link } from 'react-router-dom';\r\nimport { canImpersonate, canManageUsers } from \"../../PermissionSelectors\";\r\nimport { connect } from \"react-redux\";\r\nimport Pagination from \"../navigation/Pagination\";\r\nimport { getUserCustomers, mapPrimaryAccountType } from \"../../actions/UserActions\";\r\nimport { updateState } from \"../../actions/CommonActions\";\r\nimport * as types from \"../../constants/ActionTypes\";\r\nimport { clearSessionPaymentMethods } from \"../../reducers/PaymentReducer\";\r\n\r\nclass UserList extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n impersonatedUserId: null, // Centralized state for impersonation\r\n };\r\n /* this.handleImpersonate = this.handleImpersonate.bind(this);*/\r\n }\r\n\r\n //handleImpersonate(userId) {\r\n // const newImpersonatedUserId =\r\n // userId === this.state.impersonatedUserId ? null : userId;\r\n\r\n // // Update state\r\n // this.setState({ impersonatedUserId: newImpersonatedUserId });\r\n\r\n // // Update session storage\r\n // sessionStorage.setItem('impersonatedUserId', newImpersonatedUserId || \"\");\r\n\r\n // // Dispatch necessary actions\r\n // if (newImpersonatedUserId) {\r\n // this.props.dispatch(getUserCustomers(this.props.dispatch, newImpersonatedUserId));\r\n // const user = this.props.users.find((u) => u.UserId === newImpersonatedUserId);\r\n // if (user) {\r\n // this.props.dispatch(\r\n // updateState(this.props.dispatch, types.SET_ACCOUNT_TYPE, mapPrimaryAccountType(user.PrimaryAccountTypeId))\r\n // );\r\n // }\r\n // } else {\r\n // this.props.dispatch(clearSessionPaymentMethods());\r\n // }\r\n //}\r\n\r\n impersonateFormatter(cell, row) {\r\n return (\r\n \r\n
\r\n \r\n } />\r\n );\r\n }\r\n}\r\n\r\nManageUserForm.propTypes = {\r\n onSave: PropTypes.func,\r\n save: PropTypes.func.isRequired,\r\n user: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default ManageUserForm;\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nconst RegistrationRequestDetails = props => {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Exclusion List
\r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nExclusionList.propTypes = {\r\n userId: PropTypes.number.isRequired,\r\n getExclusions: PropTypes.func.isRequired,\r\n updateExclusions: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store, props) => ({\r\n impersonatedUserId: getImpersonatedUserId(store)\r\n}))(ExclusionList);\r\n\r\n\r\n","import axios from '../axios';\r\nimport {GET_ACCOUNT_TYPE_LIST, GET_PRIMARY_ACCOUNT_TYPE_LIST} from \"../constants/ApiConstants\";\r\n\r\nexport function getAccountTypes() {\r\n return axios.get(GET_ACCOUNT_TYPE_LIST).then((response) => response.data);\r\n}\r\n\r\nexport function getPrimaryAccountTypes() {\r\n return axios.get(GET_PRIMARY_ACCOUNT_TYPE_LIST).then((response) => response.data);\r\n}","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport {getUserCustomers, ResetPassword as ResetPasswordMethod} from '../../actions/UserActions';\r\nimport LinkedSapAccounts from \"../user-management/LinkedSapAccounts\";\r\nimport {\r\n deleteUserSapAccount,\r\n getExclusionList,\r\n getUserSapAccounts,\r\n updateExclusionList\r\n} from \"../../requests/UserRequests\";\r\nimport ExclusionList from \"../user-management/exclusions/ExclusionList\";\r\nimport {canManageOwnSAPAccounts, canManageUsers} from \"../../PermissionSelectors\";\r\nimport {getAccountTypes} from \"../../requests/AccountTypeRequests\";\r\nimport {updateAccountTypes} from \"../../actions/InvoiceActions\";\r\n\r\nclass ResetPassword extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n currentPassword: '',\r\n newPassword: '',\r\n confirmNewPassword: '',\r\n currentPasswordValid: true,\r\n newPasswordValid: true,\r\n confirmNewPasswordValid: true,\r\n };\r\n this.passwordChange = this.passwordChange.bind(this);\r\n this.onResetClick = this.onResetClick.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n getAccountTypes().then((accountTypes) => {\r\n updateAccountTypes(this.props.dispatch, accountTypes);\r\n });\r\n }\r\n\r\n onResetClick() {\r\n if (this.validateFields()) {\r\n ResetPasswordMethod(this.props.dispatch, this.state.currentPassword, this.state.newPassword, this.state.confirmNewPassword);\r\n }\r\n }\r\n\r\n validateFields() {\r\n let isModelStateValid = false;\r\n this.setState({currentPasswordValid: this.state.currentPassword !== ''});\r\n this.setState({newPasswordValid: this.state.newPassword !== ''});\r\n this.setState({confirmNewPasswordValid: this.state.confirmNewPassword !== ''});\r\n\r\n if (this.state.currentPassword !== '' && this.state.newPassword !== '' && this.state.confirmNewPassword !== '') {\r\n isModelStateValid = true;\r\n }\r\n return isModelStateValid;\r\n }\r\n\r\n passwordChange = (e) => {\r\n if (e.currentTarget.name === 'currentPassword') {\r\n this.setState({currentPassword: e.target.value});\r\n this.setState({currentPasswordValid: e.target.value !== ''});\r\n }\r\n if (e.currentTarget.name === 'newPassword') {\r\n this.setState({newPassword: e.target.value});\r\n this.setState({newPasswordValid: e.target.value !== ''});\r\n }\r\n if (e.currentTarget.name === 'confirmNewPassword') {\r\n this.setState({confirmNewPassword: e.target.value});\r\n this.setState({confirmNewPasswordValid: e.target.value !== ''});\r\n }\r\n }\r\n\r\n errorClass = valid => (valid ? '' : 'invalid');\r\n\r\n render() {\r\n const {\r\n currentPasswordValid,\r\n newPasswordValid,\r\n confirmNewPasswordValid,\r\n } = this.state;\r\n return (\r\n \r\n
\r\n \r\n {this.state.exclusions && this.state.exclusions.map((value, i, arr) => {\r\n return \r\n \r\n {i < arr.length &&\r\n
\r\n \r\n }\r\n \r\n })}\r\n \r\n
\r\n \r\n \r\n }\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default connect((store, props) => ({\r\n userId: store.default.currentUser.UserId,\r\n primaryAccountTypeId: store.default.currentUser.PrimaryAccountTypeId,\r\n accountTypes: store.default.accountTypes,\r\n canManageOwnSAPAccounts: canManageOwnSAPAccounts(store, props),\r\n canManageUsers: canManageUsers(store, props),\r\n}))(ResetPassword);\r\n","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport PayerSelect from \"../invoice/PayerSelect\";\r\nimport ManagePaymentMethods from \"./manage-payment-methods/ManagePaymentMethods\";\r\nimport * as appConstants from \"../../constants/ApplicationConstants\";\r\n\r\nexport class AccountPaymentPage extends Component {\r\n\r\n render() {\r\n const isSoldToAccount = this.props.accountType === appConstants.SOLD_TO_COMPARE;\r\n return \r\n
\r\n {this.props.canManageOwnSAPAccounts && \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Reset Password
\r\n\r\n \r\n \r\n {currentPasswordValid ? '' :
\r\n \r\n Required.\r\n
}\r\n\r\n \r\n \r\n {newPasswordValid ? '' :
\r\n \r\n Required.\r\n
}\r\n\r\n \r\n {confirmNewPasswordValid ? '' :
\r\n \r\n Required.\r\n
}\r\n\r\n \r\n
\r\n \r\n
\r\n\r\n {this.props.primaryAccountTypeId === 3 && \r\n {\r\n getUserCustomers(this.props.dispatch, \"\", false);\r\n return getUserSapAccounts(userId);\r\n }} deleteAccount={deleteUserSapAccount}\r\n accountTypes={this.props.accountTypes}/>\r\n
\r\n \r\n
\r\n }\r\n \r\n {this.props.canManageUsers &&\r\n {\r\n getUserCustomers(this.props.dispatch, \"\", false);\r\n return getExclusionList(userId)\r\n }} updateExclusions={updateExclusionList}\r\n userId={this.props.userId}/>\r\n }\r\n
\r\n \r\n
\r\n }\r\n}\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n accountType: state.user_options.accountType,\r\n }\r\n})(AccountPaymentPage);\r\n","import React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { getUserCustomers, mapPrimaryAccountType } from \"../../actions/UserActions\";\r\nimport { updateState } from \"../../actions/CommonActions\";\r\nimport * as types from \"../../constants/ActionTypes\";\r\nimport { clearSessionPaymentMethods } from \"../../reducers/PaymentReducer\";\r\nimport { canImpersonate } from \"../../PermissionSelectors\";\r\n\r\nclass UserImpersonate extends React.Component {\r\n onCheckClick = () => {\r\n const { user, impersonatedUserId, dispatch, currentUser } = this.props;\r\n\r\n if (user.UserId !== impersonatedUserId) {\r\n // Start impersonation\r\n sessionStorage.setItem(\"impersonatedUserId\", user.UserId);\r\n (getUserCustomers(dispatch, user.UserId));\r\n (updateState(dispatch, types.SET_ACCOUNT_TYPE, mapPrimaryAccountType(user.PrimaryAccountTypeId)));\r\n } else {\r\n // Stop impersonation\r\n sessionStorage.setItem(\"impersonatedUserId\", \"\");\r\n (getUserCustomers(dispatch, \"\"));\r\n (updateState(dispatch, types.SET_ACCOUNT_TYPE, mapPrimaryAccountType(currentUser.PrimaryAccountTypeId)));\r\n }\r\n\r\n dispatch(clearSessionPaymentMethods());\r\n };\r\n\r\n render() {\r\n const { user, impersonatedUserId, canImpersonate } = this.props;\r\n const isChecked = user.UserId === impersonatedUserId;\r\n\r\n return (\r\n \r\n
\r\n \r\n {isSoldToAccount ? : ''}\r\n
\r\n \r\n \r\n
\r\n \r\n {canImpersonate && (\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default connect((state, props) => ({\r\n impersonatedUserId: state.user_options.impersonatedUserId,\r\n currentUser: state.default.currentUser,\r\n canImpersonate: canImpersonate(state, props),\r\n}))(UserImpersonate);\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nconst Pagination = props => {\r\n \r\n let goToPage = function(page, e){\r\n e.preventDefault();\r\n props.goTo(page);\r\n };\r\n let goToFirst = function(e){\r\n e.preventDefault();\r\n props.goTo(1);\r\n };\r\n let goToLast = function(e){\r\n e.preventDefault();\r\n props.goTo(numOfPages);\r\n };\r\n let goToNext = function(e){\r\n e.preventDefault();\r\n props.goTo(++currentPage);\r\n };\r\n let goToPrevious = function(e){\r\n e.preventDefault();\r\n props.goTo(--currentPage);\r\n };\r\n \r\n let currentPage = props.currentPage;\r\n let itemCount = parseInt(props.totalItems);\r\n let pageSize = 50;\r\n let numOfPages = Math.ceil(itemCount/ pageSize);\r\n let pagesToShow = 5;\r\n let items = [];\r\n \r\n let firstNum = 1;\r\n let lastNum = 10;\r\n let ceil = Math.ceil(pagesToShow/2);\r\n \r\n let showBeginningEllipse = false; \r\n let showEndEllipse = false; \r\n \r\n if(numOfPages < pagesToShow){\r\n firstNum = 1;\r\n lastNum = numOfPages;\r\n showBeginningEllipse = false;\r\n showEndEllipse = false;\r\n } else if(currentPage <= ceil){\r\n firstNum = 1;\r\n lastNum = pagesToShow;\r\n showEndEllipse = true;\r\n } else if (currentPage >= numOfPages - ceil) {\r\n showBeginningEllipse = true;\r\n firstNum = numOfPages - pagesToShow;\r\n lastNum = numOfPages;\r\n } else {\r\n firstNum = currentPage - ceil + 1; \r\n lastNum = currentPage + ceil -1 ;\r\n showBeginningEllipse = true;\r\n showEndEllipse = true;\r\n }\r\n\r\n for(let i = firstNum; i <= lastNum; i++){\r\n if(i === currentPage){\r\n items.push(' }${ row.Company }${ '
' }`);\r\n\r\n }\r\n\r\n}\r\n\r\n formatEmailColumn(cell, row) {\r\n\r\n if (row) {\r\n\r\n return (`${ '' }${ row.Email }${ '
' }`);\r\n\r\n }\r\n\r\n}\r\n\r\n// impersonateFormatter(cell, row) { \r\n\r\n// return ' }${ row.FirstName } ${ row.LastName }${ '
' }`);\r\n\r\n }\r\n\r\n}\r\n\r\n profileColumn(cell, row) {\r\n\r\n let display = \"\";\r\n\r\n if (row.PrimaryAccountTypeId === 1) {\r\n\r\n display = \"Sold To\";\r\n\r\n } else if (row.PrimaryAccountTypeId === 2) {\r\n\r\n display = \"Payer\";\r\n\r\n } else if (row.PrimaryAccountTypeId === 3) {\r\n\r\n display = \"Payer - All\";\r\n\r\n }\r\n\r\n return (`${ '' }${ display }${ '
' }`);\r\n\r\n}\r\n\r\n accountsColumn(cell, row) {\r\n\r\n let accountNumbers = [];\r\n\r\n if (row.Accounts != undefined)\r\n\r\n row.Accounts.forEach((a) => accountNumbers.push(a.PrimaryAcct));\r\n\r\n if (accountNumbers.length > 0) {\r\n\r\n return (`${ '' }${ accountNumbers.join(\", \") }${ '
' }`);\r\n\r\n }\r\n\r\n}\r\n\r\n render() {\r\n return (\r\n \r\n \r\n {this.props.canImpersonate &&(\r\n \r\n Impersonate\r\n \r\n )}\r\n \r\n User Id\r\n \r\n \r\n Name\r\n \r\n \r\n Company\r\n \r\n \r\n eMail\r\n \r\n \r\n Status\r\n \r\n \r\n Profile\r\n \r\n \r\n Accounts\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nUserList.propTypes = {\r\n users: PropTypes.array.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => ({\r\n canManageUsers: canManageUsers(state, props),\r\n canImpersonate: canImpersonate(state, props)\r\n}))(UserList);\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport UserList from \"./UserList\";\r\nimport PropTypes from 'prop-types';\r\nimport { Link } from \"react-router-dom\";\r\nimport * as _ from 'lodash';\r\nimport {canManageUsers, canViewUsers} from \"../../PermissionSelectors\";\r\nimport Pagination from \"../navigation/Pagination\";\r\nimport {exportUserList} from \"../../requests/UserRequests\";\r\nimport {faChevronDown, faSearch} from \"@fortawesome/free-solid-svg-icons\";\r\nimport {FontAwesomeIcon} from \"@fortawesome/react-fontawesome\";\r\n\r\nclass ListUsersPage extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n users: [],\r\n status: 'all',\r\n search: '',\r\n profile: null,\r\n currentPage: 1,\r\n userCount: 0,\r\n };\r\n\r\n this.getUsers = this.getUsers.bind(this);\r\n this.profileFilterChange = this.profileFilterChange.bind(this);\r\n this.statusFilterChange = this.statusFilterChange.bind(this);\r\n this.onSearchChange = this.onSearchChange.bind(this);\r\n this.exportUsers = this.exportUsers.bind(this);\r\n this.goTo = this.goTo.bind(this);\r\n this.onSearchChangeDebounce = _.debounce((value) => {\r\n this.setState({ search: value, currentPage: 1 }, () => {\r\n this.getUsers();\r\n });\r\n }, 400);\r\n }\r\n\r\n componentDidMount() {\r\n this.getUsers();\r\n }\r\n\r\n getUsers() {\r\n return this.props.getUsers(this.state.status, this.state.profile, this.state.search, this.state.currentPage).then((response) => {\r\n this.setState({ users: response.data, userCount: response.total });\r\n })\r\n }\r\n\r\n profileFilterChange(event) {\r\n this.setState({ profile: event.target.value, currentPage: 1 }, () => {\r\n this.getUsers();\r\n });\r\n }\r\n\r\n statusFilterChange(event) {\r\n this.setState({ status: event.target.value, currentPage: 1 }, () => {\r\n this.getUsers();\r\n });\r\n }\r\n\r\n onSearchChange = event => {\r\n this.onSearchChangeDebounce(event.target.value);\r\n };\r\n\r\n\r\n goTo(page){\r\n this.setState({\r\n currentPage: page\r\n }, () => {\r\n this.getUsers();\r\n });\r\n }\r\n \r\n exportUsers(){\r\n exportUserList()\r\n }\r\n\r\n render() {\r\n return \r\n {\r\n (this.props.canViewUsers) ?\r\n
\r\n }\r\n}\r\n\r\nListUsersPage.propTypes = {\r\n getUsers: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => ({\r\n canManageUsers: canManageUsers(state, props),\r\n canViewUsers: canViewUsers(state, props),\r\n}))(ListUsersPage);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Formik } from \"formik\";\r\nimport { BootstrapError, BootstrapField } from \"../../helpers/Field\";\r\nimport * as yup from 'yup';\r\nimport { toast } from 'react-toastify';\r\nimport moment from 'moment';\r\n\r\nlet schema = yup.object().shape({\r\n Login: yup.string().required(\"User Id is Required\"),\r\n FirstName: yup.string().required(\"First Name Required\"),\r\n LastName: yup.string().required(\"Last Name Required\"),\r\n Company: yup.string().required(\"Company Required\"),\r\n Email: yup.string().email().required(\"Email Required\"),\r\n password: yup.string(),\r\n Status: yup.string().required(\"Status Required\"),\r\n //userProfileId: yup.number().required(\"Profile Type Required\"),\r\n PrimaryAccountTypeId: yup.number().required(\"Primary Account Type Required\"),\r\n UserRole: yup.string().required(\"User Role Required\"),\r\n});\r\n\r\nclass ManageUserForm extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.onSubmit = this.onSubmit.bind(this);\r\n }\r\n\r\n\r\n onSubmit(values, bag) {\r\n bag.setSubmitting(true);\r\n this.props.save(values).then((user) => {\r\n // this.setState({user: user});\r\n toast.success(\"User Saved\", { position: toast.POSITION.TOP_RIGHT });\r\n bag.setSubmitting(false);\r\n }).catch(error => {\r\n if (error.response.data && error.response.data.Message) {\r\n toast.warn(error.response.data.Message, { position: toast.POSITION.TOP_RIGHT });\r\n bag.setSubmitting(false);\r\n }\r\n });\r\n }\r\n\r\n render() {\r\n const createdDate = this.props.user && this.props.user.CreatedDate ? moment(this.props.user.CreatedDate).format('MMM DD YYYY') : '';\r\n const lastLoginDate = this.props.user && this.props.user.LastLoginDate ? moment(this.props.user.LastLoginDate).format('MMM DD, YYYY') : '';\r\n const lastPasswordChange = this.props.user && this.props.user.LastPasswordChange ? moment(this.props.user.LastPasswordChange).format('MM DD,') : '';\r\n if (this.props.primaryAccountTypes.length === 1) {\r\n this.props.user.primaryAccountTypeId = this.props.primaryAccountTypes[0].primaryAccountTypeId;\r\n }\r\n return (\r\n \r\n
\r\n : null\r\n }\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n { /* TODO: not needed for schindler */ }\r\n {/**/}\r\n {/*
*/}\r\n */}\r\n {/**/}\r\n {/**/}\r\n {/**/}\r\n {/**/}\r\n {/*
*/}\r\n {/*\r\n {this.props.canManageUsers && \r\n \r\n }\r\n
\r\n \r\n {this.state.users ? this.state.userCount : '0'} Users\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nRegistrationRequestDetails.propTypes = {\r\n request: PropTypes.object.isRequired, \r\n};\r\n\r\nexport default RegistrationRequestDetails;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport ManageUserForm from \"./ManageUserForm\";\r\nimport {\r\n deleteUser,\r\n deleteUserSapAccount,\r\n getExclusionList,\r\n getUserSapAccounts,\r\n saveUser,\r\n updateExclusionList\r\n} from \"../../requests/UserRequests\";\r\nimport PropTypes from 'prop-types';\r\nimport LinkedSapAccounts from \"./LinkedSapAccounts\";\r\nimport { Link, withRouter } from 'react-router-dom';\r\nimport RegistrationRequestDetails from \"../settings-page/registration-requests/RegistrationRequestDetails\";\r\nimport { markRegistrationCompleted } from \"../../requests/RegistrationRequests\";\r\nimport ExclusionList from \"./exclusions/ExclusionList\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faAngleLeft } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { Modal } from \"react-bootstrap\";\r\n\r\nexport class ManageUserPage extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n user: {\r\n login: \"\",\r\n firstName: \"\",\r\n lastName: \"\",\r\n company: \"\",\r\n email: \"\",\r\n status: \"active\",\r\n //userProfileId: \"\",\r\n createdDate: \"\",\r\n lastLoginDate: \"\",\r\n numLogins: \"\",\r\n lastPasswordChange: \"\",\r\n primaryAcctType: \"\",\r\n userRole: \"\",\r\n },\r\n request: null,\r\n show: false,\r\n };\r\n this.saveUser = this.saveUser.bind(this);\r\n this.deleteUser = this.deleteUser.bind(this);\r\n this.handleClose = this.handleClose.bind(this);\r\n this.handleShow = this.handleShow.bind(this);\r\n }\r\n\r\n\r\n handleClose = () => this.setState({ show: false });\r\n handleShow = () => this.setState({ show: true });\r\n\r\n componentDidMount() {\r\n this.loadUser();\r\n if (this.props.fromRequest) {\r\n this.props.getRegistrationRequest(this.props.fromRequest).then((request) => {\r\n this.setState({\r\n request: request,\r\n user: {\r\n ...this.state.user,\r\n firstName: request.firstName,\r\n lastName: request.lastName,\r\n company: request.company,\r\n email: request.email,\r\n }\r\n });\r\n });\r\n }\r\n }\r\n\r\n loadUser() {\r\n if (this.props.getUser) {\r\n this.props.getUser().then((user) => {\r\n this.setState({ user: user });\r\n return user;\r\n })\r\n }\r\n }\r\n\r\n deleteUser() {\r\n deleteUser(this.state.user.UserId).then(() => {\r\n this.props.history.push(\"/settings/users\");\r\n })\r\n }\r\n\r\n saveUser(form) {\r\n return saveUser(form).then((user) => {\r\n if (this.state.request) {\r\n markRegistrationCompleted(this.state.request.registrationRequestId);\r\n }\r\n this.setState({ user: user });\r\n });\r\n }\r\n\r\n render() {\r\n const firstName = this.state.user && this.state.user.FirstName ? this.state.user.FirstName : '';\r\n const lastName = this.state.user && this.state.user.LastName ? this.state.user.LastName : '';\r\n //return (\r\n // \r\n
\r\n \r\n Name: {props.request.firstName} {props.request.lastName}\r\n
\r\n \r\n Company: {props.request.company}\r\n
\r\n \r\n Email: {props.request.email}\r\n
\r\n \r\n Message: {props.request.message}\r\n
\r\n \r\n // \r\n //
\r\n\r\n // \r\n //
\r\n // \r\n //
\r\n // \r\n // \r\n // ×\r\n // \r\n //
\r\n // \r\n // Confirm Deletion\r\n //
\r\n //\r\n // Are you sure you want to delete this use? This can not be undone.\r\n //
\r\n // \r\n // \r\n // \r\n // Cancel\r\n // \r\n //
\r\n // \r\n //
\r\n // {this.state.request && \r\n // \r\n //
\r\n // \r\n // {`${firstName}${' '}${lastName}`}\r\n //
\r\n // \r\n //
}\r\n // \r\n //
\r\n // \r\n //
\r\n // \r\n //
\r\n\r\n // {this.state.user && this.state.user.Accounts && \r\n //
\r\n // \r\n // {this.state.user &&
\r\n // \r\n //
\r\n // }\r\n\r\n // {this.state.user && this.state.user.PrimaryAccountTypeId === 3 && \r\n //
\r\n // \r\n //
\r\n // }\r\n // \r\n //
\r\n // \r\n //
\r\n // \r\n //);\r\n\r\n return (\r\n \r\n // \r\n //
\r\n // \r\n \r\n \r\n {\"Confirm Deletion\"} \r\n \r\n {\"Are you sure you want to delete this use? This can not be undone.\"} \r\n \r\n \r\n \r\n Cancel\r\n \r\n \r\n \r\n
\r\n );\r\n\r\n\r\n }\r\n}\r\n\r\nfunction mapStateToProps(state) {\r\n return {\r\n accountTypes: state.default.accountTypes,\r\n primaryAccountTypes: state.default.primaryAccountTypes,\r\n };\r\n}\r\n\r\nManageUserPage.propTypes = {\r\n getUser: PropTypes.func,\r\n getRegistrationRequest: PropTypes.func,\r\n fromRequest: PropTypes.string,\r\n};\r\n\r\nexport default withRouter(connect(\r\n mapStateToProps,\r\n)(ManageUserPage));\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {BootstrapTable, TableHeaderColumn} from \"react-bootstrap-table\";\r\nimport {Link} from \"react-router-dom\";\r\n\r\nfunction nameColumn(cell, row) {\r\n return `${row.firstName} ${row.lastName}`;\r\n}\r\n\r\nclass RegistrationRequestList extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.renderActionButton = this.renderActionButton.bind(this);\r\n }\r\n\r\n renderActionButton(val, row) {\r\n return Create User\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n {this.state.request && \r\n \r\n \r\n {\"Back To Users\"}\r\n \r\n
\r\n \r\n Edit User\r\n
\r\n \r\n
}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n {this.state.user && this.state.user.Accounts && \r\n
\r\n \r\n {this.state.user &&
\r\n \r\n
\r\n }\r\n\r\n {this.state.user && this.state.user.PrimaryAccountTypeId === 3 && \r\n
\r\n \r\n
\r\n }\r\n \r\n
\r\n \r\n
\r\n \r\n {\r\n
\r\n \r\n \r\n \r\n Name\r\n \r\n \r\n Company\r\n \r\n \r\n Email\r\n \r\n \r\n Message\r\n \r\n \r\n Email\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nRegistrationRequestList.propTypes = {\r\n requests: PropTypes.array.isRequired\r\n};\r\n\r\nexport default RegistrationRequestList;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport RegistrationRequestList from \"./RegistrationRequestList\";\r\nimport {canManageRegistrationRequests} from \"../../../PermissionSelectors\";\r\n\r\nclass RegistrationRequestsPage extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = { requests: [] };\r\n }\r\n\r\n componentDidMount() {\r\n this.props.getRequests().then(requests => {\r\n this.setState({ requests: requests });\r\n });\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {\r\n this.props.canAccess ?\r\n
\r\n );\r\n }\r\n}\r\n\r\nRegistrationRequestsPage.propTypes = {\r\n getRequests: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((state, props) => ({\r\n canAccess: canManageRegistrationRequests(state, props) \r\n}))(RegistrationRequestsPage);\r\n","import React, {Component} from 'react';\r\n\r\nclass JsonViewer extends Component {\r\n \r\n renderArray(arr, tab = 0){\r\n return arr.map(e => {\r\n return (\r\n
\r\n : null\r\n }\r\n \r\n
\r\n \r\n {this.renderProp(\"\", e, tab)}\r\n
)\r\n })\r\n } \r\n \r\n renderObject(json, tab = 0) {\r\n return Object.keys(json).map((p) => {\r\n return this.renderProp(p, json[p], tab);\r\n });\r\n }\r\n \r\n renderProp(key, val, tab = 0){\r\n let className = \"customizing-tab-\" + tab.toString();\r\n if(Array.isArray(val)){\r\n return (\r\n
);\r\n } else if((typeof val === \"object\")) {\r\n return ({this.renderName(key)}
\r\n {this.renderArray(val, tab + 1)}\r\n \r\n
);\r\n } else {\r\n return ({this.renderName(key)}
\r\n {this.renderObject(val, tab + 1)}\r\n {this.renderName(key)} - {val}
);\r\n }\r\n }\r\n \r\n renderName(string){\r\n let words = string.split('_');\r\n words = words.map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase());\r\n return words.join(' ');\r\n }\r\n \r\n render() {\r\n return (\r\n this.renderObject(this.props.json)\r\n );\r\n }\r\n}\r\n\r\nexport default JsonViewer;","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport JSONViewer from './JSONViewer';\r\n\r\nclass CustomizingPage extends Component {\r\n render() {\r\n const data = this.props.cnbsConfig;\r\n return (\r\n \r\n {/*
\r\n );\r\n }\r\n}\r\nexport default connect((store) => ({\r\n cnbsConfig: store.app.cnbsConfig,\r\n}))(CustomizingPage);","import React, { Component } from 'react';\r\nimport { BootstrapField, BootstrapError } from \"../../../helpers/Field\";\r\nimport * as yup from 'yup';\r\nimport { Formik } from \"formik\";\r\nimport { getConfiguration, smtpTest, updateConfiguration } from \"../../../requests/ConfigRequests\";\r\nimport CustomizingPage from \"../customizing/CustomizingPage\";\r\nimport { toast } from 'react-toastify';\r\nimport classNames from \"classnames\";\r\nimport { connect } from \"react-redux\";\r\n\r\nconst schema = yup.object().shape({\r\n CompanyName: yup.string().required(),\r\n ApplicationUrl: yup.string().required(),\r\n SmtpAddress: yup.string().required(),\r\n SmtpPort: yup.number().required(),\r\n SmtpUseUser: yup.boolean(),\r\n RegistrationRequestEmail: yup.string().email(),\r\n RegistrationRequestEmailContent: yup.string(),\r\n RegistrationRequestorEmailContent: yup.string(),\r\n WelcomeEmailContent: yup.string(),\r\n ResetPasswordEmailContent: yup.string(),\r\n EmailConfirmationContent: yup.string(),\r\n FromAddress: yup.string().email(),\r\n FromAddressName: yup.string(),\r\n ReceiptEmailBody: yup.string(),\r\n ReceiptEmailRow: yup.string(),\r\n ReceiptBcc: yup.string(),\r\n SmtpUser: yup.string().when('smtpUseUser', {\r\n is: true,\r\n then: yup.string().required(),\r\n }),\r\n SmtpPassword: yup.string().when('smtpUseUser', {\r\n is: true,\r\n then: yup.string().required(),\r\n }),\r\n CcvideoUrl: yup.string().required(),\r\n CcpdfUrl: yup.string().required(),\r\n EcvideoUrl: yup.string().required(),\r\n EcpdfUrl: yup.string().required(),\r\n});\r\n\r\nclass EditConfiguration extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n config: null,\r\n showConfiguration: false,\r\n testEmail: \"\",\r\n };\r\n this.showConfiguration = this.showConfiguration.bind(this);\r\n this.sendTestEmail = this.sendTestEmail.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n getConfiguration().then(config => this.setState({ config: config }));\r\n }\r\n\r\n showConfiguration() {\r\n if (this.state.showConfiguration) {\r\n this.setState({ showConfiguration: false });\r\n } else {\r\n this.setState({ showConfiguration: true });\r\n }\r\n }\r\n\r\n sendTestEmail(values) {\r\n let testEmail = prompt(\"Test Email\", this.state.testEmail);\r\n this.setState({\r\n ...this.state,\r\n testEmail: testEmail,\r\n });\r\n smtpTest({ ...values, testEmail: testEmail }).then((message) => {\r\n alert(message);\r\n });\r\n }\r\n\r\n render() {\r\n let sapStatusGood = this.props.sapConfig.statusCode === 200 && this.props.sapConfig.data.status.message_type === \"S\";\r\n\r\n\r\n return (\r\n \r\n {this.state.config && {\r\n bag.setSubmitting(true);\r\n console.log(\"values...\", values);\r\n updateConfiguration(values).then(() => {\r\n toast.success(\"Configuration Saved\", { position: toast.POSITION.TOP_RIGHT });\r\n bag.setSubmitting(false);\r\n })\r\n }}\r\n initialValues={this.state.config}\r\n render={props => } />}\r\n
\r\n\r\n );\r\n }\r\n}\r\n\r\nexport default connect((state, props) => {\r\n return {\r\n sapConfig: state.app.config.sap,\r\n }\r\n})(EditConfiguration);\r\n","import React, { Component } from 'react';\r\nimport { Route, Switch, NavLink } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport { getUser, getUserList } from \"../../requests/UserRequests\";\r\nimport { getRegistrationRequestById, getRegistrationRequests } from \"../../requests/RegistrationRequests\";\r\nimport ResetPassword from \"../resetpassword/ResetPassword\";\r\nimport AccountPaymentPage from \"../payment-methods/AccountPaymentPage\";\r\nimport ListUsersPage from \"../user-management/ListUsersPage\";\r\nimport ManageUserPage from \"../user-management/ManageUserPage\";\r\nimport RegistrationRequestsPage from \"./registration-requests/RegistrationRequestsPage\";\r\nimport EditConfiguration from './configuration/EditConfiguration';\r\nimport { getAccountTypes, getPrimaryAccountTypes } from \"../../requests/AccountTypeRequests\";\r\nimport {updateAccountTypes, updatePrimaryAccountTypes} from \"../../actions/InvoiceActions\";\r\nimport {\r\n canEditSystemConfig, canManagePaymentMethods,\r\n canManageRegistrationRequests,\r\n canManageUsers,\r\n canViewUsers\r\n} from \"../../PermissionSelectors\";\r\n\r\nclass SettingsPage extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n collapsed: true,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n getAccountTypes().then((accountTypes) => {\r\n updateAccountTypes(this.props.dispatch, accountTypes);\r\n });\r\n\r\n getPrimaryAccountTypes().then((accountTypes) => {\r\n updatePrimaryAccountTypes(this.props.dispatch, accountTypes);\r\n });\r\n }\r\n\r\n navBarToggleClick = () => {\r\n this.setState({ collapsed: !this.state.collapsed });\r\n };\r\n\r\n render() {\r\n let collapsedClass = `${'collapse navbar-collapse webar-navbar-collapse'}`;\r\n\r\n if (!this.state.collapsed) {\r\n collapsedClass = 'navbar-collapse webar-navbar-collapse';\r\n }\r\n return \r\n \r\n
\r\n }\r\n}\r\n\r\nexport default connect((state, props) => ({\r\n canEditSystemConfig: canEditSystemConfig(state, props),\r\n canManagePaymentMethods: canManagePaymentMethods(state, props),\r\n canManageRegistrationRequests: canManageRegistrationRequests(state, props),\r\n canManageUsers: canManageUsers(state, props),\r\n canViewUsers: canViewUsers(state, props),\r\n}))(SettingsPage);\r\n","import * as React from \"react\";\r\n\r\nexport default class PaymentStatusErrorBoundary extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = { hasError: false };\r\n }\r\n\r\n static getDerivedStateFromError(error) {\r\n // Update state so the next render will show the fallback UI.\r\n return { hasError: true };\r\n }\r\n\r\n componentDidCatch(error, info) {\r\n // You can also log the error to an error reporting service\r\n }\r\n\r\n render() {\r\n if (this.state.hasError) {\r\n // You can render any custom fallback UI\r\n return \r\n \r\n {/* Order matters here! */}\r\n {this.props.canManageUsers && }/>}\r\n {this.props.canManageUsers && }/>}\r\n {this.props.canViewUsers &&\r\n }/>}\r\n {this.props.canManageRegistrationRequests && }/>}\r\n {this.props.canEditSystemConfig && }\r\n \r\n \r\n
\r\n There was an error showing you the payment status page. Your payment may have still processed.
\r\n
\r\n )\r\n }/>}\r\n \r\n {\r\n bag.setSubmitting(true);\r\n this.props.completeRegistration(this.props.inviteId, values.password, values.confirmPassword).then(response => {\r\n bag.setSubmitting(false);\r\n this.setState({complete: true});\r\n });\r\n }}\r\n render={(props) =>\r\n \r\n }\r\n />\r\n
\r\n );\r\n }\r\n}\r\n\r\nRegister.propTypes = {\r\n completeRegistration: PropTypes.func.isRequired,\r\n inviteId: PropTypes.string.isRequired,\r\n};\r\n\r\nexport default Register;\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport Register from \"./Register\";\r\nimport {completeRegistration} from \"../../requests/UserRequests\";\r\n\r\nclass RegisterPage extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n userNotFound: false,\r\n user: null\r\n }\r\n }\r\n\r\n\r\n componentDidMount() {\r\n this.props.getUserByInvite(this.props.invite).then((user) => {\r\n this.setState({user: user});\r\n }).catch(() => {\r\n this.setState({userNotFound: true});\r\n });\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nRegisterPage.propTypes = {\r\n getUserByInvite: PropTypes.func.isRequired,\r\n invite: PropTypes.string.isRequired,\r\n};\r\n\r\nexport default RegisterPage;\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {Formik} from \"formik\";\r\nimport {BootstrapError, BootstrapField} from \"../../helpers/Field\";\r\nimport * as yup from 'yup';\r\n\r\nconst schema = yup.object().shape({\r\n email: yup.string().email().required(\"Email is required.\"),\r\n firstName: yup.string().required(\"First Name Required.\"),\r\n lastName: yup.string().required(\"Last Name Required.\"),\r\n company: yup.string().required(\"Company Required.\"),\r\n message: yup.string().required(\"Message Required.\"),\r\n});\r\n\r\nclass RegistrationRequestForm extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n requestComplete: false,\r\n errorMessage: null,\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n {this.state.user && }\r\n {this.state.userNotFound &&
\r\n \r\n
}\r\n Invalid invite token.
\r\n\r\n {!this.state.requestComplete && {\r\n this.props.submit(props).then(() => {\r\n this.setState({requestComplete: true});\r\n });\r\n }}\r\n render={props =>\r\n \r\n \r\n }\r\n
\r\n );\r\n }\r\n}\r\n\r\nRegistrationRequestForm.propTypes = {\r\n // submit: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default RegistrationRequestForm;\r\n","import React, {Component} from 'react';\r\nimport RegistrationRequestForm from \"./RegistrationRequestForm\";\r\nimport {submitRegistration} from \"../../requests/RegistrationRequests\";\r\nimport {Link} from \"react-router-dom\";\r\n\r\nclass RegistrationRequestPage extends Component {\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n }/>}\r\n {this.state.requestComplete && \r\n
\r\n \r\n \r\n Thanks for submitting a registration request. We will get back with your shortly.\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nRegistrationRequestPage.propTypes = {};\r\n\r\nexport default RegistrationRequestPage;\r\n","import {withRouter} from \"react-router-dom\";\r\nimport React from \"react\";\r\nimport {Logout} from \"../actions/UserActions\";\r\nimport {connect} from \"react-redux\";\r\n\r\nfunction BackToLogin(props) {\r\n return (\r\n {\r\n e.preventDefault();\r\n Logout(props.dispatch).then(() => {\r\n props.history.replace('/login'); \r\n })\r\n }}>Go back to login page.\r\n );\r\n}\r\n\r\nexport default withRouter(connect()(BackToLogin));","/* eslint-env browser */\r\n/* eslint-disable no-console */\r\nimport React from 'react';\r\nimport Logo from \"../Logo\";\r\nimport {Link} from \"react-router-dom\";\r\n\r\nexport default function SimpleHeader(props) {\r\n return (\r\n \r\n );\r\n}\r\n\r\n\r\n","import React, {Component} from 'react';\r\nimport {BootstrapField, BootstrapError} from \"../../helpers/Field\";\r\nimport * as yup from 'yup';\r\nimport {Formik} from \"formik\";\r\nimport {passwordResetRequest} from \"../../requests/UserRequests\";\r\nimport BackToLogin from \"../BackToLogin\";\r\nimport SimpleHeader from \"../header/SimpleHeader\";\r\nimport Footer from \"../footer/Footer\";\r\n\r\nclass ResetPasswordPage extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n message: null,\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Go To Login\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {!this.state.message && \r\n \r\n }\r\n
\r\n \r\n {\r\n passwordResetRequest(values).then((message) => {\r\n this.setState({message});\r\n })\r\n }}\r\n render={props =>\r\n \r\n }/>\r\n
\r\n }\r\n {this.state.message && \r\n {this.state.message}\r\n
\r\n \r\n
\r\n \r\n {\r\n bag.setSubmitting(true);\r\n this.props.onSubmit(this.props.id, values.password, values.confirmPassword).then(response => {\r\n bag.setSubmitting(false);\r\n this.setState({complete: true});\r\n });\r\n }}\r\n render={(props) =>\r\n \r\n }\r\n />\r\n
\r\n );\r\n }\r\n}\r\n\r\nResetPasswordFinishForm.propTypes = {\r\n onSubmit: PropTypes.func.isRequired,\r\n id: PropTypes.string.isRequired,\r\n};\r\n\r\nexport default ResetPasswordFinishForm;\r\n","import React, {Component} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {completePasswordReset} from \"../../requests/UserRequests\";\r\nimport ResetPasswordFinishForm from \"./ResetPasswordFinishForm\";\r\nimport SimpleHeader from \"../header/SimpleHeader\";\r\nimport Footer from \"../footer/Footer\";\r\n\r\nclass ResetPasswordFinishPage extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n userNotFound: false,\r\n user: null\r\n }\r\n }\r\n\r\n\r\n componentDidMount() {\r\n this.props.getUserByPasswordReset(this.props.passwordReset).then((user) => {\r\n this.setState({user: user});\r\n }).catch(() => {\r\n this.setState({userNotFound: true});\r\n });\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {this.state.user &&\r\n }\r\n {this.state.userNotFound &&
\r\n \r\n
}\r\n Invalid reset url.
\r\n\r\n {\r\n registerUser(formProps).then((response) => {\r\n sessionStorage.setItem('token', response.token);\r\n sessionStorage.setItem('refreshToken', response.refreshToken);\r\n axios.instance.defaults.headers.common['Authorization'] = `Bearer ${response.token}`;\r\n updateState(props.dispatch, types.SET_IS_LOGGED_IN, true);\r\n \r\n if (response.user.isConfirmed) {\r\n props.history.push(\"/invoices\"); \r\n } else {\r\n props.history.push(\"/auto-register/confirm-instructions\")\r\n }\r\n }).catch(error => {\r\n setErrorMessage(error.response.data.Message);\r\n toast.error(error.response.data.Message, { position: toast.POSITION.TOP_RIGHT });\r\n });\r\n }}\r\n render={props =>\r\n
\r\n );\r\n}\r\n\r\nRegistrationRequestForm.propTypes = {\r\n submit: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default withRouter(connect()(RegistrationRequestForm));\r\n","import React, {PropTypes} from 'react';\r\nimport {\r\n injectIntl,\r\n IntlProvider,\r\n FormattedRelative,\r\n} from 'react-intl';\r\n\r\nexport default injectIntl(({intl}) => {\r\n document.title = intl.formatMessage({id: \"title\"});\r\n return null;\r\n});\r\n","import React, {Component, useContext, useState} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport * as yup from 'yup';\r\nimport {InvoicesContext} from \"../../invoice/InvoiceDataManager\";\r\n\r\nconst schema = yup.object().shape({\r\n invoiceNumber: yup.string().required(\"Invoice number is required.\"),\r\n invoiceAmount: yup.number().required(\"Invoice amount is required.\"),\r\n accountNumber: yup.string().required(\"Billing ID is required.\"),\r\n});\r\n\r\nfunction AutoLinkAccountSuccess(props) {\r\n let address = \"1234 Road Road\";\r\n\r\n if(props.invoice) {\r\n let invoice = props.invoice;\r\n let partner = invoice.partner_data.find(_ => _.partner_function === \"RG\");\r\n let address = partner.address_data;\r\n return (\r\n \r\n \r\n
\r\n }/>\r\n \r\n
\r\n );\r\n } else {\r\n return null;\r\n }\r\n}\r\n\r\nAutoLinkAccountSuccess.propTypes = {\r\n invoice: PropTypes.object,\r\n onClear: PropTypes.func,\r\n};\r\n\r\nexport default AutoLinkAccountSuccess;\r\n","import React, {Component, useContext, useState} from 'react';\r\nimport * as yup from 'yup';\r\nimport {InvoicesContext} from \"../../invoice/InvoiceDataManager\";\r\n\r\nconst schema = yup.object().shape({\r\n invoiceNumber: yup.string().required(\"Invoice number is required.\"),\r\n invoiceAmount: yup.number().required(\"Invoice amount is required.\"),\r\n accountNumber: yup.string().required(\"Billing ID is required.\"),\r\n});\r\n\r\nfunction AutoLinkAccountForm(props) {\r\n let [requestComplete, setRequestComplete] = useState(false);\r\n const invoicesContext = useContext(InvoicesContext);\r\n\r\n return (\r\n \r\n
\r\n \r\n Success\r\n
\r\n \r\n {address.name}
\r\n {address.street}
\r\n {address.city}, {address.state} {address.zip} {address.country}
\r\n
\r\n
\r\n );\r\n}\r\n\r\nexport default AutoLinkAccountForm;\r\n","import React, {Component, useContext, useState} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {Formik} from \"formik\";\r\nimport {BootstrapError, BootstrapField} from \"../../../helpers/Field\";\r\nimport * as yup from 'yup';\r\nimport {InvoicesContext} from \"../../invoice/InvoiceDataManager\";\r\nimport {validateAccount} from \"../../../requests/UserRequests\";\r\n\r\nconst schema = yup.object().shape({\r\n invoiceNumber: yup.string().required(\"Invoice number is required.\"),\r\n invoiceAmount: yup.number().typeError(\"Invoice amount is required. Numeric values only.\").required(\"Invoice amount is required. Numeric values only.\"),\r\n accountNumber: yup.string().required(\"Billing ID is required.\"),\r\n});\r\n\r\nfunction AutoLinkAccountForm(props) {\r\n let [requestComplete, setRequestComplete] = useState(false);\r\n const invoicesContext = useContext(InvoicesContext);\r\n \r\n return (\r\n \r\n
\r\n \r\n
\r\n Error - {props.message}
\r\n \r\n\r\n {!requestComplete && {\r\n validateAccount(formProps).then(response => {\r\n props.onSuccess(response.Invoice);\r\n }).catch((error) => {\r\n if(error.response.status === 404){\r\n props.onError(\"We could not find an account from the given details.\") \r\n } else {\r\n if(error.response.data.key === \"duplicate\"){\r\n props.onError(\"You've already added this account.\") \r\n } else {\r\n props.onError(\"Too many failed attempts. Try again later.\") \r\n }\r\n }\r\n });\r\n }}\r\n render={formProps =>\r\n \r\n \r\n }\r\n
\r\n );\r\n}\r\nAutoLinkAccountForm.propTypes = {\r\n onSuccess: PropTypes.func.isRequired,\r\n onError: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default AutoLinkAccountForm;\r\n","import React, {Component, useContext, useState} from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {Formik} from \"formik\";\r\nimport {BootstrapError, BootstrapField} from \"../../../helpers/Field\";\r\nimport * as yup from 'yup';\r\nimport {InvoicesContext} from \"../../invoice/InvoiceDataManager\";\r\nimport {validateAccount} from \"../../../requests/UserRequests\";\r\nimport AutoLinkAccountSuccess from \"./AutoLinkAccountSuccess\";\r\nimport AutoLinkAccountError from \"./AutoLinkAccountError\";\r\nimport AutoLinkAccountForm from \"./AutoLinkAccountForm\";\r\n\r\n\r\n\r\nfunction AutoLinkAccount(props) {\r\n let [status, setStatus] = useState(\"form\");\r\n let [invoice, setInvoice] = useState(null);\r\n let [errorMessage, setErrorMessage] = useState(\"\");\r\n\r\n return (\r\n \r\n
\r\n }/>}\r\n {requestComplete && To setup an account you will need an invoice number, invoice amount, and your billing ID.
\r\n \r\n\r\n
\r\n \r\n \r\n Thanks for submitting a registration request. We will get back with your shortly.\r\n
\r\n \r\n {status === \"success\" && {\r\n setStatus(\"form\");\r\n setInvoice(null);\r\n }}/>}\r\n {status === \"error\" && {\r\n setStatus(\"form\");\r\n setInvoice(null);\r\n }} message={errorMessage}/>}\r\n {status === \"form\" && {\r\n setStatus(\"success\");\r\n setInvoice(invoice.detail);\r\n props.onAccountAdded();\r\n }}\r\n onError={(message) => {\r\n setStatus(\"error\");\r\n setErrorMessage(message);\r\n }}\r\n />\r\n }\r\n
\r\n );\r\n}\r\nAutoLinkAccount.propTypes = {\r\n onAccountAdded: PropTypes.func,\r\n};\r\n\r\nexport default AutoLinkAccount;\r\n","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport RegisterForm from \"./RegisterForm\";\r\nimport AutoLinkAccount from \"./AutoLinkAccount\";\r\nimport AutoLinkAccountSuccess from \"./AutoLinkAccountSuccess\";\r\nimport AutoLinkAccountError from \"./AutoLinkAccountError\";\r\nimport Footer from \"../../footer/Footer\";\r\nimport SimpleHeader from \"../../header/SimpleHeader\";\r\nimport {Link} from \"react-router-dom\";\r\nimport BackToLogin from \"../../BackToLogin\";\r\n\r\nfunction mapStateToProps(state) {\r\n return {};\r\n}\r\n\r\nclass AutoRegisterPage extends Component {\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n You should receive a confirmation email shortly.\r\n
\r\n\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default withRouter(connect(\r\n mapStateToProps,\r\n)(AutoRegisterConfirm));","import React, {Component} from 'react';\r\nimport {connect} from 'react-redux';\r\nimport {Redirect} from 'react-router-dom';\r\nimport {getUser} from \"../actions/UserActions\";\r\n\r\nexport class BasePage extends Component {\r\n\r\n componentDidMount() {\r\n getUser(this.props.dispatch);\r\n }\r\n\r\n render() {\r\n return \r\n
\r\n \r\n (
\r\n \r\n
)}\r\n catch={() => (\r\n
\r\n \r\n
\r\n Successfully confirmed your account.
\r\n Continue to Login\r\n\r\n
)\r\n }\r\n wait={() => ()}\r\n />\r\n \r\n
\r\n \r\n
\r\n Could not validate account.
\r\n {/*Resend Confirmation.*/}\r\n\r\n
\r\n\r\n \r\n \r\n
\r\n \r\n {accounts.length < 4 &&
\r\n \r\n
\r\n }\r\n You have reached the max number of accounts.
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n Accounts
\r\n {accounts.length === 0 &&You have not added an account yet.
\r\n }\r\n\r\n- \r\n {accounts.map(a => {\r\n console.log(\"accounts.length..\", accounts.length);\r\n let partner = a.InvoiceDetail.partner_data.find(_ => _.partner_function === \"RG\");\r\n let address = partner.address_data;\r\n return (
\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n You have not confirmed your account yet.\r\n
\r\n \r\n\r\n
\r\n \r\n
);\r\n}\r\n\r\nexport default connect()(SystemError);\r\n\r\n","import * as React from \"react\";\r\n\r\nexport default class SiteErrorBoundary extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = { hasError: false };\r\n }\r\n\r\n static getDerivedStateFromError(error) {\r\n // Update state so the next render will show the fallback UI.\r\n return { hasError: true };\r\n }\r\n\r\n componentDidCatch(error, info) {\r\n // You can also log the error to an error reporting service\r\n }\r\n\r\n render() {\r\n if (this.state.hasError) {\r\n return \r\n
\r\n \r\n There was an error with the system.
\r\n
\r\n There was an error with the system.
Please try again later.
\r\n Something is wrong with the site. Please try again later.
\r\n 0} size={50} className=\"centered\"/>\r\n {\r\n this.props.loginChecked &&\r\n \r\n \r\n \r\n \r\n }/>\r\n \r\n \r\n \r\n \r\n \r\n \r\n }/>\r\n \r\n \r\n \r\n \r\n \r\n \r\n }\r\n
\r\n