\r\n \r\n
\r\n {isDropdownOpen && isSidebarExpanded ? (\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 Dashboard\r\n
\r\n \r\n \r\n
\r\n\r\n \r\n
\r\n \r\n Reports\r\n
\r\n \r\n SoW Extension Forecast\r\n
\r\n \r\n \r\n Bench Summary\r\n
\r\n \r\n \r\n Workforce\r\n
\r\n \r\n \r\n Bench\r\n
\r\n \r\n {hasFinancialAccess && \r\n Projected Revenue\r\n
\r\n }\r\n {admin && (\r\n \r\n Audit\r\n
\r\n \r\n )}\r\n {hasFinancialAccess && \r\n Accounting\r\n
\r\n }\r\n {hasFinancialAccess && \r\n Client Rates\r\n
\r\n }\r\n {hasFinancialAccess && \r\n Team Composition\r\n
\r\n }\r\n \r\n \r\n Trainings\r\n
\r\n \r\n \r\n \r\n Background Checks\r\n
\r\n \r\n \r\n \r\n Certifications\r\n
\r\n \r\n \r\n ) : null}\r\n \r\n
\r\n \r\n Offices\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n Employees\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n Clients\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n Projects\r\n
\r\n \r\n \r\n {isShowBilling && \r\n
\r\n \r\n Billing\r\n
\r\n \r\n }\r\n \r\n
\r\n \r\n Contracts\r\n
\r\n \r\n \r\n {\r\n admin ? (\r\n \r\n
\r\n Admin\r\n\r\n \r\n
\r\n \r\n \r\n Admin\r\n
\r\n
\r\n \r\n Manage users\r\n
\r\n \r\n
\r\n \r\n Manage API tokens\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n Manage lookups\r\n
\r\n \r\n {isAdminDropdownOpen && isSidebarExpanded ? (\r\n <>\r\n \r\n Manage Job Titles\r\n
\r\n \r\n \r\n Manage Role Types\r\n
\r\n \r\n \r\n Manage Project Types\r\n
\r\n \r\n \r\n Manage Skills\r\n
\r\n \r\n \r\n Manage Business Trips\r\n
\r\n \r\n \r\n Manage Seniority Levels\r\n
\r\n \r\n \r\n Manage Skill Levels\r\n
\r\n \r\n \r\n Manage SoW Types\r\n
\r\n \r\n \r\n Manage Document Types\r\n
\r\n \r\n \r\n Manage Certificates\r\n
\r\n \r\n \r\n Manage Payment Terms\r\n
\r\n \r\n \r\n Manage Invoice Dates\r\n
\r\n \r\n\r\n \r\n Manage List of Trainings\r\n
\r\n \r\n\r\n \r\n Manage SoW Renewal Status\r\n
\r\n \r\n \r\n Manage Assignment Types\r\n
\r\n \r\n \r\n Manage Engagement Types\r\n
\r\n \r\n \r\n Manage BackFill Types\r\n
\r\n \r\n \r\n Manage Employee Types\r\n
\r\n \r\n \r\n ) : null}\r\n \r\n
\r\n \r\n Settings\r\n
\r\n \r\n \r\n \r\n ) : null\r\n }\r\n \r\n \r\n \r\n
\r\n {isSidebarExpanded ? `Version: ${version}` : null}\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default SidebarComponent;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport './notification.css';\r\n\r\nexport class Notification extends Component {\r\n render() {\r\n const {\r\n onClose, clear, items, deleteItem, getInfoForNotification,\r\n } = this.props;\r\n return (\r\n \r\n {isSidebarExpanded ? `Version: ${version}` : null}\r\n
\r\n
\r\n );\r\n }\r\n}\r\n\r\nNotification.propTypes = {\r\n onClose: PropTypes.func.isRequired,\r\n getInfoForNotification: PropTypes.func.isRequired,\r\n clear: PropTypes.func.isRequired,\r\n items: PropTypes.array.isRequired,\r\n deleteItem: PropTypes.func.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nexport class CustomMessage extends Component {\r\n render() {\r\n const { customFields } = this.props;\r\n return (\r\n \r\n
\r\n notifications
\r\n\r\n (\r\n \r\n )}\r\n renderTrackHorizontal={props => (\r\n \r\n )}\r\n renderThumbHorizontal={props => (\r\n \r\n )}\r\n >\r\n {items.length ? (\r\n items.map((item, i) => {\r\n const message = getInfoForNotification(item);\r\n return (\r\n
\r\n \r\n
\r\n );\r\n })\r\n ) : null}\r\n \r\n \r\n
\r\n {message.message}
\r\n {item.time}\r\n\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nconst getShortName = (name, onlyFirstLetter) => {\r\n if (!name || name.length === 0) {\r\n return '';\r\n }\r\n\r\n const firstLetter = name[0][0];\r\n const lastLetter = name[0][1];\r\n\r\n if (onlyFirstLetter) {\r\n return firstLetter;\r\n }\r\n\r\n if (name.length > 1) {\r\n const secondLetter = name[1][0];\r\n const isFullName = firstLetter + secondLetter;\r\n return isFullName;\r\n }\r\n const shortName = firstLetter + (lastLetter ? lastLetter : '');\r\n return shortName;\r\n};\r\n\r\nexport const Badge = ({\r\n color,\r\n item,\r\n onlyFirstLetter,\r\n}) => {\r\n const regExp = /\\s{2,}/;\r\n const replacedWord = item.replace(regExp, ' ');\r\n const words = replacedWord.split(' ').filter((w) => w);\r\n return (\r\n {customFields.message}
\r\n\r\n {\r\n value && {value}\r\n }\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCheckbox.propTypes = {\r\n checked: PropTypes.bool,\r\n value: PropTypes.string,\r\n onClick: PropTypes.func,\r\n disabled: PropTypes.bool,\r\n};\r\n\r\nexport default Checkbox;\r\n","export const getColorFromString = (str) => {\r\n let num = 0, arr = str.split(''), c, hash;\r\n arr.forEach((a, i) => num = str.charCodeAt(i) + ((num << 5) - num));\r\n c = (num & 0x00FFFFFF).toString(16).toUpperCase();\r\n hash = '00000'.substring(0, 6 - c.length) + c;\r\n return '#' + hash;\r\n}","import * as React from 'react';\r\nimport classNames from 'classnames';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport { logout, changeViewFinancInfo } from 'common/actions/authActions';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport { Notification } from '../notification/notification';\r\nimport { clearNotify } from '../../actions/notificationsActions';\r\nimport Alert from 'react-s-alert';\r\nimport { CustomMessage } from '../notification/notification-message';\r\nimport { Badge } from 'common/components/badges/badges';\r\nimport Checkbox from 'common/components/form-items/checkbox/checkbox';\r\nimport { getColorFromString } from 'services/getColor';\r\nimport 'react-s-alert/dist/s-alert-default.css';\r\nimport './header.css';\r\n\r\nexport class HeaderComponent extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isUserMenuExpanded: false,\r\n isNotificationOpen: false,\r\n allNotifications: [],\r\n showFinancTogling: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const notifications = JSON.parse(sessionStorage.getItem('notifications'));\r\n if (notifications) {\r\n this.setState({\r\n allNotifications: notifications.notifications,\r\n });\r\n }\r\n this.isShowFinanceTogling();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { notify } = this.props;\r\n if (prevProps.notify !== notify) {\r\n const notifications = JSON.parse(sessionStorage.getItem('notifications'));\r\n this.setState({\r\n allNotifications: notifications.notifications,\r\n }, () => this.showAlert());\r\n }\r\n }\r\n\r\n isShowFinanceTogling = () => {\r\n const { HasFinancialAccess } = this.props;\r\n this.setState({\r\n showFinancTogling: HasFinancialAccess,\r\n });\r\n }\r\n\r\n showAlert = () => {\r\n const { allNotifications } = this.state;\r\n if (allNotifications.length) {\r\n const item = allNotifications[0];\r\n const alertMessage = this.getInfoForNotification(item);\r\n Alert.warning('custom', {\r\n timeout: 3000,\r\n offset: 0,\r\n customFields: {\r\n ...alertMessage,\r\n },\r\n });\r\n }\r\n }\r\n\r\n getInfoForNotification = (item) => {\r\n const status = item.statusText ? 'Created' : 'error';\r\n const statusForRender = item.customText ? item.customText : item.statusText ? ' is created' : ' is not created';\r\n return {\r\n message: item.target + statusForRender,\r\n icon: item.target + '-' + status,\r\n };\r\n }\r\n\r\n deleteNotify = (e) => {\r\n const target = +e.currentTarget.attributes.getNamedItem('data-notification').value;\r\n const { allNotifications } = this.state;\r\n const filteredNotify = allNotifications.filter((item, i) => i !== target && item);\r\n this.setState({\r\n allNotifications: filteredNotify,\r\n });\r\n sessionStorage.setItem('notifications', JSON.stringify({ notifications: filteredNotify }));\r\n }\r\n\r\n expandUserMenu = () => {\r\n const { isUserMenuExpanded } = this.state;\r\n this.setState({\r\n isUserMenuExpanded: !isUserMenuExpanded,\r\n });\r\n }\r\n\r\n collapseUserMenu = () => {\r\n this.setState({\r\n isUserMenuExpanded: false,\r\n });\r\n }\r\n\r\n toogleNotification = () => {\r\n const { isNotificationOpen } = this.state;\r\n this.setState({\r\n isNotificationOpen: !isNotificationOpen,\r\n });\r\n }\r\n\r\n clearNotifications = () => {\r\n const { clearNotify } = this.props;\r\n sessionStorage.setItem('notifications', JSON.stringify({ notifications: [] }));\r\n this.setState({\r\n allNotifications: [],\r\n });\r\n clearNotify();\r\n }\r\n\r\n changeFinacncialInfo = () => {\r\n const { changeViewFinancInfo, permissions } = this.props;\r\n changeViewFinancInfo(!permissions.HasFinancialAccess);\r\n }\r\n\r\n renderReturnButton = ({ text, goToPreviousPage }) => {\r\n return (\r\n \r\n
);\r\n }\r\n\r\n render() {\r\n const {\r\n user, logout, permissions, returnButton, secondReturnButton, title,\r\n } = this.props;\r\n const {\r\n isUserMenuExpanded, isNotificationOpen, allNotifications, showFinancTogling,\r\n } = this.state;\r\n return (\r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nHeaderComponent.propTypes = {\r\n user: PropTypes.object,\r\n logout: PropTypes.func,\r\n clearNotify: PropTypes.func.isRequired,\r\n notify: PropTypes.array.isRequired,\r\n};\r\n\r\nexport default connect(store => ({\r\n user: store.authReducer.user,\r\n notify: store.showRoles.notifications,\r\n permissions: store.authReducer.user && store.authReducer.user.Permissions,\r\n HasFinancialAccess: store.authReducer.HasFinancialAccess,\r\n title: store.headerReducer.title,\r\n returnButton: store.headerReducer.returnButton,\r\n secondReturnButton: store.headerReducer.secondReturnButton,\r\n}), {\r\n logout,\r\n clearNotify,\r\n changeViewFinancInfo,\r\n})(HeaderComponent);\r\n","import moment from 'moment';\r\n\r\nexport const compare = (a, b, direction, isNullItsMax) => {\r\n if (isNullItsMax) {\r\n if (!a) {\r\n return direction === 'Up' ? 1 : -1;\r\n }\r\n if (!b) {\r\n return direction === 'Up' ? -1 : 1;\r\n }\r\n return direction === 'Up' ? (\r\n a > b ? 1 : (b > a) ? -1 : 0\r\n ) : (\r\n a < b ? 1 : (b < a) ? -1 : 0\r\n );\r\n }\r\n\r\n if (!a) {\r\n return direction === 'Up' ? -1 : 1;\r\n }\r\n if (!b) {\r\n return direction === 'Up' ? 1 : -1;\r\n }\r\n return direction === 'Up' ? (\r\n a > b ? 1 : (b > a) ? -1 : 0\r\n ) : (\r\n a < b ? 1 : (b < a) ? -1 : 0\r\n );\r\n};\r\n\r\nexport const sortEmployeeSkillLevelByAlphabet = (a, b) => {\r\n if (a.Level.Name > b.Level.Name) {\r\n return 1;\r\n }\r\n if (a.Level.Name < b.Level.Name) {\r\n return -1;\r\n }\r\n return 0;\r\n};\r\n\r\nconst getTypeFromData = (data) => {\r\n if (Array.isArray(data)) {\r\n return 'array';\r\n }\r\n const regex = /[\\d]{4}-[\\d]{2}-[\\d]{2}T[\\d]{2}:[\\d]{2}:[\\d]{2}/;\r\n if (regex.test(data)) {\r\n return 'date';\r\n }\r\n return typeof data;\r\n};\r\n\r\nconst sortItems = (column, direction) => {\r\n return (current, next) => {\r\n if (column === 'DaysToExpire') {\r\n return compare(current[column], next[column], direction, true);\r\n }\r\n if (column === 'ExpirationDate') {\r\n return compare(current[column], next[column], direction, true);\r\n }\r\n\r\n switch (getTypeFromData(current[column])) {\r\n case 'array': {\r\n return current[column]['Name']\r\n ? compare((current[column].map(i => i.Name)).join().toLowerCase(), (next[column].map(i => i.Name)).join().toLowerCase(), direction)\r\n : compare(current[column].join().toLowerCase(), next[column].join().toLowerCase(), direction);\r\n }\r\n case 'string':\r\n return compare(current[column] && current[column].toLowerCase(), next[column] && next[column].toLowerCase(), direction);\r\n case 'number':\r\n return compare(current[column], next[column], direction);\r\n case 'date':\r\n return compare(moment(current[column]).unix(), moment(next[column]).unix(), direction);\r\n case 'object':\r\n return compare(current[column] && current[column].Name, next[column] && next[column].Name, direction);\r\n default:\r\n break;\r\n }\r\n };\r\n};\r\n\r\nexport const sortProjectsForEmployee = (items, column, direction) => {\r\n return items.sort((current, next) => {\r\n const primaryComparison = current[column] && next[column] ? sortItems(column, direction)(current, next) : 0;\r\n if (primaryComparison === 0) {\r\n if (current.AssignmentStatus.Name === 'Active' && next.AssignmentStatus.Name === 'Active') {\r\n return current.PositionBillableStatus === 'Billable' ? -1 : 1;\r\n } else {\r\n return current.AssignmentStatus.Name === 'Active' ? -1 : 1;\r\n }\r\n } else {\r\n return primaryComparison;\r\n }\r\n });\r\n};\r\n\r\nexport const sortFilterList = (items, direction = 'Up') => {\r\n if (items) {\r\n if (items[0] && items[0].Name) {\r\n return items.sort((a, b) => compare(a.Name, b.Name, direction));\r\n }\r\n return items.sort((a, b) => compare(a, b, direction));\r\n }\r\n};\r\n\r\nexport const sortList = (items, column, direction) => {\r\n if (!items || !items[0]) {\r\n return [];\r\n }\r\n if (!column || !direction) {\r\n return items;\r\n }\r\n\r\n for (let i = 0; i < items.length; i++) {\r\n if (Array.isArray(items[i][column]) || moment(items[i][column], moment.ISO_8601, true).isValid()) {\r\n return Array.isArray(items[i][column]) ? items.sort(sortItems(column, direction, 'array')) : items.sort(sortItems(column, direction, 'date'));\r\n }\r\n }\r\n return items.sort(sortItems(column, direction, 'string'));\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nexport class CellCheckbox extends Component {\r\n onClickCheckbox = (e) => {\r\n const { onClickCheckbox, parentId } = this.props;\r\n onClickCheckbox(e.target.value, parentId);\r\n }\r\n\r\n render() {\r\n const {\r\n item,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {title ?
\r\n {{title}
: null}\r\n {returnButton ? this.renderReturnButton(returnButton) : null}\r\n {secondReturnButton ? this.renderReturnButton(secondReturnButton) : null}\r\n \r\n
\r\n \r\n {allNotifications.length ? (\r\n
\r\n \r\n
\r\n \r\n {user.UserName}\r\n
\r\n \r\n \r\n
\r\n \r\n {showFinancTogling &&
\r\n \r\n
}\r\n \r\n Log out\r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellCheckbox.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n};\r\n","import React from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\n\r\nconst useStyles = makeStyles(() => ({\r\n root: {\r\n width: '100%',\r\n },\r\n input: {\r\n display: 'none',\r\n },\r\n label: {\r\n width: '100%',\r\n cursor: 'pointer',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n },\r\n}));\r\n\r\nexport default ({\r\n title, onChange, children, id, disabled,\r\n}) => {\r\n const classes = useStyles();\r\n\r\n return (\r\n \r\n );\r\n};\r\n","/* eslint-disable prefer-destructuring */\r\nimport React, { Fragment, Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport classNames from 'classnames';\r\nimport './list-item.css';\r\nimport { Badge } from 'common/components/badges/badges';\r\nimport { List } from './list';\r\nimport { getColorFromString } from 'services/getColor';\r\nimport { DELETE_SPAN_REMOVE_ACCESS } from 'utils/const-variable';\r\nimport CustomIcon from '../icon/Icon';\r\nimport { ACTIVE, DATES_CROSSING_MESSAGE } from 'utils/const-variable';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { CellCheckbox } from './custom-cell/cell-checkbox';\r\nimport ImportContract from 'common/components/form-items/button-import-pdf/button-import-pdf';\r\n\r\nexport class ListItem extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showOptions: false,\r\n column: 'Name',\r\n sortDirection: 'Up',\r\n isNeedUpOptions: false,\r\n isOpenDropdown: {\r\n parent: {},\r\n },\r\n isOpenPOs: {},\r\n components: [],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n defaultOpenDropDown, idItem, highOrderConfig, hasEditableFields,\r\n } = this.props;\r\n if (defaultOpenDropDown) {\r\n this.onToggleDropdown(idItem);\r\n }\r\n highOrderConfig && this.renderHighOrderConfig();\r\n hasEditableFields\r\n && this.setState({\r\n isEditingMode: false,\r\n });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { highOrderConfig } = this.props;\r\n if (prevProps.highOrderConfig !== highOrderConfig) {\r\n highOrderConfig && this.renderHighOrderConfig();\r\n }\r\n }\r\n\r\n onToggleDropdown = (id) => {\r\n const { isOpenDropdown } = this.state;\r\n const { dropdownList } = this.props;\r\n const isOpenDrop = isOpenDropdown;\r\n if (isOpenDrop[id]) delete isOpenDrop[id];\r\n else isOpenDrop[id] = true;\r\n if (!dropdownList.deepestProperty) {\r\n if (isOpenDrop.parent[id]) delete isOpenDrop.parent[id];\r\n else isOpenDrop.parent[id] = true;\r\n }\r\n this.setState({ isOpenDropdown: isOpenDrop });\r\n };\r\n\r\n setSortSettings = (column, sortDirection) => {\r\n this.setState({\r\n column,\r\n sortDirection,\r\n });\r\n };\r\n\r\n toggleShowOptions = (optsObj, event) => {\r\n const { showOptions } = this.state;\r\n const { onItemClick, idItem } = this.props;\r\n\r\n if (optsObj.item === 'options') {\r\n const elementPositions = event.target.getBoundingClientRect();\r\n const windowHeight = document.documentElement.clientHeight;\r\n let minLimitToBottom = 0;\r\n\r\n if (optsObj.resultClass) {\r\n switch (optsObj.resultClass) {\r\n case 'c-list-item_push-options-up_low-middle':\r\n minLimitToBottom = 100;\r\n break;\r\n case 'c-list-item_push-options-up_middle':\r\n minLimitToBottom = 130;\r\n break;\r\n case 'c-list-item_push-options-up_high':\r\n minLimitToBottom = 180;\r\n break;\r\n case 'c-list-item_push-options-up_low':\r\n minLimitToBottom = 45;\r\n break;\r\n default:\r\n minLimitToBottom = 50;\r\n break;\r\n }\r\n }\r\n\r\n this.setState({\r\n showOptions: !showOptions,\r\n isNeedUpOptions: ((windowHeight - elementPositions.bottom) < minLimitToBottom),\r\n });\r\n event.stopPropagation();\r\n } else if (optsObj.item === 'dropdown') {\r\n event.stopPropagation();\r\n this.onToggleDropdown(idItem);\r\n } else {\r\n onItemClick && onItemClick(optsObj.item);\r\n }\r\n };\r\n\r\n hideOptions = () => {\r\n this.setState({\r\n showOptions: false,\r\n });\r\n };\r\n\r\n deleteItem =\r\n (\r\n onDeleteClick,\r\n showDeleteSpan,\r\n item,\r\n deleteConfig,\r\n isOnlyActive,\r\n parentDropdownId,\r\n dontUseDeleteConfig,\r\n parentId,\r\n ) => () => {\r\n const { getCustomUrlForDelete } = this.props;\r\n if (\r\n onDeleteClick\r\n && showDeleteSpan !== DELETE_SPAN_REMOVE_ACCESS\r\n && !dontUseDeleteConfig\r\n ) {\r\n return onDeleteClick({\r\n item,\r\n entityId: deleteConfig && deleteConfig.entityId,\r\n url:\r\n deleteConfig && deleteConfig.customUrl\r\n ? getCustomUrlForDelete(\r\n deleteConfig.deleteUrlData,\r\n item.Id,\r\n parentId,\r\n deleteConfig.projectId,\r\n )\r\n : deleteConfig && `${deleteConfig.deleteUrlData}${item.Id}`,\r\n searchUpdateSaga: deleteConfig && deleteConfig.searchUpdateSaga,\r\n isOnlyActive: !isOnlyActive,\r\n parentDropdownId,\r\n });\r\n }\r\n if (onDeleteClick) {\r\n return onDeleteClick(item.UserId || item.Id);\r\n }\r\n };\r\n\r\n editItem = (item, onEditClick, getFullEditItem, parentDropdownId) => () => {\r\n const { hasEditableFields } = this.props;\r\n if (hasEditableFields) {\r\n this.hideOptions();\r\n return this.toggleEditingMode();\r\n }\r\n if (onEditClick && getFullEditItem) {\r\n return onEditClick({\r\n item,\r\n parentDropdownId,\r\n });\r\n }\r\n onEditClick(item.Id || item.UserId || item.ItemId);\r\n };\r\n\r\n copyItem = (item, onCopyClick) => () => {\r\n onCopyClick(item);\r\n }\r\n\r\n saveEditedFields = () => {\r\n const { hasEditableFields, onEditClick, item } = this.props;\r\n hasEditableFields\r\n && onEditClick({\r\n Id: item.Id,\r\n });\r\n this.toggleEditingMode();\r\n };\r\n\r\n toggleEditingMode = () => {\r\n const { item, onEditingModeToggle } = this.props;\r\n const { isEditingMode, editingFields } = this.state;\r\n\r\n this.setState({\r\n isEditingMode: !isEditingMode,\r\n editingFields: isEditingMode ? null : editingFields,\r\n }, () => {\r\n onEditingModeToggle && onEditingModeToggle(!isEditingMode, item.Id);\r\n });\r\n };\r\n\r\n getDropdownItems = (items, idItem, withoutSort, props) => {\r\n const { column, sortDirection } = this.state;\r\n const { parentDropDown } = this.props;\r\n let result;\r\n let parentkey;\r\n if (parentDropDown) {\r\n parentkey = Object.keys(parentDropDown)[0];\r\n }\r\n if (!parentkey) {\r\n result = items.find((e, i) => i === idItem);\r\n } else {\r\n result = items[parentkey][idItem][props];\r\n }\r\n return withoutSort ? result : sortList(result, column, sortDirection);\r\n };\r\n\r\n renderListCell = (column, item, isNull) => {\r\n const {\r\n Id,\r\n isDate,\r\n isObject,\r\n isArray,\r\n isBool,\r\n isProjectsLenght,\r\n toFixed,\r\n isInnerComment,\r\n isString,\r\n isTrainingReport,\r\n isTrainingClient,\r\n isTrainingDate,\r\n isBackgroundCheck,\r\n } = column;\r\n if (isString) {\r\n return typeof item[Id] === 'number'\r\n ? item[Id].toString()\r\n : isNull\r\n ? null\r\n : '———';\r\n }\r\n if (toFixed) return item[Id].toFixed(2);\r\n if (isProjectsLenght) return item[Id].length;\r\n if (isDate) {\r\n if (isTrainingReport) {\r\n const [trainingsProperty, trainingId, fieldToDisplay] = Id.split('.');\r\n const training = item[trainingsProperty] && item[trainingsProperty].find(t => t.Training && t.Training.Id === trainingId);\r\n const dateOfPassing = training && (training[fieldToDisplay] && moment(training[fieldToDisplay]).format('MM/DD/YYYY')\r\n || training.IsNotApplicable && 'N/A');\r\n\r\n return (training && !training.IsOneTime && !training.IsOptional && training.PassedMoreThanYearAgo)\r\n // We pass isNull when want to receive value for title, to do not assign object to title, need this check\r\n // Without this check, when we will hover item, we will see [object Object]\r\n ? isNull\r\n ? dateOfPassing\r\n : {dateOfPassing}\r\n : dateOfPassing;\r\n }\r\n if (isBackgroundCheck) {\r\n return (item[Id] && moment(item[Id]).format('MM/DD/YYYY')) || 'N/A';\r\n }\r\n if (isTrainingDate) {\r\n return (item[Id] && moment(item[Id]).format('MM/DD/YYYY')) || item.IsNotApplicable && 'N/A';\r\n }\r\n return item[Id] && moment(item[Id]).format('MM/DD/YYYY');\r\n }\r\n if (isObject) {\r\n switch (Id) {\r\n case 'Lead': {\r\n const isLeadApplicable = item && item.IsLeadApplicable;\r\n return isLeadApplicable ? item[Id] && item[Id].Name : 'N/A';\r\n }\r\n case 'SecondInCommand': {\r\n const isSICApplicable = item && item.IsSecondInCommandApplicable;\r\n return isSICApplicable ? item[Id] && item[Id].Name : 'N/A';\r\n }\r\n case 'CertificationRequester': {\r\n return (item[Id] && item[Id].Name) || 'Unknown';\r\n }\r\n default: {\r\n return item[Id] && item[Id].Name;\r\n }\r\n }\r\n }\r\n if (item[Id] && isArray) {\r\n const formattedOutput = item[Id].map((item) => item.Name || item).join(', ');\r\n\r\n if (isTrainingClient) {\r\n return formattedOutput || 'Any';\r\n }\r\n\r\n return formattedOutput;\r\n }\r\n if (isBool) {\r\n return !!item[Id] ? 'Yes' : 'No';\r\n }\r\n if (isInnerComment) {\r\n return {item[Id]};\r\n }\r\n return !!item[Id]\r\n ? item[Id]\r\n : column.Name === 'Action'\r\n ? null\r\n : isNull\r\n ? null\r\n : '———';\r\n };\r\n\r\n getItemError = (item) => {\r\n const { timeLeft } = this.props;\r\n const isStatusesCrossing = typeof item.isStatusesCrossing === 'boolean' && item.isStatusesCrossing;\r\n const isDatesCrossing = typeof item.isDatesCrossing === 'boolean' && item.isDatesCrossing;\r\n const isRoleInvalid = typeof item.isRoleValid === 'boolean' && !item.isRoleValid;\r\n const itemError = isDatesCrossing\r\n || isStatusesCrossing\r\n || isRoleInvalid\r\n || item.WithOpenRole\r\n || item.UnderstaffedRoles\r\n || item.IsExpiring\r\n || item.ContractExpiration\r\n || item.RoleExpiration\r\n || item.EmployeeExpiration\r\n || item.UnderstaffedRole\r\n || item.ProjectExpiration\r\n || (moment(item.EndDate).diff(new Date(), 'day') < timeLeft\r\n && item.Status.Name === ACTIVE);\r\n return itemError;\r\n };\r\n\r\n renderCustomCell = (CustomCell, column) => {\r\n const { item, hasEditableFields, ...other } = this.props;\r\n const { isEditingMode } = this.state;\r\n return (\r\n \r\n
\r\n )}\r\n {(!!dropdownList\r\n && typeof items[idItem] !== 'undefined'\r\n && items[idItem].length\r\n && (!parentDropDown || !!components.length))\r\n || (dropdownList\r\n && parentkey\r\n && items[parentkey].length\r\n && typeof items[parentkey][idItem] !== 'undefined'\r\n && items[parentkey][idItem][dropdownList.deepestProperty].length)\r\n || (!!dropdownList && !!components.length) ? (\r\n dropdownListToggler\r\n ) : dropdownList ? (\r\n \r\n ) : null}\r\n {columnsToDisplay.map((column) => {\r\n const isCustomCell = !!(config && config[column.Id]);\r\n const isInvalidDate = isDatesCrossing && column.isDate;\r\n const removePositionBadge = item && item.TeamPosition && item.TeamPosition.Id === 0;\r\n return column.isSelected\r\n || typeof column.isSelected === 'undefined' ? (\r\n isCustomCell ? (\r\n this.renderCustomCell(config[column.Id].cell, column)\r\n ) : (\r\n \r\n {this.showImport(item, 'PO Extension') && (\r\n {\r\n this.itemStopPropagation(e);\r\n }}\r\n className='c-list-item__options-column__option'\r\n >\r\n
\r\n )}\r\n {this.showImport(item, 'PO') && (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n )\r\n )}\r\n \r\n {!!dropdownList\r\n && !!dropdownList.items.length\r\n && !!isOpenDropdown[idItem] && (\r\n \r\n {this.renderGroupArrows(column.Id)}\r\n
}\r\n );\r\n })\r\n );\r\n }\r\n}\r\n\r\nListColumns.propTypes = {\r\n columnsToDisplay: PropTypes.array.isRequired,\r\n viewFinancialInfo: PropTypes.bool,\r\n setSortSettings: PropTypes.func,\r\n sortColumnName: PropTypes.string,\r\n sortDirection: PropTypes.string,\r\n};\r\n","const isObjectNotEquals = (arr1, arr2) => {\r\n return JSON.stringify(arr1) !== JSON.stringify(arr2);\r\n};\r\n\r\nexport default isObjectNotEquals;\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport ListItem from './list-item';\r\nimport { NO_ITEMS_TITLE } from 'utils/const-variable';\r\nimport { ListColumns } from './list-columns';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport './list.css';\r\n\r\nexport class List extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showInsideComponent: false,\r\n dataForInsideComponent: [],\r\n };\r\n }\r\n\r\n shouldComponentUpdate(nextProps, nextState) {\r\n return (isObjectNotEquals(nextProps, this.props) || isObjectNotEquals(nextState, this.state));\r\n }\r\n\r\n toogleInsideComponent = () => {\r\n const { showInsideComponent } = this.state;\r\n this.setState({\r\n showInsideComponent: !showInsideComponent,\r\n });\r\n }\r\n\r\n getDataForInsideComponent = (data) => {\r\n this.setState({\r\n dataForInsideComponent: data,\r\n }, () => this.toogleInsideComponent());\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => () => {\r\n const { setSortSettings } = this.props;\r\n setSortSettings && setSortSettings(sortColumn, sortDirection);\r\n }\r\n\r\n render() {\r\n const {\r\n items,\r\n dropdownList,\r\n columnsToDisplay,\r\n sortColumnName,\r\n sortDirection,\r\n isInnerList,\r\n onItemClick,\r\n onEditClick,\r\n onDeleteClick,\r\n onAddClick,\r\n onCopyClick,\r\n editSpan,\r\n deleteSpan,\r\n hideHeader,\r\n hideDots,\r\n showCheckboxes,\r\n checkRole,\r\n parentId,\r\n deleteConfig,\r\n parentDropdownId,\r\n getFullEditItem,\r\n timeLeft,\r\n dontShowOptions,\r\n viewFinancialInfo,\r\n dontShowNoItemBlock,\r\n transition,\r\n isHaveRights,\r\n columnsHeaders,\r\n fixedHeader,\r\n config,\r\n hideAddNewEntity,\r\n hideEntityEdit,\r\n hideDeleteEntity,\r\n hideCopyEntity,\r\n defaultOpenDropDown,\r\n renderAdditionalComponent,\r\n parentDropDown,\r\n dontUseDeleteConfig,\r\n highOrderConfig,\r\n isSowOrPO,\r\n SOWExtensionOptions,\r\n renderCustomEntity,\r\n needToAddNewEntity,\r\n titleForAddingEntity,\r\n hasEditableFields,\r\n onRenderCustomEntityClick,\r\n isProjectedRevenueList,\r\n isAccountingList,\r\n generateInnerColumnsToDisplay,\r\n onClickCheckbox,\r\n getCustomUrlForDelete,\r\n onImportFile,\r\n headerWrapper,\r\n contentWrapper,\r\n onEditingModeToggle,\r\n checkIfItemIsDeletable,\r\n isIndividualDeletable = false,\r\n shouldUpdate = false,\r\n shiftOnEditClassName = '',\r\n } = this.props;\r\n\r\n const { showInsideComponent, dataForInsideComponent } = this.state;\r\n\r\n const DefaultWrapper = ((props) => props.children);\r\n const HeaderWrapper = headerWrapper || DefaultWrapper;\r\n const ContentWrapper = contentWrapper || DefaultWrapper;\r\n\r\n if (shouldUpdate) {\r\n this.forceUpdate();\r\n }\r\n\r\n return (\r\n \r\n {showInsideComponent ? renderAdditionalComponent(dataForInsideComponent, this.toogleInsideComponent) : null}\r\n \r\n {columnsHeaders &&
}\r\n \r\n {columnsHeaders.map((item, i) => {\r\n let headerWidth;\r\n columnsToDisplay.forEach(column => {\r\n if (column.connectedHeader && column.connectedHeader === item.Id) {\r\n return headerWidth = item.width;\r\n }\r\n return false;\r\n });\r\n const style = {\r\n width: `${headerWidth}px`,\r\n maxWidth: `${headerWidth}px`,\r\n };\r\n return (\r\n \r\n {item.Name}\r\n
\r\n );\r\n })}\r\n \r\n {items && items.length\r\n ? (\r\n !hideHeader && (\r\n
\r\n \r\n \r\n {showCheckboxes && }\r\n {!!dropdownList && }\r\n
\r\n )\r\n )\r\n : dontShowNoItemBlock ? null : \r\n Action\r\n
}\r\n {NO_ITEMS_TITLE}
}\r\n \r\n {\r\n items && !!items.length && items.map((item, i) => {\r\n let shadow = false;\r\n if (item.Role === 'Shadow') {\r\n shadow = true;\r\n }\r\n return (\r\n
\r\n \r\n \r\n this.container = e}\r\n >\r\n {\r\n options.map((option, i) => {\r\n const id = generateId();\r\n return (\r\n \r\n );\r\n })\r\n }\r\n
\r\n {\r\n selected && selected.length && clearValue ? (\r\n \r\n {\r\n title && (\r\n \r\n \r\n {fieldTitle}\r\n \r\n
\r\n {tabId ? \r\n {title}\r\n {\r\n isRequired && *\r\n }\r\n
\r\n )\r\n }\r\n \r\n
\r\n ) : null\r\n }\r\n \r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nMultiSelect.propTypes = {\r\n onChange: PropTypes.func,\r\n selected: PropTypes.array,\r\n className: PropTypes.string,\r\n title: PropTypes.string,\r\n options: PropTypes.array,\r\n placeholder: PropTypes.string,\r\n isRequired: PropTypes.bool,\r\n clearValue: PropTypes.func,\r\n name: PropTypes.string,\r\n};\r\n\r\nexport default MultiSelect;\r\n","import React from 'react';\r\nimport { withStyles } from '@material-ui/core/styles';\r\nimport Select from '@material-ui/core/Select';\r\n\r\nconst styles = () => ({\r\n root: {\r\n background: 'white',\r\n border: '1px solid #DFDFDF',\r\n boxSizing: 'border-box',\r\n },\r\n select: {\r\n paddingLeft: '14px',\r\n fontSize: '14px',\r\n color: 'rgba(75, 75, 75, 0.54)'\r\n }\r\n});\r\n\r\nconst StyledSelect = (props) => (\r\n \r\n);\r\n\r\nexport default withStyles(styles)(StyledSelect);\r\n","const isEmptyObject = (object) => {\r\n return object ? !Object.keys(object).length : false;\r\n};\r\n\r\nexport default isEmptyObject;\r\n","import React, { Component } from 'react';\r\nimport VirtualizedSelect from 'react-virtualized-select';\r\nimport 'react-virtualized-select/styles.css';\r\nimport './virtualized-select.css';\r\n\r\nexport default class VirtualSelect extends Component {\r\n onClick = (event) => {\r\n const elementPositions = event.target.getBoundingClientRect();\r\n const windowHeight = document.documentElement.clientHeight;\r\n const minLimitToBottom = 200;\r\n if (windowHeight - elementPositions.bottom < minLimitToBottom) {\r\n event.target.scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'nearest' });\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n options, value, onChange, onBlur, disabled, isRequired, id,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n ) : 'No options'\r\n }\r\n \r\n );\r\n\r\n return (\r\n // eslint-disable-next-line react/jsx-props-no-spreading\r\n \r\n {label}\r\n {\r\n isRequired && *\r\n }\r\n
\r\n : null}\r\n \r\n
\r\n ) : null\r\n }\r\n \r\n \r\n {title} \r\n \r\n {items}\r\n \r\n \r\n
\r\n ) : datepicker ? (\r\n \r\n
\r\n ) : textField ? (\r\n \r\n \r\n {title} \r\n \r\n {items}\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nFilterItemComponent.propTypes = {\r\n selectOption: PropTypes.func,\r\n title: PropTypes.string,\r\n id: PropTypes.string,\r\n itemList: PropTypes.array,\r\n multiSelect: PropTypes.bool,\r\n};\r\n\r\nexport default FilterItemComponent;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport CustomIcon from '../../icon/Icon';\r\nimport Button from '@material-ui/core/Button';\r\n\r\nexport class SearchField extends Component {\r\n constructor(props) {\r\n super(props);\r\n const { searchValue, location, searchValueInTabs } = this.props;\r\n const searchValueFromLocation = location && location.state && location.state.search;\r\n const childState = location && location.state && location.state.childState;\r\n this.state = {\r\n searchValue: searchValue || searchValueFromLocation || '',\r\n currentTab: '',\r\n searchValueInTabs: searchValueInTabs || childState || {},\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { searchValueLocal } = this.props;\r\n if (searchValueLocal) {\r\n this.setState({\r\n searchValue: Object.keys(searchValueLocal).map((key) => searchValueLocal[key].search)[0],\r\n });\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { searchValueInTabs, currentTab } = this.state;\r\n const { searchValueLocal, searchValue } = this.props;\r\n const tabSearchName = searchValueLocal && Object.keys(searchValueLocal)[0];\r\n if (searchValueLocal && !(tabSearchName in searchValueInTabs)) {\r\n this.setState({\r\n searchValueInTabs: {\r\n ...searchValueInTabs,\r\n ...searchValueLocal,\r\n },\r\n });\r\n }\r\n if (searchValueLocal && (currentTab !== tabSearchName)) {\r\n this.setState({\r\n currentTab: tabSearchName,\r\n searchValue: (searchValueInTabs[tabSearchName] && searchValueInTabs[tabSearchName].search) || '',\r\n });\r\n }\r\n if (prevProps.searchValue !== searchValue) {\r\n this.setState({\r\n searchValue,\r\n });\r\n }\r\n }\r\n\r\n getInitialSearch = () => {\r\n const { searchValue, location, searchValueLocal } = this.props;\r\n if (!searchValueLocal) {\r\n return searchValue || location.state.search;\r\n }\r\n if (searchValueLocal) {\r\n return Object.keys(searchValueLocal).map((key) => searchValueLocal[key].search)[0];\r\n }\r\n return '';\r\n }\r\n\r\n handleClick = () => {\r\n const { searchValue } = this.state;\r\n const { onSearchClick } = this.props;\r\n onSearchClick && onSearchClick(searchValue);\r\n }\r\n\r\n handleSetSearchValue = (e) => {\r\n const { currentTab, searchValueInTabs } = this.state;\r\n const { searchValueLocal } = this.props;\r\n const stateToSet = searchValueLocal\r\n ? {\r\n searchValue: e.target.value,\r\n searchValueInTabs: {\r\n ...searchValueInTabs,\r\n [currentTab]: { ...[currentTab], search: e.target.value },\r\n },\r\n } : {\r\n searchValue: e.target.value,\r\n };\r\n this.setState(stateToSet);\r\n }\r\n\r\n handleKeyUp = (e) => {\r\n const enterButtonKeyCode = 13;\r\n const { searchValue } = this.state;\r\n const { onSearchClick } = this.props;\r\n if (e.keyCode === enterButtonKeyCode) {\r\n onSearchClick && onSearchClick(searchValue);\r\n }\r\n }\r\n\r\n clearSearch = () => {\r\n const { currentTab, searchValueInTabs } = this.state;\r\n const { searchValueLocal, onSearchClick } = this.props;\r\n const stateToSet = searchValueLocal\r\n ? {\r\n searchValue: '',\r\n searchValueInTabs: {\r\n ...searchValueInTabs,\r\n [currentTab]: { ...[currentTab], search: '' },\r\n },\r\n } : {\r\n searchValue: '',\r\n };\r\n this.setState(stateToSet);\r\n onSearchClick && onSearchClick('');\r\n }\r\n\r\n render() {\r\n const { searchValue } = this.state;\r\n const {\r\n searchPlaceholder,\r\n onSearchClick,\r\n } = this.props;\r\n const clearIconBtn = ;\r\n const clickableActions = <>\r\n {searchValue && clearIconBtn}\r\n \r\n ;\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nSearchField.propTypes = {\r\n searchPlaceholder: PropTypes.string,\r\n onSearchClick: PropTypes.func,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\n\r\nexport class DateRange extends Component {\r\n render() {\r\n const {\r\n startDateHistory,\r\n endDateHistory,\r\n handleChooseDate,\r\n clearStartDate,\r\n clearEndDate,\r\n } = this.props;\r\n return (\r\n \r\n {clickableActions}\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nDateRange.propTypes = {\r\n startDateHistory: PropTypes.string,\r\n endDateHistory: PropTypes.string,\r\n handleChooseDate: PropTypes.func.isRequired,\r\n clearStartDate: PropTypes.func.isRequired,\r\n clearEndDate: PropTypes.func.isRequired,\r\n};\r\n","import React, { useState, useEffect, useRef } from 'react';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nexport default ({ className, textForTooltip }) => {\r\n const [showTooltip, setShowTooltip] = useState(false);\r\n const tooltipRef = useRef();\r\n\r\n const onClickOutTooltip = e => !tooltipRef.current.contains(e.target) && setShowTooltip(false);\r\n const onToggleShowTooltip = () => { setShowTooltip(!showTooltip); };\r\n\r\n useEffect(() => {\r\n document.addEventListener('click', onClickOutTooltip);\r\n return () => document.removeEventListener('click', onClickOutTooltip);\r\n }, []);\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport Tooltip from 'common/components/tooltip/tooltip';\r\n\r\nexport class Slider extends Component {\r\n render() {\r\n const {\r\n onChange,\r\n defaultChecked,\r\n label,\r\n name = 'slider',\r\n className = 'checkbox_extend_container',\r\n index,\r\n htmlFor = 'checkbox_extend',\r\n id = 'checkbox_extend',\r\n isTooltip,\r\n textForTooltip,\r\n tooltipClassName,\r\n isChecked = defaultChecked,\r\n } = this.props;\r\n return (\r\n {textForTooltip}
}\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nSlider.propTypes = {\r\n onChange: PropTypes.func.isRequired,\r\n defaultChecked: PropTypes.bool.isRequired,\r\n};\r\n","import React from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\n\r\nconst useStyles = makeStyles(() => ({\r\n root: {\r\n width: '100%',\r\n },\r\n input: {\r\n display: 'none',\r\n },\r\n label: {\r\n width: '100%',\r\n cursor: 'pointer',\r\n display: 'block',\r\n },\r\n}));\r\n\r\nexport default ({ title, onChange }) => {\r\n const classes = useStyles();\r\n\r\n return (\r\n \r\n );\r\n};\r\n","import React, { useState } from 'react';\r\nimport {\r\n Button, Menu, MenuItem,\r\n} from '@material-ui/core';\r\nimport ButtonUpload from 'common/components/form-items/button-upload/button-upload';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport config from 'config.json';\r\n\r\nconst useStyles = makeStyles(() => ({\r\n menuButton: {\r\n background: 'none',\r\n '&:hover': {\r\n background: 'none',\r\n },\r\n },\r\n menuItem: {\r\n cursor: 'pointer',\r\n },\r\n linkItem: {\r\n textDecoration: 'none',\r\n color: 'black',\r\n },\r\n}));\r\n\r\nexport default ({\r\n styles,\r\n onImportFile,\r\n}) => {\r\n const [anchorEl, setAnchorEl] = useState(null);\r\n const classes = useStyles();\r\n\r\n const handleClick = (event) => {\r\n setAnchorEl(event.currentTarget);\r\n };\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null);\r\n };\r\n\r\n const onImport = ({ target }) => {\r\n handleClose();\r\n onImportFile(target.files[0]);\r\n target.value = '';\r\n };\r\n\r\n return (\r\n \r\n
\r\n {\r\n isTooltip\r\n ? (\r\n \r\n \r\n Import milestones data\r\n \r\n \r\n \r\n \r\n Download import template\r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport ButtonOptions from 'common/components/form-items/button-options/button-options';\r\nimport ButtonImportPDF from 'common/components/form-items/button-import-pdf/button-import-pdf';\r\nimport CustomIcon from '../../icon/Icon';\r\n\r\nexport class ButtonsGroup extends Component {\r\n render() {\r\n const {\r\n showSyncButton,\r\n addExtend,\r\n showAddButton,\r\n showExportButton,\r\n showMargeButton,\r\n isActiveExtend,\r\n ADSync,\r\n extendRoles,\r\n exportDocument,\r\n onAddNew,\r\n mergeElements,\r\n blockAddButton,\r\n showTitleText,\r\n customAddButton,\r\n isActiveMerge,\r\n showButtonOptions,\r\n onDownloadFile,\r\n onImportFile,\r\n showImportSOWButton,\r\n customImportSOWButton,\r\n blockImportSOWButton,\r\n showAddMSAButton,\r\n customAddMSAButton,\r\n blockAddMSAButton,\r\n onAddMSA,\r\n } = this.props;\r\n return (\r\n \r\n {showSyncButton && (\r\n \r\n
\r\n )}\r\n {showImportSOWButton && (\r\n \r\n
\r\n )}\r\n {addExtend && (\r\n \r\n
\r\n )}\r\n {showMargeButton && (\r\n \r\n Only non-removed roles and employees should be displayed by default.\r\n
\r\n );\r\n };\r\n\r\n getTextForFinishedProjectsTooltip = () => {\r\n return (\r\n\r\n Filter excludes the projects which are finished by the current moment and does not depend on a report date range\r\n
\r\n );\r\n }\r\n\r\n render() {\r\n const {\r\n title,\r\n detailsStyles,\r\n searchPlaceholder,\r\n items,\r\n applyFilters,\r\n columnsToDisplay,\r\n changeColumnsToDisplay,\r\n showAddButton,\r\n showExportButton,\r\n showMargeButton,\r\n exportDocument,\r\n showSyncButton,\r\n showTitleText,\r\n blockAddButton,\r\n addExtend,\r\n showToogleForRoles,\r\n isActiveExtend,\r\n extendRoles,\r\n defaultChecked,\r\n handleChangeShowRoles,\r\n searchField = true,\r\n showDateRange,\r\n startDateHistory,\r\n endDateHistory,\r\n handleChooseDate,\r\n clearStartDate,\r\n clearEndDate,\r\n onSearchClick,\r\n customAddButton,\r\n mergeElements,\r\n isActiveMerge,\r\n SOWExtensionOptions,\r\n handleChangeNestedItems,\r\n location,\r\n search,\r\n searchValue,\r\n searchValueLocal,\r\n validateFilterDates = false,\r\n showButtonOptions,\r\n onImportFile,\r\n onDownloadFile,\r\n showImportSOWButton,\r\n customImportSOWButton,\r\n blockImportSOWButton,\r\n showAddMSAButton,\r\n customAddMSAButton,\r\n blockAddMSAButton,\r\n onAddMSA,\r\n showToggleForFinishedProjects,\r\n handleToggleForFinishedProjects,\r\n containerClassName,\r\n } = this.props;\r\n const {\r\n showFiltersChanging, showFilters, showOptions, filterOptions,\r\n } = this.state;\r\n const applyIsDisabled = validateFilterDates\r\n ? !this.checkValideDates()\r\n : false;\r\n return (\r\n\r\n
\r\n \r\n {items && applyFilters ? (\r\n \r\n {title && (\r\n \r\n
\r\n \r\n {title}\r\n
\r\n )}\r\n \r\n {searchField && (\r\n
\r\n {showToogleForRoles && (\r\n \r\n {items && applyFilters ? (\r\n \r\n {columnsToDisplay.map((header, i) => {\r\n return !header.necessary ? (\r\n
\r\n ) : null}\r\n \r\n
\r\n ) : null}\r\n {columnsToDisplay && changeColumnsToDisplay ? (\r\n \r\n
\r\n ) : null}\r\n {columnsToDisplay && changeColumnsToDisplay ? (\r\n \r\n {filterOptions}\r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n \r\n ) : null}\r\n \r\n );\r\n }\r\n}\r\n\r\nListToolbar.propTypes = {\r\n applyFilters: PropTypes.func,\r\n onSearchClick: PropTypes.func,\r\n changeColumnsToDisplay: PropTypes.func,\r\n columnsToDisplay: PropTypes.array,\r\n items: PropTypes.array,\r\n title: PropTypes.string,\r\n searchPlaceholder: PropTypes.string,\r\n showAddButton: PropTypes.bool,\r\n showExportButton: PropTypes.bool,\r\n showImportSOWButton: PropTypes.bool,\r\n detailsStyles: PropTypes.bool,\r\n departments: PropTypes.array,\r\n onADSync: PropTypes.func,\r\n mergeElements: PropTypes.func,\r\n};\r\n\r\nexport default connect(\r\n (store) => ({\r\n user: store.authReducer.user,\r\n }),\r\n {},\r\n)(ListToolbar);\r\n","export const scrollToLastElement = (wrapper, target, isShift) => {\r\n const container = document.getElementById(wrapper);\r\n const containerSize = container.getBoundingClientRect();\r\n const elem = document.getElementById(target);\r\n const positionElem = elem && elem.getBoundingClientRect();\r\n if (positionElem && containerSize) {\r\n const currentPosition = positionElem.top - containerSize.top - (isShift ? positionElem.height : 0);\r\n container.scrollTo && container.scrollTo({\r\n top: currentPosition,\r\n behavior: 'smooth',\r\n });\r\n }\r\n};\r\n","import { STATUS_COLOR } from '../utils/const-variable';\r\n\r\nexport const getStatusColor = (status) => {\r\n const statusColor = {\r\n 'Active': STATUS_COLOR.green,\r\n 'Prospective': STATUS_COLOR.blue,\r\n 'Removed': STATUS_COLOR.red,\r\n 'Draft': STATUS_COLOR.blue,\r\n 'Expired': STATUS_COLOR.grey,\r\n 'Completed': STATUS_COLOR.blue,\r\n 'Employee': STATUS_COLOR.lightRed,\r\n 'Contractor': STATUS_COLOR.yellow,\r\n 'Trainee': STATUS_COLOR.blue,\r\n 'Disabled': STATUS_COLOR.charcoal,\r\n 'Admin Staff': STATUS_COLOR.violet,\r\n 'On Hold': STATUS_COLOR.grey,\r\n 'Former employee': STATUS_COLOR.emerald,\r\n 'Early Active': STATUS_COLOR.emerald,\r\n 'Early Active & Active': STATUS_COLOR.turquoise,\r\n 'Late Active': STATUS_COLOR.mediumTurquoise,\r\n 'Hold': STATUS_COLOR.grey,\r\n 'Finished': STATUS_COLOR.blue,\r\n 'Extended': STATUS_COLOR.green,\r\n 'InProgress': STATUS_COLOR.blue,\r\n 'In Progress': STATUS_COLOR.blue,\r\n 'Insufficient': STATUS_COLOR.yellow,\r\n 'Ready': STATUS_COLOR.green,\r\n 'Sent': STATUS_COLOR.grey,\r\n 'Perpetual': STATUS_COLOR.violet,\r\n };\r\n\r\n return statusColor[status] !== undefined ? statusColor[status] : 'transparent';\r\n};\r\n\r\nexport const getProjectStatusColor = (status) => {\r\n if (!status) return '';\r\n const statusColor = {\r\n 'Approve SOW/PO': STATUS_COLOR.red,\r\n 'Approve new SOW/PO': STATUS_COLOR.red,\r\n 'Prospective': STATUS_COLOR.grey,\r\n 'Active': STATUS_COLOR.green,\r\n 'Unblock Project': STATUS_COLOR.red,\r\n 'Finish or Extend Project': STATUS_COLOR.red,\r\n 'Finished': STATUS_COLOR.grey,\r\n 'Draft': STATUS_COLOR.grey,\r\n 'Complete the Phase': STATUS_COLOR.red,\r\n 'Complete the Project': STATUS_COLOR.red,\r\n };\r\n\r\n if (!statusColor[status]) {\r\n const warningStatuses = [\r\n 'Approve SOW/PO',\r\n 'Unblock Project',\r\n 'Finish or Extend Project',\r\n 'Complete the Phase',\r\n 'Approve new SOW/PO',\r\n 'Complete the Project',\r\n ];\r\n return warningStatuses.some(item => status.includes(item)) ? STATUS_COLOR.red : STATUS_COLOR.green;\r\n }\r\n\r\n return statusColor[status];\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from '../../icon/Icon';\r\nimport { getProjectStatusColor, getStatusColor } from 'services/getStatusColor';\r\n\r\nexport class CustomStatusCell extends Component {\r\n getDefaultTitleText = () => {\r\n const { item } = this.props;\r\n const status = item.ProjectStatus || item.Status;\r\n const statusColor = status.split(' & ').filter(\r\n (item) => item === 'Approve SOW/PO' || item === 'Unblock Project' || item === 'Finish or Extend Project',\r\n );\r\n let returnString = '';\r\n\r\n if (!item.ProjectStatus && item.Comments.length && statusColor.length) {\r\n returnString += item.Status + '. \\n\\n';\r\n item.Comments.forEach(element => {\r\n if ((element.DocumentStatus === 'Draft' && element.ApprovalStatus === 'Approve')\r\n || (element.DocumentStatus === 'Active' && element.ApprovalStatus === 'Not Approve')\r\n || (element.DocumentStatus === 'Expired' && element.ApprovalStatus === 'Approve')) {\r\n returnString += '• ' + element.ContractName + ' : \"';\r\n returnString += (element.Comment !== null ? element.Comment : '');\r\n returnString += '\". \\n';\r\n }\r\n });\r\n } else if (item.Status !== 'Active' && item.Status !== 'Draft') {\r\n returnString += status;\r\n }\r\n return returnString;\r\n }\r\n\r\n getTitle = (isStatusInvalid) => {\r\n const { item, column, config } = this.props;\r\n const columnConfig = config[column.Id];\r\n\r\n if (columnConfig.getTitle) {\r\n return columnConfig.getTitle(item);\r\n }\r\n\r\n return isStatusInvalid ? 'Some statuses are crossing' : column.title && this.getDefaultTitleText();\r\n }\r\n\r\n render() {\r\n const { item, column } = this.props;\r\n const status = typeof item[column.Id] === 'object' ? item[column.Id].Name : item[column.Id];\r\n const isStatusInvalid = typeof item.isStatusesCrossing === 'boolean' && item.isStatusesCrossing;\r\n\r\n return (\r\n \r\n Reset\r\n
\r\n \r\n \r\n {item.Name}\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellProjectIcon.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport classNames from 'classnames';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport CustomIcon from '../../icon/Icon';\r\nimport { ACTIVE, FINISHED } from 'utils/const-variable';\r\n\r\nexport class CellTimeleft extends Component {\r\n isExpired = () => {\r\n const { item, config } = this.props;\r\n const timeLeft = config.EndDate.daysToExpire;\r\n const isEnded = item.EndDate\r\n && (moment(item.EndDate).diff(new Date(), 'day') < timeLeft);\r\n\r\n if (item.Status) {\r\n if (item.Status.Name === FINISHED || item.Status === FINISHED) {\r\n return false;\r\n }\r\n\r\n return isEnded && (item.Status.Name === ACTIVE || item.Status === ACTIVE) || item.ProjectExpiration;\r\n }\r\n return isEnded || item.ProjectExpiration;\r\n }\r\n\r\n render() {\r\n const {\r\n item, column,\r\n } = this.props;\r\n const date = moment(item[column.Id]).format('MM/DD/YYYY') !== 'Invalid date' ? moment(item[column.Id]).format('MM/DD/YYYY') : null;\r\n return (\r\n \r\n {renderProjectTypeIcon(item.Billability.Name)}\r\n
\r\n \r\n \r\n {date}\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nCellTimeleft.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport {\r\n fetchProjects,\r\n changeColumnsToDisplay,\r\n searchProjects,\r\n resetProjectDetails,\r\n resetProjects,\r\n setListSettings,\r\n} from '../../actions/projectsActions';\r\nimport { List } from 'common/components/list/list';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport { getSelectedTab } from '../../../../common/actions/selectedTabActions';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport isEmptyObject from 'utils/isEmptyObject';\r\nimport { scrollToLastElement } from 'services/scrollToLastElement.js';\r\nimport { debounce } from 'services/debounce';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport { CustomStatusCell } from 'common/components/list/custom-cell/custom-status-cell';\r\nimport { CellProjectIcon } from 'common/components/list/custom-cell/cell-project-icon';\r\nimport { CellTimeleft } from 'common/components/list/custom-cell/cell-timeleft';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\n\r\nconst initialTakeAmount = 50;\r\nconst initialPage = 1;\r\nconst magnificationFactor = 10;\r\n\r\nexport class ProjectsListComponent extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n takeAmount: initialTakeAmount,\r\n childState: {\r\n contracts: {\r\n search: '',\r\n sortColumn: 'StartDate',\r\n sortDirection: 'Up',\r\n },\r\n roles: {\r\n search: '',\r\n sortColumn: 'RoleName',\r\n sortDirection: 'Up',\r\n },\r\n history: {\r\n search: '',\r\n startDateHistory: null,\r\n endDateHistory: null,\r\n },\r\n teams: {\r\n search: '',\r\n sortColumn: 'TeamName',\r\n sortDirection: 'Up',\r\n },\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n resetProjectDetails,\r\n getSelectedTab,\r\n listSettings: {\r\n searchValue,\r\n scrollTo,\r\n sortColumn,\r\n sortDirection,\r\n filters,\r\n },\r\n searchProjects,\r\n setComponent,\r\n totalCount,\r\n defaultFilters,\r\n prevPath,\r\n } = this.props;\r\n\r\n const {\r\n childState,\r\n takeAmount,\r\n } = this.state;\r\n\r\n setListSettings({\r\n childState,\r\n });\r\n resetProjectDetails();\r\n getSelectedTab(0);\r\n if (scrollTo !== '') {\r\n scrollToLastElement('projects', scrollTo, true);\r\n }\r\n searchProjects(searchValue, filters, takeAmount, 0, { column: sortColumn, sortDirection });\r\n setComponent({ title: `Projects (${totalCount})` });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState) {\r\n const {\r\n listSettings,\r\n searchProjects,\r\n totalCount,\r\n setComponent,\r\n projects,\r\n resetProjects,\r\n } = this.props;\r\n\r\n const { takeAmount } = this.state;\r\n\r\n if (prevProps.totalCount !== totalCount) {\r\n setComponent({ title: `Projects (${totalCount})` });\r\n }\r\n\r\n if (takeAmount !== initialTakeAmount && prevState.takeAmount !== takeAmount) {\r\n searchProjects(\r\n listSettings.searchValue,\r\n listSettings.filters,\r\n takeAmount - projects.length,\r\n projects.length,\r\n { column: listSettings.sortColumn, sortDirection: listSettings.sortDirection },\r\n );\r\n }\r\n\r\n if (isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n resetProjects();\r\n\r\n this.setState({\r\n takeAmount: initialTakeAmount,\r\n });\r\n\r\n this.scroll.pageLoaded = initialPage;\r\n\r\n searchProjects(\r\n listSettings.searchValue,\r\n listSettings.filters,\r\n initialTakeAmount,\r\n 0,\r\n { column: listSettings.sortColumn, sortDirection: listSettings.sortDirection },\r\n );\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent, resetProjects } = this.props;\r\n resetComponent();\r\n resetProjects();\r\n }\r\n\r\n searchProjects = (searchValue) => {\r\n const { setListSettings } = this.props;\r\n const { childState } = this.state;\r\n setListSettings({ searchValue, childState });\r\n }\r\n\r\n applyFilters = (filters) => {\r\n const { setListSettings } = this.props;\r\n const { childState } = this.state;\r\n const filtersToSend = !isEmptyObject(filters) ? filters : { isEmpty: true };\r\n setListSettings({ filters: filtersToSend, childState });\r\n }\r\n\r\n resetFilters = () => {\r\n const { setListSettings } = this.props;\r\n const { childState } = this.state;\r\n setListSettings({ filters: {}, childState });\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettings } = this.props;\r\n const { childState } = this.state;\r\n setListSettings({ sortColumn, sortDirection, childState });\r\n }\r\n\r\n routeToProjectDetails = (id) => {\r\n history.push({\r\n pathname: `projects/${id}`,\r\n });\r\n }\r\n\r\n changeAmountProjects = (page) => {\r\n const { isLoading } = this.props;\r\n const { takeAmount } = this.state;\r\n\r\n const increaseParams = takeAmount + page * magnificationFactor;\r\n if (!isLoading) {\r\n this.setState({\r\n takeAmount: increaseParams,\r\n });\r\n }\r\n }\r\n\r\n addNewProject = () => {\r\n history.push({ pathname: '/projects/new' });\r\n }\r\n\r\n render() {\r\n const {\r\n offices,\r\n clients,\r\n statuses,\r\n projects,\r\n accountManagers,\r\n deliveryManagers,\r\n clientManagers,\r\n columnsToDisplay,\r\n changeColumnsToDisplay,\r\n showDialog,\r\n settings,\r\n alerts,\r\n projectTypes,\r\n listSettings: {\r\n sortColumn,\r\n sortDirection,\r\n filters,\r\n searchValue,\r\n },\r\n CanCreateProject,\r\n totalCount,\r\n } = this.props;\r\n\r\n return (\r\n \r\n {this.isExpired()\r\n ?
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nProjectsListComponent.propTypes = {\r\n columnsToDisplay: PropTypes.array,\r\n projects: PropTypes.array,\r\n offices: PropTypes.array,\r\n clients: PropTypes.array,\r\n statuses: PropTypes.array,\r\n accountManagers: PropTypes.array,\r\n deliveryManagers: PropTypes.array,\r\n alerts: PropTypes.array,\r\n clientManagers: PropTypes.array,\r\n changeColumnsToDisplay: PropTypes.func,\r\n searchProjects: PropTypes.func,\r\n resetProjectDetails: PropTypes.func,\r\n CanCreateProject: PropTypes.bool,\r\n totalCount: PropTypes.number.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n columnsToDisplay: store.projectsReducer.columnsToDisplay,\r\n projects: [...store.projectsReducer.projects],\r\n offices: store.filtersReducer.filters.Offices,\r\n clients: store.filtersReducer.filters.Clients,\r\n alerts: store.filtersReducer.filters.Alerts,\r\n projectTypes: store.filtersReducer.filters.ProjectTypes,\r\n statuses: store.filtersReducer.filters.ProjectStatuses,\r\n accountManagers: store.filtersReducer.filters.AccountManagers,\r\n deliveryManagers: store.filtersReducer.filters.DeliveryManagers,\r\n clientManagers: store.filtersReducer.filters.ClientManagers,\r\n settings: store.adminReducer.settings,\r\n totalCount: store.projectsReducer.projectTotalCount,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.projectsReducer.listSettings,\r\n}), {\r\n fetchProjects,\r\n changeColumnsToDisplay,\r\n searchProjects,\r\n resetProjectDetails,\r\n getSelectedTab,\r\n showDialog,\r\n setComponent,\r\n resetComponent,\r\n resetProjects,\r\n setListSettings,\r\n})(ProjectsListComponent);\r\n","export const applicationTitle = (() => {\r\n const titles = {\r\n 'theodolite': 'Theodolite ',\r\n 'loginPage': 'Theodolite - LogIn',\r\n 'projects': 'Theodolite - Projects',\r\n 'offices': 'Theodolite - Offices',\r\n 'clients': 'Theodolite - Clients',\r\n 'employees': 'Theodolite - Employees',\r\n 'contracts': 'Theodolite - Contracts',\r\n 'manageUsers': 'Theodolite - Manage users',\r\n 'settings': 'Theodolite - Settings',\r\n 'createProject': 'Theodolite - Create Project',\r\n 'createClient': 'Theodolite - Create Client',\r\n 'addRole': 'Theodolite - Add Role',\r\n 'editRole': 'Theodolite - Edit Role',\r\n 'viewRole': 'Theodolite - View Role',\r\n 'addSow': 'Theodolite - Add SOW to Project',\r\n 'editSow': 'Theodolite - Edit SOW in Project',\r\n 'viewSow': 'Theodolite - View SOW in Project',\r\n 'addPO': 'Theodolite - Add PO to Project',\r\n 'editPO': 'Theodolite - Edit PO in Project',\r\n 'viewPO': 'Theodolite - View PO in Project',\r\n 'addMSA': 'Theodolite - Add MSA to Project',\r\n 'editMSA': 'Theodolite - Edit MSA in Project',\r\n 'viewMSA' : 'Theodolite - View MSA in Project',\r\n 'editProjectEmployees': 'Theodolite - Edit Employees in the role',\r\n 'reports': 'Theodolite - Reports',\r\n 'lookups': 'Theodolite - Manage Lookups',\r\n 'lookupsBusinessTrips': 'Theodolite - Manage Lookups - Business Trips',\r\n 'lookupsPaymentTerms': 'Theodolite - Manage Lookups - Payment Terms',\r\n 'lookupsJobTitles': 'Theodolite - Manage Lookups - Job Titles',\r\n 'lookupsLocations': 'Theodolite - Manage Lookups - Locations',\r\n 'lookupsProjectTypes': 'Theodolite - Manage Lookups - Project Types',\r\n 'lookupsRoleTypes': 'Theodolite - Manage Lookups - Role Types',\r\n 'lookupsSkills': 'Theodolite - Manage Lookups - Skills',\r\n 'lookupsSeniorityLevels': 'Theodolite - Manage Lookups - Seniority Levels',\r\n 'lookupsSkillLevels': 'Theodolite - Manage Lookups - Skill Levels',\r\n 'lookupsCountry': 'Theodolite - Manage Lookups - Countries',\r\n 'lookupsDocumentTypes': 'Theodolite - Manage Lookups - Document Types',\r\n 'lookupsEngagementTypes': 'Theodolite - Manage Lookups - Engagement Types',\r\n 'addAmendment': 'Theodolite - Add Amendment to Project',\r\n 'editAmendment': 'Theodolite - Edit Amendment in Project',\r\n 'viewAmendment': 'Theodolite - View Amendment in Project',\r\n 'lookupsCertificates': 'Theodolite - Manage Lookups - Certificates',\r\n 'lookupsAssignmentTypes': 'Theodolite - Manage Lookups - Assignment Types',\r\n 'billing': 'Theodolite - Billing',\r\n 'addTeam': 'Theodolite - Add Team',\r\n 'editTeam': 'Theodolite - Edit Team',\r\n 'manageApiTokens': 'Theodolite - Manage Api tokens',\r\n 'lookupListofTrainings': 'Employee - List of Trainings',\r\n 'lookupsBackFillTypes': 'Theodolite - Manage Lookups - Backfill Types',\r\n 'lookupsEmployeeTypes': 'Theodolite - Manage Lookups - Employee Types',\r\n };\r\n\r\n return { getTitile: titleName => titles[titleName] };\r\n})();\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nimport classNames from 'classnames';\r\n\r\nimport './progress-bar.css';\r\n\r\nclass ProgressBarComponent extends React.Component {\r\n\r\n render() {\r\n const { stepNames, selectedStep } = this.props;\r\n\r\n // const borderWidth = document.getElementsByClassName('progress-bar')[0] ?\r\n // document.getElementsByClassName('progress-bar')[0].clientWidth / (stepNames.length - 1) : 0;\r\n\r\n return (\r\n \r\n this.scroll = scroll}\r\n >\r\n this.routeToProjectDetails(id)}\r\n onEditClick={(id) => this.routeToProjectDetails(id)}\r\n onDeleteClick={showDialog}\r\n setSortSettings={this.setSortSettings}\r\n sortColumnName={sortColumn}\r\n sortDirection={sortDirection}\r\n hideDots\r\n dontShowOptions\r\n timeLeft={settings.ContractFirstNotification}\r\n fixedHeader\r\n config={{\r\n 'Status': {\r\n cell: CustomStatusCell,\r\n },\r\n 'Name': { cell: CellProjectIcon },\r\n 'EndDate': {\r\n cell: CellTimeleft,\r\n daysToExpire: settings.ProjectExpiration,\r\n },\r\n }}\r\n />\r\n \r\n
\r\n \r\n \r\n {\r\n stepNames.map((stepName, i) => {\r\n return (\r\n
\r\n );\r\n }\r\n}\r\n\r\nStep.propTypes = {\r\n onStepChange: PropTypes.func,\r\n initialState: PropTypes.object,\r\n deliveryManagersByOffice: PropTypes.array.isRequired,\r\n engineeringManagersByOffice: PropTypes.array.isRequired,\r\n accountManagersByOffice: PropTypes.array.isRequired,\r\n clients: PropTypes.array,\r\n clientContacts: PropTypes.array,\r\n projectTypes: PropTypes.array,\r\n setClientId: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n projectTypes: store.projectsReducer.projectTypes,\r\n projects: store.projectsReducer.projects,\r\n clients: store.filtersReducer.filters.Clients,\r\n clientContacts: store.projectsReducer.clientContacts,\r\n officesProps: store.filtersReducer.filters.Offices,\r\n isProjectNameDublicateError: store.projectsReducer.isProjectNameDublicateError,\r\n deliveryManagersByOffice: store.projectsReducer.deliveryManagersByOffice,\r\n engineeringManagersByOffice: store.projectsReducer.engineeringManagersByOffice,\r\n accountManagersByOffice: store.projectsReducer.accountManagersByOffice,\r\n allCurrencies: store.projectsReducer.allCurrencies,\r\n allEngagementTypes: store.projectsReducer.allEngagementTypes,\r\n}))(Step);\r\n","export const getId = () => {\r\n const path = window.location.pathname.split('/').filter(Boolean);\r\n return path[path.length - 1];\r\n};\r\n","import React from 'react';\r\nimport classNames from 'classnames';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport Select from 'common/components/form-items/select/select';\r\n\r\nexport class UpdateDocumentItem extends React.Component {\r\n render() {\r\n const {\r\n item,\r\n onChangeNewDocumentObj,\r\n disableSaveDocument,\r\n newDocumentCancel,\r\n newDocumentApply,\r\n isDocumentType,\r\n documentSelectOptions,\r\n } = this.props;\r\n return (\r\n \r\n {\r\n i < stepNames.length - 1 ? (\r\n \r\n {\r\n label && (\r\n {label} \r\n )\r\n }\r\n onChange({ target: e.target, item: selectOptions.find(item => item.Id === e.target.value) })\r\n : onChange}\r\n inputProps={inputProps}\r\n disabled={disabled}\r\n title={helperText ? helperText : null}\r\n className={classNames(\r\n selectClassName,\r\n {\r\n 'placeholder--is-active': selectValue === 'none' && !disabled && !addEmployeeStyles,\r\n },\r\n {\r\n 'placeholder--is-disabled': disabled,\r\n },\r\n )}\r\n MenuProps={MenuProps}\r\n >\r\n {\r\n selectValue === 'none' && placeholder && (\r\n \r\n {placeholder}\r\n \r\n )\r\n }\r\n {\r\n isOptionObject ? selectOptions && selectOptions.map((item, i) => (\r\n \r\n {item.Name}\r\n \r\n ))\r\n : (\r\n selectOptions && selectOptions.map((item, i) => (\r\n \r\n )))\r\n }\r\n \r\n {\r\n showClear && value && value !== 'none' && !disabled ? (\r\n \r\n );\r\n }\r\n}\r\n\r\nSelect.propTypes = {\r\n label: PropTypes.string,\r\n placeholder: PropTypes.string,\r\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n formClassName: PropTypes.string,\r\n selectClassName: PropTypes.string,\r\n optionsClassName: PropTypes.string,\r\n inputProps: PropTypes.object,\r\n onChange: PropTypes.func,\r\n selectOptions: PropTypes.array,\r\n isOptionObject: PropTypes.bool,\r\n isRequired: PropTypes.bool,\r\n disabled: PropTypes.bool,\r\n extendedValue: PropTypes.bool,\r\n helperText: PropTypes.string,\r\n clearValue: PropTypes.func,\r\n};\r\n\r\nexport default Select;\r\n","const sortByAplhabet = (arr) => {\r\n return arr.sort((currValue, secondValue) => {\r\n return (currValue.Name > secondValue.Name) ? 1 : (currValue.Name < secondValue.Name) ? -1 : 0;\r\n });\r\n};\r\n\r\nexport default sortByAplhabet;\r\n","import sortByAplhabet from 'utils/sortByAplhabet';\r\n\r\nexport const getCorrectManagersForMultiSuggest = (managers) => {\r\n if (managers.length) {\r\n return sortByAplhabet(managers).map(item => ({\r\n label: item.Name,\r\n value: item.Name,\r\n valueId: item.Id,\r\n }));\r\n }\r\n};\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\n\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport classNames from 'classnames';\r\n\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport MultiSelect from 'common/components/form-items/multi-select/multi-select';\r\nimport MultiSuggestBox from 'common/components/form-items/multi-value-suggestbox/multi-value-suggestbox';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport SearchDropdown from '../../../../common/components/form-items/search-dropdown/search-dropdown';\r\nimport isObjectNotEquals from '../../../../utils/object-comparison';\r\nimport { NON_BILLABLE_TRAINING } from '../../../../utils/const-variable';\r\nimport { getCorrectManagersForMultiSuggest } from '../utils/getCorrectManagersForMultiSuggest';\r\n\r\nexport class Step extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n const { initialState } = this.props;\r\n\r\n this.state = {\r\n aliases: initialState.aliases,\r\n projectCode: initialState.projectCode,\r\n name: initialState.name,\r\n offices: initialState.offices,\r\n primaryOffices: initialState.primaryOffices,\r\n clientId: initialState.clientId,\r\n clientManagerId: initialState.clientManagerId,\r\n description: initialState.description,\r\n accountManagerId: initialState.accountManagerId,\r\n deliveryManagerId: initialState.deliveryManagerId,\r\n // budget: initialState.budget,\r\n projectType: initialState.projectType,\r\n projectTypeName: initialState.projectTypeName,\r\n startDate: initialState.startDate,\r\n endDate: initialState.endDate,\r\n isStep1FieldsRequired: initialState.isStep1FieldsRequired,\r\n // disabledStep1Selects: initialState.disabledStep1Selects,\r\n endDateDisebled: true,\r\n clientManagerDisebled: true,\r\n SOWClientManagerId: initialState.SOWClientManagerId,\r\n projectNameError: false,\r\n isBillableTrainee: true,\r\n deliveryManagersOptions: [],\r\n currentDeliveryManagers: initialState.currentDeliveryManagers,\r\n engineeringManagersOption: [],\r\n currency: initialState.currency,\r\n ProjectBillingCode: initialState.ProjectBillingCode,\r\n currentEngineeringManagers: initialState.currentEngineeringManagers,\r\n engagementTypeId: initialState.engagementTypeId,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { clientId, startDate } = this.state;\r\n const { projectTypes } = this.props;\r\n this.setState(clientId\r\n ? { clientManagerDisebled: false }\r\n : { clientManagerDisebled: true });\r\n this.setState(startDate\r\n ? { endDateDisebled: false }\r\n : { endDateDisebled: true });\r\n if (projectTypes.length) {\r\n this.checkBillableStatus();\r\n }\r\n this.setAllManagersOptions();\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState) {\r\n const { projectType, offices } = this.state;\r\n const {\r\n projectTypes, deliveryManagersByOffice, engineeringManagersByOffice, getManagersByOffice, setSOWType,\r\n } = this.props;\r\n if (prevState.projectType !== projectType || prevProps.projectTypes !== projectTypes) {\r\n this.checkBillableStatus();\r\n setSOWType(projectType);\r\n }\r\n if (isObjectNotEquals(prevProps.deliveryManagersByOffice, deliveryManagersByOffice)) {\r\n this.setAllManagersOptions();\r\n this.filterManagersByOffice();\r\n }\r\n if (isObjectNotEquals(prevProps.engineeringManagersByOffice, engineeringManagersByOffice)) {\r\n this.setAllManagersOptions();\r\n this.filterManagersByOffice();\r\n }\r\n if (prevState.offices !== offices) {\r\n getManagersByOffice(offices);\r\n }\r\n }\r\n\r\n setAllManagersOptions = () => {\r\n const { deliveryManagersByOffice, engineeringManagersByOffice } = this.props;\r\n this.setState({\r\n deliveryManagersOptions: getCorrectManagersForMultiSuggest(deliveryManagersByOffice),\r\n engineeringManagersOption: getCorrectManagersForMultiSuggest(engineeringManagersByOffice),\r\n });\r\n }\r\n\r\n filterManagersByOffice = () => {\r\n const { currentDeliveryManagers, currentEngineeringManagers, accountManagerId } = this.state;\r\n const { deliveryManagersByOffice, engineeringManagersByOffice, accountManagersByOffice } = this.props;\r\n const correctDelivery = currentDeliveryManagers.filter((item) => {\r\n return deliveryManagersByOffice.find(manager => item.valueId === manager.Id);\r\n });\r\n const correctEngineering = currentEngineeringManagers.filter((item) => {\r\n return engineeringManagersByOffice.find(manager => item.valueId === manager.Id);\r\n });\r\n this.setState({\r\n currentDeliveryManagers: correctDelivery,\r\n currentEngineeringManagers: correctEngineering,\r\n });\r\n if (!!accountManagersByOffice.length) {\r\n const correctAccount = accountManagersByOffice.find(manager => manager.Id === accountManagerId);\r\n this.setState({\r\n accountManagerId: correctAccount ? correctAccount.Id : '',\r\n });\r\n }\r\n };\r\n\r\n requireFields = () => {\r\n const {\r\n startDate,\r\n clientId,\r\n name,\r\n projectType,\r\n offices,\r\n primaryOffices,\r\n accountManagerId,\r\n isBillableTrainee,\r\n clientManagerId,\r\n currency,\r\n engagementTypeId,\r\n } = this.state;\r\n\r\n this.setState(startDate\r\n ? { endDateDisebled: false }\r\n : { endDateDisebled: true });\r\n this.setState(clientId\r\n ? { clientManagerDisebled: false }\r\n : { clientManagerDisebled: true });\r\n (name.trim() !== ''\r\n && projectType !== ''\r\n && offices.length > 0\r\n && primaryOffices.length > 0\r\n && (accountManagerId !== '' || isBillableTrainee)\r\n && clientId !== ''\r\n && !!startDate\r\n && (clientManagerId !== '' || isBillableTrainee))\r\n && currency !== ''\r\n && !!engagementTypeId\r\n ? this.setState({ isStep1FieldsRequired: true })\r\n : this.setState({ isStep1FieldsRequired: false });\r\n }\r\n\r\n checkBillableStatus = () => {\r\n const { projectType } = this.state;\r\n const { projectTypes, checkIsBillableTrainee } = this.props;\r\n\r\n const trainingType = projectTypes.find((item) => {\r\n return item.Name.toLowerCase() === NON_BILLABLE_TRAINING.toLowerCase();\r\n });\r\n const isTrainee = trainingType && trainingType.Id === projectType;\r\n this.setState({\r\n isBillableTrainee: isTrainee,\r\n }, () => this.requireFields());\r\n checkIsBillableTrainee(isTrainee);\r\n };\r\n\r\n onChangeDataProject = (e) => {\r\n if (e.target.name === 'name') {\r\n this.checkProjectNameDublicateError(e);\r\n this.clearProjectError();\r\n }\r\n if (e.target.name === 'projectType') {\r\n const { projectTypes } = this.props;\r\n this.checkBillableStatus();\r\n this.setState({\r\n projectTypeName: projectTypes.find(item => item.Id === e.target.value).Name,\r\n });\r\n }\r\n this.setState({\r\n [e.target.name]: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeOffice = (Id) => {\r\n const { offices, primaryOffices } = this.state;\r\n\r\n const newOffices = offices.includes(Id)\r\n ? offices.filter(id => id !== Id)\r\n : offices.concat([Id]);\r\n this.setState({\r\n offices: newOffices,\r\n primaryOffices: primaryOffices.filter(id => id !== Id),\r\n }, () => {\r\n this.requireFields();\r\n this.filterManagersByOffice();\r\n });\r\n }\r\n\r\n onChangePrimaryOffices = (Id) => {\r\n const { primaryOffices } = this.state;\r\n\r\n const newOffices = primaryOffices.includes(Id)\r\n ? primaryOffices.filter(id => id !== Id)\r\n : primaryOffices.concat([Id]);\r\n this.setState({\r\n primaryOffices: newOffices,\r\n }, () => {\r\n this.requireFields();\r\n });\r\n };\r\n\r\n onChangeClient = (option) => {\r\n this.setState({\r\n clientId: option ? option.value : '',\r\n clientManagerId: '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeClientManager = (option) => {\r\n this.setState({\r\n clientManagerId: option ? option.value : '',\r\n SOWClientManagerId: option ? option.value : '',\r\n }, () => this.requireFields());\r\n };\r\n\r\n onChangeAccountManager = (option) => {\r\n this.setState({\r\n accountManagerId: option ? option.value : '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeEngagementType = (option) => {\r\n this.setState({\r\n engagementTypeId: option ? option.value : '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n handleChangeDate = (date, name) => {\r\n this.requireFields();\r\n if (name) {\r\n this.setState({\r\n [name]: date,\r\n }, () => this.requireFields());\r\n }\r\n }\r\n\r\n changeDeliveryManagersValue = (values) => {\r\n const managersIdArray = values.reduce((acc, item) => {\r\n acc.push(item.valueId);\r\n return acc;\r\n }, []);\r\n this.setState({\r\n DeliveryManagers: values ? managersIdArray : [],\r\n }, () => this.requireFields());\r\n }\r\n\r\n changeEngineeringManagersValue = (values) => {\r\n const managersIdArray = values.reduce((acc, item) => {\r\n acc.push(item.valueId);\r\n return acc;\r\n }, []);\r\n this.setState({\r\n EngineeringManagers: values ? managersIdArray : [],\r\n }, () => this.requireFields());\r\n }\r\n\r\n clearEndDateProject = () => {\r\n this.setState({\r\n endDate: null,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onSave = () => {\r\n const { isStep1FieldsRequired } = this.state;\r\n const { onSave, isProjectNameDublicateError } = this.props;\r\n if (isProjectNameDublicateError) {\r\n this.setState({\r\n projectNameError: true,\r\n isStep1FieldsRequired: false,\r\n });\r\n return;\r\n }\r\n if (isStep1FieldsRequired) {\r\n onSave(this.state);\r\n }\r\n }\r\n\r\n onNextStep = () => {\r\n const {\r\n isStep1FieldsRequired,\r\n clientId,\r\n } = this.state;\r\n const {\r\n onStepChange, setClientId, isProjectNameDublicateError,\r\n } = this.props;\r\n if (isProjectNameDublicateError) {\r\n this.setState({\r\n projectNameError: true,\r\n isStep1FieldsRequired: false,\r\n });\r\n return;\r\n }\r\n if (isStep1FieldsRequired) {\r\n onStepChange({\r\n ...this.state,\r\n step: 1,\r\n });\r\n setClientId(clientId);\r\n }\r\n }\r\n\r\n onCancel = () => {\r\n const { location } = this.props;\r\n history.push({\r\n pathname: '/projects',\r\n state: location.state,\r\n });\r\n }\r\n\r\n clearValue = () => (property) => {\r\n this.setState(\r\n property === 'clientId' ? {\r\n [property]: '',\r\n clientManagerId: '',\r\n }\r\n : { [property]: '' },\r\n () => this.requireFields(),\r\n );\r\n }\r\n\r\n checkProjectNameDublicateError = (e) => {\r\n const { checkProjectNameDublicateError } = this.props;\r\n checkProjectNameDublicateError(e.target.value);\r\n }\r\n\r\n clearProjectError = () => {\r\n this.setState({\r\n projectNameError: false,\r\n });\r\n }\r\n\r\n clearOffices = () => {\r\n this.setState(\r\n { offices: [], primaryOffices: [] },\r\n () => this.requireFields(),\r\n );\r\n }\r\n\r\n clearPrimaryOffices = () => {\r\n this.setState(\r\n { primaryOffices: [] },\r\n () => this.requireFields(),\r\n );\r\n }\r\n\r\n handleChangeSuggestBox = (value) => {\r\n this.setState({\r\n currentDeliveryManagers: value,\r\n });\r\n };\r\n\r\n handleChangeSuggestBoxEngManagers = (value) => {\r\n this.setState({\r\n currentEngineeringManagers: value,\r\n });\r\n };\r\n\r\n handleChangeCurrency = (e) => {\r\n this.setState({\r\n currency: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n render() {\r\n const {\r\n projectNameError,\r\n name,\r\n projectType,\r\n projectCode,\r\n offices,\r\n primaryOffices,\r\n clientId,\r\n clientManagerId,\r\n clientManagerDisebled,\r\n isBillableTrainee,\r\n accountManagerId,\r\n startDate,\r\n aliases,\r\n endDate,\r\n endDateDisebled,\r\n description,\r\n isStep1FieldsRequired,\r\n deliveryManagersOptions,\r\n currentDeliveryManagers,\r\n engineeringManagersOption,\r\n currentEngineeringManagers,\r\n currency,\r\n ProjectBillingCode,\r\n engagementTypeId,\r\n } = this.state;\r\n const {\r\n projectTypes,\r\n officesProps,\r\n clients,\r\n clientContacts,\r\n accountManagersByOffice,\r\n allCurrencies,\r\n allEngagementTypes,\r\n } = this.props;\r\n return (\r\n
\r\n = i + 1 })} />\r\n ) : null\r\n }\r\n
\r\n );\r\n }\r\n}\r\n\r\nProgressBarComponent.propTypes = {\r\n stepNames: PropTypes.array,\r\n selectedStep: PropTypes.number\r\n};\r\n\r\nexport default ProgressBarComponent;\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nimport './select.css';\r\n\r\nimport {\r\n FormControl, Select as MaterialSelect, InputLabel, MenuItem,\r\n} from '@material-ui/core';\r\nimport CustomIcon from '../../icon/Icon';\r\n\r\nclass Select extends React.Component {\r\n clearValue = () => {\r\n const { name, clearValue } = this.props;\r\n if (name) {\r\n clearValue(name);\r\n }\r\n clearValue();\r\n }\r\n\r\n render() {\r\n const {\r\n label,\r\n value,\r\n showClear = false,\r\n formClassName,\r\n selectClassName,\r\n optionsClassName,\r\n inputProps,\r\n onChange,\r\n onBlur,\r\n selectOptions,\r\n isOptionObject,\r\n placeholder,\r\n isRequired,\r\n disabled,\r\n extendedValue,\r\n helperText,\r\n clearClassName,\r\n onClose,\r\n onFocus,\r\n addEmployeeStyles,\r\n open,\r\n MenuProps,\r\n } = this.props;\r\n\r\n const selectValue = !!value || value === 0 ? value : 'none';\r\n\r\n return (\r\n = i })} />\r\n
\r\n );\r\n })\r\n }\r\n \r\n 0 })}>\r\n {`${i + 1}.${stepName}`}\r\n \r\n
\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 Project with the same name already exists
: null}\r\n\r\n
\r\n \r\n offices.find(elem => item.Id === elem))}\r\n placeholder='Choose Primary Offices'\r\n isRequired\r\n clearValue={this.clearPrimaryOffices}\r\n tabId='primaryOffices-tabindex'\r\n disabled={!offices.length}\r\n />\r\n item.ClientId === clientId)}\r\n disabled={clientManagerDisebled}\r\n isRequired={!isBillableTrainee}\r\n inputProps={{\r\n name: 'Client Manager',\r\n id: 'client_manager',\r\n }}\r\n helperText='Choose Client first'\r\n showClear\r\n isAddingFeature\r\n parentEntityId={clientId}\r\n isClientManager\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 Save and Close\r\n
\r\n \r\n \r\n Next\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from '../icon/Icon';\r\nimport { getId } from 'services/location';\r\nimport { UpdateDocumentItem } from './update-document-item';\r\nimport { getDocumentTypeName } from 'utils/documentsUtils';\r\n\r\nconst correctUrlRegExp = new RegExp('^(https?:\\\\/\\\\/)' // protocol\r\n + '(([a-z\\\\d]{1,}:[a-z\\\\d]{1,}@)?)' // auth\r\n + '((([a-z\\\\d]([a-z\\\\d-]*[a-z\\\\d])*)\\\\.?)+[a-z]{2,}|' // domain name\r\n + '((\\\\d{1,3}\\\\.){3}\\\\d{1,3}))' // ip address\r\n + '(\\\\:\\\\d+)?(\\\\/[-a-z\\\\d%_.~+]*)*' // port\r\n + '(\\\\?[;&a-z\\\\d%_.~+=-]*)?' // query string\r\n + '(\\\\#[-a-z\\\\d_]*)?$', 'i');\r\nconst httpRegExp = new RegExp('^(https?:?)');\r\n\r\nexport class DocumentItem extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { item, itemId } = this.props;\r\n this.state = {\r\n comment: item.Comment,\r\n showOptions: false,\r\n entityId: getId(),\r\n addDocument: {\r\n Id: item.Id ? item.Id : itemId,\r\n URL: item.URL,\r\n Comment: item.Comment,\r\n DocumentType: this.getDocumentType(),\r\n },\r\n editResumeBlockShow: false,\r\n blockSaveDocument: false,\r\n isNeedUpOptions: false,\r\n };\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { item, itemId } = this.props;\r\n if (prevProps.item !== item) {\r\n this.setState({\r\n addDocument: {\r\n Id: item.Id ? item.Id : itemId,\r\n URL: item.URL,\r\n Comment: item.Comment,\r\n DocumentType: this.getDocumentType(),\r\n },\r\n });\r\n }\r\n }\r\n\r\n getDocumentType = () => {\r\n const { item, isDocumentType } = this.props;\r\n return isDocumentType && item.DocumentType ? {\r\n Id: item.DocumentType.Id,\r\n Name: item.DocumentType.Name,\r\n } : null;\r\n }\r\n\r\n toggleShowOptions = (item, event) => {\r\n const { showOptions } = this.state;\r\n const { onItemClick } = this.props;\r\n if (item === 'options') {\r\n const elementPositions = event.target.getBoundingClientRect();\r\n const windowHeight = document.documentElement.clientHeight;\r\n const minLimitToBottom = 50;\r\n this.setState({\r\n showOptions: !showOptions,\r\n isNeedUpOptions: ((windowHeight - elementPositions.bottom) < minLimitToBottom),\r\n });\r\n event.stopPropagation();\r\n } else {\r\n onItemClick && onItemClick(item);\r\n }\r\n }\r\n\r\n hideOptions = () => {\r\n this.setState({\r\n showOptions: false,\r\n });\r\n }\r\n\r\n showEditDocument = () => {\r\n this.setState({\r\n editResumeBlockShow: true,\r\n });\r\n }\r\n\r\n closeEditDocument = (event) => {\r\n const { item } = this.props;\r\n const { addDocument } = this.state;\r\n event.stopPropagation();\r\n this.setState({\r\n addDocument: {\r\n ...addDocument,\r\n URL: item.URL,\r\n Comment: item.Comment,\r\n },\r\n editResumeBlockShow: false,\r\n });\r\n }\r\n\r\n deleteDocument = () => {\r\n const { onDeleteClick, item } = this.props;\r\n const { entityId, addDocument } = this.state;\r\n onDeleteClick({\r\n item,\r\n entityId,\r\n url: `employees/resume?id=${item.Id}`,\r\n searchUpdateSaga: 'employees/resume',\r\n stateItemId: addDocument.Id,\r\n });\r\n this.setState({\r\n editResumeBlockShow: false,\r\n });\r\n }\r\n\r\n onChangeNewDocumentObj = ({ target }) => {\r\n const { addDocument } = this.state;\r\n const { documentSelectOptions } = this.props;\r\n if (target.name === 'DocumentType') {\r\n this.setState({\r\n addDocument: {\r\n ...addDocument,\r\n DocumentType: {\r\n Id: target.value,\r\n Name: getDocumentTypeName(target.value, documentSelectOptions),\r\n },\r\n },\r\n }, this.newDocumentValidation);\r\n } else {\r\n this.setState({\r\n addDocument: {\r\n ...addDocument,\r\n [target.name]: target.value,\r\n },\r\n }, this.newDocumentValidation);\r\n }\r\n }\r\n\r\n newDocumentValidation = () => {\r\n const { addDocument } = this.state;\r\n const { isDocumentType } = this.props;\r\n if (isDocumentType) {\r\n this.setState({\r\n blockSaveDocument: addDocument.URL !== '' && addDocument.Comment !== '' && addDocument.DocumentType ? true : false,\r\n });\r\n } else {\r\n this.setState({\r\n blockSaveDocument: addDocument.URL !== '' && addDocument.Comment !== '' ? true : false,\r\n });\r\n }\r\n };\r\n\r\n newDocumentApply = (event) => {\r\n const { onEditClick } = this.props;\r\n const { addDocument, blockSaveDocument } = this.state;\r\n if (blockSaveDocument) {\r\n this.setState({\r\n blockSaveDocument: false,\r\n });\r\n onEditClick(addDocument);\r\n this.closeEditDocument(event);\r\n }\r\n }\r\n\r\n urlValidation = () => {\r\n const { addDocument } = this.state;\r\n let newString = addDocument.URL;\r\n if (newString && !correctUrlRegExp.test(newString)) {\r\n newString = newString.replace(httpRegExp, '');\r\n return 'https://' + newString;\r\n }\r\n return addDocument.URL;\r\n }\r\n\r\n generateTimeKey = () => {\r\n return new Date().getTime();\r\n }\r\n\r\n render() {\r\n const {\r\n itemId,\r\n columnsToDisplay,\r\n hideDots,\r\n onDeleteClick,\r\n onEditClick,\r\n isEditable,\r\n isDocumentType,\r\n documentSelectOptions,\r\n keyId,\r\n } = this.props;\r\n const {\r\n showOptions,\r\n editResumeBlockShow,\r\n blockSaveDocument,\r\n addDocument,\r\n isNeedUpOptions,\r\n } = this.state;\r\n return (\r\n \r\n Cancel\r\n
\r\n \r\n event.stopPropagation()}\r\n rel='noopener noreferrer'\r\n >\r\n {addDocument.Comment}\r\n \r\n
\r\n }\r\n \r\n ) : column.isType\r\n ? (\r\n editResumeBlockShow && isEditable\r\n ? null : \r\n event.stopPropagation()}\r\n >\r\n {addDocument.DocumentType && addDocument.DocumentType.Name}\r\n \r\n
\r\n )\r\n : null;\r\n })\r\n }\r\n {!hideDots && isEditable ? \r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n \r\n Cancel\r\n
\r\n \r\n \r\n \r\n
\r\n : null}\r\n {\r\n editResumeBlockShow && isEditable ? \r\n \r\n {showOptions\r\n ? (\r\n Delete item\r\n
\r\n )\r\n : null}\r\n \r\n }\r\n \r\n );\r\n }\r\n}\r\n\r\nManageItem.propTypes = {\r\n item: PropTypes.object,\r\n columnsToDisplay: PropTypes.array,\r\n onDeleteClick: PropTypes.func,\r\n};\r\n\r\nexport default connect(store => ({\r\n isAdmin: store.userRoleReducer.isAdmin,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n roles: store.userRoleReducer.roles,\r\n}))(ManageItem);\r\n","import * as React from 'react';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from '../icon/Icon';\r\nimport DocumentItem from './document-item';\r\nimport ManageItem from './manage-item.js';\r\nimport { NO_ITEMS_TITLE } from 'utils/const-variable';\r\n\r\nexport class DocumentList extends React.Component {\r\n render() {\r\n const {\r\n items,\r\n columnsToDisplay,\r\n setSortSettings,\r\n sortColumnName,\r\n sortDirection,\r\n actionLabel,\r\n onItemClick,\r\n onEditClick,\r\n onDeleteClick,\r\n hideDots,\r\n onEditOptions,\r\n isEditable = true,\r\n showItemsEditMenu = true,\r\n editManageItem,\r\n isCheckboxShown,\r\n checkItem,\r\n entityForMerge,\r\n isDocumentType,\r\n documentSelectOptions,\r\n viewFinancialInfo,\r\n } = this.props;\r\n return (\r\n \r\n \r\n Edit item\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nDocumentList.propTypes = {\r\n};\r\n\r\nexport default DocumentList;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport Dialog from '@material-ui/core/Dialog';\r\nimport DialogActions from '@material-ui/core/DialogActions';\r\nimport DialogContent from '@material-ui/core/DialogContent';\r\nimport DialogContentText from '@material-ui/core/DialogContentText';\r\nimport DialogTitle from '@material-ui/core/DialogTitle';\r\nimport CustomIcon from '../icon/Icon';\r\n\r\nimport './confirmation-dialog.css';\r\n\r\nexport class ConfirmationDialog extends Component {\r\n render() {\r\n const {\r\n dialogHeader,\r\n dialogTitle,\r\n closeButtonTitle,\r\n confirmButtonTitle,\r\n closeDialog, actionData, confirmDialog,\r\n isNeedWhiteSpace,\r\n autoWidth,\r\n } = this.props;\r\n const isNeedAddMarginTop = typeof(dialogTitle) === 'string' && dialogTitle.startsWith('Are');\r\n return (\r\n \r\n {\r\n columnsToDisplay && columnsToDisplay.map((column) => (
\r\n {\r\n items && items.length\r\n ? (\r\n items && items.length && items.map((item, i) => {\r\n return (\r\n editManageItem\r\n ? (\r\n {isCheckboxShown ? : null}\r\n
))\r\n }\r\n {actionLabel ? Action : null}\r\n \r\n {column.breakline ? (\r\n \r\n {column.Name.split(' ')[0]}\r\n
\r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n
\r\n \r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n
\r\n {sortColumnName === column.Id && sortDirection === 'Up'\r\n ? setSortSettings && setSortSettings(column.Id, 'Up')}\r\n className='pointer'\r\n />\r\n : setSortSettings && setSortSettings(column.Id, 'Up')}\r\n className='pointer'\r\n />\r\n }\r\n {sortColumnName === column.Id && sortDirection === 'Down'\r\n ? setSortSettings && setSortSettings(column.Id, 'Down')}\r\n className='pointer'\r\n />\r\n : setSortSettings && setSortSettings(column.Id, 'Down')}\r\n className='pointer'\r\n />\r\n }\r\n
\r\n {NO_ITEMS_TITLE}
\r\n }\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n {item.Name}\r\n
\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport classNames from 'classnames';\r\nimport { SowRenewalStatusItem } from './sow-renewal-status-item';\r\n\r\nexport class SowRenewalStatusList extends Component {\r\n calculationPercent = () => {\r\n const { items } = this.props;\r\n const percentForStatus = 100 - items.reduce((acc, item) => {\r\n return item.IsActive ? acc + +item.Value : acc;\r\n }, 0);\r\n return percentForStatus > 0 ? +percentForStatus.toFixed(2) : 0;\r\n }\r\n\r\n recalculationPercent = (renewalStatusId) => {\r\n const { items, onChange } = this.props;\r\n const countCheckedStatuses = items.filter((item) => item.IsActive && !+item.Value && item.RenewalStatusId !== renewalStatusId).length;\r\n const lastPercent = this.calculationPercent();\r\n const newStatuses = items.map((item) => !+item.Value && item.IsActive && item.RenewalStatusId !== renewalStatusId\r\n ? ({\r\n ...item,\r\n Value: +(+item.Value + lastPercent / countCheckedStatuses).toFixed(2),\r\n }) : item);\r\n onChange(newStatuses);\r\n }\r\n\r\n render() {\r\n const {\r\n items, columnsToDisplay, onChange,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","export const getTotalPercent = (statuses) => {\r\n return statuses && statuses.reduce((acc, status) => {\r\n return status.IsActive ? parseFloat(acc.toFixed(2)) + parseFloat(+status.Value) : acc;\r\n }, 0);\r\n};\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport classNames from 'classnames';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport Select from '../../../../common/components/form-items/select/select';\r\nimport DatePicker from '../../../../common/components/form-items/date-picker/date-picker';\r\nimport Checkbox from '../../../../common/components/form-items/checkbox/checkbox';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateDocumentItem } from 'common/components/documents-list/update-document-item';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport SearchDropdown from '../../../../common/components/form-items/search-dropdown/search-dropdown';\r\nimport {\r\n TIME_AND_MATERIAL,\r\n CREATE_PROJECT_DELETE_SOW_DIALOG_TITLE,\r\n CREATE_PROJECT_DELETE_PO_DIALOG_TITLE,\r\n MAX_QUANTITY_OF_DOCUMENTS,\r\n EXTENDED,\r\n FINISHED,\r\n TOTAL_PERCENT_FOR_RENEWAL_STATUSES,\r\n} from 'utils/const-variable';\r\nimport { sortDocumentByAlphabet, getDocumentTypeName, getUpdatedDocuments } from '../../../../utils/documentsUtils';\r\nimport isObjectNotEquals from '../../../../utils/object-comparison';\r\nimport { getStatusesForRequiredComment } from '../utils/createArrayWithStatusMatch';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { getConfigBasedOnCheckedDates } from 'utils/getConfigBasedOnCheckedDates';\r\nimport { getInitialRenewalStatusIdForNewProject } from 'pages/projects/components/utils/getInitialRenewalStatusIdForNewProject';\r\nimport { SowRenewalStatusList } from 'common/components/sow-renewal-status-list/sow-renewal-status-list';\r\nimport { getTotalPercent } from 'services/getTotalPercentForRenewalStatuses';\r\n\r\n// eslint-disable-next-line no-useless-escape\r\n\r\nconst regexForComment = /\\S/;\r\nconst checkIsSowEndDateRequired = (SOWDocumentStatusesId, documentStatuses) => {\r\n return documentStatuses.reduce((isSowEndDateRequired, status) => {\r\n return ((status.Name === EXTENDED || status.Name === FINISHED) && status.Id === SOWDocumentStatusesId) || isSowEndDateRequired;\r\n }, false);\r\n};\r\n\r\nexport class Step extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { initialState, isBillableTrainee, documentStatuses } = this.props;\r\n this.state = {\r\n SOWNumber: initialState.SOWNumber,\r\n SOWType: initialState.SOWType,\r\n approvalStatus: initialState.approvalStatus,\r\n POBillingCode: initialState.POBillingCode,\r\n SOWBillingCode: initialState.SOWBillingCode,\r\n startDateSOW: initialState.startDateSOW,\r\n endDateSOW: initialState.endDateSOW,\r\n SOWDescription: initialState.SOWDescription,\r\n SOWBudgetComments: initialState.SOWBudgetComments,\r\n PONumber: initialState.PONumber,\r\n POStatus: initialState.POStatus,\r\n POApprover: initialState.POApprover || initialState.SOWClientManagerId,\r\n startDatePO: initialState.startDatePO,\r\n endDatePO: initialState.endDatePO,\r\n PODescription: initialState.PODescription,\r\n POBudgetComments: initialState.POBudgetComments,\r\n SOWClientId: initialState.SOWClientId,\r\n POClientId: initialState.POClientId,\r\n invoiceApprover: initialState.invoiceApprover || initialState.SOWClientManagerId,\r\n businessGroup: initialState.businessGroup,\r\n projectTeam: initialState.projectTeam,\r\n SOWDocumentStatusesId: initialState.SOWDocumentStatusesId,\r\n PODocumentStatusesId: initialState.PODocumentStatusesId,\r\n travelBudget: initialState.travelBudget,\r\n travelReimbursement: initialState.travelReimbursement,\r\n isStep2FieldsRequired: initialState.isStep2FieldsRequired,\r\n disabledStep2Selects: initialState.disabledStep2Selects,\r\n sowEndDateDisabled: true,\r\n poEndDateDisabled: true,\r\n SOWDocuments: initialState.SOWDocuments || [],\r\n PODocuments: initialState.PODocuments || [],\r\n sowTypeIsRequired: isBillableTrainee,\r\n SOWPaymentTerm: initialState.SOWPaymentTerm,\r\n SOWInvoiceDate: initialState.SOWInvoiceDate,\r\n POPaymentTerm: initialState.POPaymentTerm,\r\n POInvoiceDate: initialState.POInvoiceDate,\r\n isSOWCommentFieldRequired: false,\r\n isPOCommentFieldRequired: false,\r\n isResetPOButtonDisabled: true,\r\n columnsToDisplay: {\r\n documentList: [\r\n {\r\n Name: 'Documents Links', isSelected: true, Id: 'URL', className: 'without-width-col', pressArrowLeft: true,\r\n },\r\n {\r\n Name: 'Documents Types', isType: true, Id: 'DocumentType', className: 'without-width-col', pressArrowLeft: true,\r\n },\r\n ],\r\n renewalStatusesList: [\r\n {\r\n Name: 'Status Type', Id: 'Status', className: 'col__renewal-status-type',\r\n },\r\n {\r\n Name: 'Value', Id: 'Value', className: 'col__renewal-value',\r\n },\r\n ],\r\n },\r\n showAddSowDocimentFields: false,\r\n addSOW: {},\r\n blockSaveAddSOW: false,\r\n deleteSOWDocumentIndex: '',\r\n deletePODocumentIndex: '',\r\n addPO: {},\r\n blockSaveAddPO: false,\r\n showAddPODocimentFields: false,\r\n showConfirmationDialog: false,\r\n confirmationDialogTitle: '',\r\n SowRenewalStatuses: initialState.SowRenewalStatuses,\r\n isSowEndDateRequired: checkIsSowEndDateRequired(initialState.SOWDocumentStatusesId, documentStatuses),\r\n isShowSowRenewalStatusList: false,\r\n showPopover: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { SOWClientId, startDateSOW, startDatePO } = this.state;\r\n this.checkSowType();\r\n this.setState(SOWClientId\r\n ? { disabledStep2Selects: false }\r\n : { disabledStep2Selects: true });\r\n this.setState(startDateSOW\r\n ? { sowEndDateDisabled: false }\r\n : { sowEndDateDisabled: true });\r\n this.setState(startDatePO\r\n ? { poEndDateDisabled: false }\r\n : { poEndDateDisabled: true });\r\n this.checkCommentFieldIsRequired('SOW');\r\n this.checkCommentFieldIsRequired('PO');\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState) {\r\n const {\r\n SOWType,\r\n PONumber,\r\n POStatus,\r\n POBillingCode,\r\n startDatePO,\r\n endDatePO,\r\n POPaymentTerm,\r\n PODescription,\r\n POBudgetComments,\r\n isResetPOButtonDisabled,\r\n POInvoiceDate,\r\n } = this.state;\r\n const { initialState, allRenewalStatuses } = this.props;\r\n const { SOWNumber } = initialState;\r\n if (prevProps.initialState.SOWNumber !== SOWNumber) {\r\n this.setState({\r\n SOWNumber,\r\n });\r\n }\r\n if (prevState.SOWType !== SOWType) {\r\n this.checkSowType();\r\n }\r\n if (isObjectNotEquals(prevProps.allRenewalStatuses, allRenewalStatuses)) {\r\n this.setState({ SowRenewalStatuses: getInitialRenewalStatusIdForNewProject(allRenewalStatuses) });\r\n }\r\n if (\r\n !isResetPOButtonDisabled\r\n && !PONumber\r\n && !POStatus\r\n && !POBillingCode\r\n && !startDatePO\r\n && !endDatePO\r\n && !POPaymentTerm\r\n && !PODescription\r\n && !POBudgetComments\r\n && !POInvoiceDate\r\n ) {\r\n this.setState({ isResetPOButtonDisabled: true });\r\n }\r\n }\r\n\r\n requireFields = () => {\r\n const {\r\n SOWNumber, SOWType, approvalStatus,\r\n SOWClientId, invoiceApprover, sowTypeIsRequired, POClientId,\r\n startDateSOW, endDateSOW, PONumber, POStatus, SOWDescription,\r\n isSOWCommentFieldRequired, PODescription, isPOCommentFieldRequired,\r\n startDatePO, endDatePO, POApprover, isSowEndDateRequired, SowRenewalStatuses,\r\n SOWInvoiceDate, POInvoiceDate,\r\n } = this.state;\r\n const totalRenewalStatusPercent = getTotalPercent(SowRenewalStatuses);\r\n if (!!SOWNumber\r\n && SOWType !== ''\r\n && approvalStatus !== ''\r\n && !!SOWClientId\r\n && (!!invoiceApprover || sowTypeIsRequired)\r\n && !!startDateSOW\r\n && (isSowEndDateRequired ? !!endDateSOW : true)\r\n && !PONumber\r\n && !POStatus\r\n && (regexForComment.test(SOWDescription) || !isSOWCommentFieldRequired)\r\n && (regexForComment.test(PODescription) || !isPOCommentFieldRequired)\r\n && !startDatePO\r\n && !endDatePO\r\n && +totalRenewalStatusPercent.toFixed(2) === TOTAL_PERCENT_FOR_RENEWAL_STATUSES\r\n && SOWInvoiceDate !== ''\r\n && !POInvoiceDate\r\n ) {\r\n this.setState({ isStep2FieldsRequired: true });\r\n } else if (!!PONumber\r\n && POStatus !== ''\r\n && !!startDatePO\r\n && !!endDatePO\r\n && (!!POApprover || sowTypeIsRequired)\r\n && !!SOWNumber\r\n && SOWType !== ''\r\n && (regexForComment.test(SOWDescription) || !isSOWCommentFieldRequired)\r\n && (regexForComment.test(PODescription) || !isPOCommentFieldRequired)\r\n && approvalStatus !== ''\r\n && !!POClientId\r\n && (!!invoiceApprover || sowTypeIsRequired)\r\n && !!startDateSOW\r\n && POInvoiceDate !== ''\r\n ) {\r\n this.setState({ isStep2FieldsRequired: true });\r\n } else {\r\n this.setState({ isStep2FieldsRequired: false });\r\n }\r\n }\r\n\r\n getStartDateForSow = () => {\r\n const { projectStartDate } = this.props;\r\n return {\r\n date: projectStartDate,\r\n type: 'project',\r\n };\r\n }\r\n\r\n getEndDateForSow = () => {\r\n const { projectEndDate } = this.props;\r\n return {\r\n date: projectEndDate,\r\n type: 'project',\r\n };\r\n }\r\n\r\n getStartDateForPo = () => {\r\n const { startDateSOW } = this.state;\r\n return {\r\n date: startDateSOW,\r\n type: 'SOW',\r\n };\r\n }\r\n\r\n getEndDateForPo = () => {\r\n const { endDateSOW } = this.state;\r\n const { projectEndDate } = this.props;\r\n return {\r\n date: endDateSOW || projectEndDate,\r\n type: endDateSOW ? 'SOW' : 'project',\r\n };\r\n }\r\n\r\n checkCommentFieldIsRequired = (type) => {\r\n const {\r\n SOWDocumentStatusesId, PODocumentStatusesId, approvalStatus, POStatus,\r\n } = this.state;\r\n const { documentStatuses, approvalStatuses } = this.props;\r\n const isMatchObject = {\r\n docStatus: type === 'SOW' ? SOWDocumentStatusesId : PODocumentStatusesId,\r\n approveStatus: type === 'SOW' ? approvalStatus : POStatus,\r\n };\r\n const isRequired = getStatusesForRequiredComment(documentStatuses, approvalStatuses).find((item) => {\r\n return !isObjectNotEquals(item, isMatchObject);\r\n }) !== undefined;\r\n this.setState(type === 'SOW'\r\n ? {\r\n isSOWCommentFieldRequired: isRequired,\r\n }\r\n : {\r\n isPOCommentFieldRequired: isRequired,\r\n }, () => this.requireFields());\r\n };\r\n\r\n onChangeSOWId = ({ target }) => {\r\n this.setState({\r\n SOWNumber: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeClient = target => {\r\n this.setState({\r\n SOWClientId: target ? target.value : '',\r\n disabledStep2Selects: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeInvoiceApprover = (item) => {\r\n this.setState({\r\n invoiceApprover: item ? item.value : '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSOWType = ({ target }) => {\r\n this.setState({\r\n SOWType: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeApprovalStatus = ({ target }) => {\r\n this.setState({\r\n approvalStatus: target.value,\r\n }, () => this.checkCommentFieldIsRequired('SOW'));\r\n }\r\n\r\n onChangeSOWPaymentTerm = ({ target }) => {\r\n this.setState({\r\n SOWPaymentTerm: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSOWInvoiceDate = ({ target }) => {\r\n this.setState({\r\n SOWInvoiceDate: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangePOPaymentTerm = ({ target }) => {\r\n this.setState({\r\n POPaymentTerm: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangePOInvoiceDate = ({ target }) => {\r\n this.setState({\r\n POInvoiceDate: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSOWBillingCode = ({ target }) => {\r\n this.setState({\r\n SOWBillingCode: target.value,\r\n }, () => this.requireFields());\r\n };\r\n\r\n onChangePOBillingCode = ({ target }) => {\r\n this.setState({\r\n POBillingCode: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n };\r\n\r\n onChangePOClient = target => {\r\n this.setState({\r\n POClientId: target ? target.value : '',\r\n disabledStep2Selects: false,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeBusinessGroup = ({ target }) => {\r\n this.setState({\r\n businessGroup: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeProjectTeam = ({ target }) => {\r\n this.setState({\r\n projectTeam: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSOWDocumentStatus = ({ target }) => {\r\n const { documentStatuses } = this.props;\r\n this.setState({\r\n isSowEndDateRequired: checkIsSowEndDateRequired(target.value, documentStatuses),\r\n SOWDocumentStatusesId: target.value,\r\n }, () => {\r\n const { documentStatuses } = this.props;\r\n const { SOWDocumentStatusesId } = this.state;\r\n const extendedStatus = documentStatuses.find((status) => status.Name === 'Extended');\r\n this.checkCommentFieldIsRequired('SOW');\r\n if (SOWDocumentStatusesId === extendedStatus.Id) {\r\n this.setState({\r\n SowRenewalStatuses: this.setRenewalStatusExtended(),\r\n });\r\n }\r\n });\r\n };\r\n\r\n onChangePODocumentStatus = ({ target }) => {\r\n this.setState({\r\n PODocumentStatusesId: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.checkCommentFieldIsRequired('PO'));\r\n };\r\n\r\n handleSOWStartDateChange = date => {\r\n const { showAlertDialog } = this.props;\r\n const config = getConfigBasedOnCheckedDates({\r\n startDatesParentContracts: this.getStartDateForSow(), endDatesParentContracts: this.getEndDateForSow(),\r\n }, null, date, 'SOW', true, true);\r\n if (!config) {\r\n this.setState({\r\n startDateSOW: date,\r\n sowEndDateDisabled: false,\r\n }, () => this.requireFields());\r\n } else {\r\n showAlertDialog(config.message);\r\n }\r\n }\r\n\r\n handleSOWEndDateChange = date => {\r\n const { showAlertDialog } = this.props;\r\n const startDatesParentContracts = this.getStartDateForSow();\r\n const endDatesParentContracts = this.getEndDateForSow();\r\n const config = getConfigBasedOnCheckedDates({ startDatesParentContracts, endDatesParentContracts }, null, date, 'SOW', true, true);\r\n if (!config) {\r\n this.setState({\r\n endDateSOW: date,\r\n }, () => this.requireFields());\r\n } else {\r\n showAlertDialog(config.message);\r\n }\r\n }\r\n\r\n clearSOWEndDate = () => {\r\n this.setState({\r\n endDateSOW: null,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSOWDescription = (e) => {\r\n this.setState({\r\n SOWDescription: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangePONumber = ({ target }) => {\r\n this.setState({\r\n PONumber: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangePOStatus = ({ target }) => {\r\n this.setState({\r\n POStatus: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.checkCommentFieldIsRequired('PO'));\r\n }\r\n\r\n onChangePOApprover = target => {\r\n this.setState({\r\n POApprover: target ? target.value : '',\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangePODescription = ({ target }) => {\r\n this.setState({\r\n PODescription: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n handlePOStartDateChange = date => {\r\n const { showAlertDialog } = this.props;\r\n const startDatesParentContracts = this.getStartDateForPo();\r\n const endDatesParentContracts = this.getEndDateForPo();\r\n const config = getConfigBasedOnCheckedDates({ startDatesParentContracts, endDatesParentContracts }, null, date, 'PO', true, true);\r\n if (!config) {\r\n this.setState({\r\n startDatePO: date,\r\n poEndDateDisabled: false,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n } else {\r\n showAlertDialog(config.message);\r\n }\r\n }\r\n\r\n handlePOEndDateChange = date => {\r\n const { showAlertDialog } = this.props;\r\n const startDatesParentContracts = this.getStartDateForPo();\r\n const endDatesParentContracts = this.getEndDateForPo();\r\n const config = getConfigBasedOnCheckedDates({ startDatesParentContracts, endDatesParentContracts }, null, date, 'PO', false, true);\r\n if (!config) {\r\n this.setState({\r\n endDatePO: date,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n } else {\r\n showAlertDialog(config.message);\r\n }\r\n }\r\n\r\n handleTravelBudgetChange = () => {\r\n const { travelBudget } = this.state;\r\n this.setState({\r\n travelBudget: !travelBudget,\r\n }, () => this.requireFields());\r\n }\r\n\r\n handleTravelReimbursementChange = () => {\r\n const { travelReimbursement } = this.state;\r\n this.setState({\r\n travelReimbursement: !travelReimbursement,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSOWBudgetComments = ({ target }) => {\r\n this.setState({\r\n SOWBudgetComments: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangePOBudgetComments = ({ target }) => {\r\n this.setState({\r\n POBudgetComments: target.value,\r\n isResetPOButtonDisabled: false,\r\n }, () => this.requireFields());\r\n }\r\n\r\n getNewSOWDocumentsChange = ({ target }) => {\r\n const { addSOW } = this.state;\r\n const { documentTypes } = this.props;\r\n if (target.name === 'DocumentType') {\r\n this.setState({\r\n addSOW: {\r\n ...addSOW,\r\n DocumentType: {\r\n Id: target.value,\r\n Name: getDocumentTypeName(target.value, documentTypes),\r\n },\r\n DocumentTypeId: target.value,\r\n },\r\n }, this.newSOWValidation);\r\n } else {\r\n this.setState({\r\n addSOW: {\r\n ...addSOW,\r\n [target.name]: target.value,\r\n },\r\n }, this.newSOWValidation);\r\n }\r\n }\r\n\r\n newSOWValidation = () => {\r\n const { addSOW } = this.state;\r\n this.setState(addSOW.URL.length && addSOW.Comment.length && addSOW.DocumentType\r\n ? { blockSaveAddSOW: true }\r\n : { blockSaveAddSOW: false });\r\n };\r\n\r\n showAddSowFields = () => {\r\n const { SOWDocuments } = this.state;\r\n if (SOWDocuments.length < MAX_QUANTITY_OF_DOCUMENTS) {\r\n this.setState({\r\n showAddSowDocimentFields: true,\r\n addSOW: { URL: '', Comment: '' },\r\n blockSaveAddSOW: false,\r\n });\r\n }\r\n }\r\n\r\n cancelAddSow = () => {\r\n this.setState({\r\n showAddSowDocimentFields: false,\r\n addSOW: {},\r\n blockSaveAddSOW: false,\r\n });\r\n }\r\n\r\n applyAddSow = () => {\r\n const { blockSaveAddSOW, addSOW, SOWDocuments } = this.state;\r\n if (blockSaveAddSOW) {\r\n const newSOWDocuments = SOWDocuments;\r\n newSOWDocuments.push(addSOW);\r\n this.setState({\r\n SOWDocuments: getUpdatedDocuments(newSOWDocuments),\r\n showAddSowDocimentFields: false,\r\n blockSaveAddSOW: false,\r\n }, () => this.requireFields());\r\n }\r\n }\r\n\r\n showSOWConfirmationDialog = (item) => {\r\n this.setState({\r\n showConfirmationDialog: true,\r\n confirmationDialogTitle: CREATE_PROJECT_DELETE_SOW_DIALOG_TITLE,\r\n deleteSOWDocumentIndex: item.stateItemId,\r\n });\r\n }\r\n\r\n editSowDocument = (item) => {\r\n const { SOWDocuments } = this.state;\r\n const deleteSowDocument = SOWDocuments;\r\n deleteSowDocument.splice(item.id, 1, item);\r\n const newDocuments = getUpdatedDocuments(deleteSowDocument);\r\n this.setState({\r\n SOWDocuments: sortDocumentByAlphabet(newDocuments),\r\n });\r\n }\r\n\r\n closeConfirmationDialog = () => {\r\n this.setState({\r\n showConfirmationDialog: false,\r\n confirmationDialogTitle: '',\r\n deleteSOWDocumentIndex: '',\r\n deletePODocumentIndex: '',\r\n });\r\n }\r\n\r\n showPOConfirmationDialog = (item) => {\r\n this.setState({\r\n showConfirmationDialog: true,\r\n confirmationDialogTitle: CREATE_PROJECT_DELETE_PO_DIALOG_TITLE,\r\n deletePODocumentIndex: item.stateItemId,\r\n });\r\n }\r\n\r\n showAddPOFields = () => {\r\n const { PODocuments } = this.state;\r\n if (PODocuments.length < MAX_QUANTITY_OF_DOCUMENTS) {\r\n this.setState({\r\n showAddPODocimentFields: true,\r\n addPO: { URL: '', Comment: '' },\r\n blockSaveAddPO: false,\r\n });\r\n }\r\n }\r\n\r\n cancelAddPO = () => {\r\n this.setState({\r\n showAddPODocimentFields: false,\r\n addPO: {},\r\n blockSaveAddPO: false,\r\n });\r\n }\r\n\r\n getNewPODocumentsChange = ({ target }) => {\r\n const { addPO } = this.state;\r\n const { documentTypes } = this.props;\r\n if (target.name === 'DocumentType') {\r\n this.setState({\r\n addPO: {\r\n ...addPO,\r\n DocumentType: {\r\n Id: target.value,\r\n Name: getDocumentTypeName(target.value, documentTypes),\r\n },\r\n DocumentTypeId: target.value,\r\n },\r\n }, this.newPOValidation);\r\n } else {\r\n this.setState({\r\n addPO: {\r\n ...addPO,\r\n [target.name]: target.value,\r\n },\r\n }, this.newPOValidation);\r\n }\r\n }\r\n\r\n newPOValidation = () => {\r\n const { addPO } = this.state;\r\n this.setState(addPO.URL.length && addPO.Comment.length && addPO.DocumentType\r\n ? { blockSaveAddPO: true }\r\n : { blockSaveAddPO: false });\r\n };\r\n\r\n applyAddPO = () => {\r\n const { blockSaveAddPO, addPO, PODocuments } = this.state;\r\n if (blockSaveAddPO) {\r\n const newPODocuments = PODocuments;\r\n newPODocuments.push(addPO);\r\n this.setState({\r\n PODocuments: getUpdatedDocuments(newPODocuments),\r\n showAddPODocimentFields: false,\r\n blockSaveAddPO: false,\r\n }, () => this.requireFields());\r\n }\r\n }\r\n\r\n editPoDocuments = (item) => {\r\n const { PODocuments } = this.state;\r\n const editPoDocument = PODocuments;\r\n editPoDocument.splice(item.id, 1, item);\r\n const newDocuments = getUpdatedDocuments(editPoDocument);\r\n this.setState({\r\n PODocuments: sortDocumentByAlphabet(newDocuments),\r\n });\r\n }\r\n\r\n deleteDocuments = () => {\r\n const { confirmationDialogTitle } = this.state;\r\n if (confirmationDialogTitle === CREATE_PROJECT_DELETE_SOW_DIALOG_TITLE) {\r\n const { SOWDocuments, deleteSOWDocumentIndex } = this.state;\r\n const deleteSowDocument = SOWDocuments;\r\n deleteSowDocument.splice(deleteSOWDocumentIndex, 1);\r\n this.setState({\r\n SOWDocuments: getUpdatedDocuments(deleteSowDocument),\r\n showAddSowDocimentFields: false,\r\n blockSaveAddSOW: false,\r\n showConfirmationDialog: false,\r\n confirmationDialogTitle: '',\r\n deleteSOWDocumentIndex: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n const { PODocuments, deletePODocumentIndex } = this.state;\r\n const deletePODocument = PODocuments;\r\n deletePODocument.splice(deletePODocumentIndex, 1);\r\n this.setState({\r\n PODocuments: getUpdatedDocuments(deletePODocument),\r\n showAddPODocimentFields: false,\r\n blockSaveAddPO: false,\r\n showConfirmationDialog: false,\r\n confirmationDialogTitle: '',\r\n deletePODocumentIndex: '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n checkSowType = () => {\r\n const { SOWTypes, isBillableTrainee } = this.props;\r\n const { SOWType } = this.state;\r\n const isSowRequired = SOWTypes.find((item) => {\r\n return item.Name === TIME_AND_MATERIAL;\r\n }).Id === +SOWType && isBillableTrainee;\r\n this.setState({\r\n sowTypeIsRequired: isSowRequired,\r\n }, () => this.requireFields());\r\n };\r\n\r\n onNextStep = () => {\r\n const { onStepChange } = this.props;\r\n const { isStep2FieldsRequired } = this.state;\r\n if (isStep2FieldsRequired) {\r\n onStepChange({\r\n ...this.state,\r\n step: 2,\r\n });\r\n }\r\n }\r\n\r\n onBack = () => {\r\n const { onBack } = this.props;\r\n onBack({\r\n ...this.state,\r\n });\r\n }\r\n\r\n onSave = () => {\r\n const { isStep2FieldsRequired } = this.state;\r\n const { onSave } = this.props;\r\n if (isStep2FieldsRequired) {\r\n onSave(this.state);\r\n }\r\n }\r\n\r\n clearValue = (property) => () => {\r\n this.setState(\r\n { [property]: '' },\r\n () => this.requireFields(),\r\n );\r\n }\r\n\r\n onChangeSOWRenewalStatuses = (renewalStatus, renewalStatusId) => {\r\n const { SowRenewalStatuses } = this.state;\r\n const rewenalStatuses = renewalStatusId ? SowRenewalStatuses.reduce((acc, item) => {\r\n if (item.RenewalStatusId === renewalStatusId) {\r\n acc.push(renewalStatus);\r\n } else {\r\n acc.push(item);\r\n }\r\n return acc;\r\n }, []) : [...renewalStatus];\r\n this.setState({\r\n SowRenewalStatuses: rewenalStatuses,\r\n }, () => this.requireFields());\r\n }\r\n\r\n setRenewalStatusExtended = () => {\r\n const { SowRenewalStatuses } = this.state;\r\n return SowRenewalStatuses.map((status) => status.Name === 'Renewal'\r\n ? ({ ...status, IsActive: true })\r\n : ({ ...status, IsActive: false }));\r\n }\r\n\r\n handleChangeShowPopover = () => {\r\n const { showPopover } = this.state;\r\n this.setState({\r\n showPopover: !showPopover,\r\n });\r\n }\r\n\r\n resetOriginalPo = () => {\r\n const { initialState } = this.props;\r\n\r\n this.setState(\r\n {\r\n PONumber: '',\r\n POStatus: '',\r\n POBillingCode: '',\r\n POClientId: initialState.POClientId,\r\n POApprover: initialState.POApprover || initialState.SOWClientManagerId,\r\n PODocumentStatusesId: initialState.PODocumentStatusesId,\r\n startDatePO: '',\r\n endDatePO: '',\r\n POPaymentTerm: '',\r\n PODescription: '',\r\n POBudgetComments: '',\r\n isPOCommentFieldRequired: false,\r\n poEndDateDisabled: true,\r\n isResetPOButtonDisabled: true,\r\n POInvoiceDate: '',\r\n },\r\n () => this.checkCommentFieldIsRequired('PO'),\r\n );\r\n }\r\n\r\n render() {\r\n const {\r\n SOWNumber,\r\n SOWType,\r\n approvalStatus,\r\n SOWClientId,\r\n invoiceApprover,\r\n disabledStep2Selects,\r\n sowTypeIsRequired,\r\n SOWBillingCode,\r\n startDateSOW,\r\n sowEndDateDisabled,\r\n endDateSOW,\r\n businessGroup,\r\n projectTeam,\r\n SOWDocumentStatusesId,\r\n travelBudget,\r\n travelReimbursement,\r\n SOWDescription,\r\n SOWBudgetComments,\r\n isSOWCommentFieldRequired,\r\n SOWDocuments,\r\n PONumber,\r\n POStatus,\r\n POBillingCode,\r\n startDatePO,\r\n poEndDateDisabled,\r\n endDatePO,\r\n POClientId,\r\n POApprover,\r\n PODocumentStatusesId,\r\n PODescription,\r\n POBudgetComments,\r\n isPOCommentFieldRequired,\r\n PODocuments,\r\n isStep2FieldsRequired,\r\n columnsToDisplay,\r\n showAddSowDocimentFields,\r\n addSOW,\r\n blockSaveAddSOW,\r\n showAddPODocimentFields,\r\n addPO,\r\n blockSaveAddPO,\r\n showConfirmationDialog,\r\n confirmationDialogTitle,\r\n SOWPaymentTerm,\r\n SOWInvoiceDate,\r\n POPaymentTerm,\r\n POInvoiceDate,\r\n SowRenewalStatuses,\r\n isSowEndDateRequired,\r\n showPopover,\r\n isResetPOButtonDisabled,\r\n } = this.state;\r\n\r\n const {\r\n SOWTypes,\r\n approvalStatuses,\r\n clients,\r\n clientContacts,\r\n documentStatuses,\r\n documentTypes,\r\n paymentTerms,\r\n allInvoiceDates,\r\n } = this.props;\r\n const totalPercent = +getTotalPercent(SowRenewalStatuses).toFixed(2);\r\n return (\r\n \r\n {\r\n columnsToDisplay && columnsToDisplay.map((column) => (\r\n
\r\n {\r\n items && items.length && items.map((item) => (\r\n \r\n {/* {isCheckboxShown ? : null} */}\r\n
))\r\n }\r\n \r\n {column.breakline ? (\r\n \r\n {column.Name.split(' ')[0]}\r\n
\r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n
\r\n \r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n
\r\n \r\n
\r\n \r\n SOW\r\n
\r\n \r\n this.clearValue('SOWType')}\r\n />\r\n
\r\n \r\n item.ClientId === SOWClientId))}\r\n disabled={disabledStep2Selects}\r\n isRequired={!sowTypeIsRequired}\r\n inputProps={{\r\n name: 'invoice approver',\r\n id: 'invoice_approver',\r\n }}\r\n showClear={sowTypeIsRequired}\r\n isAddingFeature\r\n parentEntityId={SOWClientId}\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 SOW Renewal Status\r\n *\r\n
\r\n \r\n
\r\n \r\n {\r\n showPopover ? (\r\n
\r\n \r\n
\r\n ) : null\r\n }\r\n Total percentage of SOW Renewal Status should be equal to 100%
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n : null\r\n }\r\n \r\n \r\n
\r\n \r\n ORIGINAL PO\r\n
\r\n \r\n
\r\n \r\n item.ClientId === SOWClientId))}\r\n disabled={disabledStep2Selects}\r\n isRequired={!sowTypeIsRequired}\r\n inputProps={{\r\n name: 'PO approver',\r\n id: 'po_approver',\r\n }}\r\n isAddingFeature\r\n parentEntityId={SOWClientId}\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Reset Original PO\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n : null\r\n }\r\n \r\n \r\n \r\n
\r\n \r\n \r\n Save and Close\r\n
\r\n \r\n \r\n Next\r\n
\r\n \r\n \r\n {showConfirmationDialog ? (\r\n \r\n Back\r\n
\r\n \r\n ![\"\"/](\"/assets/images/tail-spin.svg\")
\r\n
\r\n );\r\n\r\n return (\r\n \r\n \r\n {!isFlat\r\n // tslint:disable-next-line:jsx-wrap-multiline\r\n ?
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport Dialog from '@material-ui/core/Dialog';\r\nimport DialogActions from '@material-ui/core/DialogActions';\r\nimport DialogContent from '@material-ui/core/DialogContent';\r\nimport DialogContentText from '@material-ui/core/DialogContentText';\r\nimport DialogTitle from '@material-ui/core/DialogTitle';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nimport './alert-dialog.css';\r\n\r\nexport class AlertDialog extends Component {\r\n getDialogData = () => {\r\n const { dialogData } = this.props;\r\n let dialogMessage = '';\r\n for (const key in dialogData) {\r\n if (dialogData[key].length) {\r\n dialogMessage += '\\n • ' + key + ': \"' + dialogData[key].join(', ') + '\";';\r\n }\r\n }\r\n return dialogMessage;\r\n }\r\n\r\n render() {\r\n const {\r\n dialogHeader,\r\n dialogTitle,\r\n confirmButtonTitle,\r\n closeDialog,\r\n actionData,\r\n confirmDialog,\r\n dialogData,\r\n } = this.props;\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\nEditAssignmentModal.propTypes = {\r\n showModal: PropTypes.bool,\r\n closeModal: PropTypes.func,\r\n applyModal: PropTypes.func,\r\n employees: PropTypes.array,\r\n roleEmployeeStatus: PropTypes.array,\r\n};\r\n\r\nexport default connect(store => {\r\n return {\r\n employees: store.roleModalReducer.employees,\r\n roleEmployeeStatus: store.roleModalReducer.employeeStatus,\r\n isOnlyActiveRoles: store.showRoles.isOnlyActiveRoles,\r\n };\r\n}, {\r\n updateEditAssignment: '',\r\n})(EditAssignmentModal);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport formatCurrency from 'utils/formatCurrency';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\n\r\nexport class CellRate extends Component {\r\n renderBudgetInfo = (budget, currency) => {\r\n return budget ? formatCurrency(currency) + getAmericanFormat(budget) : `${formatCurrency(currency)}0`;\r\n }\r\n\r\n render() {\r\n const {\r\n item, column, viewFinancialInfo, config,\r\n } = this.props;\r\n const currency = config.CurrencyType && config.CurrencyType.currency && config.CurrencyType.currency.Name;\r\n const rate = item.Rate\r\n ? this.renderBudgetInfo(item.Rate, currency) + '·' + item.RateUnit.Name[0]\r\n : '';\r\n const overtimeRate = item.RateOvertime\r\n ? this.renderBudgetInfo(item.RateOvertime, currency) + '·' + item.OvertimeRateUnit.Name[0]\r\n : '';\r\n return viewFinancialInfo ? (\r\n \r\n EDIT ASSIGNMENT\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 Assignment cannot be empty
\r\n : null\r\n }\r\n\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n Status cannot be empty
\r\n : null\r\n }\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Add New\r\n
\r\n \r\n
\r\n {!isEmptyObject(editAssignment) ? \r\n
\r\n \r\n Back\r\n
\r\n \r\n
\r\n \r\n {\r\n (primaryAssignmentIndex || primaryAssignmentIndex === 0) ? (\r\n \r\n {\r\n employee.EmployeeName && (\r\n {employee.EmployeeName || '---'}\r\n
)\r\n }\r\n \r\n
\r\n ) : null\r\n }\r\n {\r\n isEmployeeEditing.EmployeeId || !employee.EmployeeId ? (\r\n \r\n {employee.EmployeeOffice}\r\n
\r\n \r\n {\r\n isEmployeeEditing.EmployeeAssignment && !disabled && employee.EmployeeId ? (\r\n {employee.EmployeeAssignment || '---'}\r\n }\r\n
\r\n \r\n {\r\n isEmployeeEditing.EmployeeStatusId && !disabled && employee.EmployeeId ? (\r\n \r\n {employee.EmployeeStatus || '---'}\r\n
\r\n )\r\n }\r\n \r\n \r\n {\r\n isEmployeeEditing.EmployeeComment && !disabled && employee.EmployeeId ? (\r\n {employee.EmployeeComment || '---'}\r\n }\r\n
\r\n \r\n {this.renderActionSVG()}\r\n {\r\n showOptionDots\r\n ?
\r\n {\r\n isAssignDuplicatedEmployeeDialogOpened && (\r\n \r\n
\r\n : null\r\n }\r\n {\r\n optionMenuOpened && (\r\n \r\n
\r\n )\r\n }\r\n \r\n Delete item\r\n
\r\n \r\n employeeKey === employee.AssignmentKey)}\r\n assignedEmployeesToProject={assignedEmployeesToProject}\r\n />\r\n {backupEmployees}\r\n
\r\n );\r\n }\r\n\r\n getTextForTooltip = () => {\r\n return (\r\n \r\n By default only active assignments are shown.\r\n
\r\n );\r\n };\r\n\r\n render() {\r\n const {\r\n isDeleteDialogOpened, actionData, confirmDialogMessage, assignedEmployees\r\n } = this.state;\r\n const { disabled, isOnlyActiveAssignments } = this.props;\r\n\r\n const employeesToShow = isOnlyActiveAssignments && assignedEmployees\r\n ? assignedEmployees.filter(employee => employee.EmployeeStatus !== PROJECT_ROLES_STATUS_REMOVED)\r\n : assignedEmployees;\r\n const filteredAssignedEmployees = this.filterAssignedEmployees();\r\n\r\n return (\r\n\r\n
\r\n \r\n \r\n
\r\n \r\n Assign employees to role\r\n
\r\n \r\n
\r\n {\r\n isDeleteDialogOpened && (\r\n \r\n
\r\n \r\n Employee\r\n
\r\n \r\n Office\r\n
\r\n \r\n Assignment\r\n
\r\n \r\n Start Date\r\n
\r\n \r\n End Date\r\n
\r\n \r\n Status\r\n
\r\n \r\n Comment\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {(item) => (\r\n this.renderAssignedEmployee(item, filteredAssignedEmployees)\r\n )}\r\n \r\n
\r\n \r\n {text}\r\n
\r\n );\r\n }\r\n}\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport moment from 'moment';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport {\r\n closeModal,\r\n addRoleToProject,\r\n showModal,\r\n getEmployees,\r\n} from '../../actions/roleModalActions';\r\nimport classNames from 'classnames';\r\nimport history from 'utils/history';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport InputCurrency from 'common/components/form-items/input-currency/input-currency';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport './role-modal.css';\r\nimport { AlertDialog } from 'common/components/alert-dialog/alert-dialog.js';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport sortArrayByPriority from 'utils/sortArrayByPriority';\r\nimport {\r\n PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n STATUS_BILLABLE,\r\n PROJECT_ROLES_EMPLOYEES_DISABLED,\r\n PROJECT_ROLES_EMPLOYEES_FORMER,\r\n DEFAULT_EMPLOYEE_ASSIGNMENTS,\r\n PROJECT_ROLES_STATUS_ACTIVE,\r\n} from 'utils/const-variable';\r\nimport AddEmployee from './add-employee/add-employee';\r\nimport { isCorrectRoleAssignment } from '../utils/isCorrectRoleAssignments';\r\nimport formatCurrency from 'utils/formatCurrency';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport { addRoleToPartialContract, cancelImport, stepBackImportRole } from '../../actions/importContractAction';\r\nimport Button from 'common/components/redux-form/components/button';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\n\r\n// eslint-disable-next-line no-useless-escape\r\nconst reqularExpRate = /^((?!0)|(0\\.))\\d{1,9}(\\,\\d{1,9}){0,3}?(\\.\\d{1,5})?$/;\r\nconst addRoleNewProjectType = 'ADD_ROLE_TO_NEW_PROJECT';\r\nconst addRoleToProjectType = 'ADD_ROLE_TO_PROJECT';\r\n\r\nexport class RoleModal extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n const {\r\n rolesState, projectId, rateUnits,\r\n } = this.props;\r\n\r\n this.state = {\r\n ItemId: (rolesState ? rolesState.length : 0),\r\n projectId,\r\n RoleName: '',\r\n RoleId: '',\r\n RoleType: '',\r\n SeniorityId: '',\r\n SeniorityLevel: '',\r\n BillableStatusId: '',\r\n BillableStatus: '',\r\n Rate: '',\r\n OvertimeRate: '',\r\n Comment: '',\r\n AssignmentTypeId: 1,\r\n AssignmentType: 'Offshore',\r\n Assignment: 1,\r\n StartDate: null,\r\n EndDate: null,\r\n BillingCodeId: '',\r\n BillingCode: '',\r\n StatusId: '',\r\n Status: '',\r\n roleType: PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n Employees: [],\r\n importedAssignments: [],\r\n isModalFieldsRequired: false,\r\n assignmentIsUnvalid: false,\r\n showConfirm: false,\r\n isDialogOpened: false,\r\n actionData: {},\r\n invalidRateData: false,\r\n invalidOverRateData: false,\r\n rateUnit: rateUnits ? rateUnits[0].Id : '',\r\n overtimeRateUnit: rateUnits ? rateUnits[0].Id : '',\r\n isEmployeeListValid: true,\r\n showConfirmationDialog: false,\r\n importDocumentBillingCodes: null,\r\n importDocumentBillingCodesStartDate: null,\r\n importDocumentBillingCodesEndDate: null,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n assignmentTypes, location, projectDetails, createdProjectName, setComponent, importedRoles,\r\n } = this.props;\r\n this.findArrValue(assignmentTypes);\r\n !(projectDetails.Name || createdProjectName) && history.goBack({ state: location.state });\r\n setComponent({ title: 'ADD ROLE' });\r\n if (importedRoles && importedRoles.length > 0) {\r\n this.getRoleImportDataInputs(importedRoles[0]);\r\n this.setImportedAssignments();\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { importedRoles, employees } = this.props;\r\n if (importedRoles !== prevProps.importedRoles && (importedRoles && importedRoles.length > 0)) {\r\n this.getRoleImportDataInputs(importedRoles[0]);\r\n }\r\n if (isObjectNotEquals(prevProps.importedRoles, importedRoles) || employees.length !== prevProps.employees.length) {\r\n this.setImportedAssignments();\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent } = this.props;\r\n resetComponent();\r\n }\r\n\r\n closeConfirmationDialog = () => {\r\n this.setState({\r\n ...this.state,\r\n showConfirmationDialog: false,\r\n });\r\n }\r\n\r\n showConfirmationDialog = () => {\r\n this.setState({\r\n ...this.state,\r\n showConfirmationDialog: true,\r\n });\r\n }\r\n\r\n findArrValue = (arr) => {\r\n arr.forEach(item => {\r\n if (item.Name === 'Offshore') {\r\n this.setState({\r\n AssignmentTypeId: item.Id,\r\n AssignmentType: item.Name,\r\n });\r\n }\r\n });\r\n }\r\n\r\n sortArrays = (array) => {\r\n return array.sort((a, b) => (a.Name > b.Name\r\n ? 1\r\n : (a.Name === b.Name ? 0 : -1)));\r\n }\r\n\r\n isValidRequired = () => {\r\n const {\r\n RoleName, RoleId, SeniorityId, BillableStatusId, Rate,\r\n BillableStatus, AssignmentTypeId, assignmentIsUnvalid,\r\n StartDate, EndDate, BillingCodeId, Status,\r\n invalidRateData, invalidOverRateData,\r\n } = this.state;\r\n\r\n return !!RoleName && !!RoleId && !!SeniorityId && !!BillableStatusId && !!AssignmentTypeId && !!Status\r\n && !assignmentIsUnvalid && !invalidRateData && !invalidOverRateData\r\n && !moment(StartDate).isAfter(EndDate) && !!StartDate && !!EndDate\r\n && (Rate || BillableStatus !== STATUS_BILLABLE)\r\n && (BillingCodeId !== '' || BillableStatus !== STATUS_BILLABLE);\r\n }\r\n\r\n requireFields = () => {\r\n const isModalFieldsRequired = this.isValidRequired();\r\n this.setState({\r\n isModalFieldsRequired,\r\n });\r\n }\r\n\r\n // RoleName\r\n onChangeRoleName = (event) => {\r\n this.setState({\r\n RoleName: event.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Role\r\n onChangeRole = ({ item }) => {\r\n this.setState({\r\n RoleId: item.Id,\r\n RoleType: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // SeniorityLevel\r\n onChangeSeniority = ({ item }) => {\r\n this.setState({\r\n SeniorityId: item.Id,\r\n SeniorityLevel: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // BillableStatus\r\n onChangeBillable = ({ item }) => {\r\n this.setState({\r\n BillableStatusId: item.Id,\r\n BillableStatus: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Rate\r\n onChangeRate = (e) => {\r\n if ((e.target.value.length && !reqularExpRate.test(e.target.value)) || (parseFloat(e.target.value) === 0)) {\r\n this.setState({\r\n invalidRateData: true,\r\n });\r\n } else {\r\n this.setState({\r\n invalidRateData: false,\r\n });\r\n }\r\n this.setState({\r\n Rate: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // OvertimeRate\r\n onChangeOvertimeRate = (e) => {\r\n if ((e.target.value.length && !reqularExpRate.test(e.target.value)) || (parseFloat(e.target.value) === 0)) {\r\n this.setState({\r\n invalidOverRateData: true,\r\n });\r\n } else {\r\n this.setState({\r\n invalidOverRateData: false,\r\n });\r\n }\r\n this.setState({\r\n OvertimeRate: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // AssignmentType\r\n onChangeAssignmentType = ({ item }) => {\r\n this.setState({\r\n AssignmentTypeId: item.Id,\r\n AssignmentType: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Assigment\r\n onChangeAssignment = (e) => {\r\n isCorrectRoleAssignment(e.target.value) && this.setState({\r\n Assignment: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Comment\r\n onChangeComment = (event) => {\r\n this.setState({\r\n Comment: event.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n setImportedAssignments = () => {\r\n const { importedRoles } = this.props;\r\n const importedAssignments = [];\r\n if (importedRoles && importedRoles[0] && importedRoles[0].Assignments) {\r\n importedRoles[0].Assignments.forEach((assignment) => {\r\n const importedAssignment = {\r\n EmployeeId: assignment.EmployeeId,\r\n EmployeeName: assignment.Name,\r\n EmployeeStartDate: assignment.StartDate,\r\n EmployeeEndDate: assignment.EndDate,\r\n };\r\n importedAssignments.push(importedAssignment);\r\n });\r\n if (importedAssignments.length) {\r\n this.setState({\r\n importedAssignments,\r\n });\r\n }\r\n }\r\n }\r\n\r\n // SOW/PO number\r\n onChangeBillingCode = ({ target }) => {\r\n const {\r\n billingCodes,\r\n billingCodesStartDate,\r\n billingCodesEndDate,\r\n projectDetails,\r\n } = this.props;\r\n const { importDocumentBillingCodesEndDate, importDocumentBillingCodesStartDate, importDocumentBillingCodes } = this.state;\r\n projectDetails && projectDetails.Contracts.forEach((contract) => {\r\n if (contract.Contract === target.value && contract.Status.Name !== PROJECT_ROLES_STATUS_ACTIVE) {\r\n this.toogleDialog();\r\n }\r\n if (contract.POs.length) {\r\n contract.POs.forEach((PO) => {\r\n if (PO.Contract === target.value && PO.Status.Name !== PROJECT_ROLES_STATUS_ACTIVE) {\r\n this.toogleDialog();\r\n }\r\n });\r\n }\r\n });\r\n this.setState({\r\n BillingCodeId: target.value,\r\n BillingCode: target.value,\r\n }, (importDocumentBillingCodesEndDate && importDocumentBillingCodesStartDate && importDocumentBillingCodes)\r\n ? () => this.onChangeDate(\r\n importDocumentBillingCodesStartDate[importDocumentBillingCodes.indexOf(target.value)],\r\n importDocumentBillingCodesEndDate[importDocumentBillingCodes.indexOf(target.value)],\r\n )\r\n : () => this.onChangeDate(billingCodesStartDate[billingCodes.indexOf(target.value)], billingCodesEndDate[billingCodes.indexOf(target.value)]));\r\n }\r\n\r\n onChangeDate = (StartDate, EndDate) => {\r\n this.setState({\r\n StartDate,\r\n EndDate,\r\n }, () => this.requireFields());\r\n }\r\n\r\n toogleDialog = () => {\r\n const { showConfirm } = this.state;\r\n this.setState({\r\n showConfirm: !showConfirm,\r\n });\r\n };\r\n\r\n // StartDate\r\n handleStartDateChange = date => {\r\n const {\r\n BillingCodeId, importDocumentBillingCodesEndDate, importDocumentBillingCodesStartDate, importDocumentBillingCodes,\r\n } = this.state;\r\n const {\r\n projectDetails: { StartDate, EndDate }, showAlertDialog, billingCodesStartDate, billingCodes, billingCodesEndDate,\r\n } = this.props;\r\n\r\n const billingIsSelected = !!BillingCodeId;\r\n const billingCodeStartDate = billingIsSelected\r\n && (\r\n importDocumentBillingCodes\r\n ? importDocumentBillingCodesStartDate[importDocumentBillingCodes.indexOf(BillingCodeId)]\r\n : billingCodesStartDate[billingCodes.indexOf(BillingCodeId)]\r\n );\r\n const billingCodeEndDate = importDocumentBillingCodes\r\n ? importDocumentBillingCodesEndDate[importDocumentBillingCodes.indexOf(BillingCodeId)]\r\n : billingCodesEndDate[billingCodes.indexOf(BillingCodeId)];\r\n if (!billingIsSelected && StartDate && moment(date).isBefore(StartDate, 'day')) {\r\n return showAlertDialog('Date is less than project start date, please change project start date.');\r\n }\r\n if (billingIsSelected && moment(billingCodeStartDate).isAfter(date, 'day')) {\r\n return showAlertDialog('Date is less than SOW/PO start date, please change SOW/PO start date.');\r\n }\r\n if (!billingIsSelected && moment(date).isAfter(EndDate, 'day')) {\r\n return showAlertDialog('Date exceeds project end date, please change project end date.');\r\n }\r\n if (billingIsSelected && billingCodeEndDate && moment(date).isAfter(billingCodeEndDate, 'day')) {\r\n return showAlertDialog('Date exceeds SOW/PO end date, please change SOW/PO end date.');\r\n }\r\n if (billingIsSelected && !billingCodeEndDate && moment(date).isAfter(EndDate, 'day')) {\r\n return showAlertDialog('Date exceeds project end date, please change project end date. (SOW/PO doesn`t have end date)');\r\n }\r\n\r\n this.setState({\r\n StartDate: date,\r\n }, () => this.requireFields());\r\n };\r\n\r\n // EndDate\r\n handleEndDateChange = date => {\r\n const { BillingCodeId, importDocumentBillingCodesEndDate, importDocumentBillingCodes } = this.state;\r\n const {\r\n projectDetails: { EndDate }, showAlertDialog, billingCodesEndDate, billingCodes,\r\n } = this.props;\r\n\r\n const billingIsSelected = !!BillingCodeId;\r\n const billingCodeEndDate = importDocumentBillingCodes\r\n ? importDocumentBillingCodesEndDate[importDocumentBillingCodes.indexOf(BillingCodeId)]\r\n : billingCodesEndDate[billingCodes.indexOf(BillingCodeId)];\r\n\r\n if (!billingIsSelected && moment(date).isAfter(EndDate)) {\r\n return showAlertDialog('Date exceeds project end date, please change project end date.');\r\n }\r\n if (billingIsSelected && billingCodeEndDate && moment(date).isAfter(billingCodeEndDate)) {\r\n return showAlertDialog('Date exceeds SOW/PO end date, please change SOW/PO end date.');\r\n }\r\n if (billingIsSelected && !billingCodeEndDate && moment(date).isAfter(EndDate)) {\r\n return showAlertDialog('Date exceeds project end date, please change project end date. (SOW/PO doesn`t have end date)');\r\n }\r\n\r\n this.setState({\r\n EndDate: date,\r\n }, () => this.requireFields());\r\n };\r\n\r\n // Status\r\n onChangeStatus = ({ item }) => {\r\n this.setState({\r\n Status: item.Name,\r\n StatusId: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeRateUnit = ({ item }) => {\r\n this.setState({\r\n rateUnit: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeOvertimeRateUnit = ({ item }) => {\r\n this.setState({\r\n overtimeRateUnit: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n clearStatus = () => {\r\n this.setState({\r\n Status: '',\r\n StatusId: '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n clearValue = (property) => () => {\r\n if (property === 'BillingCodeId') {\r\n this.setState({\r\n [property]: '',\r\n BillingCode: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n if (property === 'Rate') {\r\n this.setState({\r\n [property]: '',\r\n invalidRateData: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n if (property === 'OvertimeRate') {\r\n this.setState({\r\n [property]: '',\r\n invalidOverRateData: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n this.setState({\r\n [property]: '',\r\n }, () => this.requireFields());\r\n };\r\n\r\n checkEmployeeListValid = (isEmployeeListValid, Employees) => {\r\n this.setState({\r\n isEmployeeListValid,\r\n Employees,\r\n });\r\n }\r\n\r\n getFlatEmployeeList = (employees) => {\r\n const flatEmployeesArray = employees.reduce((flatArray, primary) => {\r\n !!primary.EmployeeId && flatArray.push(primary);\r\n primary.backupEmployees.forEach(backup => !!backup.EmployeeId && flatArray.push(backup));\r\n return flatArray;\r\n }, []);\r\n\r\n return flatEmployeesArray;\r\n }\r\n\r\n applyModal = (action) => {\r\n const { isModalFieldsRequired, isEmployeeListValid } = this.state;\r\n const {\r\n addRoleToProject,\r\n isOnlyActive,\r\n projectId,\r\n location,\r\n addNewRole,\r\n onStepChange,\r\n importedRoles,\r\n addRoleToPartialContract,\r\n projectDetails,\r\n importedContract,\r\n } = this.props;\r\n if (isModalFieldsRequired && isEmployeeListValid) {\r\n if (importedRoles && importedRoles.length > 0) {\r\n addRoleToPartialContract({ role: this.state, projectId: projectId || projectDetails.Id, isOnlyActive });\r\n return;\r\n }\r\n if (importedRoles && importedContract.roles && importedContract.roles.length > 0 && !importedRoles.length) return;\r\n if (action === addRoleNewProjectType) {\r\n addNewRole(this.state);\r\n onStepChange({\r\n ...this.state,\r\n step: 2,\r\n });\r\n } else if (action === addRoleToProjectType) {\r\n const state = { ...this.state };\r\n addRoleToProject(state, !isOnlyActive);\r\n history.push({\r\n pathname: `/projects/${projectId}`,\r\n state: location.state,\r\n });\r\n }\r\n }\r\n }\r\n\r\n cancelRolePage = (action) => {\r\n const { onStepChange, projectId, location } = this.props;\r\n if (action === addRoleNewProjectType) {\r\n onStepChange({\r\n ...this.state,\r\n step: 2,\r\n });\r\n } else if (action === addRoleToProjectType) {\r\n history.push({\r\n pathname: `/projects/${projectId}`,\r\n state: location.state,\r\n });\r\n }\r\n }\r\n\r\n cancelImportContract = () => {\r\n const { projectDetails, cancelImport } = this.props;\r\n cancelImport(projectDetails.Id);\r\n }\r\n\r\n onBackClick = () => {\r\n const { stepBackImportRole } = this.props;\r\n stepBackImportRole();\r\n }\r\n\r\n getCurrency = () => {\r\n const { projectDetails } = this.props;\r\n const currencyProject = projectDetails && projectDetails.Currency && projectDetails.Currency.Name;\r\n return formatCurrency(currencyProject);\r\n }\r\n\r\n getRoleImportDataInputs = (roleImport) => {\r\n const {\r\n importedRoles, projectId, rateUnits, importedContract, importedContractType, billingCodes, billingCodesEndDate, billingCodesStartDate,\r\n } = this.props;\r\n const billingCode = importedContractType === 'SOW' ? importedContract.SOWId\r\n : importedContractType === 'PO' || 'Amendment' ? importedContract.Number : '';\r\n if (roleImport !== null) {\r\n this.setState({\r\n ItemId: (importedRoles ? importedRoles.length : 0),\r\n projectId,\r\n RoleName: '',\r\n RoleId: roleImport.ExpertRole && roleImport.ExpertRole.Id || '',\r\n RoleType: roleImport.ExpertRole && roleImport.ExpertRole.Name || '',\r\n SeniorityId: roleImport.SeniorityLevel && roleImport.SeniorityLevel.Id || '',\r\n BillableStatusId: '',\r\n BillableStatus: '',\r\n Rate: '',\r\n OvertimeRate: '',\r\n Comment: '',\r\n AssignmentTypeId: roleImport.AssignmentType && roleImport.AssignmentType.Id || 2,\r\n Assignment: roleImport.Allocation || 1,\r\n StartDate: importedContract.StartDate || null,\r\n EndDate: importedContract.EndDate || null,\r\n BillingCodeId: billingCode || '',\r\n BillingCode: billingCode,\r\n StatusId: '',\r\n Status: '',\r\n roleType: PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n Employees: [],\r\n isModalFieldsRequired: false,\r\n assignmentIsUnvalid: false,\r\n showConfirm: false,\r\n isDialogOpened: false,\r\n actionData: {},\r\n invalidRateData: false,\r\n invalidOverRateData: false,\r\n rateUnit: rateUnits ? rateUnits[0].Id : '',\r\n overtimeRateUnit: rateUnits ? rateUnits[0].Id : '',\r\n isEmployeeListValid: true,\r\n showConfirmationDialog: false,\r\n ...roleImport,\r\n AssignmentType: roleImport.AssignmentType && roleImport.AssignmentType.Name || 'Offshore',\r\n SeniorityLevel: roleImport.SeniorityLevel && roleImport.SeniorityLevel.Name || '',\r\n importDocumentBillingCodes: billingCode ? [...billingCodes, billingCode] : billingCodes,\r\n importDocumentBillingCodesStartDate: importedContract.StartDate ? [...billingCodesStartDate, importedContract.StartDate] : billingCodesStartDate,\r\n importDocumentBillingCodesEndDate: importedContract.EndDate ? [...billingCodesEndDate, importedContract.EndDate] : billingCodesEndDate,\r\n }, () => {\r\n this.requireFields();\r\n });\r\n }\r\n }\r\n\r\n getAssignerEmployeesToProject = () => {\r\n const { rolesState, projectDetails } = this.props;\r\n const employees = [];\r\n const roles = rolesState ? rolesState : projectDetails.Roles;\r\n \r\n for (const role of roles) {\r\n employees.push.apply(employees, role.Employees)\r\n }\r\n\r\n return employees;\r\n }\r\n\r\n render() {\r\n const {\r\n showConfirm,\r\n RoleId,\r\n SeniorityId,\r\n BillableStatusId,\r\n Employees,\r\n Rate,\r\n BillableStatus,\r\n OvertimeRate,\r\n AssignmentTypeId,\r\n assignmentIsUnvalid,\r\n Assignment,\r\n BillingCodeId,\r\n StartDate,\r\n EndDate,\r\n StatusId,\r\n Status,\r\n isModalFieldsRequired,\r\n RoleName,\r\n invalidRateData,\r\n invalidOverRateData,\r\n rateUnit,\r\n overtimeRateUnit,\r\n isEmployeeListValid,\r\n Comment,\r\n showConfirmationDialog,\r\n importDocumentBillingCodes,\r\n importedAssignments,\r\n } = this.state;\r\n const {\r\n roles,\r\n seniorityLevels,\r\n billableStatuses,\r\n assignmentTypes,\r\n billingCodes,\r\n roleStatus,\r\n roleModalAction,\r\n rateUnits,\r\n employees,\r\n currencyProject,\r\n importedRoles,\r\n projectTeams,\r\n } = this.props;\r\n const suitableEmployees = employees.filter(employee => {\r\n return employee.Type !== PROJECT_ROLES_EMPLOYEES_DISABLED\r\n && employee.Type !== PROJECT_ROLES_EMPLOYEES_FORMER;\r\n });\r\n const currency = currencyProject && formatCurrency(currencyProject);\r\n const assignedEmployeesToProject = this.getAssignerEmployeesToProject();\r\n\r\n return (\r\n \r\n \r\n {\r\n showConfirmationDialog ? (\r\n
\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nRoleModal.propTypes = {\r\n roles: PropTypes.array,\r\n seniorityLevels: PropTypes.array,\r\n billableStatuses: PropTypes.array,\r\n assignmentTypes: PropTypes.array,\r\n billingCodes: PropTypes.array,\r\n billingCodesStartDate: PropTypes.array,\r\n billingCodesEndDate: PropTypes.array,\r\n employees: PropTypes.array,\r\n projectId: PropTypes.string,\r\n roleModalAction: PropTypes.string,\r\n addRoleToProject: PropTypes.func,\r\n rateUnits: PropTypes.array,\r\n};\r\n\r\nexport default connect(store => {\r\n const {\r\n BillableStatuses = [],\r\n SeniorityLevels = [],\r\n Roles = [],\r\n AssignmentTypes = [],\r\n } = store.projectsReducer.projectRoleConfig;\r\n return {\r\n billableStatuses: BillableStatuses,\r\n seniorityLevels: SeniorityLevels,\r\n roles: Roles,\r\n assignmentTypes: AssignmentTypes,\r\n employees: store.roleModalReducer.employees,\r\n roleEmployees: store.roleModalReducer.roleEmployees,\r\n billingCodes: store.roleModalReducer.billingCodes,\r\n billingCodesStartDate: store.roleModalReducer.billingCodesStartDate,\r\n billingCodesEndDate: store.roleModalReducer.billingCodesEndDate,\r\n currentRoles: store.roleModalReducer.roles,\r\n projectId: store.roleModalReducer.projectId,\r\n roleModalAction: store.roleModalReducer.roleModalAction,\r\n roleStatus: store.roleModalReducer.status,\r\n roleEmployeeStatus: store.roleModalReducer.employeeStatus,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n projectDetails: store.projectsReducer.projectDetails,\r\n rateUnits: store.roleModalReducer.rateUnits,\r\n EmployeeId: store.authReducer.user.EmployeeId,\r\n currentRole: store.userRoleReducer.roles,\r\n importedRoles: store.importContractReducer.contract.Roles,\r\n importedContract: store.importContractReducer.partialContract.contract,\r\n importedContractType: store.importContractReducer.type,\r\n projectTeams: store.projectsReducer.projectTeams.Teams,\r\n };\r\n}, {\r\n closeModal,\r\n addRoleToProject,\r\n showModal,\r\n getEmployees,\r\n showAlertDialog,\r\n setComponent,\r\n resetComponent,\r\n addRoleToPartialContract,\r\n stepBackImportRole,\r\n cancelImport,\r\n})(RoleModal);\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport moment from 'moment';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport {\r\n closeModal,\r\n addRoleToProject,\r\n showModal,\r\n getEmployees,\r\n} from '../../actions/roleModalActions';\r\nimport classNames from 'classnames';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport { sortRoleEmployeesCreateProject } from 'utils/sortRoleEmployees';\r\nimport {\r\n PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n STATUS_BILLABLE,\r\n PROJECT_ROLES_EMPLOYEES_DISABLED,\r\n PROJECT_ROLES_EMPLOYEES_FORMER,\r\n DEFAULT_EMPLOYEE_ASSIGNMENTS,\r\n} from 'utils/const-variable';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\nimport './role-modal.css';\r\nimport AddEmployee from './add-employee/add-employee';\r\nimport sortArrayByPriority from 'utils/sortArrayByPriority';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { isCorrectRoleAssignment } from '../utils/isCorrectRoleAssignments';\r\n\r\n// eslint-disable-next-line no-useless-escape\r\nconst reqularExpRate = /^((?!0)|(0\\.))\\d{1,9}(\\,\\d{1,9}){0,3}?(\\.\\d{1,5})?$/;\r\n\r\nexport class EditRoleCreateProject extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { projectId, rateUnits } = this.props;\r\n this.state = {\r\n ItemId: 0,\r\n RoleName: '',\r\n projectId,\r\n RoleId: '',\r\n RoleType: '',\r\n SeniorityId: '',\r\n SeniorityLevel: '',\r\n BillableStatusId: '',\r\n BillableStatus: '',\r\n Rate: '',\r\n OvertimeRate: '',\r\n AssignmentTypeId: 1,\r\n AssignmentType: '',\r\n Assignment: 1,\r\n EmployeeAssignment: 1,\r\n StartDate: null,\r\n EndDate: null,\r\n StatusId: '',\r\n Status: '',\r\n BillingCodeId: '',\r\n BillingCode: '',\r\n roleType: '',\r\n Comment: '',\r\n PrimaryAssignmentId: '',\r\n PrimaryEmployeeName: '',\r\n isModalFieldsRequired: false,\r\n assignmentIsUnvalid: false,\r\n invalidRateData: false,\r\n invalidOverRateData: false,\r\n isEmployeeListValid: true,\r\n rateUnit: rateUnits ? rateUnits[0].Id : '',\r\n overtimeRateUnit: rateUnits ? rateUnits[0].Id : '',\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { roleEdit, assignmentTypes } = this.props;\r\n const assignedEmployees = [];\r\n\r\n sortRoleEmployeesCreateProject(roleEdit.Employees).forEach((employee, index, employees) => {\r\n if (!employee.PrimaryAssignmentId || employee.Role === PROJECT_ROLES_EMPLOYEES_PRIMARY) {\r\n const backups = [];\r\n employees.forEach(backup => backup.PrimaryAssignmentId\r\n && (\r\n backup.PrimaryAssignmentId === employee.Id\r\n || backup.PrimaryAssignmentId === employee.AssignmentKey\r\n || backup.PrimaryAssignmentId === employee.EmployeeId\r\n )\r\n && backups.push(this.getEmployeeDataModel(backup, [])));\r\n assignedEmployees.push(this.getEmployeeDataModel(employee, backups));\r\n }\r\n });\r\n\r\n this.findArrValue(assignmentTypes);\r\n this.setState({\r\n RoleName: roleEdit.RoleName,\r\n ItemId: roleEdit.ItemId,\r\n projectId: roleEdit.projectId,\r\n RoleId: roleEdit.RoleId,\r\n RoleType: roleEdit.RoleType,\r\n SeniorityId: roleEdit.SeniorityId,\r\n SeniorityLevel: roleEdit.SeniorityLevel,\r\n BillableStatusId: roleEdit.BillableStatusId,\r\n BillableStatus: roleEdit.BillableStatus,\r\n Rate: getAmericanFormat(roleEdit.Rate),\r\n OvertimeRate: getAmericanFormat(roleEdit.OvertimeRate),\r\n AssignmentTypeId: roleEdit.AssignmentTypeId,\r\n AssignmentType: roleEdit.AssignmentType,\r\n Assignment: roleEdit.Assignment,\r\n StartDate: roleEdit.StartDate,\r\n EndDate: roleEdit.EndDate,\r\n StatusId: roleEdit.StatusId,\r\n Status: roleEdit.Status,\r\n BillingCodeId: roleEdit.BillingCodeId,\r\n BillingCode: roleEdit.BillingCode,\r\n Comment: roleEdit.Comment,\r\n roleType: PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n Employees: assignedEmployees,\r\n rateUnit: roleEdit.rateUnit,\r\n overtimeRateUnit: roleEdit.overtimeRateUnit,\r\n }, () => this.requireFields());\r\n }\r\n\r\n getEmployeeDataModel = (employee, backups) => {\r\n return {\r\n AssignmentKey: employee.AssignmentKey,\r\n EmployeeId: employee.Id,\r\n EmployeeName: employee.Name,\r\n EmployeeAssignment: employee.Assignment,\r\n EmployeeStartDate: employee.StartDate,\r\n EmployeeEndDate: employee.EndDate,\r\n EmployeeStatusId: employee.Status && (employee.Status.Id || employee.StatusId),\r\n EmployeeStatus: employee.Status && (employee.Status.Name || employee.Status),\r\n EmployeeRole: employee.EmployeeRole || employee.Role,\r\n EmployeeComment: employee.Comment,\r\n primaryAssignmentId: employee.PrimaryAssignmentId,\r\n isValidEmployee: true,\r\n backupEmployees: backups,\r\n };\r\n }\r\n\r\n findArrValue = (arr) => {\r\n arr.forEach(item => {\r\n if (item.Name === 'Offshore') {\r\n this.setState({\r\n AssignmentTypeId: item.Id,\r\n AssignmentType: item.Name,\r\n });\r\n }\r\n });\r\n }\r\n\r\n sortArrays = (array) => {\r\n return array.sort((a, b) => (a.Name > b.Name\r\n ? 1\r\n : (a.Name === b.Name ? 0 : -1)));\r\n }\r\n\r\n requireFields = () => {\r\n const {\r\n RoleName, BillableStatus, Rate, assignmentIsUnvalid,\r\n BillingCodeId, invalidRateData, invalidOverRateData,\r\n } = this.state;\r\n (this.stateRequairedFieldsIsNotEmpty()\r\n && (BillableStatus === STATUS_BILLABLE ? Rate : true)\r\n && this.stateRequairedFieldsCheckDate()\r\n && (BillableStatus === STATUS_BILLABLE ? !!BillingCodeId : true)\r\n && !assignmentIsUnvalid\r\n && !invalidRateData\r\n && !!RoleName\r\n && !invalidOverRateData) ? (\r\n this.setState({\r\n isModalFieldsRequired: true,\r\n })\r\n ) : (\r\n this.setState({\r\n isModalFieldsRequired: false,\r\n EmployeeStartDate: null,\r\n EmployeeEndDate: null,\r\n EmployeeAssignment: '',\r\n })\r\n );\r\n }\r\n\r\n stateRequairedFieldsIsNotEmpty = () => {\r\n const {\r\n SeniorityId, BillableStatusId, AssignmentTypeId, Status, RoleId,\r\n } = this.state;\r\n const checkObject = {\r\n SeniorityId, BillableStatusId, AssignmentTypeId, Status, RoleId,\r\n };\r\n let validation = true;\r\n for (const key in checkObject) {\r\n if (checkObject[key] === '') {\r\n validation = false;\r\n }\r\n }\r\n return validation;\r\n }\r\n\r\n stateRequairedFieldsCheckDate = () => {\r\n const { StartDate, EndDate } = this.state;\r\n return StartDate !== null && EndDate !== null && moment(StartDate).isAfter(EndDate) === false;\r\n }\r\n\r\n // RoleName\r\n onChangeRoleName = (event) => {\r\n this.setState({\r\n RoleName: event.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Role\r\n onChangeRole = ({ item }) => {\r\n this.setState({\r\n RoleId: item.Id,\r\n RoleType: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // SeniorityLevel\r\n onChangeSeniority = ({ item }) => {\r\n this.setState({\r\n SeniorityId: item.Id,\r\n SeniorityLevel: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // BillableStatus\r\n onChangeBillable = ({ item }) => {\r\n this.setState({\r\n BillableStatusId: item.Id,\r\n BillableStatus: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Rate\r\n onChangeRate = (e) => {\r\n if ((e.target.value.length && !reqularExpRate.test(e.target.value)) || (parseFloat(e.target.value) === 0)) {\r\n this.setState({\r\n invalidRateData: true,\r\n });\r\n } else {\r\n this.setState({\r\n invalidRateData: false,\r\n });\r\n }\r\n this.setState({\r\n Rate: getAmericanFormat(e.target.value),\r\n }, () => this.requireFields());\r\n }\r\n\r\n // OvertimeRate\r\n onChangeOvertimeRate = (e) => {\r\n if ((e.target.value.length && !reqularExpRate.test(e.target.value)) || (parseFloat(e.target.value) === 0)) {\r\n this.setState({\r\n invalidOverRateData: true,\r\n });\r\n } else {\r\n this.setState({\r\n invalidOverRateData: false,\r\n });\r\n }\r\n this.setState({\r\n OvertimeRate: getAmericanFormat(e.target.value),\r\n }, () => this.requireFields());\r\n }\r\n\r\n // AssignmentType\r\n onChangeAssignmentType = ({ item }) => {\r\n this.setState({\r\n AssignmentTypeId: item.Id,\r\n AssignmentType: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Assigment\r\n onChangeAssignment = (e) => {\r\n if (isCorrectRoleAssignment(e.target.value)) {\r\n this.setState({\r\n assignmentIsUnvalid: false,\r\n });\r\n } else {\r\n this.setState({\r\n assignmentIsUnvalid: true,\r\n });\r\n }\r\n this.setState({\r\n Assignment: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // Comment\r\n onChangeComment = (event) => {\r\n this.setState({\r\n Comment: event.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // SOW/PO number\r\n onChangeBillingCode = ({ target }) => {\r\n const { billingCodes, billingCodesStartDate, billingCodesEndDate } = this.props;\r\n this.setState({\r\n BillingCodeId: target.value,\r\n BillingCode: target.value,\r\n }, () => {\r\n this.onChangeDate(billingCodesStartDate[billingCodes.indexOf(target.value)], billingCodesEndDate[billingCodes.indexOf(target.value)]);\r\n });\r\n }\r\n\r\n onChangeDate = (StartDate, EndDate) => {\r\n this.setState({\r\n StartDate,\r\n EndDate,\r\n }, () => this.requireFields());\r\n }\r\n\r\n // StartDate\r\n handleStartDateChange = date => {\r\n const { BillingCodeId } = this.state;\r\n const {\r\n showAlertDialog, billingCodesStartDate, billingCodes,\r\n } = this.props;\r\n\r\n const billingIsSelected = !!BillingCodeId;\r\n const billingCodeStartDate = billingIsSelected && billingCodesStartDate[billingCodes.indexOf(BillingCodeId)];\r\n\r\n if (billingIsSelected && moment(billingCodeStartDate).isAfter(date)) {\r\n return showAlertDialog('Date is less than SOW/PO start date, please change SOW/PO start date.');\r\n }\r\n this.setState({\r\n StartDate: date,\r\n }, () => this.requireFields());\r\n };\r\n\r\n // EndDate\r\n handleEndDateChange = date => {\r\n const { BillingCodeId } = this.state;\r\n const {\r\n showAlertDialog, billingCodesEndDate, billingCodes,\r\n } = this.props;\r\n\r\n const billingIsSelected = !!BillingCodeId;\r\n const billingCodeEndDate = billingCodesEndDate[billingCodes.indexOf(BillingCodeId)];\r\n\r\n\r\n if (billingIsSelected && billingCodeEndDate && moment(date).isAfter(billingCodeEndDate)) {\r\n return showAlertDialog('Date exceeds SOW/PO end date, please change SOW/PO end date.');\r\n }\r\n this.setState({\r\n EndDate: date,\r\n }, () => this.requireFields());\r\n };\r\n\r\n // Status\r\n onChangeStatus = ({ item }) => {\r\n this.setState({\r\n Status: item.Name,\r\n StatusId: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeRateUnit = ({ item }) => {\r\n this.setState({\r\n rateUnit: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeOvertimeRateUnit = ({ item }) => {\r\n this.setState({\r\n overtimeRateUnit: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n clearValue = (property) => () => {\r\n if (property === 'BillingCodeId') {\r\n this.setState({\r\n [property]: '',\r\n BillingCode: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n if (property === 'Rate') {\r\n this.setState({\r\n [property]: '',\r\n invalidRateData: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n if (property === 'OvertimeRate') {\r\n this.setState({\r\n [property]: '',\r\n invalidOverRateData: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n this.setState({\r\n [property]: '',\r\n }, () => this.requireFields());\r\n };\r\n\r\n checkEmployeeListValid = (isEmployeeListValid, Employees) => {\r\n this.setState({\r\n isEmployeeListValid,\r\n Employees,\r\n });\r\n }\r\n\r\n getFlatEmployeeList = (employees) => {\r\n const flatEmployeesArray = employees.reduce((flatArray, primary) => {\r\n !!primary.EmployeeId && flatArray.push(primary);\r\n primary.backupEmployees && primary.backupEmployees.forEach(backup => !!backup.EmployeeId && flatArray.push(backup));\r\n return flatArray;\r\n }, []);\r\n\r\n return flatEmployeesArray;\r\n }\r\n\r\n getListViewDataModel = (employees) => {\r\n const viewEmployees = employees.map(employee => ({\r\n AssignmentKey: employee.AssignmentKey,\r\n Id: employee.EmployeeId,\r\n Name: employee.EmployeeName,\r\n Role: employee.EmployeeRole,\r\n Assignment: employee.EmployeeAssignment,\r\n StatusId: employee.EmployeeStatusId,\r\n Status: employee.EmployeeStatus,\r\n StartDate: employee.EmployeeStartDate,\r\n EndDate: employee.EmployeeEndDate,\r\n Comment: employee.EmployeeComment,\r\n PrimaryAssignmentId: employee.primaryAssignmentId,\r\n }));\r\n\r\n return viewEmployees;\r\n }\r\n\r\n applyModal = () => () => {\r\n const { editRole } = this.props;\r\n const { isEmployeeListValid, isModalFieldsRequired, Employees } = this.state;\r\n const state = { ...this.state, Employees: this.getListViewDataModel(this.getFlatEmployeeList(Employees)) };\r\n isEmployeeListValid && isModalFieldsRequired && editRole(state);\r\n }\r\n\r\n cancelRolePage = () => () => {\r\n const { onStepChange } = this.props;\r\n onStepChange({\r\n step: 2,\r\n });\r\n }\r\n\r\n getAssignerEmployeesToProject = () => {\r\n const { rolesState } = this.props;\r\n const employees = [];\r\n for (const role of rolesState) {\r\n employees.push.apply(employees, role.Employees)\r\n }\r\n\r\n return employees;\r\n }\r\n\r\n render() {\r\n const {\r\n RoleId,\r\n SeniorityId,\r\n BillableStatusId,\r\n Rate,\r\n BillableStatus,\r\n OvertimeRate,\r\n AssignmentTypeId,\r\n assignmentIsUnvalid,\r\n Assignment,\r\n BillingCodeId,\r\n StartDate,\r\n EndDate,\r\n Status,\r\n StatusId,\r\n isModalFieldsRequired,\r\n RoleName,\r\n invalidOverRateData,\r\n invalidRateData,\r\n rateUnit,\r\n overtimeRateUnit,\r\n Employees,\r\n isEmployeeListValid,\r\n Comment,\r\n } = this.state;\r\n const {\r\n roles,\r\n seniorityLevels,\r\n billableStatuses,\r\n assignmentTypes,\r\n billingCodes,\r\n roleStatus,\r\n roleModalAction,\r\n rateUnits,\r\n employees,\r\n projectTeams,\r\n } = this.props;\r\n\r\n const suitableEmployees = employees.filter(employee => {\r\n return employee.Type !== PROJECT_ROLES_EMPLOYEES_DISABLED\r\n && employee.Type !== PROJECT_ROLES_EMPLOYEES_FORMER;\r\n });\r\n const assignedEmployeesToProject = this.getAssignerEmployeesToProject();\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n this.clearValue('Rate')}\r\n />\r\n {invalidRateData ?
\r\n Invalid Rate
: null}\r\n\r\n this.clearValue('OvertimeRate')}\r\n />\r\n {invalidOverRateData ?
\r\n Invalid Rate
: null}\r\n\r\n
\r\n \r\n
\r\n \r\n this.applyModal(roleModalAction)}\r\n >\r\n Apply Role\r\n
}\r\n \r\n {importedRoles && this.applyModal(roleModalAction)}\r\n >\r\n Apply and create next\r\n
: \r\n Cancel\r\n
: this.cancelRolePage(roleModalAction)}>\r\n Cancel\r\n
}\r\n {(importedRoles && importedRoles.length > 1) ? \r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nEditRoleCreateProject.propTypes = {\r\n roles: PropTypes.array,\r\n seniorityLevels: PropTypes.array,\r\n billableStatuses: PropTypes.array,\r\n assignmentTypes: PropTypes.array,\r\n billingCodes: PropTypes.array,\r\n billingCodesStartDate: PropTypes.array,\r\n billingCodesEndDate: PropTypes.array,\r\n employees: PropTypes.array,\r\n projectId: PropTypes.string,\r\n roleModalAction: PropTypes.string,\r\n rateUnits: PropTypes.array,\r\n projectTeams: PropTypes.array,\r\n};\r\n\r\nexport default connect(store => {\r\n const {\r\n BillableStatuses = [],\r\n SeniorityLevels = [],\r\n Roles = [],\r\n AssignmentTypes = [],\r\n } = store.projectsReducer.projectRoleConfig;\r\n return {\r\n billableStatuses: BillableStatuses,\r\n seniorityLevels: SeniorityLevels,\r\n roles: Roles,\r\n assignmentTypes: AssignmentTypes,\r\n employees: store.roleModalReducer.employees,\r\n roleEmployees: store.roleModalReducer.roleEmployees,\r\n billingCodes: store.roleModalReducer.billingCodes,\r\n billingCodesStartDate: store.roleModalReducer.billingCodesStartDate,\r\n billingCodesEndDate: store.roleModalReducer.billingCodesEndDate,\r\n currentRoles: store.roleModalReducer.roles,\r\n projectId: store.roleModalReducer.projectId,\r\n roleModalAction: store.roleModalReducer.roleModalAction,\r\n roleStatus: store.roleModalReducer.status,\r\n roleEmployeeStatus: store.roleModalReducer.employeeStatus,\r\n rateUnits: store.roleModalReducer.rateUnits,\r\n projectDetails: store.projectsReducer.projectDetails,\r\n projectTeams: store.projectsReducer.projectTeams.Teams,\r\n };\r\n}, {\r\n closeModal,\r\n addRoleToProject,\r\n showModal,\r\n getEmployees,\r\n showAlertDialog,\r\n})(EditRoleCreateProject);\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\n\r\nimport history from 'utils/history';\r\n\r\nimport { getStatus, getEmployeeStatus } from '../../actions/roleModalActions';\r\nimport {\r\n createNewProject, checkProjectNameDublicateError, getManagersByOffice, getAllCurrencies, getAllEngagementTypes,\r\n} from '../../actions/projectsActions';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport ProgressBarComponent from 'common/components/progress-bar/progress-bar';\r\nimport Step1 from './step-1.js';\r\nimport Step2 from './step-2.js';\r\nimport Step4 from './step-4.js';\r\nimport RoleModal from '../../components/role-modal/role-modal';\r\nimport EditRoleCreateProject from '../../components/role-modal/edit-role-create-project';\r\nimport { getManagePaymentTerms } from 'pages/admin/actions/adminManagePaymentTerms';\r\nimport {\r\n PROJECT_TYPE_BILLABLE,\r\n CREATE_PROJECT_SOW_TYPE_TIME_AND_MATERIAL,\r\n} from 'utils/const-variable';\r\nimport { loadManageDocumentTypes } from 'pages/admin/actions/adminManageDocumentTypes';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport { loadSOWRenewalStatuses } from 'pages/admin/actions/adminManageSOWRenewalStatus';\r\n\r\nimport './create-project.css';\r\nimport { getManageInvoiceDates } from '../../../admin/actions/adminManageInvoiceDates';\r\n\r\nexport class CreateProject extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { location: locationProps } = this.props;\r\n this.state = {\r\n step: 0,\r\n aliases: '',\r\n name: '',\r\n projectCode: '',\r\n offices: [],\r\n primaryOffices: [],\r\n clientId: '',\r\n SOWClientId: '',\r\n SOWClientManagerId: '',\r\n description: '',\r\n accountManagerId: '',\r\n deliveryManagerId: '',\r\n deliveryManagers: [],\r\n currentDeliveryManagers: [],\r\n EngineeringManagers: [],\r\n currentEngineeringManagers: [],\r\n clientManagerId: '',\r\n budget: '',\r\n approvalStatus: '',\r\n SOWPaymentTerm: '',\r\n SOWInvoiceDate: '',\r\n ProjectBillingCode: '',\r\n POBillingCode: '',\r\n SOWBillingCode: '',\r\n startDate: null,\r\n endDate: null,\r\n projectType: '',\r\n projectTypeName: '',\r\n isStep1FieldsRequired: false,\r\n isStep2FieldsRequired: false,\r\n isStep3FieldsRequired: false,\r\n disabledStep2Selects: true,\r\n disabledStep1Selects: true,\r\n SOWNumber: '',\r\n SOWBudget: '',\r\n SOWRevenue: '',\r\n SOWType: '',\r\n startDateSOW: null, // new Date(Date.now()),\r\n endDateSOW: null, // new Date(Date.now()),\r\n SOWDescription: '',\r\n SOWBudgetComments: '',\r\n businessGroup: '',\r\n projectTeam: '',\r\n SOWDocumentStatusesId: '',\r\n PODocumentStatusesId: '',\r\n PONumber: '',\r\n POBudget: '',\r\n PORevenue: '',\r\n POStatus: '',\r\n POClientId: '',\r\n startDatePO: null, // new Date(Date.now()),\r\n endDatePO: null, // new Date(Date.now()),\r\n POApprover: '',\r\n PODescription: '',\r\n POBudgetComments: '',\r\n stepNames: [],\r\n invoiceApprover: '',\r\n travelBudget: false,\r\n travelReimbursement: false,\r\n SOWDocuments: [],\r\n PODocuments: [],\r\n roles: [],\r\n editRoles: 0,\r\n isBillableTrainee: false,\r\n POPaymentTerm: '',\r\n POInvoiceDate: '',\r\n currency: '',\r\n SowRenewalStatuses: [],\r\n engagementTypeId: '',\r\n historyLocation: locationProps.state,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n documentStatuses, getStatus, getEmployeeStatus, loadManageDocumentTypes, getManagePaymentTerms, getAllCurrencies,\r\n setComponent, loadSOWRenewalStatuses, resetDefaultFilters, getAllEngagementTypes, getManageInvoiceDates,\r\n } = this.props;\r\n getStatus();\r\n getEmployeeStatus();\r\n this.findArrValue(documentStatuses);\r\n this.setInitialValueForRenewalStatuses();\r\n getAllEngagementTypes();\r\n loadManageDocumentTypes();\r\n getAllCurrencies();\r\n getManagePaymentTerms();\r\n loadSOWRenewalStatuses();\r\n setComponent({ returnButton: { text: 'Projects', goToPreviousPage: this.goTyProjectsList } });\r\n resetDefaultFilters && resetDefaultFilters();\r\n getManageInvoiceDates();\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState) {\r\n const { documentStatuses, projectTypes, allRenewalStatuses } = this.props;\r\n const { projectType } = this.state;\r\n if (prevProps.documentStatuses !== documentStatuses) {\r\n this.findArrValue(documentStatuses);\r\n }\r\n if (prevProps.allRenewalStatuses !== allRenewalStatuses) {\r\n this.setInitialValueForRenewalStatuses();\r\n }\r\n if (prevState.projectType !== projectType) {\r\n this.autoGenerateSOWNumber(projectTypes);\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent } = this.props;\r\n resetComponent();\r\n }\r\n\r\n findArrValue = (arr) => {\r\n arr.forEach((item) => {\r\n if (item.Name === 'Draft') {\r\n this.setState({\r\n SOWDocumentStatusesId: item.Id,\r\n PODocumentStatusesId: item.Id,\r\n });\r\n }\r\n });\r\n };\r\n\r\n autoGenerateSOWNumber = (projectTypes) => {\r\n const { projectType } = this.state;\r\n const getType = projectTypes.find(item => item.Id === projectType);\r\n this.setState({\r\n SOWNumber: getType && getType.Name.includes('Non-billable') ? 'SOW-1' : '',\r\n });\r\n };\r\n\r\n onChangeProjectType = (projectType) => {\r\n this.setState({\r\n projectType,\r\n });\r\n };\r\n\r\n onChangeStep = (state) => {\r\n const { step } = state;\r\n this.setState({\r\n ...this.state,\r\n ...state,\r\n step,\r\n });\r\n };\r\n\r\n onBack = (state) => {\r\n const { step } = this.state;\r\n this.setState({\r\n ...this.state,\r\n ...state,\r\n step: step - 1,\r\n });\r\n };\r\n\r\n onSubmit = (state) => {\r\n const { createNewProject } = this.props;\r\n this.setState({\r\n ...this.state,\r\n ...state,\r\n }, () => createNewProject(this.state));\r\n };\r\n\r\n setClientId = (clientId) => {\r\n const { SOWClientId } = this.state;\r\n this.setState(\r\n SOWClientId === ''\r\n ? {\r\n SOWClientId: clientId,\r\n POClientId: clientId,\r\n }\r\n : {},\r\n );\r\n };\r\n\r\n setSOWType = (type) => {\r\n this.setState({\r\n SOWType: type === PROJECT_TYPE_BILLABLE ? '' : CREATE_PROJECT_SOW_TYPE_TIME_AND_MATERIAL,\r\n });\r\n }\r\n\r\n getListEmployeeDataModel = (employee) => {\r\n return {\r\n AssignmentKey: employee.AssignmentKey,\r\n Id: employee.EmployeeId,\r\n Name: employee.EmployeeName,\r\n Assignment: employee.EmployeeAssignment,\r\n StartDate: employee.EmployeeStartDate,\r\n EndDate: employee.EmployeeEndDate,\r\n StatusId: employee.EmployeeStatusId,\r\n Status: employee.EmployeeStatus,\r\n Role: employee.EmployeeRole,\r\n Comment: employee.EmployeeComment,\r\n PrimaryAssignmentId: employee.primaryAssignmentId,\r\n };\r\n }\r\n\r\n addNewRole = (state) => {\r\n const Employees = state.Employees.reduce((Employees, employee) => {\r\n Employees.push(this.getListEmployeeDataModel(employee));\r\n employee.backupEmployees.forEach(backup => {\r\n Employees.push(this.getListEmployeeDataModel(backup));\r\n });\r\n return Employees;\r\n }, []);\r\n const newRole = {\r\n ...state,\r\n Employees,\r\n };\r\n const { roles } = this.state;\r\n const rolesCopi = roles;\r\n rolesCopi.push(newRole);\r\n this.setState({\r\n roles: rolesCopi,\r\n });\r\n }\r\n\r\n editRole = (obj) => {\r\n const { roles } = this.state;\r\n const rolesUpdate = roles.filter((item) => item.ItemId !== obj.ItemId);\r\n this.setState({\r\n roles: [...rolesUpdate, obj],\r\n }, () => this.setState({\r\n step: 2,\r\n }));\r\n }\r\n\r\n checkIsBillableTrainee = (isTrainee) => {\r\n this.setState({\r\n isBillableTrainee: isTrainee,\r\n });\r\n }\r\n\r\n goTyProjectsList = () => {\r\n const { location } = this.props;\r\n history.push({ pathname: '/projects', state: location.state });\r\n }\r\n\r\n setInitialValueForRenewalStatuses = () => {\r\n const { allRenewalStatuses } = this.props;\r\n const initialValue = allRenewalStatuses.map((status) => status.Name === 'New business' ? ({\r\n RenewalStatusId: status.Id,\r\n Name: status.Name,\r\n IsActive: true,\r\n Value: 100,\r\n }) : ({\r\n RenewalStatusId: status.Id,\r\n Name: status.Name,\r\n IsActive: false,\r\n Value: 0,\r\n }));\r\n this.setState({\r\n SowRenewalStatuses: initialValue,\r\n });\r\n }\r\n\r\n render() {\r\n const {\r\n step,\r\n aliases,\r\n projectCode,\r\n name,\r\n offices,\r\n primaryOffices,\r\n clientId,\r\n clientManagerId,\r\n description,\r\n accountManagerId,\r\n deliveryManagers,\r\n budget,\r\n approvalStatus,\r\n projectStatus,\r\n startDate,\r\n endDate,\r\n projectType,\r\n projectTypeName,\r\n isStep1FieldsRequired,\r\n disabledStep1Selects,\r\n SOWClientManagerId,\r\n SOWNumber,\r\n SOWBudget,\r\n SOWRevenue,\r\n SOWType,\r\n SOWClientId,\r\n SOWDocumentStatusesId,\r\n PODocumentStatusesId,\r\n startDateSOW,\r\n endDateSOW,\r\n SOWDescription,\r\n PONumber,\r\n POBudget,\r\n PORevenue,\r\n POClientId,\r\n startDatePO,\r\n POStatus,\r\n endDatePO,\r\n ProjectBillingCode,\r\n POBillingCode,\r\n SOWBillingCode,\r\n invoiceApprover,\r\n travelBudget,\r\n travelReimbursement,\r\n businessGroupId,\r\n projectTeamId,\r\n SOWDocuments,\r\n POApprover,\r\n PODescription,\r\n PODocuments,\r\n isStep2FieldsRequired,\r\n disabledStep2Selects,\r\n isBillableTrainee,\r\n roles,\r\n editRoles,\r\n historyLocation,\r\n currentDeliveryManagers,\r\n engineeringManagers,\r\n currentEngineeringManagers,\r\n SOWPaymentTerm,\r\n SOWInvoiceDate,\r\n POPaymentTerm,\r\n POInvoiceDate,\r\n currency,\r\n projectTeam,\r\n businessGroup,\r\n SOWBudgetComments,\r\n POBudgetComments,\r\n SowRenewalStatuses,\r\n engagementTypeId,\r\n } = this.state;\r\n const {\r\n location,\r\n documentTypes,\r\n checkProjectNameDublicateError,\r\n getManagersByOffice,\r\n paymentTerm,\r\n allCurrencies,\r\n allRenewalStatuses,\r\n allInvoiceDates,\r\n } = this.props;\r\n return (\r\n \r\n EDIT ROLE\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 Invalid Rate
: null}\r\n\r\n
\r\n }\r\n {\r\n Invalid Rate
: null}\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Apply Role\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n currency === item.Id).Name}\r\n documentTypes={documentTypes}\r\n paymentTerm={paymentTerm}\r\n onSave={this.onSubmit}\r\n onBack={this.onBack}\r\n onStepChange={this.onChangeStep}\r\n isBillableTrainee={isBillableTrainee}\r\n projectStartDate={startDate}\r\n projectEndDate={endDate}\r\n allRenewalStatuses={allRenewalStatuses}\r\n allInvoiceDates={allInvoiceDates}\r\n />\r\n ) : step === 2 ? (\r\n currency === item.Id)}\r\n onBack={this.onBack}\r\n onSubmit={this.onSubmit}\r\n onStepChange={this.onChangeStep}\r\n />\r\n ) : step === 3 ? (\r\n currency === item.Id).Name}\r\n addNewRole={this.addNewRole}\r\n />\r\n ) : step === 4 ? (\r\n item.ItemId === editRoles)}\r\n onStepChange={this.onChangeStep}\r\n editRole={this.editRole}\r\n rolesState={roles}\r\n />\r\n ) : null\r\n }\r\n
\r\n );\r\n }\r\n}\r\n\r\nCreateProject.propTypes = {\r\n projectTypes: PropTypes.array,\r\n createNewProject: PropTypes.func,\r\n documentStatuses: PropTypes.array,\r\n getStatus: PropTypes.func,\r\n getEmployeeStatus: PropTypes.func,\r\n documentTypes: PropTypes.array,\r\n loadManageDocumentTypes: PropTypes.func,\r\n};\r\n\r\nexport default connect(store => ({\r\n projectTypes: store.projectsReducer.projectTypes,\r\n documentStatuses: store.filtersReducer.filters.documentStatuses,\r\n user: store.authReducer.user,\r\n documentTypes: store.adminManageLookups.documentTypes,\r\n paymentTerms: store.adminManageLookups.paymentTerms,\r\n allCurrencies: store.projectsReducer.allCurrencies,\r\n allRenewalStatuses: store.adminManageLookups.sowRenewalStatuses,\r\n allInvoiceDates: store.adminManageLookups.invoiceDates,\r\n}), {\r\n createNewProject,\r\n getStatus,\r\n getEmployeeStatus,\r\n loadManageDocumentTypes,\r\n checkProjectNameDublicateError,\r\n getManagersByOffice,\r\n getManagePaymentTerms,\r\n getAllCurrencies,\r\n setComponent,\r\n resetComponent,\r\n loadSOWRenewalStatuses,\r\n getAllEngagementTypes,\r\n getManageInvoiceDates,\r\n})(CreateProject);\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport './tabs.css';\r\nimport CustomIcon from '../icon/Icon';\r\nimport HighlightOffIcon from '@material-ui/icons/HighlightOff';\r\n\r\nconst Tabs = ({\r\n list, selectedIndex, onTab, className, timeLeft, rolesTimeLeft,\r\n isErrorInRolesTab, isErrorInTimesheetsTab, isErrorInJustificationTab, isErrorInInvoiceTab,\r\n listToDisplay,\r\n}) => (\r\n
\r\n {\r\n step === 0 ? (\r\n \r\n Create new project\r\n
\r\n \r\n {\r\n list.map((title, i) => (\r\n \r\n {title}\r\n {title === 'Contracts' && timeLeft ?
);\r\n\r\nTabs.propTypes = {\r\n list: PropTypes.array,\r\n selectedIndex: PropTypes.number,\r\n onTab: PropTypes.func,\r\n className: PropTypes.string,\r\n};\r\n\r\nexport default Tabs;\r\n","export const filterChoosenExtendRoles = (extendedRoles, value, parent, isSelectedCheckbox, openedRoles) => {\r\n const roles = [...extendedRoles];\r\n if (!parent) {\r\n roles.map(item => item.Id === value ? item.checked = isSelectedCheckbox : null);\r\n roles.forEach((role, index) => {\r\n if (role.checked && openedRoles && openedRoles.includes(index.toString())) {\r\n role.Employees.forEach((child) => {\r\n if (typeof child.checked === 'undefined' && child.Status.Name !== 'Removed') {\r\n child.checked = isSelectedCheckbox;\r\n }\r\n });\r\n }\r\n });\r\n return roles;\r\n }\r\n roles.map((item) => item.Id === parent && item.Employees.map(child => child.Id === value ? child.checked = (child.checked === true ? false : isSelectedCheckbox) : null));\r\n return roles;\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Badge } from 'common/components/badges/badges';\r\nimport { getColorFromString } from 'services/getColor';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport moment from 'moment';\r\nimport Loader from 'react-loader-spinner';\r\nimport './project-history.css';\r\n\r\nexport class ProjectHistory extends Component {\r\n checkDateOrEmptyField = (incomingData) => {\r\n if (moment(incomingData, 'YYYY-MM-DD').isValid() && incomingData.includes('-')) {\r\n return moment(incomingData).format('YYYY-MM-DD');\r\n }\r\n return String(incomingData);\r\n }\r\n\r\n handleGetScrollParent = () => {\r\n const { scrollbarRef } = this.props;\r\n\r\n return scrollbarRef;\r\n }\r\n\r\n render() {\r\n const {\r\n history, changeAmountHistory, hasMoreHistory, isLoading, hasDefoultFinancialAccess, HasFinancialAccess,\r\n } = this.props;\r\n const hidenProperty = ['RealizedRevenue', 'BudgetComments', 'Budget', 'rate ', 'rateOvertime',\r\n 'ContractsAttachments', 'contractsAttachments'];\r\n return (\r\n <>\r\n {isLoading ? \r\n
\r\n );\r\n })}\r\n \r\n ) : null\r\n }\r\n \r\n );\r\n }\r\n}\r\n\r\nProjectHistory.propTypes = {\r\n history: PropTypes.array.isRequired,\r\n};\r\n","import moment from 'moment';\r\n\r\nconst objectFilter = (filtrationObject, value) => {\r\n for (const key in filtrationObject) {\r\n if (key === 'EndDate' || 'StartDate') {\r\n if (moment(filtrationObject[key], 'YYYY-MM-DD').format('MM/DD/YYYY').includes(value)) {\r\n return filtrationObject;\r\n }\r\n }\r\n if (key !== 'Id') {\r\n if ((typeof filtrationObject[key] !== 'object')) {\r\n if (filtrationObject[key].toString().toUpperCase().includes(value.toUpperCase())) {\r\n return filtrationObject;\r\n }\r\n } else {\r\n const deepResult = objectFilter(filtrationObject[key], value);\r\n if (deepResult) {\r\n return deepResult;\r\n }\r\n }\r\n }\r\n }\r\n};\r\n\r\nexport const recursiveSearch = (incomingData, value) => {\r\n return incomingData.filter((item) => {\r\n return objectFilter(item, value);\r\n });\r\n};\r\n","const compareArraysByItems = (firstArr, secondArr) => {\r\n if (firstArr.length !== secondArr.length) {\r\n return false;\r\n }\r\n\r\n const checkCompare = {};\r\n\r\n firstArr.forEach((item) => {\r\n const key = (typeof item) + item;\r\n if (!checkCompare[key]) {\r\n checkCompare[key] = 0;\r\n }\r\n checkCompare[key] += 1;\r\n });\r\n\r\n return secondArr.every((item) => {\r\n const key = (typeof item) + item;\r\n if (checkCompare[key]) {\r\n checkCompare[key] -= 1;\r\n return true;\r\n }\r\n return false;\r\n });\r\n};\r\n\r\nexport default compareArraysByItems;\r\n","import isEmptyObject from 'utils/isEmptyObject';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit';\r\nimport { getTotalPercent } from 'services/getTotalPercentForRenewalStatuses';\r\nimport { TOTAL_PERCENT_FOR_RENEWAL_STATUSES } from 'utils/const-variable';\r\nimport moment from 'moment';\r\n\r\nexport const required = (value, values, props, field, message = 'Value required') => {\r\n if (!isEmptyObject(props.data)) {\r\n let isRequired;\r\n switch (typeof value) {\r\n case 'number':\r\n if (field === 'Budget' && value === 0) {\r\n isRequired = true;\r\n } else {\r\n isRequired = !!value;\r\n }\r\n break;\r\n case 'string':\r\n isRequired = !!value.trim();\r\n break;\r\n case 'object':\r\n isRequired = !isEmptyObject(value) && !!value;\r\n break;\r\n default:\r\n isRequired = !!value;\r\n break;\r\n }\r\n return isRequired ? false : message;\r\n }\r\n};\r\n\r\nexport const currencyFormat = (value) => {\r\n if (value === null || value === 0) {\r\n return getAmericanFormat('0');\r\n }\r\n return getAmericanFormat(value);\r\n};\r\n\r\nexport const complexRequired = (value, values, props, field, condition) => {\r\n return condition && required(value, values, props);\r\n};\r\n\r\nexport const validateDate = {\r\n startDate: (value, values, props, field, EndDate = 'EndDate') => {\r\n if (!!value && moment(value).isValid() && moment(values[EndDate]).isValid()) {\r\n return moment(value).isSameOrBefore(moment(values[EndDate]), 'date')\r\n ? false\r\n : 'Start Date should be before End Date';\r\n }\r\n },\r\n endDate: (value, values, props, field, StartDate = 'StartDate') => {\r\n if (!!value && moment(value).isValid() && moment(values[StartDate]).isValid()) {\r\n return moment(value).isSameOrAfter(moment(values[StartDate]), 'date')\r\n ? false\r\n : 'End Date should be after Start Date';\r\n }\r\n },\r\n isValid: value => {\r\n return value === null || moment(value).isValid()\r\n ? false\r\n : 'Invalid date format';\r\n },\r\n};\r\n\r\nexport const validateMilestone = (value, message = 'Value required') => {\r\n return !value || !value.find((item) => (\r\n item.Milestone === ''\r\n || item.MilestoneAmount === ''\r\n || (item.RemainingBalanceOverridePossibility\r\n && (item.RemainingBalance === '' || item.RemainingBalance === '-' || item.RemainingBalance === null))))\r\n ? false : message;\r\n};\r\n\r\nexport const validateRenewalStatus = (value, message = 'Value required') => {\r\n const totalPercent = getTotalPercent(value);\r\n return !value || +totalPercent.toFixed(2) === TOTAL_PERCENT_FOR_RENEWAL_STATUSES ? false : message;\r\n};\r\n","export const validateManagers = (value, allManagers, currentManagers) => {\r\n let isManagersСonformityOffice = true;\r\n let checkValidWithoutRequest;\r\n const choosenManagers = typeof value !== 'undefined' ? value : currentManagers;\r\n if (choosenManagers) {\r\n const allManagersId = allManagers.reduce((acc, curValue) => {\r\n const sumIds = [];\r\n sumIds.push(curValue.value);\r\n return [...acc, ...sumIds];\r\n }, []);\r\n const isValid = choosenManagers.every(item => allManagersId.includes(item));\r\n isManagersСonformityOffice = isValid ? !!isValid : false;\r\n if (value) {\r\n checkValidWithoutRequest = isManagersСonformityOffice;\r\n }\r\n }\r\n return {\r\n isValid: isManagersСonformityOffice,\r\n checkValidWithoutRequest,\r\n };\r\n};\r\n","import React from 'react';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nexport const svgEditPencil = (id) => {\r\n return \r\n
\r\n {\r\n (!hasDefoultFinancialAccess || (hasDefoultFinancialAccess && HasFinancialAccess)\r\n || (!hidenProperty.includes(item.Property) && !isLink))\r\n ? (item.TypeOfChange && item.TypeOfChange.Name === 'changed'\r\n ? \r\n {moment(item.DateOfChange, 'YYYY-MM-DD').format('YYYY-MM-DD')}\r\n
\r\n \r\n
\r\n \r\n {item.Author && item.Author.Name}\r\n
\r\n \r\n {item.TypeOfChange && item.TypeOfChange.Name}\r\n
\r\n \r\n {(!hasDefoultFinancialAccess || (hasDefoultFinancialAccess && HasFinancialAccess)\r\n || !isLink)\r\n ? {`${item.Entity}${item.Property ? `.${item.Property}` : ''}`}\r\n :
\r\n ---
}\r\n \r\n
\r\n : ) : \r\n {this.checkDateOrEmptyField(item.PrevValue)}\r\n
\r\n \r\n
\r\n \r\n {this.checkDateOrEmptyField(item.NewValue)}\r\n
\r\n ---
\r\n }\r\n \r\n {\r\n editMode && isEditable\r\n ? (\r\n
\r\n )\r\n }\r\n \r\n \r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport MultiSelect from 'common/components/form-items/multi-select/multi-select';\r\nimport { svgEditPencil } from 'services/svgEditPencil';\r\nimport classNames from 'classnames';\r\nimport '../../redux-form.css';\r\n\r\nexport default class renderTogglingMultiSelect extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n editMode: false,\r\n };\r\n }\r\n\r\n toggleEditMode = (editMode) => this.setState({ editMode });\r\n\r\n onChange = () => data => {\r\n const { input } = this.props;\r\n const newValue = input.value.some(id => id === data) ? input.value.filter(id => id !== data) : input.value.concat([data]);\r\n input.onChange(newValue);\r\n }\r\n\r\n onBlur = (event) => {\r\n const { input } = this.props;\r\n this.toggleEditMode(false);\r\n input.onBlur(event);\r\n }\r\n\r\n render() {\r\n const { editMode } = this.state;\r\n const {\r\n input, meta, valueToShow, options, isEditable, label, placeholder, styles, multiSelectStyles,\r\n showAsterix, showAsterixOnFocus, showValueRequired,\r\n } = this.props;\r\n\r\n const isAsterixVisible = showAsterixOnFocus ? (editMode && isEditable) : showAsterix;\r\n const isValueRequiredVisible = showValueRequired ? meta.invalid : (meta.invalid && meta.error !== 'Value required');\r\n\r\n return (\r\n \r\n this.toggleEditMode(true)}\r\n className={classNames(\r\n styles.fieldContent,\r\n { 'field--editable': isEditable },\r\n { 'field--invalid': isValueRequiredVisible || !isSaved },\r\n )}\r\n >\r\n {\r\n !dontShowBage && valueToShow &&
\r\n {\r\n isValueRequiredVisible && (\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n {\r\n !isSaved && (\r\n \r\n Value wasn't saved\r\n
\r\n )\r\n }\r\n {customMassageValidation ? (\r\n \r\n Incorrect Managers by office\r\n \r\n ) : null}\r\n \r\n {\r\n label && \r\n }\r\n
\r\n \r\n );\r\n }\r\n}\r\n","/* eslint-disable indent */\r\nimport React from 'react';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport moment from 'moment';\r\nimport { svgEditPencil } from 'services/svgEditPencil';\r\nimport classNames from 'classnames';\r\nimport '../../redux-form.css';\r\nimport { ConfirmationDialog } from '../../../confirmation-dialog/confirmation-dialog';\r\n\r\nexport default class renderTogglingDatePicker extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n editMode: false,\r\n showConfirmationDialog: false,\r\n };\r\n this.inputDate = '';\r\n }\r\n\r\n toggleEditMode = (editMode) => this.setState({ editMode });\r\n\r\n onInputChange = (e) => this.inputDate = e.target.value\r\n\r\n onChange = data => {\r\n const { input } = this.props;\r\n const value = typeof data === 'string' || data === null ? data : data.target.value;\r\n const timeValue = moment(value);\r\n\r\n if (timeValue.isValid() && timeValue.format('MM/DD/YYY') !== moment(input.value).format('MM/DD/YYY')) {\r\n input.onChange(value);\r\n }\r\n input.onBlur();\r\n this.toggleEditMode(false);\r\n this.inputDate = '';\r\n }\r\n\r\n onBlur = data => {\r\n const { input, isStartDate, isEndDate } = this.props;\r\n const value = typeof data === 'string' || data === null ? data : data.target.value;\r\n const timeValue = moment(value);\r\n\r\n if (timeValue.isValid() && timeValue.format('MM/DD/YYY') !== moment(input.value).format('MM/DD/YYY')) {\r\n if (isStartDate) {\r\n input.onChange(timeValue.set({ 'hour': 8, 'minute': 0 }).format('YYYY-MM-DD HH:mm'));\r\n } else if (isEndDate) {\r\n input.onChange(timeValue.set({ 'hour': 12, 'minute': 0 }).format('YYYY-MM-DD HH:mm'));\r\n } else {\r\n input.onChange(timeValue.format('YYYY-MM-DD HH:mm'));\r\n }\r\n }\r\n input.onBlur();\r\n this.toggleEditMode(false);\r\n }\r\n\r\n clearValue = () => {\r\n const { input } = this.props;\r\n input.onChange(null);\r\n this.setState({\r\n editMode: false,\r\n showConfirmationDialog: false,\r\n });\r\n }\r\n\r\n showClearConfirmation = () => {\r\n this.setState({\r\n showConfirmationDialog: true,\r\n });\r\n }\r\n\r\n closeDialog = () => {\r\n this.setState({\r\n showConfirmationDialog: false,\r\n });\r\n }\r\n\r\n render() {\r\n const { editMode, showConfirmationDialog } = this.state;\r\n const {\r\n input, meta, isEditable, label, isStartDate, isEndDate,\r\n setPrevValueOnError, styles, showClear, minDate, maxDate, showAsterix,\r\n showAsterixOnFocus, showValueRequired, labelIcon, isClearable, confirmClearing,\r\n isSaved = true,\r\n } = this.props;\r\n const isAsterixVisible = showAsterixOnFocus ? (editMode && isEditable) : showAsterix;\r\n const isValueRequiredVisible = showValueRequired ? meta.invalid : (meta.invalid && meta.error !== 'Value required');\r\n\r\n return (\r\n \r\n {\r\n editMode && isEditable ?
\r\n )\r\n }\r\n \r\n this.toggleEditMode(true)}\r\n className={classNames(\r\n styles.fieldContent,\r\n { 'field--editable': isEditable },\r\n { 'field--invalid': isValueRequiredVisible },\r\n )}\r\n title={valueToShow}\r\n >\r\n {valueToShow}\r\n {isEditable && svgEditPencil(input.name)}\r\n
\r\n {\r\n isValueRequiredVisible && (\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n \r\n {\r\n editMode && isEditable\r\n ? this.toggleEditMode(false)}\r\n isStartDate={isStartDate}\r\n isEndDate={isEndDate}\r\n setPrevValueOnError={setPrevValueOnError}\r\n clearValue={showClear\r\n ? confirmClearing\r\n ? this.showClearConfirmation\r\n : this.clearValue\r\n : false}\r\n minVal={minDate}\r\n maxVal={maxDate}\r\n onInputChange={this.onInputChange}\r\n isClearable={isClearable}\r\n confirmClearing={confirmClearing}\r\n /> : (\r\n
\r\n )\r\n }\r\n \r\n \r\n );\r\n }\r\n}\r\n","/* eslint-disable indent */\r\nimport React from 'react';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport { svgEditPencil } from 'services/svgEditPencil';\r\nimport Tooltip from 'common/components/tooltip/tooltip';\r\nimport classNames from 'classnames';\r\nimport '../../redux-form.css';\r\n\r\nexport default class renderTogglingTextField extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n editMode: false,\r\n };\r\n }\r\n\r\n toggleEditMode = (editMode) => this.setState({ editMode });\r\n\r\n onChange = event => {\r\n const { input, disableLetters } = this.props;\r\n if (disableLetters) {\r\n input.onChange(event.target.value.replace(/[^\\d.]/g, ''));\r\n } else {\r\n input.onChange(event.target.value);\r\n }\r\n }\r\n\r\n onBlur = () => {\r\n const { input } = this.props;\r\n input.onBlur();\r\n this.toggleEditMode(false);\r\n }\r\n\r\n render() {\r\n const { editMode } = this.state;\r\n const {\r\n input, meta, valueToShow, isEditable, label, autoFocus, startAdornment, placeholder, maxlength, multiline, fullWidth, styles,\r\n formClassName, inputClassName, lableIcon, showAsterix, showAsterixOnFocus, isTooltip, textForTooltip, tooltipClassName, InputProps,\r\n isSaved = true,\r\n } = this.props;\r\n\r\n const isAsterixVisible = showAsterixOnFocus ? (editMode && isEditable) : showAsterix;\r\n return (\r\n \r\n this.toggleEditMode(true)}\r\n className={classNames(\r\n styles.fieldContent,\r\n { 'field--editable': isEditable },\r\n { 'field--invalid': isValueRequiredVisible || !isSaved },\r\n )}\r\n >\r\n {moment(input.value).isValid() ? moment(input.value).format('MM/DD/YYYY') : 'MM/DD/YYYY'}\r\n {isEditable && svgEditPencil(input.name)}\r\n
\r\n {\r\n isValueRequiredVisible && (\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n {\r\n !isSaved && (\r\n \r\n Value wasn't saved\r\n
\r\n )\r\n }\r\n \r\n {\r\n editMode && isEditable\r\n ?
\r\n )\r\n }\r\n \r\n \r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport MultiSuggestBox from 'common/components/form-items/multi-value-suggestbox/multi-value-suggestbox';\r\nimport { svgEditPencil } from 'services/svgEditPencil';\r\nimport classNames from 'classnames';\r\nimport '../../redux-form.css';\r\n\r\nexport default class renderTogglingMultiSuggestBox extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n editMode: false,\r\n };\r\n }\r\n\r\n toggleEditMode = (editMode) => this.setState({ editMode });\r\n\r\n onChange = () => data => {\r\n const { input, additionalValidator } = this.props;\r\n const values = data.map(item => item.value);\r\n additionalValidator && additionalValidator(values);\r\n input.onChange(values);\r\n }\r\n\r\n onBlur = () => {\r\n const { input } = this.props;\r\n this.toggleEditMode(false);\r\n input.onBlur();\r\n }\r\n\r\n render() {\r\n const { editMode } = this.state;\r\n const {\r\n input, meta, valueToShow, options, isEditable, label, placeholder, isMulti, blockAddNewItem, values, autoFocus, styles,\r\n additionalClassName, customMassageValidation,\r\n } = this.props;\r\n\r\n return (\r\n \r\n this.toggleEditMode(true)}\r\n className={classNames(\r\n styles.fieldContent,\r\n { 'field--not--editable': !isEditable },\r\n { 'field--editable': isEditable },\r\n { 'field--invalid': (meta.invalid && meta.error !== 'Value required') || !isSaved },\r\n )}\r\n >\r\n {\r\n multiline\r\n ?
\r\n {\r\n (meta.invalid && meta.error !== 'Value required') && (\r\n {valueToShow}\r\n : {valueToShow}\r\n }\r\n {isEditable && svgEditPencil(input.name)}\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n {\r\n !isSaved && (\r\n \r\n Value wasn't saved\r\n
\r\n )\r\n }\r\n \r\n {\r\n editMode && isEditable\r\n ?
\r\n )\r\n }\r\n \r\n \r\n );\r\n }\r\n}\r\n","/* eslint-disable indent */\r\nimport React from 'react';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport { svgEditPencil } from 'services/svgEditPencil';\r\nimport classNames from 'classnames';\r\nimport '../../redux-form.css';\r\nimport { Tooltip, Typography } from '@material-ui/core';\r\nimport CustomIcon from '../../../icon/Icon';\r\n\r\nexport default class renderTogglingSelect extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n editMode: false,\r\n };\r\n }\r\n\r\n toggleEditMode = (editMode) => this.setState({ editMode });\r\n\r\n onChange = (data) => {\r\n const { input, options } = this.props;\r\n input.onChange({\r\n Id: data.target.value,\r\n Name: options.find(item => item.Id === data.target.value).Name,\r\n });\r\n input.onBlur();\r\n this.toggleEditMode(false);\r\n }\r\n\r\n clearValue = () => {\r\n const { input } = this.props;\r\n input.onChange({ Id: '', Name: '' });\r\n this.setState({\r\n editMode: false,\r\n });\r\n }\r\n\r\n onBlur = () => {\r\n const { input } = this.props;\r\n input.onBlur();\r\n this.toggleEditMode(false);\r\n }\r\n\r\n render() {\r\n const { editMode } = this.state;\r\n const {\r\n input, meta, valueToShow, options, isEditable, label, styles, inputProps, showClear, isOptionObject, renderIcon,\r\n placeholder, showAsterix, showAsterixOnFocus, showValueRequired, valueId, maxHeight, showInfoTooltip, showInfoTooltipMessage,\r\n isSaved = true,\r\n } = this.props;\r\n const isAsterixVisible = showAsterixOnFocus ? (editMode && isEditable) : showAsterix;\r\n const isValueRequiredVisible = showValueRequired ? meta.invalid : (meta.invalid && meta.error !== 'Value required');\r\n return (\r\n \r\n
: (\r\n \r\n this.toggleEditMode(true)}\r\n className={classNames(\r\n styles.fieldContent,\r\n { 'field--not--editable': !isEditable },\r\n { 'field--editable': isEditable },\r\n { 'field--invalid': (meta.invalid && meta.error !== 'Value required') },\r\n )}\r\n title={valueToShow}\r\n >\r\n {valueToShow}\r\n {isEditable && svgEditPencil(input.name)}\r\n
\r\n {\r\n (meta.invalid && meta.error !== 'Value required') && (\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n {customMassageValidation ? (\r\n \r\n Incorrect Managers by office\r\n \r\n ) : null }\r\n \r\n {\r\n editMode && isEditable\r\n ?
\r\n )\r\n }\r\n \r\n \r\n );\r\n }\r\n}\r\n","import moment from 'moment';\r\nimport { MESSAGE_FOR_INCORRECT_DATA_ON_PROJECT_DETAILS } from 'utils/const-variable';\r\n\r\nexport const getConfigForMessageDialog = (value, field, theBiggestDateRange, theBiggestStartDateForContracts, isCorrectStartAndEndDate) => {\r\n const { forStartDate, forEndDate } = theBiggestDateRange;\r\n switch (field) {\r\n case 'StartDate':\r\n return !isCorrectStartAndEndDate ? {\r\n isNewValueWrong: true,\r\n message: MESSAGE_FOR_INCORRECT_DATA_ON_PROJECT_DETAILS,\r\n }\r\n : forStartDate && {\r\n isNewValueWrong: moment(value).isAfter(forStartDate.contract.StartDate, 'day'),\r\n message: `There are ${forStartDate.type} with start date less than project start date.`,\r\n };\r\n case 'EndDate':\r\n return !isCorrectStartAndEndDate && moment(value).isValid() ? {\r\n isNewValueWrong: true,\r\n message: MESSAGE_FOR_INCORRECT_DATA_ON_PROJECT_DETAILS,\r\n } : forEndDate && forEndDate.contract.EndDate\r\n ? {\r\n isNewValueWrong: moment(value).isBefore(forEndDate.contract.EndDate, 'day'),\r\n message: `There are ${forEndDate.type} with end date greater than project end date.`,\r\n } : (\r\n theBiggestStartDateForContracts\r\n && moment(value).isBefore(theBiggestStartDateForContracts, 'day')\r\n )\r\n ? {\r\n isNewValueWrong: true,\r\n message: 'There are contracts with start date greater than project end date.',\r\n } : null;\r\n default:\r\n return null;\r\n }\r\n};\r\n","import moment from 'moment';\r\n\r\nexport const getTheSmallestDate = (prev, current) => {\r\n if (!prev || !prev.contract || !prev.contract.EndDate) {\r\n return current;\r\n }\r\n if (!current || !current.contract || !current.contract.EndDate) {\r\n return prev;\r\n }\r\n return moment(prev.contract.StartDate).isBefore(current.contract.StartDate, 'day') ? prev : current;\r\n};\r\nexport const getTheBiggestDate = (prev, current) => {\r\n if (!prev || !prev.contract || !prev.contract.EndDate) {\r\n return current;\r\n }\r\n if (!current || !current.contract || !current.contract.EndDate) {\r\n return prev;\r\n }\r\n return moment(prev.contract.EndDate).isAfter(current.contract.EndDate, 'day') ? prev : current;\r\n};\r\n\r\nexport const updateTheBiggestDateRange = (contract, theBiggestDateRange) => {\r\n theBiggestDateRange.forStartDate = getTheSmallestDate(theBiggestDateRange.forStartDate, contract);\r\n theBiggestDateRange.forEndDate = getTheBiggestDate(theBiggestDateRange.forEndDate, contract);\r\n};\r\n\r\nexport const getTheBiggestDateRangeForContracts = (contracts, checkDateForSow) => {\r\n if (!contracts || !contracts.length) {\r\n return {};\r\n }\r\n\r\n const theBiggestDateRange = {\r\n forStartDate: checkDateForSow ? { contract: contracts[0], type: 'contracts' } : null,\r\n forEndDate: checkDateForSow ? { contract: contracts[0], type: 'contracts' } : null,\r\n };\r\n contracts.forEach(contract => {\r\n checkDateForSow && updateTheBiggestDateRange({ contract, type: 'contracts' }, theBiggestDateRange);\r\n\r\n contract.POs\r\n && contract.POs.length\r\n && contract.POs.forEach((PO) => { updateTheBiggestDateRange({ contract: PO, type: 'POs' }, theBiggestDateRange); });\r\n contract.Amendments\r\n && contract.Amendments.length\r\n && contract.Amendments.forEach((Amendment) => { updateTheBiggestDateRange({ contract: Amendment, type: 'amendments' }, theBiggestDateRange); });\r\n });\r\n return theBiggestDateRange;\r\n};\r\n\r\nexport const getTheBiggestStartDateForContracts = (contracts) => {\r\n return contracts && contracts.length && moment.max(contracts.map((contract) => moment(contract.StartDate)));\r\n};\r\n","import moment from 'moment';\r\n\r\nexport const getTheBiggestDateMilestones = (maxDate, projectMilestones, value, field) => {\r\n if (field === 'EndDate') {\r\n const milestones = projectMilestones.reduce((acc, milestones) => {\r\n return acc.concat(milestones.Milestones);\r\n }, []);\r\n if (!milestones.length) {\r\n return true;\r\n }\r\n const milestonesDate = milestones.reduce((prevDate, currentDate) => {\r\n return moment(currentDate.Milestone).isAfter(prevDate.Milestone) ? currentDate : prevDate;\r\n }, milestones[0]);\r\n if (moment(milestonesDate.Milestone).isAfter(maxDate) || moment(milestonesDate.Milestone).isAfter(value)) {\r\n return false;\r\n } return true;\r\n } return true;\r\n};\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport compareArraysByItems from 'utils/compareArraysByItems';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\nimport { changeProjectBasicInfo } from 'common/actions/reduxFormActions';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport { getProjectStatusColor } from 'services/getStatusColor';\r\nimport { renderProjectTypeIcon } from 'services/renderProjectTypeIcon';\r\nimport {\r\n NON_BILLABLE_TRAINING,\r\n fieldDate,\r\n MESSAGE_FOR_INCORRECT_DATA_ON_PROJECT_DETAILS,\r\n PROJECT_ROLES_STATUS_ACTIVE,\r\n STATUS_BILLABLE,\r\n STATUS_INVESTED_CLIENT,\r\n STATUS_INVESTED_AKVELON,\r\n STATUS_INTERNAL,\r\n} from 'utils/const-variable';\r\nimport { required, currencyFormat } from 'services/redux-form-validators.js';\r\nimport { validateManagers } from './utils/validateManagers';\r\nimport renderTogglingSearchDropdown from './components/toggling/toggling-search-dropdown';\r\nimport renderTogglingMultiSelect from './components/toggling/toggling-multi-select';\r\nimport renderTogglingDatePicker from './components/toggling/toggling-date-picker';\r\nimport renderTogglingTextField from './components/toggling/toggling-text-field';\r\nimport renderTogglingMultiSuggestBox from './components/toggling/toggling-multi-suggest-box';\r\nimport renderTogglingSelect from './components/toggling/toggling-select';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport formatCurrency from 'utils/formatCurrency';\r\nimport { getConfigForMessageDialog } from 'pages/projects/components/utils/getConfigForMessageDialog';\r\nimport {\r\n getTheBiggestDateRangeForContracts, getTheBiggestStartDateForContracts,\r\n} from 'pages/projects/components/utils/getTheBiggestDateRangeForContracts';\r\nimport { getTheBiggestDateMilestones } from 'pages/projects/components/utils/getTheBiggestDateMilestones';\r\nimport moment from 'moment';\r\nimport { getProjectDetails, updateFiscalYears } from 'pages/projects/actions/projectsActions';\r\nimport { getId } from 'services/location';\r\nimport './redux-form.css';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst multiSelectStyles = {\r\n relcontClass: 'field__multi-select-rel-cont',\r\n contClass: 'field__multi-select-cont',\r\n optionContClass: 'field__multi-select-option-cont',\r\n};\r\n\r\nconst validateClientManager = (value, values, props) => {\r\n if (values.ProjectType && values.ProjectType.Name !== NON_BILLABLE_TRAINING) {\r\n return required(value, values, props);\r\n }\r\n};\r\n\r\nclass ProjectBasicInfoForm extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { AccountManagerId } = props;\r\n this.isValidAccountManager = !!AccountManagerId;\r\n this.isEngagementTypeConfirmed = true;\r\n this.state = {\r\n showDelete: false,\r\n isValidDelivery: true,\r\n isValidEngineer: true,\r\n isValidAccount: true,\r\n checkValidDeliveryWithoutRequest: false,\r\n checkValidEngineerWithoutRequest: false,\r\n availableFiscalYears: [],\r\n fiscalYear: {\r\n Name: '',\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.onBlur();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n data,\r\n initialize,\r\n allDeliveryManagers,\r\n allEngineeringManagers,\r\n allAccountManagers,\r\n projectDetails,\r\n allEngagementTypes,\r\n } = this.props;\r\n const { fiscalYear } = this.state;\r\n if (isObjectNotEquals(prevProps.data, data) || isObjectNotEquals(prevProps.projectDetails, projectDetails)) {\r\n initialize(data);\r\n this.validDelivery(undefined);\r\n this.validEngineer(undefined);\r\n }\r\n if (!compareArraysByItems(prevProps.allDeliveryManagers, allDeliveryManagers)) {\r\n this.validDelivery(undefined);\r\n }\r\n if (!compareArraysByItems(prevProps.allEngineeringManagers, allEngineeringManagers)) {\r\n this.validEngineer(undefined);\r\n }\r\n if (!compareArraysByItems(prevProps.allAccountManagers, allAccountManagers)) {\r\n this.validAccount();\r\n }\r\n if (!compareArraysByItems(prevProps.allEngagementTypes, allEngagementTypes)) {\r\n this.validAccount();\r\n }\r\n if (!fiscalYear.Id && projectDetails.FinancialData && projectDetails.FinancialData.AvailableFiscalYears.length) {\r\n const { AvailableFiscalYears, FiscalYear } = projectDetails.FinancialData;\r\n const availableFiscalYears = AvailableFiscalYears.map((e, i) => ({ Id: i + 1, Name: e }));\r\n const fiscalYear = availableFiscalYears.find((e) => e.Name === FiscalYear);\r\n this.setState({\r\n availableFiscalYears,\r\n fiscalYear,\r\n });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { destroy } = this.props;\r\n destroy();\r\n }\r\n\r\n validDelivery = (value) => {\r\n const { allDeliveryManagers, data, isLoading } = this.props;\r\n if (!isLoading) {\r\n const validationDelivery = validateManagers(value, allDeliveryManagers, data.DeliveryManagers);\r\n this.setState({\r\n isValidDelivery: validationDelivery.isValid,\r\n checkValidDeliveryWithoutRequest: validationDelivery.checkValidWithoutRequest,\r\n });\r\n }\r\n };\r\n\r\n validEngineer = (value) => {\r\n const { allEngineeringManagers, data, isLoading } = this.props;\r\n if (!isLoading) {\r\n const validationEng = validateManagers(value, allEngineeringManagers, data.EngineeringManagers);\r\n this.setState({\r\n isValidEngineer: validationEng.isValid,\r\n checkValidEngineerWithoutRequest: validationEng.checkValidWithoutRequest,\r\n });\r\n }\r\n };\r\n\r\n validAccount = (managerId) => {\r\n const { allAccountManagers, data, isLoading } = this.props;\r\n if (!isLoading) {\r\n const choosenManagerId = managerId || data.AccountManagerId;\r\n const validManager = allAccountManagers.find(manager => manager.Id === choosenManagerId);\r\n this.setState({\r\n isValidAccount: !!validManager,\r\n });\r\n }\r\n };\r\n\r\n checkValidStartAndEndDate = (value, field, startDate, endDate) => {\r\n switch (field) {\r\n case 'StartDate':\r\n return !moment(value).isValid() ? false : !endDate ? true : moment(value).isSameOrBefore(endDate, 'day');\r\n case 'EndDate':\r\n return !value || moment(value).isSameOrAfter(startDate, 'day');\r\n default: return false;\r\n }\r\n }\r\n\r\n onChange = (data, value, prevValue, field) => {\r\n if (field === 'AccountManagerId') {\r\n this.isValidAccountManager = !!value;\r\n }\r\n const {\r\n change, allClients, allClientManagers, allDeliveryManagers, allEngineeringManagers, allAccountManagers,\r\n projectContracts, showAlertDialog, projectDetails, EndDate, StartDate, projectMilestones, initialize, data: projectData,\r\n PrimaryOffices, allEngagementTypes, openEngagementTypeDialog, projectTeams, getProjectDetails, isOnlyActiveRoles, updateFiscalYears,\r\n } = this.props;\r\n const { fiscalYear } = this.state;\r\n const newValue = (allOptions) => allOptions.find(item => item.Id === value).Name;\r\n const newValues = (allOptions) => value.map(id => allOptions.find(item => item.value === id));\r\n const isCorrectStartAndEndDate = this.checkValidStartAndEndDate(value, field, StartDate, EndDate);\r\n const { forStartDate, forEndDate } = getTheBiggestDateRangeForContracts(projectContracts, true);\r\n const theBiggestStartDateContracts = getTheBiggestStartDateForContracts(projectContracts);\r\n const biggestDateMilestones = forEndDate && forEndDate.contract\r\n && getTheBiggestDateMilestones(forEndDate.contract.EndDate, projectMilestones, value, field);\r\n const isCorrectMilestoneDate = typeof biggestDateMilestones === 'boolean' ? biggestDateMilestones : true;\r\n const configMessageDialog = getConfigForMessageDialog(\r\n value,\r\n field,\r\n { forStartDate, forEndDate },\r\n theBiggestStartDateContracts,\r\n isCorrectStartAndEndDate,\r\n );\r\n const { isNewValueWrong, message } = configMessageDialog || {};\r\n const correctDateValue = isNewValueWrong ? prevValue : value;\r\n change('Year', fiscalYear.Name);\r\n switch (field) {\r\n case 'ClientId':\r\n change('ClientName', newValue(allClients));\r\n change('ClientManagerId', '');\r\n change('ClientManagerName', '');\r\n this.onBlur();\r\n break;\r\n case 'ClientManagerId':\r\n change('ClientManagerName', newValue(allClientManagers));\r\n this.onBlur(field);\r\n break;\r\n case 'DeliveryManagers':\r\n change('DeliveryManagersValues', newValues(allDeliveryManagers));\r\n break;\r\n case 'EngineeringManagers':\r\n change('EngineeringManagersValues', newValues(allEngineeringManagers));\r\n break;\r\n case 'AccountManagerId':\r\n change('AccountManagerName', newValue(allAccountManagers));\r\n this.onBlur();\r\n break;\r\n case 'EngagementTypeId': {\r\n const individuals = allEngagementTypes.find(item => item.Name === 'Individuals');\r\n if (individuals && (individuals.Id === value) && projectTeams.Teams.length) {\r\n this.isEngagementTypeConfirmed = false;\r\n openEngagementTypeDialog(() => {\r\n change('EngagementTypeName', newValue(allEngagementTypes));\r\n this.isEngagementTypeConfirmed = true;\r\n this.onBlur(field);\r\n });\r\n } else {\r\n change('EngagementTypeName', newValue(allEngagementTypes));\r\n this.isEngagementTypeConfirmed = true;\r\n this.onBlur(field);\r\n }\r\n break;\r\n }\r\n case 'PrimaryOffices':\r\n setTimeout(() => {\r\n change(field, value.length ? value : prevValue);\r\n }, 0);\r\n !value.length && showAlertDialog(MESSAGE_FOR_INCORRECT_DATA_ON_PROJECT_DETAILS);\r\n break;\r\n case 'Offices':\r\n setTimeout(() => {\r\n const newPrimaryOffices = PrimaryOffices.filter(item => value.find(elem => item === elem));\r\n change(field, value.length ? value : prevValue);\r\n change('PrimaryOffices', value.length ? newPrimaryOffices : PrimaryOffices);\r\n }, 0);\r\n !value.length && showAlertDialog(MESSAGE_FOR_INCORRECT_DATA_ON_PROJECT_DETAILS);\r\n break;\r\n case 'StartDate':\r\n case 'EndDate':\r\n setTimeout(() => {\r\n change(field, correctDateValue);\r\n !isCorrectMilestoneDate && initialize(projectData);\r\n }, 0);\r\n isNewValueWrong && showAlertDialog(message);\r\n !isNewValueWrong && correctDateValue !== projectDetails[field] && this.onBlur(fieldDate, isCorrectMilestoneDate);\r\n break;\r\n case 'ProjectType':\r\n this.onBlur();\r\n break;\r\n case 'Currency':\r\n this.onBlur();\r\n break;\r\n case 'FiscalYear':\r\n if (fiscalYear.Name !== value.Name) {\r\n getProjectDetails(projectDetails.Id, isOnlyActiveRoles, true, { fiscalYear: value.Name });\r\n updateFiscalYears({ [getId()]: value.Name });\r\n this.setState({\r\n fiscalYear: value,\r\n });\r\n }\r\n break;\r\n case 'Budget':\r\n change('Budget', value);\r\n break;\r\n default: break;\r\n }\r\n }\r\n\r\n onBlur = (event, isCorrectMilestoneDate) => {\r\n const {\r\n changeProjectBasicInfo, showAlertDialog, valid, isOnlyActiveRoles, projectBasicInfoForm, fiscalYears,\r\n } = this.props;\r\n if (projectBasicInfoForm\r\n && projectBasicInfoForm.syncErrors\r\n && projectBasicInfoForm.syncErrors.AccountManagerId\r\n && !this.isValidAccountManager) {\r\n showAlertDialog('Please add Business Development Manager to a Project');\r\n return;\r\n }\r\n const {\r\n isValidDelivery, isValidEngineer, isValidAccount,\r\n checkValidDeliveryWithoutRequest, checkValidEngineerWithoutRequest,\r\n } = this.state;\r\n if (!valid\r\n && event !== 'ClientManagerId'\r\n && event !== 'EngagementTypeId'\r\n && event !== fieldDate\r\n && projectBasicInfoForm\r\n && projectBasicInfoForm.syncErrors) {\r\n let message = 'Data entered incorrectly and will not be saved';\r\n if (Object.keys(projectBasicInfoForm.syncErrors).length === 1 && projectBasicInfoForm.syncErrors.AccountManagerId) {\r\n message = null;\r\n }\r\n if (message) {\r\n showAlertDialog(message);\r\n }\r\n }\r\n const params = {};\r\n const projectId = getId();\r\n if (fiscalYears[projectId]) {\r\n params.FiscalYear = fiscalYears[projectId];\r\n }\r\n if (event && !!event.target) {\r\n changeProjectBasicInfo(isOnlyActiveRoles, params);\r\n } else {\r\n if (\r\n ((event === fieldDate) && isCorrectMilestoneDate)\r\n || (\r\n (event !== fieldDate)\r\n && ((isValidDelivery || checkValidDeliveryWithoutRequest) && (isValidEngineer || checkValidEngineerWithoutRequest) && isValidAccount)\r\n )\r\n ) {\r\n if (this.isEngagementTypeConfirmed) {\r\n changeProjectBasicInfo(isOnlyActiveRoles, params);\r\n }\r\n } else {\r\n !isCorrectMilestoneDate && (event === fieldDate)\r\n ? showAlertDialog('There are milestones with end date greater than project end date.')\r\n : showAlertDialog('Data entered incorrectly and will not be saved');\r\n }\r\n }\r\n }\r\n\r\n toggleDelete = position => () => {\r\n this.setState({\r\n showDelete: position,\r\n });\r\n }\r\n\r\n getTextForTooltip = () => {\r\n return (\r\n this.toggleEditMode(true)}\r\n className={classNames(\r\n styles.fieldContent,\r\n { 'field--editable': isEditable },\r\n { 'field--invalid': isValueRequiredVisible || !isSaved },\r\n )}\r\n >\r\n {\r\n renderIcon && (\r\n \r\n )\r\n }\r\n {valueToShow}\r\n {isEditable && svgEditPencil(input.name)}\r\n
\r\n {\r\n isValueRequiredVisible && (\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n {\r\n !isSaved && (\r\n \r\n Value wasn't saved\r\n
\r\n )\r\n }\r\n \r\n Committed Quota Goal values are updated in CRM and synced with Theodolite on a daily basis\r\n
);\r\n }\r\n\r\n bookedRevenueFormat = (value) => {\r\n return !!value ? value : null;\r\n }\r\n\r\n roundHeadcountUtilization = (value) => {\r\n return Math.round((value + Number.EPSILON) * 100) / 100;\r\n }\r\n\r\n getHeadcount = () => {\r\n const { projectDetails } = this.props;\r\n\r\n const headcount = {\r\n totalHeadcount: 0,\r\n totalHeadcountUtilization: 0,\r\n billableResources: 0,\r\n billableResourcesUtilization: 0,\r\n investedResources: 0,\r\n investedResourcesUtilization: 0,\r\n internalResources: 0,\r\n internalResourcesUtilization: 0,\r\n };\r\n\r\n if (projectDetails.AllRoles) {\r\n for (const role of projectDetails.AllRoles) {\r\n if (role.Status && role.Status.Name !== PROJECT_ROLES_STATUS_ACTIVE) {\r\n continue;\r\n }\r\n\r\n for (const employee of role.Employees) {\r\n if (employee.Status && employee.Status.Name === PROJECT_ROLES_STATUS_ACTIVE) {\r\n if (role.BillableStatus && role.BillableStatus.Name === STATUS_BILLABLE) {\r\n headcount.billableResources++;\r\n headcount.billableResourcesUtilization += employee.Assignment;\r\n } else if (role.BillableStatus && (role.BillableStatus.Name === STATUS_INVESTED_CLIENT\r\n || role.BillableStatus.Name === STATUS_INVESTED_AKVELON)) {\r\n headcount.investedResources++;\r\n headcount.investedResourcesUtilization += employee.Assignment;\r\n } else if (role.BillableStatus && role.BillableStatus.Name === STATUS_INTERNAL) {\r\n headcount.internalResources++;\r\n headcount.internalResourcesUtilization += employee.Assignment;\r\n }\r\n\r\n headcount.totalHeadcount++;\r\n headcount.totalHeadcountUtilization += employee.Assignment;\r\n }\r\n }\r\n }\r\n }\r\n\r\n headcount.totalHeadcountUtilization = this.roundHeadcountUtilization(headcount.totalHeadcountUtilization);\r\n headcount.billableResourcesUtilization = this.roundHeadcountUtilization(headcount.billableResourcesUtilization);\r\n headcount.investedResourcesUtilization = this.roundHeadcountUtilization(headcount.investedResourcesUtilization);\r\n headcount.internalResourcesUtilization = this.roundHeadcountUtilization(headcount.internalResourcesUtilization);\r\n\r\n return headcount;\r\n }\r\n\r\n render() {\r\n const {\r\n showDelete, isValidDelivery, isValidEngineer, isValidAccount, availableFiscalYears, fiscalYear,\r\n } = this.state;\r\n const {\r\n isEditable, viewFinancialInfo, allClients, allOffices, allClientManagers, allDeliveryManagers, allEngineeringManagers, allAccountManagers,\r\n allBillingTypes, Name, Aliases, Status, ProjectType, ClientId, ClientName, Offices, StartDate, EndDate, RealizedRevenue, ClientManagerId,\r\n ClientManagerName, DeliveryManagers, DeliveryManagersValues, EngineeringManagers, EngineeringManagersValues, AccountManagerId, AccountManagerName,\r\n ProjectCode, Description, deleteProject, handleSubmit, Currency, Budget, RemainingBalance, Leftover, allCurrencies, EditProjectBasicFinanceInfo,\r\n BookedRevenue, allEngagementTypes, EngagementTypeId, EngagementTypeName, PrimaryOffices, RevenueReceived, projectDetails, ProjectSize,\r\n ProjectLeftover, CurrentMonthMilestones,\r\n } = this.props;\r\n const showFinancialInfo = viewFinancialInfo && availableFiscalYears && availableFiscalYears.length > 0;\r\n const officesToShow = projectDetails.Offices && projectDetails.Offices.length ? projectDetails.Offices.map(office => office.Name).join(', ') : '';\r\n const primaryOfficesToShow = projectDetails.PrimaryOffices && projectDetails.PrimaryOffices.length\r\n ? projectDetails.PrimaryOffices.map(office => office.Name).join(', ')\r\n : '';\r\n const delivaryManagersToShow = DeliveryManagersValues && DeliveryManagersValues.length\r\n ? DeliveryManagersValues.map(manager => manager && manager.label).join(', ')\r\n : '';\r\n\r\n const engineeringManagersToShow = EngineeringManagersValues && EngineeringManagersValues.length\r\n ? EngineeringManagersValues.map(manager => manager && manager.label).join(', ')\r\n : '';\r\n const currencyName = formatCurrency(Currency && Currency.Name);\r\n const headcount = this.getHeadcount();\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('projectBasicInfoForm', data)),\r\n destroy: () => dispatch(destroy('projectBasicInfoForm')),\r\n change: (field, value) => dispatch(change('projectBasicInfoForm', field, value)),\r\n changeProjectBasicInfo: (isOnlyActive, params) => dispatch(changeProjectBasicInfo(isOnlyActive, params)),\r\n showAlertDialog: (massage) => dispatch(showAlertDialog(massage)),\r\n getProjectDetails: (id, isOnlyActive, isLoading, params) => dispatch(getProjectDetails(id, isOnlyActive, isLoading, params)),\r\n updateFiscalYears: (payload) => dispatch(updateFiscalYears(payload)),\r\n };\r\n};\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.projectBasicInfoForm && state.form.projectBasicInfoForm.values;\r\n return {\r\n Name: isFormReducerExists ? state.form.projectBasicInfoForm.values.Name : '',\r\n Aliases: isFormReducerExists ? state.form.projectBasicInfoForm.values.Aliases : '',\r\n Status: isFormReducerExists && state.form.projectBasicInfoForm.values.Status,\r\n ProjectType: isFormReducerExists && state.form.projectBasicInfoForm.values.ProjectType,\r\n ClientId: isFormReducerExists && state.form.projectBasicInfoForm.values.ClientId,\r\n ClientName: isFormReducerExists && state.form.projectBasicInfoForm.values.ClientName,\r\n Offices: isFormReducerExists && state.form.projectBasicInfoForm.values.Offices,\r\n StartDate: isFormReducerExists && state.form.projectBasicInfoForm.values.StartDate,\r\n EndDate: isFormReducerExists && state.form.projectBasicInfoForm.values.EndDate,\r\n RealizedRevenue: isFormReducerExists && state.form.projectBasicInfoForm.values.RealizedRevenue,\r\n PrimaryOffices: isFormReducerExists && state.form.projectBasicInfoForm.values.PrimaryOffices,\r\n ClientManagerId: isFormReducerExists && state.form.projectBasicInfoForm.values.ClientManagerId,\r\n ClientManagerName: isFormReducerExists && state.form.projectBasicInfoForm.values.ClientManagerName,\r\n DeliveryManagers: isFormReducerExists && state.form.projectBasicInfoForm.values.DeliveryManagers,\r\n DeliveryManagersNames: isFormReducerExists && state.form.projectBasicInfoForm.values.DeliveryManagersNames,\r\n DeliveryManagersValues: isFormReducerExists && state.form.projectBasicInfoForm.values.DeliveryManagersValues,\r\n EngineeringManagers: isFormReducerExists && state.form.projectBasicInfoForm.values.EngineeringManagers,\r\n EngineeringManagersNames: isFormReducerExists && state.form.projectBasicInfoForm.values.EngineeringManagersNames,\r\n EngineeringManagersValues: isFormReducerExists && state.form.projectBasicInfoForm.values.EngineeringManagersValues,\r\n AccountManagerId: isFormReducerExists && state.form.projectBasicInfoForm.values.AccountManagerId,\r\n AccountManagerName: isFormReducerExists && state.form.projectBasicInfoForm.values.AccountManagerName,\r\n ProjectCode: isFormReducerExists && state.form.projectBasicInfoForm.values.ProjectCode,\r\n Description: isFormReducerExists && state.form.projectBasicInfoForm.values.Description,\r\n Budget: isFormReducerExists && state.form.projectBasicInfoForm.values.Budget,\r\n RemainingBalance: isFormReducerExists && state.form.projectBasicInfoForm.values.RemainingBalance,\r\n Currency: isFormReducerExists && state.form.projectBasicInfoForm.values.Currency,\r\n BookedRevenue: isFormReducerExists && state.form.projectBasicInfoForm.values.BookedRevenue,\r\n Leftover: isFormReducerExists && state.form.projectBasicInfoForm.values.Leftover,\r\n EngagementTypeId: isFormReducerExists && state.form.projectBasicInfoForm.values.EngagementTypeId,\r\n EngagementTypeName: isFormReducerExists && state.form.projectBasicInfoForm.values.EngagementTypeName,\r\n Year: isFormReducerExists && state.form.projectBasicInfoForm.values.Year,\r\n RevenueReceived: isFormReducerExists && state.form.projectBasicInfoForm.values.RevenueReceived,\r\n ProjectSize: isFormReducerExists && state.form.projectBasicInfoForm.values.ProjectSize,\r\n ProjectLeftover: isFormReducerExists && state.form.projectBasicInfoForm.values.ProjectLeftover,\r\n CurrentMonthMilestones: isFormReducerExists && state.form.projectBasicInfoForm.values.CurrentMonthMilestones,\r\n projectBasicInfoForm: state.form.projectBasicInfoForm,\r\n isLoading: state.loadingReducer.isLoading,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'projectBasicInfoForm',\r\n})(ProjectBasicInfoForm));\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport moment from 'moment';\r\n\r\nexport class CellDate extends Component {\r\n render() {\r\n const { item, column, config } = this.props;\r\n const format = config[column.Id].format || 'MM/DD/YYYY';\r\n return (\r\n\r\n {moment(item[column.Id]).format(format)}\r\n
\r\n );\r\n }\r\n}\r\n\r\nCellDate.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport moment from 'moment';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\n\r\nexport class CellDatePicker extends Component {\r\n constructor(props) {\r\n super(props);\r\n const {\r\n item, column, isEditingMode, isControlledByListItem,\r\n } = this.props;\r\n this.state = {\r\n value: item[column.Id],\r\n isDatePicker: isControlledByListItem && isEditingMode,\r\n };\r\n }\r\n\r\n toggleViewCell = () => {\r\n const { isEditingMode, isControlledByListItem } = this.props;\r\n this.setState(({ isDatePicker }) => ({\r\n isDatePicker: isControlledByListItem ? isEditingMode : !isDatePicker,\r\n }));\r\n }\r\n\r\n handleChange = (date) => {\r\n this.setState({\r\n value: date ? moment(date).format('MM-DD-YYYY') : null,\r\n }, this.onBlur);\r\n }\r\n\r\n onBlur = () => {\r\n const {\r\n column, config, item, isControlledByListItem,\r\n } = this.props;\r\n const { value } = this.state;\r\n const { valueSetter, editingValueSetter } = config[column.Id];\r\n const newItem = isControlledByListItem ? {\r\n [column.Id]: value,\r\n } : {\r\n ...item,\r\n [column.Id]: value,\r\n };\r\n valueSetter && valueSetter(newItem);\r\n this.toggleViewCell();\r\n if (isControlledByListItem) {\r\n editingValueSetter && editingValueSetter(newItem, item);\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n column,\r\n config,\r\n item,\r\n isHaveRights,\r\n isEditingMode,\r\n } = this.props;\r\n const {\r\n value,\r\n isDatePicker,\r\n } = this.state;\r\n const columnConfig = config[column.Id];\r\n const format = columnConfig.format || 'MM-DD';\r\n const columnClassNames = column.className ? column.className : 'small-col';\r\n const formClassName = `${columnConfig.formClassName ? columnConfig.formClassName : ''} change-border__input-cell container_datepicker`;\r\n return (\r\n \r\n \r\n {cellTextValue}\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellBudget.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n viewFinancialInfo: PropTypes.bool.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport InputCurrency from '../../form-items/input-currency/input-currency';\r\nimport { CellBudget } from 'common/components/list/custom-cell/cell-budget';\r\nimport formatCurrency from 'utils/formatCurrency';\r\n\r\nexport class CellToggleBudget extends Component {\r\n constructor(props) {\r\n super(props);\r\n const {\r\n item, column, isEditingMode, isControlledByListItem,\r\n } = this.props;\r\n this.state = {\r\n value: item[column.Id],\r\n isTextField: isControlledByListItem && isEditingMode,\r\n };\r\n }\r\n\r\n toggleViewCell = () => {\r\n const { isTextField } = this.state;\r\n const { isEditingMode, isControlledByListItem } = this.props;\r\n this.setState({\r\n isTextField: isControlledByListItem ? isEditingMode : !isTextField,\r\n });\r\n }\r\n\r\n handleChange = ({ target }) => {\r\n this.setState({\r\n value: target.value,\r\n });\r\n }\r\n\r\n onBlur = () => {\r\n const {\r\n column, config, item, isControlledByListItem,\r\n } = this.props;\r\n const { value } = this.state;\r\n const { valueSetter, editingValueSetter } = config[column.Id];\r\n const newItem = isControlledByListItem ? {\r\n [column.Id]: value,\r\n } : {\r\n ...item,\r\n [column.Id]: value,\r\n };\r\n valueSetter && valueSetter(newItem);\r\n this.toggleViewCell();\r\n if (isControlledByListItem) {\r\n editingValueSetter && editingValueSetter(newItem, item);\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n config, column, isHaveRights, ...other\r\n } = this.props;\r\n const {\r\n value,\r\n isTextField,\r\n } = this.state;\r\n\r\n const currency = formatCurrency(config.CurrencyType && config.CurrencyType.currency && config.CurrencyType.currency.Name);\r\n return (\r\n isTextField && isHaveRights ? (\r\n \r\n \r\n {item[column.Id] === null ? '———' : `${item[column.Id].toFixed(2)} %`}\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellPercent.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nexport class CellToggleCheckbox extends Component {\r\n constructor(props) {\r\n super(props);\r\n const {\r\n item, column, isEditingMode, isControlledByListItem,\r\n } = this.props;\r\n this.state = {\r\n checked: item[column.Id],\r\n isEditable: isControlledByListItem && isEditingMode,\r\n };\r\n }\r\n\r\n toggleViewCell = () => {\r\n const { isEditable } = this.state;\r\n const { isEditingMode, isControlledByListItem } = this.props;\r\n this.setState({\r\n isEditable: isControlledByListItem ? isEditingMode : !isEditable,\r\n });\r\n }\r\n\r\n handleClick = () => {\r\n const {\r\n column, config, item, isControlledByListItem,\r\n } = this.props;\r\n const { checked } = this.state;\r\n const { valueSetter, editingValueSetter } = config[column.Id];\r\n const newItem = isControlledByListItem ? {\r\n [column.Id]: !checked,\r\n } : {\r\n ...item,\r\n [column.Id]: !checked,\r\n };\r\n this.setState(({ checked }) => ({ checked: !checked }));\r\n valueSetter && valueSetter(newItem);\r\n this.toggleViewCell();\r\n if (isControlledByListItem) {\r\n editingValueSetter && editingValueSetter(newItem, item);\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n column,\r\n isHaveRights,\r\n } = this.props;\r\n const {\r\n checked,\r\n isEditable,\r\n } = this.state;\r\n return (\r\n \r\n {item.Assignment}\r\n {\r\n item.UnderstaffedRole ? (\r\n
\r\n );\r\n }\r\n}\r\n\r\nCellAssignment.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from '../../icon/Icon';\r\n\r\nexport class CellBillingCode extends Component {\r\n render() {\r\n const { item, column, config } = this.props;\r\n const contractTimeLeft = config.SowPo.contractsId;\r\n\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellBillingCode.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n config: PropTypes.object.isRequired,\r\n};\r\n","export const formHandleSubmit = (event) => {\r\n event.preventDefault();\r\n return false;\r\n};\r\n","import { getId } from 'services/location';\r\n\r\nexport const getDeleteConfig = (deleteUrlData, searchUpdateSaga, entityId = false, customUrl = false, projectId) => {\r\n return {\r\n entityId: entityId ? entityId : getId(),\r\n deleteUrlData,\r\n searchUpdateSaga,\r\n customUrl,\r\n projectId,\r\n };\r\n};\r\n","import moment from 'moment';\r\n\r\nexport const updateCheckedFlagOnRoles = (roles, idRole, parentId, startDateContract, endDateContract, forExtend) => {\r\n const additionalConditionForContract = (role) => moment(role.StartDate).isSameOrAfter(startDateContract, 'day')\r\n && moment(role.EndDate).isSameOrBefore(endDateContract, 'day');\r\n return roles.map((role) => role.Id === idRole && !parentId && role.Status.Name !== 'Removed'\r\n && (forExtend ? additionalConditionForContract(role) : true)\r\n ? {\r\n ...role,\r\n checked: !role.checked,\r\n Employees: role.Employees.map((employee) => employee.Status.Name !== 'Removed'\r\n ? { ...employee, checked: !role.checked } : employee),\r\n }\r\n : (parentId && role.checked\r\n ? {\r\n ...role,\r\n Employees: role.Employees.map((employee) => employee.Id === idRole\r\n && employee.Status.Name !== 'Removed'\r\n && (forExtend ? additionalConditionForContract(employee) : true) ? { ...employee, checked: !employee.checked } : employee),\r\n }\r\n : role));\r\n};\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport {\r\n getProjectDetails,\r\n getProjectTeams,\r\n getProjectRoleConfig,\r\n setTransferedRoles,\r\n getRoles,\r\n toogleRolesStatus,\r\n setListSettings,\r\n getHistory,\r\n getManagersByOffice,\r\n getProjectMilestones,\r\n patchProjectMilestone,\r\n updateProjectMilestoneEditingForm,\r\n getAllCurrencies,\r\n getAllEngagementTypes,\r\n getProjectTeamEmployees,\r\n} from '../../actions/projectsActions';\r\nimport {\r\n importSow, importPo, importAmendment,\r\n} from 'pages/projects/actions/importContractAction';\r\nimport {\r\n showModal as showRoleModal,\r\n getProjectEmployees,\r\n getStatus,\r\n getEmployeeStatus,\r\n getEditAssignment,\r\n} from '../../actions/roleModalActions';\r\nimport Tabs from 'common/components/tabs/tabs';\r\nimport { List } from 'common/components/list/list';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { getId } from 'services/location';\r\nimport { getSelectedTab } from 'common/actions/selectedTabActions';\r\nimport './project-details.css';\r\nimport { filterChoosenExtendRoles } from 'services/filterChoosenExtendRoles';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { AlertDialog } from 'common/components/alert-dialog/alert-dialog.js';\r\nimport { ProjectHistory } from '../project-history/project-history';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport sortByAplhabet from 'utils/sortByAplhabet';\r\nimport { debounce } from 'services/debounce';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport ProjectBasicInfoForm from 'common/components/redux-form/project-basic-info-form';\r\nimport { CustomStatusCell } from 'common/components/list/custom-cell/custom-status-cell';\r\nimport { CellDate } from 'common/components/list/custom-cell/cell-date';\r\nimport { CellDatePicker } from 'common/components/list/custom-cell/cell-toogle-datepicker';\r\nimport { CellToggleBudget } from 'common/components/list/custom-cell/cell-toggle-budget';\r\nimport { CellSwitcher } from 'common/components/list/custom-cell/cell-switcher';\r\nimport { CellRate } from 'common/components/list/custom-cell/cell-rate';\r\nimport { CellPercent } from 'common/components/list/custom-cell/cell-percent';\r\nimport { CellToggleCheckbox } from 'common/components/list/custom-cell/cell-toggle-checkbox';\r\nimport { CellAssignment } from 'common/components/list/custom-cell/cell-assignment';\r\nimport { CellBillingCode } from 'common/components/list/custom-cell/cell-billing-code';\r\nimport { CellTimeleft } from 'common/components/list/custom-cell/cell-timeleft';\r\nimport { CellBudget } from 'common/components/list/custom-cell/cell-budget';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { getDeleteConfig } from 'utils/getDeleteConfig.js';\r\nimport { getManageInvoiceDates } from 'pages/admin/actions/adminManageInvoiceDates';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport {\r\n TIME_AND_MATERIAL,\r\n MILESTONE_BACKUP_USED_COLUMN_NAME,\r\n CHANGE_ENGAGEMENT_TYPE,\r\n ACTIVE,\r\n EXTENDED,\r\n} from 'utils/const-variable';\r\nimport { updateCheckedFlagOnRoles } from 'pages/projects/components/utils/updateCheckedFlagOnRoles';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\n\r\nconst clientManagerNameReg = /([a-zA-Z]{1,24})+(\\s?)+([a-zA-Z]{1,25})?/;\r\n\r\nexport class ProjectDetails extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { selectedTab } = this.props;\r\n const projectId = getId();\r\n this.state = {\r\n CONTRACTS_TAB_INDEX: 0,\r\n ROLES_TAB_INDEX: 1,\r\n MILESTONES_TAB_INDEX: 2,\r\n HISTORY_TAB_INDEX: 3,\r\n TEAMS_TAB_INDEX: 4,\r\n tabLinks: ['Contracts', 'Roles', 'Milestones', 'View History', 'Teams'],\r\n selectedTab,\r\n columnsToDisplay: [\r\n // columns for contracts\r\n [\r\n {\r\n Name: 'Contract ID',\r\n Id: 'Contract',\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Company',\r\n Id: 'Company',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Approver',\r\n Id: 'Approver',\r\n isObject: true,\r\n className: 'medium-col',\r\n },\r\n {\r\n Name: 'Type',\r\n Id: 'Type',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Booked Revenue',\r\n Id: 'Budget',\r\n isBudget: true,\r\n },\r\n {\r\n Name: 'Invoiced Revenue',\r\n Id: 'RealizedRevenue',\r\n className: 'medium-col',\r\n isBudget: true,\r\n },\r\n {\r\n Name: 'Revenue Received',\r\n Id: 'RevenueReceived',\r\n className: 'medium-col',\r\n isBudget: true,\r\n },\r\n {\r\n Name: 'Start Date',\r\n Id: 'StartDate',\r\n isDate: true,\r\n },\r\n {\r\n Name: 'End Date',\r\n Id: 'EndDate',\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Status',\r\n Id: 'Status',\r\n isObject: true,\r\n className: 'small-col',\r\n },\r\n ],\r\n // columns for contracts\r\n // columns for roles\r\n [\r\n {\r\n Name: 'Role Name',\r\n Id: 'RoleName',\r\n className: 'medium-col',\r\n },\r\n {\r\n Name: 'Role Type',\r\n Id: 'Role',\r\n className: 'medium-col',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Assignment',\r\n Id: 'Assignment',\r\n WithOpenRole: true,\r\n },\r\n {\r\n Name: 'Ass. Type',\r\n Id: 'AssignmentType',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Seniority Level',\r\n Id: 'SeniorityLevel',\r\n isObject: true,\r\n className: 'small-col header-title__fixed-width',\r\n },\r\n {\r\n Name: 'Billable Status',\r\n Id: 'BillableStatus',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Rate',\r\n Id: 'Rate',\r\n isBudget: true,\r\n },\r\n {\r\n Name: 'SOW/PO Number',\r\n Id: 'SowPo',\r\n className:\r\n 'medium-col header-title__fixed-width col-span__with-nowrap',\r\n },\r\n {\r\n Name: 'Start Date',\r\n Id: 'StartDate',\r\n isDate: true,\r\n },\r\n {\r\n Name: 'End Date',\r\n Id: 'EndDate',\r\n },\r\n {\r\n Name: 'Status',\r\n Id: 'Status',\r\n isObject: true,\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Comment',\r\n Id: 'Comment',\r\n isInnerComment: true,\r\n deleteArrow: 'delete-arrow',\r\n className: 'small-col white-space_nowrap',\r\n },\r\n ],\r\n // columns for roles\r\n // columns for projectMilestones\r\n [\r\n {\r\n Name: 'Contract',\r\n Id: 'Name',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Total Bookings',\r\n Id: 'Budget',\r\n isBudget: true,\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Invoiced Revenue',\r\n Id: 'RealizedRevenue',\r\n isBudget: true,\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Revenue Received',\r\n Id: 'RevenueReceived',\r\n isBudget: true,\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n // {\r\n // Name: 'Delta to Goal',\r\n // Id: 'RemainingBalance',\r\n // isBudget: true,\r\n // className: 'without-width-col',\r\n // deleteArrow: 'delete-arrow',\r\n // },\r\n // {\r\n // Name: 'Booked Revenue',\r\n // Id: 'BookedRevenue',\r\n // isBudget: true,\r\n // className: 'without-width-col',\r\n // deleteArrow: 'delete-arrow',\r\n // },\r\n {\r\n Name: 'Realized Budget Utilization',\r\n Id: 'CurrentBudgetUtilization',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Projected Revenue',\r\n Id: 'ProjectedRevenue',\r\n isBudget: true,\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Projected Budget Utilization',\r\n Id: 'ProjectedBudgetUtilization',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Leftover',\r\n Id: 'Leftover',\r\n isBudget: true,\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n // columns for projectMilestones\r\n [\r\n // View History\r\n ],\r\n // columns for History\r\n // columns for teams\r\n [\r\n {\r\n Name: 'Team Name',\r\n Id: 'Name',\r\n className: 'medium-col',\r\n },\r\n {\r\n Name: 'Lead',\r\n Id: 'Lead',\r\n className: 'medium-col',\r\n deleteArrow: 'delete-arrow',\r\n hasBadge: true,\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Second in Command',\r\n Id: 'SecondInCommand',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n hasBadge: true,\r\n isObject: true,\r\n },\r\n ],\r\n ],\r\n innerColumnsToDisplay: {\r\n POs: [\r\n {\r\n Name: 'PO Number',\r\n Id: 'Contract',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'PO Approver',\r\n Id: 'Approver',\r\n className: 'medium-col',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Booked Revenue',\r\n Id: 'Budget',\r\n className: 'medium-col',\r\n isBudget: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Invoiced Revenue',\r\n Id: 'RealizedRevenue',\r\n className: 'medium-col',\r\n isBudget: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Revenue Received',\r\n Id: 'RevenueReceived',\r\n className: 'medium-col',\r\n isBudget: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'StartDate',\r\n Id: 'StartDate',\r\n className: 'medium-col',\r\n isDate: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'EndDate',\r\n Id: 'EndDate',\r\n className: 'medium-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Status',\r\n Id: 'Status',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Type',\r\n Id: 'Type',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n Employees: [\r\n {\r\n Name: 'Name',\r\n Id: 'Name',\r\n className: 'without-width-col',\r\n hasBadge: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Office',\r\n Id: 'Office',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Assignment',\r\n Id: 'Assignment',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'StartDate',\r\n Id: 'StartDate',\r\n isDate: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'EndDate',\r\n Id: 'EndDate',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Status',\r\n Id: 'Status',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Comment',\r\n Id: 'Comment',\r\n isInnerComment: true,\r\n deleteArrow: 'delete-arrow',\r\n className: 'medium-col white-space_nowrap',\r\n },\r\n ],\r\n Amendment: [\r\n {\r\n Name: 'Amendment Number',\r\n Id: 'Contract',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Amendment Approver',\r\n Id: 'Approver',\r\n className: 'medium-col',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n // {\r\n // Name: 'Booked Revenue',\r\n // Id: 'Budget',\r\n // className: 'medium-col',\r\n // isBudget: true,\r\n // deleteArrow: 'delete-arrow',\r\n // },\r\n // {\r\n // Name: 'Invoiced Revenue',\r\n // Id: 'RealizedRevenue',\r\n // className: 'medium-col',\r\n // isBudget: true,\r\n // deleteArrow: 'delete-arrow',\r\n // },\r\n {\r\n Name: 'StartDate',\r\n Id: 'StartDate',\r\n className: 'medium-col',\r\n isDate: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'EndDate',\r\n Id: 'EndDate',\r\n className: 'medium-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Status',\r\n Id: 'Status',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n className: 'small-col',\r\n },\r\n ],\r\n Milestones: [\r\n {\r\n Name: 'Milestone',\r\n Id: 'Milestone',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Contract Number',\r\n Id: 'ContractNumber',\r\n className: 'without-width-col',\r\n isObject: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Milestone Amount',\r\n Id: 'MilestoneAmount',\r\n className: 'without-width-col',\r\n isBudget: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Invoiced Amount',\r\n Id: 'InvoicedAmount',\r\n className: 'without-width-col',\r\n isBudget: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n\r\n {\r\n Name: 'Revenue Received',\r\n Id: 'RevenueReceived',\r\n className: 'without-width-col',\r\n isBudget: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Invoiced Date',\r\n Id: 'InvoicedDate',\r\n className: 'without-width-col',\r\n isDate: true,\r\n deleteArrow: 'delete-arrow',\r\n },\r\n // {\r\n // Name: 'Delta to Goal',\r\n // Id: 'RemainingBalance',\r\n // className: 'without-width-col',\r\n // isBudget: true,\r\n // deleteArrow: 'delete-arrow',\r\n // },\r\n {\r\n Name: 'Approved',\r\n Id: 'Approved',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Backup used',\r\n Id: 'UsedAssignmentBackupUser',\r\n className: 'without-width-col',\r\n deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n Members: [\r\n {\r\n Name: 'Full Name',\r\n Id: 'Employee',\r\n className: 'without-width-col',\r\n hasBadge: true,\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Office',\r\n Id: 'Office',\r\n className: 'medium-col',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'StartDate',\r\n Id: 'StartDate',\r\n isDate: true,\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'EndDate',\r\n Id: 'EndDate',\r\n isDate: true,\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Seniority Level',\r\n Id: 'SeniorityLevel',\r\n className: 'medium-col',\r\n isObject: true,\r\n },\r\n {\r\n Name: 'Role',\r\n Id: 'Role',\r\n isObject: true,\r\n className: 'medium-col',\r\n },\r\n {\r\n Name: 'Status',\r\n Id: 'Status',\r\n isObject: true,\r\n className: 'small-col',\r\n },\r\n {\r\n Name: 'Position',\r\n Id: 'TeamPosition',\r\n className: 'small-col',\r\n deleteArrow: 'delete-arrow',\r\n isObject: true,\r\n hasBadge: true,\r\n withoutTitle: true,\r\n },\r\n ],\r\n },\r\n projectBasicInfoData: {},\r\n sortRolesEmployee: [],\r\n hightLight: false,\r\n hightLightClientManager: false,\r\n transferingRoles: [],\r\n isActiveExtendButton: false,\r\n showDialogExtend: false,\r\n isOpenDeletePopup: false,\r\n projectHistory: {\r\n History: [],\r\n TotalCount: '',\r\n },\r\n takeHistory: 15,\r\n hasMoreHistory: true,\r\n rolesForRender: [],\r\n teamsForRender: [],\r\n idForChecked: [],\r\n itsEngineer: false,\r\n projectId,\r\n showEngagementTypeDialog: false,\r\n };\r\n\r\n this.scrollbarRef = React.createRef();\r\n\r\n this.mainContractsDeleteConfigs = {\r\n sow: getDeleteConfig(\r\n 'sows',\r\n 'projects/sow',\r\n false,\r\n true,\r\n projectId,\r\n ),\r\n msa: getDeleteConfig(\r\n 'msas',\r\n 'projects/msa',\r\n false,\r\n true,\r\n projectId,\r\n ),\r\n };\r\n this.sowDeleteConfig = getDeleteConfig(\r\n 'sows',\r\n 'projects/sow',\r\n false,\r\n true,\r\n projectId,\r\n );\r\n this.msaDeleteConfig = getDeleteConfig(\r\n 'msas',\r\n 'projects/msa',\r\n false,\r\n true,\r\n projectId,\r\n );\r\n this.poDeleteConfig = getDeleteConfig(\r\n 'pos',\r\n 'projects/po',\r\n false,\r\n true,\r\n projectId,\r\n );\r\n this.amendmentDeleteConfig = getDeleteConfig(\r\n 'amendments',\r\n 'projects/po',\r\n false,\r\n true,\r\n projectId,\r\n );\r\n this.roleDeleteConfig = getDeleteConfig(\r\n `projects/${projectId}/roles/`,\r\n 'projects/roles',\r\n );\r\n this.roleEmployeesDeleteConfig = getDeleteConfig(\r\n '',\r\n 'projects/roles/assignment',\r\n );\r\n this.teamDeleteConfig = getDeleteConfig(\r\n `projects/${projectId}/teams/`,\r\n 'projects/teams',\r\n );\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n getProjectDetails,\r\n getProjectRoleConfig,\r\n getStatus,\r\n getEmployeeStatus,\r\n defaultCheckedShowRoles,\r\n selectedTab,\r\n getManageInvoiceDates,\r\n setComponent,\r\n getAllCurrencies,\r\n resetDefaultFilters,\r\n getAllEngagementTypes,\r\n getProjectMilestones,\r\n HasFinancialAccess,\r\n fiscalYears,\r\n } = this.props;\r\n const { projectId } = this.state;\r\n const params = {};\r\n if (fiscalYears[projectId]) {\r\n params.FiscalYear = fiscalYears[projectId];\r\n }\r\n getProjectDetails(projectId, !defaultCheckedShowRoles, true, params);\r\n getProjectRoleConfig(projectId);\r\n getAllCurrencies();\r\n getAllEngagementTypes();\r\n getStatus();\r\n getEmployeeStatus();\r\n getManageInvoiceDates();\r\n this.setSelectedTab(selectedTab);\r\n this.getRoleSetting();\r\n setComponent({\r\n returnButton: {\r\n text: 'Projects',\r\n goToPreviousPage: this.goToProjectsList,\r\n },\r\n });\r\n if (HasFinancialAccess) {\r\n getProjectMilestones(projectId);\r\n }\r\n resetDefaultFilters();\r\n this.resetListSettings();\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState) {\r\n const {\r\n projectDetails,\r\n projectTeams,\r\n defaultCheckedShowRoles,\r\n viewHistory,\r\n getHistory,\r\n selectedTab,\r\n getManagersByOffice,\r\n listSettings,\r\n getProjectMilestones,\r\n getSelectedTab,\r\n HasFinancialAccess,\r\n } = this.props;\r\n const {\r\n takeHistory, rolesForRender, idForChecked, projectId, tabLinks, TEAMS_TAB_INDEX, CONTRACTS_TAB_INDEX,\r\n } = this.state;\r\n const { history } = listSettings.childState;\r\n if (prevProps.selectedTab !== selectedTab) {\r\n this.setSelectedTab(selectedTab);\r\n }\r\n if (isObjectNotEquals(prevProps.projectDetails, projectDetails)) {\r\n this.setDefaultData();\r\n }\r\n if (prevProps.projectDetails && isObjectNotEquals(prevProps.projectDetails.Contracts, projectDetails.Contracts)) {\r\n if (HasFinancialAccess) {\r\n getProjectMilestones(projectId);\r\n }\r\n }\r\n if (\r\n projectDetails\r\n && projectDetails.Roles\r\n && prevProps.projectDetails.Roles !== projectDetails.Roles\r\n ) {\r\n this.setRolesForRender();\r\n }\r\n if (\r\n projectTeams\r\n && projectTeams.Teams\r\n && prevProps.projectTeams.Teams !== projectTeams.Teams\r\n ) {\r\n this.setTeamsForRender();\r\n }\r\n if (isObjectNotEquals(prevState.rolesForRender, rolesForRender)) {\r\n this.rolesSortEmployees();\r\n }\r\n if (prevProps.defaultCheckedShowRoles !== defaultCheckedShowRoles) {\r\n this.refreshRoles();\r\n }\r\n if (prevProps.viewHistory !== viewHistory) {\r\n this.setState({\r\n projectHistory: viewHistory,\r\n });\r\n }\r\n if (prevState.takeHistory !== takeHistory) {\r\n getHistory(projectId, 0, takeHistory, history);\r\n }\r\n if (isObjectNotEquals(prevProps.listSettings.childState.history, history)) {\r\n getHistory(projectId, 0, takeHistory, history);\r\n }\r\n if (prevState.idForChecked !== idForChecked) {\r\n this.rolesSortEmployees();\r\n }\r\n if (\r\n projectDetails\r\n && projectDetails.Offices\r\n && prevProps.projectDetails.Offices !== projectDetails.Offices\r\n ) {\r\n getManagersByOffice(projectDetails.Offices.map((item) => item.Id));\r\n }\r\n if (projectDetails && projectDetails.EngagementType && projectDetails.EngagementType.Name !== 'Team-based') {\r\n const isTeamsTabExist = tabLinks.some(tab => tab === 'Teams');\r\n isTeamsTabExist && this.setState({\r\n tabLinks: tabLinks.filter(tab => tab !== 'Teams'),\r\n });\r\n (selectedTab === TEAMS_TAB_INDEX) && getSelectedTab(CONTRACTS_TAB_INDEX);\r\n }\r\n if (projectDetails && projectDetails.EngagementType && projectDetails.EngagementType.Name === 'Team-based') {\r\n const isTeamsTabExist = tabLinks.some(tab => tab === 'Teams');\r\n !isTeamsTabExist && this.setState({\r\n tabLinks: [...tabLinks, 'Teams'],\r\n });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent } = this.props;\r\n resetComponent();\r\n }\r\n\r\n resetListSettings = () => {\r\n const { setListSettings } = this.props;\r\n const childState = {\r\n contracts: {\r\n search: '',\r\n sortColumn: null,\r\n sortDirection: null,\r\n },\r\n roles: {\r\n search: '',\r\n sortColumn: 'RoleName',\r\n sortDirection: 'Up',\r\n },\r\n history: {\r\n search: '',\r\n startDateHistory: null,\r\n endDateHistory: null,\r\n },\r\n teams: {\r\n search: '',\r\n sortColumn: 'TeamName',\r\n sortDirection: 'Up',\r\n },\r\n };\r\n setListSettings({ childState });\r\n }\r\n\r\n goToProjectsList = () => {\r\n this.resetListSettings();\r\n history.push({ pathname: '/projects' });\r\n };\r\n\r\n setRolesForRender = () => {\r\n const { projectDetails, listSettings } = this.props;\r\n const { roles } = listSettings.childState;\r\n this.setState({\r\n rolesForRender: recursiveSearch(\r\n sortList(projectDetails.Roles, roles.sortColumn, roles.sortDirection),\r\n roles.search,\r\n ),\r\n });\r\n };\r\n\r\n setTeamsForRender = () => {\r\n const { projectTeams, listSettings } = this.props;\r\n const { teams } = listSettings.childState;\r\n this.setState({\r\n teamsForRender: recursiveSearch(\r\n sortList(projectTeams.Teams, teams.sortColumn, teams.sortDirection),\r\n teams.search,\r\n ),\r\n });\r\n };\r\n\r\n changeAmountHistory = (page) => {\r\n const { takeHistory } = this.state;\r\n const { loading } = this.props;\r\n const increaseParams = takeHistory + page;\r\n if (!loading) {\r\n this.setState(\r\n {\r\n takeHistory: increaseParams,\r\n },\r\n () => this.isNeedMoreStory(),\r\n );\r\n }\r\n };\r\n\r\n isNeedMoreStory = () => {\r\n const { takeHistory, projectHistory } = this.state;\r\n this.setState({\r\n hasMoreHistory: takeHistory > projectHistory.TotalCount ? false : true,\r\n });\r\n };\r\n\r\n setSelectedTab = (selectedTab) => {\r\n this.setState(\r\n {\r\n selectedTab,\r\n },\r\n () => {\r\n this.loadDataForTabs();\r\n },\r\n );\r\n };\r\n\r\n setDefaultData = () => {\r\n const { projectDetails } = this.props;\r\n\r\n const currentYear = moment().year();\r\n const currentMonth = moment().month();\r\n const currentMonthMilestones = projectDetails.FinancialData\r\n && projectDetails.FinancialData.MilestonesByMonth\r\n && projectDetails.FinancialData.MilestonesByMonth.find(item => {\r\n const date = moment(item.Date);\r\n\r\n return date.year() === currentYear && date.month() === currentMonth;\r\n });\r\n\r\n this.setState({\r\n projectBasicInfoData: {\r\n Name: projectDetails.Name,\r\n Id: projectDetails.Id,\r\n ClientId: projectDetails.Client.Id,\r\n ClientName: projectDetails.Client.Name,\r\n Offices: projectDetails.Offices.length\r\n ? projectDetails.Offices.map((item) => item.Id)\r\n : [],\r\n StartDate: projectDetails.StartDate,\r\n EndDate: projectDetails.EndDate,\r\n PrimaryOffices: projectDetails.PrimaryOffices.length\r\n ? projectDetails.PrimaryOffices.map((item) => item.Id)\r\n : [],\r\n ClientManagerId:\r\n projectDetails.ClientManager && projectDetails.ClientManager.Id,\r\n ClientManagerName:\r\n projectDetails.ClientManager && projectDetails.ClientManager.Name,\r\n DeliveryManagers:\r\n projectDetails.DeliveryManagers\r\n && projectDetails.DeliveryManagers.map((item) => item.Id),\r\n DeliveryManagersValues:\r\n projectDetails.DeliveryManagers\r\n && projectDetails.DeliveryManagers.map((item) => ({\r\n label: item.Name,\r\n value: item.Id,\r\n })),\r\n EngineeringManagers:\r\n projectDetails.EngineeringManagers\r\n && projectDetails.EngineeringManagers.map((item) => item.Id),\r\n EngineeringManagersValues:\r\n projectDetails.EngineeringManagers\r\n && projectDetails.EngineeringManagers.map((item) => ({\r\n label: item.Name,\r\n value: item.Id,\r\n })),\r\n AccountManagerId:\r\n projectDetails.AccountManager && projectDetails.AccountManager.Id,\r\n AccountManagerName:\r\n projectDetails.AccountManager && projectDetails.AccountManager.Name,\r\n Description: projectDetails.Description,\r\n ProjectType: {\r\n Id: projectDetails.Billability.Id,\r\n Name: projectDetails.Billability.Name,\r\n },\r\n Status: projectDetails.Status,\r\n ProjectCode: projectDetails.ProjectCode,\r\n Aliases: projectDetails.Aliases,\r\n RealizedRevenue: projectDetails.FinancialData && projectDetails.FinancialData.RealizedRevenue,\r\n Budget: projectDetails.FinancialData && projectDetails.FinancialData.Budget,\r\n RemainingBalance: projectDetails.FinancialData && projectDetails.FinancialData.RemainingBalance,\r\n BookedRevenue: projectDetails.FinancialData && projectDetails.FinancialData.BookedRevenue,\r\n Leftover: projectDetails.FinancialData && projectDetails.FinancialData.Leftover,\r\n Currency: projectDetails.Currency,\r\n EngagementTypeId: projectDetails.EngagementType && projectDetails.EngagementType.Id,\r\n EngagementTypeName: projectDetails.EngagementType && projectDetails.EngagementType.Name,\r\n RevenueReceived: projectDetails.FinancialData && projectDetails.FinancialData.RevenueReceived,\r\n ProjectSize: projectDetails.FinancialData && projectDetails.FinancialData.ProjectSize,\r\n ProjectLeftover: projectDetails.FinancialData && projectDetails.FinancialData.ProjectLeftover,\r\n CurrentMonthMilestones: currentMonthMilestones && currentMonthMilestones.MilestonesByMonth || 0,\r\n },\r\n });\r\n };\r\n\r\n onTab = (selectedTab) => {\r\n const { getSelectedTab } = this.props;\r\n getSelectedTab(selectedTab);\r\n };\r\n\r\n filterContracts = (contract, searchValue) => {\r\n const str = new RegExp(searchValue, 'gi');\r\n let match = false;\r\n // eslint-disable-next-line no-unused-vars\r\n for (const key in contract) {\r\n match = contract[key] ? contract[key].toString().match(str) : false;\r\n if (match) break;\r\n }\r\n return match;\r\n };\r\n\r\n searchForTab = (param) => (value) => {\r\n const {\r\n projectDetails, setListSettings, listSettings, projectTeams,\r\n } = this.props;\r\n const childState = {\r\n ...listSettings.childState,\r\n [param]: { ...listSettings.childState[param], search: value },\r\n };\r\n setListSettings({ childState });\r\n if (param === 'roles') {\r\n const { roles } = childState;\r\n this.setState({\r\n rolesForRender: recursiveSearch(\r\n sortList(projectDetails.Roles, roles.sortColumn, roles.sortDirection),\r\n roles.search,\r\n ),\r\n });\r\n }\r\n\r\n if (param === 'teams') {\r\n const { teams } = childState;\r\n this.setState({\r\n teamsForRender: recursiveSearch(\r\n sortList(projectTeams.Teams, teams.sortColumn, teams.sortDirection),\r\n teams.search,\r\n ),\r\n });\r\n }\r\n };\r\n\r\n getRoleSetting = () => {\r\n const {\r\n showRoleModal,\r\n getProjectEmployees,\r\n projectDetails: { Contracts, Id },\r\n } = this.props;\r\n const billingData = {\r\n billingCodes: [],\r\n billingCodesStartDate: [],\r\n billingCodesEndDate: [],\r\n };\r\n Contracts.forEach((SOW) => {\r\n billingData.billingCodes.push(SOW.Contract);\r\n billingData.billingCodesStartDate.push(SOW.StartDate);\r\n billingData.billingCodesEndDate.push(SOW.EndDate);\r\n SOW.POs.forEach((PO) => {\r\n billingData.billingCodes.push(PO.Contract);\r\n billingData.billingCodesStartDate.push(PO.StartDate);\r\n billingData.billingCodesEndDate.push(PO.EndDate);\r\n });\r\n SOW.Amendments.forEach((Amendment) => {\r\n billingData.billingCodes.push(Amendment.Contract);\r\n billingData.billingCodesStartDate.push(Amendment.StartDate);\r\n billingData.billingCodesEndDate.push(Amendment.EndDate);\r\n });\r\n });\r\n showRoleModal([], billingData, 'ADD_ROLE_TO_PROJECT', Id);\r\n if (Id) {\r\n getProjectEmployees(Id);\r\n }\r\n };\r\n\r\n showRoleModal = () => {\r\n this.getRoleSetting();\r\n history.push({\r\n pathname: '/projects/new/addrole',\r\n });\r\n };\r\n\r\n addNewSOW = () => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/add-sow`,\r\n });\r\n };\r\n\r\n importSOW = ({ target }) => {\r\n const { importSow, projectDetails } = this.props;\r\n importSow(target.files[0], projectDetails.Id);\r\n target.value = '';\r\n };\r\n\r\n importContract = ({ target }, sowId, importType) => {\r\n const { importPo, importAmendment, projectDetails } = this.props;\r\n switch (importType) {\r\n case 'PO': {\r\n importPo(target.files[0], projectDetails.Id, sowId);\r\n target.value = '';\r\n break;\r\n }\r\n case 'Amendment': {\r\n importAmendment(target.files[0], projectDetails.Id, sowId);\r\n target.value = '';\r\n break;\r\n }\r\n case 'POExtension': {\r\n importPo(target.files[0], projectDetails.Id, sowId);\r\n target.value = '';\r\n break;\r\n }\r\n default: break;\r\n }\r\n }\r\n\r\n editSOW = (id) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/edit-sow/${id}`,\r\n });\r\n };\r\n\r\n viewSOW = (id) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/view-sow/${id}`,\r\n });\r\n };\r\n\r\n addNewMSA = () => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/add-msa`,\r\n });\r\n };\r\n\r\n editMSA = (id) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/edit-msa/${id}`,\r\n });\r\n };\r\n\r\n viewMSA = (id) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/view-msa/${id}`,\r\n });\r\n };\r\n\r\n addNewPO = (item) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/add-po/${item.parentId || item.id}`,\r\n });\r\n };\r\n\r\n editPO = (POId) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/edit-po/${POId}`,\r\n });\r\n };\r\n\r\n viewPO = (POId) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/view-po/${POId}`,\r\n });\r\n };\r\n\r\n editRole = (id) => {\r\n const { projectDetails } = this.props;\r\n this.getRoleSetting();\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/role/edit/${id}`,\r\n });\r\n };\r\n\r\n editAssignment = (id) => {\r\n const { getEditAssignment, projectDetails } = this.props;\r\n const { sortRolesEmployee } = this.state;\r\n this.getRoleSetting();\r\n const employeeObj = sortRolesEmployee.reduce((acc, item) => {\r\n if (\r\n typeof item.Employees.find((item) => item.Id === id) !== 'undefined'\r\n ) {\r\n acc = item.Employees.find((item) => item.Id === id);\r\n }\r\n return acc;\r\n }, {});\r\n employeeObj.projectId = projectDetails.Id;\r\n employeeObj.roleId = this.getRoleId(id);\r\n sortRolesEmployee.find((item) => item.Id === id);\r\n getEditAssignment(employeeObj);\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/assignment/edit/${id}`,\r\n });\r\n };\r\n\r\n deleteAssignment = (info) => {\r\n const { showDialog, projectTeams } = this.props;\r\n const { rolesForRender } = this.state;\r\n const isTeamMember = projectTeams.Teams.some(team => {\r\n return (\r\n team.Members\r\n && team.Members.some(member => (member.Id === (info.item && info.item.Id)))\r\n )\r\n || team.SecondInCommand && (team.SecondInCommand.Id === (info.item && info.item.EmployeeId));\r\n });\r\n\r\n const backupEmployees = [];\r\n const { Id } = info.item;\r\n\r\n // eslint-disable-next-line no-unused-vars\r\n for (const role of rolesForRender) {\r\n // eslint-disable-next-line no-unused-vars\r\n for (const employee of role.Employees) {\r\n if (employee.PrimaryAssignmentId === Id) {\r\n backupEmployees.push(employee);\r\n }\r\n }\r\n }\r\n\r\n const hasBackupEmployees = backupEmployees.length > 0;\r\n const backupAssignmentNames = backupEmployees.map((e) => e.Name);\r\n const message = `After this action employee history will be lost.\r\n ${isTeamMember\r\n ? (info.item && info.item.PrimaryAssignmentId)\r\n ? 'Also, this employee will be deleted from the teams.'\r\n : 'Also, this employee and his backup employees will be deleted from the teams.'\r\n : ''}\r\n ${hasBackupEmployees ? `Also, ${backupAssignmentNames.join(', ')} as backup will be deleted.` : ''}\r\n Click OK to confirm the action.\r\n `;\r\n\r\n const updateInfo = {\r\n ...info,\r\n url: `${this.getDeleteAssigmentURL(info)}${hasBackupEmployees ? '?deleteBackups=true' : ''}`,\r\n dialogTitle: message,\r\n closeButtonTitle: 'Cancel',\r\n confirmButtonTitle: 'OK',\r\n };\r\n showDialog(updateInfo);\r\n };\r\n\r\n getDeleteAssigmentURL = (info) => {\r\n return `projects/${info.entityId}/roles/${this.getRoleId(\r\n info.item.Id,\r\n )}/assignments/${info.item.Id}`;\r\n };\r\n\r\n getRoleId = (id) => {\r\n const { projectDetails } = this.props;\r\n return projectDetails.Roles.reduce((acc, item) => {\r\n if (item.Employees.find((item) => item.Id === id)) {\r\n acc = item.Id;\r\n }\r\n return acc;\r\n }, {});\r\n };\r\n\r\n viewRole = (id) => {\r\n const { projectDetails } = this.props;\r\n this.getRoleSetting();\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/role/view/${id}`,\r\n });\r\n };\r\n\r\n rolesSortEmployees = () => {\r\n const { rolesForRender } = this.state;\r\n const sortEmployeeArray = [];\r\n rolesForRender.forEach((item) => {\r\n sortEmployeeArray.push({\r\n Employees: sortByAplhabet(item.Employees).reduce((acc, elem) => {\r\n if (elem.Role !== 'Primary') {\r\n return acc;\r\n }\r\n acc.push(elem);\r\n const shadowAssignmentsForEmployee = item.Employees.filter(\r\n (i) => i.Role === 'Shadow' && i.PrimaryAssignmentId === elem.Id,\r\n );\r\n if (shadowAssignmentsForEmployee.length) {\r\n acc.push(...shadowAssignmentsForEmployee);\r\n }\r\n return acc;\r\n }, []),\r\n });\r\n });\r\n this.setState({\r\n sortRolesEmployee: sortEmployeeArray,\r\n });\r\n };\r\n\r\n checkRepeatedContracts = (contracts) => {\r\n const contractForRole = {};\r\n contracts.forEach((item, i) => {\r\n const value = contracts[i];\r\n contractForRole[value] = true;\r\n });\r\n return Object.keys(contractForRole);\r\n };\r\n\r\n extendRoles = () => {\r\n const { transferingRoles } = this.state;\r\n const { setTransferedRoles, projectDetails } = this.props;\r\n const onlyContractNames = transferingRoles.map((item) => item.SowPo);\r\n const onlyUniqSow = this.checkRepeatedContracts(onlyContractNames);\r\n if (transferingRoles.length) {\r\n if (onlyUniqSow.length === 1) {\r\n setTransferedRoles(transferingRoles);\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/extend-roles`,\r\n });\r\n } else {\r\n this.setState({\r\n showDialogExtend: true,\r\n });\r\n }\r\n }\r\n };\r\n\r\n getFilteredByChecked = (roles) => {\r\n return roles.filter((item) => item.checked === true);\r\n };\r\n\r\n getDefaultCheckedEmployee = (id, action, isOpenDropdown) => {\r\n if (action) {\r\n const { projectDetails } = this.props;\r\n const { idForChecked } = this.state;\r\n const rolesCopy = projectDetails.Roles;\r\n const idDefaultChecked = [];\r\n const openedRoles = Object.keys(isOpenDropdown);\r\n rolesCopy.forEach((role, index) => {\r\n if (role.Id === id && openedRoles.includes(index.toString())) {\r\n role.Employees.forEach((child) => {\r\n if (\r\n typeof child.checked === 'undefined'\r\n && child.Status.Name !== 'Removed'\r\n ) {\r\n if (!idForChecked.includes(child.Id)) {\r\n idDefaultChecked.push(child.Id);\r\n }\r\n }\r\n });\r\n }\r\n });\r\n this.setState({\r\n idForChecked: [...idForChecked, ...idDefaultChecked],\r\n });\r\n }\r\n };\r\n\r\n getRolesForExtend = (e, parent, isOpenDropdown) => {\r\n const { projectDetails } = this.props;\r\n const isActive = true;\r\n const rolesCopy = projectDetails.Roles;\r\n const idItem = e.target.value;\r\n const action = e.target.checked;\r\n const openedRoles = Object.keys(isOpenDropdown);\r\n const filteredRoles = filterChoosenExtendRoles(\r\n rolesCopy,\r\n idItem,\r\n parent,\r\n action,\r\n openedRoles,\r\n );\r\n const parentFilter = this.getFilteredByChecked(filteredRoles);\r\n const filteredArr = [];\r\n parentFilter.forEach((item) => {\r\n const child = this.getFilteredByChecked(item.Employees);\r\n if (child.length) {\r\n const newParent = {\r\n ...item,\r\n Employees: child,\r\n };\r\n filteredArr.push(newParent);\r\n } else {\r\n const newParent = {\r\n ...item,\r\n Employees: [],\r\n };\r\n filteredArr.push(newParent);\r\n }\r\n });\r\n this.setState(\r\n {\r\n transferingRoles: filteredArr,\r\n isActiveExtendButton: filteredArr.length ? isActive : !isActive,\r\n },\r\n () => this.getDefaultCheckedEmployee(idItem, action, isOpenDropdown),\r\n );\r\n };\r\n\r\n handleChangeShowRoles = () => {\r\n const { toogleRolesStatus } = this.props;\r\n toogleRolesStatus();\r\n };\r\n\r\n refreshRoles = () => {\r\n const { projectDetails, getRoles, defaultCheckedShowRoles } = this.props;\r\n getRoles(projectDetails.Id, !defaultCheckedShowRoles);\r\n };\r\n\r\n closeDialog = () => {\r\n this.setState({\r\n showDialogExtend: false,\r\n });\r\n };\r\n\r\n isContractTimeLessTwoWeeks = (amountDay) => {\r\n const { projectDetails } = this.props;\r\n const contractsId = [];\r\n projectDetails.Contracts.forEach((item) => {\r\n if (item.POs.length) {\r\n item.POs.forEach((po) => {\r\n if (\r\n moment(po.EndDate).diff(new Date(), 'day') < amountDay\r\n && po.Status.Name === 'Active'\r\n ) {\r\n contractsId.push(po.Id);\r\n }\r\n });\r\n }\r\n if (\r\n moment(item.EndDate).diff(new Date(), 'day') < amountDay\r\n && item.Status.Name === 'Active'\r\n ) {\r\n contractsId.push(item.Id);\r\n }\r\n });\r\n return contractsId;\r\n };\r\n\r\n isRolesTimeLessTwoWeeks = (amountDay) => {\r\n const { projectDetails } = this.props;\r\n const rolesId = [];\r\n projectDetails.Roles\r\n && projectDetails.Roles.forEach((item) => {\r\n if (item.Employees.length) {\r\n item.Employees.forEach((po) => {\r\n if (\r\n moment(po.EndDate).diff(new Date(), 'day') < amountDay\r\n && po.Status.Name === 'Active'\r\n ) {\r\n rolesId.push(po.Id);\r\n }\r\n });\r\n }\r\n if (\r\n moment(item.EndDate).diff(new Date(), 'day') < amountDay\r\n && item.Status.Name === 'Active'\r\n ) {\r\n rolesId.push(item.Id);\r\n }\r\n });\r\n return rolesId;\r\n };\r\n\r\n deleteProject = () => {\r\n const { showDialog, projectDetails } = this.props;\r\n const dataForDeleting = {\r\n url: `projects/${projectDetails.Id}`,\r\n searchUpdateSaga: 'deleteProjects',\r\n history: '/projects',\r\n };\r\n showDialog(dataForDeleting);\r\n };\r\n\r\n handleChooseDateHistory = (date, name) => {\r\n const { setListSettings, listSettings } = this.props;\r\n const childState = {\r\n ...listSettings.childState,\r\n history: { ...listSettings.childState.history, [name]: date },\r\n };\r\n setListSettings({ childState });\r\n };\r\n\r\n handleClearStartDateHistory = () => {\r\n const { setListSettings, listSettings } = this.props;\r\n const childState = {\r\n ...listSettings.childState,\r\n history: { ...listSettings.childState.history, startDateHistory: null },\r\n };\r\n setListSettings({ childState });\r\n };\r\n\r\n handleClearEndDateHistory = () => {\r\n const { setListSettings, listSettings } = this.props;\r\n const childState = {\r\n ...listSettings.childState,\r\n history: { ...listSettings.childState.history, endDateHistory: null },\r\n };\r\n setListSettings({ childState });\r\n };\r\n\r\n setSortSettingsForTab = (param) => (sortColumn, sortDirection) => {\r\n const {\r\n projectDetails, setListSettings, listSettings, projectTeams,\r\n } = this.props;\r\n const childState = {\r\n ...listSettings.childState,\r\n [param]: { ...listSettings.childState[param], sortColumn, sortDirection },\r\n };\r\n setListSettings({ childState });\r\n if (param === 'roles') {\r\n const { roles } = childState;\r\n this.setState({\r\n rolesForRender: recursiveSearch(\r\n sortList(projectDetails.Roles, roles.sortColumn, roles.sortDirection),\r\n roles.search,\r\n ),\r\n });\r\n }\r\n\r\n if (param === 'teams') {\r\n const { teams } = childState;\r\n this.setState({\r\n teamsForRender: recursiveSearch(\r\n sortList(projectTeams.Teams, teams.sortColumn, teams.sortDirection),\r\n teams.search,\r\n ),\r\n });\r\n }\r\n };\r\n\r\n addAmendment = (id) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/add-amendment/${id}`,\r\n });\r\n };\r\n\r\n viewAmendment = (id) => {\r\n const { projectDetails } = this.props;\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}/view-amendment/${id}`,\r\n });\r\n };\r\n\r\n renderAmendmentMenu = (id) => {\r\n const { ManageProjectContracts, projectDetails } = this.props;\r\n\r\n const canAddAmendment = projectDetails.Contracts.find((statementOfWork) => statementOfWork.Id === id && statementOfWork.POs.length === 0);\r\n\r\n return (\r\n ManageProjectContracts && canAddAmendment && (\r\n \r\n \r\n {item.SowPo}\r\n \r\n {contractTimeLeft.includes(item.SowPoId) ? (\r\n
\r\n \r\n
\r\n ) : null}\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nProjectDetails.propTypes = {\r\n projectDetails: PropTypes.object,\r\n selectedTab: PropTypes.number,\r\n getProjectDetails: PropTypes.func,\r\n getProjectMilestones: PropTypes.func,\r\n patchProjectMilestone: PropTypes.func,\r\n getProjectRoleConfig: PropTypes.func,\r\n showRoleModal: PropTypes.func,\r\n getProjectEmployees: PropTypes.func,\r\n filtersReducer: PropTypes.object,\r\n billingTypes: PropTypes.array,\r\n getStatus: PropTypes.func,\r\n getEmployeeStatus: PropTypes.func,\r\n getSelectedTab: PropTypes.func,\r\n setTransferedRoles: PropTypes.func,\r\n getRoles: PropTypes.func,\r\n getEditAssignment: PropTypes.func,\r\n toogleRolesStatus: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n settings: PropTypes.object,\r\n getHistory: PropTypes.func,\r\n viewHistory: PropTypes.object,\r\n getManagersByOffice: PropTypes.func.isRequired,\r\n getManageInvoiceDates: PropTypes.func.isRequired,\r\n deliveryManagersByOffice: PropTypes.array.isRequired,\r\n engineeringManagersByOffice: PropTypes.array.isRequired,\r\n accountManagersByOffice: PropTypes.array.isRequired,\r\n isImportLoading: PropTypes.bool,\r\n allEngagementTypes: PropTypes.array.isRequired,\r\n};\r\n\r\nexport default connect(\r\n (store) => ({\r\n projectDetails: store.projectsReducer.projectDetails,\r\n projectTeams: store.projectsReducer.projectTeams,\r\n filtersReducer: store.filtersReducer.filters,\r\n clientContacts: store.projectsReducer.clientContacts,\r\n billingTypes: store.projectsReducer.projectTypes,\r\n offices: store.filtersReducer.filters.Offices,\r\n selectedTab: store.selectedTabReducer.selectedTab,\r\n loading: store.loadingReducer.isLoading,\r\n defaultCheckedShowRoles: store.showRoles.isOnlyActiveRoles,\r\n settings: store.adminReducer.settings,\r\n viewHistory: store.projectsReducer.ViewHistory,\r\n deliveryManagersByOffice: store.projectsReducer.deliveryManagersByOffice,\r\n engineeringManagersByOffice:\r\n store.projectsReducer.engineeringManagersByOffice,\r\n accountManagersByOffice: store.projectsReducer.accountManagersByOffice,\r\n hasDefoultFinancialAccess: store.authReducer.HasFinancialAccess,\r\n allCurrencies: store.projectsReducer.allCurrencies,\r\n allEngagementTypes: store.projectsReducer.allEngagementTypes,\r\n projectMilestones: store.projectsReducer.projectMilestones,\r\n listSettings: store.projectsReducer.listSettings,\r\n isImportLoading: store.importContractReducer.isLoading,\r\n fiscalYears: store.projectsReducer.fiscalYears,\r\n }),\r\n {\r\n getProjectDetails,\r\n getProjectTeams,\r\n getProjectRoleConfig,\r\n showRoleModal,\r\n getProjectEmployees,\r\n getStatus,\r\n getEmployeeStatus,\r\n getSelectedTab,\r\n setTransferedRoles,\r\n showDialog,\r\n getRoles,\r\n getEditAssignment,\r\n toogleRolesStatus,\r\n getHistory,\r\n getManagersByOffice,\r\n getProjectMilestones,\r\n patchProjectMilestone,\r\n getManageInvoiceDates,\r\n updateProjectMilestoneEditingForm,\r\n setComponent,\r\n resetComponent,\r\n setListSettings,\r\n getAllCurrencies,\r\n importSow,\r\n importPo,\r\n importAmendment,\r\n getAllEngagementTypes,\r\n getProjectTeamEmployees,\r\n },\r\n)(ProjectDetails);\r\n","import moment from 'moment';\r\n\r\nexport const getTheBiggestDateForRoles = (Employees) => {\r\n const arrayEndDate = Employees.map((employee) => employee.EmployeeEndDate);\r\n return arrayEndDate.length ? moment.min(arrayEndDate.map(date => moment(date))) : null;\r\n};\r\n\r\nexport const getTheSmallestDateForRoles = (Employees) => {\r\n const arrayStartDate = Employees.map((employee) => employee.EmployeeStartDate);\r\n return arrayStartDate.length ? moment.min(arrayStartDate.map(date => moment(date))) : null;\r\n};\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport moment from 'moment';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport {\r\n closeModal, editRole, addRoleToProject, showModal, getEmployees, getStatus, getEmployeeStatus, setBillingData,\r\n} from '../../actions/roleModalActions';\r\nimport classNames from 'classnames';\r\nimport history from 'utils/history';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport InputCurrency from 'common/components/form-items/input-currency/input-currency';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport './role-modal.css';\r\nimport { getProjectDetails } from '../../actions/projectsActions';\r\nimport {\r\n PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n PROJECT_ROLES_EMPLOYEES_DISABLED,\r\n PROJECT_ROLES_EMPLOYEES_FORMER,\r\n DEFAULT_EMPLOYEE_ASSIGNMENTS,\r\n PROJECT_ROLES_STATUS_ACTIVE,\r\n} from 'utils/const-variable';\r\nimport { sortRoleEmployees } from 'utils/sortRoleEmployees';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { AlertDialog } from 'common/components/alert-dialog/alert-dialog.js';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\nimport AddEmployee from './add-employee/add-employee';\r\nimport sortArrayByPriority from 'utils/sortArrayByPriority';\r\nimport { isCorrectRoleAssignment } from '../utils/isCorrectRoleAssignments';\r\nimport { getTheBiggestDateForRoles, getTheSmallestDateForRoles } from '../utils/getTheBiggestDateRangeForRoles';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport formatCurrency from 'utils/formatCurrency';\r\n\r\nconst billable = 'Billable';\r\n// eslint-disable-next-line no-useless-escape\r\nconst reqularExpRate = /^((?!0)|(0\\.))\\d{1,9}(\\,\\d{1,9}){0,3}?(\\.\\d{1,5})?$/;\r\n\r\nexport class EditRoleModal extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const {\r\n currentRoles, projectId, roleStatus, roleEmployeeStatus, billingCodes, rateUnits,\r\n ManageProjectRoles, HasFinancialAccess, ManageProjectRoleAssignments,\r\n } = this.props;\r\n this.state = {\r\n ItemId: (currentRoles.length > 0 ? currentRoles[currentRoles.length - 1].ItemId : -1),\r\n projectId,\r\n RoleName: '',\r\n RoleId: '',\r\n RoleType: '',\r\n SeniorityId: '',\r\n SeniorityLevel: '',\r\n BillableStatusId: '',\r\n BillableStatus: '',\r\n Rate: '',\r\n OvertimeRate: '',\r\n AssignmentTypeId: 1,\r\n AssignmentType: 'Offshore',\r\n Comment: '',\r\n Assignment: 1,\r\n StartDate: null,\r\n EndDate: null,\r\n BillingCodeId: '',\r\n BillingCode: '',\r\n PrimaryAssignmentId: '',\r\n SendPrimaryEmployeeId: '',\r\n PrimaryEmployeeName: '',\r\n StatusId: '',\r\n Status: '',\r\n roleType: PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n Employees: [],\r\n isModalFieldsRequired: false,\r\n assignmentIsUnvalid: false,\r\n employeeAssignmentIsUnvalid: false,\r\n employeeNameError: false,\r\n roleStatus: roleStatus || [],\r\n roleEmployeeStatus: roleEmployeeStatus || [],\r\n billingCodes: billingCodes || [],\r\n showEditAssignmentModal: false,\r\n editAssignment: {},\r\n isDialogOpened: false,\r\n actionData: {},\r\n showConfirm: false,\r\n showConfirmStatus: false,\r\n invalidRateData: false,\r\n invalidOverRateData: false,\r\n rateUnit: rateUnits && rateUnits.length ? rateUnits[0].Id : '',\r\n overtimeRateUnit: rateUnits && rateUnits.length ? rateUnits[0].Id : '',\r\n isEmployeeListValid: true,\r\n haveSameEmployees: false,\r\n ManageProjectRoles,\r\n HasFinancialAccess,\r\n ManageProjectRoleAssignments,\r\n isLateInit: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n editRoles, location, setComponent, getProjectDetails, isOnlyActive,\r\n } = this.props;\r\n const projectId = location.pathname.split('/')[2];\r\n if (editRoles.Name) {\r\n this.init();\r\n } else if (projectId) {\r\n this.setState({ isLateInit: true });\r\n getProjectDetails(projectId, isOnlyActive);\r\n } else history.goBack({ state: location.state });\r\n setComponent({ title: 'EDIT ROLE' });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n editRoles, roleStatus, roleEmployeeStatus, isLoading, billingCodes: billingCodesProps,\r\n } = this.props;\r\n const { isLateInit, billingCodes } = this.state;\r\n if (editRoles.Name && isLateInit && !isLoading) {\r\n this.init();\r\n }\r\n if (prevProps.roleStatus !== roleStatus || prevProps.roleEmployeeStatus !== roleEmployeeStatus) {\r\n this.setState({\r\n roleStatus,\r\n roleEmployeeStatus,\r\n }, () => this.requireFields());\r\n }\r\n if (billingCodesProps.length !== billingCodes.length) {\r\n this.setState({ billingCodes: billingCodesProps });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent } = this.props;\r\n resetComponent();\r\n }\r\n\r\n init = () => {\r\n const {\r\n assignmentTypes, roleStatus, roleEmployeeStatus, getStatus, getEmployeeStatus, projectDetails: { Contracts }, setBillingData,\r\n } = this.props;\r\n const { isLateInit } = this.state;\r\n this.findArrValue(assignmentTypes);\r\n if (isLateInit) {\r\n getStatus();\r\n const billingCodes = [],\r\n billingCodesStartDate = [],\r\n billingCodesEndDate = [];\r\n Contracts.forEach((SOW) => {\r\n billingCodes.push(SOW.Contract);\r\n billingCodesStartDate.push(SOW.StartDate);\r\n billingCodesEndDate.push(SOW.EndDate);\r\n SOW.POs.forEach((PO) => {\r\n billingCodes.push(PO.Contract);\r\n billingCodesStartDate.push(PO.StartDate);\r\n billingCodesEndDate.push(PO.EndDate);\r\n });\r\n SOW.Amendments.forEach((Amendment) => {\r\n billingCodes.push(Amendment.Contract);\r\n billingCodesStartDate.push(Amendment.StartDate);\r\n billingCodesEndDate.push(Amendment.EndDate);\r\n });\r\n });\r\n setBillingData(billingCodes, billingCodesStartDate, billingCodesEndDate);\r\n }\r\n getEmployeeStatus();\r\n this.getRoleEditDataInputs();\r\n this.setState({\r\n roleStatus,\r\n roleEmployeeStatus,\r\n }, () => this.requireFields());\r\n this.setState({ isLateInit: false });\r\n }\r\n\r\n getEmployeeDataModel = (employee, backups) => {\r\n return {\r\n AssignmentKey: employee.Id,\r\n EmployeeId: employee.EmployeeId,\r\n EmployeeName: employee.Name,\r\n EmployeeAssignment: employee.Assignment,\r\n EmployeeStartDate: employee.StartDate,\r\n EmployeeEndDate: employee.EndDate,\r\n EmployeeStatusId: employee.Status && (employee.Status.Id || employee.StatusId),\r\n EmployeeStatus: employee.Status && (employee.Status.Name || employee.Status),\r\n EmployeeRole: employee.EmployeeRole || employee.Role,\r\n EmployeeComment: employee.Comment,\r\n EmployeeOffice: employee.Office && employee.Office.Name,\r\n primaryAssignmentId: employee.PrimaryAssignmentId,\r\n isValidEmployee: true,\r\n backupEmployees: backups,\r\n createdOnFrontSide: false,\r\n };\r\n }\r\n\r\n getRoleEditDataInputs = () => {\r\n const {\r\n roleStatus, roleEmployeeStatus, billingCodes, editRoles, location, isLoading,\r\n } = this.props;\r\n const { billingCodes: { length } } = this.state;\r\n if (editRoles !== null) {\r\n const currentRole = editRoles.AllRoles.find(role => { return role.Id === location.pathname.split('/')[5]; });\r\n const assignedEmployees = sortRoleEmployees(currentRole.Employees).reduce((assignedEmployees, employee, index, employees) => {\r\n if (!employee.PrimaryAssignmentId) {\r\n const backups = employees.reduce((backups, backup) => {\r\n backup.PrimaryAssignmentId === employee.Id && backups.push(this.getEmployeeDataModel(backup, []));\r\n return backups;\r\n }, []);\r\n assignedEmployees.push(this.getEmployeeDataModel(employee, backups));\r\n }\r\n return assignedEmployees;\r\n }, []);\r\n\r\n this.setState({\r\n RoleName: currentRole.RoleName || '',\r\n ItemId: currentRole.Id,\r\n RoleId: currentRole.Role.Id,\r\n RoleType: currentRole.Role.Name,\r\n SeniorityId: currentRole.SeniorityLevel.Id,\r\n SeniorityLevel: currentRole.SeniorityLevel.Name,\r\n BillableStatusId: currentRole.BillableStatus.Id,\r\n BillableStatus: currentRole.BillableStatus.Name,\r\n Rate: currentRole.Rate && getAmericanFormat(currentRole.Rate),\r\n OvertimeRate: currentRole.RateOvertime && (getAmericanFormat(currentRole.RateOvertime) || ''),\r\n AssignmentTypeId: currentRole.AssignmentType.Id,\r\n AssignmentType: currentRole.AssignmentType.Name,\r\n Assignment: currentRole.Assignment,\r\n StartDate: currentRole.StartDate,\r\n EndDate: currentRole.EndDate,\r\n BillingCodeId: currentRole.SowPo,\r\n BillingCode: currentRole.SowPo,\r\n PrimaryAssignmentId: '',\r\n SendPrimaryEmployeeId: '',\r\n PrimaryEmployeeName: '',\r\n StatusId: currentRole.Status.Id,\r\n Status: currentRole.Status.Name,\r\n roleType: PROJECT_ROLES_EMPLOYEES_PRIMARY,\r\n Employees: assignedEmployees,\r\n Comment: currentRole.Comment,\r\n roleStatus,\r\n roleEmployeeStatus,\r\n billingCodes,\r\n rateUnit: currentRole.RateUnit.Id,\r\n overtimeRateUnit: currentRole.OvertimeRateUnit.Id,\r\n }, () => {\r\n this.requireFields();\r\n });\r\n } else {\r\n if (length === 0 && !isLoading) {\r\n const currentProjectId = location.pathname.split('/')[2];\r\n history.push({\r\n pathname: `/projects/${currentProjectId}`,\r\n state: location.state,\r\n });\r\n }\r\n }\r\n }\r\n\r\n findArrValue = (arr) => {\r\n arr.forEach(item => {\r\n if (item.Name === 'Offshore') {\r\n this.setState({\r\n AssignmentTypeId: item.Id,\r\n AssignmentType: item.Name,\r\n });\r\n }\r\n });\r\n }\r\n\r\n sortArrays = (array) => {\r\n return array.sort((a, b) => {\r\n if (a.Name > b.Name) {\r\n return 1;\r\n }\r\n if (a.Name === b.Name) {\r\n return 0;\r\n }\r\n return -1;\r\n });\r\n }\r\n\r\n requireFields = () => {\r\n const {\r\n RoleName, RoleId, SeniorityId, BillableStatusId, BillableStatus, Rate, AssignmentTypeId, assignmentIsUnvalid,\r\n StartDate, EndDate, BillingCodeId, Status, invalidRateData, invalidOverRateData,\r\n } = this.state;\r\n const { HasFinancialAccess } = this.props;\r\n (!!RoleName && RoleId !== '' && SeniorityId !== '' && BillableStatusId !== ''\r\n && (BillableStatus === billable && HasFinancialAccess ? Rate : true)\r\n && AssignmentTypeId !== '' && !assignmentIsUnvalid && moment(StartDate).isAfter(EndDate) === false\r\n && StartDate !== null && EndDate !== null && (BillableStatus === billable ? !!BillingCodeId : true)\r\n && Status !== '' && !invalidRateData && !invalidOverRateData) ? (\r\n this.setState({\r\n isModalFieldsRequired: true,\r\n })\r\n ) : (\r\n this.setState({\r\n isModalFieldsRequired: false,\r\n EmployeeStartDate: null,\r\n EmployeeEndDate: null,\r\n EmployeeAssignment: '',\r\n })\r\n );\r\n }\r\n\r\n onChangeRoleName = (event) => {\r\n this.setState({\r\n RoleName: event.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeRole = ({ item }) => {\r\n this.setState({\r\n RoleId: item.Id,\r\n RoleType: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeSeniority = ({ item }) => {\r\n this.setState({\r\n SeniorityId: item.Id,\r\n SeniorityLevel: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeComment = (event) => {\r\n this.setState({\r\n Comment: event.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeBillable = ({ item }) => {\r\n this.setState({\r\n BillableStatusId: item.Id,\r\n BillableStatus: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeRate = (e) => {\r\n if ((e.target.value.length && !reqularExpRate.test(e.target.value)) || (parseFloat(e.target.value) === 0)) {\r\n this.setState({\r\n invalidRateData: true,\r\n });\r\n } else {\r\n this.setState({\r\n invalidRateData: false,\r\n });\r\n }\r\n this.setState({\r\n Rate: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeOvertimeRate = (e) => {\r\n if ((e.target.value.length && !reqularExpRate.test(e.target.value)) || (parseFloat(e.target.value) === 0)) {\r\n this.setState({\r\n invalidOverRateData: true,\r\n });\r\n } else {\r\n this.setState({\r\n invalidOverRateData: false,\r\n });\r\n }\r\n this.setState({\r\n OvertimeRate: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeAssignmentType = ({ item }) => {\r\n this.setState({\r\n AssignmentTypeId: item.Id,\r\n AssignmentType: item.Name,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeAssignment = (e) => {\r\n if (isCorrectRoleAssignment(e.target.value)) {\r\n this.setState({\r\n assignmentIsUnvalid: false,\r\n });\r\n } else {\r\n this.setState({\r\n assignmentIsUnvalid: true,\r\n });\r\n }\r\n this.setState({\r\n Assignment: e.target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeBillingCode = ({ target }) => {\r\n const { projectDetails } = this.props;\r\n projectDetails && projectDetails.Contracts.forEach((contract) => {\r\n if (contract.Contract === target.value && contract.Status.Name !== PROJECT_ROLES_STATUS_ACTIVE) {\r\n this.toogleDialog();\r\n }\r\n if (contract.POs.length) {\r\n contract.POs.forEach((PO) => {\r\n if (PO.Contract === target.value && PO.Status.Name !== PROJECT_ROLES_STATUS_ACTIVE) {\r\n this.toogleDialog();\r\n }\r\n });\r\n }\r\n });\r\n this.setState({\r\n BillingCodeId: target.value,\r\n BillingCode: target.value,\r\n }, () => this.requireFields());\r\n }\r\n\r\n toogleDialog = () => {\r\n const { showConfirm } = this.state;\r\n this.setState({\r\n showConfirm: !showConfirm,\r\n });\r\n }\r\n\r\n handleStatusDialog = () => {\r\n const { showConfirmStatus } = this.state;\r\n this.setState({\r\n showConfirmStatus: !showConfirmStatus,\r\n });\r\n }\r\n\r\n handleStartDateChange = date => {\r\n const { BillingCodeId, Employees } = this.state;\r\n const {\r\n projectDetails: { StartDate },\r\n showAlertDialog,\r\n editRoles,\r\n contracts,\r\n location,\r\n } = this.props;\r\n\r\n const billingIsSelected = !!BillingCodeId;\r\n const currentRole = editRoles.AllRoles.find(role => { return role.Id === location.pathname.split('/')[5]; });\r\n const sowForRole = contracts.find((item) => item.Id === currentRole.SowPoId);\r\n const parentForRole = contracts.reduce((acc, item) => {\r\n if (!acc && item.Id === currentRole.SowPoId) {\r\n acc = item;\r\n }\r\n const havePOForRole = item.POs.find((po) => po.Id === currentRole.SowPoId);\r\n const haveAmendmentForRole = item.Amendments.find((amendment) => amendment.Id === currentRole.SowPoId);\r\n if (!acc && havePOForRole) {\r\n acc = havePOForRole;\r\n }\r\n if (!acc && haveAmendmentForRole) {\r\n acc = haveAmendmentForRole;\r\n }\r\n return acc;\r\n }, null);\r\n const theSmallestDate = getTheSmallestDateForRoles(Employees);\r\n if (!billingIsSelected && moment(StartDate).isAfter(date)) {\r\n return showAlertDialog('Does the date less than the Project start date?');\r\n }\r\n if (parentForRole && parentForRole.StartDate && moment(parentForRole.StartDate).isAfter(date)) {\r\n return showAlertDialog(`Does the date less than the ${sowForRole ? 'SOW'\r\n : 'PO'} start date, please change ${sowForRole ? 'SOW' : 'PO'} start date.`);\r\n }\r\n if (parentForRole && parentForRole.EndDate && moment(parentForRole.EndDate).isBefore(date)) {\r\n return showAlertDialog(`Does the date less than the ${sowForRole ? 'SOW'\r\n : 'PO'} end date, please change ${sowForRole ? 'SOW' : 'PO'} end date.`);\r\n }\r\n if (theSmallestDate && theSmallestDate.isValid() && moment(theSmallestDate.format('YYYY-MM-DD')).isBefore(moment(date).format('YYYY-MM-DD'))) {\r\n return showAlertDialog('Does the date less than the assign start date, please change assign start date.');\r\n }\r\n\r\n this.setState({\r\n StartDate: date,\r\n }, () => this.requireFields());\r\n };\r\n\r\n handleEndDateChange = date => {\r\n const { BillingCodeId, Employees } = this.state;\r\n const {\r\n projectDetails: { EndDate },\r\n showAlertDialog,\r\n billingCodesEndDate,\r\n editRoles,\r\n billingCodes,\r\n contracts,\r\n location,\r\n } = this.props;\r\n\r\n const billingIsSelected = !!BillingCodeId;\r\n const billingCodeEndDate = billingCodesEndDate[billingCodes.indexOf(BillingCodeId)];\r\n const currentRole = editRoles.AllRoles.find(role => { return role.Id === location.pathname.split('/')[5]; });\r\n const sowForRole = contracts.find((item) => item.Id === currentRole.SowPoId);\r\n const endDateForRole = contracts.reduce((acc, item) => {\r\n if (!acc && item.Id === currentRole.SowPoId) {\r\n acc = item.EndDate;\r\n }\r\n const havePOForRole = item.POs.find((po) => po.Id === currentRole.SowPoId);\r\n const haveAmendmentForRole = item.Amendments.find((amendment) => amendment.Id === currentRole.SowPoId);\r\n if (!acc && havePOForRole) {\r\n acc = havePOForRole.EndDate;\r\n }\r\n if (!acc && haveAmendmentForRole) {\r\n acc = haveAmendmentForRole.EndDate;\r\n }\r\n return acc;\r\n }, null);\r\n const theBiggestDate = getTheBiggestDateForRoles(Employees);\r\n if (!billingIsSelected && moment(date).isAfter(EndDate)) {\r\n return showAlertDialog('Does the date exceed the Project end date?');\r\n }\r\n if (billingIsSelected && billingCodeEndDate && moment(date).isAfter(endDateForRole)) {\r\n return showAlertDialog(`Does the date exceed the ${sowForRole ? 'SOW' : 'PO'} end date, please change ${sowForRole ? 'SOW' : 'PO'} end date.`);\r\n }\r\n if (billingIsSelected && !billingCodeEndDate && moment(date).isAfter(EndDate)) {\r\n return showAlertDialog('Does the date exceed the Project end date? (SOW/PO doesn`t have end date)');\r\n }\r\n if (theBiggestDate && theBiggestDate.isValid() && moment(moment(date).format('YYYY-MM-DD')).isBefore(moment(theBiggestDate.format('YYYY-MM-DD')))) {\r\n return showAlertDialog('Does the date exceed the assign end date, please change assign end date.');\r\n }\r\n\r\n this.setState({\r\n EndDate: date,\r\n }, () => this.requireFields());\r\n };\r\n\r\n onChangeStatus = ({ item }) => {\r\n this.setState({\r\n Status: item.Name,\r\n StatusId: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeRateUnit = ({ item }) => {\r\n this.setState({\r\n rateUnit: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n onChangeOvertimeRateUnit = ({ item }) => {\r\n this.setState({\r\n overtimeRateUnit: item.Id,\r\n }, () => this.requireFields());\r\n }\r\n\r\n clearStatus = () => {\r\n this.setState({\r\n Status: '',\r\n StatusId: '',\r\n }, () => this.requireFields());\r\n }\r\n\r\n clearValue = (property) => {\r\n if (property === 'BillingCodeId') {\r\n this.setState({\r\n [property]: '',\r\n BillingCode: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n if (property === 'Rate') {\r\n this.setState({\r\n [property]: '',\r\n invalidRateData: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n if (property === 'OvertimeRate') {\r\n this.setState({\r\n [property]: '',\r\n invalidOverRateData: '',\r\n }, () => this.requireFields());\r\n return;\r\n }\r\n this.setState({\r\n [property]: '',\r\n }, () => this.requireFields());\r\n };\r\n\r\n checkEmployeeListValid = (isEmployeeListValid, Employees) => {\r\n this.setState({\r\n isEmployeeListValid,\r\n Employees,\r\n });\r\n }\r\n\r\n getFlatEmployeeList = (employees) => {\r\n const flatEmployeesArray = employees.reduce((flatArray, primary) => {\r\n !!primary.EmployeeId && flatArray.push(primary);\r\n primary.backupEmployees.forEach(backup => !!backup.EmployeeId && flatArray.push(backup));\r\n return flatArray;\r\n }, []);\r\n return flatEmployeesArray;\r\n }\r\n\r\n applyModal = () => () => {\r\n const { editRole, isOnlyActive, location } = this.props;\r\n const { isEmployeeListValid, isModalFieldsRequired } = this.state;\r\n const state = { ...this.state };\r\n const currentProjectId = location.pathname.split('/')[2];\r\n if (isEmployeeListValid && isModalFieldsRequired) {\r\n editRole(state, !isOnlyActive);\r\n history.push({\r\n pathname: `/projects/${currentProjectId}`,\r\n state: location.state,\r\n });\r\n }\r\n }\r\n\r\n cancelRolePage = () => () => {\r\n const { location } = this.props;\r\n const currentProjectId = location.pathname.split('/')[2];\r\n history.push({\r\n pathname: `/projects/${currentProjectId}`,\r\n state: location.state,\r\n });\r\n }\r\n\r\n getRoleTitle = () => {\r\n const titleLocation = history.location.pathname.split('/')[4];\r\n return titleLocation === 'edit' ? 'editRole' : 'viewRole';\r\n }\r\n\r\n getCurrency = () => {\r\n const { projectDetails } = this.props;\r\n const currencyProject = projectDetails && projectDetails.Currency && projectDetails.Currency.Name;\r\n return formatCurrency(currencyProject);\r\n }\r\n\r\n getAssignerEmployeesToProject = () => {\r\n const { projectDetails } = this.props;\r\n const employees = [];\r\n if (projectDetails.Roles) {\r\n for (const role of projectDetails.Roles) {\r\n employees.push.apply(employees, role.Employees);\r\n }\r\n }\r\n return employees;\r\n }\r\n\r\n render() {\r\n const {\r\n showConfirm, RoleId, isModalFieldsRequired, SeniorityId, isEmployeeListValid,\r\n BillableStatusId, Rate, BillableStatus, OvertimeRate, AssignmentTypeId, assignmentIsUnvalid,\r\n Assignment, BillingCodeId, billingCodes, StartDate, EndDate, StatusId, roleStatus, Status,\r\n Employees, RoleName, invalidOverRateData, invalidRateData, rateUnit, overtimeRateUnit, Comment,\r\n ManageProjectRoles, HasFinancialAccess, ManageProjectRoleAssignments, showConfirmStatus,\r\n } = this.state;\r\n const {\r\n roles, roleModalAction, seniorityLevels, billableStatuses, assignmentTypes, rateUnits, employees, projectTeams, projectDetails,\r\n } = this.props;\r\n const suitableEmployees = employees.filter(employee => {\r\n return employee.Type !== PROJECT_ROLES_EMPLOYEES_DISABLED\r\n && employee.Type !== PROJECT_ROLES_EMPLOYEES_FORMER;\r\n });\r\n const assignedEmployeesToProject = this.getAssignerEmployeesToProject();\r\n return (\r\n \r\n ({\r\n label: item.Name,\r\n value: item.Id,\r\n })),\r\n )}\r\n allEngineeringManagers={sortByAplhabet(\r\n engineeringManagersByOffice.map((item) => ({\r\n label: item.Name,\r\n value: item.Id,\r\n })),\r\n )}\r\n allAccountManagers={sortByAplhabet(accountManagersByOffice)}\r\n allCurrencies={allCurrencies}\r\n deleteProject={this.deleteProject}\r\n clientManagerNameReg={clientManagerNameReg}\r\n handleSubmit={formHandleSubmit}\r\n currencyProject={projectDetails.Currency}\r\n isClientManager\r\n allEngagementTypes={allEngagementTypes}\r\n openEngagementTypeDialog={this.openEngagementTypeDialog}\r\n isOnlyActiveRoles={!defaultCheckedShowRoles}\r\n fiscalYears={fiscalYears}\r\n />\r\n
\r\n \r\n \r\n {showConfirm ? (\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nEditRoleModal.propTypes = {\r\n roles: PropTypes.array,\r\n seniorityLevels: PropTypes.array,\r\n billableStatuses: PropTypes.array,\r\n assignmentTypes: PropTypes.array,\r\n billingCodes: PropTypes.array,\r\n employees: PropTypes.array,\r\n projectId: PropTypes.string,\r\n roleModalAction: PropTypes.string,\r\n editRoles: PropTypes.object,\r\n currentRoles: PropTypes.array,\r\n roleStatus: PropTypes.array,\r\n roleEmployeeStatus: PropTypes.array,\r\n getStatus: PropTypes.func,\r\n getEmployeeStatus: PropTypes.func,\r\n editRole: PropTypes.func,\r\n isOnlyActive: PropTypes.bool,\r\n rateUnits: PropTypes.array,\r\n};\r\n\r\nexport default connect(store => {\r\n const {\r\n BillableStatuses = [],\r\n SeniorityLevels = [],\r\n Roles = [],\r\n AssignmentTypes = [],\r\n } = store.projectsReducer.projectRoleConfig;\r\n\r\n return {\r\n editRoles: store.projectsReducer.projectDetails,\r\n billableStatuses: BillableStatuses,\r\n seniorityLevels: SeniorityLevels,\r\n roles: Roles,\r\n assignmentTypes: AssignmentTypes,\r\n employees: store.roleModalReducer.employees,\r\n roleEmployees: store.roleModalReducer.roleEmployees,\r\n billingCodes: store.roleModalReducer.billingCodes,\r\n currentRoles: store.roleModalReducer.roles,\r\n projectId: store.roleModalReducer.projectId,\r\n roleModalAction: store.roleModalReducer.roleModalAction,\r\n roleStatus: store.roleModalReducer.status,\r\n roleEmployeeStatus: store.roleModalReducer.employeeStatus,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n projectDetails: store.projectsReducer.projectDetails,\r\n rateUnits: store.roleModalReducer.rateUnits,\r\n Offices: store.projectsReducer.projectDetails.Offices,\r\n EngineeringManagers: store.projectsReducer.projectDetails.EngineeringManagers,\r\n currentRole: store.userRoleReducer.roles,\r\n billingCodesStartDate: store.roleModalReducer.billingCodesStartDate,\r\n billingCodesEndDate: store.roleModalReducer.billingCodesEndDate,\r\n contracts: store.projectsReducer.projectDetails.Contracts,\r\n projectTeams: store.projectsReducer.projectTeams.Teams,\r\n isLoading: store.loadingReducer.isLoading,\r\n };\r\n}, {\r\n getProjectDetails,\r\n closeModal,\r\n addRoleToProject,\r\n showModal,\r\n getEmployees,\r\n getStatus,\r\n getEmployeeStatus,\r\n editRole,\r\n showAlertDialog,\r\n setComponent,\r\n resetComponent,\r\n setBillingData,\r\n})(EditRoleModal);\r\n","import React from 'react';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\nimport '../redux-form.css';\r\n\r\nexport default class renderTextField extends React.Component {\r\n onChange = event => {\r\n const { input, currency } = this.props;\r\n const newValue = currency ? getAmericanFormat(event.target.value) : event.target.value;\r\n input.onChange(newValue);\r\n }\r\n\r\n render() {\r\n const {\r\n input, meta, disabled, label, autoFocus, startAdornment, endAdornment, placeholder,\r\n maxlength, multiline, fullWidth, styles, formClassName, inputClassName, showAsterix,\r\n type,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n \r\n this.clearValue('RoleName')}\r\n />\r\n this.clearValue('RoleId')}\r\n />\r\n this.clearValue('SeniorityId')}\r\n />\r\n this.clearValue('BillableStatusId')}\r\n />\r\n
\r\n \r\n {\r\n HasFinancialAccess && (\r\n this.clearValue('AssignmentTypeId')}\r\n />\r\n this.clearValue('Assignment')}\r\n />\r\n
\r\n \r\n this.clearValue('Rate')}\r\n />\r\n {invalidRateData ?
\r\n )\r\n }\r\n {\r\n HasFinancialAccess && (\r\n Invalid Rate
: null}\r\n\r\n this.clearValue('OvertimeRate')}\r\n />\r\n {invalidOverRateData ?
\r\n )\r\n }\r\n {\r\n HasFinancialAccess && (\r\n Invalid Rate
: null}\r\n\r\n this.clearValue('BillingCodeId')}\r\n />\r\n
\r\n \r\n this.clearValue('Comment')}\r\n disabled={!ManageProjectRoles}\r\n />\r\n
\r\n \r\n
\r\n \r\n \r\n Save Role\r\n
\r\n ) : null\r\n }\r\n \r\n {ManageProjectRoles ? 'Cancel' : 'Back'}\r\n
\r\n {\r\n (ManageProjectRoles || ManageProjectRoleAssignments) ? (\r\n \r\n {\r\n label && \r\n }\r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport '../redux-form.css';\r\nimport { getConfigBasedOnCheckedDates } from 'utils/getConfigBasedOnCheckedDates';\r\n\r\nexport default class renderDatePicker extends React.Component {\r\n onChange = date => {\r\n const {\r\n input, showConfirmationDialog, showAlertDialog, startDates, endDates, typeCurrentDocument, isStartDate,\r\n datesForCheckChildContracts, startDateContract, endDateContract,\r\n } = this.props;\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: startDates, endDatesParentContracts: endDates },\r\n datesForCheckChildContracts,\r\n date,\r\n typeCurrentDocument,\r\n isStartDate,\r\n false,\r\n startDateContract || endDateContract,\r\n );\r\n if (!config) {\r\n return input.onChange(date);\r\n }\r\n if (config.isAlert) {\r\n showAlertDialog(config.message);\r\n } else {\r\n input.onChange(date);\r\n showConfirmationDialog && showConfirmationDialog(config);\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n input, meta, label, isStartDate, isEndDate, setPrevValueOnError, styles, formClassName, datePickerClassName, pickerName, showAsterix, disabled,\r\n placeholder, minDate, maxDate,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n \r\n {\r\n label && \r\n }\r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport '../redux-form.css';\r\n\r\nexport default class renderSelect extends React.Component {\r\n onChange = data => {\r\n const { input, options } = this.props;\r\n input.onChange({\r\n Id: data.target.value,\r\n Name: options.find(item => item.Id === data.target.value).Name,\r\n });\r\n }\r\n\r\n render() {\r\n const {\r\n input, meta, disabled, label, options, isOptionObject, inputProps, showClear, styles, placeholder, extendedValue, formClassName, selectClassName,\r\n showAsterix,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n \r\n {\r\n label && \r\n }\r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport Radio from '@material-ui/core/Radio';\r\nimport RadioGroup from '@material-ui/core/RadioGroup';\r\nimport classNames from 'classnames';\r\nimport Button from '../components/button';\r\nimport { required, validateDate, complexRequired } from 'services/redux-form-validators.js';\r\nimport history from 'utils/history';\r\nimport { isCorrectRoleEmployeeAssignment } from '../../../../pages/projects/components/utils/isCorrectRoleAssignments';\r\nimport './project-edit-assignment-form.css';\r\nimport renderTextField from '../components/text-field';\r\nimport renderDatePicker from '../components/date-picker';\r\nimport renderSelect from '../components/select';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container-assignment',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst validateAssignment = (value, values, props, field) => {\r\n const condition = !!value || value === 0;\r\n return complexRequired(value, values, props, field, !condition);\r\n};\r\n\r\nconst additionalValidatorForAssignment = (value) => {\r\n return isCorrectRoleEmployeeAssignment((value || value === 0) && value.toString()) ? false : 'Invalid assignment';\r\n};\r\n\r\nconst validateStartDate = (value, values, props, field) => {\r\n return validateDate.startDate(value, values, props, field, 'EmployeeEndDate');\r\n};\r\n\r\nconst validateEndDate = (value, values, props, field) => {\r\n return validateDate.endDate(value, values, props, field, 'EmployeeStartDate');\r\n};\r\n\r\nclass ProjectEditAssignment extends React.Component {\r\n componentDidMount() {\r\n const {\r\n data, initialize, AllRoles, location, setComponent,\r\n } = this.props;\r\n !AllRoles.length && history.goBack({ state: location.state });\r\n initialize(data);\r\n setComponent({ title: 'EDIT ASSIGNMENT' });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { data, initialize } = this.props;\r\n if (isObjectNotEquals(prevProps.data, data)) {\r\n initialize(data);\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { destroy, resetComponent } = this.props;\r\n destroy();\r\n resetComponent();\r\n }\r\n\r\n onSubmit = () => {\r\n const {\r\n onSubmit, location, isEditable, allData,\r\n } = this.props;\r\n if (!isEditable && !allData.syncErrors) {\r\n onSubmit(allData.values, () => history.goBack({ state: location.state }));\r\n }\r\n }\r\n\r\n getStartDateForAssigment = (StartDate) => {\r\n return [{\r\n date: StartDate,\r\n type: 'role',\r\n }];\r\n }\r\n\r\n getEndDateForAssigment = (EndDate) => {\r\n return [{\r\n date: EndDate,\r\n type: 'role',\r\n }];\r\n }\r\n\r\n render() {\r\n const {\r\n isEditable, EmployeeName, EmployeeStartDate, EmployeeEndDate, EmployeeAssignment, EmployeeComment, RoleType,\r\n primaryEmpl, roleEmployeeStatus, handleSubmit, Status, location, allData, editAssignment, AllRoles,\r\n showAlertDialog,\r\n } = this.props;\r\n const currentRole = AllRoles && AllRoles.find(role => role.Id === editAssignment.roleId);\r\n const { StartDate, EndDate } = currentRole || {};\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('ProjectEditAssignment', data)),\r\n destroy: () => dispatch(destroy('ProjectEditAssignment')),\r\n change: (field, value) => dispatch(change('ProjectEditAssignment', field, value)),\r\n showAlertDialog: (message) => dispatch(showAlertDialog(message)),\r\n setComponent: (component) => dispatch(setComponent(component)),\r\n resetComponent: () => dispatch(resetComponent()),\r\n };\r\n};\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.ProjectEditAssignment && state.form.ProjectEditAssignment.values;\r\n return {\r\n EmployeeName: isFormReducerExists && state.form.ProjectEditAssignment.values.EmployeeName,\r\n EmployeeStartDate: isFormReducerExists && state.form.ProjectEditAssignment.values.EmployeeStartDate,\r\n EmployeeEndDate: isFormReducerExists && state.form.ProjectEditAssignment.values.EmployeeEndDate,\r\n EmployeeAssignment: isFormReducerExists && state.form.ProjectEditAssignment.values.EmployeeAssignment,\r\n primaryEmpl: isFormReducerExists && state.form.ProjectEditAssignment.values.primaryEmpl,\r\n Status: isFormReducerExists && state.form.ProjectEditAssignment.values.Status,\r\n allData: isFormReducerExists && state.form.ProjectEditAssignment,\r\n AllRoles: state.projectsReducer.projectDetails.AllRoles,\r\n editAssignment: state.roleModalReducer.editAssignment,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'ProjectEditAssignment',\r\n})(ProjectEditAssignment));\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport { updateEditAssignment } from '../../actions/roleModalActions';\r\nimport { getAllRoles } from '../../actions/projectsActions';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport './role-modal.css';\r\nimport ProjectEditAssignment from 'common/components/redux-form/project-edit-assignment-form/project-edit-assignment-form';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\n\r\nexport class EditAssignment extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { ManageProjectRoleAssignments } = this.props;\r\n this.state = {\r\n EmployeeId: '',\r\n EmployeeName: '',\r\n EmployeeStartDate: null,\r\n EmployeeEndDate: null,\r\n EmployeeAssignment: '',\r\n RoleType: '',\r\n Status: {},\r\n EmployeeComment: '',\r\n employeeAssignmentIsUnvalid: false,\r\n isModalFieldsRequired: false,\r\n ManageProjectRoleAssignments,\r\n primaryEmpl: '',\r\n showConfirmationDialog: false,\r\n confirmationDialogCallback: null,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { getAllRoles, assignment } = this.props;\r\n this.getAssignmentData();\r\n assignment && assignment.projectId && getAllRoles(assignment.projectId);\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { assignment } = this.props;\r\n if (prevProps.assignment !== assignment) {\r\n this.getAssignmentData();\r\n }\r\n }\r\n\r\n setPrimaryEmployee = () => {\r\n const { employees, assignment } = this.props;\r\n const employee = employees.find(empl => empl.Id === assignment.PrimaryAssignmentId);\r\n this.setState({\r\n primaryEmpl: employee ? employee.Name : '',\r\n });\r\n }\r\n\r\n getAssignmentData = () => {\r\n const { assignment } = this.props;\r\n this.setState({\r\n EmployeeId: assignment.EmployeeId,\r\n EmployeeName: assignment.Name,\r\n EmployeeStartDate: assignment.StartDate,\r\n EmployeeEndDate: assignment.EndDate,\r\n EmployeeAssignment: assignment.Assignment,\r\n EmployeeComment: assignment.Comment,\r\n RoleType: assignment.Role,\r\n Status: assignment.Status,\r\n }, () => {\r\n this.setPrimaryEmployee();\r\n });\r\n }\r\n\r\n handleApplyModal = (data, cb) => {\r\n const {\r\n location, projectTeams, assignment,\r\n } = this.props;\r\n const id = location.pathname.split('/')[5];\r\n const isTeamMember = projectTeams.some(team => {\r\n return (\r\n team.Members\r\n && team.Members.some(member => (member.Id === id) && (member.Status && member.Status.Id !== data.Status.Id))\r\n )\r\n || team.SecondInCommand && (team.SecondInCommand.Id === assignment.EmployeeId) && (data.Status.Id !== 2);\r\n });\r\n if (isTeamMember) {\r\n this.setState({\r\n showConfirmationDialog: true,\r\n confirmationDialogCallback: () => this.applyModal(data, cb),\r\n });\r\n } else {\r\n this.applyModal(data, cb);\r\n }\r\n }\r\n\r\n applyModal = (data, cb) => {\r\n const {\r\n assignment, updateEditAssignment, isOnlyActiveRoles, location,\r\n } = this.props;\r\n const updateData = {\r\n projectId: assignment.projectId,\r\n roleId: assignment.roleId,\r\n assignmentId: location.pathname.split('/')[5],\r\n assignment: {\r\n Assignment: data.EmployeeAssignment,\r\n StartDate: data.EmployeeStartDate,\r\n EndDate: data.EmployeeEndDate,\r\n Status: data.Status.Id,\r\n Comment: data.EmployeeComment,\r\n },\r\n };\r\n updateEditAssignment(updateData, !isOnlyActiveRoles);\r\n cb();\r\n }\r\n\r\n handleCloseDialog = () => {\r\n this.setState({\r\n showConfirmationDialog: false,\r\n confirmationDialogCallback: null,\r\n });\r\n }\r\n\r\n handleConfirmDialog = () => {\r\n const { confirmationDialogCallback } = this.state;\r\n confirmationDialogCallback && confirmationDialogCallback();\r\n this.handleCloseDialog();\r\n }\r\n\r\n render() {\r\n const {\r\n EmployeeId,\r\n EmployeeName,\r\n EmployeeStartDate,\r\n EmployeeEndDate,\r\n EmployeeAssignment,\r\n RoleType,\r\n Status,\r\n EmployeeComment,\r\n employeeAssignmentIsUnvalid,\r\n isModalFieldsRequired,\r\n ManageProjectRoleAssignments,\r\n primaryEmpl,\r\n showConfirmationDialog,\r\n } = this.state;\r\n const { roleEmployeeStatus, location } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nEditAssignment.propTypes = {\r\n employees: PropTypes.array,\r\n roleEmployeeStatus: PropTypes.array,\r\n};\r\n\r\nexport default connect(store => {\r\n return {\r\n assignment: store.roleModalReducer.editAssignment,\r\n employees: store.roleModalReducer.employees,\r\n roleEmployeeStatus: store.roleModalReducer.employeeStatus,\r\n readOnly: store.userRoleReducer.readOnly,\r\n isOnlyActiveRoles: store.showRoles.isOnlyActiveRoles,\r\n projectTeams: store.projectsReducer.projectTeams.Teams,\r\n };\r\n}, {\r\n updateEditAssignment,\r\n getAllRoles,\r\n})(EditAssignment);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport './edit-associated-roles.css';\r\nimport { List } from 'common/components/list/list';\r\nimport { filterChoosenExtendRoles } from 'services/filterChoosenExtendRoles';\r\nimport classNames from 'classnames';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport CustomIcon from '../../../../common/components/icon/Icon';\r\nimport { CustomStatusCell } from 'common/components/list/custom-cell/custom-status-cell';\r\nimport { updateCheckedFlagOnRoles } from 'pages/projects/components/utils/updateCheckedFlagOnRoles';\r\nimport sortByAplhabet from 'utils/sortByAplhabet';\r\n\r\nexport class EditAssociatedRoles extends Component {\r\n constructor(props) {\r\n super(props);\r\n const { items } = this.props;\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Role Name', Id: 'RoleName', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Role Type', Id: 'Role', isObject: true,\r\n },\r\n {\r\n Name: 'Assignment', Id: 'Assignment',\r\n },\r\n {\r\n Name: 'Seniority Level', Id: 'SeniorityLevel', isObject: true,\r\n },\r\n {\r\n Name: 'SOW/PO Number', Id: 'SowPo',\r\n },\r\n {\r\n Name: 'Start Date', Id: 'StartDate', isDate: true,\r\n },\r\n {\r\n Name: 'End Date', Id: 'EndDate', isDate: true,\r\n },\r\n {\r\n Name: 'Status', Id: 'Status', isObject: true, className: 'small-col',\r\n },\r\n ],\r\n deepColumn: [\r\n {\r\n Name: 'Name', Id: 'Name', className: 'without-width-col', hasBadge: true,\r\n },\r\n {\r\n Name: 'Assignment', Id: 'Assignment',\r\n },\r\n {\r\n Name: 'StartDate', Id: 'StartDate', isDate: true,\r\n },\r\n {\r\n Name: 'EndDate', Id: 'EndDate', isDate: true,\r\n },\r\n {\r\n Name: 'Status', Id: 'Status', isObject: true, className: 'small-col',\r\n },\r\n {\r\n Name: 'Comment', Id: 'Comment', isInnerComment: true, deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n choosenRoles: items,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.sortRoles();\r\n }\r\n\r\n checkRole = (e, parent) => {\r\n const { choosenRoles } = this.state;\r\n let roles = choosenRoles;\r\n roles = filterChoosenExtendRoles(roles, e.target.value, parent, e.target.checked);\r\n this.setState({\r\n choosenRoles: roles,\r\n });\r\n };\r\n\r\n getEmployeeDataModel = (employee, backups) => {\r\n return {\r\n ...employee,\r\n isValidEmployee: true,\r\n backupEmployees: backups,\r\n createdOnFrontSide: false,\r\n checked: employee.checked,\r\n };\r\n }\r\n\r\n getArrayAllAssignmentForRole = (activeAssigment, allAssigment) => {\r\n const arrayWithoutActiveAssignment = allAssigment.map((elem) => {\r\n const assignment = activeAssigment.find((item) => item.Id === elem.Id);\r\n return assignment || elem;\r\n });\r\n return arrayWithoutActiveAssignment;\r\n }\r\n\r\n applyResult = () => {\r\n const { apply, allRoles, idContract } = this.props;\r\n const { choosenRoles } = this.state;\r\n const allRolesForContract = allRoles.reduce((acc, item) => {\r\n const activeRole = choosenRoles.find((role) => role.Id === item.Id);\r\n if (item.SowPoId !== idContract) {\r\n return acc;\r\n }\r\n if (!activeRole) {\r\n acc.push(item);\r\n return acc;\r\n }\r\n acc.push({\r\n ...activeRole,\r\n Employees: this.getArrayAllAssignmentForRole(activeRole.Employees, item.Employees),\r\n });\r\n return acc;\r\n }, []);\r\n const roles = allRolesForContract.map((role) => ({\r\n ...role,\r\n Employees: role.Employees.reduce((assignedEmployees, employee, index, employees) => {\r\n if (!employee.PrimaryAssignmentId) {\r\n const backups = employees.reduce((backups, backup) => {\r\n backup.PrimaryAssignmentId === employee.Id && backups.push(this.getEmployeeDataModel(backup, []));\r\n return backups;\r\n }, []);\r\n assignedEmployees.push(this.getEmployeeDataModel(employee, backups));\r\n }\r\n return assignedEmployees;\r\n }, []),\r\n }));\r\n apply(roles);\r\n }\r\n\r\n onChangeCheckecRole = (idRole, parentId) => {\r\n const { startDateContract, endDateContract } = this.props;\r\n this.setState((state) => {\r\n const roles = updateCheckedFlagOnRoles(state.choosenRoles, idRole, parentId, startDateContract, endDateContract, true);\r\n return {\r\n choosenRoles: roles,\r\n };\r\n });\r\n }\r\n\r\n sortRoles = () => {\r\n const { choosenRoles } = this.state;\r\n const sortRolesArray = choosenRoles.map((role) => ({\r\n ...role,\r\n Employees: sortByAplhabet(role.Employees).reduce((acc, elem) => {\r\n if (elem.Role !== 'Primary') {\r\n return acc;\r\n }\r\n acc.push(elem);\r\n const shadowAssignmentsForEmployee = role.Employees.filter(i => i.Role === 'Shadow' && i.PrimaryAssignmentId === elem.Id);\r\n if (shadowAssignmentsForEmployee.length) {\r\n acc.push(...shadowAssignmentsForEmployee);\r\n }\r\n return acc;\r\n }, []),\r\n }));\r\n this.setState({\r\n choosenRoles: sortRolesArray,\r\n });\r\n };\r\n\r\n render() {\r\n const {\r\n columnsToDisplay, deepColumn, choosenRoles,\r\n } = this.state;\r\n const {\r\n closeModal,\r\n } = this.props;\r\n return (\r\n \r\n {showConfirmationDialog ? (\r\n
\r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nEditAssociatedRoles.propTypes = {\r\n items: PropTypes.array.isRequired,\r\n closeModal: PropTypes.func.isRequired,\r\n apply: PropTypes.func.isRequired,\r\n};\r\n","import { FINISHED, ROLE_STATUS_REMOVED, ROLE_STATUS_REMOVED_ID } from 'utils/const-variable';\r\n\r\nexport const getCorrectDataForEditRole = (roles, startDate, endDate, Status, projectId) => {\r\n const result = roles.map((item) => {\r\n item.ItemId = item.Id;\r\n item.projectId = projectId;\r\n item.OvertimeRate = item.RateOvertime;\r\n item.SeniorityId = item.SeniorityLevel.Id;\r\n item.RoleId = item.Role.Id;\r\n item.AssignmentTypeId = item.AssignmentType.Id;\r\n item.BillingCode = item.SowPo;\r\n item.BillableStatusId = item.BillableStatus.Id;\r\n item.StatusId = Status.Name === FINISHED ? ROLE_STATUS_REMOVED_ID : item.Status.Id;\r\n item.StartDate = !!startDate ? startDate : item.StartDate;\r\n item.EndDate = !!endDate ? endDate : item.EndDate;\r\n item.Employees = item.Employees.map((empl) => {\r\n const employee = {\r\n EmployeeId: empl.EmployeeId,\r\n StartDate: empl.checked === true && !!startDate ? startDate : empl.StartDate,\r\n EndDate: empl.checked === true && !!endDate ? endDate : empl.EndDate,\r\n Assignment: empl.Assignment,\r\n Status: empl.checked === true && Status.Name === FINISHED ? { Id: ROLE_STATUS_REMOVED_ID, Name: ROLE_STATUS_REMOVED } : empl.Status,\r\n Id: empl.Id,\r\n PrimaryAssignmentId: empl.PrimaryAssignmentId,\r\n Role: empl.Role,\r\n EmployeeComment: empl.Comment,\r\n ItemId: item.Id,\r\n projectId,\r\n backupEmployees: empl.backupEmployees.map((backup) => {\r\n const backupEmployee = {\r\n EmployeeId: backup.EmployeeId,\r\n StartDate: backup.checked === true && !!startDate ? startDate : backup.StartDate,\r\n EndDate: backup.checked === true && !!endDate ? endDate : backup.EndDate,\r\n Assignment: backup.Assignment,\r\n Status: backup.checked === true && Status.Name === FINISHED ? { Id: ROLE_STATUS_REMOVED_ID, Name: ROLE_STATUS_REMOVED } : backup.Status,\r\n Id: backup.Id,\r\n PrimaryAssignmentId: backup.PrimaryAssignmentId,\r\n Role: backup.Role,\r\n EmployeeComment: backup.Comment,\r\n ItemId: item.Id,\r\n projectId,\r\n };\r\n return backupEmployee;\r\n }),\r\n };\r\n return employee;\r\n });\r\n return item;\r\n });\r\n return result;\r\n};\r\n","export const getAllCheckedRolesAndEmployees = (roles) => {\r\n const checkedAllRolesAndEmployees = roles.reduce((acc, role) => {\r\n const checkedAllEmployees = role.Employees.reduce((employees, employee) => {\r\n employees.push({ ...employee, checked: true });\r\n return employees;\r\n }, []);\r\n acc.push({\r\n ...role,\r\n checked: true,\r\n Employees: [...checkedAllEmployees],\r\n });\r\n return acc;\r\n }, []);\r\n return checkedAllRolesAndEmployees;\r\n};\r\n","import React from 'react';\r\nimport Checkbox from 'common/components/form-items/checkbox/checkbox';\r\nimport '../redux-form.css';\r\n\r\nexport default class renderCheckbox extends React.Component {\r\n onChange = () => {\r\n const { input } = this.props;\r\n input.onChange(!input.value);\r\n }\r\n\r\n render() {\r\n const {\r\n input, meta, disabled, label, styles, isRequired, checkboxContainerStyle,\r\n } = this.props;\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n Update Roles/Employees Dates
\r\nPlease select the Roles and Employees to match the updated dates or statuses of the Document.
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n {\r\n label && \r\n }\r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport classNames from 'classnames';\r\nimport '../redux-form.css';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport { UpdateDocumentItem } from 'common/components/documents-list/update-document-item';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport {\r\n sortDocumentByAlphabet,\r\n getDocumentTypeName,\r\n} from 'utils/documentsUtils';\r\nimport { MAX_QUANTITY_OF_DOCUMENTS } from 'utils/const-variable';\r\nimport { sortList } from 'common/components/list/sortList';\r\n\r\nconst emptyDocument = { URL: '', Comment: '' };\r\n\r\nexport default class renderDocumentList extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showAddNewItem: false,\r\n isNewItemValid: false,\r\n newDocument: { ...emptyDocument },\r\n deleteDocumentIndex: '',\r\n showConfirmationDialog: false,\r\n columnDoc: 'Comment',\r\n sortDirectionDoc: 'Up',\r\n };\r\n }\r\n\r\n showAddNew = () => {\r\n const { input } = this.props;\r\n if (input.value.length < MAX_QUANTITY_OF_DOCUMENTS) {\r\n this.setState({\r\n showAddNewItem: true,\r\n isNewItemValid: false,\r\n newDocument: { ...emptyDocument },\r\n });\r\n }\r\n }\r\n\r\n changeNewItem = ({ target }) => {\r\n const { newDocument } = this.state;\r\n const { documentTypes } = this.props;\r\n this.setState(target.name === 'DocumentType'\r\n ? {\r\n newDocument: {\r\n ...newDocument,\r\n DocumentType: {\r\n Id: target.value,\r\n Name: getDocumentTypeName(target.value, documentTypes),\r\n },\r\n },\r\n } : {\r\n newDocument: {\r\n ...newDocument,\r\n [target.name]: target.value,\r\n },\r\n }, this.newItemValidation);\r\n }\r\n\r\n newItemValidation = () => {\r\n const { isDocumentType } = this.props;\r\n const { newDocument } = this.state;\r\n let isValid = false;\r\n if (isDocumentType) {\r\n isValid = !!(newDocument.URL.length && newDocument.Comment.length && newDocument.DocumentType);\r\n } else {\r\n isValid = !!(newDocument.URL.length && newDocument.Comment.length);\r\n }\r\n this.setState({ isNewItemValid: isValid });\r\n };\r\n\r\n cancelAdding = () => {\r\n this.setState({\r\n showAddNewItem: false,\r\n isNewItemValid: false,\r\n newDocument: { ...emptyDocument },\r\n });\r\n }\r\n\r\n generateTimeKey = () => {\r\n return new Date().getTime();\r\n }\r\n\r\n applyAdding = () => {\r\n const {\r\n isNewItemValid, newDocument, columnDoc, sortDirectionDoc,\r\n } = this.state;\r\n const { input } = this.props;\r\n const documents = input.value ? input.value : [];\r\n if (isNewItemValid) {\r\n const addDocument = {\r\n ...newDocument,\r\n Id: String(this.generateTimeKey()),\r\n AddedDocument: true,\r\n };\r\n documents.push(addDocument);\r\n this.onChange(sortList(documents, columnDoc, sortDirectionDoc));\r\n this.setState({\r\n showAddNewItem: false,\r\n isNewItemValid: false,\r\n newDocument: { ...emptyDocument },\r\n });\r\n }\r\n }\r\n\r\n editDocument = (item) => {\r\n const { input, isDocumentType } = this.props;\r\n const { columnDoc, sortDirectionDoc } = this.state;\r\n const documents = input.value;\r\n let newDocument;\r\n if (isDocumentType) {\r\n newDocument = {\r\n Id: item.Id,\r\n URL: item.URL,\r\n Comment: item.Comment,\r\n DocumentType: {\r\n Id: item.DocumentType.Id,\r\n Name: item.DocumentType.Name,\r\n },\r\n DocumentTypeId: item.DocumentType.Id,\r\n AddedDocument: item.AddedDocument,\r\n };\r\n } else {\r\n newDocument = {\r\n Id: item.Id,\r\n URL: item.URL,\r\n Comment: item.Comment,\r\n AddedDocument: item.AddedDocument,\r\n };\r\n }\r\n const updateDocuments = documents.filter(document => document.Id !== newDocument.Id);\r\n updateDocuments.push(newDocument);\r\n this.onChange(sortList(updateDocuments, columnDoc, sortDirectionDoc));\r\n }\r\n\r\n closeConfirmationDialog = () => {\r\n this.setState({\r\n showConfirmationDialog: false,\r\n deleteDocumentIndex: '',\r\n });\r\n }\r\n\r\n showConfirmationDialog = (item) => {\r\n this.setState({\r\n showConfirmationDialog: true,\r\n deleteDocumentId: item.stateItemId,\r\n });\r\n }\r\n\r\n deleteDocument = () => {\r\n const { deleteDocumentId } = this.state;\r\n const { input } = this.props;\r\n const documents = input.value;\r\n const updateDocuments = documents.filter(document => document.Id !== deleteDocumentId);\r\n this.setState({\r\n showAddNewItem: false,\r\n showConfirmationDialog: false,\r\n deleteDocumentId: '',\r\n });\r\n this.onChange(updateDocuments);\r\n }\r\n\r\n onChange = (documents) => {\r\n const { input } = this.props;\r\n input.onChange(sortDocumentByAlphabet(documents));\r\n }\r\n\r\n setSortSettingsContract = (column, sortDirection) => {\r\n this.setState({\r\n columnDoc: column,\r\n sortDirectionDoc: sortDirection,\r\n });\r\n };\r\n\r\n render() {\r\n const {\r\n showAddNewItem, newDocument, isNewItemValid, showConfirmationDialog,\r\n columnDoc, sortDirectionDoc,\r\n } = this.state;\r\n const {\r\n input, disabled, styles, columnsToDisplay, viewFinancialInfo, documentTypes, isDocumentType,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n \r\n {\r\n !disabled\r\n ? \r\n
\r\n : null\r\n }\r\n \r\n
\r\n : null\r\n }\r\n {\r\n showConfirmationDialog\r\n && \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n {item.Id ? item.Milestone :
\r\n \r\n
\r\n {columnNames.has(MILESTONE_INVOICE_AMOUNT_COLUMN_NAME) && (\r\n \r\n
\r\n )}\r\n {columnNames.has(MILESTONE_REVENUE_RECEIVED_COLUMN_NAME) && (\r\n \r\n
\r\n )}\r\n {columnNames.has(MILESTONE_INVOICED_DATE_COLUMN_NAME) && (\r\n \r\n
\r\n )}\r\n {columnNames.has(MILESTONE_REMAINING_BALANCE_COLUMN_NAME) && (\r\n \r\n
\r\n )}\r\n {columnNames.has(MILESTONE_APPROVED_COLUMN_NAME) && (\r\n \r\n \r\n
\r\n )}\r\n {columnNames.has(MILESTONE_BACKUP_USED_COLUMN_NAME) && (\r\n \r\n
\r\n )}\r\n \r\n {columnNames.has(MILESTONE_REMAINING_BALANCE_COLUMN_NAME) && (\r\n \r\n {!item.RemainingBalanceOverridePossibility\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 disableInvoicedAmount: !!props.item.IsShadowed || state.projectsReducer.shadowingMilestones\r\n .map((m) => moment(m.milestoneDate))\r\n .some((d) => d.isSame(moment(props.item.Milestone), 'month')),\r\n}))(MilestoneForm);\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport MilestoneForm from './milestone-form';\r\n\r\nexport class MilestoneItem extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isShowOverride: true,\r\n };\r\n }\r\n\r\n getSelectOptionsForItem = () => {\r\n const { selectedMilestones, selectOptionsForMilestones, item } = this.props;\r\n const selectedOptionsToFilter = item.Milestone ? [...selectOptionsForMilestones, item.Milestone] : selectOptionsForMilestones;\r\n return selectedOptionsToFilter.filter((option, index, array) => (\r\n array.indexOf(option) === index && (option === item.Milestone || !selectedMilestones.includes(option))\r\n ));\r\n }\r\n\r\n getNewValue = (data) => {\r\n switch (true) {\r\n case data === null:\r\n return null;\r\n case typeof data === 'string':\r\n return data;\r\n case data.target.name === 'InvoiceDate':\r\n return data.item;\r\n case data.target.name === 'Approved':\r\n case data.target.name === 'UsedAssignmentBackupUser':\r\n return data.target.checked;\r\n default: return data.target.value;\r\n }\r\n }\r\n\r\n onChangeItem = (data, option) => {\r\n const {\r\n onChange, item, itemId,\r\n } = this.props;\r\n const milestone = {\r\n ...item,\r\n [typeof option === 'string' ? option : data.target.name]: this.getNewValue(data),\r\n };\r\n onChange(milestone, itemId);\r\n }\r\n\r\n onDeleteItem = () => {\r\n const {\r\n onDeleteItem, item,\r\n } = this.props;\r\n onDeleteItem(item);\r\n }\r\n\r\n onCopyItem = () => {\r\n const {\r\n onCopyItem, item,\r\n } = this.props;\r\n onCopyItem(item);\r\n }\r\n\r\n onTogglingRemainingBalanceOverridePossibility = () => {\r\n const {\r\n onChange, item, itemId,\r\n } = this.props;\r\n const milestone = {\r\n ...item,\r\n RemainingBalanceOverridePossibility: !item.RemainingBalanceOverridePossibility,\r\n };\r\n onChange(milestone, itemId);\r\n }\r\n\r\n render() {\r\n const {\r\n item,\r\n disabled,\r\n currencyProject,\r\n columnsToDisplay,\r\n } = this.props;\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nMilestoneList.propTypes = {\r\n};\r\n\r\nexport default MilestoneList;\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport moment from 'moment';\r\nimport { checkAbilityForParentMilestoneDeleting } from 'pages/projects/actions/contractsActions';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { compare } from 'common/components/list/sortList';\r\nimport MilestoneList from 'common/components/milestones-list/milestone-list';\r\nimport { MONTH_AMOUNT_FOR_FIVE_YEARS } from 'utils/const-variable';\r\nimport '../redux-form.css';\r\n\r\nconst emptyMilestone = {\r\n Id: null,\r\n Milestone: '',\r\n InvoiceDate: '',\r\n MilestoneAmount: '',\r\n InvoicedAmount: '',\r\n InvoicedDate: '',\r\n RemainingBalance: null,\r\n RemainingBalanceOverridePossibility: false,\r\n};\r\n\r\nexport class renderMilestoneList extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showConfirmationDialog: false,\r\n selectedMilestones: [],\r\n isCanAddNewItem: false,\r\n isShowOverride: true,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { input } = this.props;\r\n if (!input.value || (input.value && !input.value.length)) {\r\n this.setState({\r\n isCanAddNewItem: true,\r\n });\r\n } else {\r\n this.checkIsValidMilestones();\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { input } = this.props;\r\n if (JSON.stringify(prevProps.input.value) !== JSON.stringify(input.value)) {\r\n this.updateSelectedMilestones();\r\n this.checkIsValidMilestones();\r\n }\r\n }\r\n\r\n onAddNewItem = () => {\r\n const {\r\n input,\r\n } = this.props;\r\n this.setState({\r\n isCanAddNewItem: false,\r\n }, () => {\r\n const milestones = input.value ? input.value : [];\r\n const Milestone = this.getNextDateForMilestone(milestones);\r\n input.onChange([...milestones, {\r\n ...emptyMilestone,\r\n Milestone,\r\n }]);\r\n });\r\n }\r\n\r\n getNextDateForMilestone = (milestones) => {\r\n const selectedMilestones = milestones.map((item) => item.Milestone);\r\n const optionsForMilestones = this.getSelectedOptionsForMilestones();\r\n const indexForNextMilestone = optionsForMilestones.indexOf(selectedMilestones[selectedMilestones.length - 1]) + 1;\r\n return milestones.length\r\n ? (\r\n indexForNextMilestone && indexForNextMilestone < optionsForMilestones.length\r\n ? optionsForMilestones[indexForNextMilestone]\r\n : optionsForMilestones.find((item) => !selectedMilestones.includes(item))\r\n )\r\n : optionsForMilestones[0];\r\n }\r\n\r\n checkIsValidMilestones = () => {\r\n const { input } = this.props;\r\n const isValid = !input.value.length\r\n || !input.value.find((item) => (\r\n item.Milestone === ''\r\n || item.MilestoneAmount === ''\r\n || (item.RemainingBalanceOverridePossibility && (item.RemainingBalance === '' || item.RemainingBalance === null))));\r\n this.setState({ isCanAddNewItem: isValid });\r\n }\r\n\r\n addSelectedMilestones = (milestone) => {\r\n const { selectedMilestone } = this.state;\r\n this.setState({\r\n selectedMilestone: [...selectedMilestone, milestone],\r\n });\r\n }\r\n\r\n getSelectedOptionsForMilestones = () => {\r\n const { startDate, endDate, projectEndDate } = this.props;\r\n const dateStart = moment(startDate).clone().startOf('month');\r\n const dateEnd = (endDate && moment(endDate).clone().startOf('month'))\r\n || (projectEndDate && moment(projectEndDate).clone().startOf('month').isBefore(moment(startDate).clone().add(MONTH_AMOUNT_FOR_FIVE_YEARS, 'months'))\r\n ? moment(projectEndDate).clone().startOf('month') : moment(startDate).clone().add(MONTH_AMOUNT_FOR_FIVE_YEARS, 'months'));\r\n const months = [];\r\n while (dateStart <= dateEnd) {\r\n months.push(dateStart.format('MMMM, YYYY'));\r\n dateStart.add(1, 'month');\r\n }\r\n return months;\r\n }\r\n\r\n onChange = (milestone, milestoneIndex) => {\r\n const { input } = this.props;\r\n const milestones = input.value.reduce((acc, item, i) => {\r\n if (i === milestoneIndex) {\r\n acc.push(milestone);\r\n } else {\r\n acc.push(item);\r\n }\r\n return acc;\r\n }, []);\r\n input.onChange(milestones);\r\n }\r\n\r\n createNewArrayWithMilestones = (milestones, count) => {\r\n return count === 0 ? milestones : this.createNewArrayWithMilestones(milestones.concat({\r\n ...emptyMilestone,\r\n Milestone: this.getNextDateForMilestone(milestones),\r\n }), count - 1);\r\n }\r\n\r\n onDeleteItem = (milestone) => {\r\n const {\r\n input, formName, checkAbilityForParentMilestoneDeleting, parentType, childType, projectId,\r\n } = this.props;\r\n const isExistingMilestone = !!(milestone.Id);\r\n const milestones = input.value.filter((item) => JSON.stringify(item) !== JSON.stringify(milestone));\r\n isExistingMilestone ? checkAbilityForParentMilestoneDeleting(\r\n milestone.Id, milestone.MilestoneStringified, formName, input.name, milestones, parentType, childType, projectId,\r\n ) : input.onChange(milestones);\r\n }\r\n\r\n checkAbilityToAddNewMilestone = () => {\r\n const { input } = this.props;\r\n const milestonesOptions = this.getSelectedOptionsForMilestones();\r\n return !milestonesOptions.every(option => input.value.some(milestone => milestone.Milestone === option));\r\n }\r\n\r\n updateSelectedMilestones = () => {\r\n const { input } = this.props;\r\n input.value && this.setState({\r\n selectedMilestones: input.value.map((item) => item.Milestone),\r\n });\r\n }\r\n\r\n onCopyItem = (milestone) => {\r\n const { input } = this.props;\r\n this.setState({\r\n isCanAddNewItem: false,\r\n }, () => {\r\n const milestones = input.value ? input.value : [];\r\n const copiedMilestone = {\r\n ...milestone,\r\n Milestone: this.getNextDateForMilestone(milestones),\r\n Id: null,\r\n RemainingBalance: !milestone.RemainingBalanceOverridePossibility ? null : milestone.RemainingBalance,\r\n };\r\n const newValue = [...milestones, copiedMilestone];\r\n input.onChange(newValue);\r\n });\r\n }\r\n\r\n sortMilestones = (milestones) => {\r\n return milestones && milestones.sort((a, b) => compare(\r\n moment(a.Milestone || a.MilestoneStringified, 'MMMM, YYYY').unix(),\r\n moment(b.Milestone || b.MilestoneStringified, 'MMMM, YYYY').unix(),\r\n 'Up',\r\n true,\r\n ));\r\n }\r\n\r\n onClickForPreset = (count) => {\r\n const { input } = this.props;\r\n this.setState({\r\n isCanAddNewItem: false,\r\n }, () => {\r\n const milestones = input.value ? input.value : [];\r\n input.onChange([...this.createNewArrayWithMilestones(milestones, count)]);\r\n });\r\n }\r\n\r\n isCheckCountMilestonesForPerset = (count) => {\r\n const { selectedMilestones } = this.state;\r\n return this.getSelectedOptionsForMilestones().length - selectedMilestones.length >= count;\r\n }\r\n\r\n render() {\r\n const {\r\n input, styles, columnsToDisplay, startDate, endDate, currencyProject,\r\n } = this.props;\r\n const {\r\n showConfirmationDialog, isCanAddNewItem, selectedMilestones,\r\n } = this.state;\r\n return (\r\n \r\n {\r\n columnsToDisplay && columnsToDisplay.map((column) => (
\r\n {\r\n items && items.length\r\n ? items && items.length && items.map((item, i) => (\r\n \r\n {isCheckboxShown ? : null}\r\n
))\r\n }\r\n Action\r\n \r\n {column.breakline ? (\r\n \r\n {column.Name.split(' ')[0]}\r\n
\r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n {\r\n column.isRequired ? (\r\n *\r\n ) : null\r\n }\r\n
\r\n \r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n {\r\n column.isRequired ? (\r\n *\r\n ) : null\r\n }\r\n
{NO_ITEMS_TITLE}
\r\n }\r\n \r\n \r\n
\r\n \r\n this.onClickForPreset(3)}\r\n >3 months\r\n this.onClickForPreset(6)}\r\n >6 months\r\n this.onClickForPreset(12)}\r\n >12 months\r\n
\r\n \r\n
\r\n {\r\n label && \r\n }\r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport { SowRenewalStatusList } from 'common/components/sow-renewal-status-list/sow-renewal-status-list';\r\nimport { getTotalPercent } from 'services/getTotalPercentForRenewalStatuses';\r\nimport { TOTAL_PERCENT_FOR_RENEWAL_STATUSES } from 'utils/const-variable';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\n\r\nimport 'common/components/sow-renewal-status-list/sow-renewal-status-block.css';\r\n\r\n\r\nexport class renderRenewalStatusBlock extends Component {\r\n constructor() {\r\n super();\r\n this.state = {\r\n showPopover: false,\r\n totalPercent: 0,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.updateTotalPercent();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { input } = this.props;\r\n if (isObjectNotEquals(prevProps.input.value, input.value)) {\r\n this.updateTotalPercent();\r\n }\r\n }\r\n\r\n onToggleShowSowRenewalStatusList = () => {\r\n const { isShowSowRenewalStatusList } = this.state;\r\n const { input: { value } } = this.props;\r\n const firstRenewalStatus = value.find((status) => status.Name === 'New business');\r\n const isCheckedStatus = value.find((status) => status.IsActive);\r\n this.setState({\r\n isShowSowRenewalStatusList: !isShowSowRenewalStatusList,\r\n }, () => {\r\n !isCheckedStatus && this.onChange({ ...firstRenewalStatus, IsActive: true, Value: 100 }, firstRenewalStatus.RenewalStatusId);\r\n });\r\n }\r\n\r\n onChange = (renewalStatus, renewalStatusId) => {\r\n const { input } = this.props;\r\n const rewenalStatuses = renewalStatusId ? input.value.reduce((acc, item) => {\r\n if (item.RenewalStatusId === renewalStatusId) {\r\n acc.push(renewalStatus);\r\n } else {\r\n acc.push(item);\r\n }\r\n return acc;\r\n }, []) : [...renewalStatus];\r\n input.onChange(rewenalStatuses);\r\n }\r\n\r\n handleChangeShowPopover = () => {\r\n const { showPopover } = this.state;\r\n this.setState({\r\n showPopover: !showPopover,\r\n });\r\n }\r\n\r\n updateTotalPercent = () => {\r\n const { input } = this.props;\r\n input.value.length && this.setState({\r\n totalPercent: +getTotalPercent(input.value).toFixed(2),\r\n });\r\n }\r\n\r\n render() {\r\n const { showPopover, totalPercent } = this.state;\r\n const { input, columnsToDisplay, styles } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n \r\n \r\n SOW Renewal Status\r\n *\r\n
\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport moment from 'moment';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport history from 'utils/history';\r\nimport {\r\n NON_BILLABLE_TRAINING, TIME_AND_MATERIAL, FINISHED, EXTENDED, MONTH_AMOUNT_FOR_FIVE_YEARS, MILESTONE_BACKUP_USED_COLUMN_NAME,\r\n} from 'utils/const-variable';\r\nimport { getStatusesForRequiredComment } from 'pages/projects/components/utils/createArrayWithStatusMatch';\r\nimport { EditAssociatedRoles } from 'pages/projects/components/edit-associated-roles/edit-associated-roles';\r\nimport { editRole } from 'pages/projects/actions/roleModalActions';\r\nimport { addNewSOW, editCurrentSOW } from 'pages/projects/actions/contractsActions';\r\nimport { addSowToPartialContract, cancelImport } from 'pages/projects/actions/importContractAction';\r\nimport { getCorrectDataForEditRole } from 'services/getCorrectDataForEditRole.js';\r\nimport {\r\n required, validateDate, complexRequired, validateMilestone, validateRenewalStatus,\r\n} from 'services/redux-form-validators.js';\r\nimport { getAllCheckedRolesAndEmployees } from 'utils/getAllCheckedRolesAndEmployees.js';\r\n\r\nimport renderTextField from '../components/text-field';\r\nimport renderSelect from '../components/select';\r\nimport renderDatePicker from '../components/date-picker';\r\nimport renderCheckbox from '../components/check-box';\r\nimport renderDocumentList from '../components/document-list';\r\nimport renderMilestoneList from '../components/milestone-list';\r\nimport renderSearchDropdown from '../components/search-dropdown';\r\nimport Button from '../components/button';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { getChangeConfigForPatchRequests, combinedConfigsForPatchRequests } from 'utils/getConfigBasedOnCheckedDates';\r\nimport { renderRenewalStatusBlock } from '../components/sow-renewal-status-block';\r\nimport { getConfigBasedOnCheckedDates } from 'utils/getConfigBasedOnCheckedDates';\r\n\r\nimport '../redux-form.css';\r\nimport './project-edit-SOW-form.css';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container edit-SOW__simple-container',\r\n label: 'redux-form__SOW--label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst validateApprover = (value, values, props, field) => {\r\n const condition = !(props.projectType && props.projectType.Name === NON_BILLABLE_TRAINING && values.Type && values.Type.Name === TIME_AND_MATERIAL);\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst validateComment = (value, values, props, field) => {\r\n const isMatchObject = { docStatus: values.Status && values.Status.Id, approveStatus: values.ApprovalStatus && values.ApprovalStatus.Id };\r\n const condition = !!getStatusesForRequiredComment(props.allStatuses, props.allApprovalStatuses).find((item) => !isObjectNotEquals(item, isMatchObject));\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst validateEndDate = (value, values, props, field) => {\r\n const condition = values.Status && (values.Status.Name === EXTENDED || values.Status.Name === FINISHED);\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst additionalConditionForContract = (role, StartDateContract, EndDateContract) => moment(role.StartDate).isSameOrAfter(StartDateContract, 'day')\r\n && moment(role.EndDate).isSameOrBefore(EndDateContract, 'day');\r\n\r\nclass ProjectEditSOWForm extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n associatedRoles: [],\r\n showAssociatedRolesModal: false,\r\n isNeedToChangeDate: false,\r\n showConfirmationDialog: false,\r\n messageForConfirmDialog: '',\r\n configPatchRequestsForConfirmDialog: null,\r\n importContractDatesCheck: [],\r\n };\r\n\r\n this.showAsterix = {\r\n Approver: () => {\r\n const { projectType, Type } = this.props;\r\n if (projectType && Type && Type.Name) return projectType.Name !== NON_BILLABLE_TRAINING || Type.Name !== TIME_AND_MATERIAL;\r\n return true;\r\n },\r\n EndDate: () => {\r\n const { Status } = this.props;\r\n return Status && (Status.Name === EXTENDED || Status.Name === FINISHED);\r\n },\r\n StatusComments: () => {\r\n const {\r\n allStatuses, allApprovalStatuses, Status, ApprovalStatus,\r\n } = this.props;\r\n const isMatchObject = {\r\n docStatus: Status && Status.Id,\r\n approveStatus: ApprovalStatus && ApprovalStatus.Id,\r\n };\r\n return !!getStatusesForRequiredComment(allStatuses, allApprovalStatuses).find((item) => !isObjectNotEquals(item, isMatchObject));\r\n },\r\n };\r\n this.disable = {\r\n Approver: () => {\r\n const { Company } = this.props;\r\n return !Company;\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n data, initialize, ProjectEndDate, datesForCheckChildContracts, ProjectStartDate, importContract,\r\n } = this.props;\r\n const importContractDatesCheck = [];\r\n initialize(data);\r\n if (Object.keys(importContract).length) {\r\n if ((ProjectEndDate && data.EndDate) && new Date(ProjectEndDate) < new Date(data.EndDate)) {\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: this.getStartDatesForDatePicker(), endDatesParentContracts: this.getEndDatesForDatePicker() },\r\n datesForCheckChildContracts,\r\n new Date(data.EndDate),\r\n 'SOW',\r\n false,\r\n false,\r\n new Date(data.EndDate),\r\n );\r\n config && importContractDatesCheck.push(config);\r\n }\r\n if ((ProjectStartDate && data.StartDate) && new Date(ProjectStartDate) > new Date(data.StartDate)) {\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: this.getStartDatesForDatePicker(), endDatesParentContracts: this.getEndDatesForDatePicker() },\r\n datesForCheckChildContracts,\r\n new Date(data.StartDate),\r\n 'SOW',\r\n true,\r\n false,\r\n new Date(data.StartDate),\r\n );\r\n config && importContractDatesCheck.push(config);\r\n }\r\n }\r\n this.setState({\r\n importContractDatesCheck,\r\n });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n data, Milestones, change, StartDate, EndDate, showAlertDialog, Status,\r\n } = this.props;\r\n const {\r\n configPatchRequestsForConfirmDialog, isNeedToChangeDate, importContractDatesCheck, showConfirmationDialog,\r\n } = this.state;\r\n const { Milestones: existMilestones, SowRenewalStatuses } = data;\r\n if (importContractDatesCheck.length && !showConfirmationDialog) {\r\n this.showConfirmationDialog(importContractDatesCheck.at(-1));\r\n this.setState({\r\n importContractDatesCheck: importContractDatesCheck.slice(0, -1),\r\n });\r\n }\r\n if (!prevProps.data.Milestones.length && JSON.stringify(prevProps.data.Milestones) !== JSON.stringify(existMilestones)) {\r\n change('Milestones', existMilestones);\r\n }\r\n if (prevProps.StartDate !== StartDate || prevProps.EndDate !== EndDate) {\r\n const isStartDateChanged = prevProps.StartDate !== StartDate;\r\n const isEndDateChanged = prevProps.EndDate !== EndDate;\r\n const endDateForMilestones = EndDate || moment(StartDate).clone().add(MONTH_AMOUNT_FOR_FIVE_YEARS, 'months').format();\r\n const milestonesOutOfRange = Milestones.filter(milestone => {\r\n return ((isStartDateChanged\r\n && StartDate\r\n && !moment(moment(StartDate).startOf('month').format()).isBefore(moment(new Date(milestone.Milestone), 'MMMM, YYYY').days(15).format()))\r\n || (isEndDateChanged\r\n && endDateForMilestones\r\n && !moment(moment(endDateForMilestones).endOf('month').format()).isAfter(moment(new Date(milestone.Milestone), 'MMMM, YYYY')\r\n .days(15).format())));\r\n });\r\n if (milestonesOutOfRange.length) {\r\n showAlertDialog(`${moment(new Date(milestonesOutOfRange[0].Milestone)).format('MMMM YYYY')} milestone is out of range. Please, delete it first.`);\r\n isStartDateChanged && change('StartDate', null);\r\n isEndDateChanged && change('EndDate', null);\r\n }\r\n if (!EndDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'endDate'),\r\n });\r\n }\r\n if (!StartDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'startDate'),\r\n });\r\n }\r\n }\r\n if (JSON.stringify(prevProps.data.SowRenewalStatuses) !== JSON.stringify(SowRenewalStatuses)) {\r\n change('SowRenewalStatuses', SowRenewalStatuses);\r\n }\r\n if (prevProps.Status && isObjectNotEquals(prevProps.Status, Status) && Status.Name === 'Extended') {\r\n change('SowRenewalStatuses', this.setRenewalStatusExtended());\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { destroy } = this.props;\r\n destroy();\r\n }\r\n\r\n onChange = (data, value, prevValue, field) => {\r\n const { change, milestonesFromDB, Milestones } = this.props;\r\n const isTypeNoActualTime = data && data.Name !== TIME_AND_MATERIAL;\r\n const newMilestones = isTypeNoActualTime && Milestones.map(milestone => {\r\n const milestoneFromDB = milestonesFromDB.find(milestoneFromDB => milestoneFromDB.Milestone === milestone.Milestone);\r\n return {\r\n ...milestone,\r\n UsedAssignmentBackupUser: milestoneFromDB && milestoneFromDB.UsedAssignmentBackupUser || null,\r\n };\r\n });\r\n switch (field) {\r\n case 'Company':\r\n change('Approver', '');\r\n break;\r\n case 'Type':\r\n isTypeNoActualTime && change('Milestones', newMilestones);\r\n break;\r\n default: break;\r\n }\r\n }\r\n\r\n addNewMilestone = (milestones) => {\r\n const { change } = this.props;\r\n change('Milestones', milestones);\r\n }\r\n\r\n checkForAssociatedRoles = () => {\r\n const {\r\n StartDate, EndDate, initial, isOnlyActiveRoles, Project, Status,\r\n } = this.props;\r\n if (initial.Status && initial.Status.Id !== Status.Id && Status.Name === FINISHED) {\r\n this.changeAssociatedRoleStatus();\r\n return false;\r\n }\r\n if (initial.StartDate !== StartDate || (initial.EndDate !== EndDate && moment(EndDate).isValid())) {\r\n this.changeAssociatedRoleDates();\r\n return false;\r\n }\r\n this.editSOW(Project.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n changeAssociatedRoleStatus = () => {\r\n const {\r\n RolesForContarct, Id, isOnlyActiveRoles, Project,\r\n } = this.props;\r\n const associatedRoles = RolesForContarct.filter(role => role.SowPoId === Id);\r\n const allCheckedRolesAndEmployees = getAllCheckedRolesAndEmployees(associatedRoles);\r\n if (allCheckedRolesAndEmployees.length) {\r\n this.setState({\r\n associatedRoles: allCheckedRolesAndEmployees,\r\n showAssociatedRolesModal: true,\r\n });\r\n } else {\r\n this.editSOW(Project.Id, !isOnlyActiveRoles);\r\n }\r\n }\r\n\r\n changeAssociatedRoleDates = () => {\r\n const {\r\n RolesForContarct, Id, isOnlyActiveRoles, Project, StartDate, EndDate,\r\n } = this.props;\r\n const associatedRoles = RolesForContarct.filter(role => role.SowPoId === Id);\r\n const checkedRoles = associatedRoles.reduce((roles, role) => {\r\n const rolesWithCheckedEmployees = role.Employees.reduce((employees, employee) => {\r\n employees.push({\r\n ...employee,\r\n checked: employee.Status.Name !== 'Removed',\r\n disabledItem: employee.Status.Name === 'Removed' || !additionalConditionForContract(employee, StartDate, EndDate),\r\n });\r\n return employees;\r\n }, []);\r\n roles.push({\r\n ...role,\r\n checked: role.Status.Name !== 'Removed',\r\n Employees: [...rolesWithCheckedEmployees],\r\n disabledItem: role.Status.Name === 'Removed' || !additionalConditionForContract(role, StartDate, EndDate),\r\n });\r\n return roles;\r\n }, []);\r\n if (checkedRoles.length) {\r\n this.setState({\r\n associatedRoles: checkedRoles,\r\n showAssociatedRolesModal: true,\r\n });\r\n } else {\r\n this.editSOW(Project.Id, !isOnlyActiveRoles);\r\n }\r\n }\r\n\r\n closeAssociatedRolesModal = () => {\r\n this.setState({ showAssociatedRolesModal: false });\r\n }\r\n\r\n applyAssociatedRoles = (roles) => {\r\n const {\r\n Project, StartDate, EndDate, isOnlyActiveRoles, editRole, Status, initial,\r\n } = this.props;\r\n if (roles.length) {\r\n const checkedRoles = roles.filter(role => role.checked);\r\n if (checkedRoles.length) {\r\n const startDateForUpdateRoles = !moment(StartDate).isSame(initial.StartDate) ? StartDate : null;\r\n const endDateForUpdateRoles = !moment(EndDate).isSame(initial.EndDate) ? EndDate : null;\r\n const rolesToUpdate = getCorrectDataForEditRole(checkedRoles, startDateForUpdateRoles, endDateForUpdateRoles, Status, Project.Id);\r\n rolesToUpdate.forEach(role => editRole(role, !isOnlyActiveRoles));\r\n }\r\n }\r\n this.closeAssociatedRolesModal();\r\n this.editSOW(Project.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n applyForm = () => {\r\n const {\r\n Id, isOnlyActiveRoles, Project, cancelContractImport, importContract,\r\n } = this.props;\r\n Id ? this.checkForAssociatedRoles() : this.addSOW(Project.Id, !isOnlyActiveRoles);\r\n Object.keys(importContract).length && cancelContractImport(Project.Id);\r\n }\r\n\r\n addSOW = (projectId, isOnlyActiveRoles) => {\r\n const { addSOW } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n addSOW(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n history.push({\r\n pathname: `/projects/${projectId}`,\r\n });\r\n }\r\n\r\n editSOW = (projectId, isOnlyActiveRoles) => {\r\n const { editSOW, location } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n const saveCallback = (location.state && location.state.saveCallback) || `/projects/${projectId}`;\r\n\r\n editSOW(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, saveCallback);\r\n }\r\n\r\n closeConfirmationDialog = () => {\r\n const { change } = this.props;\r\n const { typeDateForDeleteIfUserCloseConfirmationDialog } = this.state;\r\n this.setState({\r\n showConfirmationDialog: false,\r\n isNeedToChangeDate: false,\r\n });\r\n change(typeDateForDeleteIfUserCloseConfirmationDialog, null);\r\n }\r\n\r\n showConfirmationDialog = (configForConfirmDialog) => {\r\n const { configPatchRequestsForConfirmDialog } = this.state;\r\n this.setState({\r\n showConfirmationDialog: true,\r\n messageForConfirmDialog: configForConfirmDialog.message,\r\n typeDateForDeleteIfUserCloseConfirmationDialog: configForConfirmDialog.typeChangedDate,\r\n configPatchRequestsForConfirmDialog:\r\n combinedConfigsForPatchRequests(configForConfirmDialog.configForPatchRequests, configPatchRequestsForConfirmDialog),\r\n });\r\n }\r\n\r\n onConfirmDialog = () => {\r\n this.setState({\r\n isNeedToChangeDate: true,\r\n showConfirmationDialog: false,\r\n });\r\n }\r\n\r\n setRenewalStatusExtended = () => {\r\n const { SowRenewalStatuses } = this.props;\r\n return SowRenewalStatuses.map((status) => status.Name === 'Renewal'\r\n ? ({ ...status, IsActive: true })\r\n : ({ ...status, IsActive: false }));\r\n }\r\n\r\n getStartDatesForDatePicker = () => {\r\n const { ProjectStartDate, projectId } = this.props;\r\n return [{ date: ProjectStartDate, type: 'Project', id: projectId }];\r\n }\r\n\r\n getEndDatesForDatePicker = () => {\r\n const { ProjectEndDate, projectId } = this.props;\r\n return [{ date: ProjectEndDate, type: 'Project', id: projectId }];\r\n }\r\n\r\n onSaveAndCreateRoles = () => {\r\n const {\r\n addImportSow, isOnlyActiveRoles, Project,\r\n } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n addImportSow(Project.Id, !isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n }\r\n\r\n onCancelClick = () => {\r\n const { cancelContractImport, Project } = this.props;\r\n cancelContractImport(Project.Id);\r\n }\r\n\r\n render() {\r\n const {\r\n showAssociatedRolesModal, associatedRoles, showConfirmationDialog, messageForConfirmDialog,\r\n } = this.state;\r\n const {\r\n disabled, allSOWTypes, allApprovalStatuses, allClients, allApprovers, allStatuses,\r\n columnsToDisplay, viewFinancialInfo, allDocumentTypes, allPaymentTerms,\r\n Contract, Type, ApprovalStatus, InvoiceDate, Company, Approver, Id,\r\n StartDate, EndDate, BusinessGroup, ProjectTeam, Status, PaymentTerm,\r\n TravelBudget, TravelReimbursement, Links, Milestones, formErrors, BudgetComments, handleSubmit, StatusComments, ProjectEndDate,\r\n BillingCode, showAlertDialog, invoiceDates, currencyProject, allRenewalStatuses, SowRenewalStatuses, projectId,\r\n datesForCheckChildContracts, allRolesForContract, importRoles,\r\n } = this.props;\r\n const isTypeActualTime = Type && Type.Name === TIME_AND_MATERIAL;\r\n const milestonesListColumnsToDisplay = isTypeActualTime ? columnsToDisplay.milestonesList\r\n : columnsToDisplay.milestonesList.filter(column => column.Name !== MILESTONE_BACKUP_USED_COLUMN_NAME);\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('projectEditSOWForm', data)),\r\n destroy: () => dispatch(destroy('projectEditSOWForm')),\r\n change: (field, value) => dispatch(change('projectEditSOWForm', field, value)),\r\n addSOW:\r\n (projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => (\r\n dispatch(addNewSOW(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog))),\r\n editSOW:\r\n (projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, saveCallback) => (\r\n dispatch(editCurrentSOW(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, saveCallback))),\r\n editRole: (role, isOnlyActiveRoles) => dispatch(editRole(role, isOnlyActiveRoles)),\r\n showAlertDialog: (message) => dispatch(showAlertDialog(message)),\r\n addImportSow: (projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => (\r\n dispatch(addSowToPartialContract(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog))),\r\n cancelContractImport: (id) => dispatch(cancelImport(id)),\r\n };\r\n};\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.projectEditSOWForm && state.form.projectEditSOWForm.values;\r\n return {\r\n Id: isFormReducerExists && state.form.projectEditSOWForm.values.Id,\r\n Contract: isFormReducerExists && state.form.projectEditSOWForm.values.Name,\r\n Type: isFormReducerExists && state.form.projectEditSOWForm.values.Type,\r\n ApprovalStatus: isFormReducerExists && state.form.projectEditSOWForm.values.ApprovalStatus,\r\n Company: isFormReducerExists && state.form.projectEditSOWForm.values.Company,\r\n Approver: isFormReducerExists && state.form.projectEditSOWForm.values.Approver,\r\n StartDate: isFormReducerExists && state.form.projectEditSOWForm.values.StartDate,\r\n EndDate: isFormReducerExists && state.form.projectEditSOWForm.values.EndDate,\r\n BillingCode: isFormReducerExists && state.form.projectEditSOWForm.values.BillingCode,\r\n BusinessGroup: isFormReducerExists && state.form.projectEditSOWForm.values.BusinessGroup,\r\n ProjectTeam: isFormReducerExists && state.form.projectEditSOWForm.values.ProjectTeam,\r\n Status: isFormReducerExists && state.form.projectEditSOWForm.values.Status,\r\n PaymentTerm: isFormReducerExists && state.form.projectEditSOWForm.values.PaymentTerm,\r\n TravelBudget: isFormReducerExists && state.form.projectEditSOWForm.values.TravelBudget,\r\n TravelReimbursement: isFormReducerExists && state.form.projectEditSOWForm.values.TravelReimbursement,\r\n StatusComments: isFormReducerExists && state.form.projectEditSOWForm.values.StatusComments,\r\n Links: isFormReducerExists && state.form.projectEditSOWForm.values.Links,\r\n Milestones: isFormReducerExists && state.form.projectEditSOWForm.values.Milestones,\r\n POs: isFormReducerExists && state.form.projectEditSOWForm.values.POs,\r\n Project: isFormReducerExists && state.form.projectEditSOWForm.values.Project,\r\n BudgetComments: isFormReducerExists && state.form.projectEditSOWForm.values.BudgetComments,\r\n SowRenewalStatuses: isFormReducerExists && state.form.projectEditSOWForm.values.SowRenewalStatuses,\r\n formErrors: isFormReducerExists && state.form.projectEditSOWForm.syncErrors,\r\n initial: isFormReducerExists && state.form.projectEditSOWForm.initial,\r\n isOnlyActiveRoles: state.showRoles.isOnlyActiveRoles,\r\n allPaymentTerms: state.adminManageLookups.paymentTerms,\r\n ProjectStartDate: state.projectsReducer.projectDetails.StartDate,\r\n ProjectEndDate: state.projectsReducer.projectDetails.EndDate,\r\n importRoles: state.importContractReducer.contract.Roles,\r\n importContract: state.importContractReducer.contract,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'projectEditSOWForm',\r\n})(ProjectEditSOWForm));\r\n","import moment from 'moment';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\nimport { isStringAndNotEmpty } from 'utils/isStringAndNotEmpty.js';\r\nimport { isNumber } from 'utils/isNumber.js';\r\n\r\nconst convertMoneyValue = (value) => isStringAndNotEmpty(value) || isNumber(value) ? getAmericanFormat(value) : '';\r\n\r\nexport function convertMilestones(milestones) {\r\n return milestones.map((item) => ({\r\n ...item,\r\n Milestone: item.Milestone ? moment(item.Milestone).format('MMMM, YYYY') : '',\r\n InvoicedAmount: convertMoneyValue(item.InvoicedAmount),\r\n MilestoneAmount: convertMoneyValue(item.MilestoneAmount),\r\n RemainingBalance: convertMoneyValue(item.RemainingBalance),\r\n }));\r\n}\r\n","import moment from 'moment';\r\n\r\nexport const formatContractDate = (date) => date ? moment(new Date(date)).format('YYYY-MM-DD hh:mm') : null;\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport './SOW-edit-page.css';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport { loadManageDocumentTypes } from 'pages/admin/actions/adminManageDocumentTypes';\r\nimport { getManagePaymentTerms } from 'pages/admin/actions/adminManagePaymentTerms';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport ProjectEditSOWForm from 'common/components/redux-form/project-edit-SOW-form/project-edit-SOW-form';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport {\r\n getMilestonesForSOW,\r\n setMilestonesForSOW,\r\n getRenewalStatusesForSow,\r\n setRenewalStatusesForSow,\r\n getShadowingMilestones,\r\n resetShadowingMilestones,\r\n} from 'pages/projects/actions/projectsActions';\r\nimport { loadSOWRenewalStatuses } from 'pages/admin/actions/adminManageSOWRenewalStatus';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport { getTheBiggestDateRangeForContracts } from 'pages/projects/components/utils/getTheBiggestDateRangeForContracts';\r\nimport { convertMilestones } from 'utils/convertMilestones';\r\nimport { formatContractDate } from '../../utils/formatContractDate';\r\nimport { cancelImport } from 'pages/projects/actions/importContractAction';\r\nimport { getEmployees } from 'pages/projects/actions/roleModalActions';\r\n\r\nexport class SOWEditPage extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { projectDetails, ManageProjectContracts, HasFinancialAccess } = this.props;\r\n this.state = {\r\n columnsToDisplay: {\r\n documentsList: [\r\n {\r\n Name: 'Documents Links',\r\n isSelected: true,\r\n Id: 'Comment',\r\n className: 'without-width-col',\r\n pressArrowLeft: true,\r\n },\r\n {\r\n Name: 'Documents Types',\r\n isType: true,\r\n Id: 'DocumentType',\r\n className: 'without-width-col',\r\n pressArrowLeft: true,\r\n },\r\n ],\r\n milestonesList: [\r\n {\r\n Name: 'Milestone',\r\n Id: 'Milestone',\r\n className: 'without-width-col',\r\n isRequired: true,\r\n },\r\n {\r\n Name: 'Milestone Amount',\r\n Id: 'MilestoneAmount',\r\n className: 'without-width-col',\r\n isRequired: true,\r\n },\r\n {\r\n Name: 'Invoice Amount',\r\n Id: 'InvoicedAmount',\r\n className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Revenue Received',\r\n Id: 'RevenueReceived',\r\n className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Invoiced Date',\r\n Id: 'InvoicedDate',\r\n className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Delta to Goal',\r\n Id: 'RemainingBalance',\r\n className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Approved',\r\n Id: 'Approved',\r\n className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Backup used',\r\n Id: 'UsedAssignmentBackupUser',\r\n className: 'without-width-col',\r\n },\r\n ],\r\n sowRenewalStatusesList: [\r\n {\r\n Name: 'Status Type',\r\n Id: 'Status',\r\n className: 'col__renewal-status-type',\r\n },\r\n {\r\n Name: 'Value',\r\n Id: 'Value',\r\n className: 'col__renewal-value',\r\n },\r\n ],\r\n },\r\n ManageProjectContracts,\r\n HasFinancialAccess,\r\n };\r\n this.Id = history.location.pathname.split('/')[4] || null;\r\n // eslint-disable-next-line prefer-destructuring\r\n this.location = history.location.pathname.split('/')[3];\r\n this.emptyForm = {\r\n Id: '',\r\n Contract: this.autoGenerateSOWNumber(projectDetails.Contracts),\r\n Company: '',\r\n Approver: '',\r\n Type: {},\r\n BillingCode: '',\r\n Project: { Id: projectDetails.Id, Name: projectDetails.Name },\r\n Budget: '',\r\n StartDate: null,\r\n EndDate: null,\r\n ApprovalStatus: {},\r\n BusinessGroup: '',\r\n ProjectTeam: '',\r\n TravelBudget: false,\r\n TravelReimbursement: false,\r\n RealizedRevenue: '',\r\n StatusComments: '',\r\n BudgetComments: '',\r\n Status: {},\r\n Links: [],\r\n Milestones: [],\r\n POs: [],\r\n PaymentTerm: '',\r\n SowRenewalStatuses: [],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n projectDetails,\r\n location,\r\n loadManageDocumentTypes,\r\n getManagePaymentTerms,\r\n getMilestonesForSOW,\r\n setComponent,\r\n loadSOWRenewalStatuses,\r\n getRenewalStatusesForSow,\r\n getShadowingMilestones,\r\n HasFinancialAccess,\r\n importedRoles,\r\n getEmployees,\r\n } = this.props;\r\n if (importedRoles && importedRoles.length) {\r\n const offices = projectDetails.Offices.map((office) => office.Id);\r\n getEmployees(offices, true);\r\n }\r\n this.defineRightsForEdit();\r\n !projectDetails.Name && history.goBack({ state: location.state });\r\n if (HasFinancialAccess) {\r\n this.Id && getMilestonesForSOW(this.Id, projectDetails.Id);\r\n this.Id && getShadowingMilestones(this.Id, projectDetails.Id);\r\n }\r\n this.Id && getRenewalStatusesForSow(this.Id);\r\n loadManageDocumentTypes();\r\n getManagePaymentTerms();\r\n loadSOWRenewalStatuses();\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n setComponent({\r\n returnButton: { text: rightPath, goToPreviousPage: this.goTyMainList },\r\n secondReturnButton: {\r\n text: `${projectDetails && projectDetails.Name} details`,\r\n goToPreviousPage: this.goToProjectDetails,\r\n },\r\n });\r\n }\r\n\r\n componentWillUnmount() {\r\n const {\r\n setMilestonesForSOW, resetComponent, setRenewalStatusesForSow, resetShadowingMilestones,\r\n } = this.props;\r\n\r\n const emptyArray = [];\r\n setMilestonesForSOW(emptyArray);\r\n setRenewalStatusesForSow(emptyArray);\r\n resetComponent();\r\n resetShadowingMilestones();\r\n }\r\n\r\n defineRightsForEdit = () => {\r\n if (this.location === 'add-sow') {\r\n this.setState({\r\n HasFinancialAccess: true,\r\n });\r\n }\r\n };\r\n\r\n autoGenerateSOWNumber = (contracts) => {\r\n return 'SOW-' + (contracts.length + 1);\r\n };\r\n\r\n getTitleText = () => {\r\n const titleText = this.location.replace('-', ' ');\r\n return titleText === 'view sow'\r\n ? 'viewSow'\r\n : titleText === 'edit sow'\r\n ? 'editSow'\r\n : 'addSow';\r\n };\r\n\r\n goTyMainList = () => {\r\n const { location } = this.props;\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n history.push({ pathname: `/${rightPath}`, state: location.state });\r\n };\r\n\r\n goToProjectDetails = () => {\r\n const { projectDetails, location, cancelImport } = this.props;\r\n\r\n cancelImport(projectDetails.Id);\r\n history.push({\r\n pathname: `/projects/${projectDetails.Id}`,\r\n state: location.state,\r\n });\r\n };\r\n\r\n getTheBiggestDateRangeForChildContract = (SOWDetails) => {\r\n const arrayForParam = SOWDetails ? [SOWDetails] : [];\r\n return getTheBiggestDateRangeForContracts(arrayForParam, false);\r\n };\r\n\r\n render() {\r\n const { columnsToDisplay, HasFinancialAccess, ManageProjectContracts } = this.state;\r\n const {\r\n projectDetails,\r\n SOWTypes,\r\n approvalStatuses,\r\n clients,\r\n clientContacts,\r\n documentStatuses,\r\n location,\r\n documentTypes,\r\n paymentTerms,\r\n invoiceDates,\r\n milestones,\r\n allRenewalStatuses,\r\n SowRenewalStatuses,\r\n allRoles,\r\n importContract,\r\n partialContract,\r\n } = this.props;\r\n const SOWDetails = projectDetails\r\n && projectDetails.Contracts.find((contract) => contract.Id === this.Id);\r\n const formTitle = this.location === 'add-sow' ? 'Add SOW' : 'Edit SOW ';\r\n const arrayMilestones = importContract && importContract.Milestones ? convertMilestones(importContract.Milestones) : convertMilestones(milestones);\r\n const arrayRenewalStatuses = allRenewalStatuses.map((status) => {\r\n const currentSowRenewalStatus = SowRenewalStatuses\r\n && SowRenewalStatuses.find(\r\n (sowStatus) => !isObjectNotEquals(sowStatus.RenewalStatus, status),\r\n );\r\n return !SowRenewalStatuses.length && status.Name === 'New business'\r\n ? {\r\n RenewalStatusId: status.Id,\r\n Name: status.Name,\r\n Value: 100,\r\n IsActive: true,\r\n }\r\n : {\r\n RenewalStatusId: status.Id,\r\n Name: status.Name,\r\n Value: currentSowRenewalStatus ? currentSowRenewalStatus.Value : 0,\r\n IsActive: currentSowRenewalStatus\r\n ? currentSowRenewalStatus.IsActive\r\n : false,\r\n };\r\n });\r\n return (\r\n \r\n {\r\n showPopover ? (\r\n
\r\n \r\n
\r\n ) : null\r\n }\r\n Total percentage of SOW Renewal Status should be equal to 100%
\r\n\r\n \r\n {\r\n const renewalStatusName = allRenewalStatuses.find(item => item.Id === status.RenewalStatusId);\r\n return { ...status, Name: renewalStatusName.Name };\r\n })\r\n : [...arrayRenewalStatuses],\r\n Milestones: arrayMilestones,\r\n EndDate: formatContractDate(importContract.EndDate) || formatContractDate(projectDetails.EndDate),\r\n StartDate: formatContractDate(importContract.StartDate) || formatContractDate(projectDetails.StartDate),\r\n Type: SOWTypes.find(item => item.Id === importContract.SowTypeId) || {},\r\n ApprovalStatus: approvalStatuses.find(item => item.Id === importContract.ApprovalStatus) || {},\r\n Company: importContract.ClientId || '',\r\n Approver: importContract.SOWApproverId || '',\r\n Status: documentStatuses.find(item => item.Id === importContract.DocumentStatus) || {},\r\n PaymentTerm: importContract.PaymentTerm || paymentTerms.find(item => item.Id === importContract.PaymentTermId) || '',\r\n }\r\n : {\r\n ...this.emptyForm,\r\n BillingCode:\r\n (SOWDetails && SOWDetails.BillingCode)\r\n || (projectDetails && projectDetails.BillingCode),\r\n SowRenewalStatuses: [...arrayRenewalStatuses],\r\n }\r\n }\r\n disabled={!ManageProjectContracts}\r\n allSOWTypes={sortFilterList(SOWTypes)}\r\n allApprovalStatuses={sortFilterList(approvalStatuses)}\r\n allClients={sortFilterList(clients)}\r\n allApprovers={sortFilterList(clientContacts)}\r\n allStatuses={documentStatuses}\r\n allDocumentTypes={documentTypes}\r\n RolesForContarct={projectDetails.Roles}\r\n allRolesForContract={allRoles}\r\n allPaymentTerms={paymentTerms}\r\n columnsToDisplay={columnsToDisplay}\r\n viewFinancialInfo={HasFinancialAccess}\r\n projectType={projectDetails.Billability}\r\n location={location}\r\n currencyProject={\r\n projectDetails\r\n && projectDetails.Currency\r\n && projectDetails.Currency.Name\r\n }\r\n projectDetails={projectDetails}\r\n handleSubmit={formHandleSubmit}\r\n invoiceDates={invoiceDates}\r\n milestonesFromDB={milestones}\r\n allRenewalStatuses={allRenewalStatuses}\r\n projectId={projectDetails && projectDetails.Id}\r\n datesForCheckChildContracts={this.getTheBiggestDateRangeForChildContract(\r\n SOWDetails,\r\n )}\r\n />\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nSOWEditPage.propTypes = {\r\n projectDetails: PropTypes.object,\r\n SOWTypes: PropTypes.array,\r\n approvalStatuses: PropTypes.array,\r\n clients: PropTypes.array,\r\n clientContacts: PropTypes.array,\r\n documentStatuses: PropTypes.array,\r\n documentTypes: PropTypes.array,\r\n loadManageDocumentTypes: PropTypes.func,\r\n ManageProjectContracts: PropTypes.bool.isRequired,\r\n HasFinancialAccess: PropTypes.bool.isRequired,\r\n};\r\n\r\nexport default connect(\r\n (store) => {\r\n return {\r\n projectDetails: store.projectsReducer.projectDetails,\r\n SOWTypes: store.projectsReducer.SOWTypes,\r\n approvalStatuses: store.projectsReducer.approvalStatuses,\r\n clients: store.filtersReducer.filters.Clients,\r\n clientContacts: store.projectsReducer.clientContacts,\r\n documentStatuses: store.filtersReducer.filters.documentStatuses,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n UserOfficeId: store.authReducer.user.UserOfficeId,\r\n Offices: store.projectsReducer.projectDetails.Offices,\r\n documentTypes: store.adminManageLookups.documentTypes,\r\n EmployeeId: store.authReducer.user.EmployeeId,\r\n currentRoles: store.userRoleReducer.roles,\r\n paymentTerms: store.adminManageLookups.paymentTerms,\r\n resultAlert: store.dialogsReducer.alertDialogReducer.resultAlert,\r\n invoiceDates: store.adminManageLookups.invoiceDates,\r\n milestones: store.projectsReducer.Milestones.SOW,\r\n allRenewalStatuses: store.adminManageLookups.sowRenewalStatuses,\r\n SowRenewalStatuses: store.projectsReducer.SowRenewalStatuses,\r\n allRoles: store.projectsReducer.projectDetails.AllRoles,\r\n importContract: store.importContractReducer.contract,\r\n partialContract: store.importContractReducer.partialContract.contract,\r\n importedRoles: store.importContractReducer.contract.Roles,\r\n };\r\n },\r\n {\r\n loadManageDocumentTypes,\r\n getManagePaymentTerms,\r\n getMilestonesForSOW,\r\n setMilestonesForSOW,\r\n setComponent,\r\n resetComponent,\r\n loadSOWRenewalStatuses,\r\n getRenewalStatusesForSow,\r\n setRenewalStatusesForSow,\r\n cancelImport,\r\n getShadowingMilestones,\r\n resetShadowingMilestones,\r\n getEmployees,\r\n },\r\n)(SOWEditPage);\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport moment from 'moment';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport history from 'utils/history';\r\nimport {\r\n NON_BILLABLE_TRAINING,\r\n TIME_AND_MATERIAL,\r\n FINISHED,\r\n MONTH_AMOUNT_FOR_FIVE_YEARS,\r\n MILESTONE_BACKUP_USED_COLUMN_NAME,\r\n MILESTONE_INVOICE_AMOUNT_COLUMN_NAME,\r\n MILESTONE_INVOICED_DATE_COLUMN_NAME, MILESTONE_REMAINING_BALANCE_COLUMN_NAME, MILESTONE_APPROVED_COLUMN_NAME,\r\n} from 'utils/const-variable';\r\nimport { getStatusesForRequiredComment } from 'pages/projects/components/utils/createArrayWithStatusMatch';\r\nimport { EditAssociatedRoles } from 'pages/projects/components/edit-associated-roles/edit-associated-roles';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { editRole } from 'pages/projects/actions/roleModalActions';\r\nimport { addNewPO, editCurrentPO } from 'pages/projects/actions/contractsActions';\r\nimport { getCorrectDataForEditRole } from 'services/getCorrectDataForEditRole.js';\r\nimport {\r\n required, validateDate, complexRequired, validateMilestone,\r\n} from 'services/redux-form-validators.js';\r\nimport { getAllCheckedRolesAndEmployees } from 'utils/getAllCheckedRolesAndEmployees.js';\r\n\r\nimport renderTextField from '../components/text-field';\r\nimport renderSelect from '../components/select';\r\nimport renderDatePicker from '../components/date-picker';\r\nimport renderDocumentList from '../components/document-list';\r\nimport renderSearchDropdown from '../components/search-dropdown';\r\nimport renderMilestoneList from '../components/milestone-list';\r\nimport Button from '../components/button';\r\nimport { updateTheBiggestDateRange } from 'pages/projects/components/utils/getTheBiggestDateRangeForContracts';\r\nimport { getChangeConfigForPatchRequests, combinedConfigsForPatchRequests, getConfigBasedOnCheckedDates } from 'utils/getConfigBasedOnCheckedDates';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { addPoToPartialContract, cancelImport } from 'pages/projects/actions/importContractAction';\r\n\r\nimport '../redux-form.css';\r\nimport './project-edit-PO-form.css';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container edit-SOW__simple-container',\r\n label: 'redux-form__SOW--label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst validateApprover = (value, values, props, field) => {\r\n const condition = !(props.projectType && props.projectType.Name === NON_BILLABLE_TRAINING\r\n && props.SOWDetails && props.SOWDetails.Type && props.SOWDetails.Type.Name === TIME_AND_MATERIAL);\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst validateStatusComments = (value, values, props, field) => {\r\n const isMatchObject = { docStatus: values.Status && values.Status.Id, approveStatus: values.ApprovalStatus && values.ApprovalStatus.Id };\r\n const condition = !!getStatusesForRequiredComment(props.allStatuses, props.allApprovalStatuses).find((item) => !isObjectNotEquals(item, isMatchObject));\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst additionalConditionForContract = (role, StartDateContract, EndDateContract) => moment(role.StartDate).isSameOrAfter(StartDateContract, 'day')\r\n && moment(role.EndDate).isSameOrBefore(EndDateContract, 'day');\r\n\r\nclass ProjectEditPOForm extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n associatedRoles: [],\r\n showAssociatedRolesModal: false,\r\n isNeedToChangeDate: false,\r\n showEditDateConfirmDialog: false,\r\n messageForConfirmDialog: '',\r\n configPatchRequestsForConfirmDialog: null,\r\n importContractDatesCheck: [],\r\n };\r\n\r\n this.showAsterix = {\r\n Approver: () => {\r\n const { projectType, SOWDetails } = this.props;\r\n if (SOWDetails && projectType && SOWDetails.Type && SOWDetails.Type.Name) {\r\n return projectType.Name !== NON_BILLABLE_TRAINING || SOWDetails.Type.Name !== TIME_AND_MATERIAL;\r\n } return true;\r\n },\r\n StatusComments: () => {\r\n const {\r\n allStatuses, allApprovalStatuses, Status, ApprovalStatus,\r\n } = this.props;\r\n const isMatchObject = {\r\n docStatus: Status && Status.Id,\r\n approveStatus: ApprovalStatus && ApprovalStatus.Id,\r\n };\r\n return !!getStatusesForRequiredComment(allStatuses, allApprovalStatuses).find((item) => !isObjectNotEquals(item, isMatchObject));\r\n },\r\n };\r\n this.disable = {\r\n Approver: () => {\r\n const { Company } = this.props;\r\n return !Company;\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n data, initialize, importContract, POMain,\r\n } = this.props;\r\n initialize(data);\r\n const importContractDatesCheck = [];\r\n if (Object.keys(importContract).length) {\r\n const startDates = this.getStartDatesForDatePicker();\r\n const endDates = this.getEndDatesForDatePicker();\r\n const isNeedToChangeEndDate = data.EndDate && endDates.some(item => item.date && (new Date(item.date) < new Date(data.EndDate)));\r\n const isNeedToChangeStartDate = data.StartDate && startDates.some(item => item.date && (new Date(item.date) > new Date(data.StartDate)));\r\n if (isNeedToChangeEndDate) {\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: this.getStartDatesForDatePicker(), endDatesParentContracts: this.getEndDatesForDatePicker() },\r\n this.getTheBiggestRangeChildContractsDate(),\r\n new Date(data.EndDate),\r\n POMain ? 'PO Original' : 'PO Extension',\r\n false,\r\n false,\r\n new Date(data.EndDate),\r\n );\r\n config && importContractDatesCheck.push(config);\r\n }\r\n if (isNeedToChangeStartDate) {\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: this.getStartDatesForDatePicker(), endDatesParentContracts: this.getEndDatesForDatePicker() },\r\n this.getTheBiggestRangeChildContractsDate(),\r\n new Date(data.StartDate),\r\n POMain ? 'PO Original' : 'PO Extension',\r\n true,\r\n false,\r\n new Date(data.StartDate),\r\n );\r\n config && importContractDatesCheck.push(config);\r\n }\r\n }\r\n this.setState({\r\n importContractDatesCheck,\r\n });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n configPatchRequestsForConfirmDialog, isNeedToChangeDate, importContractDatesCheck, showEditDateConfirmDialog,\r\n } = this.state;\r\n const {\r\n StartDate, EndDate, data: { Milestones: existMilestones }, Milestones, change, showAlertDialog,\r\n } = this.props;\r\n if (!prevProps.data.Milestones.length && JSON.stringify(prevProps.data.Milestones) !== JSON.stringify(existMilestones)) {\r\n change('Milestones', existMilestones);\r\n }\r\n if (importContractDatesCheck.length && !showEditDateConfirmDialog) {\r\n this.showEditDateConfirmDialog(importContractDatesCheck.at(-1));\r\n this.setState({\r\n importContractDatesCheck: importContractDatesCheck.slice(0, -1),\r\n });\r\n }\r\n if (prevProps.StartDate !== StartDate || prevProps.EndDate !== EndDate) {\r\n const isStartDateChanged = prevProps.StartDate !== StartDate;\r\n const isEndDateChanged = prevProps.EndDate !== EndDate;\r\n const endDateForMilestones = EndDate || moment(StartDate).clone().add(MONTH_AMOUNT_FOR_FIVE_YEARS, 'months').format();\r\n const milestonesOutOfRange = Milestones.filter(milestone => {\r\n if (!milestone.Milestone) {\r\n return false;\r\n }\r\n return ((isStartDateChanged\r\n && StartDate && !moment(moment(StartDate).startOf('month').format()).isBefore(moment(milestone.Milestone, 'MMMM, YYYY').days(15).format()))\r\n || (isEndDateChanged\r\n && endDateForMilestones\r\n && !moment(moment(endDateForMilestones).endOf('month').format()).isAfter(moment(milestone.Milestone, 'MMMM, YYYY').days(15).format())));\r\n });\r\n if (milestonesOutOfRange.length) {\r\n showAlertDialog(`${moment(milestonesOutOfRange[0].Milestone).format('MMMM YYYY')} milestone is out of range. Please, delete it first.`);\r\n isStartDateChanged && change('StartDate', null);\r\n isEndDateChanged && change('EndDate', null);\r\n this.setState({\r\n showEditDateConfirmDialog: false,\r\n });\r\n }\r\n if (!EndDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'endDate'),\r\n });\r\n }\r\n if (!StartDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'startDate'),\r\n });\r\n }\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { destroy } = this.props;\r\n destroy();\r\n }\r\n\r\n onChange = (data, value, prevValue, field) => {\r\n const { change } = this.props;\r\n\r\n switch (field) {\r\n case 'Company':\r\n change('Approver', '');\r\n break;\r\n default: break;\r\n }\r\n }\r\n\r\n checkForAssociatedRoles = () => {\r\n const {\r\n StartDate, EndDate, initial, isOnlyActiveRoles, SOWDetails, Status,\r\n } = this.props;\r\n if (initial.Status && initial.Status.Id !== Status.Id && Status.Name === FINISHED) {\r\n this.changeAssociatedPORoleStatus();\r\n return false;\r\n }\r\n if (initial.StartDate !== StartDate || initial.EndDate !== EndDate) {\r\n this.changeAssociatePORolesDate();\r\n return false;\r\n }\r\n this.editPO(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n changeAssociatedPORoleStatus = () => {\r\n const {\r\n RolesForContarct, Id, isOnlyActiveRoles, SOWDetails,\r\n } = this.props;\r\n const associatedRoles = RolesForContarct.filter(role => role.SowPoId === Id);\r\n const allCheckedRolesAndEmployees = getAllCheckedRolesAndEmployees(associatedRoles);\r\n if (allCheckedRolesAndEmployees.length) {\r\n this.setState({\r\n associatedRoles: allCheckedRolesAndEmployees,\r\n showAssociatedRolesModal: true,\r\n });\r\n return false;\r\n }\r\n this.editPO(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n changeAssociatePORolesDate = () => {\r\n const {\r\n RolesForContarct, Id, isOnlyActiveRoles, SOWDetails, StartDate, EndDate,\r\n } = this.props;\r\n const associatedRoles = RolesForContarct.filter(role => role.SowPoId === Id);\r\n const checkedRoles = associatedRoles.reduce((roles, role) => {\r\n const rolesWithCheckedEmployees = role.Employees.reduce((employees, employee) => {\r\n employees.push({\r\n ...employee,\r\n checked: employee.Status.Name !== 'Removed',\r\n disabledItem: employee.Status.Name === 'Removed' || !additionalConditionForContract(employee, StartDate, EndDate),\r\n });\r\n return employees;\r\n }, []);\r\n roles.push({\r\n ...role,\r\n checked: role.Status.Name !== 'Removed',\r\n Employees: [...rolesWithCheckedEmployees],\r\n disabledItem: role.Status.Name === 'Removed' || !additionalConditionForContract(role, StartDate, EndDate),\r\n });\r\n return roles;\r\n }, []);\r\n if (checkedRoles.length) {\r\n this.setState({\r\n associatedRoles: checkedRoles,\r\n showAssociatedRolesModal: true,\r\n });\r\n return false;\r\n }\r\n this.editPO(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n closeAssociatedRolesModal = () => {\r\n this.setState({ showAssociatedRolesModal: false });\r\n }\r\n\r\n applyAssociatedRoles = (roles) => {\r\n const {\r\n StartDate, EndDate, isOnlyActiveRoles, editRole, SOWDetails, Status, initial,\r\n } = this.props;\r\n if (roles.length) {\r\n const checkedRoles = roles.filter(role => role.checked);\r\n if (checkedRoles.length) {\r\n const startDateForUpdateRoles = !moment(StartDate).isSame(initial.StartDate) ? StartDate : null;\r\n const endDateForUpdateRoles = !moment(EndDate).isSame(initial.EndDate) ? EndDate : null;\r\n const rolesToUpdate = getCorrectDataForEditRole(checkedRoles, startDateForUpdateRoles, endDateForUpdateRoles, Status, SOWDetails.Project.Id);\r\n rolesToUpdate.forEach(role => editRole(role, !isOnlyActiveRoles));\r\n }\r\n }\r\n this.closeAssociatedRolesModal();\r\n this.editPO(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n applyForm = () => {\r\n const {\r\n Id, isOnlyActiveRoles, SOWDetails, POMain, cancelContractImport, importContract,\r\n } = this.props;\r\n const POMainId = POMain && POMain.Id;\r\n Id ? this.checkForAssociatedRoles() : this.addPO(SOWDetails.Project.Id, SOWDetails.Id, POMainId, !isOnlyActiveRoles);\r\n Object.keys(importContract).length && cancelContractImport(SOWDetails.Project.Id);\r\n }\r\n\r\n addPO = (projectId, SOWId, POMainId, isOnlyActiveRoles) => {\r\n const { addPO } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n addPO(projectId, SOWId, POMainId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n history.push({\r\n pathname: `/projects/${projectId}`,\r\n });\r\n }\r\n\r\n editPO = (projectId, SOWId, isOnlyActiveRoles) => {\r\n const { editPO, POMain, location } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n const saveCallback = (location.state && location.state.saveCallback) || `/projects/${projectId}`;\r\n\r\n editPO(\r\n projectId,\r\n SOWId,\r\n isOnlyActiveRoles,\r\n isNeedToChangeDate,\r\n configPatchRequestsForConfirmDialog,\r\n !POMain,\r\n saveCallback,\r\n );\r\n }\r\n\r\n addNewMilestone = (milestones) => {\r\n const { change } = this.props;\r\n change('Milestones', milestones);\r\n }\r\n\r\n closeEditProjectEndDateConfirmDialog = () => {\r\n const { change } = this.props;\r\n const { typeDateForDeleteIfUserCloseConfirmationDialog } = this.state;\r\n this.setState({\r\n showEditDateConfirmDialog: false,\r\n });\r\n change(typeDateForDeleteIfUserCloseConfirmationDialog, null);\r\n }\r\n\r\n showEditDateConfirmDialog = (configForConfirmDialog) => {\r\n const { configPatchRequestsForConfirmDialog } = this.state;\r\n this.setState({\r\n showEditDateConfirmDialog: true,\r\n messageForConfirmDialog: configForConfirmDialog.message,\r\n typeDateForDeleteIfUserCloseConfirmationDialog: configForConfirmDialog.typeChangedDate,\r\n configPatchRequestsForConfirmDialog:\r\n combinedConfigsForPatchRequests(configForConfirmDialog.configForPatchRequests, configPatchRequestsForConfirmDialog),\r\n });\r\n }\r\n\r\n onConfirmEditProjectEndDateDialog = () => {\r\n const {\r\n showAlertDialog, RolesForContarct, POMain, SOWDetails,\r\n } = this.props;\r\n const isRolesUnderParentContract = RolesForContarct.some((role) => role.SowPoId === SOWDetails.Id || (POMain && role.SowPoId === POMain.Id));\r\n this.setState({\r\n isNeedToChangeDate: true,\r\n showEditDateConfirmDialog: false,\r\n }, () => {\r\n isRolesUnderParentContract && showAlertDialog('Please note that Role and Employee dates will not be updated in parent contracts ');\r\n });\r\n }\r\n\r\n getStartDatesForDatePicker = () => {\r\n const { SOWDetails, POMain, projectStartDate } = this.props;\r\n return POMain ? [{ date: projectStartDate, type: 'Project', id: SOWDetails.Project.Id },\r\n {\r\n date: SOWDetails.StartDate, type: 'SOW', id: SOWDetails.Id, projectId: SOWDetails.Project.Id,\r\n },\r\n {\r\n date: POMain.StartDate, type: 'PO Original', id: POMain.Id, projectId: SOWDetails.Project.Id, SOWId: SOWDetails.Id,\r\n }]\r\n : [{ date: projectStartDate, type: 'Project', id: SOWDetails.Project.Id },\r\n {\r\n date: SOWDetails.StartDate, type: 'SOW', id: SOWDetails.Id, projectId: SOWDetails.Project.Id,\r\n },\r\n ];\r\n }\r\n\r\n getEndDatesForDatePicker = () => {\r\n const { SOWDetails, projectEndDate, POMain } = this.props;\r\n return POMain ? [{ date: projectEndDate, type: 'Project', id: SOWDetails.Project.Id },\r\n {\r\n date: SOWDetails.EndDate, type: 'SOW', id: SOWDetails.Id, projectId: SOWDetails.Project.Id,\r\n },\r\n {\r\n date: POMain.EndDate, type: 'PO Original', id: POMain.Id, projectId: SOWDetails.Project.Id, SOWId: SOWDetails.Id,\r\n }]\r\n : [{ date: projectEndDate, type: 'Project', id: SOWDetails.Project.Id },\r\n {\r\n date: SOWDetails.EndDate, type: 'SOW', id: SOWDetails.Id, projectId: SOWDetails.Project.Id,\r\n },\r\n ];\r\n }\r\n\r\n getTheBiggestRangeChildContractsDate = () => {\r\n const { POMain, SOWDetails, Id } = this.props;\r\n const childContractForPO = SOWDetails.POs.filter((po) => !POMain && po.Id !== Id);\r\n const theBiggestDateRange = childContractForPO.length && {\r\n forStartDate: { contract: childContractForPO[0], type: 'POs' },\r\n forEndDate: { contract: childContractForPO[0], type: 'POs' },\r\n };\r\n childContractForPO.forEach((PO) => updateTheBiggestDateRange({ contract: PO, type: 'POs' }, theBiggestDateRange));\r\n return theBiggestDateRange;\r\n }\r\n\r\nonSaveAndCreateRoles = () => {\r\n const {\r\n addImportPo, SOWDetails, POMain, isOnlyActiveRoles,\r\n } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n const POMainId = POMain && POMain.Id;\r\n addImportPo(SOWDetails.Project.Id, SOWDetails.Id, POMainId, !isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n}\r\n\r\nonCancelClick = () => {\r\n const { cancelContractImport, SOWDetails } = this.props;\r\n cancelContractImport(SOWDetails.Project.Id);\r\n}\r\n\r\nrender() {\r\n const {\r\n showAssociatedRolesModal, associatedRoles, showEditDateConfirmDialog, messageForConfirmDialog,\r\n } = this.state;\r\n const {\r\n disabled, allApprovalStatuses, allClients, allApprovers, allStatuses, columnsToDisplay, viewFinancialInfo, allDocumentTypes, Contract,\r\n ApprovalStatus, Company, Approver, BillingCode, StartDate, EndDate, Status, Links, formErrors,\r\n BudgetComments, handleSubmit, StatusComments, allPaymentTerms, PaymentTerm, SOWDetails, data, showAlertDialog, projectEndDate,\r\n Milestones, invoiceDates, Id, currencyProject, allRolesForContract, importRoles, InvoiceDate,\r\n } = this.props;\r\n const isPoOriginal = data.Type === 'Original' || !(SOWDetails && SOWDetails.POs.length);\r\n const currentPOStatusTitle = isPoOriginal ? 'PO Original' : 'PO Extension';\r\n const isSOWTypeActualTime = SOWDetails.Type && SOWDetails.Type.Name === TIME_AND_MATERIAL;\r\n const milestonesListColumnsToDisplay = columnsToDisplay\r\n .milestonesList.filter((column) => (!isSOWTypeActualTime || column.Name !== MILESTONE_BACKUP_USED_COLUMN_NAME)\r\n && (isPoOriginal || (\r\n column.Name !== MILESTONE_INVOICE_AMOUNT_COLUMN_NAME\r\n && column.Name !== MILESTONE_INVOICED_DATE_COLUMN_NAME\r\n && column.Name !== MILESTONE_REMAINING_BALANCE_COLUMN_NAME\r\n && column.Name !== MILESTONE_APPROVED_COLUMN_NAME)));\r\n\r\n return (\r\n \r\n );\r\n}\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('projectEditPOForm', data)),\r\n destroy: () => dispatch(destroy('projectEditPOForm')),\r\n change: (field, value) => dispatch(change('projectEditPOForm', field, value)),\r\n addPO: (projectId, SOWId, POMainId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => {\r\n return dispatch(addNewPO(projectId, SOWId, POMainId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog));\r\n },\r\n editPO: (projectId, SOWId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, isOriginal, saveCallback) => {\r\n return dispatch(editCurrentPO(\r\n projectId,\r\n SOWId,\r\n isOnlyActiveRoles,\r\n isNeedToChangeDate,\r\n configPatchRequestsForConfirmDialog,\r\n isOriginal,\r\n saveCallback,\r\n ));\r\n },\r\n editRole: (role, isOnlyActiveRoles) => dispatch(editRole(role, isOnlyActiveRoles)),\r\n showAlertDialog: (message) => dispatch(showAlertDialog(message)),\r\n addImportPo: (ProjectId, SOWDetailsId, POMainId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => (\r\n dispatch(addPoToPartialContract(ProjectId, SOWDetailsId, POMainId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog))),\r\n cancelContractImport: (id) => dispatch(cancelImport(id)),\r\n\r\n };\r\n};\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.projectEditPOForm && state.form.projectEditPOForm.values;\r\n return {\r\n Id: isFormReducerExists && state.form.projectEditPOForm.values.Id,\r\n Contract: isFormReducerExists && state.form.projectEditPOForm.values.Contract,\r\n ApprovalStatus: isFormReducerExists && state.form.projectEditPOForm.values.ApprovalStatus,\r\n BillingCode: isFormReducerExists && state.form.projectEditPOForm.values.BillingCode,\r\n StartDate: isFormReducerExists && state.form.projectEditPOForm.values.StartDate,\r\n EndDate: isFormReducerExists && state.form.projectEditPOForm.values.EndDate,\r\n Company: isFormReducerExists && state.form.projectEditPOForm.values.Company,\r\n Approver: isFormReducerExists && state.form.projectEditPOForm.values.Approver,\r\n Status: isFormReducerExists && state.form.projectEditPOForm.values.Status,\r\n PaymentTerm: isFormReducerExists && state.form.projectEditPOForm.values.PaymentTerm,\r\n StatusComments: isFormReducerExists && state.form.projectEditPOForm.values.StatusComments,\r\n BudgetComments: isFormReducerExists && state.form.projectEditPOForm.values.BudgetComments,\r\n Links: isFormReducerExists && state.form.projectEditPOForm.values.Links,\r\n Milestones: isFormReducerExists && state.form.projectEditPOForm.values.Milestones,\r\n InvoiceDate: isFormReducerExists && state.form.projectEditPOForm.values.InvoiceDate,\r\n formErrors: isFormReducerExists && state.form.projectEditPOForm.syncErrors,\r\n initial: isFormReducerExists && state.form.projectEditPOForm.initial,\r\n isOnlyActiveRoles: state.showRoles.isOnlyActiveRoles,\r\n projectEndDate: state.projectsReducer.projectDetails.EndDate,\r\n projectStartDate: state.projectsReducer.projectDetails.StartDate,\r\n projectId: state.projectsReducer.projectDetails.Id,\r\n importRoles: state.importContractReducer.contract.Roles,\r\n importContract: state.importContractReducer.contract,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'projectEditPOForm',\r\n})(ProjectEditPOForm));\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport './PO-edit-page.css';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { loadManageDocumentTypes } from 'pages/admin/actions/adminManageDocumentTypes';\r\nimport { getManagePaymentTerms } from 'pages/admin/actions/adminManagePaymentTerms';\r\nimport { getMilestonesForPO, setMilestonesForPO } from 'pages/projects/actions/projectsActions';\r\nimport ProjectEditPOForm from 'common/components/redux-form/project-edit-PO-form/project-edit-PO-form';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport { cancelImport } from 'pages/projects/actions/importContractAction';\r\nimport { convertMilestones } from 'utils/convertMilestones';\r\nimport { formatContractDate } from '../../utils/formatContractDate';\r\n\r\nexport class POEditPage extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const {\r\n projectDetails, location: locationProps, ManageProjectContracts, HasFinancialAccess,\r\n } = this.props;\r\n\r\n // eslint-disable-next-line prefer-destructuring\r\n this.location = history.location.pathname.split('/')[3];\r\n this.Id = history.location.pathname.split('/')[4] || '';\r\n this.SOWId = this.location === 'add-po' ? history.location.pathname.split('/')[4] : '';\r\n\r\n let SOWDetails,\r\n PODetails,\r\n POMain,\r\n formTitle;\r\n switch (this.location) {\r\n case 'add-po':\r\n SOWDetails = projectDetails && projectDetails.Contracts.find(sow => sow.Id === this.SOWId);\r\n POMain = SOWDetails && SOWDetails.POs.find(po => po.Type === 'Original');\r\n formTitle = POMain ? 'Add PO extension for PO Original ' : 'Add original PO for SOW ';\r\n break;\r\n case 'edit-po':\r\n case 'view-po':\r\n SOWDetails = projectDetails && projectDetails.Contracts.find(sow => sow.POs.some(po => po.Id === this.Id));\r\n PODetails = SOWDetails && SOWDetails.POs.find(po => po.Id === this.Id);\r\n POMain = SOWDetails && SOWDetails.POs.find(po => po.Type === 'Original' && po.Id !== PODetails.Id);\r\n formTitle = 'Edit PO for SOW ';\r\n break;\r\n default: break;\r\n }\r\n\r\n this.state = {\r\n columnsToDisplay: {\r\n documentsList: [\r\n {\r\n Name: 'Documents Links', isSelected: true, Id: 'Comment', className: 'without-width-col', pressArrowLeft: true,\r\n },\r\n {\r\n Name: 'Documents Types', isType: true, Id: 'DocumentType', className: 'without-width-col', pressArrowLeft: true,\r\n },\r\n ],\r\n milestonesList: [\r\n {\r\n Name: 'Milestone', Id: 'Milestone', className: 'without-width-col', isRequired: true,\r\n },\r\n {\r\n Name: 'Milestone Amount', Id: 'MilestoneAmount', className: 'without-width-col', isRequired: true,\r\n },\r\n {\r\n Name: 'Invoice Amount', Id: 'InvoicedAmount', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Revenue Received', Id: 'RevenueReceived', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Invoiced Date', Id: 'InvoicedDate', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Delta to Goal', Id: 'RemainingBalance', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Approved', Id: 'Approved', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Backup used', Id: 'UsedAssignmentBackupUser', className: 'without-width-col',\r\n },\r\n ],\r\n },\r\n ManageProjectContracts,\r\n HasFinancialAccess,\r\n SOWDetails,\r\n PODetails,\r\n POMain,\r\n formTitle,\r\n };\r\n\r\n // eslint-disable-next-line prefer-destructuring\r\n this.emptyForm = {\r\n ApprovalStatus: {},\r\n Approver: '',\r\n BillingCode: '',\r\n Budget: '',\r\n BudgetComments: '',\r\n Contract: '',\r\n EndDate: null,\r\n Id: '',\r\n Links: [],\r\n Milestones: [],\r\n RealizedRevenue: '',\r\n StartDate: null,\r\n Status: {},\r\n StatusComments: '',\r\n Type: '',\r\n Company: '',\r\n PaymentTerm: '',\r\n };\r\n !projectDetails && history.push({\r\n pathname: `/projects/${history.location.pathname.split('/')[2]}`,\r\n state: locationProps.state,\r\n });\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n projectDetails, location, loadManageDocumentTypes, getManagePaymentTerms, getMilestonesForPO,\r\n setComponent, HasFinancialAccess,\r\n } = this.props;\r\n\r\n const { POMain } = this.state;\r\n\r\n !projectDetails.Name && history.goBack({ state: location.state });\r\n this.defineRightsForEdit();\r\n loadManageDocumentTypes();\r\n getManagePaymentTerms();\r\n if (HasFinancialAccess) {\r\n this.Id && !this.SOWId && getMilestonesForPO(this.Id, projectDetails.Id, this.getSOWId(), !POMain);\r\n }\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n setComponent({\r\n returnButton: { text: rightPath, goToPreviousPage: this.goTyMainList },\r\n secondReturnButton: { text: `${projectDetails && projectDetails.Name} details`, goToPreviousPage: this.goToProjectDetails },\r\n });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { setMilestonesForPO, resetComponent } = this.props;\r\n const emptyArray = [];\r\n setMilestonesForPO(emptyArray);\r\n resetComponent();\r\n }\r\n\r\n defineRightsForEdit = () => {\r\n if (this.location === 'add-po') {\r\n this.setState({\r\n HasFinancialAccess: true,\r\n });\r\n }\r\n }\r\n\r\n goTyMainList = () => {\r\n const { location } = this.props;\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n history.push({ pathname: `/${rightPath}`, state: location.state });\r\n }\r\n\r\n goToProjectDetails = () => {\r\n const {\r\n projectDetails, location, cancelImport,\r\n } = this.props;\r\n const SOWDetails = projectDetails.Contracts.find(sow => sow.Id === this.SOWId);\r\n\r\n SOWDetails && SOWDetails.Project && cancelImport(SOWDetails.Project.Id);\r\n history.push({ pathname: `/projects/${projectDetails.Id}`, state: location.state });\r\n }\r\n\r\n getSOWId = () => {\r\n const { projectDetails } = this.props;\r\n const SOWDetails = projectDetails && projectDetails.Contracts.find(sow => sow.POs.some(amendment => amendment.Id === this.Id));\r\n return this.SOWId || SOWDetails.Id;\r\n }\r\n\r\n render() {\r\n const {\r\n columnsToDisplay,\r\n ManageProjectContracts,\r\n HasFinancialAccess,\r\n SOWDetails,\r\n PODetails,\r\n POMain,\r\n formTitle,\r\n } = this.state;\r\n const {\r\n projectDetails,\r\n approvalStatuses,\r\n clients,\r\n clientContacts,\r\n documentStatuses,\r\n location,\r\n documentTypes,\r\n paymentTerms,\r\n invoiceDates,\r\n milestones,\r\n allRoles,\r\n importContract,\r\n } = this.props;\r\n\r\n const POOriginalBillingCode = PODetails && PODetails.BillingCode;\r\n const arrayMilestones = importContract && importContract.Milestones ? convertMilestones(importContract.Milestones) : convertMilestones(milestones);\r\n return (\r\n \r\n {formTitle}\r\n \r\n {SOWDetails && SOWDetails.Contract}\r\n \r\n
\r\n \r\n \r\n item.Id === importContract.ApprovalStatus) || {},\r\n Status: documentStatuses.find(item => item.Id === importContract.DocumentStatus) || {},\r\n PaymentTerm: importContract.PaymentTerm || paymentTerms.find(item => item.Id === importContract.PaymentTermId) || '',\r\n } : {\r\n ...this.emptyForm,\r\n Company: SOWDetails && SOWDetails.Company && SOWDetails.Company.Id,\r\n Approver: SOWDetails && SOWDetails.Approver && SOWDetails.Approver.Id,\r\n BillingCode: SOWDetails && SOWDetails.BillingCode,\r\n }}\r\n SOWDetails={SOWDetails}\r\n POMain={POMain}\r\n POBillingCode={POOriginalBillingCode}\r\n disabled={!ManageProjectContracts}\r\n viewFinancialInfo={HasFinancialAccess}\r\n allApprovalStatuses={sortFilterList(approvalStatuses)}\r\n allClients={sortFilterList(clients)}\r\n allApprovers={sortFilterList(clientContacts)}\r\n allStatuses={sortFilterList(documentStatuses)}\r\n allDocumentTypes={sortFilterList(documentTypes)}\r\n RolesForContarct={projectDetails.Roles}\r\n allRolesForContract={allRoles}\r\n allPaymentTerms={paymentTerms}\r\n currencyProject={projectDetails && projectDetails.Currency && projectDetails.Currency.Name}\r\n projectType={projectDetails && projectDetails.Billability}\r\n columnsToDisplay={columnsToDisplay}\r\n location={location}\r\n invoiceDates={invoiceDates}\r\n />\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nPOEditPage.propTypes = {\r\n projectDetails: PropTypes.object,\r\n approvalStatuses: PropTypes.array,\r\n clientContacts: PropTypes.array,\r\n documentStatuses: PropTypes.array,\r\n clients: PropTypes.array,\r\n loadManageDocumentTypes: PropTypes.func,\r\n};\r\n\r\nexport default connect(store => ({\r\n projectDetails: store.projectsReducer.projectDetails,\r\n clients: store.projectsReducer.clients,\r\n approvalStatuses: store.projectsReducer.approvalStatuses,\r\n clientContacts: store.projectsReducer.clientContacts,\r\n documentStatuses: store.filtersReducer.filters.documentStatuses,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n UserOfficeId: store.authReducer.user.UserOfficeId,\r\n Offices: store.projectsReducer.projectDetails.Offices,\r\n documentTypes: store.adminManageLookups.documentTypes,\r\n invoiceDates: store.adminManageLookups.invoiceDates,\r\n paymentTerms: store.adminManageLookups.paymentTerms,\r\n milestones: store.projectsReducer.Milestones.PO,\r\n allRoles: store.projectsReducer.projectDetails.AllRoles,\r\n importContract: store.importContractReducer.contract,\r\n\r\n}), {\r\n loadManageDocumentTypes,\r\n getManagePaymentTerms,\r\n getMilestonesForPO,\r\n setMilestonesForPO,\r\n setComponent,\r\n resetComponent,\r\n cancelImport,\r\n})(POEditPage);\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport moment from 'moment';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport history from 'utils/history';\r\nimport {\r\n NON_BILLABLE_TRAINING, TIME_AND_MATERIAL, FINISHED, MONTH_AMOUNT_FOR_FIVE_YEARS, MILESTONE_BACKUP_USED_COLUMN_NAME,\r\n} from 'utils/const-variable';\r\nimport { getStatusesForRequiredComment } from 'pages/projects/components/utils/createArrayWithStatusMatch';\r\nimport { EditAssociatedRoles } from 'pages/projects/components/edit-associated-roles/edit-associated-roles';\r\nimport { editRole } from 'pages/projects/actions/roleModalActions';\r\nimport { addNewAmendment, editCurrentAmendment } from 'pages/projects/actions/contractsActions';\r\nimport { getCorrectDataForEditRole } from 'services/getCorrectDataForEditRole.js';\r\nimport {\r\n required, validateDate, complexRequired, validateMilestone,\r\n} from 'services/redux-form-validators.js';\r\nimport { getAllCheckedRolesAndEmployees } from 'utils/getAllCheckedRolesAndEmployees.js';\r\n\r\nimport renderMilestoneList from '../components/milestone-list';\r\nimport renderTextField from '../components/text-field';\r\nimport renderSelect from '../components/select';\r\nimport renderDatePicker from '../components/date-picker';\r\nimport renderDocumentList from '../components/document-list';\r\nimport renderSearchDropdown from '../components/search-dropdown';\r\nimport Button from '../components/button';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { getChangeConfigForPatchRequests, combinedConfigsForPatchRequests, getConfigBasedOnCheckedDates } from 'utils/getConfigBasedOnCheckedDates';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { addAmendmentToPartialContract, cancelImport } from 'pages/projects/actions/importContractAction';\r\n\r\nimport '../redux-form.css';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container edit-SOW__simple-container',\r\n label: 'redux-form__SOW--label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst validateApprover = (value, values, props, field) => {\r\n const condition = !(props.projectType && props.projectType.Name === NON_BILLABLE_TRAINING\r\n && props.SOWDetails && props.SOWDetails.Type && props.SOWDetails.Type.Name === TIME_AND_MATERIAL);\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst validateStatusComments = (value, values, props, field) => {\r\n const isMatchObject = { docStatus: values.Status && values.Status.Id, approveStatus: values.ApprovalStatus && values.ApprovalStatus.Id };\r\n const condition = !!getStatusesForRequiredComment(props.allStatuses, props.allApprovalStatuses).find((item) => !isObjectNotEquals(item, isMatchObject));\r\n return complexRequired(value, values, props, field, condition);\r\n};\r\n\r\nconst additionalConditionForContract = (role, StartDateContract, EndDateContract) => moment(role.StartDate).isSameOrAfter(StartDateContract, 'day')\r\n && moment(role.EndDate).isSameOrBefore(EndDateContract, 'day');\r\n\r\nclass ProjectEditAmendmentForm extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n associatedRoles: [],\r\n showAssociatedRolesModal: false,\r\n isNeedToChangeDate: false,\r\n showConfirmationDialog: false,\r\n messageForConfirmDialog: '',\r\n configPatchRequestsForConfirmDialog: null,\r\n importContractDatesCheck: [],\r\n };\r\n\r\n this.showAsterix = {\r\n Approver: () => {\r\n const { projectType, SOWDetails } = this.props;\r\n if (SOWDetails && projectType && SOWDetails.Type && SOWDetails.Type.Name) {\r\n return projectType.Name !== NON_BILLABLE_TRAINING || SOWDetails.Type.Name !== TIME_AND_MATERIAL;\r\n } return true;\r\n },\r\n StatusComments: () => {\r\n const {\r\n allStatuses, allApprovalStatuses, Status, ApprovalStatus,\r\n } = this.props;\r\n const isMatchObject = {\r\n docStatus: Status && Status.Id,\r\n approveStatus: ApprovalStatus && ApprovalStatus.Id,\r\n };\r\n return !!getStatusesForRequiredComment(allStatuses, allApprovalStatuses).find((item) => !isObjectNotEquals(item, isMatchObject));\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n data, initialize, importContract,\r\n } = this.props;\r\n initialize(data);\r\n const importContractDatesCheck = [];\r\n if (Object.keys(importContract).length) {\r\n const startDates = this.getStartDatesForDatePicker();\r\n const endDates = this.getEndDatesForDatePicker();\r\n const isNeedToChangeEndDate = data.EndDate && endDates.some(item => item.date && (new Date(item.date) < new Date(data.EndDate)));\r\n const isNeedToChangeStartDate = data.StartDate && startDates.some(item => item.date && (new Date(item.date) > new Date(data.StartDate)));\r\n if (isNeedToChangeEndDate) {\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: this.getStartDatesForDatePicker(), endDatesParentContracts: this.getEndDatesForDatePicker() },\r\n null,\r\n new Date(data.EndDate),\r\n 'Amendment',\r\n false,\r\n false,\r\n new Date(data.EndDate),\r\n );\r\n config && importContractDatesCheck.push(config);\r\n }\r\n if (isNeedToChangeStartDate) {\r\n const config = getConfigBasedOnCheckedDates(\r\n { startDatesParentContracts: this.getStartDatesForDatePicker(), endDatesParentContracts: this.getEndDatesForDatePicker() },\r\n null,\r\n new Date(data.StartDate),\r\n 'Amendment',\r\n true,\r\n false,\r\n new Date(data.StartDate),\r\n );\r\n config && importContractDatesCheck.push(config);\r\n }\r\n }\r\n this.setState({\r\n importContractDatesCheck,\r\n });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n configPatchRequestsForConfirmDialog, isNeedToChangeDate, importContractDatesCheck, showConfirmationDialog,\r\n } = this.state;\r\n const {\r\n data: { Milestones: existMilestones }, Milestones, change, StartDate, EndDate, showAlertDialog,\r\n } = this.props;\r\n if (!prevProps.data.Milestones.length && JSON.stringify(prevProps.data.Milestones) !== JSON.stringify(existMilestones)) {\r\n change('Milestones', existMilestones);\r\n }\r\n if (importContractDatesCheck.length && !showConfirmationDialog) {\r\n this.showConfirmationDialog(importContractDatesCheck.at(-1));\r\n this.setState({\r\n importContractDatesCheck: importContractDatesCheck.slice(0, -1),\r\n });\r\n }\r\n if (prevProps.StartDate !== StartDate || prevProps.EndDate !== EndDate) {\r\n const isStartDateChanged = prevProps.StartDate !== StartDate;\r\n const isEndDateChanged = prevProps.EndDate !== EndDate;\r\n const endDateForMilestones = EndDate || moment(StartDate).clone().add(MONTH_AMOUNT_FOR_FIVE_YEARS, 'months').format();\r\n const milestonesOutOfRange = Milestones.filter(milestone => {\r\n return ((isStartDateChanged\r\n && StartDate && !moment(moment(StartDate).startOf('month').format()).isBefore(moment(milestone.Milestone, 'MMMM, YYYY').days(15).format()))\r\n || (isEndDateChanged\r\n && endDateForMilestones\r\n && !moment(moment(endDateForMilestones).endOf('month').format()).isAfter(moment(milestone.Milestone, 'MMMM, YYYY').days(15).format())));\r\n });\r\n if (milestonesOutOfRange.length) {\r\n showAlertDialog(`${moment(milestonesOutOfRange[0].Milestone).format('MMMM YYYY')} milestone is out of range. Please, delete it first.`);\r\n isStartDateChanged && change('StartDate', null);\r\n isEndDateChanged && change('EndDate', null);\r\n }\r\n if (!EndDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'endDate'),\r\n });\r\n }\r\n if (!StartDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'startDate'),\r\n });\r\n }\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { destroy } = this.props;\r\n destroy();\r\n }\r\n\r\n onChange = (data, value, prevValue, field) => {\r\n const { change } = this.props;\r\n\r\n switch (field) {\r\n case 'Company':\r\n change('Approver', '');\r\n break;\r\n default: break;\r\n }\r\n }\r\n\r\n checkForAssociatedRoles = () => {\r\n const {\r\n StartDate, EndDate, initial, isOnlyActiveRoles, SOWDetails, Status,\r\n } = this.props;\r\n if (initial.Status && initial.Status.Id !== Status.Id && Status.Name === FINISHED) {\r\n this.changeAssociatedPORoleStatus();\r\n return false;\r\n }\r\n if (initial.StartDate !== StartDate || initial.EndDate !== EndDate) {\r\n this.changeAssociatePORolesDate();\r\n return false;\r\n }\r\n this.editAmendment(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n changeAssociatedPORoleStatus = () => {\r\n const {\r\n RolesForContarct, Id, isOnlyActiveRoles, SOWDetails,\r\n } = this.props;\r\n const associatedRoles = RolesForContarct.filter(role => role.SowPoId === Id);\r\n const allCheckedRolesAndEmployees = getAllCheckedRolesAndEmployees(associatedRoles);\r\n if (allCheckedRolesAndEmployees.length) {\r\n this.setState({\r\n associatedRoles: allCheckedRolesAndEmployees,\r\n showAssociatedRolesModal: true,\r\n });\r\n return false;\r\n }\r\n this.editAmendment(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n changeAssociatePORolesDate = () => {\r\n const {\r\n RolesForContarct, Id, isOnlyActiveRoles, SOWDetails, StartDate, EndDate,\r\n } = this.props;\r\n const associatedRoles = RolesForContarct.filter(role => role.SowPoId === Id);\r\n const checkedRoles = associatedRoles.reduce((roles, role) => {\r\n const rolesWithCheckedEmployees = role.Employees.reduce((employees, employee) => {\r\n employees.push({\r\n ...employee,\r\n checked: employee.Status.Name !== 'Removed',\r\n disabledItem: employee.Status.Name === 'Removed' || !additionalConditionForContract(employee, StartDate, EndDate),\r\n });\r\n return employees;\r\n }, []);\r\n roles.push({\r\n ...role,\r\n checked: role.Status.Name !== 'Removed',\r\n Employees: [...rolesWithCheckedEmployees],\r\n disabledItem: role.Status.Name === 'Removed' || !additionalConditionForContract(role, StartDate, EndDate),\r\n });\r\n return roles;\r\n }, []);\r\n if (checkedRoles.length) {\r\n this.setState({\r\n associatedRoles: checkedRoles,\r\n showAssociatedRolesModal: true,\r\n });\r\n return false;\r\n }\r\n this.editAmendment(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n closeAssociatedRolesModal = () => {\r\n this.setState({ showAssociatedRolesModal: false });\r\n }\r\n\r\n applyAssociatedRoles = (roles) => {\r\n const {\r\n StartDate, EndDate, isOnlyActiveRoles, editRole, SOWDetails, Status, initial,\r\n } = this.props;\r\n if (roles.length) {\r\n const checkedRoles = roles.filter(role => role.checked);\r\n if (checkedRoles.length) {\r\n const startDateForUpdateRoles = !moment(StartDate).isSame(initial.StartDate) ? StartDate : null;\r\n const endDateForUpdateRoles = !moment(EndDate).isSame(initial.EndDate) ? EndDate : null;\r\n const rolesToUpdate = getCorrectDataForEditRole(checkedRoles, startDateForUpdateRoles, endDateForUpdateRoles, Status, SOWDetails.Project.Id);\r\n rolesToUpdate.forEach(role => editRole(role, !isOnlyActiveRoles));\r\n }\r\n }\r\n this.closeAssociatedRolesModal();\r\n this.editAmendment(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n }\r\n\r\n applyForm = () => {\r\n const {\r\n Id, isOnlyActiveRoles, SOWDetails, cancelContractImport, importContract,\r\n } = this.props;\r\n Id ? this.checkForAssociatedRoles()\r\n : this.addAmendment(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles);\r\n Object.keys(importContract).length && cancelContractImport(SOWDetails.Project.Id);\r\n }\r\n\r\n addAmendment = (projectId, SOWId, isOnlyActiveRoles) => {\r\n const { addNewAmendment } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n addNewAmendment(projectId, SOWId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n history.push({\r\n pathname: `/projects/${projectId}`,\r\n });\r\n }\r\n\r\n editAmendment = (projectId, SOWId, isOnlyActiveRoles) => {\r\n const { editAmendment, location } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n const saveCallback = (location.state && location.state.saveCallback) || `/projects/${projectId}`;\r\n\r\n editAmendment(\r\n projectId,\r\n SOWId,\r\n isOnlyActiveRoles,\r\n isNeedToChangeDate,\r\n configPatchRequestsForConfirmDialog,\r\n saveCallback,\r\n );\r\n }\r\n\r\n closeConfirmationDialog = () => {\r\n const { change } = this.props;\r\n const { typeDateForDeleteIfUserCloseConfirmationDialog } = this.state;\r\n this.setState({\r\n showConfirmationDialog: false,\r\n });\r\n change(typeDateForDeleteIfUserCloseConfirmationDialog, null);\r\n }\r\n\r\n showConfirmationDialog = (configForConfirmDialog) => {\r\n const { configPatchRequestsForConfirmDialog } = this.state;\r\n this.setState({\r\n showConfirmationDialog: true,\r\n messageForConfirmDialog: configForConfirmDialog.message,\r\n typeDateForDeleteIfUserCloseConfirmationDialog: configForConfirmDialog.typeChangedDate,\r\n configPatchRequestsForConfirmDialog:\r\n combinedConfigsForPatchRequests(configForConfirmDialog.configForPatchRequests, configPatchRequestsForConfirmDialog),\r\n });\r\n }\r\n\r\n addNewMilestone = (milestones) => {\r\n const { change } = this.props;\r\n change('Milestones', milestones);\r\n }\r\n\r\n onConfirmDialog = () => {\r\n const {\r\n showAlertDialog, RolesForContarct, SOWDetails,\r\n } = this.props;\r\n const isRolesUnderParentContract = RolesForContarct.some((role) => role.SowPoId === SOWDetails.Id);\r\n this.setState({\r\n isNeedToChangeDate: true,\r\n showConfirmationDialog: false,\r\n }, () => {\r\n isRolesUnderParentContract && showAlertDialog('Please note that Role and Employee dates will not be updated in parent contracts ');\r\n });\r\n }\r\n\r\n getStartDatesForDatePicker = () => {\r\n const { SOWDetails, projectDetails } = this.props;\r\n return [{ date: projectDetails.StartDate, type: 'Project', id: SOWDetails.Project.Id },\r\n {\r\n date: SOWDetails.StartDate, type: 'SOW', id: SOWDetails.Id, SOWId: SOWDetails.Id, projectId: SOWDetails.Project.Id,\r\n }];\r\n }\r\n\r\n getEndDatesForDatePicker = () => {\r\n const { SOWDetails, projectDetails } = this.props;\r\n return [{ date: projectDetails.EndDate, type: 'Project', id: SOWDetails.Project.Id },\r\n {\r\n date: SOWDetails.EndDate, type: 'SOW', id: SOWDetails.Id, SOWId: SOWDetails.Id, projectId: SOWDetails.Project.Id,\r\n }];\r\n }\r\n\r\nonSaveAndCreateRoles = () => {\r\n const {\r\n addImportAmendment, SOWDetails, isOnlyActiveRoles,\r\n } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n addImportAmendment(SOWDetails.Project.Id, SOWDetails.Id, !isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n}\r\n\r\nonCancelClick = () => {\r\n const { cancelContractImport, SOWDetails } = this.props;\r\n cancelContractImport(SOWDetails.Project.Id);\r\n}\r\n\r\nrender() {\r\n const {\r\n showAssociatedRolesModal, associatedRoles, showConfirmationDialog, messageForConfirmDialog,\r\n } = this.state;\r\n const {\r\n disabled, allApprovalStatuses, allClients, allApprovers, allStatuses, columnsToDisplay, viewFinancialInfo, allDocumentTypes, Contract,\r\n ApprovalStatus, Company, Approver, StartDate, EndDate, Status, Links, formErrors, showAlertDialog, Id,\r\n BudgetComments, handleSubmit, StatusComments, ProjectEndDate, Milestones, SOWDetails, allRolesForContract, importRoles,\r\n } = this.props;\r\n const isSOWTypeActualTime = SOWDetails.Type && SOWDetails.Type.Name === TIME_AND_MATERIAL;\r\n const milestonesListColumnsToDisplay = isSOWTypeActualTime ? columnsToDisplay.milestonesList\r\n : columnsToDisplay.milestonesList.filter(column => column.Name !== MILESTONE_BACKUP_USED_COLUMN_NAME);\r\n\r\n return (\r\n \r\n );\r\n}\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('projectEditAmendmentForm', data)),\r\n destroy: () => dispatch(destroy('projectEditAmendmentForm')),\r\n change: (field, value) => dispatch(change('projectEditAmendmentForm', field, value)),\r\n addNewAmendment:\r\n (projectId, SOWId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => (\r\n dispatch(addNewAmendment(projectId, SOWId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog))),\r\n editAmendment:\r\n (projectId, SOWId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, redirectTo) => (\r\n dispatch(editCurrentAmendment(projectId, SOWId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, redirectTo))),\r\n editRole: (role, isOnlyActiveRoles) => dispatch(editRole(role, isOnlyActiveRoles)),\r\n showAlertDialog: (message) => dispatch(showAlertDialog(message)),\r\n addImportAmendment: (ProjectId, SOWDetailsId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => (\r\n dispatch(addAmendmentToPartialContract(ProjectId, SOWDetailsId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog))),\r\n cancelContractImport: (id) => dispatch(cancelImport(id)),\r\n };\r\n};\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.projectEditAmendmentForm && state.form.projectEditAmendmentForm.values;\r\n return {\r\n Id: isFormReducerExists && state.form.projectEditAmendmentForm.values.Id,\r\n Contract: isFormReducerExists && state.form.projectEditAmendmentForm.values.Contract,\r\n ApprovalStatus: isFormReducerExists && state.form.projectEditAmendmentForm.values.ApprovalStatus,\r\n StartDate: isFormReducerExists && state.form.projectEditAmendmentForm.values.StartDate,\r\n EndDate: isFormReducerExists && state.form.projectEditAmendmentForm.values.EndDate,\r\n Company: isFormReducerExists && state.form.projectEditAmendmentForm.values.Company,\r\n Approver: isFormReducerExists && state.form.projectEditAmendmentForm.values.Approver,\r\n Status: isFormReducerExists && state.form.projectEditAmendmentForm.values.Status,\r\n StatusComments: isFormReducerExists && state.form.projectEditAmendmentForm.values.StatusComments,\r\n BudgetComments: isFormReducerExists && state.form.projectEditAmendmentForm.values.BudgetComments,\r\n Links: isFormReducerExists && state.form.projectEditAmendmentForm.values.Links,\r\n formErrors: isFormReducerExists && state.form.projectEditAmendmentForm.syncErrors,\r\n initial: isFormReducerExists && state.form.projectEditAmendmentForm.initial,\r\n isOnlyActiveRoles: state.showRoles.isOnlyActiveRoles,\r\n ProjectEndDate: state.projectsReducer.projectDetails.EndDate,\r\n ProjectStartDate: state.projectsReducer.projectDetails.StartDate,\r\n Milestones: isFormReducerExists && state.form.projectEditAmendmentForm.values.Milestones,\r\n importRoles: state.importContractReducer.contract.Roles,\r\n importContract: state.importContractReducer.contract,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'projectEditAmendmentForm',\r\n})(ProjectEditAmendmentForm));\r\n","import * as React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { loadManageDocumentTypes } from 'pages/admin/actions/adminManageDocumentTypes';\r\nimport { getMilestonesForAmendment, setMilestonesForAmendment } from 'pages/projects/actions/projectsActions';\r\nimport ProjectEditAmendmentForm from 'common/components/redux-form/project-edit-Amendment-form/project-edit-Amendment-form';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport { cancelImport } from 'pages/projects/actions/importContractAction';\r\nimport { convertMilestones } from 'utils/convertMilestones';\r\nimport { formatContractDate } from '../../utils/formatContractDate';\r\n\r\nexport class AmendmentEditPage extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const {\r\n projectDetails, location: locationProps, ManageProjectContracts, HasFinancialAccess,\r\n } = this.props;\r\n this.state = {\r\n columnsToDisplay: {\r\n documentsList: [\r\n {\r\n Name: 'Documents Links', isSelected: true, Id: 'Comment', className: 'without-width-col', pressArrowLeft: true,\r\n },\r\n {\r\n Name: 'Documents Types', isType: true, Id: 'DocumentType', className: 'without-width-col', pressArrowLeft: true,\r\n },\r\n ],\r\n milestonesList: [\r\n {\r\n Name: 'Milestone', Id: 'Milestone', className: 'without-width-col', isRequired: true,\r\n },\r\n {\r\n Name: 'Milestone Amount', Id: 'MilestoneAmount', className: 'without-width-col', isRequired: true,\r\n },\r\n {\r\n Name: 'Backup used', Id: 'UsedAssignmentBackupUser', className: 'without-width-col',\r\n },\r\n ],\r\n },\r\n ManageProjectContracts,\r\n HasFinancialAccess,\r\n };\r\n // eslint-disable-next-line prefer-destructuring\r\n this.location = history.location.pathname.split('/')[3];\r\n this.Id = history.location.pathname.split('/')[4] || '';\r\n this.SOWId = this.location === 'add-amendment' ? history.location.pathname.split('/')[4] : '';\r\n this.emptyForm = {\r\n ApprovalStatus: {},\r\n Approver: '',\r\n BillingCode: '',\r\n Budget: '',\r\n BudgetComments: '',\r\n Contract: '',\r\n EndDate: null,\r\n Id: '',\r\n Links: [],\r\n Milestones: [],\r\n RealizedRevenue: '',\r\n StartDate: null,\r\n Status: {},\r\n StatusComments: '',\r\n Type: '',\r\n Company: '',\r\n };\r\n !projectDetails && history.push({\r\n pathname: `/projects/${history.location.pathname.split('/')[2]}`,\r\n state: locationProps.state,\r\n });\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n projectDetails, location, loadManageDocumentTypes, getMilestonesForAmendment,\r\n setComponent, HasFinancialAccess,\r\n } = this.props;\r\n !projectDetails.Name && history.back();\r\n this.defineRightsForEdit();\r\n loadManageDocumentTypes();\r\n if (HasFinancialAccess) {\r\n this.Id && !this.SOWId && getMilestonesForAmendment(this.Id, projectDetails.Id, this.getSOWId());\r\n }\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n setComponent({\r\n returnButton: { text: rightPath, goToPreviousPage: this.goTyMainList },\r\n secondReturnButton: { text: `${projectDetails && projectDetails.Name} details`, goToPreviousPage: this.goToProjectDetails },\r\n });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { setMilestonesForAmendment, resetComponent } = this.props;\r\n const emptyArray = [];\r\n setMilestonesForAmendment(emptyArray);\r\n resetComponent();\r\n }\r\n\r\n defineRightsForEdit = () => {\r\n if (this.location === 'add-amendment') {\r\n this.setState({\r\n HasFinancialAccess: true,\r\n });\r\n }\r\n }\r\n\r\n goTyMainList = () => {\r\n const { location } = this.props;\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n history.push({ pathname: `/${rightPath}`, state: location.state });\r\n }\r\n\r\n goToProjectDetails = () => {\r\n const { projectDetails, location, cancelImport } = this.props;\r\n const SOWDetails = projectDetails.Contracts.find(sow => sow.Id === this.SOWId);\r\n\r\n SOWDetails && SOWDetails.Project && cancelImport(SOWDetails.Project.Id);\r\n history.push({ pathname: `/projects/${projectDetails.Id}`, state: location.state });\r\n }\r\n\r\n getSOWId = () => {\r\n const { projectDetails } = this.props;\r\n const SOWDetails = projectDetails && projectDetails.Contracts.find(sow => sow.Amendments.some(amendment => amendment.Id === this.Id));\r\n return this.SOWId || SOWDetails.Id;\r\n }\r\n\r\n render() {\r\n const { columnsToDisplay, ManageProjectContracts, HasFinancialAccess } = this.state;\r\n const {\r\n projectDetails,\r\n approvalStatuses,\r\n clients,\r\n clientContacts,\r\n documentStatuses,\r\n location,\r\n documentTypes,\r\n milestones,\r\n allRoles,\r\n importContract,\r\n } = this.props;\r\n\r\n let SOWDetails,\r\n AmedmentDetails,\r\n formTitle;\r\n switch (this.location) {\r\n case 'add-amendment':\r\n SOWDetails = projectDetails && projectDetails.Contracts.find(sow => sow.Id === this.SOWId);\r\n formTitle = 'Add Amendment for SOW ';\r\n break;\r\n case 'edit-amendment':\r\n case 'view-amendment':\r\n SOWDetails = projectDetails && projectDetails.Contracts.find(sow => sow.Amendments.some(amendment => amendment.Id === this.Id));\r\n AmedmentDetails = SOWDetails && SOWDetails.Amendments.find(amendment => amendment.Id === this.Id);\r\n formTitle = 'Edit Amendment for SOW ';\r\n break;\r\n default: break;\r\n }\r\n const arrayMilestones = importContract && importContract.Milestones ? convertMilestones(importContract.Milestones) : convertMilestones(milestones);\r\n return (\r\n \r\n {formTitle}\r\n {SOWDetails && SOWDetails.Contract}\r\n
\r\n \r\n \r\n item.Id === importContract.ApprovalStatus) || {},\r\n Status: documentStatuses.find(item => item.Id === importContract.DocumentStatus) || {},\r\n }\r\n : {\r\n ...this.emptyForm,\r\n Company: SOWDetails && SOWDetails.Company && SOWDetails.Company.Id,\r\n Approver: SOWDetails && SOWDetails.Approver && SOWDetails.Approver.Id,\r\n Budget: 0,\r\n }}\r\n SOWDetails={SOWDetails}\r\n projectDetails={projectDetails}\r\n disabled={!ManageProjectContracts}\r\n viewFinancialInfo={HasFinancialAccess}\r\n allApprovalStatuses={sortFilterList(approvalStatuses)}\r\n allClients={sortFilterList(clients)}\r\n allApprovers={sortFilterList(clientContacts)}\r\n allStatuses={sortFilterList(documentStatuses)}\r\n allDocumentTypes={sortFilterList(documentTypes)}\r\n currencyProject={projectDetails && projectDetails.Currency && projectDetails.Currency.Name}\r\n RolesForContarct={projectDetails.Roles}\r\n allRolesForContract={allRoles}\r\n projectType={projectDetails && projectDetails.Billability}\r\n columnsToDisplay={columnsToDisplay}\r\n location={location}\r\n />\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nAmendmentEditPage.propTypes = {\r\n projectDetails: PropTypes.object,\r\n approvalStatuses: PropTypes.array,\r\n clientContacts: PropTypes.array,\r\n documentStatuses: PropTypes.array,\r\n clients: PropTypes.array,\r\n loadManageDocumentTypes: PropTypes.func,\r\n};\r\n\r\nexport default connect(store => ({\r\n projectDetails: store.projectsReducer.projectDetails,\r\n clients: store.projectsReducer.clients,\r\n approvalStatuses: store.projectsReducer.approvalStatuses,\r\n clientContacts: store.projectsReducer.clientContacts,\r\n documentStatuses: store.filtersReducer.filters.documentStatuses,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n UserOfficeId: store.authReducer.user.UserOfficeId,\r\n Offices: store.projectsReducer.projectDetails.Offices,\r\n documentTypes: store.adminManageLookups.documentTypes,\r\n milestones: store.projectsReducer.Milestones.Amendment,\r\n allRoles: store.projectsReducer.projectDetails.AllRoles,\r\n importContract: store.importContractReducer.contract,\r\n\r\n}), {\r\n loadManageDocumentTypes,\r\n getMilestonesForAmendment,\r\n setMilestonesForAmendment,\r\n setComponent,\r\n resetComponent,\r\n cancelImport,\r\n})(AmendmentEditPage);\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport history from 'utils/history';\r\nimport { List } from 'common/components/list/list';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport { filterChoosenExtendRoles } from 'services/filterChoosenExtendRoles';\r\nimport { transferRoles } from '../../actions/projectsActions';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport classNames from 'classnames';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport './project-extend-role.css';\r\nimport CustomIcon from '../../../../common/components/icon/Icon';\r\nimport { CustomStatusCell } from 'common/components/list/custom-cell/custom-status-cell';\r\nimport { CellRate } from 'common/components/list/custom-cell/cell-rate';\r\nimport moment from 'moment';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { updateCheckedFlagOnRoles } from 'pages/projects/components/utils/updateCheckedFlagOnRoles';\r\n\r\nexport class ExtendsRole extends Component {\r\n constructor(props) {\r\n super(props);\r\n const { extendedRoles } = this.props;\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Role Name', Id: 'RoleName', className: 'without-width-col',\r\n },\r\n {\r\n Name: 'Role Type', Id: 'Role', isObject: true,\r\n },\r\n {\r\n Name: 'Assignment', Id: 'Assignment',\r\n },\r\n {\r\n Name: 'Ass. Type', Id: 'AssignmentType', isObject: true,\r\n },\r\n {\r\n Name: 'Seniority Level', Id: 'SeniorityLevel', isObject: true,\r\n },\r\n {\r\n Name: 'Billable Status', Id: 'BillableStatus', isObject: true,\r\n },\r\n {\r\n Name: 'Rate', Id: 'Rate', isBudget: true,\r\n },\r\n {\r\n Name: 'SOW/PO Number', Id: 'SowPo',\r\n },\r\n {\r\n Name: 'Start Date', Id: 'StartDate', isDate: true,\r\n },\r\n {\r\n Name: 'End Date', Id: 'EndDate', isDate: true,\r\n },\r\n {\r\n Name: 'Status', Id: 'Status', isObject: true,\r\n },\r\n ],\r\n deepColumn: [\r\n {\r\n Name: 'Name', Id: 'Name', className: 'without-width-col', hasBadge: true,\r\n },\r\n {\r\n Name: 'Assignment', Id: 'Assignment',\r\n },\r\n {\r\n Name: 'StartDate', Id: 'StartDate', isDate: true,\r\n },\r\n {\r\n Name: 'EndDate', Id: 'EndDate', isDate: true,\r\n },\r\n {\r\n Name: 'Status', Id: 'Status', isObject: true,\r\n },\r\n ],\r\n contractsLists: [],\r\n newContract: null,\r\n endDate: null,\r\n startDate: null,\r\n extendedRoles,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { contracts, location, extendedRoles } = this.props;\r\n this.setState({\r\n contractsLists: this.getCorrectContractList(contracts),\r\n });\r\n !extendedRoles.length && history.goBack({ state: location.state });\r\n }\r\n\r\n handleChangeStartDate = (date) => {\r\n const { newContract, contractsLists } = this.state;\r\n const {\r\n projectDetails: { StartDate }, showAlertDialog, billingCodesStartDate, billingCodes,\r\n } = this.props;\r\n const selectedContract = contractsLists.find(contract => contract.Id === newContract);\r\n const billingIsSelected = !!newContract;\r\n const billingCodeStartDate = billingIsSelected && billingCodesStartDate[billingCodes.indexOf(selectedContract.Name)];\r\n\r\n if (!billingIsSelected && moment(StartDate).isAfter(date)) {\r\n return showAlertDialog('Does the date less than the Project start date?');\r\n }\r\n if (billingIsSelected && moment(billingCodeStartDate).isAfter(date)) {\r\n return showAlertDialog('Does the date less than the SOW/PO start date?');\r\n }\r\n\r\n this.setState({\r\n startDate: date,\r\n });\r\n }\r\n\r\n handleChangeEndDate = (date) => {\r\n const { newContract, contractsLists } = this.state;\r\n const {\r\n projectDetails: { EndDate }, showAlertDialog, billingCodesEndDate, billingCodes,\r\n } = this.props;\r\n const selectedContract = contractsLists.find(contract => contract.Id === newContract);\r\n const billingIsSelected = !!newContract;\r\n const billingCodeEndDate = billingIsSelected && billingCodesEndDate[billingCodes.indexOf(selectedContract.Name)];\r\n\r\n if (!billingIsSelected && moment(date).isAfter(EndDate)) {\r\n return showAlertDialog('Does the date exceed the Project end date?');\r\n }\r\n if (billingIsSelected && billingCodeEndDate && moment(date).isAfter(billingCodeEndDate, 'day')) {\r\n return showAlertDialog('Does the date exceed the SOW/PO end date?');\r\n }\r\n if (billingIsSelected && !billingCodeEndDate && moment(date).isAfter(EndDate)) {\r\n return showAlertDialog('Does the date exceed the Project end date? (SOW/PO doesn`t have end date)');\r\n }\r\n\r\n this.setState({\r\n endDate: date,\r\n });\r\n };\r\n\r\n getContractNestedItemsNames = (contract, key) => {\r\n if (contract[key].length) {\r\n return contract[key].reduce((acc, item) => {\r\n if (item.Status.Name !== 'Expired') {\r\n const po = this.getListItem(item);\r\n acc.push(po);\r\n }\r\n return acc;\r\n }, []);\r\n }\r\n return [];\r\n }\r\n\r\n getCorrectContractList = (contracts) => {\r\n const { extendedRoles } = this.props;\r\n const contractsList = [];\r\n contracts.forEach((item) => {\r\n if (item.Status.Name !== 'Expired') {\r\n const sow = this.getListItem(item);\r\n contractsList.push(sow);\r\n const POs = this.getContractNestedItemsNames(item, 'POs');\r\n if (POs.length) {\r\n contractsList.push(...POs);\r\n }\r\n const amedments = this.getContractNestedItemsNames(item, 'Amendments');\r\n if (amedments.length) {\r\n contractsList.push(...amedments);\r\n }\r\n }\r\n });\r\n const currentContract = extendedRoles.length ? extendedRoles[0].SowPo : null;\r\n const newContracts = contractsList.filter(item => item.Name !== currentContract);\r\n return newContracts;\r\n };\r\n\r\n getListItem = (contract) => {\r\n const listItem = {\r\n Id: contract.Id,\r\n Name: contract.Contract,\r\n };\r\n return listItem;\r\n };\r\n\r\n checkRole = (e, parent) => {\r\n const { extendedRoles } = this.state;\r\n let roles = extendedRoles;\r\n roles = filterChoosenExtendRoles(roles, e.target.value, parent, e.target.checked);\r\n this.setState({\r\n extendedRoles: roles,\r\n });\r\n };\r\n\r\n onChangeCheckecRole = (idRole, parentId) => {\r\n this.setState((state) => {\r\n const roles = updateCheckedFlagOnRoles(state.extendedRoles, idRole, parentId, true);\r\n return {\r\n extendedRoles: roles,\r\n };\r\n });\r\n }\r\n\r\n handleChangeContract = (e) => {\r\n const { contracts } = this.props;\r\n let defaultEndDate;\r\n let defaultStartDate;\r\n contracts.forEach((item) => {\r\n if (item.Id === e.target.value) {\r\n defaultEndDate = item.EndDate;\r\n defaultStartDate = item.StartDate;\r\n }\r\n item.POs.forEach((item) => {\r\n if (item.Id === e.target.value) {\r\n defaultEndDate = item.EndDate;\r\n defaultStartDate = item.StartDate;\r\n }\r\n });\r\n\r\n if (item.Amendments) {\r\n const amendment = item.Amendments.find((amendment) => amendment.Id === e.target.value);\r\n if (amendment) {\r\n defaultEndDate = amendment.EndDate;\r\n defaultStartDate = amendment.StartDate;\r\n }\r\n }\r\n });\r\n\r\n this.setState({\r\n newContract: e.target.value,\r\n endDate: defaultEndDate,\r\n startDate: defaultStartDate,\r\n });\r\n };\r\n\r\n pullOnServer = () => {\r\n const {\r\n extendedRoles, newContract, endDate, startDate,\r\n } = this.state;\r\n const { projectId, transfer, location } = this.props;\r\n if (newContract && endDate) {\r\n const roles = extendedRoles;\r\n const parentFilter = roles.filter(item => item.checked === true);\r\n const childFilter = parentFilter.filter(item => item.Employees = item.Employees.filter(child => child.checked === true));\r\n const transferRoles = [];\r\n childFilter.forEach((item) => {\r\n const role = {\r\n RoleId: item.Id,\r\n };\r\n const AssignmentsIds = [];\r\n if (item.Employees.length) {\r\n item.Employees.forEach((shadow) => {\r\n AssignmentsIds.push(shadow.Id);\r\n });\r\n }\r\n role.AssignmentsIds = AssignmentsIds;\r\n transferRoles.push(role);\r\n });\r\n transfer(transferRoles, newContract, projectId, endDate, startDate);\r\n history.goBack({ state: location.state });\r\n }\r\n };\r\n\r\n render() {\r\n const {\r\n extendedRoles, columnsToDisplay, deepColumn,\r\n contractsLists, newContract,\r\n endDate, startDate,\r\n } = this.state;\r\n const { location, HasFinancialAccess } = this.props;\r\n const isDisabled = true;\r\n return (\r\n \r\n {formTitle}\r\n {SOWDetails && SOWDetails.Contract}\r\n
\r\n history.goBack({ state: location.state })}>\r\n
\r\n \r\n
\r\n EXTEND ROLES
\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\nconst mapStateToProps = state => ({\r\n extendedRoles: state.projectsReducer.extendedRoles,\r\n contracts: state.projectsReducer.projectDetails ? state.projectsReducer.projectDetails.Contracts : [],\r\n projectId: state.projectsReducer.projectDetails.Id,\r\n projectDetails: state.projectsReducer.projectDetails,\r\n billingCodes: state.roleModalReducer.billingCodes,\r\n billingCodesStartDate: state.roleModalReducer.billingCodesStartDate,\r\n billingCodesEndDate: state.roleModalReducer.billingCodesEndDate,\r\n});\r\n\r\nconst mapDispatchToProps = dispatch => ({\r\n transfer: (roles, id, projectId, endDate, startDate) => {\r\n dispatch(transferRoles(roles, id, projectId, endDate, startDate));\r\n },\r\n showAlertDialog: (message) => dispatch(showAlertDialog(message)),\r\n});\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps,\r\n)(ExtendsRole);\r\n\r\nExtendsRole.propTypes = {\r\n extendedRoles: PropTypes.array.isRequired,\r\n transfer: PropTypes.func.isRequired,\r\n};\r\n","import React from 'react';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport classNames from 'classnames';\r\n\r\n\r\nexport const CellDelete = (props) => {\r\n const { item, column, onDeleteClick } = props;\r\n const handleDelete = (e) => {\r\n e.stopPropagation();\r\n onDeleteClick(item.Id);\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n Apply\r\n
\r\n history.goBack({ state: location.state })}>\r\n Cancel\r\n
\r\n \r\n \r\n {\r\n showAlertDialog ? (\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default connect((store) => ({\r\n settings: store.adminReducer.settings,\r\n projectDetails: store.projectsReducer.projectDetails,\r\n projectTeams: store.projectsReducer.projectTeams.Teams,\r\n employees: store.membersReducer.members,\r\n}), {\r\n setComponent,\r\n resetComponent,\r\n getRoles,\r\n createProjectTeam,\r\n editProjectTeam,\r\n})(TeamPage);\r\n","import classNames from \"classnames\";\r\nimport React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { destroy, Field, initialize, reduxForm, change } from \"redux-form\";\r\nimport Button from \"../components/button\";\r\nimport renderDatePicker from \"../components/date-picker\";\r\nimport renderDocumentList from \"../components/document-list\";\r\nimport renderSearchDropdown from \"../components/search-dropdown\";\r\nimport renderSelect from \"../components/select\";\r\nimport renderTextField from \"../components/text-field\";\r\nimport {\r\n required, validateDate\r\n} from 'services/redux-form-validators.js';\r\nimport { cancelImport } from \"../../../../pages/projects/actions/importContractAction\";\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { addNewMSA, editCurrentMSA } from 'pages/projects/actions/contractsActions';\r\nimport { getChangeConfigForPatchRequests, combinedConfigsForPatchRequests } from 'utils/getConfigBasedOnCheckedDates';\r\nimport history from 'utils/history';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container edit-SOW__simple-container',\r\n label: 'redux-form__SOW--label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nclass ProjectEditMSAForm extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showConfirmationDialog: false,\r\n isNeedToChangeDate: false,\r\n messageForConfirmDialog: '',\r\n configPatchRequestsForConfirmDialog: null,\r\n };\r\n\r\n this.disable = {\r\n Signer: () => {\r\n const { Company } = this.props;\r\n return !Company;\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { data, initialize } = this.props;\r\n initialize(data);\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { configPatchRequestsForConfirmDialog, isNeedToChangeDate } = this.state;\r\n const { StartDate, EndDate } = this.props;\r\n\r\n if (prevProps.StartDate !== StartDate || prevProps.EndDate !== EndDate) {\r\n if (!EndDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'endDate'),\r\n });\r\n }\r\n if (!StartDate && isNeedToChangeDate) {\r\n this.setState({\r\n configPatchRequestsForConfirmDialog: getChangeConfigForPatchRequests(configPatchRequestsForConfirmDialog, 'startDate'),\r\n });\r\n }\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { destroy } = this.props;\r\n destroy();\r\n }\r\n\r\n getStartDatesForDatePicker = () => {\r\n const { ProjectStartDate, projectId } = this.props;\r\n return [{ date: ProjectStartDate, type: 'Project', id: projectId }];\r\n }\r\n\r\n getEndDatesForDatePicker = () => {\r\n const { ProjectEndDate, projectId } = this.props;\r\n return [{ date: ProjectEndDate, type: 'Project', id: projectId }];\r\n }\r\n\r\n onCancelClick = () => {\r\n const { cancelContractImport, Project } = this.props;\r\n cancelContractImport(Project.Id);\r\n }\r\n\r\n addMSA = (projectId, isOnlyActiveRoles) => {\r\n const { addMSA } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n addMSA(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog);\r\n history.push({\r\n pathname: `/projects/${projectId}`,\r\n });\r\n }\r\n\r\n editMSA = (projectId, isOnlyActiveRoles) => {\r\n const { editMSA, location } = this.props;\r\n const { isNeedToChangeDate, configPatchRequestsForConfirmDialog } = this.state;\r\n const saveCallback = (location.state && location.state.saveCallback) || `/projects/${projectId}`;\r\n\r\n editMSA(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, saveCallback);\r\n }\r\n\r\n applyForm = () => {\r\n const { Id, Project, cancelContractImport, isOnlyActiveRoles } = this.props;\r\n Id ? this.editMSA(Project.Id, isOnlyActiveRoles) : this.addMSA(Project.Id, isOnlyActiveRoles);\r\n cancelContractImport(Project.Id);\r\n }\r\n\r\n closeConfirmationDialog = () => {\r\n const { change } = this.props;\r\n const { typeDateFormDeleteIfUserCloseConfirmationDialog } = this.state;\r\n this.setState({\r\n showConfirmationDialog: false,\r\n isNeedToChangeDate: false,\r\n });\r\n change(typeDateFormDeleteIfUserCloseConfirmationDialog, null);\r\n }\r\n\r\n showConfirmationDialog = (configForConfirmDialog) => {\r\n const { configPatchRequestsForConfirmDialog } = this.state;\r\n this.setState({\r\n showConfirmationDialog: true,\r\n messageForConfirmDialog: configForConfirmDialog.message,\r\n typeDateFormDeleteIfUserCloseConfirmationDialog: configForConfirmDialog.typeChangedDate,\r\n configPatchRequestsForConfirmDialog:\r\n combinedConfigsForPatchRequests(configForConfirmDialog.configForPatchRequests, configPatchRequestsForConfirmDialog),\r\n });\r\n }\r\n\r\n onConfirmDialog = () => {\r\n this.setState({\r\n isNeedToChangeDate: true,\r\n showConfirmationDialog: false,\r\n });\r\n }\r\n\r\n onChange = (data, value, prevValue, field) => {\r\n const { change } = this.props;\r\n\r\n switch (field) {\r\n case 'Company':\r\n change('Signer', '');\r\n break;\r\n default: break;\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n showConfirmationDialog, messageForConfirmDialog,\r\n } = this.state;\r\n const {\r\n disabled, allApprovalStatuses, allClients, allSigners, allStatuses, columnsToDisplay, viewFinancialInfo, allDocumentTypes, Contract,\r\n ApprovalStatus, Company, Signer, StartDate, EndDate, Status, Links, formErrors, showAlertDialog, handleSubmit, Comments,\r\n } = this.props;\r\n return (\r\n \r\n )\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('projectEditMSAForm', data)),\r\n destroy: () => dispatch(destroy('projectEditMSAForm')),\r\n change: (field, value) => dispatch(change('projectEditMSAForm', field, value)),\r\n cancelContractImport: (id) => dispatch(cancelImport(id)),\r\n addMSA: (projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog) => (\r\n dispatch(addNewMSA(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog))),\r\n editMSA: (projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, saveCallback) => (\r\n dispatch(editCurrentMSA(projectId, isOnlyActiveRoles, isNeedToChangeDate, configPatchRequestsForConfirmDialog, saveCallback))),\r\n }\r\n}\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.projectEditMSAForm && state.form.projectEditMSAForm.values;\r\n return {\r\n Id: isFormReducerExists && state.form.projectEditMSAForm.values.Id,\r\n Contract: isFormReducerExists && state.form.projectEditMSAForm.values.Contract,\r\n ApprovalStatus: isFormReducerExists && state.form.projectEditMSAForm.values.ApprovalStatus,\r\n StartDate: isFormReducerExists && state.form.projectEditMSAForm.values.StartDate,\r\n EndDate: isFormReducerExists && state.form.projectEditMSAForm.values.EndDate,\r\n Company: isFormReducerExists && state.form.projectEditMSAForm.values.Company,\r\n Signer: isFormReducerExists && state.form.projectEditMSAForm.values.Signer,\r\n Status: isFormReducerExists && state.form.projectEditMSAForm.values.Status,\r\n Comments: isFormReducerExists && state.form.projectEditMSAForm.values.Comments,\r\n Links: isFormReducerExists && state.form.projectEditMSAForm.values.Links,\r\n formErrors: isFormReducerExists && state.form.projectEditMSAForm.syncErrors,\r\n initial: isFormReducerExists && state.form.projectEditMSAForm.initial,\r\n isOnlyActiveRoles: state.showRoles.isOnlyActiveRoles,\r\n ProjectEndDate: state.projectsReducer.projectDetails.EndDate,\r\n ProjectStartDate: state.projectsReducer.projectDetails.StartDate,\r\n Project: isFormReducerExists && state.form.projectEditMSAForm.values.Project,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'projectEditMSAForm',\r\n})(ProjectEditMSAForm));","import * as React from \"react\";\r\nimport PropTypes from 'prop-types';\r\nimport Scrollbars from \"react-custom-scrollbars\";\r\nimport history from 'utils/history';\r\nimport DocumentTitle from \"react-document-title\";\r\nimport { connect } from \"react-redux\";\r\nimport ProjectEditMSAForm from \"../../../../../common/components/redux-form/project-edit-MSA-form/project-edit-MSA-form\";\r\nimport { applicationTitle } from \"../../../../../utils/applicationTitle\";\r\nimport { sortFilterList } from 'common/components/list/sortList';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { loadManageDocumentTypes } from 'pages/admin/actions/adminManageDocumentTypes';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport { getEmployees } from 'pages/projects/actions/roleModalActions';\r\n\r\nexport class MSAEditPage extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n const { projectDetails, ManageProjectContracts, HasFinancialAccess } = this.props;\r\n this.state = {\r\n columnsToDisplay: {\r\n documentsList: [\r\n {\r\n Name: 'Documents Links',\r\n isSelected: true,\r\n Id: 'Comment',\r\n className: 'without-width-col',\r\n pressArrowLeft: true,\r\n },\r\n {\r\n Name: 'Documents Types',\r\n isType: true,\r\n Id: 'DocumentType',\r\n className: 'without-width-col',\r\n pressArrowLeft: true,\r\n }\r\n ]\r\n },\r\n ManageProjectContracts,\r\n HasFinancialAccess,\r\n }\r\n this.Id = history.location.pathname.split('/')[4] || null;\r\n this.location = history.location.pathname.split('/')[3];\r\n this.emptyForm = {\r\n Id: '',\r\n Contract: this.autoGenerateMSANumber(projectDetails.MSAs),\r\n Company: '',\r\n Approver: '',\r\n Type: {},\r\n Project: { Id: projectDetails.Id, Name: projectDetails.Name },\r\n StartDate: null,\r\n EndDate: null,\r\n ApprovalStatus: {},\r\n Comments: '',\r\n Status: {},\r\n Links: [],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { projectDetails, location, setComponent, loadManageDocumentTypes } = this.props;\r\n !projectDetails.Name && history.goBack({state: location.state});\r\n loadManageDocumentTypes();\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n setComponent({\r\n returnButton: { text: rightPath, goToPreviousPage: this.goToMainList },\r\n secondReturnButton: { text: `${(projectDetails && projectDetails.Name) ? projectDetails.Name : ''} details`, goToPreviousPage: this.goToProjectDetails },\r\n });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent } = this.props;\r\n resetComponent();\r\n }\r\n\r\n autoGenerateMSANumber = (msas) => {\r\n const num = msas ? msas.filter(item => item.Type && item.Type.Name && item.Type.Name === 'MSA').length + 1 : 1;\r\n return 'MSA-' + num;\r\n }\r\n\r\n goToMainList = () => {\r\n const { location } = this.props;\r\n const rightPath = location.state && location.state.isWrongPath ? 'contracts' : 'projects';\r\n history.push({ pathname: `/${rightPath}`, state: location.state });\r\n }\r\n\r\n goToProjectDetails = () => {\r\n const { projectDetails, location, cancelImport } = this.props;\r\n const MSADetails = projectDetails.MSAs.find(msa => msa.Id === this.MSAId);\r\n\r\n MSADetails && MSADetails.Project && cancelImport(MSADetails.Project.Id);\r\n history.push({ pathname: `/projects/${projectDetails.Id}`, state: location.state });\r\n }\r\n \r\n render() {\r\n const { columnsToDisplay, HasFinancialAccess, ManageProjectContracts } = this.state;\r\n const {\r\n projectDetails,\r\n approvalStatuses,\r\n clients,\r\n clientContacts,\r\n documentStatuses,\r\n location,\r\n documentTypes,\r\n } = this.props;\r\n const MSADetails = projectDetails && projectDetails.MSAs.find(contract => contract.Id === this.Id);\r\n let formTitle;\r\n switch (this.location) {\r\n case 'add-msa':\r\n formTitle = 'Add MSA';\r\n break;\r\n case 'edit-msa':\r\n case 'view-msa':\r\n formTitle = 'Edit MSA';\r\n break;\r\n default: break;\r\n }\r\n return (\r\n \r\n {teamToEditId ? 'Edit Team' : 'Add Team'}\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n ({\r\n label: item.Name,\r\n value: item.Id,\r\n employeeId: item.EmployeeId,\r\n }))}\r\n isMulti\r\n suggesValue={teamMembers}\r\n handleChangeSuggestBox={this.handleChangeSuggestBox}\r\n blockAddNewItem\r\n />\r\n
\r\n {isDuplicateAssignmentInList && 'Remove duplicate member'}
\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\nMSAEditPage.propTypes = {\r\n projectDetails: PropTypes.object,\r\n approvalStatuses: PropTypes.array,\r\n clients: PropTypes.array,\r\n clientContacts: PropTypes.array,\r\n documentStatuses: PropTypes.array,\r\n documentTypes: PropTypes.array,\r\n loadManageDocumentTypes: PropTypes.func,\r\n ManageProjectContracts: PropTypes.bool.isRequired,\r\n HasFinancialAccess: PropTypes.bool.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n projectDetails: store.projectsReducer.projectDetails,\r\n approvalStatuses: store.projectsReducer.approvalStatuses,\r\n clients: store.filtersReducer.filters.Clients,\r\n clientContacts: store.projectsReducer.clientContacts,\r\n documentStatuses: store.filtersReducer.filters.documentStatuses,\r\n isOnlyActive: store.showRoles.isOnlyActiveRoles,\r\n UserOfficeId: store.authReducer.user.UserOfficeId,\r\n Offices: store.projectsReducer.projectDetails.Offices,\r\n documentTypes: store.adminManageLookups.documentTypes,\r\n EmployeeId: store.authReducer.user.EmployeeId,\r\n resultAlert: store.dialogsReducer.alertDialogReducer.resultAlert,\r\n}), {\r\n loadManageDocumentTypes,\r\n setComponent,\r\n resetComponent,\r\n getEmployees,\r\n})(MSAEditPage);","import React, { Fragment } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport { Route, Switch, Redirect } from 'react-router-dom';\r\nimport {\r\n fetchProjects,\r\n getCreationConfig,\r\n getProjectRoleConfig,\r\n getOffices,\r\n getClients,\r\n getStatuses,\r\n getPeriods,\r\n resetListSettings,\r\n getPrevPathForProjects,\r\n} from './actions/projectsActions';\r\nimport { getManageInvoiceDates } from 'pages/admin/actions/adminManageInvoiceDates';\r\nimport { getFilters } from 'common/actions/filtersActions';\r\nimport { getVersion } from 'common/actions/versionActions';\r\nimport { getRateUnits } from './actions/roleModalActions';\r\nimport ProjectsListPage from './components/projects-list/projects-list';\r\nimport CreateProjectPage from './components/create-project/create-project';\r\nimport ProjectDetails from './components/project-details/project-details';\r\nimport RoleModal from './components/role-modal/role-modal';\r\nimport EditRoleModal from './components/role-modal/edit-role-modal';\r\nimport EditAssignment from './components/role-modal/edit-assignment';\r\nimport SOWEditPage from './components/edit-project-info/SOW-edit-page/SOW-edit-page';\r\nimport POEditPage from './components/edit-project-info/PO-edit-page/PO-edit-page';\r\nimport AmendmentEditPage from './components/edit-project-info/Amendment-edit-page/Amendment-edit-page';\r\nimport ExtendsRole from './components/project-extend-role/project-extend-role';\r\nimport TeamPageComponent from './components/team-page/team-page';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { loadOfficeLocations } from 'pages/projects/actions/filterLocationsActions.js';\r\nimport './projects-page.css';\r\nimport MSAEditPage from './components/edit-project-info/MSA-edit-page/MSA-edit-page';\r\n\r\nconst filtersNames = [\r\n 'Offices',\r\n 'Clients',\r\n 'ProjectStatuses',\r\n 'ProjectTypes',\r\n 'AccountManagers',\r\n 'DeliveryManagers',\r\n 'ClientManagers',\r\n 'EngineeringManagers',\r\n];\r\n\r\nexport class ProjectsPageComponent extends React.Component {\r\n constructor() {\r\n super();\r\n\r\n this.state = {\r\n defaultFilters: {\r\n Statuses: [3],\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n getVersion,\r\n getCreationConfig,\r\n getProjectRoleConfig,\r\n getClients,\r\n getFilters,\r\n getRateUnits,\r\n loadOfficeLocations,\r\n getManageInvoiceDates,\r\n resetListSettings,\r\n prevPath,\r\n location,\r\n } = this.props;\r\n const urlIdPath = location.pathname.split('/projects/')[1];\r\n const patternId = new RegExp('^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$', 'i');\r\n getVersion();\r\n getCreationConfig();\r\n getProjectRoleConfig();\r\n getClients();\r\n getFilters(filtersNames);\r\n getRateUnits();\r\n loadOfficeLocations();\r\n getManageInvoiceDates();\r\n // if (!prevPath && !patternId.test(urlIdPath)) {\r\n // resetListSettings();\r\n // } else {\r\n // this.resetDefaultFilters();\r\n // }\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n version, getVersion, location, getPrevPathForProjects,\r\n } = this.props;\r\n const urlIdPath = location.pathname;\r\n const pattern = new RegExp('/projects', 'i');\r\n if (prevProps.version !== version) {\r\n getVersion();\r\n }\r\n // if (pattern.test(urlIdPath)) {\r\n // getPrevPathForProjects(urlIdPath);\r\n // }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetListSettings } = this.props;\r\n resetListSettings();\r\n }\r\n\r\n resetDefaultFilters = () => {\r\n this.setState({\r\n defaultFilters: null,\r\n });\r\n };\r\n\r\n getDefaultFilters = () => {\r\n const { statuses } = this.props;\r\n const defaultFilters = statuses.reduce((acc = [], item) => {\r\n if (item.Name === 'Active' || item.Name === 'Approve SOW/PO' || item.Name === 'Draft'\r\n || item.Name === 'Finish or Extend Project' || item.Name === 'Prospective' || item.Name === 'Unblock Project') {\r\n acc.push(item.Id);\r\n return acc;\r\n }\r\n return acc;\r\n }, []);\r\n return defaultFilters;\r\n }\r\n\r\n ProjectsList = (props) => {\r\n const { CanCreateProject, prevPath } = this.props;\r\n const { defaultFilters } = this.state;\r\n return (\r\n \r\n {formTitle}\r\n {MSADetails && MSADetails.Contract}\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nLoginPage.propTypes = {\r\n isLoading: PropTypes.bool,\r\n signinRequest: PropTypes.func,\r\n error: PropTypes.bool.isRequired,\r\n};\r\n\r\nconst mapStateToProps = (state) => ({\r\n isLoading: state.authReducer.isLoading,\r\n error: state.loginReducer.error,\r\n version: state.versionReducer.version,\r\n message: state.loginReducer.message,\r\n});\r\n\r\nconst mapDispatchToProps = {\r\n signinRequest,\r\n};\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(LoginPage);\r\n","import React, { useState } from 'react';\r\nimport { IconButton, Tooltip, Typography } from '@material-ui/core';\r\nimport FileCopyIcon from '@material-ui/icons/FileCopy';\r\n\r\nexport const CellEmail = ({\r\n item,\r\n column,\r\n}) => {\r\n const email = item[column.Name];\r\n const [tooltipLabel, setTooltipLabel] = useState(email);\r\n\r\n const onTooltipCloseHandler = () => {\r\n setTooltipLabel(email);\r\n };\r\n\r\n const onIconButtonClickHandler = async (e) => {\r\n e.stopPropagation();\r\n let tooltipLabel = '';\r\n try {\r\n await navigator.clipboard.writeText(email);\r\n tooltipLabel = 'Copied into clipboard';\r\n } catch {\r\n tooltipLabel = 'Could not copy into clipboard';\r\n } finally {\r\n setTooltipLabel(tooltipLabel);\r\n }\r\n };\r\n\r\n return (\r\n \r\n
\r\n {this.getVersionText(version)}
\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\nMembersList.propTypes = {\r\n changeColumnsToDisplay: PropTypes.func,\r\n searchMembers: PropTypes.func,\r\n columnsToDisplay: PropTypes.array,\r\n members: PropTypes.array,\r\n offices: PropTypes.array,\r\n positions: PropTypes.array,\r\n projects: PropTypes.array,\r\n statuses: PropTypes.array,\r\n teamPositions: PropTypes.array,\r\n synchronizeEmployees: PropTypes.func,\r\n departments: PropTypes.array,\r\n user: PropTypes.object,\r\n showSyncModal: PropTypes.func,\r\n CanSyncAD: PropTypes.bool,\r\n getSelectedTab: PropTypes.func,\r\n totalCount: PropTypes.number.isRequired,\r\n listSettings: PropTypes.object,\r\n};\r\n\r\nexport default connect((store) => ({\r\n columnsToDisplay: store.membersReducer.columnsToDisplay,\r\n members: store.membersReducer.members,\r\n projects: store.filtersReducer.filters.Projects,\r\n employeeAssignmentStatuses: store.filtersReducer.filters.EmployeeAssignmentStatuses,\r\n locations: store.filtersReducer.filters.Locations,\r\n offices: store.filtersReducer.filters.Offices,\r\n statuses: store.filtersReducer.filters.EmployeeStatusesNew,\r\n positions: store.filtersReducer.filters.JobTitles,\r\n teamPositions: store.filtersReducer.filters.TeamPositions,\r\n departments: store.authReducer.departments,\r\n user: store.authReducer.user,\r\n totalCount: store.membersReducer.employeesTotalCount,\r\n certificatesOptions: store.filtersReducer.filters.Certificates,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.membersReducer.listSettings,\r\n}), {\r\n changeColumnsToDisplay,\r\n searchMembers,\r\n synchronizeEmployees,\r\n showSyncModal,\r\n getSelectedTab,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n setListSettings,\r\n resetMembers,\r\n})(MembersList);\r\n","import React from 'react';\r\nimport classNames from 'classnames';\r\nimport PropTypes from 'prop-types';\r\n\r\nimport '../vacations.css';\r\n\r\nconst\r\n WEEK_LENGTH = 7, // days count in a week\r\n USA_LAST_WEEK_DAY = 6, // last day in a week [0, .., 6] - Saturday\r\n USA_FIRS_WEEK_DAY = 0, // first day in a week [0, .., 6] - Sunday\r\n EUROPE_FIRST_WEEK_DAY = 1, // first day in a week [0, .., 6] - Monday\r\n USA_MAX_DAY_CELLS = 41,\r\n EUROPE_MAX_DAY_CELLS = 42;\r\n\r\nexport default class Month extends React.Component {\r\n renderDays = () => {\r\n const { dateInfo } = this.props;\r\n\r\n let\r\n fullDays = [],\r\n emptyCellsBefore = [];\r\n const\r\n emptyCellsAfter = [],\r\n month = [];\r\n\r\n for (let i = dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY; i <= dateInfo.firstDay; i++) { // empty cells before first calendar day\r\n emptyCellsBefore.push(\r\n \r\n this.scroll = scroll}\r\n >\r\n this.routeToEmployeeDetails(id)}\r\n setSortSettings={this.setSortSettings}\r\n sortColumnName={sortColumn}\r\n sortDirection={sortDirection}\r\n hideDots\r\n dontShowOptions\r\n fixedHeader\r\n config={{\r\n 'Type': {\r\n cell: CustomStatusCell,\r\n },\r\n 'Email': {\r\n cell: CellEmail,\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 if (emptyCellsBefore.length === WEEK_LENGTH) {\r\n emptyCellsBefore = [];\r\n }\r\n\r\n for (let i = 1; i <= dateInfo.daysNumber; i++) { // calendar days\r\n month.push(\r\n \r\n \r\n
);\r\n }\r\n\r\n this.renderPeriods(month);\r\n fullDays = emptyCellsBefore.concat(month).concat(emptyCellsAfter);\r\n return fullDays;\r\n }\r\n\r\n renderPeriods = (month) => {\r\n const { parseDate, dateInfo } = this.props;\r\n dateInfo.periods.length && dateInfo.periods.forEach(period => { // vacation periods\r\n if (parseDate(period.startDate).month === dateInfo.monthNumber && parseDate(period.endDate).month === dateInfo.monthNumber) { // full period in this month\r\n this.periodInSingleMonth(period, month);\r\n } else if (parseDate(period.startDate).month === dateInfo.monthNumber) { // end of period in next month\r\n this.periodFromStartDate(period, month);\r\n } else if (parseDate(period.endDate).month === dateInfo.monthNumber) { // start of period in prev month\r\n this.periodToEndDate(period, month);\r\n } else if (parseDate(period.startDate).month < dateInfo.monthNumber && parseDate(period.endDate).month > dateInfo.monthNumber) { // start of period in prev month and end of period in next month\r\n this.fullMonthPeriod(period, month);\r\n }\r\n });\r\n }\r\n\r\n getDateWeekDay = (day, isNeedPardate) => {\r\n const { parseDate, dateInfo: { monthNumber, year } } = this.props;\r\n const countDays = isNeedPardate ? parseDate(day).day : day;\r\n return parseDate(`${monthNumber + 1}/${countDays}/${year}`).weekDay;\r\n }\r\n\r\n getDateStyles = (dataSetting, period, i) => {\r\n const { dateInfo } = this.props;\r\n switch (dataSetting) {\r\n case 'start-date-style': {\r\n return [{\r\n 'first-selected-day':\r\n !(this.getDateWeekDay(period.startDate, true) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY)),\r\n },\r\n {\r\n 'single-selected-day':\r\n this.getDateWeekDay(period.startDate, true) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY),\r\n }];\r\n }\r\n case 'avarage-date-style': {\r\n return [{\r\n 'first-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY) || i === 1,\r\n },\r\n {\r\n 'last-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY) && i !== 1,\r\n },\r\n {\r\n 'single-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY) && i === 1,\r\n }];\r\n }\r\n case 'end-date-style': {\r\n return [{\r\n 'last-selected-day':\r\n !(this.getDateWeekDay(period.endDate, true) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY)),\r\n },\r\n {\r\n 'single-selected-day':\r\n this.getDateWeekDay(period.endDate, true) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY),\r\n }];\r\n }\r\n case 'current-date-to-end-month': {\r\n return [{\r\n 'first-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY),\r\n },\r\n {\r\n 'last-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY) || i === dateInfo.daysNumber,\r\n },\r\n {\r\n 'single-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY) && i === dateInfo.daysNumber,\r\n }];\r\n }\r\n case 'beginning-month-to-current-date': {\r\n return [{\r\n 'last-selected-day':\r\n !(this.getDateWeekDay(period.endDate, true) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY)),\r\n },\r\n {\r\n 'single-selected-day':\r\n this.getDateWeekDay(period.endDate, true) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY),\r\n }];\r\n }\r\n case 'full-month-style': {\r\n return [{\r\n 'first-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_FIRS_WEEK_DAY : EUROPE_FIRST_WEEK_DAY) || i === 1,\r\n },\r\n {\r\n 'last-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY) || i === dateInfo.daysNumber,\r\n },\r\n {\r\n 'single-selected-day':\r\n this.getDateWeekDay(i, false) === (dateInfo.USAWeekFormat ? USA_LAST_WEEK_DAY : USA_FIRS_WEEK_DAY) && i === 1,\r\n }];\r\n }\r\n default:\r\n return null;\r\n }\r\n }\r\n\r\n periodInSingleMonth = (period, month) => {\r\n const { parseDate, dateInfo } = this.props;\r\n\r\n if (parseDate(period.startDate).day !== parseDate(period.endDate).day) { // start of period\r\n month[parseDate(period.startDate).day - 1] = (\r\n \r\n {parseDate(period.startDate).day}\r\n
\r\n );\r\n }\r\n }\r\n\r\n periodFromStartDate = (period, month) => {\r\n const { parseDate, dateInfo } = this.props;\r\n\r\n if (parseDate(period.startDate).year === dateInfo.year) {\r\n month[parseDate(period.startDate).day - 1] = ( // start of period\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nMonth.propTypes = {\r\n dateInfo: PropTypes.object,\r\n parseDate: PropTypes.func,\r\n};\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nimport {\r\n editVacation,\r\n showAddVacationModal,\r\n setVacationToChange,\r\n} from 'pages/members/actions/membersActions';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nimport { getId } from 'services/location';\r\n\r\nimport '../vacations.css';\r\n\r\nexport class VacationTag extends React.Component {\r\n changeVacationRange = () => {\r\n const { setVacationToChange, showAddVacationModal, vacation } = this.props;\r\n\r\n setVacationToChange(vacation);\r\n showAddVacationModal();\r\n }\r\n\r\n render() {\r\n const {\r\n vacation,\r\n key,\r\n isEditable,\r\n selectedYear,\r\n showDialog,\r\n } = this.props;\r\n return (\r\n {dateInfo.title}
\r\n \r\n {\r\n weekDays.map((day, i) => (\r\n
\r\n \r\n {day[0]}\r\n
\r\n ))\r\n }\r\n \r\n {\r\n this.renderDays()\r\n }\r\n
\r\n \r\n {vacation.startDate} - {vacation.endDate} - {`${vacation.Duration} ${vacation.Duration > 1 ? 'days' : 'day'}`}\r\n {\r\n isEditable && (\r\n
\r\n );\r\n }\r\n}\r\n\r\nVacationTag.propTypes = {\r\n vacation: PropTypes.object,\r\n key: PropTypes.string,\r\n showAddVacationModal: PropTypes.func,\r\n setVacationToChange: PropTypes.func,\r\n};\r\n\r\nexport default connect(store => ({\r\n selectedYear: store.membersReducer.selectedYear,\r\n}), {\r\n editVacation,\r\n showAddVacationModal,\r\n setVacationToChange,\r\n showDialog,\r\n})(VacationTag);\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport moment from 'moment';\r\n\r\nimport Month from './components/month';\r\nimport VacationTag from './components/vacation-tag';\r\n\r\nimport Select from 'common/components/form-items/select/select';\r\nimport {\r\n getVacations,\r\n showAddVacationModal,\r\n setSelectedYear,\r\n} from '../../../actions/membersActions';\r\n\r\nimport './vacations.css';\r\n\r\nexport class Vacations extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n year: new Date().getFullYear() || '',\r\n years: [new Date().getFullYear()],\r\n employeeId: '',\r\n vacations: [],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { yearsToSelect, setSelectedYear } = this.props;\r\n const { year } = this.state;\r\n const years = [];\r\n\r\n for (let i = 0; i < yearsToSelect; i++) {\r\n years.push(year + i);\r\n }\r\n for (let i = 1; i < yearsToSelect; i++) {\r\n years.push(year - i);\r\n }\r\n this.setState({ years: years.sort() });\r\n setSelectedYear(year);\r\n }\r\n\r\n static getDerivedStateFromProps(prevProps, prevState) {\r\n const { employeeId, year } = prevState;\r\n\r\n if (prevProps.employeeId && prevProps.employeeId !== employeeId) {\r\n prevProps.getVacations(prevProps.employeeId, year);\r\n }\r\n\r\n return {\r\n employeeId: prevProps.employeeId,\r\n };\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n employeeId,\r\n vacations,\r\n selectedYear,\r\n getVacations,\r\n } = this.props;\r\n\r\n if (prevProps.employeeId !== employeeId) {\r\n this.setState({\r\n employeeId,\r\n });\r\n }\r\n\r\n if (prevProps.vacations !== vacations) {\r\n this.setState({\r\n vacations,\r\n });\r\n }\r\n\r\n if (prevProps.selectedYear !== selectedYear) {\r\n getVacations(employeeId, selectedYear);\r\n }\r\n }\r\n\r\n getNuberOfDaysInMonth = (year, month) => {\r\n return new Date(year, month, 0).getDate();\r\n }\r\n\r\n getFirstDayInMonth = (year, month) => {\r\n return new Date(year, month, 0).getDay();\r\n }\r\n\r\n parseDate = (date) => {\r\n return {\r\n day: new Date(date).getDate(),\r\n month: new Date(date).getMonth(),\r\n year: new Date(date).getFullYear(),\r\n weekDay: new Date(date).getDay(),\r\n };\r\n }\r\n\r\n handleChangeYear = ({ target }) => {\r\n const { setSelectedYear } = this.props;\r\n\r\n this.setState({\r\n year: target.value,\r\n });\r\n\r\n setSelectedYear(target.value);\r\n }\r\n\r\n showModal = () => {\r\n const { showAddVacationModal } = this.props;\r\n\r\n showAddVacationModal();\r\n }\r\n\r\n renderTags = (vacations) => {\r\n return vacations && vacations.map((vacation, i) => {\r\n const { isEditable } = this.props;\r\n\r\n vacation.startDate = moment(vacation.StartDate).format('MM/DD/YYYY');\r\n vacation.endDate = moment(vacation.EndDate).format('MM/DD/YYYY');\r\n\r\n return (\r\n \r\n isEditable && showDialog({\r\n item: vacation,\r\n url: `employees/${getId()}/vacations/${vacation.Id}`,\r\n entityId: getId(),\r\n searchUpdateSaga: 'employees/vacations',\r\n year: selectedYear,\r\n })}\r\n className='pointer'\r\n />\r\n
\r\n )\r\n }\r\n \r\n
\r\n \r\n \r\n \r\n Add New\r\n
\r\n )\r\n }\r\n \r\n
\r\n {\r\n isEditable && (\r\n \r\n {\r\n this.renderTags(vacations)\r\n }\r\n
\r\n \r\n {\r\n months.map((month, i) => {\r\n vacations && vacations.forEach(vacation => {\r\n (this.parseDate(vacation.startDate).year === year || this.parseDate(vacation.endDate).year === year)\r\n && (this.parseDate(vacation.startDate).month === i || this.parseDate(vacation.endDate).month === i)\r\n && periodsForMonth.push(vacation);\r\n });\r\n\r\n return (\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nVacations.propTypes = {\r\n vacations: PropTypes.array,\r\n getVacations: PropTypes.func,\r\n showAddVacationModal: PropTypes.func,\r\n employeeId: PropTypes.string,\r\n isEditable: PropTypes.bool,\r\n};\r\n\r\nexport default connect(store => ({\r\n vacations: store.membersReducer.vacations,\r\n selectedYear: store.membersReducer.selectedYear,\r\n}), {\r\n getVacations,\r\n showAddVacationModal,\r\n setSelectedYear,\r\n})(Vacations);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Link } from 'react-router-dom';\r\n\r\nexport class CellLinkForRedirect extends Component {\r\n transition = (id, property) => {\r\n const { transition, item } = this.props;\r\n return transition(id, property, item);\r\n }\r\n\r\n getRenderValue = (value, column) => {\r\n if (typeof value === 'number' && column.toFixed) {\r\n return value.toFixed(2);\r\n }\r\n return value;\r\n }\r\n\r\n render() {\r\n const { item, column, transition } = this.props;\r\n const renderValue = item[column.Id] && (item[column.Id].Name || item[column.Id]);\r\n return (\r\n \r\n {\r\n transition && item ? (\r\n \r\n \r\n \r\n {this.getRenderValue(renderValue, column)}\r\n \r\n \r\n \r\n ) : (\r\n \r\n {this.getRenderValue(renderValue, column)}\r\n \r\n )\r\n }\r\n
\r\n );\r\n }\r\n}\r\n\r\nCellLinkForRedirect.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport Select from '../../form-items/select/select';\r\n\r\nexport class CellSelect extends Component {\r\n onSelectChange = (e) => {\r\n const {\r\n item, column, config,\r\n } = this.props;\r\n const editItem = {\r\n ...item,\r\n [column.Id]: e.target.value,\r\n };\r\n config[column.Id].valueSetter(editItem);\r\n }\r\n\r\n render() {\r\n const {\r\n item,\r\n column,\r\n config,\r\n isHaveRights,\r\n } = this.props;\r\n const selectValue = item[column.Id].Id;\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellSelect.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport TextField from '../../form-items/input/text-field';\r\n\r\nexport class CellTextField extends Component {\r\n constructor(props) {\r\n super(props);\r\n const { item, column } = this.props;\r\n this.state = {\r\n value: item[column.Id],\r\n isTextField: false,\r\n };\r\n }\r\n\r\n toggleViewCell = () => {\r\n const { isTextField } = this.state;\r\n this.setState({\r\n isTextField: !isTextField,\r\n });\r\n }\r\n\r\n handleChange = ({ target }) => {\r\n this.setState({\r\n value: target.value,\r\n });\r\n }\r\n\r\n onBlur = () => {\r\n const { column, config, item } = this.props;\r\n const { value } = this.state;\r\n const { valueSetter } = config[column.Id];\r\n const newItem = {\r\n ...item,\r\n [column.Id]: value,\r\n };\r\n valueSetter(newItem, value);\r\n this.toggleViewCell();\r\n }\r\n\r\n render() {\r\n const {\r\n item,\r\n column,\r\n isHaveRights,\r\n config,\r\n } = this.props;\r\n const {\r\n value,\r\n isTextField,\r\n } = this.state;\r\n const showPlaceholderIfNull = config[column.Id] && config[column.Id].showPlaceholderIfNull;\r\n const isEditable = config[column.Id] && 'isEditable' in config[column.Id] ? config[column.Id].isEditable : true;\r\n return (\r\n \r\n {`${Name} has ${activeAssignments.length} active project assignments at the moment:`}\r\n
;\r\n\r\n return title;\r\n }\r\n\r\n getChangeBusinessLocationDialogTitle = () => {\r\n return 'You are going to change the Business Location of an employee, please note that list of National Holidays of the employee will be changed according to the new Business Location';\r\n }\r\n\r\n getLocationToShow = () => {\r\n const { baseBusinessLocations, Location } = this.props;\r\n\r\n const location = baseBusinessLocations.find(bl => bl.Id === Location);\r\n\r\n return Location && Location.Name || (location && location.Name) || '';\r\n }\r\n\r\n getResourceManagerToShow = () => {\r\n const { resourceManagers, ResourceManager } = this.props;\r\n\r\n const resourceManager = resourceManagers.find(rm => rm.Id === ResourceManager);\r\n\r\n return ResourceManager && ResourceManager.Name || (resourceManager && resourceManager.Name) || '';\r\n }\r\n\r\n getHrManagerToShow = () => {\r\n const { hrManagers, HrManager } = this.props;\r\n\r\n const hrManager = hrManagers.find(hr => hr.Id === HrManager);\r\n\r\n return HrManager && HrManager.Name || (hrManager && hrManager.Name) || '';\r\n }\r\n\r\n getOfficeBusinessLocations = () => {\r\n const { Office, businessLocations } = this.props;\r\n const officeBusinessLocations = businessLocations && businessLocations.find(bl => Office && bl.Office && bl.Office.Id === Office.Id);\r\n\r\n return officeBusinessLocations && officeBusinessLocations.BusinessLocations;\r\n }\r\n\r\n getBusinessLocationToShow = () => {\r\n const { BusinessLocation } = this.props;\r\n const officeBusinessLocations = this.getOfficeBusinessLocations();\r\n\r\n const businessLocation = officeBusinessLocations && officeBusinessLocations.find(bl => bl.Id === BusinessLocation);\r\n\r\n return BusinessLocation && BusinessLocation.Name || (businessLocation && businessLocation.Name) || '';\r\n }\r\n\r\n getCanEdit = () => {\r\n const { canEditCurrentEmployee, shouldRestrictInformation } = this.props;\r\n\r\n return canEditCurrentEmployee && !shouldRestrictInformation;\r\n }\r\n\r\n shouldShowDateOfDismissal = () => {\r\n const {\r\n DateOfDismissal, PlannedLeavingDate, LeavingNoticeDate, Status,\r\n } = this.props;\r\n\r\n // return (DateOfDismissal\r\n // && ((PlannedLeavingDate && LeavingNoticeDate && (moment(PlannedLeavingDate).diff(moment(), 'days') <= 0)))\r\n // || (Status && Status.Id === EMPLOYEES_STATUS_FORMER_ID));\r\n return true;\r\n }\r\n\r\n checkSaving = (value, field) => {\r\n const { data } = this.props;\r\n const { unsavedFields } = this.state;\r\n const requiredMessage = required(value, [], this.props, field);\r\n const isRequired = listOfFields.indexOf(field) >= 0;\r\n const isValid = !!(isRequired && data[field] === value);\r\n\r\n if (isRequired && !isValid && !requiredMessage) {\r\n this.setState({ unsavedFields: [...unsavedFields, field] });\r\n } else {\r\n this.setState({ unsavedFields: unsavedFields.filter(value => value !== field) });\r\n }\r\n }\r\n\r\n render() {\r\n const {\r\n isAdmin, BusinessTrip, Cell, DateOfBirth, DateOfDismissal, Email,\r\n Location, Notes, Office, Skype, StartDateInCompany, Status, handleSubmit, JobTitleId, JobTitleName, OfficeBeforeRelocate,\r\n allOffices, allStatuses, allJobTitles, allBusinessTrip, Name, data, UserRoles,\r\n BusinessLocation, baseBusinessLocations, resourceManagers, hrManagers, ResourceManager, HrManager, shouldRestrictInformation,\r\n LeavingNoticeDate, PlannedLeavingDate, BackFillType, BackFillDate, BackFillLink, hasBackFill, allBackFillTypes,\r\n } = this.props;\r\n const {\r\n copyMessage, isDialogOpen, showChangeStatusDialog, showChangeBusinessLocationDialog,\r\n unsavedFields,\r\n } = this.state;\r\n const allOfficeForRelocated = allOffices.filter(locationOption => locationOption.Id !== (Office && Office.Id));\r\n const businessLocationsToShow = this.getOfficeBusinessLocations();\r\n\r\n return (\r\n <>\r\n {isDialogOpen\r\n && - \r\n {activeAssignments.map((assignment, index) =>
- {assignment.Project} - {assignment.RoleName} )}\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 id: customer.Id,\r\n value: customer.Name,\r\n name: customer.Name,\r\n label: customer.Name,\r\n }))}\r\n onChange={(selectedOption) => {\r\n this.setState({ Client: selectedOption.value });\r\n }}\r\n styles={selectStyles}\r\n isDisabled={isEditMode}\r\n />\r\n
\r\n \r\n \r\n
\r\n \r\n {\r\n confirmToDelete &&
}\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 {employee.Name}\r\n
\r\n {isFormError && \r\n Employee information wasn’t stored while all mandatory fields weren’t filled\r\n
}\r\n \r\n {\r\n employeeDetails.Positions && this.getEmployeePositions(employeeDetails.Positions)\r\n }\r\n
\r\n \r\n
\r\n \r\n {showProjectInfoModal &&
\r\n ) : selectedTab === HOLIDAYS_TAB_INDEX ? (\r\n \r\n
\r\n {showAddHoliday && \r\n \r\n
\r\n }\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n
\r\n ) : selectedTab === CERTIFICATES_TAB_INDEX ? (\r\n <>\r\n {showAddCertificateModal && \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n {children}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n ADD SKILLS\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {skillError}\r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n
\r\n \r\n \r\n {id ? 'edit vacation' : 'add vacation'}\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Vacation already exists in this time period\r\n \r\n \r\n Apply
\r\n Cancel
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Choose office\r\n
\r\n \r\n
\r\n \r\n \r\n {\r\n syncableOffices.map((item, i) => )\r\n }\r\n
\r\n \r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nClientsListPage.propTypes = {\r\n columnsToDisplay: PropTypes.array,\r\n clients: PropTypes.array,\r\n searchClients: PropTypes.func,\r\n getSelectedTab: PropTypes.func,\r\n CanCreateClient: PropTypes.bool.isRequired,\r\n setListSettings: PropTypes.func,\r\n listSettings: PropTypes.object,\r\n};\r\n\r\nexport default connect((store) => ({\r\n columnsToDisplay: store.clientsReducer.columnsToDisplay,\r\n clients: store.clientsReducer.clients,\r\n listSettings: store.clientsReducer.listSettings,\r\n}), {\r\n searchClients,\r\n getSelectedTab,\r\n showDialog,\r\n destroy,\r\n setComponent,\r\n resetComponent,\r\n setClients,\r\n setListSettings,\r\n})(ClientsListPage);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nexport class CellLink extends Component {\r\n transition = (id, property) => {\r\n const { transition, item } = this.props;\r\n transition(id, property, item);\r\n }\r\n\r\n getRenderValue = (value, column) => {\r\n if (typeof value === 'number' && column.toFixed) {\r\n return value.toFixed(2);\r\n }\r\n return value;\r\n }\r\n\r\n render() {\r\n const { item, column } = this.props;\r\n const renderValue = item[column.Id] && (item[column.Id].Name || item[column.Id]);\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n this.transition(item.Id || item, column.Id)}>\r\n {this.getRenderValue(renderValue, column)}\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellLink.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport Dialog from '@material-ui/core/Dialog';\r\nimport DialogTitle from '@material-ui/core/DialogTitle';\r\nimport CustomIcon from '../../../../common/components/icon/Icon';\r\nimport DialogContent from '@material-ui/core/DialogContent';\r\nimport DialogActions from '@material-ui/core/DialogActions';\r\nimport Button from '../../../../common/components/redux-form/components/button';\r\nimport PropTypes from 'prop-types';\r\nimport Select from '../../../../common/components/form-items/select/select';\r\nimport TextField from '../../../../common/components/form-items/input/text-field';\r\nimport Checkbox from '../../../../common/components/form-items/checkbox/checkbox';\r\n\r\nclass WorkingPeriodRestrictionModal extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n SowTypeId: '',\r\n MaxPeriod: null,\r\n Interval: null,\r\n IsNotRestricted: true,\r\n isErrorForm: true,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.setDefaultEditData();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { editWorkingPeriodRestrictionObject } = this.props;\r\n if (prevProps.editWorkingPeriodRestrictionObject !== editWorkingPeriodRestrictionObject) {\r\n this.setDefaultEditData();\r\n }\r\n }\r\n\r\n setDefaultEditData = () => {\r\n const { editWorkingPeriodRestrictionObject, isEditMode } = this.props;\r\n if (isEditMode) {\r\n this.setState({\r\n SowTypeId: editWorkingPeriodRestrictionObject.SowType.Id,\r\n MaxPeriod: editWorkingPeriodRestrictionObject.MaxPeriod,\r\n Interval: editWorkingPeriodRestrictionObject.Interval,\r\n IsNotRestricted: editWorkingPeriodRestrictionObject.IsNotRestricted,\r\n }, this.checkForm);\r\n }\r\n }\r\n\r\n checkForm = () => {\r\n const { sowTypes } = this.props;\r\n const {\r\n SowTypeId, MaxPeriod, Interval, IsNotRestricted,\r\n } = this.state;\r\n\r\n const isSowTypeValid = sowTypes.find(item => item.Id === SowTypeId) || SowTypeId === 0;\r\n const isMaxPeriodValid = MaxPeriod > 0;\r\n const isIntervalValid = Interval > 0;\r\n\r\n const isInvalid = !(isSowTypeValid && (IsNotRestricted || (isMaxPeriodValid && isIntervalValid)));\r\n this.setState({\r\n isErrorForm: isInvalid,\r\n });\r\n }\r\n\r\n confirmAddWorkingPeriodRestriction = () => {\r\n const { confirmDialog, closeDialog, isEditMode } = this.props;\r\n const {\r\n isErrorForm, SowTypeId, MaxPeriod, Interval, IsNotRestricted,\r\n } = this.state;\r\n if (!isErrorForm) {\r\n confirmDialog({\r\n SowTypeId, MaxPeriod, Interval, IsNotRestricted,\r\n }, isEditMode);\r\n closeDialog();\r\n }\r\n }\r\n\r\n handleChangeData = (e) => {\r\n let value;\r\n\r\n switch (e.target.name) {\r\n case 'MaxPeriod':\r\n case 'Interval':\r\n // eslint-disable-next-line no-case-declarations\r\n const parsedValue = parseInt(e.target.value, 10);\r\n if (Number.isNaN(parsedValue) && e.target.value !== '') {\r\n return;\r\n }\r\n\r\n value = parsedValue;\r\n break;\r\n default:\r\n value = e.target.value;\r\n break;\r\n }\r\n\r\n this.setState({\r\n [e.target.name]: value,\r\n }, this.checkForm);\r\n }\r\n\r\n handleChangeIsNotRestricted = () => {\r\n const { IsNotRestricted } = this.state;\r\n this.setState({\r\n IsNotRestricted: !IsNotRestricted,\r\n MaxPeriod: null,\r\n Interval: null,\r\n }, this.checkForm);\r\n }\r\n\r\n render() {\r\n const { closeDialog, isEditMode, sowTypes } = this.props;\r\n const {\r\n SowTypeId, MaxPeriod, Interval, IsNotRestricted, isErrorForm,\r\n } = this.state;\r\n\r\n return (\r\n \r\n
\r\n {!IsNotRestricted && \r\n
}\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nClientDetailPage.propTypes = {\r\n client: PropTypes.object,\r\n getClientById: PropTypes.func,\r\n filterClientInfo: PropTypes.func,\r\n putClient: PropTypes.func,\r\n EditClientBasicInfo: PropTypes.bool,\r\n ManageClientContact: PropTypes.bool,\r\n CanCreateClient: PropTypes.bool,\r\n error: PropTypes.string,\r\n clearErrorMessage: PropTypes.func,\r\n selectedTab: PropTypes.number,\r\n getSelectedTab: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n listSettings: PropTypes.object,\r\n setListSettings: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n client: store.clientsReducer.clientInfo,\r\n error: store.clientsReducer.error,\r\n selectedTab: store.selectedTabReducer.selectedTab,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.clientsReducer.listSettings,\r\n settings: store.adminReducer.settings,\r\n sowTypes: store.clientsReducer.sowTypes,\r\n}), {\r\n getClientById,\r\n filterClientInfo,\r\n putClient,\r\n clearErrorMessage,\r\n getSelectedTab,\r\n showDialog,\r\n transitionToProjectData,\r\n setComponent,\r\n resetComponent,\r\n setListSettings,\r\n setChangeWorkingPeriodRestriction,\r\n createWorkingPeriodRestriction,\r\n updateWorkingPeriodRestriction,\r\n deleteWorkingPeriodRestriction,\r\n getSowTypes,\r\n})(ClientDetailPage);\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport Button from '../components/button';\r\nimport { required } from 'services/redux-form-validators.js';\r\nimport history from 'utils/history';\r\nimport './create-client-from.css';\r\nimport renderTextField from '../components/text-field';\r\nimport { Badge } from 'common/components/badges/badges';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { getColorFromString } from 'services/getColor';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container-assignment client-margin_top',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst validateName = (value, values, props, field) => {\r\n const error = props.clients.find(item => {\r\n return (value && (item.Name.toLowerCase() === value.toLowerCase()));\r\n });\r\n\r\n if (error) {\r\n return required(false, values, props, field, 'Client name already exists');\r\n }\r\n return required(value, values, props, field);\r\n};\r\n\r\n\r\nclass CreateClientStep1 extends React.Component {\r\n onSubmit = () => {\r\n const { destroy, onSubmit, data } = this.props;\r\n onSubmit(data);\r\n history.goBack();\r\n destroy();\r\n }\r\n\r\n onCancel = () => {\r\n const { destroy } = this.props;\r\n history.goBack();\r\n destroy();\r\n }\r\n\r\n render() {\r\n const { allData, onNextStep } = this.props;\r\n const companyName = (allData && allData.values ? allData.values.Name : 'Company Name').trim();\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n destroy: () => dispatch(destroy('CreateClient')),\r\n };\r\n};\r\n\r\nconst mapStateDispatchToProps = store => {\r\n const isFormReducerExists = store.form.CreateClient && store.form.CreateClient.values;\r\n return {\r\n data: isFormReducerExists && store.form.CreateClient.values,\r\n allData: isFormReducerExists && store.form.CreateClient,\r\n clients: store.clientsReducer.clients,\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateDispatchToProps,\r\n mapDispatchToProps,\r\n)(reduxForm({\r\n form: 'CreateClient',\r\n destroyOnUnmount: false,\r\n forceUnregisterOnUnmount: true,\r\n})(CreateClientStep1));\r\n","import React, { Component } from 'react';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nexport class ContactsList extends Component {\r\n render() {\r\n const { contacts, removeContacts } = this.props;\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n {\r\n client && client.Name ?
\r\n {\r\n CanCreateClient\r\n ? {error}
: null}\r\n\r\n
\r\n : null\r\n }\r\n \r\n
\r\n : null\r\n }\r\n \r\n Delete\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport Button from '../components/button';\r\nimport { required } from 'services/redux-form-validators.js';\r\nimport history from 'utils/history';\r\nimport renderTextField from '../components/text-field';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { regexForEmail } from 'utils/const-variable.js';\r\nimport { getCorrectSkype } from 'services/getCorrectSkype.js';\r\nimport { ContactsList } from 'pages/clients/components/common/contacts-list.js';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container-create_client',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst validateEmail = (value, values, props, field) => {\r\n const isEmailValid = regexForEmail.test(value);\r\n if (typeof value === 'undefined') {\r\n return false;\r\n }\r\n return required(isEmailValid, values, props, field, 'Incorrect Email');\r\n};\r\n\r\nconst validateSkype = (value, values, props, field) => {\r\n if (typeof value === 'undefined') {\r\n return false;\r\n }\r\n const result = getCorrectSkype(value);\r\n return required(result.valid, values, props, field, 'Incorrect Skype');\r\n};\r\n\r\nconst validateCell = (value) => {\r\n const isValidPhoneNumber = /^[.+](\\d[ ]?)+(\\s*)?$/;\r\n return value && !isValidPhoneNumber.test(value.trim()) ? 'Invalid Cell' : false;\r\n};\r\n\r\nclass CreateClientStep2 extends React.Component {\r\n onSubmit = () => {\r\n const {\r\n destroy, onSubmit, data, location,\r\n } = this.props;\r\n onSubmit(data);\r\n history.push({\r\n pathname: '/clients',\r\n state: location.state,\r\n });\r\n destroy();\r\n }\r\n\r\n addContacts = () => {\r\n const { addContacts, data } = this.props;\r\n addContacts(data);\r\n this.clearAllFields();\r\n }\r\n\r\n clearAllFields = () => {\r\n const { change } = this.props;\r\n change('contact.FirstName', '');\r\n change('contact.LastName', '');\r\n change('contact.JobTitle', '');\r\n change('contact.Email', '');\r\n change('contact.Cell', '');\r\n change('contact.Skype', '');\r\n }\r\n\r\n render() {\r\n const {\r\n allData,\r\n onBack,\r\n contacts,\r\n removeContacts,\r\n } = this.props;\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n destroy: () => dispatch(destroy('CreateClient')),\r\n change: (field, value) => dispatch(change('CreateClient', field, value)),\r\n };\r\n};\r\n\r\nconst mapStateDispatchToProps = store => {\r\n const isFormReducerExists = store.form.CreateClient && store.form.CreateClient.values;\r\n return {\r\n data: isFormReducerExists ? store.form.CreateClient.values : {},\r\n allData: isFormReducerExists ? store.form.CreateClient : {},\r\n };\r\n};\r\n\r\n\r\nexport default connect(\r\n mapStateDispatchToProps,\r\n mapDispatchToProps,\r\n)(reduxForm({\r\n form: 'CreateClient',\r\n destroyOnUnmount: false,\r\n forceUnregisterOnUnmount: true,\r\n})(CreateClientStep2));\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport history from 'utils/history';\r\nimport { addNewClient } from '../../actions/clientsActions';\r\nimport ProgressBarComponent from '../../../../common/components/progress-bar/progress-bar';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport './create-client.css';\r\nimport CreateClientStep1 from 'common/components/redux-form/create-client-form/create-client-form-step1';\r\nimport CreateClientStep2 from 'common/components/redux-form/create-client-form/create-client-form-step2';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\n\r\nexport class CreateClient extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n step: 0,\r\n Contacts: [],\r\n contact: {\r\n FirstName: '',\r\n LastName: '',\r\n JobTitle: '',\r\n Email: '',\r\n Cell: '',\r\n Skype: '',\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { setComponent } = this.props;\r\n setComponent({ returnButton: { text: 'CLIENTS', goToPreviousPage: this.goToClientsList } });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent } = this.props;\r\n resetComponent();\r\n }\r\n\r\n addContacts = (data) => {\r\n const { Contacts, contact } = this.state;\r\n const clientContact = {\r\n ...contact,\r\n ...data.contact,\r\n };\r\n const addContact = Contacts;\r\n addContact.push(clientContact);\r\n this.setState({\r\n Contacts: addContact,\r\n });\r\n }\r\n\r\n removeContacts = (contacts) => {\r\n const { Contacts } = this.state;\r\n this.setState({\r\n Contacts: Contacts.filter(e => e !== contacts),\r\n });\r\n }\r\n\r\n onNextStep = () => {\r\n this.setState({\r\n step: 1,\r\n });\r\n };\r\n\r\n onBack = () => {\r\n this.setState({\r\n step: 0,\r\n });\r\n };\r\n\r\n onSave = (values) => {\r\n const { addNewClient, location } = this.props;\r\n const { Contacts } = this.state;\r\n const newClient = {\r\n Name: values.Name,\r\n Contacts,\r\n };\r\n addNewClient(newClient, {\r\n pathname: '/clients',\r\n state: location.state,\r\n });\r\n }\r\n\r\n goToClientsList = () => {\r\n const { location } = this.props;\r\n history.push({ pathname: '/clients', state: location.state });\r\n }\r\n\r\n render() {\r\n const { step, Contacts } = this.state;\r\n const { location } = this.props;\r\n return (\r\n \r\n
\r\n \r\n
\r\n {\r\n contacts.map(e => (\r\n \r\n Name\r\n
\r\n \r\n Job title\r\n
\r\n \r\n Email\r\n
\r\n \r\n Cell\r\n
\r\n \r\n Skype\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n ))\r\n }\r\n \r\n {e.FirstName + ' ' + e.LastName}\r\n
\r\n \r\n {e.JobTitle}\r\n
\r\n \r\n {e.Email}\r\n
\r\n \r\n {e.Cell}\r\n
\r\n \r\n {e.Skype}\r\n
\r\n \r\n removeContacts(e)}\r\n >\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCreateClient.propTypes = {\r\n addNewClient: PropTypes.func,\r\n};\r\n\r\nexport default connect(\r\n () => ({}),\r\n {\r\n addNewClient,\r\n setComponent,\r\n resetComponent,\r\n },\r\n)(CreateClient);\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, change, initialize,\r\n} from 'redux-form';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport { connect } from 'react-redux';\r\nimport classNames from 'classnames';\r\nimport Button from '../components/button';\r\nimport { required } from 'services/redux-form-validators.js';\r\nimport renderTextField from '../components/text-field';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { regexForEmail } from 'utils/const-variable.js';\r\nimport { getCorrectSkype } from 'services/getCorrectSkype.js';\r\nimport { ContactsList } from 'pages/clients/components/common/contacts-list.js';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container-create_client',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nconst isEmptyField = (value) => {\r\n if (typeof value === 'undefined' || value === null || value === '') return true;\r\n return false;\r\n};\r\n\r\nconst validateEmail = (value, values, props, field) => {\r\n const isEmailValid = regexForEmail.test(value);\r\n if (isEmptyField(value)) {\r\n return false;\r\n }\r\n return required(isEmailValid, values, props, field, 'Incorrect Email');\r\n};\r\n\r\nconst validateSkype = (value, values, props, field) => {\r\n if (isEmptyField(value)) {\r\n return false;\r\n }\r\n const result = getCorrectSkype(value);\r\n return required(result.valid, values, props, field, 'Incorrect Skype');\r\n};\r\n\r\nconst validateCell = (value) => {\r\n const isValidPhoneNumber = /^[.+](\\d[ ]?)+(\\s*)?$/;\r\n return value && !isValidPhoneNumber.test(value.trim()) ? 'Invalid Cell' : false;\r\n};\r\n\r\nclass ClientContactsForm extends React.Component {\r\n componentDidMount() {\r\n const { data, initialize } = this.props;\r\n initialize(data);\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { data, initialize } = this.props;\r\n if (isObjectNotEquals(prevProps.data, data)) {\r\n initialize(data);\r\n }\r\n }\r\n\r\n onSubmit = () => {\r\n const { onSubmit, allData } = this.props;\r\n onSubmit(allData.values);\r\n }\r\n\r\n addContacts = () => {\r\n const { allData, addContacts } = this.props;\r\n addContacts(allData.values);\r\n this.clearAllFields();\r\n }\r\n\r\n clearAllFields = () => {\r\n const { change } = this.props;\r\n change('FirstName', '');\r\n change('LastName', '');\r\n change('JobTitle', '');\r\n change('Email', '');\r\n change('Cell', '');\r\n change('Skype', '');\r\n }\r\n\r\n render() {\r\n const {\r\n allData,\r\n onCancel,\r\n contacts,\r\n removeContacts,\r\n data,\r\n isHaveRights,\r\n } = this.props;\r\n const isDisabled = (allData && allData.syncErrors) || !allData;\r\n const isHasContacts = contacts && !contacts.length;\r\n\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('ClientContactsForm', data)),\r\n destroy: () => dispatch(destroy('ClientContactsForm')),\r\n change: (field, value) => dispatch(change('ClientContactsForm', field, value)),\r\n };\r\n};\r\n\r\nconst mapStateDispatchToProps = store => {\r\n const isFormReducerExists = store.form.ClientContactsForm && store.form.ClientContactsForm.values;\r\n return {\r\n allData: isFormReducerExists ? store.form.ClientContactsForm : {},\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateDispatchToProps,\r\n mapDispatchToProps,\r\n)(reduxForm({\r\n form: 'ClientContactsForm',\r\n})(ClientContactsForm));\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport { addClientInfo } from '../../actions/clientsActions';\r\nimport history from 'utils/history';\r\nimport ClientContactsForm from 'common/components/redux-form/create-client-form/client-contacts-form';\r\n\r\nexport class CreateContacts extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n contact: {\r\n FirstName: '',\r\n LastName: '',\r\n JobTitle: '',\r\n Email: '',\r\n Cell: '',\r\n Skype: '',\r\n },\r\n Contacts: [],\r\n };\r\n }\r\n\r\n addContacts = (data) => {\r\n const { Contacts, contact } = this.state;\r\n const user = {\r\n FirstName: data.FirstName.trim(),\r\n LastName: data.LastName.trim(),\r\n Cell: data.Cell.trim(),\r\n Email: data.Email.trim(),\r\n JobTitle: data.JobTitle.trim(),\r\n Skype: data.Skype.trim(),\r\n };\r\n const clientContact = {\r\n ...contact,\r\n ...user,\r\n };\r\n const addContact = Contacts;\r\n addContact.push(clientContact);\r\n this.setState({\r\n Contacts: addContact,\r\n });\r\n }\r\n\r\n removeContacts = (contacts) => {\r\n const { Contacts } = this.state;\r\n this.setState({\r\n Contacts: Contacts.filter(e => e !== contacts),\r\n });\r\n }\r\n\r\n onSave = () => {\r\n const { Contacts } = this.state;\r\n const { location, addClientInfo } = this.props;\r\n const clientObject = {\r\n Contacts,\r\n idClient: location.pathname.split('/')[2],\r\n };\r\n addClientInfo(clientObject);\r\n history.push({ pathname: `/clients/${location.pathname.split('/')[2]}`, state: location.state });\r\n }\r\n\r\n onCancel = () => {\r\n const { location } = this.props;\r\n history.push({ pathname: `/clients/${location.pathname.split('/')[2]}`, state: location.state });\r\n }\r\n\r\n render() {\r\n const {\r\n Contacts,\r\n contact,\r\n } = this.state;\r\n return (\r\n \r\n
\r\n {step === 0 && \r\n ADD NEW CLIENT\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCreateContacts.propTypes = {\r\n addClientInfo: PropTypes.func,\r\n};\r\n\r\nexport default connect(\r\n () => ({}),\r\n {\r\n addClientInfo,\r\n },\r\n)(CreateContacts);\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport { editContactInfo } from '../../actions/clientsActions';\r\nimport history from 'utils/history';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport ClientContactsForm from 'common/components/redux-form/create-client-form/client-contacts-form';\r\n\r\nexport class EditContacts extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n contact: {\r\n FirstName: '',\r\n LastName: '',\r\n JobTitle: '',\r\n Email: '',\r\n Cell: '',\r\n Skype: '',\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.getContactEditData();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { contacts } = this.props;\r\n if (isObjectNotEquals(prevProps.contacts, contacts)) {\r\n this.getContactEditData();\r\n }\r\n }\r\n\r\n getContactEditData = () => {\r\n const { contacts, location } = this.props;\r\n if (typeof contacts !== 'undefined') {\r\n const currentContact = contacts.find(contact => contact.Id === location.pathname.split('/')[4]);\r\n this.setState({\r\n contact: currentContact,\r\n });\r\n } else {\r\n this.onCancel();\r\n }\r\n }\r\n\r\n onCancel = () => {\r\n const { location } = this.props;\r\n history.push({ pathname: `/clients/${location.pathname.split('/')[2]}`, state: location.state });\r\n }\r\n\r\n onSave = (data) => {\r\n const { location, editContactInfo } = this.props;\r\n const contractObj = {\r\n contact: {\r\n FirstName: data.FirstName.trim(),\r\n LastName: data.LastName.trim(),\r\n Cell: data.Cell && data.Cell.trim(),\r\n Email: data.Email && data.Email.trim(),\r\n JobTitle: data.JobTitle && data.JobTitle.trim(),\r\n Skype: data.Skype && data.Skype.trim(),\r\n },\r\n clientId: location.pathname.split('/')[2],\r\n contactId: data.Id,\r\n };\r\n editContactInfo(contractObj);\r\n history.push({ pathname: `/clients/${location.pathname.split('/')[2]}`, state: location.state });\r\n }\r\n\r\n render() {\r\n const { contact } = this.state;\r\n const { ManageClientContact } = this.props;\r\n return (\r\n \r\n ADD NEW CONTACTS\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nEditContacts.propTypes = {\r\n contacts: PropTypes.array,\r\n editContactInfo: PropTypes.func,\r\n ManageClientContact: PropTypes.bool,\r\n};\r\n\r\nexport default connect(\r\n (store) => ({\r\n contacts: store.clientsReducer.clientInfo.Contacts,\r\n }),\r\n {\r\n editContactInfo,\r\n },\r\n)(EditContacts);\r\n","import React, { Component, Fragment } from 'react';\r\nimport { Switch, Route, Redirect } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport ClientsListPage from './components/clients-list/clients-list-page';\r\nimport ClientDetailPage from './components/clients-detail/clients-details-page';\r\nimport CreateClient from './components/create-client/create-client';\r\nimport CreateContacts from './components/client-contacts/create-contacts';\r\nimport EditContacts from './components/client-contacts/edit-contacts';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { resetListSettings } from './actions/clientsActions';\r\nimport './clients-page.css';\r\n\r\nexport class ClientsPage extends Component {\r\n componentWillUnmount() {\r\n const { resetListSettings } = this.props;\r\n resetListSettings();\r\n }\r\n\r\n ClientsList = (props) => {\r\n const { CanCreateClient, ManageClientContact } = this.props;\r\n return (\r\n \r\n EDIT CONTACTS\r\n
\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nOfficesListPage.propTypes = {\r\n offices: PropTypes.array,\r\n columnsToDisplay: PropTypes.array,\r\n setListSettings: PropTypes.func,\r\n searchOffice: PropTypes.func,\r\n listSettings: PropTypes.object,\r\n};\r\n\r\nexport default connect((store) => ({\r\n offices: store.officesReducer.offices,\r\n columnsToDisplay: store.officesReducer.columnsToDisplay,\r\n listSettings: store.officesReducer.listSettings,\r\n}), {\r\n searchOffice: searchOffices,\r\n setSelectedTab,\r\n getOffices,\r\n setComponent,\r\n resetComponent,\r\n setListSettings,\r\n})(OfficesListPage);\r\n","import React from 'react';\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport { connect } from 'react-redux';\r\nimport { Badge } from 'common/components/badges/badges';\r\nimport { getColorFromString } from 'services/getColor';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\n\r\nimport { changeOfficeBasicInfo } from 'common/actions/reduxFormActions.js';\r\nimport { required } from 'services/redux-form-validators.js';\r\nimport renderTogglingSearchDropdown from '../components/toggling/toggling-search-dropdown';\r\nimport renderTogglingTextField from '../components/toggling/toggling-text-field';\r\n\r\nimport './office-redux-form.css';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container-offices',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nclass OfficeBasicInfoForm extends React.Component {\r\n componentDidUpdate(prevProps) {\r\n const { data, initialize } = this.props;\r\n if (isObjectNotEquals(prevProps.data, data)) {\r\n initialize(data);\r\n }\r\n }\r\n\r\n onChange = (data, value, prevValue, field) => {\r\n const {\r\n change, allCountries, changeOfficeBasicInfo,\r\n } = this.props;\r\n const newValue = (allOptions) => allOptions.find(item => item.Id === value).Name;\r\n switch (field) {\r\n case 'CountryId':\r\n change('CountryName', newValue(allCountries));\r\n this.onBlur();\r\n break;\r\n case 'LDapPaths':\r\n changeOfficeBasicInfo();\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n\r\n onBlur = () => {\r\n const { changeOfficeBasicInfo } = this.props;\r\n changeOfficeBasicInfo();\r\n }\r\n\r\n render() {\r\n const {\r\n isEditable, Name, DomainName, Address, CountryId, CountryName,\r\n allCountries, handleSubmit,\r\n } = this.props;\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n initialize: data => dispatch(initialize('OfficeBasicInfoForm', data)),\r\n destroy: () => dispatch(destroy('OfficeBasicInfoForm')),\r\n change: (field, value) => dispatch(change('OfficeBasicInfoForm', field, value)),\r\n changeOfficeBasicInfo: () => dispatch(changeOfficeBasicInfo()),\r\n };\r\n};\r\n\r\nexport default connect(state => {\r\n const isFormReducerExists = state.form.OfficeBasicInfoForm && state.form.OfficeBasicInfoForm.values;\r\n return {\r\n Address: isFormReducerExists ? state.form.OfficeBasicInfoForm.values.Address : '',\r\n CountryId: isFormReducerExists ? state.form.OfficeBasicInfoForm.values.CountryId : '',\r\n DomainName: isFormReducerExists && state.form.OfficeBasicInfoForm.values.DomainName,\r\n Name: isFormReducerExists && state.form.OfficeBasicInfoForm.values.Name,\r\n CountryName: isFormReducerExists && state.form.OfficeBasicInfoForm.values.CountryName,\r\n LDapPaths: isFormReducerExists && state.form.OfficeBasicInfoForm.values.LDapPaths,\r\n };\r\n}, mapDispatchToProps)(reduxForm({\r\n form: 'OfficeBasicInfoForm',\r\n})(OfficeBasicInfoForm));\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport history from 'utils/history';\r\nimport { List } from 'common/components/list/list';\r\nimport classNames from 'classnames';\r\nimport { setSelectedTab } from '../../../../common/actions/selectedTabActions';\r\nimport * as PropTypes from 'prop-types';\r\nimport { getId } from '../../../../services/location';\r\nimport {\r\n clearErrorMessage, getOfficeById, updateOfficeData, updateLdap,\r\n loadHolidays, addHoliday, updateHoliday, deleteHoliday, resetOfficeDetails,\r\n addBusinessLocation, deleteOfficeBusinessLocation, loadOfficeBusinessLocations, updateBusinessLocation,\r\n} from '../../actions/officesActions';\r\nimport moment from 'moment';\r\nimport { sortFilterList } from '../../../../common/components/list/sortList';\r\nimport CustomIcon from '../../../../common/components/icon/Icon';\r\nimport OfficeBasicInfoForm from 'common/components/redux-form/office-basic-info-form/office-basic-info-form.js';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { showAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport { CellTextField } from 'common/components/list/custom-cell/cell-toogle-textfield';\r\nimport { CellDatePicker } from 'common/components/list/custom-cell/cell-toogle-datepicker';\r\nimport { CellSelect } from 'common/components/list/custom-cell/cell-employee-level';\r\nimport Tabs from 'common/components/tabs/tabs';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport DatePicker from 'common/components/form-items/date-picker/date-picker';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport Select from 'common/components/form-items/select/select';\r\nimport { getFilters } from 'common/actions/filtersActions';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\n\r\nimport './offices-details.css';\r\n\r\nconst FIRST_MOUNTH_ON_YEAR = 0;\r\nconst LAST_MOUNTH_ON_YEAR = 11;\r\nconst FIRST_DAY_OF_MOUNTH = 1;\r\nconst LAST_DAY_OF_MOUNTH = 31;\r\nconst DEFAULT_DELETE_DIALOG_TITLE = 'Please confirm you want to delete?';\r\n\r\nexport class OfficesDetailPage extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n office: {},\r\n officeId: '',\r\n changeInputFields: {},\r\n selectedTab: 0,\r\n LdapPaths: [],\r\n newCalendarDate: null,\r\n newCalendarDescription: '',\r\n newCalendarLocation: '',\r\n columnsToDisplay: [\r\n {\r\n Name: 'Ldap Path', Id: 'Name', deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n columnsForCalendar: {\r\n Locations: [{\r\n Name: 'Location', Id: 'Location', className: 'without-width-col', deleteArrow: 'delete-arrow', isObject: true,\r\n }],\r\n Holidays: [\r\n {\r\n Name: 'Business Location', Id: 'Location', className: 'big-col', deleteArrow: 'delete-arrow', isObject: true,\r\n },\r\n {\r\n Name: 'Date', Id: 'Date', className: 'big-col', deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Description', Id: 'Description', className: 'without-width-col', deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n },\r\n blockAddPath: false,\r\n showAddPathField: false,\r\n blockSaveLdapPath: false,\r\n addNewPath: { Name: '' },\r\n confirmToDelete: false,\r\n dataForDeletePath: {},\r\n dataForDeleteHoliday: {},\r\n officeBasicInfoData: {},\r\n showAddHoliday: false,\r\n isValidAddHoliday: false,\r\n yearForTheHolidays: moment().format('YYYY'),\r\n years: [],\r\n holidays: [],\r\n detailsId: getId(),\r\n deleteDialogTitle: DEFAULT_DELETE_DIALOG_TITLE,\r\n copyLocationName: '',\r\n copyLocationOffices: [],\r\n showCopyLocationFields: false,\r\n blockSaveLocation: false,\r\n blockAddLocation: false,\r\n yearForTheCopyHolidays: moment().format('YYYY'),\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const filtersNames = ['Locations'];\r\n const {\r\n getOfficeById, clearErrorMessage, loadHolidays, getFilters, setComponent, loadOfficeBusinessLocations,\r\n } = this.props;\r\n const { yearForTheHolidays } = this.state;\r\n const id = getId();\r\n getOfficeById(id);\r\n this.setState({\r\n officeId: id,\r\n });\r\n getFilters(filtersNames);\r\n loadOfficeBusinessLocations(id);\r\n clearErrorMessage();\r\n loadHolidays(id, yearForTheHolidays);\r\n this.setOptionYears();\r\n setComponent({ returnButton: { text: 'Offices', goToPreviousPage: this.goToOfficesList } });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { selectedTab, officeDetails, holidays } = this.props;\r\n if (prevProps.selectedTab !== selectedTab) {\r\n this.setState({\r\n selectedTab,\r\n });\r\n }\r\n if (prevProps.officeDetails !== officeDetails) {\r\n this.setDefaultData();\r\n this.setState({\r\n office: officeDetails,\r\n });\r\n this.setCorrectDataForList();\r\n }\r\n if (prevProps.holidays !== holidays) {\r\n this.setState({\r\n holidays,\r\n });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent, resetOfficeDetails } = this.props;\r\n resetOfficeDetails();\r\n resetComponent();\r\n }\r\n\r\n setCorrectDataForList = () => {\r\n const { officeDetails } = this.props;\r\n const newFormatData = [];\r\n officeDetails.LdapPaths.forEach((item, index) => {\r\n newFormatData.push({ Id: index, Name: item });\r\n });\r\n this.setState({\r\n LdapPaths: newFormatData,\r\n });\r\n }\r\n\r\n setDefaultData = () => {\r\n const { officeDetails } = this.props;\r\n this.setState({\r\n officeBasicInfoData: {\r\n Id: getId(),\r\n Address: officeDetails.Address,\r\n CountryId: officeDetails.Country.Id,\r\n CountryName: officeDetails.Country.Name,\r\n DomainName: officeDetails.DomainName,\r\n Name: officeDetails.Name,\r\n },\r\n });\r\n };\r\n\r\n canEditOffice = () => {\r\n const { EditOfficeBasicInfo, user, isAdmin } = this.props;\r\n const { officeId } = this.state;\r\n return EditOfficeBasicInfo && (user.UserOfficeId === officeId || isAdmin);\r\n }\r\n\r\n canEditLdap = () => {\r\n const { ManageOfficeLdapPath, user, isAdmin } = this.props;\r\n const { officeId } = this.state;\r\n return ManageOfficeLdapPath && (user.UserOfficeId === officeId || isAdmin);\r\n }\r\n\r\n canEditCalendar = () => {\r\n const { ManageOfficeCalendar, user, isAdmin } = this.props;\r\n const { officeId } = this.state;\r\n return ManageOfficeCalendar && (user.UserOfficeId === officeId || isAdmin);\r\n }\r\n\r\n updateHoliday = (item) => {\r\n const {\r\n updateHoliday, showAlertDialog, businessLocations,\r\n } = this.props;\r\n const { yearForTheHolidays } = this.state;\r\n\r\n const businessLocation = businessLocations.find(location => typeof item.Location === 'object'\r\n ? location.Id === item.Location.Id\r\n : location.Id === item.Location);\r\n const officeId = getId();\r\n\r\n if (!item.Description.length) {\r\n showAlertDialog('Description cannot be empty');\r\n loadHolidays(getId(), yearForTheHolidays);\r\n return false;\r\n }\r\n\r\n const updateHolidayData = {\r\n Id: item.Id,\r\n Date: moment(item.Date).format('L'),\r\n Description: item.Description,\r\n LocationId: item.Location.Id || item.Location,\r\n OfficeId: getId(),\r\n Year: yearForTheHolidays,\r\n };\r\n if (businessLocation.IsPrimary) {\r\n updateHolidayData.Location = {\r\n Name: businessLocation.Name,\r\n BaseBusinessLocationId: item.Location,\r\n OfficeId: officeId,\r\n Offices: [officeId],\r\n };\r\n }\r\n\r\n updateHoliday(updateHolidayData);\r\n }\r\n\r\n goToOfficesList = () => {\r\n const { location } = this.props;\r\n history.push({ pathname: '/offices', state: location.state });\r\n }\r\n\r\n setOptionYears = () => {\r\n const years = [new Date().getFullYear()];\r\n for (let i = 1; i < 10; i++) {\r\n years.push(new Date().getFullYear() - i);\r\n years.push(new Date().getFullYear() + i);\r\n }\r\n this.setState({ years: years.sort() });\r\n }\r\n\r\n addNewOffice = () => {\r\n const { blockAddPath } = this.state;\r\n if (!blockAddPath) {\r\n this.setState({\r\n showAddPathField: true,\r\n addNewPath: { Name: '' },\r\n blockAddPath: true,\r\n });\r\n }\r\n };\r\n\r\n toogleConfirmWindow = (path, dialogTitle) => {\r\n const { confirmToDelete, selectedTab } = this.state;\r\n this.setState(selectedTab === 0 ? {\r\n confirmToDelete: !confirmToDelete,\r\n dataForDeletePath: path && path.Name ? path : {},\r\n deleteDialogTitle: dialogTitle,\r\n } : {\r\n confirmToDelete: !confirmToDelete,\r\n dataForDeleteHoliday: path && path.Id ? path : {},\r\n deleteDialogTitle: dialogTitle,\r\n });\r\n }\r\n\r\n showConfirmToDelete = (path) => {\r\n this.toogleConfirmWindow(path, DEFAULT_DELETE_DIALOG_TITLE);\r\n }\r\n\r\n confirmDeletePath = () => {\r\n const {\r\n dataForDeletePath, selectedTab,\r\n } = this.state;\r\n if (selectedTab === 0) {\r\n this.deleteLdapPath(dataForDeletePath);\r\n } else {\r\n this.applyDeleteHolidays();\r\n }\r\n this.toogleConfirmWindow();\r\n }\r\n\r\n applyDeleteHolidays = () => {\r\n const { deleteHoliday } = this.props;\r\n const { dataForDeleteHoliday, yearForTheHolidays } = this.state;\r\n\r\n const deleteHolidayData = {\r\n holiday: dataForDeleteHoliday,\r\n officeId: getId(),\r\n year: yearForTheHolidays,\r\n };\r\n\r\n deleteHoliday(deleteHolidayData);\r\n }\r\n\r\n deleteLdapPath = (path) => {\r\n const { office } = this.state;\r\n const ldapPaths = office.LdapPaths;\r\n this.setState({\r\n office: {\r\n ...office,\r\n LdapPaths: ldapPaths.filter((item, i) => i !== path.Id),\r\n },\r\n }, () => {\r\n const { updateLdap } = this.props;\r\n const { office, officeId } = this.state;\r\n updateLdap(office.LdapPaths, officeId);\r\n });\r\n }\r\n\r\n editLdapPath = (path) => {\r\n const { office } = this.state;\r\n const { showAlertDialog } = this.props;\r\n office.LdapPaths.some(item => item === path.Name)\r\n ? showAlertDialog('Ldap paths cannot be the same')\r\n : this.setState({\r\n office: {\r\n ...office,\r\n LdapPaths: office.LdapPaths.map((item, index) => index === path.Id ? path.Name : item),\r\n },\r\n }, () => {\r\n const { updateLdap } = this.props;\r\n const { office, officeId } = this.state;\r\n updateLdap(office.LdapPaths, officeId);\r\n });\r\n }\r\n\r\n getNewPathObj = ({ target }) => {\r\n const { addNewPath } = this.state;\r\n this.setState({\r\n addNewPath: {\r\n ...addNewPath,\r\n [target.name]: target.value,\r\n },\r\n }, this.newPathValidation);\r\n }\r\n\r\n newPathValidation = () => {\r\n const { addNewPath } = this.state;\r\n this.setState({\r\n blockSaveLdapPath: !!addNewPath.Name.trim(),\r\n });\r\n };\r\n\r\n newLdapPathCancel = () => {\r\n this.setState({\r\n addNewPath: { Name: '' },\r\n showAddPathField: false,\r\n blockSaveLdapPath: false,\r\n blockAddPath: false,\r\n });\r\n }\r\n\r\n newLdapPathApply = () => {\r\n const { blockSaveLdapPath, addNewPath, office } = this.state;\r\n const { showAlertDialog } = this.props;\r\n if (blockSaveLdapPath) {\r\n office.LdapPaths.some(item => item === addNewPath.Name)\r\n ? showAlertDialog('Ldap paths cannot be the same')\r\n : this.setState({\r\n office: {\r\n ...office,\r\n LdapPaths: [...office.LdapPaths, addNewPath.Name],\r\n },\r\n }, () => {\r\n const { updateLdap } = this.props;\r\n const { office, officeId } = this.state;\r\n updateLdap(office.LdapPaths, officeId);\r\n });\r\n this.setState({\r\n addNewPath: { Name: '' },\r\n showAddPathField: false,\r\n blockSaveLdapPath: false,\r\n blockAddPath: false,\r\n });\r\n }\r\n }\r\n\r\n onTab = (tab) => {\r\n this.setState({\r\n selectedTab: tab,\r\n });\r\n }\r\n\r\n showAddHoliday = () => {\r\n this.setState({\r\n showAddHoliday: true,\r\n showCopyLocationFields: false,\r\n blockAddLocation: false,\r\n });\r\n }\r\n\r\n cancelAddHoliday = () => {\r\n this.setState({\r\n showAddHoliday: false,\r\n newCalendarDate: null,\r\n newCalendarDescription: '',\r\n newCalendarLocation: '',\r\n isValidAddHoliday: false,\r\n });\r\n }\r\n\r\n applyAddHoliday = () => {\r\n const {\r\n newCalendarDate, newCalendarDescription, newCalendarLocation, isValidAddHoliday, yearForTheHolidays,\r\n } = this.state;\r\n const { addHoliday, businessLocations } = this.props;\r\n\r\n const businessLocation = businessLocations.find(item => item.Id === newCalendarLocation);\r\n const officeId = getId();\r\n\r\n if (isValidAddHoliday) {\r\n const newHolidayData = {\r\n Date: moment(newCalendarDate).format('L'),\r\n Description: newCalendarDescription,\r\n LocationId: newCalendarLocation,\r\n OfficeId: officeId,\r\n year: yearForTheHolidays,\r\n };\r\n if (businessLocation.IsPrimary) {\r\n newHolidayData.Location = {\r\n Name: `${businessLocation.Name}`,\r\n BaseBusinessLocationId: newCalendarLocation,\r\n OfficeId: officeId,\r\n Offices: [officeId],\r\n };\r\n }\r\n\r\n addHoliday(newHolidayData);\r\n this.cancelAddHoliday();\r\n }\r\n }\r\n\r\n validateAddHoliday = () => {\r\n const { newCalendarDate, newCalendarDescription, newCalendarLocation } = this.state;\r\n this.setState({\r\n isValidAddHoliday: !!(newCalendarDate && newCalendarDescription.length && newCalendarLocation.toString().length),\r\n });\r\n }\r\n\r\n onChandeNewCalendarDate = (date) => {\r\n this.setState({\r\n newCalendarDate: moment(date).format('L'),\r\n }, this.validateAddHoliday);\r\n }\r\n\r\n onChandeNewCalendarDescription = (event) => {\r\n this.setState({\r\n newCalendarDescription: event.target.value,\r\n }, this.validateAddHoliday);\r\n }\r\n\r\n onChangeNewCalendarLocation = (event) => {\r\n this.setState({\r\n newCalendarLocation: event.target.value,\r\n }, this.validateAddHoliday);\r\n }\r\n\r\n showDeleteHolidayModal = ({ item }) => {\r\n const dialogTitle = `Please confirm you want to delete ${moment(item.Date).format('MM-DD')} ${item.Description}?`;\r\n\r\n this.toogleConfirmWindow(item, dialogTitle);\r\n }\r\n\r\n handleChangeYear = ({ target }) => {\r\n const { loadHolidays } = this.props;\r\n this.setState({\r\n yearForTheHolidays: target.value,\r\n });\r\n loadHolidays(getId(), target.value);\r\n }\r\n\r\n handleChangeYearForCopy = ({ target }) => {\r\n this.setState({\r\n yearForTheCopyHolidays: target.value,\r\n }, this.copyLocationValidation);\r\n }\r\n\r\n copyLocation = (item) => {\r\n const { blockAddLocation } = this.state;\r\n if (!blockAddLocation) {\r\n this.setState({\r\n locationToCopy: item,\r\n showCopyLocationFields: true,\r\n addLocation: { Name: '' },\r\n blockAddLocation: true,\r\n showAddHoliday: false,\r\n });\r\n }\r\n }\r\n\r\n copyLocationCancel = () => {\r\n this.setState({\r\n copyLocationName: '',\r\n copyLocationOffices: [],\r\n showCopyLocationFields: false,\r\n blockSaveLocation: false,\r\n blockAddLocation: false,\r\n });\r\n }\r\n\r\n copyLocationApply = () => {\r\n const {\r\n businessLocations, addBusinessLocation, updateBusinessLocation,\r\n } = this.props;\r\n const {\r\n locationToCopy, copyLocationName, blockSaveLocation, yearForTheCopyHolidays,\r\n } = this.state;\r\n\r\n if (blockSaveLocation) {\r\n const businessLocationToCopy = businessLocations.find(item => item.Id === locationToCopy.Location.Id);\r\n const baseBusinessLocation = businessLocations.find(item => item.Id === copyLocationName);\r\n const officesIds = businessLocationToCopy.Offices.map(office => office.Id);\r\n\r\n const data = {\r\n Name: `${baseBusinessLocation.Name}`,\r\n OfficeDaysOff: locationToCopy.Holidays.map(holiday => ({\r\n Date: moment(holiday.Date).set('year', yearForTheCopyHolidays).format('L'),\r\n Description: holiday.Description,\r\n })),\r\n year: yearForTheCopyHolidays,\r\n };\r\n\r\n if (baseBusinessLocation.IsPrimary) {\r\n data.OfficeId = getId();\r\n data.Offices = officesIds;\r\n data.BaseBusinessLocationId = copyLocationName;\r\n\r\n addBusinessLocation(data);\r\n } else {\r\n data.Id = baseBusinessLocation.Id;\r\n data.OfficeId = baseBusinessLocation.OfficeId;\r\n data.Offices = baseBusinessLocation.Offices.map(office => office.Id);\r\n data.BaseBusinessLocationId = baseBusinessLocation.BaseBusinessLocation.Id;\r\n data.EmployeeId = baseBusinessLocation.Employee ? baseBusinessLocation.Employee.Id : null;\r\n\r\n updateBusinessLocation(data);\r\n }\r\n\r\n this.copyLocationCancel();\r\n this.setState({\r\n yearForTheHolidays: yearForTheCopyHolidays,\r\n });\r\n }\r\n }\r\n\r\n copyLocationValidation = () => {\r\n const { holidays } = this.props;\r\n const { copyLocationName, yearForTheCopyHolidays } = this.state;\r\n const holidaysExists = holidays.find(item => item.Location.Id === copyLocationName\r\n && item.YearsWithHolidays\r\n && item.YearsWithHolidays.find(year => year === parseInt(yearForTheCopyHolidays, 10)));\r\n const isValid = !holidaysExists;\r\n this.setState({\r\n blockSaveLocation: isValid,\r\n });\r\n }\r\n\r\n setNewLocationName = ({ target }) => {\r\n this.setState({\r\n copyLocationName: target.value,\r\n }, this.copyLocationValidation);\r\n }\r\n\r\n showDeleteBusinessLocationModal = ({ item }) => {\r\n this.setState({\r\n showDialogToDeleteBusinessLocation: true,\r\n businessLocationToDelete: item.Location,\r\n });\r\n }\r\n\r\n closeDeleteBusinessLocationModal = () => {\r\n this.setState({\r\n showDialogToDeleteBusinessLocation: false,\r\n businessLocationToDelete: '',\r\n });\r\n }\r\n\r\n applyDeleteBusinessLocationModal = () => {\r\n const { deleteOfficeBusinessLocation, officeDetails } = this.props;\r\n const { businessLocationToDelete, yearForTheHolidays } = this.state;\r\n\r\n const deleteBusinessLocationData = {\r\n businessLocation: businessLocationToDelete,\r\n officeId: getId(),\r\n officeName: officeDetails.Name && officeDetails.Name,\r\n year: yearForTheHolidays,\r\n };\r\n\r\n deleteOfficeBusinessLocation(deleteBusinessLocationData);\r\n this.closeDeleteBusinessLocationModal();\r\n }\r\n\r\n render() {\r\n const {\r\n columnsToDisplay, officeBasicInfoData, selectedTab, newCalendarDate, newCalendarDescription, newCalendarLocation, showAddHoliday, holidays,\r\n columnsForCalendar, LdapPaths, showAddPathField, blockAddPath, addNewPath, confirmToDelete, isValidAddHoliday,\r\n yearForTheHolidays, years, deleteDialogTitle, showCopyLocationFields, blockSaveLocation, copyLocationName, showDialogToDeleteBusinessLocation,\r\n yearForTheCopyHolidays,\r\n } = this.state;\r\n const {\r\n countries, showAlertDialog, businessLocations,\r\n } = this.props;\r\n return (\r\n \r\n {\r\n confirmToDelete ?
: null}\r\n {showCopyLocationFields && (\r\n \r\n
\r\n ) : selectedTab === 1 ? (\r\n \r\n {this.canEditLdap() ? \r\n
: null}\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n {showAddHoliday ? \r\n \r\n
: null}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Apply\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 Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nBillingListComponent.propTypes = {\r\n columnsToDisplay: PropTypes.array,\r\n changeColumnsToDisplay: PropTypes.func,\r\n searchBilling: PropTypes.func,\r\n resetBillingDetails: PropTypes.func,\r\n totalCount: PropTypes.number.isRequired,\r\n setListSettings: PropTypes.func,\r\n listSettings: PropTypes.object,\r\n};\r\n\r\nexport default connect((store) => ({\r\n columnsToDisplay: store.billingReducer.columnsToDisplay,\r\n listSettings: store.billingReducer.listSettings,\r\n projects: [...store.projectsReducer.projects],\r\n isLoading: store.loadingReducer.isLoading,\r\n // totalCount: store.projectsReducer.billingTotalCount,\r\n}), {\r\n changeColumnsToDisplay,\r\n searchBilling,\r\n setBillingDetails,\r\n resetBillingDetails,\r\n getSelectedTab,\r\n setComponent,\r\n resetComponent,\r\n setListSettings,\r\n})(BillingListComponent);\r\n","import React, { Component } from 'react';\r\nimport CustomIcon from 'common/components/icon/Icon.js';\r\nimport './no-editable-block.css';\r\n\r\nclass NoEditableItemBlock extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showHintPopup: false,\r\n };\r\n }\r\n\r\n showHintPopup = () => {\r\n this.setState({\r\n showHintPopup: true,\r\n });\r\n }\r\n\r\n hideHintPopup = () => {\r\n this.setState({\r\n showHintPopup: false,\r\n });\r\n }\r\n\r\n render() {\r\n const {\r\n label, value, spanValueStyles, blockClassName, handleValueBlockClick, isArray,\r\n showQuestion, questionText,\r\n } = this.props;\r\n const { showHintPopup } = this.state;\r\n return (\r\n \r\n \r\n this.routeToProjectDetails(id)}\r\n onDeleteClick={showDialog}\r\n setSortSettings={this.setSortSettings}\r\n sortColumnName={sortColumn}\r\n sortDirection={sortDirection}\r\n hideDots\r\n dontShowOptions\r\n fixedHeader\r\n config={{\r\n 'Status': { cell: CustomStatusCell },\r\n }}\r\n />\r\n \r\n
\r\n \r\n \r\n \r\n {showQuestion && \r\n
}\r\n \r\n \r\n {questionText}\r\n
}\r\n \r\n {!isArray\r\n ? <>{value && {value}}\r\n :
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default NoEditableItemBlock;\r\n","import React, { Component } from 'react';\r\nimport HighlightOffIcon from '@material-ui/icons/HighlightOff';\r\nimport CheckCircleOutlineIcon from '@material-ui/icons/CheckCircleOutline';\r\nimport PropTypes from 'prop-types';\r\n\r\nexport class CellBillingRoleCheckbox extends Component {\r\n render() {\r\n const {\r\n item,\r\n } = this.props;\r\n return (\r\n \r\n {value.map(element => {element.name})}\r\n
}\r\n \r\n {item.Actual === '0'\r\n ?
\r\n );\r\n }\r\n}\r\n\r\nCellBillingRoleCheckbox.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nexport class CellSimpleCheckbox extends Component {\r\n render() {\r\n const {\r\n item, column,\r\n } = this.props;\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellSimpleCheckbox.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from '../../icon/Icon';\r\nimport HighlightOffIcon from '@material-ui/icons/HighlightOff';\r\n\r\nexport class CellFiles extends Component {\r\n render() {\r\n const { column, item } = this.props;\r\n const files = item[column.Id];\r\n return (\r\n \r\n {\r\n label && \r\n }\r\n
\r\n );\r\n }\r\n}\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport '../redux-form.css';\r\n\r\nexport default class renderInputFile extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n file: {\r\n name: '',\r\n file: null,\r\n },\r\n isFullDataForSend: false,\r\n };\r\n }\r\n\r\n send = (uploadedFile) => {\r\n const { postFile } = this.props;\r\n const { isFullDataForSend } = this.state;\r\n if (isFullDataForSend) {\r\n postFile(uploadedFile);\r\n }\r\n }\r\n\r\n onChangeFile = (event) => {\r\n const { changeEditForm } = this.props;\r\n const { file } = this.state;\r\n this.setState({\r\n file: {\r\n ...file,\r\n [event.target.name]: event.target.files[0],\r\n name: event.target.files[0].name,\r\n },\r\n isFullDataForSend: true,\r\n }, () => {\r\n const { file } = this.state;\r\n const { postFile } = this.props;\r\n changeEditForm && changeEditForm(event, file, postFile, 'files');\r\n });\r\n }\r\n\r\n onFormSubmit = (event) => {\r\n const { handleChangeForm } = this.props;\r\n const { file } = this.state;\r\n event.preventDefault();\r\n if (handleChangeForm) {\r\n handleChangeForm(file);\r\n } else {\r\n const formData = new FormData();\r\n formData.append('file', file.file);\r\n formData.append('name', file.name);\r\n this.send(formData);\r\n }\r\n this.resetFile();\r\n }\r\n\r\n resetFile = () => {\r\n const file = document.getElementById('file');\r\n file.value = '';\r\n this.setState({\r\n file: {\r\n name: '',\r\n file: null,\r\n },\r\n isFullDataForSend: false,\r\n });\r\n }\r\n\r\n render() {\r\n const {\r\n error, accept, errorTitle, formClassName, label, styles, showAsterix, postFile,\r\n } = this.props;\r\n // const isDisabledForm = isDisabled !== undefined ? isDisabled || !isFullDataForSend : !isFullDataForSend;\r\n return (\r\n \r\n );\r\n }\r\n}\r\n\r\nrenderInputFile.propTypes = {\r\n postFile: PropTypes.func.isRequired,\r\n error: PropTypes.bool,\r\n accept: PropTypes.string.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\n\r\nimport Dialog from '@material-ui/core/Dialog';\r\nimport DialogActions from '@material-ui/core/DialogActions';\r\nimport DialogContent from '@material-ui/core/DialogContent';\r\nimport DialogTitle from '@material-ui/core/DialogTitle';\r\n\r\nimport {\r\n Field, reduxForm, destroy, initialize, change,\r\n} from 'redux-form';\r\nimport renderTextField from 'common/components/redux-form//components/text-field';\r\nimport renderMultiSuggestBox from 'common/components/redux-form/components/multi-suggest';\r\nimport renderCheckbox from 'common/components/redux-form/components/check-box';\r\nimport renderInputFile from 'common/components/redux-form/components/input-type-file';\r\nimport Button from 'common/components/redux-form/components/button';\r\nimport { formHandleSubmit } from 'utils/formHandleSubmit';\r\nimport { required } from 'services/redux-form-validators.js';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\n\r\nconst defaultStyles = {\r\n container: 'redux-form__field-container standart-container add-feedback__content-block',\r\n label: 'redux-form__label',\r\n field: 'field',\r\n fieldContent: 'field__view-content standart-content-padding',\r\n fieldError: 'field__error-container',\r\n fieldView: 'field__view-container',\r\n};\r\n\r\nclass BillingJustificationModal extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n initialize, initData,\r\n } = this.props;\r\n initialize(initData);\r\n }\r\n\r\n componentDidUpdate() { }\r\n\r\n componentWillUnmount() {\r\n const { destroy } = this.props;\r\n destroy();\r\n }\r\n\r\n confirmJustificationModal = () => {\r\n const {\r\n confirmDialog,\r\n valid, formData,\r\n } = this.props;\r\n if (valid) {\r\n confirmDialog(formData);\r\n }\r\n }\r\n\r\n\r\n onChange = (fieldData, value, prevValue, field) => {\r\n const { change } = this.props;\r\n switch (field) {\r\n case 'files':\r\n change('Attachment', typeof prevValue !== 'undefined' ? [...prevValue, value] : [value]);\r\n break;\r\n default: break;\r\n }\r\n };\r\n\r\n render() {\r\n const {\r\n closeDialog,\r\n valid,\r\n formData,\r\n editMode,\r\n } = this.props;\r\n\r\n return (\r\n \r\n
\r\n \r\n {meta.error}\r\n
\r\n )\r\n }\r\n {\r\n customMassageValidation && (\r\n \r\n {customMassageValidation}\r\n
\r\n )\r\n }\r\n \r\n {isShowConfirmationDialog\r\n ? (
\r\n \r\n \r\n {`${billingDetails.Project} — ${billingDetails.Contract} : ${billingDetails.Period}`}\r\n {billingDetails.Status}\r\n
)}\r\n \r\n {isShowChangeStatus ? (\r\n {`${billingDetails.Project} — ${billingDetails.Contract} : ${billingDetails.Period}`}\r\n
) : (\r\n
\r\n billingDetails.TotalHours ? 'error_color' : ''}`,\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 Overtime\r\n \r\n {billingDetails && billingDetails.JustificationOvertime\r\n ? (billingDetails && billingDetails.JustificationOvertime.find(item => !item.Attachment.length)\r\n ?
\r\n \r\n \r\n \r\n \r\n Add Justification\r\n
\r\n \r\n \r\n Other\r\n \r\n {billingDetails && billingDetails.JustificationOther\r\n ? (billingDetails && billingDetails.JustificationOther.find(item => !item.Attachment.length)\r\n ?
\r\n \r\n \r\n \r\n \r\n Add Justification\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n Add Invoice\r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ManageUsers;\r\n","import { useDispatch, useSelector } from 'react-redux';\r\nimport { sortList } from '../../../../common/components/list/sortList';\r\nimport { useEffect } from 'react';\r\nimport { resetComponent, setComponent } from '../../../../common/actions/headerActions';\r\nimport { resetListSettings, resetUsers, searchUsers } from '../../actions/adminActions';\r\nimport { closeManageUserConfirmation } from '../../actions/editUserConfirmationActions';\r\n\r\nexport const useSortedUsers = () => useSelector((state) => {\r\n const {\r\n users,\r\n listSettings: {\r\n sortColumn,\r\n sortDirection,\r\n },\r\n } = state.adminReducer;\r\n\r\n return sortList(users, sortColumn, sortDirection);\r\n});\r\n\r\nexport const useHeader = () => {\r\n const dispatch = useDispatch();\r\n const usersAmount = useSelector((state) => state.adminReducer.users.length);\r\n\r\n useEffect(() => {\r\n dispatch(setComponent({ title: `Users (${usersAmount})` }));\r\n }, [usersAmount]);\r\n};\r\n\r\nexport const useReset = () => {\r\n const dispatch = useDispatch();\r\n\r\n const reset = () => {\r\n dispatch(resetComponent());\r\n dispatch(resetListSettings());\r\n dispatch(resetUsers());\r\n dispatch(closeManageUserConfirmation());\r\n };\r\n\r\n useEffect(() => {\r\n reset();\r\n\r\n return () => {\r\n reset();\r\n };\r\n }, []);\r\n};\r\n\r\nexport const useSearch = () => {\r\n const dispatch = useDispatch();\r\n const searchValue = useSelector((state) => state.adminReducer.listSettings.searchValue);\r\n\r\n useEffect(() => {\r\n dispatch(searchUsers(searchValue));\r\n }, [searchValue]);\r\n};\r\n","import * as React from 'react';\r\nimport MultiSelect from './multi-select';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\n\r\nconst allOption = { Id: 'all', Name: 'All' };\r\n\r\nclass MultiSelectAll extends React.Component {\r\n onChange = (Id) => {\r\n const { onChange, selected, options = [] } = this.props;\r\n const allCheckedOptions = options.map(option => option.Id).sort();\r\n if (Id === allOption.Id) {\r\n const checkedOptions = isObjectNotEquals([...selected].sort(), allCheckedOptions) ? allCheckedOptions : [];\r\n onChange(checkedOptions);\r\n return;\r\n }\r\n const value = selected.includes(Id)\r\n ? selected.filter((option => option !== Id))\r\n : [...selected, Id];\r\n\r\n onChange(value);\r\n }\r\n\r\n render() {\r\n const { options, selected } = this.props;\r\n const checkedOptions = isObjectNotEquals(\r\n [...selected].sort(),\r\n options.map(option => option.Id).sort(),\r\n ) ? selected : [allOption.Id, ...selected];\r\n\r\n const newOptions = [allOption, ...options];\r\n\r\n return \r\n
\r\n \r\n {\r\n roles.map((item, i) => {\r\n const checked = checkedRoles.some(role => role === item.Id);\r\n const isAdmin = item.Name === ADMIN_ROLE_NAME;\r\n const isApiAccess = item.Name === API_ACCESS_ROLE_NAME;\r\n const isApiAccessChecked = checkedRoles.find(checkedRoleId => checkedRoleId === roles.find(role => role.Name === API_ACCESS_ROLE_NAME).Id);\r\n const disabled = (!isAdmin && isDisabled)\r\n || (isApiAccess && !checked && checkedRoles && checkedRoles.length)\r\n || (!isApiAccess && isApiAccessChecked);\r\n return (\r\n \r\n \r\n {item.Name === 'API Access' && checked && (\r\n
\r\n );\r\n }\r\n}\r\n\r\nRenderRoleTypes.propTypes = {\r\n roles: PropTypes.array.isRequired,\r\n isDisabled: PropTypes.bool.isRequired,\r\n onChange: PropTypes.func.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nexport class Checkbox extends Component {\r\n render() {\r\n const {\r\n checked, onClick, label, name, disabled,\r\n } = this.props;\r\n return (\r\n \r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nCheckbox.propTypes = {\r\n checked: PropTypes.bool,\r\n onClick: PropTypes.func,\r\n label: PropTypes.string,\r\n name: PropTypes.string,\r\n};\r\n","export const defaultData = [\r\n {\r\n HasSiteAccess: {\r\n label: 'Site Access',\r\n },\r\n IsNotificationsEnable: {\r\n label: 'Notifications',\r\n },\r\n HasFinancialAccess: {\r\n label: 'Finance Access',\r\n },\r\n AddToCCInNotifications: {\r\n label: 'Admin CC Notifications',\r\n },\r\n label: 'Basic Settings',\r\n },\r\n {\r\n CanCreateClient: {\r\n label: 'Create new client',\r\n },\r\n EditClientBasicInfo: {\r\n label: 'Edit client information',\r\n },\r\n ManageClientContact: {\r\n label: 'Edit client contact',\r\n },\r\n label: 'Client',\r\n },\r\n {\r\n EditOfficeBasicInfo: {\r\n label: 'Edit office info',\r\n },\r\n ManageOfficeCalendar: {\r\n label: 'Edit calendar',\r\n },\r\n ManageOfficeLdapPath: {\r\n label: 'Edit ldap-path',\r\n },\r\n label: 'Office',\r\n },\r\n {\r\n CanSyncAD: {\r\n label: 'Can sync AD',\r\n },\r\n EditEmployeeBasicInfo: {\r\n label: 'Edit employee info',\r\n },\r\n ManageEmployeeSkills: {\r\n label: 'Edit employee skills',\r\n },\r\n ManageEmployeeVacations: {\r\n label: 'Edit employee vacation',\r\n },\r\n ManageEmployeeResume: {\r\n label: 'Edit employee resume',\r\n },\r\n ManageEmployeeCertificates: {\r\n label: 'Edit employee certificates',\r\n },\r\n ViewEmployeesAssignedToProject: {\r\n label: 'View employees assigned to the project'\r\n },\r\n label: 'Employee',\r\n },\r\n {\r\n CanCreateProject: {\r\n label: 'Create project',\r\n },\r\n EditProjectBasicInfo: {\r\n label: 'Edit basic info',\r\n },\r\n EditProjectBasicFinanceInfo: {\r\n label: 'Edit finance info',\r\n },\r\n ManageProjectContracts: {\r\n label: 'Edit contracts',\r\n },\r\n ManageProjectRoles: {\r\n label: 'Edit roles',\r\n },\r\n ManageProjectRoleAssignments: {\r\n label: 'Edit assignments',\r\n },\r\n label: 'Project',\r\n },\r\n];\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Checkbox } from './checkbox';\r\nimport { defaultData } from './utils';\r\n\r\nexport class Permissions extends Component {\r\n renderGropCheckbox = (group, userPermissions) => {\r\n const { onClick, isAdmin } = this.props;\r\n const checboxes = [];\r\n for (const key in group) {\r\n if (key !== 'label') {\r\n checboxes.push(\r\n \r\n
\r\n )}\r\n \r\n );\r\n })\r\n }\r\n \r\n {group.label}\r\n {this.renderGropCheckbox(group, userPermissions)}\r\n
\r\n );\r\n });\r\n };\r\n\r\n render() {\r\n const { permissions } = this.props;\r\n return (\r\n \r\n {this.renderCheckboxesForPermissions(permissions)}\r\n
\r\n );\r\n }\r\n}\r\n\r\nPermissions.propTypes = {\r\n permissions: PropTypes.object.isRequired,\r\n onClick: PropTypes.func.isRequired,\r\n};\r\n","const DEFAULT_GROUPS_PERMISSIONS = {\r\n APIAccess: {\r\n HasSiteAccess: true,\r\n },\r\n HR: {\r\n HasSiteAccess: true,\r\n IsNotificationsEnable: true,\r\n ManageClientContact: true,\r\n EditEmployeeBasicInfo: true,\r\n ManageEmployeeSkills: true,\r\n ManageEmployeeVacations: true,\r\n ManageEmployeeResume: true,\r\n CanSyncAD: true,\r\n ManageProjectRoleAssignments: true,\r\n ManageEmployeeCertificates: true,\r\n },\r\n AccountManager: {\r\n HasSiteAccess: true,\r\n HasFinancialAccess: true,\r\n IsNotificationsEnable: true,\r\n CanCreateClient: true,\r\n EditClientBasicInfo: true,\r\n ManageClientContact: true,\r\n CanCreateProject: true,\r\n EditProjectBasicInfo: true,\r\n EditProjectBasicFinanceInfo: true,\r\n ManageProjectContracts: true,\r\n ManageProjectRoles: true,\r\n ManageProjectRoleAssignments: true,\r\n },\r\n EngineeringManager: {\r\n HasSiteAccess: true,\r\n IsNotificationsEnable: true,\r\n ManageClientContact: true,\r\n ManageProjectRoleAssignments: true,\r\n ManageEmployeeSkills: true,\r\n ManageEmployeeVacations: true,\r\n ManageEmployeeCertificates: true,\r\n ViewEmployeesAssignedToProject: true,\r\n },\r\n OfficeDirector: {\r\n HasSiteAccess: true,\r\n HasFinancialAccess: true,\r\n IsNotificationsEnable: true,\r\n ManageClientContact: true,\r\n EditOfficeBasicInfo: true,\r\n ManageOfficeCalendar: true,\r\n ManageOfficeLdapPath: true,\r\n EditEmployeeBasicInfo: true,\r\n ManageEmployeeSkills: true,\r\n ManageEmployeeVacations: true,\r\n ManageEmployeeResume: true,\r\n CanSyncAD: true,\r\n CanCreateProject: true,\r\n EditProjectBasicInfo: true,\r\n EditProjectBasicFinanceInfo: true,\r\n ManageProjectContracts: true,\r\n ManageProjectRoles: true,\r\n ManageProjectRoleAssignments: true,\r\n ManageEmployeeCertificates: true,\r\n },\r\n DeliveryManager: {\r\n HasSiteAccess: true,\r\n HasFinancialAccess: true,\r\n IsNotificationsEnable: true,\r\n CanCreateClient: true,\r\n EditClientBasicInfo: true,\r\n ManageClientContact: true,\r\n CanCreateProject: true,\r\n EditProjectBasicInfo: true,\r\n EditProjectBasicFinanceInfo: true,\r\n ManageProjectContracts: true,\r\n ManageProjectRoles: true,\r\n ManageProjectRoleAssignments: true,\r\n ManageEmployeeCertificates: true,\r\n ViewEmployeesAssignedToProject: true,\r\n },\r\n FinanceManager: {\r\n HasSiteAccess: true,\r\n HasFinancialAccess: true,\r\n IsNotificationsEnable: true,\r\n CanCreateClient: true,\r\n EditClientBasicInfo: true,\r\n ManageClientContact: true,\r\n EditProjectBasicFinanceInfo: true,\r\n ManageProjectContracts: true,\r\n },\r\n Admin: {\r\n HasSiteAccess: true,\r\n HasFinancialAccess: true,\r\n IsNotificationsEnable: true,\r\n AddToCCInNotifications: true,\r\n CanCreateClient: true,\r\n EditClientBasicInfo: true,\r\n ManageClientContact: true,\r\n EditOfficeBasicInfo: true,\r\n ManageOfficeCalendar: true,\r\n ManageOfficeLdapPath: true,\r\n EditEmployeeBasicInfo: true,\r\n ManageEmployeeSkills: true,\r\n ManageEmployeeVacations: true,\r\n ManageEmployeeResume: true,\r\n CanSyncAD: true,\r\n CanCreateProject: true,\r\n EditProjectBasicInfo: true,\r\n EditProjectBasicFinanceInfo: true,\r\n ManageProjectContracts: true,\r\n ManageProjectRoles: true,\r\n ManageProjectRoleAssignments: true,\r\n ManageEmployeeCertificates: true,\r\n ViewEmployeesAssignedToProject: true,\r\n },\r\n Accountant: {\r\n HasSiteAccess: true,\r\n HasFinancialAccess: true,\r\n IsNotificationsEnable: true,\r\n ReadBillings: true,\r\n ManageBillings: true,\r\n SyncMinioStorage: true,\r\n },\r\n};\r\n\r\nexport const getCorrectPermissionsGroup = (choosenRoles, listRoles) => {\r\n let permissions = {};\r\n choosenRoles.forEach((role) => {\r\n listRoles.forEach((item) => {\r\n if (item.Id === role) {\r\n const permissionKey = item.Name.replace(' ', '');\r\n permissions = {\r\n ...permissions,\r\n ...DEFAULT_GROUPS_PERMISSIONS[permissionKey],\r\n };\r\n }\r\n });\r\n });\r\n return permissions;\r\n};\r\n","import React, { Component } from 'react';\r\nimport Modal from '../../../../common/components/modal/modal';\r\nimport { connect } from 'react-redux';\r\nimport * as PropTypes from 'prop-types';\r\nimport { closeModal } from '../../actions/modalActions';\r\nimport './add-modal.css';\r\nimport classNames from 'classnames';\r\nimport MultiSuggestBox from '../../../../common/components/form-items/multi-value-suggestbox/multi-value-suggestbox';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport Button from 'common/components/form-items/button/button';\r\nimport {\r\n addNewUser, getUserOffices,\r\n} from '../../actions/adminActions';\r\nimport { sortList } from '../../../../common/components/list/sortList';\r\nimport { Badge } from '../../../../common/components/badges/badges';\r\nimport { getColorFromString } from '../../../../services/getColor';\r\nimport {\r\n ADMIN_ROLE_NAME, API_ACCESS_ROLE_NAME, ENGINEERING_MANAGER_ROLE_NAME, DELIVARY_MANAGER_ROLE_NAME,\r\n} from '../../../../utils/const-variable';\r\nimport isEmptyObject from '../../../../utils/isEmptyObject';\r\nimport sortByAplhabet from 'utils/sortByAplhabet';\r\nimport CustomIcon from '../../../../common/components/icon/Icon';\r\nimport { RenderRoleTypes } from './components/renderRoleType';\r\nimport { Permissions } from './components/permissions';\r\nimport { getCorrectPermissionsGroup } from './components/getCorrectPermissionsGroup';\r\nimport { showUpdateUserConfirmation } from '../../actions/editUserConfirmationActions';\r\n\r\nexport class AdminModal extends Component {\r\n constructor(props) {\r\n super(props);\r\n const { modalType, userDetails, employeesRoles } = this.props;\r\n this.state = {\r\n isModalFieldsRequired: !modalType,\r\n employees: [],\r\n user: userDetails || {},\r\n isAddNew: modalType,\r\n roles: [],\r\n employeesRoles,\r\n convertedRoles: [],\r\n isDisabled: false,\r\n adminId: '',\r\n dataPermissions: {},\r\n selectedUserOffices: [],\r\n initialRoleIsApiAccess: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { isAddNew } = this.state;\r\n const {\r\n userDetails, getUserOffices, officesOptions,\r\n } = this.props;\r\n this.setDefaultData();\r\n this.setAdminId();\r\n this.setEmployeesOptions();\r\n !isAddNew && getUserOffices(userDetails.Id);\r\n isAddNew && this.setUserOffices(officesOptions.filter(office => !office.IsDisabled).map(office => office.Id));\r\n if (userDetails && !isAddNew) {\r\n this.setUsers();\r\n }\r\n if (userDetails.Permissions) {\r\n this.setPermissions(userDetails.Permissions);\r\n }\r\n this.checkInitialRoles();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { isAddNew } = this.state;\r\n const {\r\n userDetails, employeesRoles, userOffices, officesOptions,\r\n } = this.props;\r\n if (userOffices !== prevProps.userOffices) {\r\n const offices = userOffices && userOffices.length ? userOffices : officesOptions.map(office => office.Id);\r\n this.setUserOffices(offices);\r\n }\r\n if (prevProps.employeesRoles !== employeesRoles) {\r\n this.setAdminId();\r\n }\r\n if (prevProps.userDetails !== userDetails && !isAddNew) {\r\n this.setUsers();\r\n }\r\n }\r\n\r\n setDefaultData = () => {\r\n const { employees, userDetails } = this.props;\r\n const { isAddNew, user } = this.state;\r\n this.setState({\r\n employees: this.getDataForMultiBox(employees),\r\n user: userDetails,\r\n });\r\n if (isAddNew) {\r\n this.setState({\r\n convertedRoles: this.convertRoles(),\r\n });\r\n } else {\r\n this.setState({\r\n convertedRoles: this.setRoleForUser(user.Roles),\r\n });\r\n }\r\n }\r\n\r\n setUserOffices = (selectedUserOffices) => {\r\n this.setState({ selectedUserOffices }, () => this.isRequiredFields());\r\n }\r\n\r\n setAdminId = () => {\r\n this.setState({\r\n adminId: this.getAdminId(),\r\n });\r\n }\r\n\r\n setUsers = () => {\r\n const { user } = this.state;\r\n const { userDetails } = this.props;\r\n this.setState({\r\n user: userDetails,\r\n }, () => {\r\n this.setState({\r\n convertedRoles: this.setRoleForUser(user.Roles),\r\n }, () => {\r\n this.setRoles();\r\n });\r\n });\r\n }\r\n\r\n setRoles = () => {\r\n const { user } = this.state;\r\n const array = [];\r\n user.Roles.forEach((role) => {\r\n array.push(role.Id);\r\n });\r\n this.setState({\r\n roles: array,\r\n }, () => this.isAdminRoleSelected());\r\n }\r\n\r\n getDataForMultiBox = (arr) => {\r\n const employeesForMultiBox = arr.reduce((acc, item) => {\r\n acc.push({\r\n label: item.Name,\r\n value: item.Name,\r\n valueId: item.Id,\r\n });\r\n return acc;\r\n }, []);\r\n return employeesForMultiBox;\r\n };\r\n\r\n onChangeUser = (value) => {\r\n this.setState({\r\n user: value,\r\n }, () => this.isRequiredFields());\r\n };\r\n\r\n convertRoles = () => {\r\n const { employeesRoles } = this.props;\r\n const roles = employeesRoles.reduce((acc, item) => {\r\n acc.push({\r\n Id: item.Id,\r\n Name: item.Name,\r\n DisplayName: item.DisplayName === ENGINEERING_MANAGER_ROLE_NAME ? DELIVARY_MANAGER_ROLE_NAME : item.DisplayName,\r\n isSelected: false,\r\n disabled: false,\r\n });\r\n return acc;\r\n }, []);\r\n return sortList(roles, 'Name', 'Up');\r\n };\r\n\r\n setRoleForUser = (user) => {\r\n const arr = this.convertRoles();\r\n arr.map((item, i) => {\r\n return user.forEach((role) => {\r\n if (item.Id === role.Id) {\r\n arr[i].isSelected = true;\r\n }\r\n });\r\n });\r\n return arr;\r\n };\r\n\r\n onChangeRoles = (e) => {\r\n const { roles } = this.state;\r\n const role = e.target.id;\r\n const newRoles = [...roles];\r\n\r\n newRoles.includes(role) ? newRoles.splice(newRoles.indexOf(role), 1) : newRoles.push(role);\r\n\r\n this.setState({\r\n roles: newRoles,\r\n }, () => {\r\n this.isAdminRoleSelected();\r\n this.setDefaultPermissionsByRole(newRoles);\r\n });\r\n };\r\n\r\n isApiAccessRoleSelected = () => {\r\n const { roles } = this.state;\r\n this.setState({\r\n isApiAccess: roles.length && roles.includes(this.getApiAccessId()),\r\n }, () => this.isRequiredFields());\r\n };\r\n\r\n isAdminRoleSelected = () => {\r\n const { roles, adminId } = this.state;\r\n this.setState({\r\n isDisabled: roles.length && roles.includes(adminId),\r\n }, () => this.isApiAccessRoleSelected());\r\n };\r\n\r\n isRequiredFields = () => {\r\n const {\r\n user, roles, isApiAccess, selectedUserOffices,\r\n } = this.state;\r\n const isUserValidAndRolesAdded = user && !isEmptyObject(user) && roles.length;\r\n this.setState({\r\n isModalFieldsRequired: isApiAccess ? selectedUserOffices && selectedUserOffices.length && isUserValidAndRolesAdded : isUserValidAndRolesAdded,\r\n });\r\n };\r\n\r\n filterEmployees = () => {\r\n const { users, employees } = this.props;\r\n return employees.filter((employee) => {\r\n if (users.find(user => user.EmployeeId === employee.Id)) {\r\n return null;\r\n }\r\n return employee;\r\n });\r\n };\r\n\r\n setEmployeesOptions = () => {\r\n this.setState({\r\n employeesOptions: sortList(this.getDataForMultiBox(this.filterEmployees()), 'label', 'Up'),\r\n });\r\n }\r\n\r\n onApply = () => {\r\n const {\r\n isModalFieldsRequired, isAddNew, isDisabled, isApiAccess,\r\n user, roles, adminId, dataPermissions, selectedUserOffices,\r\n } = this.state;\r\n const {\r\n addNewUser, closeModal, officesOptions, showUpdateUserConfirmation,\r\n } = this.props;\r\n if (isModalFieldsRequired) {\r\n const newUser = {\r\n SecurityRoleIds: isDisabled ? [adminId] : roles,\r\n Permissions: dataPermissions,\r\n };\r\n const arrayAllOfficeIds = officesOptions.filter(office => !office.isDisabled).map((office) => office.Id);\r\n if (isAddNew) {\r\n newUser.EmployeeId = user.valueId;\r\n newUser.OfficeIds = selectedUserOffices;\r\n addNewUser(newUser);\r\n } else {\r\n showUpdateUserConfirmation(user.Id, newUser.Permissions, newUser.SecurityRoleIds, isApiAccess ? selectedUserOffices : arrayAllOfficeIds);\r\n }\r\n }\r\n closeModal();\r\n }\r\n\r\n getApiAccessId = () => {\r\n const { employeesRoles } = this.props;\r\n const apiAccessRole = employeesRoles.find((item) => item.Name === API_ACCESS_ROLE_NAME);\r\n return apiAccessRole && apiAccessRole.Id;\r\n };\r\n\r\n getAdminId = () => {\r\n const { employeesRoles } = this.props;\r\n const adminRole = employeesRoles.find((item) => item.Name === ADMIN_ROLE_NAME);\r\n return adminRole && adminRole.Id;\r\n };\r\n\r\n setPermissions = (permissions) => {\r\n if (permissions) {\r\n this.setState({\r\n dataPermissions: permissions,\r\n });\r\n }\r\n }\r\n\r\n tooglePermission = ({ target }) => {\r\n const checkbox = target.name;\r\n const { dataPermissions } = this.state;\r\n this.setState({\r\n dataPermissions: {\r\n ...dataPermissions,\r\n [checkbox]: !dataPermissions[checkbox],\r\n },\r\n });\r\n }\r\n\r\n setDefaultPermissionsByRole = (roles) => {\r\n const { employeesRoles } = this.props;\r\n this.setState({\r\n dataPermissions: getCorrectPermissionsGroup(roles, employeesRoles),\r\n });\r\n }\r\n\r\n handleChangeSelectedOffices = (selectedUserOffices) => {\r\n this.setState({\r\n selectedUserOffices,\r\n }, this.isApiAccessRoleSelected());\r\n }\r\n\r\n checkInitialRoles = () => {\r\n const { userDetails } = this.props;\r\n const isApiAccess = userDetails.Roles && userDetails.Roles.find((role) => role.Name === 'API Access');\r\n this.setState({\r\n initialRoleIsApiAccess: !!isApiAccess,\r\n });\r\n }\r\n\r\n render() {\r\n const {\r\n isAddNew,\r\n user,\r\n isDisabled,\r\n convertedRoles,\r\n roles,\r\n isModalFieldsRequired,\r\n dataPermissions,\r\n adminId,\r\n selectedUserOffices,\r\n employeesOptions,\r\n } = this.state;\r\n const { closeModal, officesOptions } = this.props;\r\n return (\r\n \r\n
\r\n \r\n {\r\n isAddNew\r\n ? ADD USER\r\n : EDIT USER\r\n }\r\n
\r\n \r\n {\r\n isAddNew ? (\r\n
\r\n \r\n
\r\n ) : null\r\n }\r\n \r\n \r\n Choose Role\r\n
\r\n \r\n
\r\n \r\n Cancel\r\n
\r\n \r\n
\r\n \r\n Notifications about Contract expire:\r\n
\r\n \r\n
\r\n \r\n
\r\n - \r\n
- The first \r\n
- The second \r\n
- The third \r\n
\r\n
\r\n - \r\n
- \r\n
- \r\n
- \r\n
\r\n Notifications about Role/Employee expire:\r\n
\r\n \r\n
\r\n \r\n
\r\n - \r\n
- The first \r\n
- The second \r\n
- The third \r\n
\r\n
\r\n - \r\n
- \r\n
- \r\n
- \r\n
\r\n Notifications about Project expire:\r\n
\r\n \r\n
\r\n \r\n
\r\n - \r\n
- The first \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\nSettings.propTypes = {\r\n settings: PropTypes.object,\r\n getSettings: PropTypes.func,\r\n putSettings: PropTypes.func,\r\n};\r\n\r\nexport default connect(store => ({\r\n settings: store.adminReducer.settings,\r\n}), {\r\n getSettings,\r\n putSettings,\r\n setComponent,\r\n resetComponent,\r\n})(Settings);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport MultiSuggestBox from 'common/components/form-items/multi-value-suggestbox/multi-value-suggestbox';\r\nimport classNames from 'classnames';\r\nimport {\r\n Dialog,\r\n DialogActions,\r\n DialogContent,\r\n DialogTitle,\r\n} from '@material-ui/core/';\r\nimport './modal-merge.css';\r\n\r\nexport class ModalMerge extends Component {\r\n render() {\r\n const {\r\n handleChangeMainMergeEntity,\r\n handleGetMergeElements,\r\n mainOptions,\r\n mergeOptions,\r\n isDisabledSuggest,\r\n isApplyDisabled,\r\n cancelMerge,\r\n onClick,\r\n toogleModalMerge,\r\n lookup,\r\n } = this.props;\r\n\r\n return (\r\n \r\n \r\n Apply\r\n
\r\n history.goBack()}>\r\n Back\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nModalMerge.propTypes = {\r\n handleChangeMainMergeEntity: PropTypes.func.isRequired,\r\n handleGetMergeElements: PropTypes.func.isRequired,\r\n cancelMerge: PropTypes.func.isRequired,\r\n onClick: PropTypes.func.isRequired,\r\n toogleModalMerge: PropTypes.func.isRequired,\r\n mainOptions: PropTypes.array.isRequired,\r\n mergeOptions: PropTypes.array.isRequired,\r\n isDisabledSuggest: PropTypes.bool.isRequired,\r\n isApplyDisabled: PropTypes.bool.isRequired,\r\n lookup: PropTypes.string.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport {\r\n getManageJobTitles, putManageJobTitles, postManageJobTitles,\r\n mergeManageJobTitles,\r\n} from '../../../actions/adminManageJobTitles';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport isEmptyObject from 'utils/isEmptyObject';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { ModalMerge } from '../components/modal-merge/modal-merge';\r\nimport { setListSettingsLookups, resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageJobTitles extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Job Titles', isSelected: true, Id: 'Name',\r\n },\r\n ],\r\n showAddRoleFields: false,\r\n addJobTitle: { Name: '' },\r\n blockAddJobTitle: false,\r\n blockSaveJob: false,\r\n entityForMerge: [],\r\n showMergeModal: false,\r\n mainEntityForMerge: null,\r\n additionalEntityForMerge: [],\r\n isApplyDisabled: false,\r\n isDisabledSuggest: true,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { getManageJobTitles } = this.props;\r\n getManageJobTitles();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n addNewJobTitle = () => {\r\n const { blockAddJobTitle } = this.state;\r\n if (!blockAddJobTitle) {\r\n this.setState({\r\n showAddRoleFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewJobTitle = ({ target }) => {\r\n const { addJobTitle } = this.state;\r\n this.setState({\r\n addJobTitle: {\r\n ...addJobTitle,\r\n [target.name]: target.value,\r\n },\r\n }, this.newJobTitleValidation);\r\n }\r\n\r\n newJobTitleValidation = () => {\r\n const { addJobTitle } = this.state;\r\n this.setState({\r\n blockSaveJob: !!addJobTitle.Name.trim(),\r\n blockAddJobTitle: !!addJobTitle.Name.trim(),\r\n });\r\n };\r\n\r\n newJobTitleCancel = () => {\r\n this.setState({\r\n addJobTitle: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveJob: false,\r\n blockAddJobTitle: false,\r\n });\r\n }\r\n\r\n newJobTitleApply = () => {\r\n const { postManageJobTitles } = this.props;\r\n const { blockSaveJob, addJobTitle } = this.state;\r\n\r\n if (blockSaveJob) {\r\n postManageJobTitles(addJobTitle);\r\n this.setState({\r\n addJobTitle: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveJob: false,\r\n blockAddJobTitle: false,\r\n });\r\n }\r\n }\r\n\r\n getElementForDelete = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `jobTitles/${element.Id}`,\r\n searchUpdateSaga: 'jobTitles',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (entity) => {\r\n const { putManageJobTitles } = this.props;\r\n putManageJobTitles(entity);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n getElementsForMerge = () => {\r\n const { entityForMerge } = this.state;\r\n if (entityForMerge.length > 1) {\r\n this.toogleModalMerge();\r\n }\r\n }\r\n\r\n toogleModalMerge = () => {\r\n const { showMergeModal } = this.state;\r\n this.setState({\r\n showMergeModal: !showMergeModal,\r\n });\r\n }\r\n\r\n changeDataForMultiBox = (incomingItems) => {\r\n const employeesForMultiBox = [];\r\n incomingItems.map((item) => {\r\n return employeesForMultiBox.push({\r\n label: item.Name,\r\n value: item.Name,\r\n valueId: item.Id,\r\n });\r\n });\r\n return employeesForMultiBox;\r\n };\r\n\r\n handleChangeMainMergeEntity = (value) => {\r\n this.setState({\r\n mainEntityForMerge: value,\r\n isDisabledSuggest: !value,\r\n }, this.checkMergedFields);\r\n };\r\n\r\n handleGetMergeElements = (value) => {\r\n this.setState({\r\n additionalEntityForMerge: value,\r\n }, this.checkMergedFields);\r\n }\r\n\r\n checkMergedFields = () => {\r\n const { mainEntityForMerge, additionalEntityForMerge } = this.state;\r\n this.setState({\r\n isApplyDisabled: mainEntityForMerge && !isEmptyObject(mainEntityForMerge) && !!additionalEntityForMerge.length,\r\n });\r\n }\r\n\r\n onApply = () => {\r\n const { mergeManageJobTitles } = this.props;\r\n const { mainEntityForMerge, additionalEntityForMerge, isApplyDisabled } = this.state;\r\n if (isApplyDisabled) {\r\n const dataForMerge = {\r\n MergeTo: mainEntityForMerge.valueId,\r\n MergeFrom: additionalEntityForMerge.reduce((acc, curValue) => {\r\n const elementsForMerge = [];\r\n elementsForMerge.push(curValue.valueId);\r\n return [...acc, ...elementsForMerge];\r\n }, []),\r\n };\r\n mergeManageJobTitles(dataForMerge);\r\n this.cancelMerge();\r\n }\r\n }\r\n\r\n cancelMerge = () => {\r\n this.setState({\r\n mainEntityForMerge: null,\r\n additionalEntityForMerge: [],\r\n showMergeModal: false,\r\n entityForMerge: [],\r\n });\r\n }\r\n\r\n getDataForSuggestBox = (allJobs, choosenJobs, mainElement) => {\r\n const elementsForMerge = allJobs.filter((item) => (\r\n (choosenJobs.includes(item.Id) && (!mainElement || item.Id !== mainElement.valueId)) && true\r\n ));\r\n return this.changeDataForMultiBox(elementsForMerge);\r\n }\r\n\r\n checkItem = (e) => {\r\n const { entityForMerge } = this.state;\r\n const entity = e.currentTarget.value;\r\n const isReadyForMerge = entityForMerge.find(item => item === entity);\r\n const updatingEntity = entityForMerge;\r\n const index = updatingEntity.indexOf(isReadyForMerge);\r\n if (!isReadyForMerge) {\r\n updatingEntity.push(entity);\r\n } else {\r\n updatingEntity.splice(index, 1);\r\n }\r\n this.setState({\r\n entityForMerge: updatingEntity,\r\n });\r\n }\r\n\r\n render() {\r\n const {\r\n jobTitles,\r\n listSettings,\r\n } = this.props;\r\n const {\r\n columnsToDisplay, showAddRoleFields, addJobTitle, blockAddJobTitle,\r\n showMergeModal,\r\n entityForMerge, mainEntityForMerge, isApplyDisabled, isDisabledSuggest,\r\n } = this.state;\r\n const {\r\n searchValue,\r\n sortColumn,\r\n sortDirection,\r\n } = listSettings || {};\r\n return (\r\n \r\n 1}\r\n searchValue={searchValue}\r\n />\r\n
\r\n );\r\n }\r\n}\r\n\r\nManageJobTitles.propTypes = {\r\n getManageJobTitles: PropTypes.func.isRequired,\r\n putManageJobTitles: PropTypes.func.isRequired,\r\n postManageJobTitles: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n mergeManageJobTitles: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n jobTitles: store.adminManageLookups.jobTitles,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n getManageJobTitles,\r\n putManageJobTitles,\r\n postManageJobTitles,\r\n showDialog,\r\n mergeManageJobTitles,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageJobTitles);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getManageRoleTypes, createNewRoleTypes, updateRoleTypes } from 'pages/admin/actions/adminManageRoleTypes.js';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups, resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\nimport { List } from '../../../../../common/components/list/list';\r\nimport { CellTextField } from 'common/components/list/custom-cell/cell-toogle-textfield';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport classNames from 'classnames';\r\n\r\nexport class ManageRoleTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Role Types', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n {\r\n Name: 'Code', isSelected: true, className: 'biggest-col', Id: 'Code',\r\n },\r\n ],\r\n showAddRoleFields: false,\r\n addRoleType: { Name: '' },\r\n blockAddRoleType: false,\r\n blockSaveRoleType: false,\r\n newRoleTypeName: '',\r\n newRoleTypeCode: '',\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { getManageRoleTypes } = this.props;\r\n getManageRoleTypes();\r\n }\r\n\r\n addNewRoleType = () => {\r\n const { blockAddRoleType } = this.state;\r\n if (!blockAddRoleType) {\r\n this.setState({\r\n showAddRoleFields: true,\r\n });\r\n }\r\n }\r\n\r\n newRoleValidation = () => {\r\n const { newRoleTypeName } = this.state;\r\n this.setState({\r\n blockSaveRoleType: !!newRoleTypeName.trim(),\r\n blockAddRoleType: !!newRoleTypeName.trim(),\r\n });\r\n };\r\n\r\n newRoleTypeCancel = () => {\r\n this.setState({\r\n newRoleTypeName: '',\r\n newRoleTypeCode: '',\r\n showAddRoleFields: false,\r\n blockSaveRoleType: false,\r\n blockAddRoleType: false,\r\n });\r\n }\r\n\r\n newRoleTypeApply = () => {\r\n const { createNewRoleTypes } = this.props;\r\n const { blockSaveRoleType, newRoleTypeName, newRoleTypeCode } = this.state;\r\n if (blockSaveRoleType) {\r\n const data = {\r\n Name: newRoleTypeName,\r\n Code: newRoleTypeCode,\r\n };\r\n createNewRoleTypes(data);\r\n this.newRoleTypeCancel();\r\n }\r\n }\r\n\r\n deleteRoleTypes = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `role_types/${data.item.Id}`,\r\n searchUpdateSaga: 'role-types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateRoleTypes } = this.props;\r\n const { Name, Id, Code } = data;\r\n updateRoleTypes(Name, Id, Code);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n onChangeNewRoleTypeName = (event) => {\r\n this.setState({\r\n newRoleTypeName: event.target.value,\r\n }, this.newRoleValidation);\r\n };\r\n\r\n onChangeNewRoleTypeCode = (event) => {\r\n this.setState({\r\n newRoleTypeCode: event.target.value,\r\n }, this.newRoleValidation);\r\n };\r\n\r\n render() {\r\n const {\r\n manageRoleType,\r\n listSettings,\r\n } = this.props;\r\n const {\r\n columnsToDisplay, showAddRoleFields, blockAddRoleType, newRoleTypeName, newRoleTypeCode,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null}\r\n {showMergeModal ? (\r\n \r\n
\r\n \r\n
: null\r\n }\r\n \r\n );\r\n }\r\n}\r\n\r\nManageRoleTypes.propTypes = {\r\n getManageRoleTypes: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n manageRoleType: store.adminManageLookups.roleTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n getManageRoleTypes,\r\n createNewRoleTypes,\r\n updateRoleTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageRoleTypes);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport {\r\n downloadManageProjectTypes,\r\n putManageProjectTypes,\r\n postManageProjectTypes,\r\n} from '../../../actions/adminManageProjectTypes';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { setListSettingsLookups, resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageProjectTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Project Types', isSelected: true, Id: 'Name',\r\n },\r\n ],\r\n showAddProjectTypeFields: false,\r\n addProjectType: { Name: '' },\r\n blockAddProjectType: false,\r\n blockSaveType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { downloadManageProjectTypes } = this.props;\r\n downloadManageProjectTypes();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n addNewProjectType = () => {\r\n const { blockAddProjectType } = this.state;\r\n if (!blockAddProjectType) {\r\n this.setState({\r\n showAddProjectTypeFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewProjectType = ({ target }) => {\r\n const { addProjectType } = this.state;\r\n this.setState({\r\n addProjectType: {\r\n ...addProjectType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newTypeValidation);\r\n }\r\n\r\n newTypeValidation = () => {\r\n const { addProjectType } = this.state;\r\n this.setState({\r\n blockSaveType: !!addProjectType.Name.trim(),\r\n blockAddProjectType: !!addProjectType.Name.trim(),\r\n });\r\n };\r\n\r\n newTypeCancel = () => {\r\n this.setState({\r\n addProjectType: { Name: '' },\r\n showAddProjectTypeFields: false,\r\n blockSaveType: false,\r\n blockAddProjectType: false,\r\n });\r\n }\r\n\r\n newJobTitleApply = () => {\r\n const { postManageProjectTypes } = this.props;\r\n const { blockSaveType, addProjectType } = this.state;\r\n if (blockSaveType) {\r\n postManageProjectTypes(addProjectType);\r\n this.setState({\r\n addJobTitle: { Name: '' },\r\n showAddProjectTypeFields: false,\r\n blockSaveType: false,\r\n blockAddProjectType: false,\r\n });\r\n }\r\n }\r\n\r\n getElementForDelete = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `project_types/${element.Id}`,\r\n searchUpdateSaga: 'project_types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (entity) => {\r\n const { putManageProjectTypes } = this.props;\r\n putManageProjectTypes(entity);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n render() {\r\n const {\r\n projectTypes,\r\n listSettings,\r\n } = this.props;\r\n const {\r\n columnsToDisplay, showAddProjectTypeFields, addProjectType, blockAddProjectType,\r\n } = this.state;\r\n const {\r\n searchValue,\r\n sortColumn,\r\n sortDirection,\r\n } = listSettings || {};\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageProjectTypes.propTypes = {\r\n downloadManageProjectTypes: PropTypes.func.isRequired,\r\n putManageProjectTypes: PropTypes.func.isRequired,\r\n postManageProjectTypes: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n projectTypes: store.adminManageLookups.projectTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n downloadManageProjectTypes,\r\n putManageProjectTypes,\r\n postManageProjectTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageProjectTypes);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport MultiSelect from 'common/components/form-items/multi-select/multi-select';\r\n\r\nconst multiSelectStyles = {\r\n relcontClass: 'field__multi-select-rel-cont',\r\n contClass: 'field__multi-select-cont',\r\n optionContClass: 'field__multi-select-option-cont',\r\n};\r\n\r\nexport class CellMultiSelect extends Component {\r\n constructor(props) {\r\n super(props);\r\n const { item, column } = this.props;\r\n this.state = {\r\n value: item[column.Id],\r\n isMultiSelect: false,\r\n };\r\n }\r\n\r\n toogleViewCell = () => {\r\n const { isMultiSelect } = this.state;\r\n this.setState({\r\n isMultiSelect: !isMultiSelect,\r\n });\r\n }\r\n\r\n handleChange = (data) => {\r\n const { value } = this.state;\r\n const newValue = value.some(id => id === data) ? value.filter(id => id !== data) : value.concat([data]);\r\n this.setState({\r\n value: newValue,\r\n });\r\n }\r\n\r\n onBlur = () => {\r\n const { column, config, item } = this.props;\r\n const { value } = this.state;\r\n const { valueSetter } = config[column.Id];\r\n const newItem = {\r\n ...item,\r\n [column.Id]: value,\r\n };\r\n valueSetter(newItem);\r\n this.toogleViewCell();\r\n }\r\n\r\n viewItemTitle = () => {\r\n const { item, column, config } = this.props;\r\n const { options } = config[column.Id];\r\n const title = options.reduce((acc, option) => {\r\n item[column.Id] && item[column.Id].forEach(elem => {\r\n if (elem === option.Id) {\r\n acc.push(option.Name);\r\n }\r\n });\r\n return acc;\r\n }, []);\r\n return title.length ? title.join(',') : '---';\r\n }\r\n\r\n render() {\r\n const {\r\n item,\r\n column,\r\n isHaveRights,\r\n config,\r\n } = this.props;\r\n const {\r\n value,\r\n isMultiSelect,\r\n } = this.state;\r\n const { options } = config[column.Id];\r\n return (\r\n \r\n
: null}\r\n \r\n
\r\n \r\n
\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 Apply\r\n
\r\n \r\n Cancel\r\n
\r\n \r\n 1}\r\n searchValue={searchValue}\r\n />\r\n
\r\n );\r\n }\r\n}\r\n\r\nManageSkills.propTypes = {\r\n loadManageSkills: PropTypes.func.isRequired,\r\n putManageSkill: PropTypes.func.isRequired,\r\n postManageSkill: PropTypes.func.isRequired,\r\n mergeManageSkills: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n skills: store.adminManageLookups.skills,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageSkills,\r\n putManageSkill,\r\n postManageSkill,\r\n mergeManageSkills,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageSkills);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getManageBusinessTrips, createNewBusinessTrips, updateBusinessTrips } from 'pages/admin/actions/adminManageBisunessTrips';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups, resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageBusinessTrips extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Business Trips', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddRoleFields: false,\r\n addRoleType: { Name: '' },\r\n blockAddRoleType: false,\r\n blockSaveRoleType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageBusinessTrips } = this.props;\r\n loadManageBusinessTrips();\r\n }\r\n\r\n addNewRoleType = () => {\r\n const { blockAddRoleType } = this.state;\r\n if (!blockAddRoleType) {\r\n this.setState({\r\n showAddRoleFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewRoleObj = ({ target }) => {\r\n const { addRoleType } = this.state;\r\n this.setState({\r\n addRoleType: {\r\n ...addRoleType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newRoleValidation);\r\n }\r\n\r\n newRoleValidation = () => {\r\n const { addRoleType } = this.state;\r\n this.setState({\r\n blockSaveRoleType: !!addRoleType.Name.trim(),\r\n blockAddRoleType: !!addRoleType.Name.trim(),\r\n });\r\n };\r\n\r\n newRoleTypeCancel = () => {\r\n this.setState({\r\n addRoleType: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveRoleType: false,\r\n blockAddRoleType: false,\r\n });\r\n }\r\n\r\n newResumeApply = () => {\r\n const { createNewBusinessTrips } = this.props;\r\n const { blockSaveRoleType, addRoleType } = this.state;\r\n if (blockSaveRoleType) {\r\n createNewBusinessTrips(addRoleType);\r\n this.setState({\r\n addRoleType: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveRoleType: false,\r\n blockAddRoleType: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deleteRoleTypes = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `business_trips/${data.Id}`,\r\n searchUpdateSaga: 'business_trips',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateBusinessTrips } = this.props;\r\n const { Name, Id } = data;\r\n updateBusinessTrips(Name, Id);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n render() {\r\n const { businessTrips, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddRoleFields, addRoleType, blockAddRoleType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null}\r\n {showMergeModal ? (\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageBusinessTrips.propTypes = {\r\n loadManageBusinessTrips: PropTypes.func,\r\n createNewBusinessTrips: PropTypes.func,\r\n updateBusinessTrips: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n businessTrips: store.adminManageLookups.businessTrips,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageBusinessTrips: getManageBusinessTrips,\r\n createNewBusinessTrips,\r\n updateBusinessTrips,\r\n showDialog,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageBusinessTrips);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getManagePaymentTerms, createNewPaymentTerm, updatePaymentTerm } from 'pages/admin/actions/adminManagePaymentTerms';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\n\r\nexport class ManagePaymentTerms extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Payment Terms', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddPaymentTermFields: false,\r\n addPaymentTerm: { Name: '' },\r\n blockAddPaymentTerm: false,\r\n blockSavePaymentTerm: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManagePaymentTerms } = this.props;\r\n loadManagePaymentTerms();\r\n }\r\n\r\n addNewPaymentTerm = () => {\r\n const { blockAddPaymentTerm } = this.state;\r\n if (!blockAddPaymentTerm) {\r\n this.setState({\r\n showAddPaymentTermFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewPaymentTermObj = ({ target }) => {\r\n const { addPaymentTerm } = this.state;\r\n this.setState({\r\n addPaymentTerm: {\r\n ...addPaymentTerm,\r\n [target.name]: target.value,\r\n },\r\n }, this.newPaymentTermValidation);\r\n }\r\n\r\n newPaymentTermValidation = () => {\r\n const { addPaymentTerm } = this.state;\r\n this.setState({\r\n blockSavePaymentTerm: !!addPaymentTerm.Name.trim(),\r\n blockAddPaymentTerm: !!addPaymentTerm.Name.trim(),\r\n });\r\n };\r\n\r\n newPaymentTermCancel = () => {\r\n this.setState({\r\n addPaymentTerm: { Name: '' },\r\n showAddPaymentTermFields: false,\r\n blockSavePaymentTerm: false,\r\n blockAddPaymentTerm: false,\r\n });\r\n }\r\n\r\n newResumeApply = () => {\r\n const { createNewPaymentTerm } = this.props;\r\n const { blockSavePaymentTerm, addPaymentTerm } = this.state;\r\n if (blockSavePaymentTerm) {\r\n createNewPaymentTerm(addPaymentTerm);\r\n this.setState({\r\n addPaymentTerm: { Name: '' },\r\n showAddPaymentTermFields: false,\r\n blockSavePaymentTerm: false,\r\n blockAddPaymentTerm: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deletePaymentTerms = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `payment_term/${data.Id}`,\r\n searchUpdateSaga: 'payment_term',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updatePaymentTerm } = this.props;\r\n const { Name, Id } = data;\r\n updatePaymentTerm(Name, Id);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n render() {\r\n const { PaymentTerms, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddPaymentTermFields, addPaymentTerm, blockAddPaymentTerm,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManagePaymentTerms.propTypes = {\r\n loadManagePaymentTerms: PropTypes.func,\r\n createNewPaymentTerm: PropTypes.func,\r\n updatePaymentTerm: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n PaymentTerms: store.adminManageLookups.paymentTerms,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManagePaymentTerms: getManagePaymentTerms,\r\n createNewPaymentTerm,\r\n updatePaymentTerm,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManagePaymentTerms);\r\n","/* eslint-disable indent */\r\nimport React from 'react';\r\nimport { SortableContainer, SortableElement, sortableHandle } from 'react-sortable-hoc';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from '../icon/Icon';\r\nimport ManageItem from './manage-item.js';\r\nimport { arrayMoveImmutable } from 'array-move';\r\nimport sortArrayByPriority from 'utils/sortArrayByPriority';\r\nimport { NO_ITEMS_TITLE } from 'utils/const-variable';\r\nimport './document-list.css';\r\n\r\nconst DragHandle = sortableHandle(() => \r\n
: null\r\n }\r\n \r\n
\r\n - \r\n {items.map((value, index) => (\r\n
\r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport {\r\n getManageSeniorityLevels,\r\n createNewSeniorityLevels,\r\n updateSeniorityLevels,\r\n updateOrderSeniorityLevels,\r\n} from 'pages/admin/actions/adminManageSeniorityLevels';\r\nimport { SortableManageList } from 'common/components/documents-list/sortable-manage-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\n\r\nexport class ManageSeniorityLevels extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Seniority Levels', isSelected: true, className: 'without-width-col',\r\n },\r\n ],\r\n showAddRoleFields: false,\r\n addSeniorityLevel: { Name: '' },\r\n blockSeniorityLevel: false,\r\n blockSaveSeniorityLevel: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageSeniorityLevels } = this.props;\r\n loadManageSeniorityLevels();\r\n }\r\n\r\n addNewSeniorityLevel = () => {\r\n const { blockSeniorityLevel } = this.state;\r\n if (!blockSeniorityLevel) {\r\n this.setState({\r\n showAddRoleFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewSeniorityLevelObj = ({ target }) => {\r\n const { addSeniorityLevel } = this.state;\r\n this.setState({\r\n addSeniorityLevel: {\r\n ...addSeniorityLevel,\r\n [target.name]: target.value,\r\n },\r\n }, this.newSeniorityLevelValidation);\r\n }\r\n\r\n newSeniorityLevelValidation = () => {\r\n const { addSeniorityLevel } = this.state;\r\n this.setState({\r\n blockSaveSeniorityLevel: !!addSeniorityLevel.Name.trim(),\r\n blockSeniorityLevel: !!addSeniorityLevel.Name.trim(),\r\n });\r\n };\r\n\r\n newSeniorityLeveleCancel = () => {\r\n this.setState({\r\n addSeniorityLevel: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveSeniorityLevel: false,\r\n blockSeniorityLevel: false,\r\n });\r\n }\r\n\r\n newSeniorityLevelApply = () => {\r\n const { createNewSeniorityLevels, manageSeniorityLevels } = this.props;\r\n const { blockSaveSeniorityLevel, addSeniorityLevel } = this.state;\r\n const priorityArray = manageSeniorityLevels.map((key) => key.Priority);\r\n const sendNewSeniorityLevelObj = {\r\n ...addSeniorityLevel,\r\n Priority: Math.max.apply(null, priorityArray) + 1,\r\n };\r\n if (blockSaveSeniorityLevel) {\r\n createNewSeniorityLevels(sendNewSeniorityLevelObj);\r\n this.setState({\r\n addSeniorityLevel: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveSeniorityLevel: false,\r\n blockSeniorityLevel: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deleteSeniorityLevel = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `seniority_levels/${data.Id}`,\r\n searchUpdateSaga: 'seniority_levels',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateSeniorityLevels } = this.props;\r\n const { Name, Id } = data;\r\n updateSeniorityLevels(Name, Id);\r\n }\r\n\r\n newOrderSeniorityLevels = (data) => {\r\n const { updateOrderSeniorityLevels } = this.props;\r\n updateOrderSeniorityLevels(data);\r\n }\r\n\r\n render() {\r\n const { manageSeniorityLevels } = this.props;\r\n const {\r\n columnsToDisplay, showAddRoleFields, addSeniorityLevel, blockSeniorityLevel,\r\n } = this.state;\r\n return (\r\n \r\n {\r\n columnsToDisplay && columnsToDisplay.map((column) => column.isSelected\r\n ? (
\r\n {\r\n itemsProps.length\r\n ? (\r\n \r\n {showCheckboxes ? : null}\r\n
)\r\n : null)\r\n }\r\n \r\n {actionLabel ? Action : null}\r\n \r\n {column.breakline ? (\r\n \r\n {column.Name.split(' ')[0]}\r\n
\r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n {showSortIcons\r\n ?
\r\n \r\n {column.Name.split(' ')[1]}\r\n \r\n ) : (\r\n \r\n {column.Name}\r\n \r\n )}\r\n {showSortIcons\r\n ?
\r\n {sortColumnName === column.Id && sortDirection === 'Up'\r\n ? setSortSettings && setSortSettings(column.Id, 'Up')}\r\n className='pointer'\r\n />\r\n : setSortSettings && setSortSettings(column.Id, 'Up')}\r\n className='pointer'\r\n />\r\n }\r\n {sortColumnName === column.Id && sortDirection === 'Down'\r\n ? setSortSettings && setSortSettings(column.Id, 'Down')}\r\n className='pointer'\r\n />\r\n : setSortSettings && setSortSettings(column.Id, 'Down')}\r\n className='pointer'\r\n />\r\n }\r\n
\r\n : null}\r\n {NO_ITEMS_TITLE}
\r\n }\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageSeniorityLevels.propTypes = {\r\n loadManageSeniorityLevels: PropTypes.func,\r\n createNewSeniorityLevels: PropTypes.func,\r\n updateSeniorityLevels: PropTypes.func,\r\n updateOrderSeniorityLevels: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n manageSeniorityLevels: store.adminManageLookups.seniorityLevels,\r\n}), {\r\n loadManageSeniorityLevels: getManageSeniorityLevels,\r\n createNewSeniorityLevels,\r\n updateSeniorityLevels,\r\n updateOrderSeniorityLevels,\r\n showDialog,\r\n})(ManageSeniorityLevels);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport {\r\n getManageSkillLevels,\r\n createNewSkillLevels,\r\n updateSkillLevels,\r\n updateOrderSkillLevels,\r\n} from 'pages/admin/actions/adminManageSkillLevels';\r\nimport { SortableManageList } from 'common/components/documents-list/sortable-manage-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\n\r\nexport class ManageSkillLevels extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Skill Levels', isSelected: true, className: 'without-width-col', Id: 'Skill Levels',\r\n },\r\n ],\r\n showAddRoleFields: false,\r\n addSkillLevel: { Name: '' },\r\n blockSkillLevel: false,\r\n blockSaveSkillLevel: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageSkillLevels } = this.props;\r\n loadManageSkillLevels(true);\r\n }\r\n\r\n addNewSkillLevel = () => {\r\n const { blockSkillLevel } = this.state;\r\n if (!blockSkillLevel) {\r\n this.setState({\r\n showAddRoleFields: true,\r\n });\r\n }\r\n }\r\n\r\n onChangeSkillLevelObj = ({ target }) => {\r\n const { addSkillLevel } = this.state;\r\n this.setState({\r\n addSkillLevel: {\r\n ...addSkillLevel,\r\n [target.name]: target.value,\r\n },\r\n }, this.newSkillLevelValidation);\r\n }\r\n\r\n newSkillLevelValidation = () => {\r\n const { addSkillLevel } = this.state;\r\n this.setState({\r\n blockSaveSkillLevel: !!addSkillLevel.Name.trim(),\r\n blockSkillLevel: !!addSkillLevel.Name.trim(),\r\n });\r\n };\r\n\r\n newSkillLeveleCancel = () => {\r\n this.setState({\r\n addSkillLevel: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveSkillLevel: false,\r\n blockSkillLevel: false,\r\n });\r\n }\r\n\r\n newSkillLevelApply = () => {\r\n const { createNewSkillLevels, manageSkillLevels } = this.props;\r\n const { blockSaveSkillLevel, addSkillLevel } = this.state;\r\n const priorityArray = manageSkillLevels.map((key) => key.Priority);\r\n const sendNewSkillLevelObj = {\r\n ...addSkillLevel,\r\n Priority: Math.max.apply(null, priorityArray) + 1,\r\n };\r\n if (blockSaveSkillLevel) {\r\n createNewSkillLevels(sendNewSkillLevelObj);\r\n this.setState({\r\n addSkillLevel: { Name: '' },\r\n showAddRoleFields: false,\r\n blockSaveSkillLevel: false,\r\n blockSkillLevel: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deleteSkillLevel = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `skill_levels/${data.Id}`,\r\n searchUpdateSaga: 'skill_levels',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateSkillLevels } = this.props;\r\n const { Name, Id } = data;\r\n updateSkillLevels(Name, Id);\r\n }\r\n\r\n newOrderSkillLevels = (data) => {\r\n const { updateOrderSkillLevels } = this.props;\r\n updateOrderSkillLevels(data);\r\n }\r\n\r\n render() {\r\n const { manageSkillLevels } = this.props;\r\n const {\r\n columnsToDisplay, showAddRoleFields, addSkillLevel, blockSkillLevel,\r\n } = this.state;\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageSkillLevels.propTypes = {\r\n loadManageSkillLevels: PropTypes.func,\r\n createNewSkillLevels: PropTypes.func,\r\n updateSkillLevels: PropTypes.func,\r\n updateOrderSkillLevels: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n manageSkillLevels: store.adminManageLookups.skillLevels,\r\n}), {\r\n loadManageSkillLevels: getManageSkillLevels,\r\n createNewSkillLevels,\r\n updateSkillLevels,\r\n updateOrderSkillLevels,\r\n showDialog,\r\n})(ManageSkillLevels);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport {\r\n loadManageSowTypes,\r\n putManageSowTypes,\r\n postManageSowTypes,\r\n} from '../../../actions/adminManageSowTypes';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { setListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageSowTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'SoW Types', isSelected: true, Id: 'Name',\r\n },\r\n ],\r\n showAddSowTypeFields: false,\r\n addSowType: { Name: '' },\r\n blockAddProjectType: false,\r\n blockSaveType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageSowTypes } = this.props;\r\n loadManageSowTypes();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n addNewSowType = () => {\r\n const { blockAddProjectType } = this.state;\r\n if (!blockAddProjectType) {\r\n this.setState({\r\n showAddSowTypeFields: true,\r\n });\r\n }\r\n }\r\n\r\n setNewSowType = ({ target }) => {\r\n const { addSowType } = this.state;\r\n this.setState({\r\n addSowType: {\r\n ...addSowType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newTypeValidation);\r\n }\r\n\r\n newTypeValidation = () => {\r\n const { addSowType } = this.state;\r\n this.setState({\r\n blockSaveType: !!addSowType.Name.trim(),\r\n blockAddProjectType: !!addSowType.Name.trim(),\r\n });\r\n };\r\n\r\n newTypeCancel = () => {\r\n this.setState({\r\n addSowType: { Name: '' },\r\n showAddSowTypeFields: false,\r\n blockSaveType: false,\r\n blockAddProjectType: false,\r\n });\r\n }\r\n\r\n newSowTypeApply = () => {\r\n const { postManageSowTypes } = this.props;\r\n const { blockSaveType, addSowType } = this.state;\r\n if (blockSaveType) {\r\n postManageSowTypes(addSowType);\r\n this.setState({\r\n addJobTitle: { Name: '' },\r\n showAddSowTypeFields: false,\r\n blockSaveType: false,\r\n blockAddProjectType: false,\r\n });\r\n }\r\n }\r\n\r\n deleteEntity = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `sow_types/${element.Id}`,\r\n searchUpdateSaga: 'sow_types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (entity) => {\r\n const { putManageSowTypes } = this.props;\r\n putManageSowTypes(entity);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n render() {\r\n const { sowTypes, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddSowTypeFields, addSowType, blockAddProjectType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageSowTypes.propTypes = {\r\n sowTypes: PropTypes.array.isRequired,\r\n loadManageSowTypes: PropTypes.func.isRequired,\r\n putManageSowTypes: PropTypes.func.isRequired,\r\n postManageSowTypes: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n sowTypes: store.adminManageLookups.sowTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageSowTypes,\r\n putManageSowTypes,\r\n postManageSowTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageSowTypes);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { loadManageDocumentTypes, createNewDocumentTypes, updateDocumentTypes } from 'pages/admin/actions/adminManageDocumentTypes';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageDocumentTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Document Types', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddDocumentFields: false,\r\n addDocumentType: { Name: '' },\r\n blockAddDocumentType: false,\r\n blockSaveDocumentType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageDocumentTypes } = this.props;\r\n loadManageDocumentTypes();\r\n }\r\n\r\n addNewDocumentType = () => {\r\n const { blockAddDocumentType } = this.state;\r\n if (!blockAddDocumentType) {\r\n this.setState({\r\n showAddDocumentFields: true,\r\n });\r\n }\r\n }\r\n\r\n onChangeNewDocumentObj = ({ target }) => {\r\n const { addDocumentType } = this.state;\r\n this.setState({\r\n addDocumentType: {\r\n ...addDocumentType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newDocumentValidation);\r\n }\r\n\r\n newDocumentValidation = () => {\r\n const { addDocumentType } = this.state;\r\n this.setState({\r\n blockSaveDocumentType: !!addDocumentType.Name.trim(),\r\n blockAddDocumentType: !!addDocumentType.Name.trim(),\r\n });\r\n };\r\n\r\n newDocumentTypeCancel = () => {\r\n this.setState({\r\n addDocumentType: { Name: '' },\r\n showAddDocumentFields: false,\r\n blockSaveDocumentType: false,\r\n blockAddDocumentType: false,\r\n });\r\n }\r\n\r\n newDocumentApply = () => {\r\n const { createNewDocumentTypes } = this.props;\r\n const { blockSaveDocumentType, addDocumentType } = this.state;\r\n if (blockSaveDocumentType) {\r\n createNewDocumentTypes(addDocumentType);\r\n this.setState({\r\n addDocumentType: { Name: '' },\r\n showAddDocumentFields: false,\r\n blockSaveDocumentType: false,\r\n blockAddDocumentType: false,\r\n });\r\n }\r\n }\r\n\r\n deleteDocumentTypes = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `document_types/${data.Id}`,\r\n searchUpdateSaga: 'document_types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateDocumentTypes } = this.props;\r\n const { Name, Id } = data;\r\n updateDocumentTypes(Name, Id);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n render() {\r\n const { manageDocumentType, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddDocumentFields, addDocumentType, blockAddDocumentType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null}\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageDocumentTypes.propTypes = {\r\n loadManageDocumentTypes: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n manageDocumentType: store.adminManageLookups.documentTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageDocumentTypes,\r\n createNewDocumentTypes,\r\n updateDocumentTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageDocumentTypes);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport {\r\n loadManageCertificates,\r\n putManageCertificates,\r\n postManageCertificates,\r\n} from '../../../actions/adminCertificatesActions';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { setListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageCertificates extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Certificates', isSelected: true, Id: 'Name',\r\n },\r\n ],\r\n showAddCertificateFields: false,\r\n addCertificate: { Name: '' },\r\n blockAddProjectType: false,\r\n blockSaveType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageCertificates } = this.props;\r\n loadManageCertificates();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n addNewCertificate = () => {\r\n const { blockAddProjectType } = this.state;\r\n if (!blockAddProjectType) {\r\n this.setState({\r\n showAddCertificateFields: true,\r\n });\r\n }\r\n }\r\n\r\n setNewCertificate = ({ target }) => {\r\n const { addCertificate } = this.state;\r\n this.setState({\r\n addCertificate: {\r\n ...addCertificate,\r\n [target.name]: target.value,\r\n },\r\n }, this.newTypeValidation);\r\n }\r\n\r\n newTypeValidation = () => {\r\n const { addCertificate } = this.state;\r\n this.setState({\r\n blockSaveType: !!addCertificate.Name.trim(),\r\n blockAddProjectType: !!addCertificate.Name.trim(),\r\n });\r\n };\r\n\r\n newTypeCancel = () => {\r\n this.setState({\r\n addCertificate: { Name: '' },\r\n showAddCertificateFields: false,\r\n blockSaveType: false,\r\n blockAddProjectType: false,\r\n });\r\n }\r\n\r\n newCertificateApply = () => {\r\n const { postManageCertificates } = this.props;\r\n const { blockSaveType, addCertificate } = this.state;\r\n if (blockSaveType) {\r\n postManageCertificates(addCertificate);\r\n this.setState({\r\n addCertificate: { Name: '' },\r\n showAddCertificateFields: false,\r\n blockSaveType: false,\r\n blockAddProjectType: false,\r\n });\r\n }\r\n }\r\n\r\n deleteEntity = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `certificates/${element.Id}`,\r\n searchUpdateSaga: 'lookup_certificates',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (entity) => {\r\n const { putManageCertificates } = this.props;\r\n putManageCertificates(entity);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n render() {\r\n const { certificates, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddCertificateFields, addCertificate, blockAddProjectType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageCertificates.propTypes = {\r\n certificates: PropTypes.array.isRequired,\r\n loadManageCertificates: PropTypes.func.isRequired,\r\n putManageCertificates: PropTypes.func.isRequired,\r\n postManageCertificates: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n certificates: store.adminManageLookups.certificates,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageCertificates,\r\n putManageCertificates,\r\n postManageCertificates,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageCertificates);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getManageInvoiceDates, createNewInvoiceDate, updateInvoiceDate } from 'pages/admin/actions/adminManageInvoiceDates';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageInvoiceDates extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Invoice Dates', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddInvoiceDateFields: false,\r\n addInvoiceDate: { Name: '' },\r\n blockAddInvoiceDate: false,\r\n blockSaveInvoiceDate: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageInvoiceDates } = this.props;\r\n loadManageInvoiceDates();\r\n }\r\n\r\n addNewInvoiceDate = () => {\r\n const { blockAddInvoiceDate } = this.state;\r\n if (!blockAddInvoiceDate) {\r\n this.setState({\r\n showAddInvoiceDateFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewInvoiceDateObj = ({ target }) => {\r\n const { addInvoiceDate } = this.state;\r\n this.setState({\r\n addInvoiceDate: {\r\n ...addInvoiceDate,\r\n [target.name]: target.value,\r\n },\r\n }, this.newInvoiceDateValidation);\r\n }\r\n\r\n newInvoiceDateValidation = () => {\r\n const { addInvoiceDate } = this.state;\r\n this.setState({\r\n blockSaveInvoiceDate: !!addInvoiceDate.Name.trim(),\r\n blockAddInvoiceDate: !!addInvoiceDate.Name.trim(),\r\n });\r\n };\r\n\r\n newInvoiceDateCancel = () => {\r\n this.setState({\r\n addInvoiceDate: { Name: '' },\r\n showAddInvoiceDateFields: false,\r\n blockSaveInvoiceDate: false,\r\n blockAddInvoiceDate: false,\r\n });\r\n }\r\n\r\n newResumeApply = () => {\r\n const { createNewInvoiceDate } = this.props;\r\n const { blockSaveInvoiceDate, addInvoiceDate } = this.state;\r\n if (blockSaveInvoiceDate) {\r\n createNewInvoiceDate(addInvoiceDate);\r\n this.setState({\r\n addInvoiceDate: { Name: '' },\r\n showAddInvoiceDateFields: false,\r\n blockSaveInvoiceDate: false,\r\n blockAddInvoiceDate: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deleteInvoiceDate = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `InvoiceDates/${data.Id}`,\r\n searchUpdateSaga: 'InvoiceDates',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateInvoiceDate } = this.props;\r\n const { Name, Id } = data;\r\n updateInvoiceDate(Name, Id);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n render() {\r\n const { InvoiceDates, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddInvoiceDateFields, addInvoiceDate, blockAddInvoiceDate,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null}\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageInvoiceDates.propTypes = {\r\n loadManageInvoiceDates: PropTypes.func,\r\n createNewInvoiceDate: PropTypes.func,\r\n updateInvoiceDate: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n InvoiceDates: store.adminManageLookups.invoiceDates,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageInvoiceDates: getManageInvoiceDates,\r\n createNewInvoiceDate,\r\n updateInvoiceDate,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageInvoiceDates);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport Select from 'react-select';\r\nimport DocumentTitle from 'react-document-title';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { List } from '../../../../../common/components/list/list';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport classNames from 'classnames';\r\nimport TextField from 'common/components/form-items/input/text-field';\r\nimport {\r\n getEmployeeTrainings,\r\n createNewTraining,\r\n updateTraining,\r\n deleteTraining,\r\n getEmployeeTrainingClients,\r\n} from 'pages/admin/actions/adminManageEmployeeTrainings';\r\nimport { NumberFormatCustom } from '../../../../../common/components/form-items/input-currency/input-currency';\r\n\r\nconst additionalSelectsStyles = {\r\n control: (provided) => ({\r\n ...provided,\r\n width: '100px',\r\n marginTop: '15px',\r\n marginBottom: '5px',\r\n marginRight: '20px',\r\n maxHeight: '40px',\r\n overflowY: 'auto',\r\n }),\r\n};\r\n\r\nconst toggleOptions = {\r\n 'No': { value: 'No', label: 'No', name: 'No' },\r\n 'Yes': { value: 'Yes', label: 'Yes', name: 'Yes' },\r\n};\r\n\r\nclass ManageEmployeeTrainings extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n { Name: 'Training', className: 'without-width-col', Id: 'Training' },\r\n {\r\n Name: 'Customers',\r\n className: 'big-col',\r\n Id: 'Customers',\r\n isArray: true,\r\n },\r\n { Name: 'One Time', className: 'small-col', Id: 'OneTime' },\r\n { Name: 'Is Optional', className: 'small-col', Id: 'IsOptional' },\r\n {\r\n Name: 'Order', className: 'small-col', Id: 'Order', isString: true,\r\n },\r\n ],\r\n searchValue: '',\r\n sortColumn: '',\r\n sortDirection: '',\r\n focusedInput: null,\r\n showAddTrainingFields: false,\r\n blockAddTraining: false,\r\n newTraining: {\r\n Training: '',\r\n Customers: [],\r\n OneTime: 'No',\r\n IsOptional: 'No',\r\n Order: 0,\r\n },\r\n editTrainingObject: {},\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageEmployeeTrainings, loadManageEmployeeTrainingClients } = this.props;\r\n loadManageEmployeeTrainings();\r\n loadManageEmployeeTrainingClients();\r\n }\r\n\r\n handleCustomerSelect = (selectedCustomers) => {\r\n this.setState((prevState) => ({\r\n newTraining: {\r\n ...prevState.newTraining,\r\n Customers: selectedCustomers,\r\n },\r\n }));\r\n };\r\n\r\n handleOneTimeSelect = (selectedOneTime) => {\r\n const { newTraining } = this.state;\r\n this.setState({\r\n newTraining: {\r\n ...newTraining,\r\n OneTime: selectedOneTime.value,\r\n },\r\n });\r\n }\r\n\r\n handleIsOptionalSelect = (selectedIsOptional) => {\r\n const { newTraining } = this.state;\r\n this.setState({\r\n newTraining: {\r\n ...newTraining,\r\n IsOptional: selectedIsOptional.value,\r\n },\r\n });\r\n }\r\n\r\n handleSearch = (value) => {\r\n this.setState({ searchValue: value });\r\n };\r\n\r\n setSortSettings = (column, direction) => {\r\n this.setState({ sortColumn: column, sortDirection: direction });\r\n };\r\n\r\n addNewTraining = () => {\r\n if (!this.state.blockAddTraining) {\r\n this.setState({ showAddTrainingFields: true });\r\n }\r\n };\r\n\r\n getNewTrainingObj = (e) => {\r\n const { name, value } = e.target;\r\n const isTrainingNotEmpty = name === 'Training' && value.trim() !== '';\r\n const isCustomersNotEmpty = name === 'Customers' && value.length > 0;\r\n\r\n this.setState((prevState) => ({\r\n blockAddTraining: !(isTrainingNotEmpty && isCustomersNotEmpty),\r\n newTraining: {\r\n ...prevState.newTraining,\r\n [name]: value,\r\n },\r\n }));\r\n };\r\n\r\n newTrainingCancel = () => {\r\n this.setState({\r\n newTraining: {\r\n Training: '',\r\n Customers: [],\r\n OneTime: 'No',\r\n IsOptional: 'No',\r\n Order: 0,\r\n },\r\n showAddTrainingFields: false,\r\n blockAddTraining: false,\r\n isEditing: false,\r\n });\r\n };\r\n\r\n newTrainingApply = () => {\r\n const { Training, Customers } = this.state.newTraining;\r\n const { isEditing, editTrainingObject, newTraining } = this.state;\r\n\r\n const training = {\r\n ...newTraining,\r\n Customers: newTraining.Customers && newTraining.Customers.map(customer => customer.Id),\r\n OneTime: newTraining.OneTime === 'Yes',\r\n IsOptional: newTraining.IsOptional === 'Yes',\r\n };\r\n if (Training.trim() !== '') {\r\n if (isEditing) {\r\n this.props.updateTraining(editTrainingObject.Id, training);\r\n } else {\r\n this.props.createNewTraining(training);\r\n }\r\n\r\n this.setState({\r\n newTraining: {\r\n Training: '',\r\n Customers: [],\r\n OneTime: 'No',\r\n IsOptional: 'No',\r\n Order: 0,\r\n },\r\n showAddTrainingFields: false,\r\n blockAddTraining: false,\r\n isEditing: false,\r\n });\r\n }\r\n };\r\n\r\n editTraining = (data) => {\r\n const { item } = data;\r\n this.setState({\r\n newTraining: {\r\n Training: item.Training,\r\n Customers: item.Customers,\r\n OneTime: item.OneTime,\r\n IsOptional: item.IsOptional,\r\n Order: item.Order,\r\n },\r\n editTrainingObject: item,\r\n showAddTrainingFields: true,\r\n isEditing: true,\r\n });\r\n };\r\n\r\n handleDeleteClick = (item) => {\r\n this.props.deleteTraining(item.item.Id);\r\n };\r\n\r\n handleInputFocusOrBlur = (inputName) => {\r\n this.setState({ focusedInput: inputName });\r\n };\r\n\r\n isInputFocused = (inputName) => {\r\n return this.state.focusedInput === inputName;\r\n };\r\n\r\n filterTrainings = (trainings) => {\r\n const { editTrainingObject } = this.state;\r\n return trainings.filter(\r\n (training) => training.Id !== editTrainingObject.Id,\r\n );\r\n };\r\n\r\n render() {\r\n const { employeeTrainings, empoyeeTrainingClients } = this.props;\r\n const {\r\n columnsToDisplay,\r\n searchValue,\r\n sortColumn,\r\n sortDirection,\r\n showAddTrainingFields,\r\n newTraining,\r\n blockAddTraining,\r\n isEditing,\r\n } = this.state;\r\n\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n { } },\r\n // 'Customers': {\r\n // cell: CellSelect, valueSetter: () => { },\r\n // options: updatedClients.map((customer) => ({\r\n // id: customer.Id,\r\n // value: customer.Name,\r\n // name: customer.Name,\r\n // label: customer.Name,\r\n // }))\r\n // },\r\n // 'OneTime': { cell: CellToggleSwitcher, valueSetter: () => {} },\r\n // }}\r\n />\r\n {showAddTrainingFields && (\r\n \r\n Apply\r\n
\r\n \r\n \r\n \r\n )}\r\n \r\n );\r\n }\r\n}\r\n\r\nManageEmployeeTrainings.propTypes = {\r\n loadManageEmployeeTrainings: PropTypes.func,\r\n createNewTraining: PropTypes.func,\r\n updateTraining: PropTypes.func,\r\n deleteTraining: PropTypes.func,\r\n loadManageEmployeeTrainingClients: PropTypes.func,\r\n};\r\n\r\nexport default connect(\r\n (store) => ({\r\n employeeTrainings: store.adminManageLookups.trainings,\r\n empoyeeTrainingClients: store.adminManageLookups.clients,\r\n listSettings: store.adminManageLookups.listSettings,\r\n }),\r\n {\r\n loadManageEmployeeTrainings: getEmployeeTrainings,\r\n createNewTraining,\r\n updateTraining,\r\n deleteTraining,\r\n loadManageEmployeeTrainingClients: getEmployeeTrainingClients,\r\n },\r\n)(ManageEmployeeTrainings);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport {\r\n loadSOWRenewalStatuses,\r\n createSOWRenewalStatus,\r\n updateSOWRenewalStatus,\r\n deleteSOWRenewalStatus,\r\n} from 'pages/admin/actions/adminManageSOWRenewalStatus';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\n\r\nexport class ManageSOWRenewalStatus extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'SOW Renewal Status', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddSOWRenewalStatusFields: false,\r\n addSOWRenewalStatus: { Name: '' },\r\n blockAddSOWRenewalStatus: false,\r\n blockSaveSOWRenewalStatus: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadSOWRenewalStatuses } = this.props;\r\n loadSOWRenewalStatuses();\r\n }\r\n\r\n addNewSOWRenewalStatus = () => {\r\n const { blockAddSOWRenewalStatus } = this.state;\r\n if (!blockAddSOWRenewalStatus) {\r\n this.setState({\r\n showAddSOWRenewalStatusFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewSOWRenewalStatusObj = ({ target }) => {\r\n const { addSOWRenewalStatus } = this.state;\r\n this.setState({\r\n addSOWRenewalStatus: {\r\n ...addSOWRenewalStatus,\r\n [target.name]: target.value,\r\n },\r\n }, this.newSOWRenewalStatusValidation);\r\n }\r\n\r\n newSOWRenewalStatusValidation = () => {\r\n const { addSOWRenewalStatus } = this.state;\r\n this.setState({\r\n blockSaveSOWRenewalStatus: !!addSOWRenewalStatus.Name.trim(),\r\n blockAddSOWRenewalStatus: !!addSOWRenewalStatus.Name.trim(),\r\n });\r\n };\r\n\r\n newSOWRenewalStatusCancel = () => {\r\n this.setState({\r\n addSOWRenewalStatus: { Name: '' },\r\n showAddSOWRenewalStatusFields: false,\r\n blockSaveSOWRenewalStatus: false,\r\n blockAddSOWRenewalStatus: false,\r\n });\r\n }\r\n\r\n newResumeApply = () => {\r\n const { createSOWRenewalStatus } = this.props;\r\n const { blockSaveSOWRenewalStatus, addSOWRenewalStatus } = this.state;\r\n if (blockSaveSOWRenewalStatus) {\r\n createSOWRenewalStatus(addSOWRenewalStatus);\r\n this.setState({\r\n addSOWRenewalStatus: { Name: '' },\r\n showAddSOWRenewalStatusFields: false,\r\n blockSaveSOWRenewalStatus: false,\r\n blockAddSOWRenewalStatus: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deletePaymentTerms = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `renewal-statuses/${data.Id}`,\r\n searchUpdateSaga: 'renewal_statuses',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateSOWRenewalStatus } = this.props;\r\n updateSOWRenewalStatus(data);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n render() {\r\n const { RenewalStatuses, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddSOWRenewalStatusFields, addSOWRenewalStatus, blockAddSOWRenewalStatus,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n \r\n \r\n Cancel\r\n
\r\n \r\n
\r\n \r\n this.handleInputFocusOrBlur('training')}\r\n onBlur={() => this.handleInputFocusOrBlur('training')}\r\n autoFocus={this.isInputFocused('training')}\r\n />\r\n (this.selectRef = ref)}\r\n menuPortalTarget={document.body}\r\n isMulti\r\n options={empoyeeTrainingClients.map((customer) => ({\r\n id: customer.Id,\r\n value: customer.Name,\r\n name: customer.Name,\r\n label: customer.Name,\r\n }))}\r\n value={(() => {\r\n const selectedCustomers = newTraining.Customers.map(\r\n (customer) => ({\r\n id: customer.Id,\r\n name: customer.Name,\r\n value: customer.Name,\r\n label: customer.Name,\r\n }),\r\n );\r\n return selectedCustomers;\r\n })()}\r\n onChange={(selectedOptions) => {\r\n const selectedCustomers = selectedOptions.map(\r\n (option) => ({\r\n Id: option.id,\r\n Name: option.name,\r\n }),\r\n );\r\n this.handleCustomerSelect(selectedCustomers);\r\n }}\r\n styles={{\r\n control: (provided) => ({\r\n ...provided,\r\n width: '230px',\r\n marginTop: '15px',\r\n marginBottom: '5px',\r\n marginRight: '20px',\r\n maxHeight: '40px',\r\n overflowY: 'auto',\r\n }),\r\n }}\r\n menuPosition='fixed'\r\n />\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageSOWRenewalStatus.propTypes = {\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n RenewalStatuses: store.adminManageLookups.sowRenewalStatuses,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n showDialog,\r\n setListSettingsLookups,\r\n loadSOWRenewalStatuses,\r\n createSOWRenewalStatus,\r\n updateSOWRenewalStatus,\r\n deleteSOWRenewalStatus,\r\n})(ManageSOWRenewalStatus);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { loadAssignmentTypes, createAssignmentTypes, updateAssignmentTypes } from 'pages/admin/actions/adminAssignmentTypesAction';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport { setListSettingsLookups, resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageAssignmentTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Assignment Types', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddTypesFields: false,\r\n addAssignmentType: { Name: '' },\r\n blockAddAssignmentType: false,\r\n blockSaveTypesType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { loadManageAssignmentTypes } = this.props;\r\n loadManageAssignmentTypes();\r\n }\r\n\r\n addAssignmentType = () => {\r\n const { blockAddAssignmentType } = this.state;\r\n if (!blockAddAssignmentType) {\r\n this.setState({\r\n showAddTypesFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewTypeObj = ({ target }) => {\r\n const { addAssignmentType } = this.state;\r\n this.setState({\r\n addAssignmentType: {\r\n ...addAssignmentType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newTypeValidation);\r\n }\r\n\r\n newTypeValidation = () => {\r\n const { addAssignmentType } = this.state;\r\n this.setState({\r\n blockSaveTypesType: !!addAssignmentType.Name.trim(),\r\n blockAddAssignmentType: !!addAssignmentType.Name.trim(),\r\n });\r\n };\r\n\r\n newAssignmentTypesCancel = () => {\r\n this.setState({\r\n addAssignmentType: { Name: '' },\r\n showAddTypesFields: false,\r\n blockSaveTypesType: false,\r\n blockAddAssignmentType: false,\r\n });\r\n }\r\n\r\n newAssignmentTypeApply = () => {\r\n const { createAssignmentTypes } = this.props;\r\n const { blockSaveTypesType, addAssignmentType } = this.state;\r\n if (blockSaveTypesType) {\r\n createAssignmentTypes(addAssignmentType);\r\n this.setState({\r\n addAssignmentType: { Name: '' },\r\n showAddTypesFields: false,\r\n blockSaveTypesType: false,\r\n blockAddAssignmentType: false,\r\n });\r\n }\r\n }\r\n\r\n\r\n deleteAssignmentTypes = (data) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `assignment_types/${data.Id}`,\r\n searchUpdateSaga: 'assignment_types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (data) => {\r\n const { updateAssignmentTypes } = this.props;\r\n const { Name, Id } = data;\r\n updateAssignmentTypes({ Name, Id });\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n render() {\r\n const { assignmentTypes, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddTypesFields, addAssignmentType, blockAddAssignmentType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageAssignmentTypes.propTypes = {\r\n loadManageAssignmentTypes: PropTypes.func,\r\n createAssignmentTypes: PropTypes.func,\r\n updateAssignmentTypes: PropTypes.func,\r\n showDialog: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n assignmentTypes: store.adminManageLookups.assignmentTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n loadManageAssignmentTypes: loadAssignmentTypes,\r\n createAssignmentTypes,\r\n updateAssignmentTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageAssignmentTypes);\r\n","import React, { Component } from 'react';\r\nimport * as PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport DocumentList from 'common/components/documents-list/documents-list';\r\nimport { UpdateManageItem } from 'common/components/documents-list/update-manage-item';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport { sortList } from 'common/components/list/sortList';\r\nimport { recursiveSearch } from 'services/recursiveSearch';\r\nimport {\r\n downloadManageEngagementTypes,\r\n putManageEngagementTypes,\r\n postManageEngagementTypes,\r\n} from '../../../actions/adminManageEngagementTypes';\r\nimport { showDialog } from 'common/actions/confirmationDialogActions';\r\nimport { setListSettingsLookups, resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageEngagementTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Engagement Types', isSelected: true, Id: 'Name',\r\n },\r\n ],\r\n showAddEngagementTypeFields: false,\r\n addEngagementType: { Name: '' },\r\n blockAddEngagementType: false,\r\n blockSaveType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { downloadManageEngagementTypes } = this.props;\r\n downloadManageEngagementTypes();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n }\r\n\r\n addNewEngagementType = () => {\r\n const { blockAddEngagementType } = this.state;\r\n if (!blockAddEngagementType) {\r\n this.setState({\r\n showAddEngagementTypeFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewEngagementType = ({ target }) => {\r\n const { addEngagementType } = this.state;\r\n this.setState({\r\n addEngagementType: {\r\n ...addEngagementType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newTypeValidation);\r\n }\r\n\r\n newTypeValidation = () => {\r\n const { addEngagementType } = this.state;\r\n this.setState({\r\n blockSaveType: !!addEngagementType.Name.trim(),\r\n blockAddEngagementType: !!addEngagementType.Name.trim(),\r\n });\r\n }\r\n\r\n newTypeCancel = () => {\r\n this.setState({\r\n addEngagementType: { Name: '' },\r\n showAddEngagementTypeFields: false,\r\n blockSaveType: false,\r\n blockAddEngagementType: false,\r\n });\r\n }\r\n\r\n newJobTitleApply = () => {\r\n const { postManageEngagementTypes } = this.props;\r\n const { blockSaveType, addEngagementType } = this.state;\r\n if (blockSaveType) {\r\n postManageEngagementTypes(addEngagementType);\r\n this.setState({\r\n addJobTitle: { Name: '' },\r\n showAddEngagementTypeFields: false,\r\n blockSaveType: false,\r\n blockAddEngagementType: false,\r\n });\r\n }\r\n }\r\n\r\n getElementForDelete = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `engagement_types/${element.Id}`,\r\n searchUpdateSaga: 'engagement_types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (entity) => {\r\n const { putManageEngagementTypes } = this.props;\r\n putManageEngagementTypes(entity);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n }\r\n\r\n render() {\r\n const {\r\n engagementTypes,\r\n listSettings,\r\n } = this.props;\r\n const {\r\n columnsToDisplay, showAddEngagementTypeFields, addEngagementType, blockAddEngagementType,\r\n } = this.state;\r\n const {\r\n searchValue,\r\n sortColumn,\r\n sortDirection,\r\n } = listSettings || {};\r\n return (\r\n \r\n
: null\r\n }\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageEngagementTypes.propTypes = {\r\n downloadManageEngagementTypes: PropTypes.func.isRequired,\r\n putManageEngagementTypes: PropTypes.func.isRequired,\r\n postManageEngagementTypes: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n engagementTypes: store.adminManageLookups.engagementTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n downloadManageEngagementTypes,\r\n putManageEngagementTypes,\r\n postManageEngagementTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageEngagementTypes);\r\n","import React, { Component } from 'react';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../../utils/applicationTitle';\r\nimport ListToolbar from '../../../../../common/components/list-toolbar/list-toolbar';\r\nimport DocumentList from '../../../../../common/components/documents-list/documents-list';\r\nimport { recursiveSearch } from '../../../../../services/recursiveSearch';\r\nimport { sortList } from '../../../../../common/components/list/sortList';\r\nimport { UpdateManageItem } from '../../../../../common/components/documents-list/update-manage-item';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport { getBackFillTypes, postBackFillTypes, putBackFillTypes } from '../../../actions/adminManageBackFillTypes';\r\nimport { showDialog } from '../../../../../common/actions/confirmationDialogActions';\r\nimport { setListSettingsLookups } from '../../../actions/adminActions';\r\n\r\nexport class ManageBackFillTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Backfill Types', isSelected: true, Id: 'Name',\r\n },\r\n ],\r\n showAddBackFillTypeFields: false,\r\n addBackFillType: { Name: '' },\r\n blockAddBackFillType: false,\r\n blockSaveType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { getBackFillTypes } = this.props;\r\n getBackFillTypes();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n const newSort = {\r\n sortColumn,\r\n sortDirection,\r\n };\r\n setListSettingsLookups(newSort);\r\n };\r\n\r\n addNewBackFillType = () => {\r\n const { blockAddBackFillType } = this.state;\r\n if (!blockAddBackFillType) {\r\n this.setState({\r\n showAddBackFillTypeFields: true,\r\n });\r\n }\r\n }\r\n\r\n getNewBackFillType = ({ target }) => {\r\n const { addBackFillType } = this.state;\r\n this.setState({\r\n addBackFillType: {\r\n ...addBackFillType,\r\n [target.name]: target.value,\r\n },\r\n }, this.newTypeValidation);\r\n }\r\n\r\n newTypeValidation = () => {\r\n const { addBackFillType } = this.state;\r\n this.setState({\r\n blockSaveType: !!addBackFillType.Name.trim(),\r\n blockAddBackFillType: !!addBackFillType.Name.trim(),\r\n });\r\n };\r\n\r\n newTypeCancel = () => {\r\n this.setState({\r\n addBackFillType: { Name: '' },\r\n showAddBackFillTypeFields: false,\r\n blockSaveType: false,\r\n blockAddBackFillType: false,\r\n });\r\n }\r\n\r\n newTypeApply = () => {\r\n const { postBackFillTypes } = this.props;\r\n const { blockSaveType, addBackFillType } = this.state;\r\n if (blockSaveType) {\r\n postBackFillTypes(addBackFillType);\r\n this.newTypeCancel();\r\n }\r\n }\r\n\r\n getElementForDelete = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `back-fill-types/${element.Id}`,\r\n searchUpdateSaga: 'back-fill-types',\r\n };\r\n showDialog(dataForDeleting);\r\n }\r\n\r\n editEntity = (entity) => {\r\n const { putBackFillTypes } = this.props;\r\n putBackFillTypes(entity);\r\n }\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n render() {\r\n const { backFillTypes, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddBackFillTypeFields, addBackFillType, blockAddBackFillType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n\r\n return (\r\n \r\n
: null}\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageBackFillTypes.propTypes = {\r\n getBackFillTypes: PropTypes.func.isRequired,\r\n postBackFillTypes: PropTypes.func.isRequired,\r\n putBackFillTypes: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n backFillTypes: store.adminManageLookups.backFillTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n getBackFillTypes,\r\n putBackFillTypes,\r\n postBackFillTypes,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageBackFillTypes);\r\n","import React, { Component } from 'react';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../../utils/applicationTitle';\r\nimport ListToolbar from '../../../../../common/components/list-toolbar/list-toolbar';\r\nimport DocumentList from '../../../../../common/components/documents-list/documents-list';\r\nimport { recursiveSearch } from '../../../../../services/recursiveSearch';\r\nimport { sortList } from '../../../../../common/components/list/sortList';\r\nimport { UpdateManageItem } from '../../../../../common/components/documents-list/update-manage-item';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport { getEmployeeTypes, postEmployeeType, putEmployeeType } from '../../../actions/adminManageEmployeeTypes';\r\nimport { showDialog } from '../../../../../common/actions/confirmationDialogActions';\r\nimport { setListSettingsLookups } from '../../../actions/adminActions';\r\n\r\nexport class ManageEmployeeTypes extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Employee Types', isSelected: true, className: 'without-width-col', Id: 'Name',\r\n },\r\n ],\r\n showAddEmployeeTypeFields: false,\r\n addEmployeeTypeObj: { Name: '' },\r\n blockAddEmployeeType: false,\r\n blockSaveEmployeeType: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { getEmployeeTypes } = this.props;\r\n getEmployeeTypes();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ sortColumn, sortDirection });\r\n };\r\n\r\n addNewEmployeeType = () => {\r\n const { blockAddEmployeeType } = this.state;\r\n if (!blockAddEmployeeType) {\r\n this.setState({\r\n showAddEmployeeTypeFields: true,\r\n });\r\n }\r\n };\r\n\r\n getNewEmployeeTypeObj = ({ target }) => {\r\n const { addEmployeeTypeObj } = this.state;\r\n this.setState({\r\n addEmployeeTypeObj: {\r\n ...addEmployeeTypeObj,\r\n [target.name]: target.value,\r\n },\r\n }, this.newEmployeeTypeValidation);\r\n };\r\n\r\n newEmployeeTypeValidation = () => {\r\n const { addEmployeeTypeObj } = this.state;\r\n this.setState({\r\n blockSaveEmployeeType: !!addEmployeeTypeObj.Name.trim(),\r\n blockAddEmployeeType: !!addEmployeeTypeObj.Name.trim(),\r\n });\r\n };\r\n\r\n newEmployeeTypeCancel = () => {\r\n this.setState({\r\n addEmployeeTypeObj: { Name: '' },\r\n blockAddEmployeeType: false,\r\n blockSaveEmployeeType: false,\r\n showAddEmployeeTypeFields: false,\r\n });\r\n };\r\n\r\n newEmployeeTypeApply = () => {\r\n const { postEmployeeType } = this.props;\r\n const { blockSaveEmployeeType, addEmployeeTypeObj } = this.state;\r\n if (blockSaveEmployeeType) {\r\n postEmployeeType(addEmployeeTypeObj);\r\n this.newEmployeeTypeCancel();\r\n }\r\n };\r\n\r\n getElementForDelete = (element) => {\r\n const { showDialog } = this.props;\r\n const dataForDeleting = {\r\n url: `employee-types/${element.Id}`,\r\n searchUpdateSaga: 'employee-types',\r\n };\r\n showDialog(dataForDeleting);\r\n };\r\n\r\n editEntity = (entity) => {\r\n const { putEmployeeType } = this.props;\r\n putEmployeeType(entity);\r\n };\r\n\r\n handleSearch = (searchValue) => {\r\n const { setListSettingsLookups } = this.props;\r\n setListSettingsLookups({ searchValue });\r\n };\r\n\r\n render() {\r\n const { employeeTypes, listSettings } = this.props;\r\n const {\r\n columnsToDisplay, showAddEmployeeTypeFields, addEmployeeTypeObj, blockAddEmployeeType,\r\n } = this.state;\r\n const { searchValue, sortColumn, sortDirection } = listSettings || {};\r\n\r\n return (\r\n \r\n
}\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageEmployeeTypes.propTypes = {\r\n getEmployeeTypes: PropTypes.func.isRequired,\r\n postEmployeeType: PropTypes.func.isRequired,\r\n putEmployeeType: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n employeeTypes: store.adminManageLookups.employeeTypes,\r\n listSettings: store.adminManageLookups.listSettings,\r\n}), {\r\n getEmployeeTypes,\r\n postEmployeeType,\r\n putEmployeeType,\r\n showDialog,\r\n setListSettingsLookups,\r\n})(ManageEmployeeTypes);\r\n","import React, { Component, Fragment } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { Switch, Route } from 'react-router-dom';\r\nimport ManageJobTitles from './manage-jobtitles/manage-jobtitles';\r\nimport ManageRoleTypes from './manage-role-types/manage-role-types';\r\nimport ManageProjectTypes from './manage-project-types/manage-project-types';\r\nimport ManageLocations from './manage-locations/manage-locations';\r\nimport ManageSkills from './manage-skills/manage-skills';\r\nimport ManageBusinessTrips from './manage-business-trip/manage-business-trip';\r\nimport ManagePaymentTerms from './manage-payment-terms/manage-payment-terms';\r\nimport ManageSeniorityLevels from './manage-seniority-levels/manage-seniority-levels';\r\nimport ManageSkillLevels from './manage-skill-levels/manage-skill-levels';\r\nimport ManageSowTypes from './manage-sow-types/manage-sow-types';\r\nimport ManageDocumentTypes from './manage-document-types/manage-document-types';\r\nimport ManageCertificates from './manage-certificates/manage-certificates';\r\nimport ManageInvoiceDates from './manage-invoice-dates/manage-invoice-dates';\r\nimport ManageEmployeeTrainings from './manage-employee-trainings/manage-employee-trainings';\r\nimport ManageSOWRenewalStatus from './manage-sow-renewal-status/manage-sow-renewal-status';\r\nimport ManageAssignmentTypes from './manage-assignment-types/manage-assignment-types';\r\nimport ManageEngagementTypes from './manage-engagement-types/manage-engagement-types';\r\nimport ManageBackFillTypes from './manage-back-fill-types/manage-back-fill-types';\r\nimport ManageEmployeeTypes from './manage-employee-types/manage-employee-types';\r\nimport { resetListSettingsLookups } from 'pages/admin/actions/adminActions';\r\n\r\nexport class ManageLookups extends Component {\r\n componentDidUpdate(prevProps) {\r\n const { location, resetListSettingsLookups } = this.props;\r\n if (prevProps.location.pathname !== location.pathname) {\r\n resetListSettingsLookups();\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 Apply\r\n
\r\n \r\n \r\n Cancel\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nManageApiTokens.propTypes = {\r\n downloadManageApiTokens: PropTypes.func.isRequired,\r\n putManageApiTokens: PropTypes.func.isRequired,\r\n postManageApiTokens: PropTypes.func.isRequired,\r\n showDialog: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n apiTokens: store.adminManageApiTokens.apiTokens,\r\n listSettings: store.adminManageApiTokens.listSettings,\r\n}), {\r\n downloadManageApiTokens,\r\n putManageApiTokens,\r\n postManageApiTokens,\r\n showDialog,\r\n setListSettingsLookups,\r\n resetListSettingsLookups,\r\n})(ManageApiTokens);\r\n","import React, { useEffect } from 'react';\r\nimport { Switch, Route, Redirect } from 'react-router-dom';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport ManageUsers from './components/manage-users/manage-users';\r\nimport AdminModal from './components/modal-window/add-modal';\r\nimport { getInfoForAdmin } from './actions/modalActions';\r\nimport { getOffices } from 'pages/projects/actions/projectsActions.js';\r\nimport Settings from './components/settings/settings';\r\nimport ManageLookups from './components/manage-lookups/manage-lookups.js';\r\nimport './admin-page.css';\r\nimport ManageApiTokens from './components/manage-api-tokens/manage-api-tokens';\r\n\r\nconst AdminPage = () => {\r\n const dispatch = useDispatch();\r\n const isAdminModalVisible = useSelector((state) => state.adminModalReducer.isVisible);\r\n\r\n useEffect(() => {\r\n dispatch(getInfoForAdmin());\r\n dispatch(getOffices(true));\r\n }, []);\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\nContractsList.propTypes = {\r\n getExpiredContracts: PropTypes.func.isRequired,\r\n contracts: PropTypes.array.isRequired,\r\n settings: PropTypes.object.isRequired,\r\n handleEditViewContract: PropTypes.func.isRequired,\r\n defaultCheckedShowRoles: PropTypes.bool.isRequired,\r\n alerts: PropTypes.array.isRequired,\r\n ManageProjectContracts: PropTypes.bool.isRequired,\r\n HasFinancialAccess: PropTypes.bool.isRequired,\r\n setListSettings: PropTypes.func,\r\n listSettings: PropTypes.object,\r\n};\r\n\r\nexport default connect((store) => ({\r\n contracts: store.contractsReducer.contracts,\r\n totalCount: store.contractsReducer.totalCount,\r\n settings: store.adminReducer.settings,\r\n defaultCheckedShowRoles: store.showRoles.isOnlyActiveRoles,\r\n alerts: store.contractsReducer.alerts,\r\n status: store.filtersReducer.filters.documentStatuses,\r\n dontUploadFilters: store.contractsReducer.dontUploadFilters,\r\n approvalStatus: store.contractsReducer.approvalStatus,\r\n contractTypes: store.contractsReducer.contractTypes,\r\n showConfirmForDownload: store.contractsReducer.showConfirmForDownload,\r\n downloadedFile: store.contractsReducer.downloadedFile,\r\n statusForDownloadedFile: store.contractsReducer.statusForDownloadedFile,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.contractsReducer.listSettings,\r\n}), {\r\n getExpiredContracts,\r\n handleEditViewContract,\r\n showDialog,\r\n setComponent,\r\n resetComponent,\r\n importFile,\r\n toggleFlagShow,\r\n setImportFile,\r\n downloadFile,\r\n resetContracts,\r\n setListSettings,\r\n})(ContractsList);\r\n","import { connect } from 'react-redux';\r\nimport React, { Component, Fragment } from 'react';\r\nimport { Switch, Route, Redirect } from 'react-router-dom';\r\nimport { resetListSettings } from './actions/contractsActions';\r\nimport ContractsList from './components/contracts-list/contracts-list';\r\n\r\nexport class ContractsPage extends Component {\r\n componentWillUnmount() {\r\n const { resetListSettings } = this.props;\r\n resetListSettings();\r\n }\r\n\r\n ContractsList = (props) => {\r\n const { ManageProjectContracts, HasFinancialAccess } = this.props;\r\n return (\r\n \r\n this.scroll = scroll}\r\n >\r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n renderAmendmentList = (items) => {\r\n const { columnForDisplayAmendment, innerColumnsToDisplay } = this.state;\r\n const { HasFinancialAccess } = this.props;\r\n return (\r\n \r\n
\r\n );\r\n }\r\n\r\n handleChangeNestedItems = (event) => {\r\n const value = event.target.name;\r\n const { NestedItems } = this.state;\r\n let filteredItems = [];\r\n if (NestedItems.includes(value)) {\r\n filteredItems = NestedItems.filter(item => item !== value);\r\n } else {\r\n filteredItems = [...NestedItems, value];\r\n }\r\n this.setState({\r\n NestedItems: filteredItems,\r\n });\r\n }\r\n\r\n searchSowReports = (searchValue) => {\r\n const { setSowListSettings } = this.props;\r\n setSowListSettings({ searchValue });\r\n }\r\n\r\n render() {\r\n const {\r\n reports, HasFinancialAccess, companies, clientManagers,\r\n accountManagers, jobTitles, roles, offices, projectsName,\r\n employeeAssignmentStatuses, textDataForFilters, statuses,\r\n listSettings: {\r\n searchValue, sortColumn, sortDirection, filters,\r\n },\r\n } = this.props;\r\n const { columnsToDisplay, innerColumnsToDisplay } = this.state;\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nSoWExtensionForecastList.propTypes = {\r\n reports: PropTypes.object.isRequired,\r\n loadSowReports: PropTypes.func.isRequired,\r\n transitionToContract: PropTypes.func.isRequired,\r\n transitionToRole: PropTypes.func.isRequired,\r\n ManageProjectRoles: PropTypes.bool.isRequired,\r\n ManageProjectContracts: PropTypes.bool.isRequired,\r\n HasFinancialAccess: PropTypes.bool.isRequired,\r\n companies: PropTypes.array.isRequired,\r\n clientManagers: PropTypes.array.isRequired,\r\n accountManagers: PropTypes.array.isRequired,\r\n jobTitles: PropTypes.array.isRequired,\r\n roles: PropTypes.array.isRequired,\r\n offices: PropTypes.array.isRequired,\r\n projectsName: PropTypes.array,\r\n getClients: PropTypes.func.isRequired,\r\n getCreationConfig: PropTypes.func.isRequired,\r\n getManagersByOffice: PropTypes.func.isRequired,\r\n getFilters: PropTypes.func.isRequired,\r\n getManageRoleTypes: PropTypes.func.isRequired,\r\n getFiltersForWorkForce: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n defaultCheckedShowRoles: store.showRoles.isOnlyActiveRoles,\r\n companies: store.clientsReducer.clients,\r\n clientManagers: store.projectsReducer.clientContacts,\r\n accountManagers: store.projectsReducer.accountManagersByOffice,\r\n jobTitles: store.filtersReducer.filters.JobTitles,\r\n roles: store.adminManageLookups.roleTypes,\r\n offices: store.filtersReducer.filters.Offices,\r\n projectsName: store.reportsReducer.filters.projectsName,\r\n statuses: store.filtersReducer.filters.ProjectStatuses,\r\n employeeAssignmentStatuses: store.filtersReducer.filters.EmployeeAssignmentStatuses,\r\n listSettings: store.sowReducer.listSettings,\r\n textDataForFilters: store.sowReducer.textDataForFilters,\r\n}), {\r\n loadSowReports,\r\n transitionToContract,\r\n transitionToRole,\r\n downloadXLSXDocument,\r\n getClients,\r\n getCreationConfig,\r\n getManagersByOffice,\r\n getFilters,\r\n getManageRoleTypes,\r\n getFiltersForWorkForce,\r\n setComponent,\r\n resetComponent,\r\n setSowReports,\r\n setSowListSettings,\r\n resetSowListSettings,\r\n setSowListFiltersValue,\r\n resetSowListFiltersValue,\r\n})(SoWExtensionForecastList);\r\n","export const routeData = {\r\n TotalOffice: '/employees',\r\n TotalAdmin: '/employees',\r\n TotalEmployee: '/employees',\r\n TotalTrainee: '/employees',\r\n TotalTechStaff: '/employees',\r\n Contractors: '/employees',\r\n BillableOnSite: '/employees',\r\n AllocationBillable: '/reports/workforce',\r\n AllocationInvestedAkvelon: '/reports/workforce',\r\n AllocationInvestedClient: '/reports/workforce',\r\n CapacityBench: '/reports/bench',\r\n CapacityBenchIn30Days: '/reports/bench',\r\n};\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport { List } from 'common/components/list/list';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getBenchReports, setBenchReports } from '../../actions/benchActions';\r\nimport { getFilters } from 'common/actions/filtersActions';\r\nimport moment from 'moment';\r\nimport { routeData } from './utils';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { emptyArray } from 'utils/const-variable';\r\nimport { CellLinkForRedirect } from 'common/components/list/custom-cell/cell-link-for-redirect';\r\nimport { resetComponent, setComponent } from 'common/actions/headerActions';\r\n\r\nconst filtersNames = [\r\n 'EmployeeStatusesNew',\r\n 'Locations',\r\n];\r\n\r\nexport class BenchSummary extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Office',\r\n Id: 'OfficeName',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Office',\r\n hasBorder: 'header_col_has_border',\r\n shiftName: true,\r\n },\r\n {\r\n Name: 'Office',\r\n Id: 'TotalOffice',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Total',\r\n },\r\n {\r\n Name: 'Admin',\r\n Id: 'TotalAdmin',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Total',\r\n },\r\n {\r\n Name: 'Employee',\r\n Id: 'TotalEmployee',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Total',\r\n },\r\n {\r\n Name: 'Trainee',\r\n Id: 'TotalTrainee',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Total',\r\n },\r\n {\r\n Name: 'Technical Staff',\r\n Id: 'TotalTechStaff',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Total',\r\n hasBorder: 'header_col_has_border',\r\n },\r\n {\r\n Name: 'Contractors',\r\n Id: 'Contractors',\r\n className: 'medium-col big-report-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'NotIncludedInTotal',\r\n hasBorder: 'header_col_has_border',\r\n },\r\n {\r\n Name: 'Billable',\r\n Id: 'AllocationBillable',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Allocation',\r\n toFixed: true,\r\n },\r\n {\r\n Name: 'Invested Akvelon',\r\n Id: 'AllocationInvestedAkvelon',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Allocation',\r\n },\r\n {\r\n Name: 'Invested Client',\r\n Id: 'AllocationInvestedClient',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Allocation',\r\n hasBorder: 'header_col_has_border',\r\n },\r\n {\r\n Name: 'Bench',\r\n Id: 'CapacityBench',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Capacity',\r\n toFixed: true,\r\n },\r\n {\r\n Name: 'Bench in 30 days',\r\n Id: 'CapacityBenchIn30Days',\r\n className: 'xs-col',\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Capacity',\r\n hasBorder: 'header_col_has_border',\r\n toFixed: true,\r\n },\r\n {\r\n Name: 'Office Billable',\r\n Id: 'TotalOfficeBillable',\r\n className: 'xs-col',\r\n toFixed: true,\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'TotalOfficeBillable',\r\n shiftName: true,\r\n },\r\n {\r\n Name: 'Tech Billable',\r\n Id: 'TotalTechBillable',\r\n className: 'xs-col',\r\n toFixed: true,\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'TotalTechBillable',\r\n shiftName: true,\r\n },\r\n {\r\n Name: 'Bench Billable',\r\n Id: 'BenchBillable',\r\n className: 'xs-col',\r\n toFixed: true,\r\n deleteArrow: 'delete-arrow',\r\n connectedHeader: 'Bench/Billable',\r\n shiftName: true,\r\n },\r\n ],\r\n columnsHeaders: [\r\n {\r\n Name: ' ', className: 'header_col_has_border', Id: 'Office', width: 80,\r\n },\r\n {\r\n Name: 'Total', className: 'header_col_has_border', Id: 'Total', width: 400, needShowBorder: 'show_border-bottom',\r\n },\r\n {\r\n Name: 'Not Included in Total', className: 'header_col_has_border big-report-col', Id: 'NotIncludedInTotal', width: 150, needShowBorder: 'show_border-bottom',\r\n },\r\n {\r\n Name: 'Allocation', className: 'header_col_has_border', Id: 'Allocation', width: 240, needShowBorder: 'show_border-bottom',\r\n },\r\n {\r\n Name: 'Capacity', className: 'header_col_has_border', Id: 'Capacity', width: 160, needShowBorder: 'show_border-bottom',\r\n },\r\n {\r\n Name: ' ', className: 'header_col_hasnt_border', Id: 'TotalOfficeBillable', width: 80,\r\n },\r\n {\r\n Name: ' ', className: 'header_col_hasnt_border', Id: 'TotalTechBillable', width: 80,\r\n },\r\n {\r\n Name: ' ', className: 'header_col_hasnt_border', Id: 'Bench/Billable', width: 80,\r\n },\r\n ],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const { getBenchReports, getFilters, setComponent } = this.props;\r\n getBenchReports();\r\n getFilters(filtersNames);\r\n setComponent({ title: `Bench Summary - ${moment().format('MM/DD/YYYY')}` });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { setBenchReports, resetComponent } = this.props;\r\n setBenchReports(emptyArray);\r\n resetComponent();\r\n }\r\n\r\n buildCorrectWay = (item, column) => {\r\n const { filters, route} = this.getCorrectFiltersForTransition(column, item.OfficeId);\r\n\r\n return this.transferToViewWithFilters(filters, route);\r\n }\r\n\r\n transferToViewWithFilters = (filters, customRoute) => ({\r\n pathname: customRoute ? customRoute : '/employees',\r\n state: {\r\n filters,\r\n search: '',\r\n },\r\n })\r\n\r\n getCorrectFiltersForTransition = (column, officeId) => {\r\n const { reports: { benchSummary } } = this.props;\r\n\r\n const benchSummaryFilters = benchSummary.Filters;\r\n const employeeTypeFilter = benchSummaryFilters.EmployeeTypeFilters[column];\r\n const billableStatusFilter = benchSummaryFilters.BillableStatusFilters[column];\r\n\r\n return {\r\n filters: {\r\n Offices: [officeId],\r\n OfficeIds: [officeId],\r\n Statuses: employeeTypeFilter,\r\n BillableStatuses: billableStatusFilter,\r\n },\r\n route: routeData[column],\r\n };\r\n }\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument } = this.props;\r\n downloadXLSXDocument({}, '', 'bench_summary-reports/export-xlsx', 'Bench Summary Reports.xlsx');\r\n }\r\n\r\n render() {\r\n const { reports } = this.props;\r\n const { columnsToDisplay, columnsHeaders } = this.state;\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nBenchSummary.propTypes = {\r\n reports: PropTypes.object.isRequired,\r\n getBenchReports: PropTypes.func.isRequired,\r\n getFilters: PropTypes.func,\r\n};\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n locations: store.filtersReducer.filters.Locations,\r\n statuses: store.filtersReducer.filters.EmployeeStatusesNew,\r\n billableStatus: store.reportsReducer.filters.billableStatus,\r\n}), {\r\n getBenchReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n setBenchReports,\r\n})(BenchSummary);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport isEmptyObject from 'utils/isEmptyObject.js';\r\nimport moment from 'moment';\r\nimport {\r\n BarChart, Bar,\r\n} from 'recharts';\r\nimport { STATUS_COLOR } from 'utils/const-variable';\r\n\r\nexport class CellBarChart extends Component {\r\n renderMiniBarCharts = (data) => {\r\n const { getDataForInsideComponent } = this.props;\r\n let dataForBarChart = [];\r\n const maxAssignment = 1;\r\n if (!isEmptyObject(data.Load)) {\r\n dataForBarChart = Object.entries(data.Load).reduce((acc, curValue) => {\r\n const sumBars = [];\r\n const dataForRender = {\r\n name: moment(curValue[0]).format('MM-DD-YYYY'),\r\n Billable: curValue[1] <= maxAssignment ? curValue[1] : maxAssignment,\r\n BillableOvertime: curValue[1] > maxAssignment ? curValue[1] - maxAssignment : null,\r\n };\r\n sumBars.push(dataForRender);\r\n return [...acc, ...sumBars];\r\n }, []);\r\n }\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nCellBarChart.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n getDataForInsideComponent: PropTypes.func.isRequired,\r\n};\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nexport class CellSkill extends Component {\r\n getNormalSkillsView = (skills) => {\r\n const sortSkills = skills.length && skills.sort((a, b) => a.Level.Priority > b.Level.Priority ? -1 : (a.Level.Priority === b.Level.Priority ? 0 : 1));\r\n let skillsView = '';\r\n if (sortSkills !== 0) {\r\n sortSkills.forEach((item) => {\r\n skillsView += item.Level.Name + '-' + item.Skill + ';';\r\n });\r\n }\r\n return skillsView;\r\n }\r\n\r\n render() {\r\n const { item, column } = this.props;\r\n return (\r\n \r\n {this.renderMiniBarCharts(item)}\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\nWorkforce.propTypes = {\r\n reports: PropTypes.object.isRequired,\r\n downloadXLSXDocument: PropTypes.func.isRequired,\r\n getFiltersForWorkForce: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n offices: store.filtersReducer.filters.Offices,\r\n statuses: store.filtersReducer.filters.EmployeeStatusesNew,\r\n billableStatus: store.reportsReducer.filters.billableStatus,\r\n locations: store.filtersReducer.filters.Locations,\r\n totalCount: store.reportsReducer.workforceTotalCount,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.workforceReducer.listSettings,\r\n textDataForFilters: store.workforceReducer.textDataForFilters,\r\n clients: store.filtersReducer.filters.Clients,\r\n projects: store.reportsReducer.filters.projectsName,\r\n columnsToDisplay: store.workforceReducer.columnsToDisplay,\r\n innerColumnsToDisplay: store.workforceReducer.innerColumnsToDisplay,\r\n}), {\r\n getWorkforceReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n getFiltersForWorkForce,\r\n setComponent,\r\n resetComponent,\r\n setWorkforceReports,\r\n setWorkforceListSettings,\r\n resetWorkforceListSettings,\r\n setWorkforceFiltersValue,\r\n changeColumnsToDisplay,\r\n})(Workforce);\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport PropTypes from 'prop-types';\r\nimport { sortList, sortFilterList } from 'common/components/list/sortList';\r\nimport { List } from 'common/components/list/list';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport isEmptyObject from 'utils/isEmptyObject';\r\nimport {\r\n transitionToEmployeeDetails, searchBenchReports, setBenchReports, setBenchListSettings, resetBenchListSettings,\r\n} from '../../actions/benchReportsActions';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { getFilters } from 'common/actions/filtersActions';\r\nimport moment from 'moment';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport { CellSkill } from 'common/components/list/custom-cell/cell-skills';\r\nimport { emptyArray } from 'utils/const-variable';\r\nimport { CellLinkForRedirect } from 'common/components/list/custom-cell/cell-link-for-redirect';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\n\r\nconst filtersNames = [\r\n 'Offices',\r\n 'EmployeeStatusesNew',\r\n];\r\n\r\nexport class BenchReports extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n columnsToDisplay: [\r\n {\r\n Name: 'Office', Id: 'Office', className: 'medium-col', isObject: true, deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Employee', Id: 'Employee', className: 'medium-col', isObject: true,\r\n },\r\n {\r\n Name: 'Employee Type', Id: 'EmployeeType', className: 'medium-col', isObject: true,\r\n },\r\n {\r\n Name: 'Job Title', Id: 'JobTitle', className: 'medium-col', isObject: true,\r\n },\r\n {\r\n Name: 'Skills', Id: 'MainSkills', className: 'medium-col',\r\n },\r\n {\r\n Name: 'Available', Id: 'Available', className: 'medium-col',\r\n },\r\n {\r\n Name: 'Until', Id: 'Until', className: 'medium-col', isDate: true,\r\n },\r\n {\r\n Name: 'Then Available', Id: 'ThenAvailable', className: 'medium-col', isString: true,\r\n },\r\n ],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n searchBenchReports, getFilters, setComponent, location, setBenchListSettings, listSettings: {\r\n searchValue, filters,\r\n },\r\n } = this.props;\r\n const { AsOfDate } = this.state;\r\n getFilters(filtersNames);\r\n\r\n if (location.state && location.state.filters && location.state.filters.OfficeIds) {\r\n setBenchListSettings({\r\n filters: {\r\n OfficeIds: location.state.filters.OfficeIds,\r\n },\r\n });\r\n } else {\r\n searchBenchReports(filters, searchValue);\r\n }\r\n\r\n setComponent({ title: `Bench report - ${AsOfDate || moment().format('MM/DD/YYYY')}` });\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { searchBenchReports, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n\r\n if (isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n searchBenchReports(filters, searchValue);\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent, setBenchReports, resetBenchListSettings } = this.props;\r\n setBenchReports(emptyArray);\r\n resetComponent();\r\n resetBenchListSettings();\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setBenchListSettings } = this.props;\r\n setBenchListSettings({\r\n sortColumn,\r\n sortDirection,\r\n });\r\n };\r\n\r\n applyFilters = (filters) => {\r\n const { setBenchListSettings } = this.props;\r\n const { AsOfDate } = this.state;\r\n const newFilters = {\r\n ...filters,\r\n AsOfDate,\r\n };\r\n const isExistsFilters = Object.keys(newFilters).some((filter) => newFilters[filter] && !isEmptyObject(newFilters[filter]));\r\n setBenchListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n }\r\n\r\n resetFilters = () => {\r\n const { setBenchListSettings } = this.props;\r\n setBenchListSettings({ filters: {} });\r\n this.setState({ AsOfDate: '' });\r\n }\r\n\r\n handleChangeDate = (date) => {\r\n this.setState({\r\n AsOfDate: date ? moment(date).format('MM/DD/YYYY') : null,\r\n });\r\n }\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n downloadXLSXDocument(filters, searchValue, 'bench-reports/export-xlsx?SearchString=', 'Bench Reports.xlsx');\r\n }\r\n\r\n goEmployeeDetails = (reportItem) => {\r\n const { transitionToEmployeeDetails } = this.props;\r\n if (reportItem.Employee) {\r\n transitionToEmployeeDetails(reportItem.Employee.Id);\r\n }\r\n }\r\n\r\n getLinkEmployeeDetails = (reportItem) => {\r\n return {\r\n pathname: `/employees/${reportItem.Employee.Id}`,\r\n };\r\n }\r\n\r\n searchBenchReports = (searchValue) => {\r\n const { setBenchListSettings } = this.props;\r\n setBenchListSettings({ searchValue });\r\n };\r\n\r\n render() {\r\n const {\r\n reports, offices, statuses, listSettings: {\r\n sortColumn, sortDirection, filters, searchValue,\r\n },\r\n } = this.props;\r\n const { columnsToDisplay, AsOfDate } = this.state;\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n item.Name === 'Employee' || item.Name === 'Trainee')) || [],\r\n multiSelect: true,\r\n placeholder: 'All Employee Types',\r\n filtersItem: filters && filters.EmployeeTypeIds,\r\n },\r\n {\r\n name: 'As of Date',\r\n id: 'AsOfDate',\r\n datepicker: true,\r\n placeholder: 'Date',\r\n formClassName: 'step__form svg-calendar-add-info',\r\n datePickerClassName: 'step__date-picker data-pisker__filter--margin',\r\n value: AsOfDate,\r\n onChange: this.handleChangeDate,\r\n }]}\r\n />\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nBenchReports.propTypes = {\r\n reports: PropTypes.object.isRequired,\r\n searchBenchReports: PropTypes.func.isRequired,\r\n downloadXLSXDocument: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n locations: store.filtersReducer.filters.Locations,\r\n statuses: store.filtersReducer.filters.EmployeeStatusesNew,\r\n offices: store.filtersReducer.filters.Offices,\r\n listSettings: store.benchReportsReducer.listSettings,\r\n}), {\r\n searchBenchReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n transitionToEmployeeDetails,\r\n setComponent,\r\n resetComponent,\r\n setBenchReports,\r\n setBenchListSettings,\r\n resetBenchListSettings,\r\n})(BenchReports);\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport getValueFromObject from 'utils/getValueFromObject';\r\n\r\nexport const DeepCell = (props) => {\r\n const { item, column, config } = props;\r\n const columnConfig = config[column.Id];\r\n const { keys } = columnConfig;\r\n const columnValue = keys && keys.length ? getValueFromObject(item, keys) : item[column.Id];\r\n return (\r\n \r\n
\r\n \r\n \r\n (\r\n \r\n {props.children}\r\n \r\n )}\r\n />\r\n
\r\n );\r\n }\r\n}\r\n\r\nProjectedRevenueReports.propTypes = {\r\n reports: PropTypes.object.isRequired,\r\n getProjectedRevenueReports: PropTypes.func.isRequired,\r\n HasFinancialAccess: PropTypes.bool.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n columnsToDisplay: store.financeReducer.columnsToDisplay,\r\n innerColumnsToDisplaySOWs: store.financeReducer.innerColumnsToDisplaySOWs,\r\n listSettings: store.financeReducer.listSettings,\r\n filtersDates: store.financeReducer.filtersDates,\r\n documentStatuses: store.filtersReducer.filters.documentStatuses,\r\n}), {\r\n getProjectedRevenueReports,\r\n transitionToContract,\r\n transitionToRole,\r\n downloadXLSXDocument,\r\n changeColumnsToDisplay,\r\n changeInnerColumnsToDisplay,\r\n setComponent,\r\n resetComponent,\r\n setProjectedRevenueReports,\r\n setFinanceListSettings,\r\n resetFinanceListSettings,\r\n setFinanceListDates,\r\n resetFinanceListDates,\r\n})(ProjectedRevenueReports);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport CustomIcon from 'common/components/icon/Icon';\r\nimport moment from 'moment';\r\n\r\nexport const CellAuditWrapper = (WrappedComponent) => {\r\n return class extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isShowFinanceInfo: false,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.checkProperty();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const { item } = this.props;\r\n if (prevProps.item.Property !== item.Property || prevProps.item.Entity !== item.Entity) {\r\n this.checkProperty();\r\n }\r\n }\r\n\r\n checkProperty = () => {\r\n const { item } = this.props;\r\n const isLink = item.Entity && (item.Entity.split('.SOWLink').length === 2\r\n || item.Entity.split('.POLink').length === 2 || item.Entity.split('.AmendmentLink').length === 2);\r\n const hidenProperty = ['RealizedRevenue', 'BudgetComments', 'Budget', 'rate ', 'rateOvertime',\r\n 'ContractsAttachments', 'contractsAttachments'];\r\n this.setState({\r\n isShowFinanceInfo: !hidenProperty.includes(item.Property) && !isLink,\r\n });\r\n };\r\n\r\n render() {\r\n const { isShowFinanceInfo } = this.state;\r\n return {props.children}
\r\n )}\r\n // eslint-disable-next-line react/no-unstable-nested-components\r\n contentWrapper={(props) => (\r\n \r\n {(!config[column.Id].HasFinancialAccess || (config[column.Id].HasFinancialAccess && config[column.Id].permissions)\r\n || isShowFinanceInfo) ? {`${item.Entity}${item.Property ? `.${item.Property}` : ''}`}\r\n :
\r\n );\r\n }\r\n}\r\n\r\nCellAuditEntityPath.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n\r\nexport class CellAuditValues extends Component {\r\n checkDateOrEmptyField = (incomingData) => {\r\n if (moment(incomingData, 'MM/DD/YYYY').isValid() && incomingData.includes('/')) {\r\n return moment(incomingData, 'MM/DD/YYYY').format('YYYY-MM-DD');\r\n }\r\n return String(incomingData);\r\n }\r\n\r\n render() {\r\n const {\r\n item, column, config, isShowFinanceInfo,\r\n } = this.props;\r\n return (\r\n ---
\r\n }\r\n \r\n {(!config[column.Id].HasFinancialAccess || (config[column.Id].HasFinancialAccess && config[column.Id].permissions)\r\n || isShowFinanceInfo)\r\n ? (item.TypeOfChange && item.TypeOfChange.Name === 'changed'\r\n ?
\r\n );\r\n }\r\n}\r\n\r\nCellAuditValues.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n column: PropTypes.object.isRequired,\r\n};\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport { debounce } from 'services/debounce';\r\nimport { List } from 'common/components/list/list';\r\nimport ListToolbar from 'common/components/list-toolbar/list-toolbar';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport isEmptyObject from 'utils/isEmptyObject';\r\nimport isObjectNotEquals from 'utils/object-comparison';\r\nimport {\r\n getAuditReports,\r\n setAuditReports,\r\n setAuditListSettings,\r\n resetAuditListSettings,\r\n setAuditListDates,\r\n resetAuditListDates,\r\n} from '../../actions/auditActions';\r\nimport { getUsers } from 'pages/admin/actions/adminActions';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport { emptyArray } from 'utils/const-variable';\r\nimport { CellAuditWrapper, CellAuditEntityPath, CellAuditValues } from 'common/components/list/custom-cell/cells-audit';\r\nimport { setComponent, resetComponent } from 'common/actions/headerActions';\r\nimport './audit-list.css';\r\n\r\nexport class Audit extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n filterUsers: [],\r\n countAmountReports: 50,\r\n hasMoreReports: true,\r\n columnsToDisplay: [\r\n {\r\n Name: 'Date', Id: 'DateOfChange', className: 'medium-col', isDate: true, deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Author', Id: 'Author', className: 'medium-col', isObject: true, deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Entity path', Id: 'Entity', className: 'without-width-col', deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Change type', Id: 'TypeOfChange', className: 'medium-col', isObject: true, deleteArrow: 'delete-arrow',\r\n },\r\n {\r\n Name: 'Previous/New values', Id: 'AuditValues', className: 'without-width-col', isObject: true, deleteArrow: 'delete-arrow',\r\n },\r\n ],\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n getAuditReports, getUsers, setComponent,\r\n listSettings: { searchValue, filters },\r\n } = this.props;\r\n getUsers();\r\n this.setUsersForFilter();\r\n getAuditReports(filters, searchValue);\r\n setComponent({ title: 'Audit report' });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState) {\r\n const { countAmountReports } = this.state;\r\n const { getAuditReports, users, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n if (prevProps.users !== users) {\r\n this.setUsersForFilter();\r\n }\r\n if (prevState.countAmountReports !== countAmountReports || isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n getAuditReports(filters, searchValue, countAmountReports, 0);\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const {\r\n resetComponent, setAuditReports, resetAuditListDates, resetAuditListSettings,\r\n } = this.props;\r\n setAuditReports(emptyArray);\r\n resetComponent();\r\n resetAuditListDates();\r\n resetAuditListSettings();\r\n }\r\n\r\n setUsersForFilter = () => {\r\n const { users } = this.props;\r\n const filterUsers = users.reduce((acc, item) => {\r\n acc.push({\r\n Id: item.EmployeeId,\r\n Name: item.Name,\r\n });\r\n return acc;\r\n }, []);\r\n this.setState({\r\n filterUsers,\r\n });\r\n }\r\n\r\n applyFilters = (filters) => {\r\n const { setAuditListSettings, filtersDates: { StartDate, EndDate } } = this.props;\r\n const newFilters = {\r\n ...filters,\r\n StartDate,\r\n EndDate,\r\n };\r\n const isExistsFilters = Object.keys(newFilters).some((filter) => newFilters[filter] && !isEmptyObject(newFilters[filter]));\r\n setAuditListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n }\r\n\r\n resetFilters = () => {\r\n const { resetAuditListDates, setAuditListSettings } = this.props;\r\n resetAuditListDates();\r\n setAuditListSettings({ filters: {} });\r\n }\r\n\r\n handleChangeDate = (date, name) => {\r\n const { setAuditListDates } = this.props;\r\n setAuditListDates({\r\n [name]: date ? date : undefined,\r\n });\r\n }\r\n\r\n changeAmountReports = (page) => {\r\n const { countAmountReports } = this.state;\r\n const { isLoading } = this.props;\r\n const offSet = 15;\r\n const counterResult = countAmountReports + page * offSet;\r\n if (!isLoading) {\r\n this.setState({\r\n countAmountReports: counterResult,\r\n }, this.checkIfNeedMoreReports);\r\n }\r\n }\r\n\r\n checkIfNeedMoreReports = () => {\r\n const { countAmountReports } = this.state;\r\n const { totalCount } = this.props;\r\n this.setState({\r\n hasMoreReports: countAmountReports > totalCount ? false : true,\r\n });\r\n }\r\n\r\n getAuditReports = (searchValue) => {\r\n const { setAuditListSettings } = this.props;\r\n setAuditListSettings({ searchValue });\r\n }\r\n\r\n render() {\r\n const {\r\n reports, entityFilters, HasFinancialAccess, permissions, filtersDates,\r\n listSettings: { filters, searchValue },\r\n } = this.props;\r\n const { columnsToDisplay, filterUsers, hasMoreReports } = this.state;\r\n return (\r\n \r\n {this.checkDateOrEmptyField(item.PrevValue)}\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) => ({\r\n reports: store.reportsReducer.reports.audit,\r\n totalCount: store.reportsReducer.auditTotalCount,\r\n users: store.adminReducer.users,\r\n offices: store.filtersReducer.filters.Offices,\r\n entityFilters: store.filtersReducer.filters.updateTypeEntity,\r\n HasFinancialAccess: store.authReducer.HasFinancialAccess,\r\n permissions: store.authReducer.user.Permissions,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.auditReducer.listSettings,\r\n filtersDates: store.auditReducer.filtersDates,\r\n}), {\r\n getAuditReports,\r\n getUsers,\r\n setComponent,\r\n resetComponent,\r\n setAuditReports,\r\n setAuditListSettings,\r\n resetAuditListSettings,\r\n setAuditListDates,\r\n resetAuditListDates,\r\n})(Audit);\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { getAmericanFormat } from 'services/getAmericanFormatDigit.js';\r\n\r\nexport class CellRate extends Component {\r\n render() {\r\n const { item, column, viewFinancialInfo } = this.props;\r\n const rate = item.Rate || item.Rate === 0\r\n ? getAmericanFormat(item.Rate)\r\n : '';\r\n return (\r\n viewFinancialInfo ? (\r\n \r\n (\r\n
\r\n \r\n {props.children}
\r\n )}\r\n />\r\n \r\n \r\n \r\n \r\n {props.children}\r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }\r\n}\r\n\r\nAccounting.propTypes = {\r\n location: PropTypes.object.isRequired,\r\n reports: PropTypes.object.isRequired,\r\n offices: PropTypes.array,\r\n accountManagers: PropTypes.array.isRequired,\r\n companies: PropTypes.array.isRequired,\r\n projectsName: PropTypes.array,\r\n getAccountingReports: PropTypes.func.isRequired,\r\n downloadXLSXDocument: PropTypes.func.isRequired,\r\n getFilters: PropTypes.func.isRequired,\r\n getFiltersForWorkForce: PropTypes.func.isRequired,\r\n getManagersByOffice: PropTypes.func.isRequired,\r\n getClients: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n statuses: store.filtersReducer.filters.ProjectStatuses,\r\n offices: store.filtersReducer.filters.Offices,\r\n accountManagers: store.projectsReducer.accountManagersByOffice,\r\n employeeAssignmentStatuses: store.filtersReducer.filters.EmployeeAssignmentStatuses,\r\n companies: store.clientsReducer.clients,\r\n projectsName: store.reportsReducer.filters.projectsName,\r\n totalCount: store.reportsReducer.accountingTotalCoutn,\r\n hasFinancAccess: store.authReducer.user.Permissions.HasFinancialAccess,\r\n defaultCheckedShowRoles: store.showRoles.isOnlyActiveRoles,\r\n role: store.authReducer.user,\r\n columnsToDisplay: store.accountingReducer.columnsToDisplay,\r\n isLoading: store.loadingReducer.isLoading,\r\n listSettings: store.accountingReducer.listSettings,\r\n textDataForFilters: store.accountingReducer.textDataForFilters,\r\n}), {\r\n getAccountingReports,\r\n downloadXLSXDocument,\r\n handleEditViewContract,\r\n changeColumnsToDisplay,\r\n getFilters,\r\n getFiltersForWorkForce,\r\n getManagersByOffice,\r\n getClients,\r\n setComponent,\r\n resetComponent,\r\n setAccountingReports,\r\n setAccountingListFiltersValue,\r\n resetAccountingListFiltersValue,\r\n setAccountingListSettings,\r\n resetAccountingListSettings,\r\n})(Accounting);\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../utils/applicationTitle';\r\nimport { setComponent, resetComponent } from '../../../../common/actions/headerActions';\r\nimport ListToolbar from '../../../../common/components/list-toolbar/list-toolbar';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { getFilters } from 'common/actions/filtersActions';\r\nimport { sortFilterList } from '../../../../common/components/list/sortList';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport { debounce } from '../../../../services/debounce';\r\nimport { List } from '../../../../common/components/list/list';\r\nimport moment from 'moment/moment';\r\nimport isEmptyObject from '../../../../utils/isEmptyObject';\r\nimport { emptyArray, STATUS_BILLABLE_ID } from '../../../../utils/const-variable';\r\nimport {\r\n getClientRatesReports,\r\n changeColumnsToDisplay,\r\n setClientRatesListSettings,\r\n setClientRatesFiltersValue,\r\n setClientRatesReports,\r\n resetClientRatesListSettings,\r\n} from '../../actions/clientRatesActions';\r\nimport { initialState } from '../../reducers/clientRatesReducer';\r\nimport isObjectNotEquals from '../../../../utils/object-comparison';\r\nimport { CellBudget } from '../../../../common/components/list/custom-cell/cell-budget';\r\n\r\nconst filterNames = [\r\n 'Offices',\r\n 'Locations',\r\n 'Positions',\r\n 'RoleSeniorities',\r\n 'BillableProjects',\r\n 'LatestContractDate',\r\n 'BillableStatuses',\r\n];\r\n\r\nexport class ClientRates extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n hasMoreReports: true,\r\n listConfig: {\r\n 'Total': { cell: CellBudget, allowEmpty: true, isFixed: true },\r\n },\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n setComponent, getFilters, listSettings: {\r\n searchValue, sortColumn, sortDirection, takeAmountReports,\r\n },\r\n getClientRatesReports,\r\n setClientRatesFiltersValue,\r\n } = this.props;\r\n\r\n getFilters(filterNames);\r\n const defaultFilters = this.setDefaultFilters();\r\n getClientRatesReports(defaultFilters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n setClientRatesFiltersValue({\r\n StartDate: defaultFilters.StartDate,\r\n EndDate: defaultFilters.EndDate,\r\n });\r\n setComponent({ title: `Client Rates Report - ${defaultFilters.StartDate} - ${defaultFilters.EndDate}` });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const {\r\n getClientRatesReports, listSettings, setComponent,\r\n } = this.props;\r\n const {\r\n filters, searchValue, sortColumn, sortDirection, takeAmountReports,\r\n } = listSettings;\r\n if (prevProps.listSettings !== initialState.listSettings && isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n getClientRatesReports(filters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n }\r\n setComponent({ title: `Client Rates Report - ${filters.StartDate} - ${filters.EndDate}` });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { setClientRatesReports, resetComponent, resetClientRatesListSettings } = this.props;\r\n setClientRatesReports(emptyArray);\r\n resetComponent();\r\n resetClientRatesListSettings();\r\n }\r\n\r\n setDefaultFilters = () => {\r\n const {\r\n listSettings: { filters }, setClientRatesListSettings,\r\n } = this.props;\r\n const currentFilters = {\r\n ...filters,\r\n BillableStatuses: filters.BillableStatuses || [STATUS_BILLABLE_ID],\r\n Offices: filters.Offices || [],\r\n StartDate: filters.StartDate ? filters.StartDate : moment().startOf('month').format('L'),\r\n EndDate: filters.EndDate ? filters.EndDate : moment().format('L'),\r\n IncludeFinishedProjects: filters.IncludeFinishedProjects || true,\r\n };\r\n\r\n setClientRatesListSettings({ filters: currentFilters });\r\n\r\n return currentFilters;\r\n };\r\n\r\n applyFilters = (filters) => {\r\n const { setClientRatesListSettings, textDataForFilters } = this.props;\r\n const newFilters = {\r\n ...filters,\r\n ...textDataForFilters,\r\n };\r\n const isExistsFilters = Object.keys(newFilters).some(filter => newFilters[filter] && !isEmptyObject(newFilters[filter]));\r\n setClientRatesListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n };\r\n\r\n resetFilters = () => {\r\n const { setClientRatesListSettings, setClientRatesFiltersValue, listSettings: { filters } } = this.props;\r\n\r\n const newFilters = {\r\n StartDate: moment().startOf('month').format('L'),\r\n EndDate: moment().format('L'),\r\n IncludeFinishedProjects: filters.IncludeFinishedProjects,\r\n };\r\n\r\n setClientRatesListSettings({ filters: { ...newFilters, BillableStatuses: [STATUS_BILLABLE_ID] } });\r\n setClientRatesFiltersValue({ ...newFilters });\r\n };\r\n\r\n searchClientRatesReports = (searchValue) => {\r\n const { setClientRatesListSettings } = this.props;\r\n setClientRatesListSettings({ searchValue });\r\n };\r\n\r\n handleChangeStartDate = (date) => {\r\n const { setClientRatesFiltersValue } = this.props;\r\n setClientRatesFiltersValue({ StartDate: date ? moment(date).format('MM/DD/YYYY') : null });\r\n };\r\n\r\n handleChangeEndDate = (date) => {\r\n const { setClientRatesFiltersValue } = this.props;\r\n setClientRatesFiltersValue({ EndDate: date ? moment(date).format('MM/DD/YYYY') : null });\r\n };\r\n\r\n changeReportsAmount = (page) => {\r\n const {\r\n isLoading,\r\n listSettings: {\r\n takeAmountReports,\r\n },\r\n setClientRatesListSettings,\r\n } = this.props;\r\n const magnificationFactor = 15;\r\n const increaseParams = takeAmountReports + page * magnificationFactor;\r\n if (!isLoading) {\r\n this.checkIfNeedMoreReports(increaseParams);\r\n setClientRatesListSettings({ takeAmountReports: increaseParams });\r\n }\r\n };\r\n\r\n checkIfNeedMoreReports = (takeAmountReports) => {\r\n const { totalCount } = this.props;\r\n this.setState({\r\n hasMoreReports: takeAmountReports <= totalCount,\r\n });\r\n }\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setClientRatesListSettings } = this.props;\r\n setClientRatesListSettings({\r\n sortColumn,\r\n sortDirection,\r\n });\r\n };\r\n\r\n getRequiredColumns = () => {\r\n const { columnsToDisplay } = this.props;\r\n const requiredColumns = [];\r\n\r\n for (const column of columnsToDisplay) {\r\n if (column.isSelected) {\r\n requiredColumns.push(column.Name.replace(/ /g, ''));\r\n }\r\n }\r\n\r\n return requiredColumns;\r\n }\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n const requestFilters = { ...filters };\r\n requestFilters.requiredColumns = this.getRequiredColumns();\r\n\r\n downloadXLSXDocument(\r\n requestFilters,\r\n searchValue,\r\n 'client-rates-reports/export-xlsx?SearchValue=',\r\n `Client Rates Report_${filters.StartDate}_${filters.EndDate}.xlsx`,\r\n );\r\n };\r\n\r\n handleToggleForFinishedProjects = () => {\r\n const { listSettings: { filters }, setClientRatesListSettings } = this.props;\r\n\r\n const newFilters = {\r\n ...filters,\r\n IncludeFinishedProjects: !filters.IncludeFinishedProjects,\r\n };\r\n\r\n setClientRatesListSettings({ filters: newFilters });\r\n }\r\n\r\n render() {\r\n const {\r\n columnsToDisplay, changeColumnsToDisplay, textDataForFilters,\r\n offices, projects, reports, listSettings: {\r\n sortColumn, sortDirection, filters, searchValue,\r\n }, roleTypes, roleSeniorities, HasFinancialAccess, latestContractDate, billableStatuses, locations,\r\n } = this.props;\r\n const { hasMoreReports, listConfig } = this.state;\r\n\r\n return (\r\n {props.children}
}\r\n // eslint-disable-next-line react/no-unstable-nested-components\r\n contentWrapper={(props) => (\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n offices: store.filtersReducer.filters.Offices,\r\n locations: store.filtersReducer.filters.Locations,\r\n roleTypes: store.filtersReducer.filters.Positions,\r\n billableStatuses: store.filtersReducer.filters.BillableStatuses,\r\n roleSeniorities: store.filtersReducer.filters.RoleSeniorities,\r\n latestContractDate: store.filtersReducer.filters.LatestContractDate,\r\n listSettings: store.clientRatesReducer.listSettings,\r\n textDataForFilters: store.clientRatesReducer.textDataForFilters,\r\n projects: store.filtersReducer.filters.BillableProjects,\r\n columnsToDisplay: store.clientRatesReducer.columnsToDisplay,\r\n totalCount: store.reportsReducer.clientRatesTotalCount,\r\n}), {\r\n getClientRatesReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n changeColumnsToDisplay,\r\n setClientRatesListSettings,\r\n setClientRatesFiltersValue,\r\n setClientRatesReports,\r\n resetClientRatesListSettings,\r\n})(ClientRates);\r\n","import React from 'react';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../utils/applicationTitle';\r\nimport ListToolbar from '../../../../common/components/list-toolbar/list-toolbar';\r\nimport moment from 'moment/moment';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { getFilters } from '../../../../common/actions/filtersActions';\r\nimport { resetComponent, setComponent } from '../../../../common/actions/headerActions';\r\nimport { connect } from 'react-redux';\r\nimport { sortFilterList } from '../../../../common/components/list/sortList';\r\nimport isEmptyObject from '../../../../utils/isEmptyObject';\r\nimport { resetTeamCompositionListSettings, setTeamCompositionListSettings } from '../../actions/teamCompositionActions';\r\nimport { PROJECT_TYPE_BILLABLE, TEAM_COMPOSITION_PROJECT_BASED } from '../../../../utils/const-variable';\r\n\r\nconst filterNames = [\r\n 'Offices',\r\n 'TeamCompositionProjects',\r\n 'ProjectTypes',\r\n 'TeamCompositionReportTypes',\r\n];\r\n\r\nexport class TeamComposition extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.datesToSelect = [];\r\n }\r\n\r\n componentDidMount() {\r\n const { setComponent, getFilters } = this.props;\r\n\r\n getFilters(filterNames);\r\n this.datesToSelect = this.getDatesToSelect();\r\n this.setDefaultFilters();\r\n\r\n setComponent({ title: `Team Composition Report - ${moment().format('MMMM')} ${moment().year()}` });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const { setComponent, listSettings } = this.props;\r\n const { filters } = listSettings;\r\n const month = this.datesToSelect.find(date => date.Id === filters.Month);\r\n const monthName = month.Name && month.Name.replace(' - ', ' ');\r\n\r\n setComponent({ title: `Team Composition Report - ${monthName}` });\r\n }\r\n\r\n componentWillUnmount() {\r\n const { resetComponent, resetTeamCompositionListSettings } = this.props;\r\n\r\n resetComponent();\r\n resetTeamCompositionListSettings();\r\n }\r\n\r\n setDefaultFilters = () => {\r\n const {\r\n listSettings: { filters }, setTeamCompositionListSettings,\r\n } = this.props;\r\n\r\n const currentMonth = this.datesToSelect.find(date => date.Name === moment().format('MMMM - YYYY'));\r\n\r\n const currentFilters = {\r\n ProjectTypes: filters.ProjectTypes || [PROJECT_TYPE_BILLABLE],\r\n Offices: filters.Offices || [],\r\n ReportType: filters.ReportType || TEAM_COMPOSITION_PROJECT_BASED,\r\n Month: filters.Month || currentMonth.Id,\r\n };\r\n\r\n setTeamCompositionListSettings({ filters: currentFilters });\r\n\r\n return currentFilters;\r\n };\r\n\r\n getDatesToSelect = () => {\r\n const monthsToEndOfYear = 12 - moment().month();\r\n const datesToSelect = [];\r\n let id = 1;\r\n for (let i = 12; i > 0; i--) {\r\n const date = moment().subtract(i, 'month');\r\n datesToSelect.push({ Id: id++, Name: date.format('MMMM - YYYY') });\r\n }\r\n for (let i = 0; i < monthsToEndOfYear; i++) {\r\n const date = moment().add(i, 'month');\r\n datesToSelect.push({ Id: id++, Name: date.format('MMMM - YYYY') });\r\n }\r\n\r\n return datesToSelect;\r\n }\r\n\r\n applyFilters = (filters) => {\r\n const { setTeamCompositionListSettings } = this.props;\r\n const newFilters = {\r\n ...filters,\r\n };\r\n\r\n const isExistsFilters = Object.keys(newFilters).some(filter => newFilters[filter] && (typeof newFilters[filter] === 'number'\r\n || !isEmptyObject(newFilters[filter])));\r\n setTeamCompositionListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n };\r\n\r\n resetFilters = () => {\r\n const { setTeamCompositionListSettings } = this.props;\r\n\r\n const currentMonth = this.datesToSelect.find(date => date.Name === moment().format('MMMM - YYYY'));\r\n\r\n const newFilters = {\r\n ProjectTypes: [PROJECT_TYPE_BILLABLE],\r\n ReportType: TEAM_COMPOSITION_PROJECT_BASED,\r\n Month: currentMonth.Id,\r\n };\r\n\r\n setTeamCompositionListSettings({ filters: { ...newFilters } });\r\n };\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument, listSettings } = this.props;\r\n const { filters } = listSettings;\r\n const month = this.datesToSelect.find(date => date.Id === filters.Month);\r\n const downloadFilters = {\r\n ...filters,\r\n Month: month.Name,\r\n };\r\n\r\n downloadXLSXDocument(\r\n downloadFilters,\r\n '',\r\n 'team-composition-reports/export-xlsx?SearchValue=',\r\n `Team Composition Report - ${month.Name}.xlsx`,\r\n );\r\n };\r\n\r\n render() {\r\n const {\r\n offices, projects, projectTypes, teamCompositionReportTypes, listSettings: { filters },\r\n } = this.props;\r\n\r\n return (\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 => ({\r\n offices: store.filtersReducer.filters.Offices,\r\n projects: store.filtersReducer.filters.TeamCompositionProjects,\r\n projectTypes: store.filtersReducer.filters.ProjectTypes,\r\n teamCompositionReportTypes: store.filtersReducer.filters.TeamCompositionReportTypes,\r\n listSettings: store.teamCompositionReducer.listSettings,\r\n}), {\r\n getFilters,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n setTeamCompositionListSettings,\r\n resetTeamCompositionListSettings,\r\n})(TeamComposition);\r\n","import * as React from 'react';\r\nimport isObjectNotEquals from '../../../../utils/object-comparison';\r\nimport { emptyArray } from '../../../../utils/const-variable';\r\nimport isEmptyObject from '../../../../utils/isEmptyObject';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../utils/applicationTitle';\r\nimport ListToolbar from '../../../../common/components/list-toolbar/list-toolbar';\r\nimport { sortFilterList } from '../../../../common/components/list/sortList';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport { debounce } from '../../../../services/debounce';\r\nimport { List } from '../../../../common/components/list/list';\r\nimport { connect } from 'react-redux';\r\nimport {\r\n changeColumnsToDisplay,\r\n getTrainingsReports,\r\n resetTrainingsReportsListSettings,\r\n setTrainingsReports,\r\n setTrainingsReportsListSettings,\r\n} from '../../actions/trainingsActions';\r\nimport { getFilters } from '../../../../common/actions/filtersActions';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { resetComponent, setComponent } from '../../../../common/actions/headerActions';\r\nimport { initialState, defaultColumnsToDisplay } from '../../reducers/trainingsReducer';\r\n\r\nconst filterNames = [\r\n 'Offices',\r\n 'EmployeeStatusesNew',\r\n 'Clients',\r\n 'Trainings',\r\n];\r\n\r\nexport class Trainings extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.headerWrapperRef = React.createRef();\r\n this.scrollBarRef = React.createRef();\r\n\r\n this.state = {\r\n hasMoreReports: true,\r\n scrollBarValues: null,\r\n trainingsCount: 0,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n setComponent, getFilters, listSettings: {\r\n searchValue, sortColumn, sortDirection, takeAmountReports,\r\n },\r\n getTrainingsReports,\r\n } = this.props;\r\n\r\n getFilters(filterNames);\r\n const defaultFilters = this.setDefaultFilters();\r\n getTrainingsReports(defaultFilters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n this.setColumnsForTrainings();\r\n setComponent({ title: 'Trainings Report' });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const {\r\n getTrainingsReports, listSettings, reports,\r\n } = this.props;\r\n const { trainingsCount } = this.state;\r\n const {\r\n filters, searchValue, sortColumn, sortDirection, takeAmountReports,\r\n } = listSettings;\r\n if (prevProps.listSettings !== initialState.listSettings && isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n getTrainingsReports(filters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n this.setColumnsForTrainings();\r\n }\r\n\r\n if (reports.trainings && reports.trainings.length !== trainingsCount) {\r\n this.setColumnsForTrainings();\r\n this.setState({\r\n trainingsCount: reports.trainings.length,\r\n });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { setTrainingsReports, resetComponent, resetTrainingsReportsListSettings } = this.props;\r\n setTrainingsReports(emptyArray);\r\n resetComponent();\r\n resetTrainingsReportsListSettings();\r\n }\r\n\r\n sortTrainingsByOrder = (a, b) => {\r\n if (a.Order < b.Order) {\r\n return -1;\r\n }\r\n if (a.Order > b.Order) {\r\n return 1;\r\n }\r\n return 0;\r\n }\r\n\r\n setColumnsForTrainings = () => {\r\n const {\r\n changeColumnsToDisplay, listSettings: { filters }, trainings,\r\n } = this.props;\r\n\r\n const filteredByTrainings = filters && filters.Trainings;\r\n const templateColumnObject = {\r\n className: 'medium-col',\r\n isDate: true,\r\n isTrainingReport: true,\r\n isSelected: true,\r\n hideArrows: true,\r\n };\r\n const columnsWithTrainings = filteredByTrainings && filters.Trainings.length > 0 ? filters.Trainings\r\n .map(training => {\r\n const trainingObj = trainings.find(item => item.Id === training);\r\n return {\r\n ...templateColumnObject,\r\n Name: trainingObj.Name,\r\n Id: `EmployeeTrainings.${trainingObj.Id}.DateOfPassing`,\r\n Order: trainingObj.Order,\r\n };\r\n }).sort(this.sortTrainingsByOrder) : trainings && trainings\r\n .sort(this.sortTrainingsByOrder)\r\n .map(training => {\r\n return {\r\n ...templateColumnObject,\r\n Name: training.Name,\r\n Id: `EmployeeTrainings.${training.Id}.DateOfPassing`,\r\n };\r\n });\r\n const newColumnsToDisplay = [...defaultColumnsToDisplay, ...columnsWithTrainings];\r\n\r\n changeColumnsToDisplay(newColumnsToDisplay);\r\n }\r\n\r\n setDefaultFilters = () => {\r\n const {\r\n listSettings: { filters }, setTrainingsReportsListSettings,\r\n } = this.props;\r\n const currentFilters = {\r\n ...filters,\r\n Offices: filters.Offices || [],\r\n EmployeeTypes: filters.EmployeeTypes || [],\r\n Clients: filters.Clients || [],\r\n Trainings: filters.Trainings || [],\r\n };\r\n\r\n setTrainingsReportsListSettings({ filters: currentFilters });\r\n\r\n return currentFilters;\r\n };\r\n\r\n applyFilters = (filters) => {\r\n const { setTrainingsReportsListSettings, textDataForFilters } = this.props;\r\n const newFilters = {\r\n ...filters,\r\n ...textDataForFilters,\r\n };\r\n const isExistsFilters = Object.keys(newFilters).some(filter => newFilters[filter] && !isEmptyObject(newFilters[filter]));\r\n setTrainingsReportsListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n };\r\n\r\n resetFilters = () => {\r\n const { resetTrainingsReportsListSettings } = this.props;\r\n resetTrainingsReportsListSettings();\r\n }\r\n\r\n searchTrainingsReports = (searchValue) => {\r\n const { setTrainingsReportsListSettings } = this.props;\r\n setTrainingsReportsListSettings({ searchValue });\r\n }\r\n\r\n changeReportsAmount = (page) => {\r\n const {\r\n isLoading,\r\n listSettings: {\r\n takeAmountReports,\r\n },\r\n setTrainingsReportsListSettings,\r\n } = this.props;\r\n const magnificationFactor = 15;\r\n const increaseParams = takeAmountReports + page * magnificationFactor;\r\n if (!isLoading) {\r\n this.checkIfNeedMoreReports(increaseParams);\r\n setTrainingsReportsListSettings({ takeAmountReports: increaseParams });\r\n }\r\n };\r\n\r\n checkIfNeedMoreReports = (takeAmountReports) => {\r\n const { totalCount } = this.props;\r\n this.setState({\r\n hasMoreReports: takeAmountReports <= totalCount,\r\n });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setTrainingsReportsListSettings } = this.props;\r\n setTrainingsReportsListSettings({\r\n sortColumn,\r\n sortDirection,\r\n });\r\n };\r\n\r\n getRequiredColumns = () => {\r\n const { columnsToDisplay } = this.props;\r\n const requiredColumns = [];\r\n\r\n for (const column of columnsToDisplay) {\r\n if (column.isSelected) {\r\n requiredColumns.push(column.Name.replace(/ /g, ''));\r\n }\r\n }\r\n\r\n return requiredColumns;\r\n };\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n const requestFilters = { ...filters };\r\n requestFilters.requiredColumns = this.getRequiredColumns();\r\n\r\n downloadXLSXDocument(\r\n requestFilters,\r\n searchValue,\r\n 'trainings-reports/export-xlsx?SearchValue=',\r\n 'Trainings Report.xlsx',\r\n );\r\n };\r\n\r\n render() {\r\n const {\r\n columnsToDisplay, offices, employeeTypes, clients, trainings, reports,\r\n listSettings: {\r\n sortColumn, sortDirection, filters, searchValue,\r\n },\r\n } = this.props;\r\n const { hasMoreReports } = this.state;\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n offices: store.filtersReducer.filters.Offices,\r\n employeeTypes: store.filtersReducer.filters.EmployeeStatusesNew,\r\n clients: store.filtersReducer.filters.Clients,\r\n trainings: store.filtersReducer.filters.Trainings,\r\n listSettings: store.trainingsReducer.listSettings,\r\n columnsToDisplay: store.trainingsReducer.columnsToDisplay,\r\n totalCount: store.reportsReducer.trainingsTotalCount,\r\n}), {\r\n getTrainingsReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n changeColumnsToDisplay,\r\n setTrainingsReportsListSettings,\r\n setTrainingsReports,\r\n resetTrainingsReportsListSettings,\r\n})(Trainings);\r\n","import * as React from 'react';\r\nimport isObjectNotEquals from '../../../../utils/object-comparison';\r\nimport { emptyArray } from '../../../../utils/const-variable';\r\nimport isEmptyObject from '../../../../utils/isEmptyObject';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../utils/applicationTitle';\r\nimport ListToolbar from '../../../../common/components/list-toolbar/list-toolbar';\r\nimport { sortFilterList } from '../../../../common/components/list/sortList';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport { debounce } from '../../../../services/debounce';\r\nimport { List } from '../../../../common/components/list/list';\r\nimport { connect } from 'react-redux';\r\nimport {\r\n changeColumnsToDisplay,\r\n getBackgroundChecksReports,\r\n resetBackgroundChecksReportsListSettings,\r\n setBackgroundChecksReports,\r\n setBackgroundChecksReportsListSettings,\r\n} from '../../actions/backgroundChecksActions';\r\nimport { getFilters } from '../../../../common/actions/filtersActions';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { resetComponent, setComponent } from '../../../../common/actions/headerActions';\r\nimport { initialState } from '../../reducers/backgroundChecksReducer';\r\n\r\nconst filterNames = [\r\n 'Offices',\r\n 'EmployeeStatusesNew',\r\n 'Clients',\r\n];\r\n\r\nexport class BackgroundChecks extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n hasMoreReports: true,\r\n backgroundChecksCount: 0,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n setComponent, getFilters, listSettings: {\r\n searchValue, sortColumn, sortDirection, takeAmountReports,\r\n },\r\n getBackgroundChecksReports,\r\n } = this.props;\r\n\r\n getFilters(filterNames);\r\n const defaultFilters = this.setDefaultFilters();\r\n getBackgroundChecksReports(defaultFilters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n setComponent({ title: 'Background Checks Report' });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const {\r\n getBackgroundChecksReports, listSettings, reports,\r\n } = this.props;\r\n const { backgroundChecksCount } = this.state;\r\n const {\r\n filters, searchValue, sortColumn, sortDirection, takeAmountReports,\r\n } = listSettings;\r\n if (prevProps.listSettings !== initialState.listSettings && isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n getBackgroundChecksReports(filters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n }\r\n\r\n if (reports.backgroundChecks && reports.backgroundChecks.length !== backgroundChecksCount) {\r\n this.setState({\r\n backgroundChecksCount: reports.backgroundChecks.length,\r\n });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const {\r\n setBackgroundChecksReports, resetComponent, resetBackgroundChecksReportsListSettings,\r\n } = this.props;\r\n setBackgroundChecksReports(emptyArray);\r\n resetComponent();\r\n resetBackgroundChecksReportsListSettings();\r\n }\r\n\r\n setDefaultFilters = () => {\r\n const {\r\n listSettings: { filters }, setBackgroundChecksReportsListSettings,\r\n } = this.props;\r\n\r\n const currentFilters = {\r\n ...filters,\r\n Offices: filters.Offices || [],\r\n EmployeeTypes: filters.EmployeeTypes || [],\r\n Clients: filters.Clients || [],\r\n };\r\n\r\n setBackgroundChecksReportsListSettings({ filters: currentFilters });\r\n\r\n return currentFilters;\r\n };\r\n\r\n applyFilters = (filters) => {\r\n const { setBackgroundChecksReportsListSettings, textDataForFilters } = this.props;\r\n const newFilters = {\r\n ...filters,\r\n ...textDataForFilters,\r\n };\r\n const isExistsFilters = Object.keys(newFilters).some(filter => newFilters[filter] && !isEmptyObject(newFilters[filter]));\r\n setBackgroundChecksReportsListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n };\r\n\r\n resetFilters = () => {\r\n const { resetBackgroundChecksReportsListSettings } = this.props;\r\n resetBackgroundChecksReportsListSettings();\r\n };\r\n\r\n searchBackgroundChecksReports = (searchValue) => {\r\n const { setBackgroundChecksReportsListSettings } = this.props;\r\n setBackgroundChecksReportsListSettings({ searchValue });\r\n };\r\n\r\n changeReportsAmount = (page) => {\r\n const {\r\n isLoading,\r\n listSettings: {\r\n takeAmountReports,\r\n },\r\n setBackgroundChecksListSettings,\r\n } = this.props;\r\n const magnificationFactor = 15;\r\n const increaseParams = takeAmountReports + page * magnificationFactor;\r\n if (!isLoading) {\r\n this.checkIfNeedMoreReports(increaseParams);\r\n setBackgroundChecksListSettings({ takeAmountReports: increaseParams });\r\n }\r\n };\r\n\r\n checkIfNeedMoreReports = (takeAmountReports) => {\r\n const { totalCount } = this.props;\r\n this.setState({\r\n hasMoreReports: takeAmountReports <= totalCount,\r\n });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setBackgroundChecksReportsListSettings } = this.props;\r\n setBackgroundChecksReportsListSettings({\r\n sortColumn,\r\n sortDirection,\r\n });\r\n };\r\n\r\n getRequiredColumns = () => {\r\n const { columnsToDisplay } = this.props;\r\n const requiredColumns = [];\r\n\r\n for (const column of columnsToDisplay) {\r\n if (column.isSelected) {\r\n requiredColumns.push(column.Name.replace(/ /g, ''));\r\n }\r\n }\r\n\r\n return requiredColumns;\r\n };\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n const requestFilters = { ...filters };\r\n requestFilters.requiredColumns = this.getRequiredColumns();\r\n\r\n downloadXLSXDocument(\r\n requestFilters,\r\n searchValue,\r\n 'background-checks-reports/export-xlsx?SearchValue=',\r\n 'Background Checks Report.xlsx',\r\n );\r\n };\r\n\r\n render() {\r\n const {\r\n columnsToDisplay, offices, employeeTypes, clients, reports,\r\n listSettings: {\r\n sortColumn, sortDirection, filters, searchValue,\r\n },\r\n } = this.props;\r\n const { hasMoreReports } = this.state;\r\n\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\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n offices: store.filtersReducer.filters.Offices,\r\n employeeTypes: store.filtersReducer.filters.EmployeeStatusesNew,\r\n clients: store.filtersReducer.filters.Clients,\r\n listSettings: store.backgroundChecksReducer.listSettings,\r\n columnsToDisplay: store.backgroundChecksReducer.columnsToDisplay,\r\n totalCount: store.reportsReducer.backgroundChecksTotalCount,\r\n}), {\r\n getBackgroundChecksReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n changeColumnsToDisplay,\r\n setBackgroundChecksReportsListSettings,\r\n setBackgroundChecksReports,\r\n resetBackgroundChecksReportsListSettings,\r\n})(BackgroundChecks);\r\n","import * as React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport {\r\n changeColumnsToDisplay,\r\n getCertificationsReports,\r\n resetCertificationsReportsListSettings,\r\n setCertificationsReports,\r\n setCertificationsReportsListSettings,\r\n} from '../../actions/certificationsActions';\r\nimport { getFilters } from '../../../../common/actions/filtersActions';\r\nimport { downloadXLSXDocument } from '../../actions/xlsx-action';\r\nimport { resetComponent, setComponent } from '../../../../common/actions/headerActions';\r\nimport { initialState } from '../../reducers/certificationsReducer';\r\nimport isObjectNotEquals from '../../../../utils/object-comparison';\r\nimport { emptyArray } from '../../../../utils/const-variable';\r\nimport isEmptyObject from '../../../../utils/isEmptyObject';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from '../../../../utils/applicationTitle';\r\nimport ListToolbar from '../../../../common/components/list-toolbar/list-toolbar';\r\nimport { sortFilterList } from '../../../../common/components/list/sortList';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport InfiniteScroll from 'react-infinite-scroller';\r\nimport { debounce } from '../../../../services/debounce';\r\nimport { List } from '../../../../common/components/list/list';\r\nimport { CustomStatusCell } from '../../../../common/components/list/custom-cell/custom-status-cell';\r\n\r\nconst filterNames = [\r\n 'Offices',\r\n 'EmployeeStatusesNew',\r\n 'CertificationStatuses',\r\n];\r\n\r\nexport class Certifications extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n hasMoreReports: true,\r\n certificationsCount: 0,\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n const {\r\n setComponent, getFilters, listSettings: {\r\n searchValue, sortColumn, sortDirection, takeAmountReports,\r\n },\r\n getCertificationsReports,\r\n } = this.props;\r\n\r\n getFilters(filterNames);\r\n const defaultFilters = this.setDefaultFilters();\r\n getCertificationsReports(defaultFilters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n setComponent({ title: 'Certifications Report' });\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const {\r\n getCertificationsReports, listSettings, reports,\r\n } = this.props;\r\n const { certificationsCount } = this.state;\r\n const {\r\n filters, searchValue, sortColumn, sortDirection, takeAmountReports,\r\n } = listSettings;\r\n if (prevProps.listSettings !== initialState.listSettings && isObjectNotEquals(prevProps.listSettings, listSettings)) {\r\n getCertificationsReports(filters, searchValue, takeAmountReports, 0, { column: sortColumn, sortDirection });\r\n }\r\n\r\n if (reports.certifications && reports.certifications.length !== certificationsCount) {\r\n this.setState({\r\n certificationsCount: reports.certifications.length,\r\n });\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n const { setCertificationsReports, resetComponent, resetCertificationsReportsListSettings } = this.props;\r\n setCertificationsReports(emptyArray);\r\n resetComponent();\r\n resetCertificationsReportsListSettings();\r\n }\r\n\r\n setDefaultFilters = () => {\r\n const {\r\n listSettings: { filters }, setCertificationsReportsListSettings,\r\n } = this.props;\r\n const currentFilters = {\r\n ...filters,\r\n Offices: filters.Offices || [],\r\n EmployeeStatusesNew: filters.EmployeeStatusesNew || [],\r\n EmployeeCertificateStatuses: filters.EmployeeCertificateStatuses || [],\r\n };\r\n\r\n setCertificationsReportsListSettings({ filters: currentFilters });\r\n\r\n return currentFilters;\r\n };\r\n\r\n applyFilters = (filters) => {\r\n const { setCertificationsReportsListSettings, textDataForFilters } = this.props;\r\n const newFilters = {\r\n ...filters,\r\n ...textDataForFilters,\r\n };\r\n const isExistsFilters = Object.keys(newFilters).some(filter => newFilters[filter] && !isEmptyObject(newFilters[filter]));\r\n setCertificationsReportsListSettings({\r\n filters: isExistsFilters ? newFilters : {},\r\n });\r\n };\r\n\r\n resetFilters = () => {\r\n const { resetCertificationsReportsListSettings } = this.props;\r\n resetCertificationsReportsListSettings();\r\n };\r\n\r\n searchCertificationsReports = (searchValue) => {\r\n const { setCertificationsReportsListSettings } = this.props;\r\n setCertificationsReportsListSettings({ searchValue });\r\n };\r\n\r\n changeReportsAmount = (page) => {\r\n const {\r\n isLoading,\r\n listSettings: {\r\n takeAmountReports,\r\n },\r\n setCertificationsReportsListSettings,\r\n } = this.props;\r\n const magnificationFactor = 15;\r\n const increaseParams = takeAmountReports + page * magnificationFactor;\r\n if (!isLoading) {\r\n setCertificationsReportsListSettings({ takeAmountReports: increaseParams });\r\n }\r\n };\r\n\r\n checkIfNeedMoreReports = (takeAmountReports) => {\r\n const { totalCount } = this.props;\r\n this.setState({\r\n hasMoreReports: takeAmountReports <= totalCount,\r\n });\r\n };\r\n\r\n setSortSettings = (sortColumn, sortDirection) => {\r\n const { setCertificationsReportsListSettings } = this.props;\r\n setCertificationsReportsListSettings({ sortColumn, sortDirection });\r\n }\r\n\r\n downloadXLSXDocument = () => {\r\n const { downloadXLSXDocument, listSettings } = this.props;\r\n const { searchValue, filters } = listSettings;\r\n\r\n downloadXLSXDocument(\r\n filters,\r\n searchValue,\r\n 'certifications-reports/export-xlsx?SearchValue=',\r\n 'Certifications Report.xlsx',\r\n );\r\n }\r\n\r\n render() {\r\n const {\r\n columnsToDisplay, offices, employeeTypes, statuses, reports,\r\n listSettings: {\r\n sortColumn, sortDirection, filters, searchValue,\r\n },\r\n } = this.props;\r\n const { hasMoreReports } = this.state;\r\n\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\nexport default connect((store) => ({\r\n reports: store.reportsReducer.reports,\r\n offices: store.filtersReducer.filters.Offices,\r\n employeeTypes: store.filtersReducer.filters.EmployeeStatusesNew,\r\n statuses: store.filtersReducer.filters.CertificationStatuses,\r\n listSettings: store.certificationsReducer.listSettings,\r\n columnsToDisplay: store.certificationsReducer.columnsToDisplay,\r\n totalCount: store.reportsReducer.certificationsTotalCount,\r\n}), {\r\n getCertificationsReports,\r\n getFilters,\r\n downloadXLSXDocument,\r\n setComponent,\r\n resetComponent,\r\n changeColumnsToDisplay,\r\n setCertificationsReportsListSettings,\r\n setCertificationsReports,\r\n resetCertificationsReportsListSettings,\r\n})(Certifications);\r\n","import React, { Component } from 'react';\r\nimport { Switch, Route, Redirect } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport SoWExtensionForecastList from './components/sow-list/sow-list';\r\nimport BenchSummary from './components/bench-summary-list/bench-list';\r\nimport Workforce from './components/workforce-list/workforce-list';\r\nimport BenchReports from './components/bench-list/bench-list';\r\nimport ProjectedRevenueReports from './components/finance-list/finance-list';\r\nimport Audit from './components/audit-list/audit-list';\r\nimport Accounting from './components/accounting-list/accounting-list';\r\nimport ClientRates from './components/client-rates-list/client-rates-list';\r\nimport TeamComposition from './components/team-composition/team-composition';\r\nimport Trainings from './components/trainings-list/trainings-list';\r\nimport BackgroundChecks from './components/background-checks-list/background-checks-list';\r\nimport Certifications from './components/certifications-list/certifications-list';\r\n\r\nexport class ReportsPage extends Component {\r\n SoWExtensionForecast = (props) => {\r\n const { HasFinancialAccess, ManageProjectRoles, ManageProjectContracts } = this.props;\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component, Fragment } from 'react';\r\nimport 'babel-polyfill';\r\nimport PropTypes from 'prop-types';\r\nimport { connect } from 'react-redux';\r\nimport {\r\n Router, Route, Switch, Redirect,\r\n} from 'react-router-dom';\r\nimport history from 'utils/history';\r\nimport SidebarComponent from 'common/components/sidebar/sidebar';\r\nimport HeaderComponent from 'common/components/header/header';\r\nimport { logout } from 'common/actions/authActions';\r\nimport { setRoles } from 'common/actions/userRoleActions';\r\nimport { getVersion } from 'common/actions/versionActions';\r\nimport { closeDialog, confirmDeleteDialog, closeAlertDialog } from 'common/actions/confirmationDialogActions';\r\nimport ProjectsPageComponent from 'pages/projects/projects-page';\r\nimport LoginPage from 'pages/login/login-page';\r\nimport MembersPage from 'pages/members/members-page';\r\nimport ClientsPage from 'pages/clients/clients-page';\r\nimport OfficesPage from 'pages/offices/offices-page';\r\nimport BillingPageComponent from 'pages/billing/billing-page';\r\nimport AdminPage from 'pages/admin/admin-page';\r\nimport ContractsPage from 'pages/contracts/contracts-page';\r\nimport ReportsPage from 'pages/reports/reports-page';\r\nimport MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';\r\nimport { createTheme } from '@material-ui/core/styles';\r\nimport { MuiPickersUtilsProvider } from 'material-ui-pickers';\r\nimport MomentUtils from '@date-io/moment';\r\nimport Scrollbars from 'react-custom-scrollbars';\r\nimport { Preloader } from 'common/components/preloader/preloader.js';\r\nimport { ConfirmationDialog } from 'common/components/confirmation-dialog/confirmation-dialog.js';\r\nimport { AlertDialog } from 'common/components/alert-dialog/alert-dialog.js';\r\nimport DocumentTitle from 'react-document-title';\r\nimport { applicationTitle } from 'utils/applicationTitle';\r\nimport { getPrevPathForEmployees } from './pages/members/actions/membersActions';\r\nimport { getPrevPathForProjects } from './pages/projects/actions/projectsActions';\r\n\r\nimport './App.css';\r\n\r\nconst theme = createTheme({\r\n palette: {\r\n primary: {\r\n light: '#F26939',\r\n main: '#F26939',\r\n dark: '#F26939',\r\n contrastText: '#fff',\r\n },\r\n secondary: {\r\n main: '#f44336',\r\n },\r\n },\r\n typography: {\r\n useNextVariants: true,\r\n },\r\n});\r\nclass AppRoute extends Component {\r\n componentDidMount() {\r\n const notifications = JSON.parse(sessionStorage.getItem('notifications'));\r\n if (!notifications) {\r\n sessionStorage.setItem('notifications', JSON.stringify({ notifications: [] }));\r\n }\r\n const {\r\n role, setRoles, getVersion,\r\n } = this.props;\r\n role && setRoles(role.UserRoles);\r\n getVersion();\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n const {\r\n role, setRoles, version, getVersion, resetStore,\r\n } = this.props;\r\n if (prevProps.role !== role && role !== null) {\r\n setRoles(role.UserRoles);\r\n }\r\n if (prevProps.version !== version) {\r\n getVersion();\r\n }\r\n }\r\n\r\n ProjectsPage = (props) => {\r\n const { role, getPrevPathForEmployees } = this.props;\r\n getPrevPathForEmployees('');\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {\r\n isLoading > 0 ? \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