\r\n \r\n {this.props.isDalkia ? ![](\"~/assets/dalkia-logo.png\"/)
:\r\n ![](\"~/assets/cetetherm-logo.png\"/)
}\r\n \r\n\r\n \r\n ![](\"~/assets/icons/icon_web_select.svg\"/)
\r\n \r\n \r\n \r\n\r\n \r\n ![](\"~/assets/icons/icon_web_select.svg\")
\r\n \r\n \r\n \r\n\r\n {this.props.sparePartsFinderAccess && (\r\n \r\n ![](\"~/assets/icons/icon_spare_parts_finder.svg\"/)
\r\n \r\n )}\r\n\r\n {this.props.mediaBankAccess && (\r\n \r\n ![](\"~/assets/icons/icon_media_bank.svg\"/)
\r\n \r\n )}\r\n
\r\n )\r\n }\r\n}\r\n\r\nwindow.components.DesktopNavigation = DesktopNavigation;","import {registerJQueryComponent} from '@lib/JQueryRegistry'\r\nimport hasParentWithClassName from '@lib/hasParentWithClassName'\r\n\r\nexport default class Dropdown {\r\n constructor(rootElement) {\r\n this.$dom = {\r\n root: rootElement,\r\n body: rootElement.find('.dropdown-body'),\r\n button: rootElement.find('.dropdown-button'),\r\n items: rootElement.find('.dropdown-item').toJQueryObjectsArray(),\r\n window: $(window)\r\n }\r\n\r\n this.$state = {\r\n open: false\r\n }\r\n\r\n this.$dom.window.click(this.onWindowClick)\r\n this.$dom.button.click(this.onButtonClick)\r\n this.$dom.items.forEach(item => {\r\n item.click(() => this.onItemClick(item))\r\n })\r\n }\r\n\r\n onButtonClick = () => {\r\n if (this.$state.open) {\r\n this.close()\r\n } else {\r\n this.open()\r\n }\r\n }\r\n\r\n onItemClick = item => {\r\n this.close()\r\n this.$dom.root.trigger('dropdown.change', item)\r\n }\r\n\r\n onWindowClick = e => {\r\n if (this.$state.open) {\r\n if (!hasParentWithClassName(e.target, 'dropdown')) {\r\n this.close()\r\n }\r\n }\r\n }\r\n\r\n open() {\r\n this.$dom.root.addClass('dropdown--open')\r\n this.$dom.button.addClass('active')\r\n this.$dom.body.show()\r\n\r\n this.$state.open = true\r\n }\r\n\r\n close() {\r\n this.$dom.root.removeClass('dropdown--open')\r\n this.$dom.button.removeClass('active')\r\n this.$dom.body.hide()\r\n\r\n this.$state.open = false\r\n }\r\n}\r\n\r\nregisterJQueryComponent(Dropdown, '.dropdown:not(.dropdown--react)')","import React from 'react';\r\nimport hasParentWithClassName from '@lib/hasParentWithClassName'\r\n\r\nexport default class Dropdown extends React.Component {\r\n state = {\r\n open: false\r\n }\r\n\r\n onButtonClick = e => {\r\n if (this.props.disabled) {\r\n return;\r\n }\r\n\r\n this.setState({\r\n open: !this.state.open\r\n })\r\n\r\n if (!this.state.open) {\r\n window.addEventListener('click', this.onWindowClick)\r\n } else {\r\n window.removeEventListener('click', this.onWindowClick)\r\n }\r\n }\r\n\r\n onItemClick = item => {\r\n if (this.props.onItemClick) {\r\n this.props.onItemClick(item)\r\n }\r\n\r\n this.setState({open: false})\r\n window.removeEventListener('click', this.onWindowClick)\r\n }\r\n\r\n onWindowClick = e => {\r\n if (!hasParentWithClassName(e.target, 'dropdown--react')) {\r\n this.setState({open: false})\r\n window.removeEventListener('click', this.onWindowClick)\r\n }\r\n }\r\n\r\n renderButton() {\r\n const DropdownIcon = this.props.icon;\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\n \r\n \r\n \r\n \r\n\r\n {this.props.sparePartsFinderAccess && (\r\n \r\n \r\n \r\n )}\r\n\r\n {this.props.mediaBankAccess && (\r\n \r\n \r\n \r\n )}\r\n \r\n
\r\n )\r\n }\r\n\r\n renderCaption = () => this.props.renderCaption ? this.props.renderCaption() : this.props.caption\r\n\r\n render() {\r\n const renderItemIcon = item => {\r\n const ItemComponent = item.icon;\r\n return \r\n {this.props.icon && (\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n {this.renderButton()}\r\n\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\n\r\nexport default class ExpandableFloatingButton extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n open: false\r\n }\r\n }\r\n\r\n onRootClick = e => {\r\n this.setState({\r\n open: !this.state.open\r\n });\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.props.items.map(item => (\r\n
\r\n this.onItemClick(item)}>\r\n {item.icon && (\r\n \r\n {renderItemIcon(item)}\r\n \r\n )}\r\n\r\n {item.label}\r\n
\r\n ))}\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\n\r\nclass ExpandableFloatingDropdownItem extends React.Component {\r\n render() {\r\n return (\r\n \r\n {this.props.children.map((child, idx) => (\r\n
\r\n\r\n \r\n {child}\r\n
\r\n ))}\r\n \r\n \r\n
\r\n \r\n {this.props.children}\r\n
\r\n )\r\n }\r\n}\r\n\r\nclass ExpandableFloatingDropdownDivider extends React.Component {\r\n render() {\r\n return (\r\n \r\n )\r\n }\r\n}\r\n\r\nexport default class ExpandableFloatingDropdown extends React.Component {\r\n\r\n static Item = ExpandableFloatingDropdownItem;\r\n static Divider = ExpandableFloatingDropdownDivider;\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n open: false\r\n }\r\n }\r\n\r\n onRootClick = e => {\r\n this.setState({\r\n open: !this.state.open\r\n });\r\n }\r\n\r\n close = () => {\r\n this.setState({\r\n open: false\r\n });\r\n }\r\n\r\n render() {\r\n const children = Array.isArray(this.props.children) ? this.props.children.filter(x => x) : [this.props.children];\r\n\r\n return (\r\n \r\n
\r\n )\r\n }\r\n}\r\n","import React from 'react';\r\n\r\nexport default class FloatingButton extends React.Component {\r\n\r\n static Theme = {\r\n Filled: 'filled',\r\n BorderOnly: 'border-only'\r\n }\r\n\r\n static defaultProps = {\r\n theme: FloatingButton.Theme.Filled\r\n }\r\n\r\n render() {\r\n const classNames = [\r\n 'floating-button',\r\n 'floating-button-theme-' + this.props.theme\r\n ]\r\n\r\n return (\r\n \r\n \r\n\r\n \r\n
\r\n\r\n \r\n {children.map((child, idx) => (\r\n
\r\n \r\n {child}\r\n
\r\n ))}\r\n \r\n {this.props.children}\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Assets from '../../Assets';\r\nimport Tooltip from './Tooltip';\r\n\r\nexport default class HelpSystemInformation extends React.Component {\r\n render() {\r\n if (this.props.text)\r\n return | \r\n | \r\n ||
| {item.userName} | \r\n\r\n
| \r\n {item.humanizedDate} | \r\n
- \r\n {changes.propertyChanges.map((c, idx)=>
- {createPropertyChange(c)} )}\r\n
\r\n
)\r\n\r\n }\r\n\r\n\r\n render() {\r\n\r\n return (\r\n\r\n \r\n {__(\"Files to import:\")}\r\n
\r\n {fileNames.map(f => {'> ' + f + ' <'}
)}\r\n\r\n \r\n
\r\n < input type=\"file\" ref={this.hiddenInputRef} onChange={this.handleHiddenFileInputChange}\r\n hidden={true}>\r\n \r\n {this.state.fileName === '' ? __('Drag and drop file or click to browse from disk.') : this.renderFilledBody()}\r\n
\r\n \r\n \r\n \r\n )}\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Button from './Button';\r\n\r\nexport default class LinkButton extends Button {\r\n render() {\r\n return (\r\n \r\n {super.render()}\r\n \r\n )\r\n }\r\n}\r\n","import React from 'react';\r\n\r\nexport default class Loader extends React.Component {\r\n\r\n static defaultProps = {\r\n fillContainer: false,\r\n fillBackground: 'rgba(245, 245, 245, 0.5)',\r\n showBalls: true\r\n }\r\n\r\n render() {\r\n let styles = {};\r\n\r\n if (this.props.fillContainer) {\r\n styles = {\r\n position: 'absolute',\r\n width: '100%',\r\n height: '100%',\r\n background: this.props.fillBackground,\r\n zIndex: 1001,\r\n top: 0,\r\n left: 0\r\n }\r\n }\r\n\r\n return (\r\n \r\n 
\r\n
\r\n\r\n {this.state.visible && (\r\n - \r\n {this.props.items.map(item => (\r\n
- {\r\n self.setState({visible: false})\r\n self.onItemClick(item);\r\n }}>{item.label} \r\n ))}\r\n
\r\n
\r\n )\r\n }\r\n}","import React, {Component} from 'react'\r\nimport {default as ReactModal} from 'react-modal'\r\n\r\nfunction Header({children}) {\r\n return null\r\n}\r\n\r\nfunction Body({children}) {\r\n return null\r\n}\r\n\r\nfunction Footer({children}) {\r\n return null\r\n}\r\n\r\nexport default class Modal extends Component {\r\n static Header = Header\r\n static Body = Body\r\n static Footer = Footer\r\n\r\n modalStyle = {\r\n overlay: {\r\n zIndex: '1092',\r\n backgroundColor: 'rgba(148, 148, 148, 0.75)'\r\n },\r\n content: {\r\n top: '50%',\r\n left: '50%',\r\n right: 'auto',\r\n bottom: 'auto',\r\n marginRight: '-50%',\r\n transform: 'translate(-50%, -50%)',\r\n padding: '0',\r\n width: this.props.width ? this.props.width : '500px'\r\n }\r\n }\r\n\r\n render() {\r\n let children = [];\r\n if (Array.isArray(this.props.children)) {\r\n children = this.props.children;\r\n } else {\r\n children.push(this.props.children);\r\n }\r\n\r\n const header = children.find(child => child.type === Header)\r\n const body = children.find(child => child.type === Body)\r\n const footer = children.find(child => child.type === Footer)\r\n\r\n let style = this.modalStyle;\r\n if (this.props.overflow) {\r\n style.content.overflow = this.props.overflow;\r\n }\r\n\r\n const classes = ['modal'];\r\n if (this.props.class) {\r\n classes.push(this.props.class);\r\n }\r\n\r\n return (\r\n \r\n {this.props.showBalls && (\r\n \r\n \r\n \r\n \r\n \r\n )}\r\n
\r\n \r\n {header && \r\n }\r\n {body && \r\n {body.props.children}\r\n }\r\n {footer && }\r\n
\r\n {header.props.children}
\r\n\r\n \r\n \r\n \r\n )}\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\n\r\nexport default class TooltipStatic extends React.Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n\r\n {this.state.visible && (\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Tooltip from './Tooltip';\r\nimport TooltipStatic from './TooltipStatic';\r\nimport Assets from '../../Assets';\r\n\r\nexport default class Warning extends React.Component {\r\n static GetIcon = color => {\r\n switch (color) {\r\n case 'red':\r\n return Assets.warningRed;\r\n case 'blue':\r\n return Assets.warningBlue;\r\n case 'orange':\r\n return Assets.warningOrange;\r\n case 'gray':\r\n return Assets.warningGray;\r\n }\r\n }\r\n\r\n static CreateWarning = (text, color) => {\r\n return \r\n \r\n
\r\n \r\n \r\n
\r\n {this.props.description}
\r\n }\r\n renderErrorMessage = () => {\r\n if (!this.state.errorState || this.state.errorMessage.length === 0) {\r\n return {this.state.errorMessage}
\r\n }\r\n\r\n getClassNames = () => {\r\n let classNames = 'step-input-field-container'\r\n if (this.props.className) {\r\n classNames += ' ' + this.props.className\r\n }\r\n if (this.props.readonly) {\r\n classNames += ' ' + '--readonly'\r\n }\r\n if (this.state.errorState) {\r\n classNames += ' ' + 'error'\r\n }\r\n return classNames;\r\n }\r\n}","import React from 'react';\r\nimport BaseField from \"./BaseField\";\r\n\r\nexport default class FieldBoolean extends BaseField\r\n
\r\n\r\n )\r\n }\r\n\r\n markBoolean = (checked: boolean) => {\r\n if (this.props.readonly)\r\n return;\r\n\r\n this.setState({checked: checked})\r\n this.props.onChange(checked)\r\n }\r\n\r\n private renderInput() {\r\n if (this.props.readonly) {\r\n return \r\n {this.renderLabel() &&
\r\n \r\n {this.getLabel()}\r\n
}\r\n \r\n
\r\n {this.renderDescription()}\r\n {this.renderErrorMessage()}\r\n \r\n {this.renderInput()}\r\n
\r\n this.markBoolean(true)}\r\n className={`boolean-button ${this.state.checked ? 'checked' : ''}`}>{__(\"Yes\")}
\r\n {!this.state.onlyYesOption && this.markBoolean(false)}\r\n className={`boolean-button ${!this.state.checked ? 'checked' : ''}`}>{__(\"No\")}
}\r\n \r\n {\r\n tester: TypingTester;\r\n canAcceptValueUpdate: boolean;\r\n willBeUpdatedBySelf: boolean;\r\n\r\n constructor(props: BaseFieldSelfProps) {\r\n super(props)\r\n\r\n this.willBeUpdatedBySelf = false\r\n this.canAcceptValueUpdate = true\r\n this.tester = new TypingTester(250)\r\n this.state = {\r\n value: props.value || null,\r\n errorState: props.errorState,\r\n errorMessage: props.errorMessage,\r\n label: props.label\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps: BaseFieldSelfProps) {\r\n this.setState({\r\n value: nextProps.value || null,\r\n errorState: false\r\n })\r\n }\r\n\r\n shouldComponentUpdate(nextProps: BaseFieldSelfProps, nextState: BaseFieldSelfState) {\r\n if (!this.willBeUpdatedBySelf) {\r\n if (nextState.value !== this.state.value && !this.canAcceptValueUpdate) {\r\n return false\r\n }\r\n }\r\n\r\n return (\r\n nextState.value !== this.state.value ||\r\n nextProps.value !== this.props.value ||\r\n nextProps.readonly !== this.props.readonly ||\r\n nextProps.disabled !== this.props.disabled ||\r\n nextProps.errorState !== this.props.errorState ||\r\n nextProps.text !== this.props.text\r\n )\r\n }\r\n\r\n onChange = (e: any) => {\r\n let val = e.target.value\r\n if (this.props.field.floatingPoint === false) {\r\n val = val.replace('.', '');\r\n val = val.replace(',', '');\r\n } else if (val && val.includes(',')) {\r\n val = val.replace(',', '.');\r\n }\r\n\r\n this.willBeUpdatedBySelf = true\r\n this.setState({value: val, errorState: false, errorMessage: ''}, () => {\r\n this.willBeUpdatedBySelf = false\r\n this.canAcceptValueUpdate = false\r\n })\r\n\r\n if (this.props.validator && !this.props.validator.validate(Number.parseFloat(val))) {\r\n this.setState({errorState: true, errorMessage: this.props.validator.getErrorMessage()})\r\n return;\r\n }\r\n // !!! Do not touch this !!!\r\n // !!! Store must be updated even if we're not done typing, yet !!!\r\n this.updateStoreValue(val)\r\n\r\n this.tester.record(() => {\r\n this.canAcceptValueUpdate = true\r\n this.props.onChange(val)\r\n })\r\n }\r\n\r\n getClassNameForInput = () => {\r\n let cn = '';\r\n if (this.state.errorState) {\r\n cn += ` error `\r\n }\r\n return cn;\r\n }\r\n renderInput = () => {\r\n let id = this.generateUniqueId()\r\n return (\r\n )\r\n }\r\n\r\n renderReadOnly = () => {\r\n return {\r\n el: any;\r\n\r\n constructor(props: any) {\r\n super(props)\r\n\r\n this.el = document.getElementById('field-select-body-portal')\r\n\r\n if (this.el === null) {\r\n this.el = document.createElement('div')\r\n this.el.setAttribute('id', 'field-select-body-portal')\r\n document.body.appendChild(this.el)\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n let rect = this.props.rootRef.current.getBoundingClientRect()\r\n let height = this.props.buttonRef.current.offsetHeight\r\n\r\n this.el.style.position = 'absolute';\r\n this.el.style.width = rect.width + 'px';\r\n this.el.style.top = Math.floor(rect.top + window.pageYOffset + height - 1) + 'px';\r\n this.el.style.left = rect.left + 'px';\r\n }\r\n\r\n render() {\r\n return ReactDOM.createPortal(\r\n this.props.children,\r\n this.el\r\n )\r\n }\r\n}\r\n\r\nexport default class FieldSelect extends BaseField {\r\n\r\n static currentlyOpenSelect: any = null\r\n\r\n rootRef: any;\r\n buttonRef: any;\r\n\r\n constructor(props: any) {\r\n super(props)\r\n\r\n this.rootRef = React.createRef()\r\n this.buttonRef = React.createRef()\r\n this.state = {\r\n open: false,\r\n selectedOption: props.value,\r\n items: this.removeDuplicated(props.items, (x: any, y: any) => x.value === y.value),\r\n playingExitAnimation: false\r\n }\r\n }\r\n\r\n componentDidUpdate() {\r\n if (this.state.open) {\r\n setTimeout(() => {\r\n window.addEventListener('click', this.onWindowClick)\r\n }, 200)\r\n } else {\r\n window.removeEventListener('click', this.onWindowClick);\r\n }\r\n }\r\n\r\n onWindowClick = (e: any) => {\r\n if (this.state.open === false) {\r\n return\r\n }\r\n\r\n if (e.target.className && e.target.className?.includes('dropdown-item--disabled')) {\r\n return;\r\n }\r\n\r\n let isDropdown = (el: any) => hasParentWithClassName(el, 'dropdown') === true\r\n let canHide = false\r\n if (e.target.tagName === 'path')\r\n canHide = !isDropdown(e.target.ownerSVGElement.parentElement)\r\n else\r\n canHide = !isDropdown(e.target.parentElement)\r\n\r\n if (canHide) {\r\n this.hide()\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n }\r\n\r\n removeDuplicated(input: any, cmp: any) {\r\n let out: any = []\r\n\r\n input.forEach((x: any) => {\r\n let wouldDuplicate = false\r\n\r\n out.forEach((y: any) => {\r\n wouldDuplicate = cmp(x, y)\r\n })\r\n\r\n if (!wouldDuplicate) {\r\n out.push(x)\r\n }\r\n })\r\n\r\n return out\r\n }\r\n\r\n componentWillUnmount() {\r\n if (FieldSelect.currentlyOpenSelect === this) {\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps: any) {\r\n this.setState({\r\n open: false,\r\n selectedOption: nextProps.value,\r\n items: this.removeDuplicated(nextProps.items, (x: any, y: any) => x.value === y.value)\r\n })\r\n }\r\n\r\n shouldComponentUpdate(nextProps: any, nextState: any) {\r\n return (\r\n nextState.selectedOption !== this.state.selectedOption ||\r\n nextState.items !== this.state.items ||\r\n nextState.open !== this.state.open ||\r\n nextProps.disabled !== this.props.disabled\r\n )\r\n }\r\n\r\n onButtonClick = (e: any) => {\r\n if (this.isDisabled() || this.isReadOnly()) {\r\n return\r\n }\r\n\r\n if (FieldSelect.currentlyOpenSelect !== null && FieldSelect.currentlyOpenSelect !== this) {\r\n FieldSelect.currentlyOpenSelect.hide()\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n\r\n if (this.state.open === false) {\r\n FieldSelect.currentlyOpenSelect = this\r\n } else {\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n\r\n if (this.state.open) {\r\n this.hide()\r\n } else {\r\n this.show()\r\n }\r\n }\r\n\r\n onItemClick = (item: any) => {\r\n this.setState({\r\n selectedOption: item.value,\r\n open: false\r\n })\r\n\r\n if (this.props.onChange) {\r\n this.props.onChange(item.value)\r\n }\r\n }\r\n\r\n show() {\r\n this.setState({open: true})\r\n }\r\n\r\n hide() {\r\n this.setState({open: false})\r\n }\r\n\r\n renderReadOnly = () => {\r\n const currentItem = this.state.items.find((x: any) => x.value === this.state.selectedOption)\r\n return {\r\n tester: TypingTester;\r\n\r\n constructor(props: BaseFieldSelfProps) {\r\n super(props)\r\n\r\n this.tester = new TypingTester(250)\r\n this.state = {\r\n value: props.value || ''\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps: BaseFieldSelfProps) {\r\n this.setState({\r\n value: nextProps.value || ''\r\n })\r\n }\r\n\r\n onChange = (e: any) => {\r\n this.setState({value: e.target.value})\r\n\r\n // !!! Do not touch this !!!\r\n // !!! Store must be updated even if we're not done typing, yet !!!\r\n this.updateStoreValue(e.target.value)\r\n\r\n this.tester.record(() => {\r\n this.props.onChange(this.state.value)\r\n })\r\n }\r\n\r\n renderReadOnly = () => {\r\n return this.setModalDeleteIsOpen(false)}>\r\n {__('Remove')} \r\n \r\n {store.duringDelete && }\r\n {__('Do you want to remove this configuration?')}\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n getDocumentationApi() {\r\n return this.configurationAPIService;\r\n }\r\n\r\n createDocumentationDropdown() {\r\n var api = this.getDocumentationApi();\r\n let model = store.getTransformedFormModel();\r\n let isCustom = model === null ? false : model.unitType.isCustom;\r\n const docsGenerateItems = [\r\n {id: 0, label: __('Substation documentation')},\r\n ]\r\n if (this.props.hasDeliveryDocumentationPermission && !isCustom)\r\n docsGenerateItems.push({id: 1, label: __('Delivery documentation')})\r\n\r\n if (this.props.hasSpecificationForOrderProcessingXlsPermission)\r\n docsGenerateItems.push({id: 2, label: __('Spec for order processing (XLS)')})\r\n\r\n return (\r\n \r\n {!this.isNewConfiguration() && (\r\n \r\n {this.props.hasDocumentationPermission && this.createDocumentationDropdown()}\r\n \r\n )}\r\n \r\n )\r\n }\r\n\r\n getDesktopActionButtons() {\r\n var buttons = []\r\n buttons.push()\r\n buttons.push()\r\n buttons.push()\r\n\r\n return buttons;\r\n }\r\n\r\n getMobileActionButtons() {\r\n var buttons = []\r\n buttons.push( this.onCopyButtonClick()}>Copy )\r\n buttons.push( this.save()}>Save )\r\n\r\n if (this.props.hasDocumentationPermission)\r\n buttons.push( this.setModalDeleteIsOpen(true)}>Delete )\r\n\r\n return buttons;\r\n }\r\n\r\n isNewConfiguration() {\r\n return this.props.id.value === 0\r\n }\r\n }\r\n)\r\n\r\nwindow.components.ConfigurationEditPage = ConfigurationEditPage\r\nexport default ConfigurationEditPage","import ProjectConfigurationViewer from '../project/ProjectConfigurationViewer';\r\nimport ProjectApiService from '@lib/api-services/ProjectApiService';\r\nimport ConfigurationReadOnlyApiService from '@lib/api-services/ConfigurationReadOnlyApiService';\r\nimport APIServicesRegistry from '@lib/api-services/APIServicesRegistry';\r\nimport ConfigurationEditPage from '../configuration/ConfigurationEditPage';\r\nimport configurationStore from '../../store/configuration';\r\nimport Button from '../common/Button';\r\n\r\nconst ConfigurationViewPage = class ConfigurationViewPage extends ConfigurationEditPage {\r\n configurationEditorComponentClass = ProjectConfigurationViewer\r\n\r\n constructor(props) {\r\n super(props)\r\n configurationStore.editableMode = false;\r\n scheduleAtDocumentReady(() => {\r\n this.projectAPIService = APIServicesRegistry.getService(ProjectApiService)\r\n this.configurationReadOnlyApiService = APIServicesRegistry.getService(ConfigurationReadOnlyApiService)\r\n this.setState({_forceUpdate: !this.state._forceUpdate});\r\n })\r\n }\r\n\r\n save() {\r\n }\r\n\r\n\r\n getDocumentationApi() {\r\n return this.configurationReadOnlyApiService;\r\n }\r\n\r\n getDesktopActionButtons() {\r\n return \r\n }\r\n}\r\n\r\nwindow.components.ConfigurationViewPage = ConfigurationViewPage\r\n","import React from 'react';\r\n\r\nexport default class EESTable extends React.Component {\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport {observer} from 'mobx-react';\r\nimport store from '@lib/store/configuration';\r\nimport Warning from '../../components/common/Warning';\r\nimport ConfigurationEditorGeneralInformationCard from './EditorGeneralInformationCard';\r\nimport ConfigurationEditorTechnicalInformationCard from './EditorTechnicalInformationCard';\r\nimport EditorCommentCard from './EditorCommentCard';\r\nimport FilesCard from '../file/FilesCard'\r\nimport ConfigurationEditorStepUnitType from './steps/StepUnitType';\r\nimport ConfigurationEditorStepHeatingTWS from './steps/StepHeatingTWS';\r\nimport {StepHeating1, StepHeating2, StepHeating3} from './steps/StepHeating';\r\nimport ConfigurationEditorStepDHW from './steps/StepDHW';\r\nimport ConfigurationEditorStepOptions from './steps/StepOptions';\r\nimport ConfigurationEditorStepSummary from './steps/StepSummary';\r\nimport ConfigurationEditorStepController from './steps/StepController';\r\nimport ConfigurationEditorStepPricing from './steps/StepPricing';\r\nimport ConfigurationEditorStepTopArticleNumberPricingStep from './steps/StepTopArticleNumber';\r\nimport ConfigurationEditorStepPrimarySideEquipment from './steps/StepPrimarySideEquipment';\r\nimport ConfigurationAPIService from '@lib/api-services/ConfigurationAPIService';\r\nimport APIServicesRegistry from '@lib/api-services/APIServicesRegistry';\r\nimport ExpandableContainer from './steps/ExpandableContainer';\r\nimport EditorDiagramCard from './EditorDiagramCard';\r\nimport EditorNavigationButtons from './EditorNavigationButtons';\r\nimport Configurator from '../../model/configurator/Configurator';\r\nimport EESTable from './EESTable';\r\nimport IssuesList from '../../model/configurator/IssuesList';\r\nimport Issue from '../../model/configurator/Issue';\r\nimport WarningAlert from './alerts/WarningAlert';\r\nimport EditorConnectionLostAlert from './alerts/ConnectionLostAlert';\r\nimport EditorRestoreFromSnapshotAlert from './alerts/EditorRestoreFromSnapshotAlert';\r\nimport EditorSnapshotLoadErrorAlert from './alerts/EditorSnapshotLoadErrorAlert';\r\nimport FieldExtensions from './fields/FieldExtensions';\r\nimport EditorMobileNavigation from './EditorMobileNavigation';\r\nimport HeatingOutputField from '../../model/configurator/HeatingOutputField';\r\nimport StepsTitleBar from \"@lib/components/shared/steps/StepsTitleBar\";\r\n\r\n// TODO: This component is waaay too big.\r\n\r\nconst ConfigurationEditor = observer(\r\n class ConfigurationEditor extends React.Component {\r\n\r\n static defaultProps = {\r\n configurationAPIService: ConfigurationAPIService\r\n }\r\n\r\n stepAreaRef = React.createRef()\r\n stepAreaColumnScrollRef = React.createRef()\r\n stepTitleBarRef = React.createRef()\r\n navigationButtonRef = React.createRef();\r\n\r\n formModelUpdateTimeout = -1\r\n lastSentModel = {};\r\n busy = false\r\n\r\n steps = []\r\n state = {\r\n currentStepId: 'unitType',\r\n currentStepIdx: 0,\r\n isLoading: false,\r\n stepAreaContainerX: 0,\r\n realStepIdx: 0,\r\n isConnectionAlertVisible: false,\r\n wasSnapshotTaken: false,\r\n suggestRestoreFromSnapshot: false,\r\n isSnapshotLoadErrorVisible: false,\r\n isControlCenterWarningVisible: false,\r\n maxPlatesExceededAlertSeen: false,\r\n visitedControlCenters: []\r\n }\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n window.addEventListener('resize', this.onWindowResize)\r\n\r\n if (window.localStorage) {\r\n let suggestRestore = (window.localStorage.getItem('editor.suggestSnapshotRestore') === 'true')\r\n if (suggestRestore) {\r\n this.state = {\r\n ...this.state,\r\n snapshotTime: parseInt(window.localStorage.getItem('editor.snapshotTime')),\r\n suggestRestoreFromSnapshot: suggestRestore\r\n }\r\n }\r\n }\r\n\r\n scheduleAtDocumentReady(() => {\r\n this.configurationAPIService = APIServicesRegistry.getService(this.props.configurationAPIService)\r\n this.moveThroughStepTimeline(0)\r\n })\r\n\r\n window.onbeforeunload = e => {\r\n e = e || window.event;\r\n\r\n if (store.dirty) {\r\n const message = __('Changes that you have made will not be saved.');\r\n\r\n if (e) {\r\n e.returnValue = message;\r\n }\r\n\r\n return message;\r\n }\r\n }\r\n\r\n this.configurator = new Configurator(this)\r\n this.configurator.onFieldTabFocus = (field, e) => {\r\n };\r\n\r\n this.responsesToIgnore = 0\r\n this.canIgnoreResponse = true\r\n // Initialize all possible steps.\r\n this.addStep('unitType', ConfigurationEditorStepUnitType)\r\n this.addStep('heatingTWS', ConfigurationEditorStepHeatingTWS)\r\n this.addStep('heating1', StepHeating1)\r\n this.addStep('heating2', StepHeating2)\r\n this.addStep('heating3', StepHeating3)\r\n this.addStep('dhw', ConfigurationEditorStepDHW)\r\n this.addStep('controller', ConfigurationEditorStepController)\r\n this.addStep('primarySideEquipment', ConfigurationEditorStepPrimarySideEquipment)\r\n this.addStep('optionsAndAccessories', ConfigurationEditorStepOptions)\r\n this.addStep('pricing', ConfigurationEditorStepPricing)\r\n this.addStep('topArticleNumberPricing', ConfigurationEditorStepTopArticleNumberPricingStep)\r\n this.addStep('summary', ConfigurationEditorStepSummary)\r\n\r\n // Fill store with initial data.\r\n this.updateStore(this.props);\r\n this.lastSentModel = store.getTransformedFormModel();\r\n let dirty = false;\r\n\r\n ([1, 2, 3]).forEach(heatingIndex => {\r\n let heatingModel = this.props[`heating${heatingIndex}`]\r\n if (heatingModel) {\r\n if (this.isNewConfiguration()) {\r\n let currentQuickStepSetup = heatingModel.quickStepSetup.items.find(x => x.value === heatingModel.quickStepSetup.value)\r\n if (currentQuickStepSetup) {\r\n let attributes = currentQuickStepSetup.attributes;\r\n if (attributes) {\r\n let storeRef = store.formModel[`heating${heatingIndex}`]\r\n storeRef.primary.inletTemperature.value = attributes['primary.InletTemperature']\r\n storeRef.primary.outletTemperature.value = attributes['primary.OutletTemperature']\r\n storeRef.secondary.inletTemperature.value = attributes['secondary.InletTemperature']\r\n storeRef.secondary.outletTemperature.value = attributes['secondary.OutletTemperature']\r\n dirty = true\r\n }\r\n }\r\n }\r\n\r\n // Set heat exchanger calculation output if possible.\r\n if (!this.isNewConfiguration() && Object.keys(heatingModel.heatExchangerOutput).length > 0) {\r\n store.setHeatingCalculationOutput(heatingIndex, {\r\n heatExchangerOutput: heatingModel.heatExchangerOutput\r\n })\r\n }\r\n }\r\n })\r\n\r\n if (dirty) {\r\n // Wait for the API service to initialize.\r\n scheduleAtDocumentReady(() => {\r\n this.onFormModelChange()\r\n })\r\n }\r\n\r\n this.onFormModelChange = this.onFormModelChange.bind(this)\r\n }\r\n\r\n componentDidCatch(error, info) {\r\n if (this.isLoadingSnapshot) {\r\n this.updateStore(this.props);\r\n this.lastSentModel = store.getTransformedFormModel();\r\n this.setState({\r\n isSnapshotLoadErrorVisible: true\r\n });\r\n this.isLoadingSnapshot = false;\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n this.evenOutCards();\r\n }\r\n\r\n /**\r\n * Adds a step with specified data to the list.\r\n *\r\n * @param {String} slug\r\n * @param {React.Component} component\r\n */\r\n addStep(slug, component) {\r\n this.steps.push({slug, component, ref: React.createRef()})\r\n }\r\n\r\n onWindowResize = e => {\r\n this.moveThroughStepTimeline(0)\r\n }\r\n\r\n onStepAreaColumnScroll = e => {\r\n if (e.target === this.stepAreaColumnScrollRef) {\r\n e.target.scrollLeft = 0;\r\n }\r\n }\r\n\r\n onAPIResponseReceived = response => {\r\n this.setState({isLoading: false})\r\n this.updateStore(response.data)\r\n }\r\n\r\n updateStore(data) {\r\n if (!data.configuratorSteps) {\r\n console.warn('Malformed API response received. Skipping.')\r\n return\r\n }\r\n\r\n // MobX uses proxy wrappers to store variables so basic comparison won't work. \r\n if (JSON.stringify(store.availableSteps) !== JSON.stringify(data.configuratorSteps)) {\r\n\r\n // Add new steps to the configurator model before re-rendering the editor,\r\n // since rendering may need these steps to exist already.\r\n data.configuratorSteps.forEach(step => {\r\n step = this.steps.find(x => x.slug === step.slug)\r\n if (!step.ref.current) {\r\n let model = step.component.getStepModel(data, {dddd: 'dupka'})\r\n if (model) {\r\n let fields = step.component.getFields(model)\r\n\r\n model.initialize(\r\n fields,\r\n step.component.getFirstVisibleField(fields),\r\n step.component.getLastVisibleField(fields)\r\n );\r\n\r\n this.configurator.getStepsManager().addStepModel(model.name, model)\r\n }\r\n }\r\n })\r\n\r\n }\r\n\r\n store.incrementFormModelVersion()\r\n\r\n data = {...data}\r\n data.__version = store.getFormModelVersion()\r\n store.setFormModel(data)\r\n store.setAvailableSteps(data.configuratorSteps)\r\n store.setIsCustom(data.unitType.isCustomLogic.value)\r\n // Build issues list.\r\n let issuesList = new IssuesList()\r\n this.configurator.getStepsManager().getAll().forEach(step => {\r\n step.setIssues([])\r\n let fields = step.fields\r\n let allFields = []\r\n\r\n fields.forEach(field => {\r\n if (field.__collection) {\r\n field.getContaintedFields().forEach(f => allFields.push(f))\r\n } else {\r\n allFields.push(field)\r\n }\r\n })\r\n\r\n allFields.filter(x => x.visible && x.hasWarning()).forEach(field => {\r\n issuesList.add(new Issue(field))\r\n })\r\n\r\n this.addCustomIssues(step, issuesList);\r\n })\r\n\r\n issuesList.getCategorizedByStep().forEach(list => {\r\n list.step.setIssues(list.items)\r\n })\r\n\r\n store.setIssues(issuesList)\r\n\r\n }\r\n\r\n addCustomIssues = (step, list) => {\r\n if (['heating1', 'heating2', 'heating3', 'dhw'].includes(step.name)) {\r\n for (const [index, output] of step.model.heatExchangerOutput.entries()) {\r\n if (output.primaryWarning) {\r\n let primaryField = new HeatingOutputField(index, 'primary', output.name, step);\r\n list.add(new Issue(primaryField));\r\n }\r\n if (output.secondaryWarning) {\r\n let secondaryField = new HeatingOutputField(index, 'secondary', output.name, step);\r\n list.add(new Issue(secondaryField));\r\n }\r\n }\r\n }\r\n }\r\n\r\n onNextStepButtonClick = () => {\r\n if (this.isOnLastStep()) {\r\n this.props.save()\r\n return\r\n }\r\n\r\n this.moveThroughStepTimeline(+1);\r\n\r\n let navigationBarHeight = 50;\r\n let stepAreaElement = this.stepAreaRef.current;\r\n if (stepAreaElement.getBoundingClientRect().top < navigationBarHeight) {\r\n window.scrollTo({\r\n top: window.pageYOffset + stepAreaElement.getBoundingClientRect().top - (navigationBarHeight * 6),\r\n behavior: 'smooth'\r\n });\r\n }\r\n }\r\n\r\n onPreviousStepButtonClick = () => {\r\n this.moveThroughStepTimeline(-1)\r\n }\r\n\r\n moveThroughStepTimeline = amount => {\r\n // Step index out of bounds.\r\n if (this.state.currentStepIdx + amount > store.getAvailableSteps().length ||\r\n this.state.currentStepIdx + amount < 0) {\r\n return;\r\n }\r\n\r\n let currentStep = this.steps.find(x => x.slug === this.state.currentStepId)\r\n let targetStep = this.steps.find(x => x.slug === store.getAvailableSteps()[this.state.currentStepIdx + amount].slug)\r\n\r\n if (currentStep.ref && currentStep.ref.current) {\r\n currentStep.ref.current.stepAboutToBecomeInvisible()\r\n }\r\n\r\n if (targetStep.ref && targetStep.ref.current) {\r\n targetStep.ref.current.stepAboutToBecomeVisible()\r\n }\r\n\r\n this.setState({\r\n currentStepId: targetStep.slug,\r\n currentStepIdx: this.state.currentStepIdx + amount\r\n })\r\n }\r\n\r\n onFormModelChange() {\r\n store.setDirty(true);\r\n this.scheduleFormModelUpdate()\r\n }\r\n\r\n onConnectionAlertTryAgainClick = () => {\r\n this.scheduleFormModelUpdate()\r\n this.setState({\r\n isConnectionAlertVisible: true,\r\n isLoading: true\r\n })\r\n }\r\n\r\n onSnapshotRestoreLoadClick = () => {\r\n this.isLoadingSnapshot = true;\r\n scheduleAtNextTick(() => {\r\n this.isLoadingSnapshot = false;\r\n })\r\n let snapshot = JSON.parse(window.localStorage.getItem('editor.snapshot'))\r\n\r\n let formModel = snapshot.lastSuccessfulResponse\r\n //this is bug - props contain new model steps instead snapshot\r\n //formModel.configuratorSteps = this.props.configuratorSteps\r\n\r\n formModel.configuratorSteps = snapshot.lastSuccessfulResponse.configuratorSteps;\r\n // Find differences between the snapshot's model and current form model.\r\n let currentFormModel = this.props;\r\n let snapshotFormModel = formModel;\r\n //Attempts to fix the snapshot in case of properties being changed or removed.\r\n const fixMissingProps = (obj, obj2) => {\r\n for (let [k, v] of Object.entries(obj)) {\r\n\r\n // Ignore props that don't relate to the data in any way.\r\n if (['generateDocumentationAccess', 'save'].includes(k)) {\r\n continue;\r\n }\r\n\r\n if (!(k in obj2) || obj2[k] === null) {\r\n obj2[k] = v;\r\n } else {\r\n if (typeof v === 'object' && v !== null) {\r\n fixMissingProps(v, obj2[k])\r\n }\r\n }\r\n }\r\n }\r\n\r\n fixMissingProps(currentFormModel, snapshotFormModel);\r\n this.onAPIResponseReceived({data: snapshotFormModel})\r\n this.scheduleFormModelUpdate();\r\n\r\n this.lastSentModel = snapshot.lastSuccessfulRequest\r\n this.lastReceivedModel = snapshotFormModel\r\n\r\n this.moveThroughStepTimeline(snapshot.currentStepIdx);\r\n window.localStorage.setItem('editor.suggestSnapshotRestore', false)\r\n this.setState({\r\n suggestRestoreFromSnapshot: false\r\n })\r\n }\r\n\r\n onSnapshotRestoreIgnoreClick = () => {\r\n window.localStorage.setItem('editor.suggestSnapshotRestore', false)\r\n this.setState({\r\n suggestRestoreFromSnapshot: false\r\n })\r\n }\r\n\r\n scheduleFormModelUpdate = () => {\r\n const func = () => {\r\n\r\n if (this.busy && this.canIgnoreResponse) {\r\n this.responsesToIgnore++\r\n }\r\n\r\n // The server has not responded, yet. Need to wait a little longer.\r\n if (new Date().getTime() - this.lastFormModelRequestTime < 200 || this.busy) {\r\n clearInterval(this.formModelUpdateTimeout)\r\n this.formModelUpdateTimeout = setTimeout(func, 200)\r\n this.canIgnoreResponse = false\r\n\r\n return\r\n }\r\n\r\n this.canIgnoreResponse = true\r\n this.busy = true\r\n\r\n // Show loader only if we've been waiting for the response for longer than 150ms.\r\n setTimeout(() => {\r\n\r\n // Next N responses will be ignored so there's no point in showing loader.\r\n if (this.busy && this.responsesToIgnore === 0) {\r\n this.setState({isLoading: true})\r\n }\r\n }, 150)\r\n\r\n this.lastFormModelRequestTime = new Date().getTime()\r\n let model = store.getTransformedFormModel();\r\n let payload = {\r\n model: model,\r\n changedInput: store.recentlyChangedField\r\n }\r\n\r\n this.configurationAPIService.configure(payload).then(response => {\r\n this.busy = false;\r\n\r\n if (this.responsesToIgnore > 0) {\r\n this.responsesToIgnore--\r\n this.setState({isLoading: false})\r\n return;\r\n }\r\n\r\n if (window.localStorage) {\r\n window.localStorage.setItem('editor.suggestSnapshotRestore', false);\r\n }\r\n\r\n this.lastReceivedModel = response.data;\r\n this.lastSentModel = model;\r\n this.onAPIResponseReceived(response);\r\n this.setState({\r\n isLoading: false,\r\n isConnectionAlertVisible: false\r\n }, () => {\r\n this.navigationButtonRef.current.onWindowScroll();\r\n })\r\n\r\n this.handleControlCenterWarningPopUp();\r\n }).catch(err => {\r\n let wasSnapshotTaken = false;\r\n // Do a snapshot of current configuration and save it in case it's lost if possible.\r\n if (window.localStorage && this.lastReceivedModel) {\r\n let snapshot = {\r\n lastSuccessfulRequest: this.lastSentModel,\r\n lastSuccessfulResponse: this.lastReceivedModel,\r\n currentStepIdx: this.state.currentStepIdx,\r\n configuratorSteps: this.props.configuratorSteps,\r\n };\r\n\r\n window.localStorage.setItem('editor.suggestSnapshotRestore', true)\r\n window.localStorage.setItem('editor.snapshotTime', new Date().getTime())\r\n window.localStorage.setItem('editor.snapshot', JSON.stringify(snapshot))\r\n wasSnapshotTaken = true;\r\n }\r\n ;\r\n\r\n this.setState({\r\n isLoading: false,\r\n isConnectionAlertVisible: true,\r\n wasSnapshotTaken: wasSnapshotTaken\r\n })\r\n\r\n this.busy = false\r\n })\r\n }\r\n\r\n func()\r\n }\r\n\r\n handleControlCenterWarningPopUp = () => {\r\n const limitExceeded = this.lastReceivedModel.controller.availableAnalogInputsExceeded.value;\r\n const selectedControlCenter = this.lastReceivedModel.controller.controlCenter.value;\r\n\r\n if (limitExceeded && !this.state.visitedControlCenters.includes(selectedControlCenter)) {\r\n this.setState({\r\n isControlCenterWarningVisible: true,\r\n visitedControlCenters: [...this.state.visitedControlCenters, selectedControlCenter]\r\n });\r\n }\r\n }\r\n\r\n onProjectFilesChange = (files) => {\r\n let formModel = store.formModel;\r\n formModel.files.items = files;\r\n store.setFormModel(formModel);\r\n }\r\n\r\n evenOutCards() {\r\n const left = document.getElementById(\"multicard-left\").firstChild;\r\n const right = document.getElementById(\"multicard-right\").firstChild;\r\n\r\n if (left.offsetHeight > right.offsetHeight) {\r\n right.style.minHeight = `${left.offsetHeight}px`;\r\n } else {\r\n left.style.minHeight = `${right.offsetHeight}px`;\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n )\r\n }\r\n\r\n renderMainArea() {\r\n const isTargetStepPricingOrSummary = ['pricing', 'topArticleNumberPricing', 'summary'].includes(this.state.currentStepId)\r\n const heating1CalculationOutput = store.getHeatingCalculationOutput(1)\r\n const heating2CalculationOutput = store.getHeatingCalculationOutput(2)\r\n const heating3CalculationOutput = store.getHeatingCalculationOutput(3)\r\n const heatingTWSCalculationOutput = store.getHeatingTWSCalculationOutput()\r\n const eesLevel = store.getEESLevel()\r\n const dhwCalculationOutput = store.getDHWCalculationOutput()\r\n const heatingOutputVisible = store.getHeatingCalculationOutputVisible()\r\n const heatingTWSOutputVisible = store.getHeatingTWSCalculationOutputVisible()\r\n const dhwOutputVisible = store.getDHWCalculationOutputVisible()\r\n const anyHeatingCalculationOutputs = (\r\n (heating1CalculationOutput !== null ||\r\n heating2CalculationOutput !== null ||\r\n heating3CalculationOutput !== null ||\r\n heatingTWSCalculationOutput !== null ||\r\n dhwCalculationOutput !== null)\r\n && (heatingOutputVisible || heatingTWSOutputVisible || dhwOutputVisible)\r\n );\r\n\r\n const isCustom = store.getIsCustom();\r\n\r\n return (\r\n \r\n {this.state.isConnectionAlertVisible && (\r\n \r\n )}\r\n\r\n {this.state.suggestRestoreFromSnapshot && (\r\n \r\n )}\r\n\r\n {this.state.isSnapshotLoadErrorVisible && (\r\n this.setState({isSnapshotLoadErrorVisible: false})}/>\r\n )}\r\n\r\n {this.state.isControlCenterWarningVisible && (\r\n this.setState({isControlCenterWarningVisible: false})}\r\n text='Too many sensors for selected control center are used'/>\r\n )}\r\n\r\n {!this.state.maxPlatesExceededAlertSeen && dhwCalculationOutput !== undefined && dhwCalculationOutput.maxPlatesExceeded.value && (\r\n this.setState({ maxPlatesExceededAlertSeen: true })} text={dhwCalculationOutput.maxPlatesExceededWarningText.value} />\r\n )}\r\n\r\n this.stepAreaColumnScrollRef = r}>\r\n
\r\n {!isCustom && !isTargetStepPricingOrSummary && (\r\n \r\n {this.props.renderLabel &&
\r\n\r\n )\r\n }\r\n}","import React from 'react';\r\nimport TypingTester from \"../../../TypingTester\";\r\nimport BaseField, {BaseFieldSelfProps, BaseFieldSelfState} from \"./BaseField\";\r\n\r\nexport default class FieldNumber extends BaseField}\r\n
\r\n \r\n
\r\n {this.renderWarning()}\r\n {this.renderInformation()}\r\n \r\n
\r\n {this.props.unitLabel}
)}\r\n {this.state.value} {this.props.unitLabel && (\r\n {this.props.unitLabel})}
\r\n }\r\n\r\n getLabel = (): string => {\r\n return `${this.state.label} ${this.props.required ? '*' : ''}`;\r\n }\r\n\r\n renderField() {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport hasParentWithClassName from '../../../hasParentWithClassName';\r\nimport WarningsContainer from '../../common/WarningsContainer';\r\nimport InformationsContainer from '../../common/InformationsContainer';\r\nimport ReactDOM from \"react-dom\";\r\nimport BaseField from \"./BaseField\";\r\n\r\nclass FieldSelectBodyPortal extends React.Component\r\n {this.renderLabel() &&
\r\n \r\n {this.getLabel()}\r\n
}\r\n \r\n
\r\n {this.renderDescription()}\r\n {this.renderErrorMessage()}\r\n \r\n {this.props.readonly ? this.renderReadOnly() : this.renderInput()}\r\n
\r\n {currentItem ? currentItem.text : ''}
\r\n }\r\n\r\n renderDropdown() {\r\n const currentItem = this.state.items.find((x: any) => x.value === this.state.selectedOption)\r\n const rootClassNames = ['dropdown', 'dropdown--react', 'w-100']\r\n\r\n if (this.isDisabled()) {\r\n rootClassNames.push('dropdown--disabled')\r\n } else {\r\n if (this.state.open) {\r\n rootClassNames.push('dropdown--open')\r\n }\r\n\r\n if (this.state.playingExitAnimation) {\r\n rootClassNames.push('dropdown--exit')\r\n }\r\n }\r\n\r\n if (this.isReadOnly()) {\r\n rootClassNames.push('dropdown--read-only')\r\n }\r\n if (this.props.className) {\r\n rootClassNames.push(this.props.className);\r\n }\r\n\r\n const getCurrentItem = () => currentItem ? currentItem.text : '';\r\n\r\n return (\r\n \r\n \r\n \r\n )\r\n ) : ''}\r\n\r\n {this.props.warning && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n\r\n {this.props.information && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n
\r\n )\r\n }\r\n\r\n renderField() {\r\n return (\r\n \r\n
\r\n {this.state.open ? (\r\n this.props.forceNonPortal ? (\r\n \r\n {getCurrentItem()}\r\n
\r\n\r\n \r\n \r\n {this.state.items.map(this.renderItem)}\r\n
\r\n ) : (\r\n \r\n {this.state.items.map(this.renderItem)}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderItem = (item: any, idx: any) => {\r\n const classNames = ['dropdown-item']\r\n if (item.value === this.state.selectedOption) {\r\n classNames.push('dropdown-item--selected')\r\n }\r\n if (item.disabled == true) {\r\n classNames.push('dropdown-item--disabled')\r\n }\r\n\r\n let onClick = () => {\r\n if (item.disabled !== true) {\r\n this.onItemClick(item);\r\n }\r\n }\r\n\r\n return (\r\n \r\n {this.renderLabel() &&
\r\n \r\n {this.getLabel()}\r\n
}\r\n \r\n
\r\n {this.renderDescription()}\r\n {this.state.errorMessage}\r\n \r\n {this.props.readonly ? this.renderReadOnly() : this.renderDropdown()}\r\n
\r\n \r\n {item.text}\r\n
\r\n )\r\n }\r\n\r\n isDisabled() {\r\n return this.props.disabled || this.state.items.length === 0\r\n }\r\n\r\n isReadOnly() {\r\n return !this.props.forceReadable && (this.props.readonly || this.state.items.length === 1)\r\n }\r\n}","import React from 'react';\r\nimport TypingTester from \"../../../TypingTester\";\r\nimport BaseField, {BaseFieldSelfProps} from \"./BaseField\";\r\n\r\nexport default class FieldText extends BaseField{this.state.value} {this.props.unitLabel && (\r\n {this.props.unitLabel})}
\r\n }\r\n\r\n renderTextInput() {\r\n let id = this.generateUniqueId()\r\n return (\r\n \r\n {this.props.readonly\r\n ? this.renderReadOnly()\r\n :
\r\n )\r\n }\r\n\r\n renderField() {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n}","import React, {Component} from 'react'\r\nimport {observer} from 'mobx-react';\r\nimport ConfigurationEditor from './Editor'\r\nimport ConfigurationAPIService from '@lib/api-services/ConfigurationAPIService';\r\nimport APIServicesRegistry from '@lib/api-services/APIServicesRegistry';\r\nimport buildResourcePath from '@lib/buildResourcePath'\r\nimport Modal from '@lib/components/common/Modal';\r\nimport store from '@lib/store/configuration';\r\nimport Dropdown from '../common/DropdownReact';\r\nimport Button from '../common/Button';\r\nimport EditPageSubstationDocsGenerateModal from './edit-page/EditPageSubstationDocsGenerateModal';\r\nimport EditPageDeliveryDocsGenerateModal from './edit-page/EditPageDeliveryDocsGenerateModal';\r\nimport EditPageXlsDocsGenerateModal from './edit-page/EditPageXlsDocsGenerateModal';\r\nimport ExpandableFloatingDropdown from '../common/ExpandableFloatingDropdown';\r\nimport Loader from '../common/Loader';\r\nimport IconSave from '../icons/IconSave';\r\n\r\nconst ConfigurationEditPage = observer(\r\n class ConfigurationEditPage extends Component {\r\n configurationEditorComponentClass = ConfigurationEditor\r\n\r\n static defaultProps = {\r\n configurationAPIService: ConfigurationAPIService\r\n }\r\n\r\n state = {\r\n modalDeleteIsOpen: false,\r\n substationDocsModalOpen: false,\r\n specForOrderProcessingXlsDocsModalOpen: false,\r\n deliveryDocsModalOpen: false,\r\n docsSelectedLanguageId: 0,\r\n _forceUpdate: false\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n scheduleAtDocumentReady(() => {\r\n this.configurationAPIService = APIServicesRegistry.getService(this.props.configurationAPIService)\r\n this.setState({_forceUpdate: !this.state._forceUpdate});\r\n });\r\n\r\n this.save = this.save.bind(this)\r\n }\r\n\r\n onRemoveButtonClick = () => {\r\n store.duringDelete = true;\r\n this.configurationAPIService.delete(this.props.id.value).then(() => {\r\n window.location.href = buildResourcePath('Configurations')\r\n });\r\n }\r\n\r\n onCopyButtonClick = () => {\r\n store.duringCopy = true;\r\n this.configurationAPIService.copy(this.props.id.value)\r\n }\r\n\r\n onDocsGenerateDropdownItemClick = item => {\r\n switch (item.id) {\r\n case 0:\r\n this.setState({substationDocsModalOpen: true});\r\n break;\r\n\r\n case 1:\r\n this.setState({deliveryDocsModalOpen: true});\r\n break;\r\n\r\n case 2:\r\n this.setState({specForOrderProcessingXlsDocsModalOpen: true})\r\n break;\r\n }\r\n }\r\n\r\n save() {\r\n var a = !store.canSave();\r\n var b = store.hasIssuesAsForceToChange();\r\n\r\n if (a || b)\r\n return;\r\n\r\n store.setDuringSave(true);\r\n\r\n store.setDirty(false);\r\n\r\n var model = store.getTransformedFormModel()\r\n model.id = this.props.id.value\r\n\r\n this.configurationAPIService.saveConfiguration(model).then(() => {\r\n $('.page-body-loader').fadeOut(150)\r\n store.setDuringSave(false);\r\n }).catch(() => {\r\n $('.page-body-loader').fadeOut(150)\r\n store.setDuringSave(false);\r\n })\r\n\r\n\r\n }\r\n\r\n getProjectUrl = (projectId) => {\r\n return buildResourcePath(`/Project/Edit/${projectId.value}`);\r\n }\r\n\r\n setModalDeleteIsOpen = value => this.setState({modalDeleteIsOpen: value})\r\n\r\n render() {\r\n const EditorComponent = this.configurationEditorComponentClass\r\n var model = store.getTransformedFormModel();\r\n var configurationName = model === null ? this.props.generalInformation.name.value : model.generalInformation.name;\r\n return (\r\n \r\n {this.renderLabel() &&
\r\n \r\n {this.getLabel()}\r\n
}\r\n \r\n
\r\n {this.renderDescription()}\r\n {this.state.errorMessage}\r\n \r\n {this.renderTextInput()}\r\n
\r\n \r\n\r\n {this.renderDeleteModal()}\r\n\r\n
\r\n )\r\n }\r\n\r\n renderModals() {\r\n return \r\n {(store.duringCopy || store.duringSave) && }\r\n {this.props.generalInformation.project.value &&\r\n\r\n \r\n }\r\n this.save()}/>\r\n
\r\n \r\n
\r\n {this.renderModals()}\r\n \r\n {configurationName}\r\n
\r\n\r\n\r\n {this.renderActionButtons()}\r\n
\r\n \r\n this.setState({substationDocsModalOpen: false})}\r\n />\r\n\r\n this.setState({deliveryDocsModalOpen: false})}\r\n />\r\n\r\n this.setState({specForOrderProcessingXlsDocsModalOpen: false})}\r\n />\r\n\r\n \r\n
\r\n )\r\n }\r\n\r\n renderActionButtons() {\r\n return (\r\n \r\n \r\n {this.getDesktopActionButtons()}\r\n \r\n
\r\n\r\n \r\n \r\n {this.getMobileActionButtons()}\r\n \r\n
\r\n | {__('Category')} | \r\n{__('Points')} | \r\n
|---|---|
| {c.category} | \r\n{c.currentPoints} / {c.maximumPoints} | \r\n
\r\n \r\n ({isValid: true, name: s.name, slug: s.slug, canProceedHere: true, available: true}))\r\n } \r\n currentStepIndex={this.state.currentStepIdx}\r\n stepsManager={this.configurator.getStepsManager()} currentStepId={this.state.currentStepId}\r\n moveThroughStepTimeline={this.moveThroughStepTimeline}/>\r\n {this.renderMainArea()}\r\n\r\n {!this.state.isConnectionAlertVisible && !this.state.suggestRestoreFromSnapshot && (\r\n this.renderStepNavigationButtons()\r\n )}\r\n
\r\n )\r\n }\r\n\r\n renderStepNavigationButtons() {\r\n let issues = store.issues.issues;\r\n if (issues.length > 0)\r\n issues = issues.filter(x => x.field.step.name == this.state.currentStepId);\r\n\r\n\r\n const previousButtonAvailable = this.state.currentStepIdx > 0;\r\n const props = {\r\n currentStep: this.state.currentStepId,\r\n onPreviousStepButtonClick: this.onPreviousStepButtonClick,\r\n onNextStepButtonClick: this.onNextStepButtonClick,\r\n isPreviousButtonActive: previousButtonAvailable,\r\n isOnLastStep: this.isOnLastStep(),\r\n issues: issues,\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 store.setDirty(true)}\r\n helpInfo={store.formModel.filesHelpInfo.value}\r\n duringEdit={store.filesDuringEdit}\r\n setDuringEdit={value => store.setFilesDuringEdit(value)}\r\n initialFiles={this.props.files.items}\r\n initialItemsViewModel={this.props.files.itemsViewModel}\r\n allowEdit={store.editableMode}\r\n onFilesChange={this.onProjectFilesChange}\r\n documentApiService={ConfigurationAPIService}\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {this.renderAllSteps()}\r\n
\r\n \r\n \r\n\r\n {anyHeatingCalculationOutputs ? (\r\n
\r\n )}\r\n \r\n )\r\n }\r\n\r\n renderStep(step, visible) {\r\n step = this.steps.find(x => x.slug === step.slug)\r\n let StepComponent = step.component\r\n\r\n return (\r\n \r\n
\r\n ) : ''}\r\n {eesLevel ? (\r\n \r\n {heatingOutputVisible && this.renderHeatingOutputSection(1, heating1CalculationOutput, state => state.currentStepId === 'heating1')}\r\n {heatingOutputVisible && this.renderHeatingOutputSection(2, heating2CalculationOutput, state => state.currentStepId === 'heating2')}\r\n {heatingOutputVisible && this.renderHeatingOutputSection(3, heating3CalculationOutput, state => state.currentStepId === 'heating3')}\r\n {heatingTWSOutputVisible && this.renderHeatingTWSOutputSection(heatingTWSCalculationOutput, state => state.currentStepId === 'heatingTWS')}\r\n {dhwOutputVisible && this.renderDHWOutputSection(dhwCalculationOutput, state => state.currentStepId === 'dhw')}\r\n
\r\n \r\n
\r\n ) : ''}\r\n \r\n {this.renderEESLevelSection(eesLevel)}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderAllSteps() {\r\n const availableSteps = store.getAvailableSteps();\r\n const shouldStepBeVisible = (step, idx) => {\r\n return (\r\n idx === this.state.currentStepIdx\r\n );\r\n }\r\n\r\n return availableSteps.map((step, idx) => this.renderStep(step, shouldStepBeVisible(step, idx)));\r\n }\r\n\r\n renderEESLevelSection(data) {\r\n return (\r\n \r\n
\r\n \r\n {data.label}\r\n
\r\n \r\n {data.currentPoints} / {data.maximumPoints}\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | {__('Model')} | \r\n{heatExchangerName} | \r\n
| {capacity.label} | \r\n{FieldExtensions.getFieldValue(capacity)} {capacity.unit} | \r\n
| \r\n |
\r\n \r\n \r\n )}\r\n
\r\n {e.primary}
\r\n {e.primaryWarning && (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n )}\r\n
\r\n {e.secondary}
\r\n {e.secondaryWarning && (\r\n \r\n \r\n
\r\n \r\n
\r\n\r\n )\r\n\r\n }\r\n\r\n onCommentChanged = e => {\r\n this.setState({\r\n commentValue: e.target.value\r\n })\r\n }\r\n\r\n onEditButtonClick = () => {\r\n store.formModel.generalInformation.comment.value = this.state.commentValue;\r\n store.setCommentDuringEdit(!store.commentDuringEdit);\r\n }\r\n }\r\n)\r\n\r\nexport default EditorCommentCard","import React from 'react';\r\nimport Assets from '../../Assets';\r\n\r\nexport default class EditorConfigurationStatusDropdown extends React.Component {\r\n state = {\r\n open: false,\r\n currentItemID: 0,\r\n\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n currentItemID: nextProps.currentItem.id\r\n })\r\n }\r\n\r\n onButtonClick = () => {\r\n this.setState({\r\n open: !this.state.open\r\n })\r\n }\r\n\r\n onItemClick = item => {\r\n this.setState({\r\n open: false,\r\n currentItemID: item.id\r\n }, () => {\r\n\r\n })\r\n\r\n if (this.props.onItemClick) {\r\n this.props.onItemClick(item)\r\n }\r\n }\r\n\r\n render() {\r\n const rootClassNames = ['dropdown', 'dropdown--react', 'configuration-status-dropdown']\r\n if (this.state.open) {\r\n rootClassNames.push('dropdown--open')\r\n }\r\n\r\n return (\r\n \r\n
\r\n )}\r\n {(!this.state.editable && store.editableMode) && (\r\n {\r\n this.setState({editable: false});\r\n store.formModel.generalInformation.comment.value = this.state.commentValue;\r\n store.setCommentDuringEdit(false);\r\n }}>\r\n
\r\n \r\n
\r\n )}\r\n {\r\n this.setState({editable: true});\r\n store.setCommentDuringEdit(true);\r\n }}>\r\n
\r\n \r\n {this.renderButton()}\r\n {this.renderBody()}\r\n
\r\n )\r\n }\r\n\r\n renderButton = () => {\r\n\r\n const currentItem = this.props.items.find(x => x.id === this.state.currentItemID)\r\n\r\n return (\r\n \r\n 
\r\n
\r\n )\r\n }\r\n\r\n renderDotColor = (item) => {\r\n\r\n return ()\r\n\r\n\r\n }\r\n\r\n renderBody = () => {\r\n const itemsToRender = this.props.items.filter(x => x.id !== this.state.currentItemID)\r\n\r\n return (\r\n \r\n {this.renderDotColor(currentItem)}\r\n
\r\n\r\n {currentItem.label}
\r\n \r\n {itemsToRender.map(this.renderItem)}\r\n
\r\n )\r\n }\r\n\r\n renderItem = (item) => {\r\n return (\r\n this.onItemClick(item)}>\r\n {this.renderDotColor(item)}\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Assets from '../../Assets';\r\n\r\nclass DiagramCanvasPortal extends React.Component {\r\n constructor(props) {\r\n super(props)\r\n\r\n this.el = document.getElementById('diagram-canvas-portal')\r\n\r\n if (!this.el) {\r\n this.el = document.createElement('div')\r\n this.el.setAttribute('id', 'diagram-canvas-portal')\r\n document.body.appendChild(this.el)\r\n }\r\n }\r\n\r\n render() {\r\n if (this.props.usePortal) {\r\n return ReactDOM.createPortal(\r\n this.props.children,\r\n this.el\r\n )\r\n }\r\n\r\n return this.props.children\r\n }\r\n}\r\n\r\nexport default class EditorDiagramCard extends React.Component {\r\n minScale = 0.9;\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.state = {\r\n canvasTranslateX: 0,\r\n canvasTranslateY: 0,\r\n canvasTransformOriginX: 50,\r\n canvasTransformOriginY: 50,\r\n canvasScale: this.minScale,\r\n isFullscreen: false\r\n }\r\n\r\n this.canUpdateState = true\r\n this.mouseOver = false\r\n this.mouseDown = false\r\n this.lastMouseX = 0\r\n this.lastMouseY = 0\r\n\r\n this.diagramRef = null\r\n }\r\n\r\n componentDidMount() {\r\n window.addEventListener('keyup', this.onKeyUp)\r\n window.addEventListener('mouseup', this.onMouseUp)\r\n }\r\n\r\n onMouseDown = e => {\r\n e.preventDefault()\r\n\r\n let rect = this.diagramRef.getBoundingClientRect()\r\n\r\n this.mouseDown = true\r\n this.lastMouseX = e.clientX - rect.left\r\n this.lastMouseY = e.clientY - rect.top\r\n }\r\n\r\n onMouseMove = e => {\r\n this.dragHandler(e.clientX, e.clientY);\r\n }\r\n\r\n onMouseUp = e => {\r\n this.mouseDown = false\r\n }\r\n\r\n onMouseEnter = e => {\r\n this.mouseOver = true\r\n }\r\n\r\n onMouseLeave = e => {\r\n this.mouseOver = false\r\n }\r\n\r\n onTouchStart = e => {\r\n let rect = this.diagramRef.getBoundingClientRect()\r\n let touch = e.touches[0]\r\n\r\n this.mouseDown = true\r\n this.lastMouseX = touch.clientX - rect.left\r\n this.lastMouseY = touch.clientY - rect.top\r\n }\r\n\r\n onTouchMove = e => {\r\n e.preventDefault();\r\n this.dragHandler(e.touches[0].clientX, e.touches[0].clientY);\r\n }\r\n\r\n onTouchEnd = e => {\r\n this.mouseDown = false;\r\n }\r\n\r\n onWheel = e => {\r\n e.preventDefault()\r\n\r\n let targetScale = 0\r\n if (e.deltaY < 0) {\r\n targetScale = this.state.canvasScale * 1.33\r\n } else {\r\n targetScale = this.state.canvasScale / 1.33\r\n }\r\n\r\n if (targetScale < this.minScale) {\r\n targetScale = this.minScale\r\n }\r\n\r\n this.clampCanvasTranslate(targetScale)\r\n this.setState({\r\n canvasScale: targetScale\r\n })\r\n }\r\n\r\n dragHandler = (clientX, clientY) => {\r\n let rect = this.diagramRef.getBoundingClientRect()\r\n let x = clientX - rect.left\r\n let y = clientY - rect.top\r\n\r\n if (this.mouseDown) {\r\n let deltaX = x - this.lastMouseX\r\n let deltaY = y - this.lastMouseY\r\n\r\n let newX = this.state.canvasTranslateX + deltaX\r\n let newY = this.state.canvasTranslateY + deltaY\r\n\r\n if (this.state.isFullscreen === false) {\r\n let diffX = 395 - (395 * this.state.canvasScale)\r\n let diffY = 220 - (220 * this.state.canvasScale)\r\n\r\n if (-newX < diffX / 2) newX = -diffX / 2\r\n if (-newX > -diffX / 2) newX = diffX / 2\r\n if (newY < diffY / 2) newY = diffY / 2\r\n if (newY > -diffY / 2) newY = -diffY / 2\r\n }\r\n\r\n this.setState({\r\n canvasTranslateX: newX,\r\n canvasTranslateY: newY\r\n })\r\n }\r\n\r\n this.lastMouseX = x\r\n this.lastMouseY = y\r\n }\r\n\r\n clampCanvasTranslate(targetScale) {\r\n if (this.state.isFullscreen === false) {\r\n const defaultCanvasWidth = 395\r\n const defaultCanvasHeight = 220\r\n\r\n let newX = this.state.canvasTranslateX\r\n let newY = this.state.canvasTranslateY\r\n let diffX = defaultCanvasWidth - (defaultCanvasWidth * targetScale)\r\n let diffY = defaultCanvasHeight - (defaultCanvasHeight * targetScale)\r\n\r\n if (-newX < diffX / 2) newX = -diffX / 2\r\n if (-newX > -diffX / 2) newX = diffX / 2\r\n if (newY < diffY / 2) newY = diffY / 2\r\n if (newY > -diffY / 2) newY = -diffY / 2\r\n\r\n this.setState({\r\n canvasTranslateX: newX,\r\n canvasTranslateY: newY\r\n })\r\n }\r\n }\r\n\r\n onZoomInButtonMouseUp = e => clearInterval(this.zoomInTicker)\r\n onZoomInButtonClick = e => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n\r\n clearInterval(this.zoomInTicker)\r\n this.zoomInTicker = setInterval(() => {\r\n this.zoom(0.4, 50, 50)\r\n }, 100)\r\n\r\n this.zoom(0.4, 50, 50)\r\n }\r\n\r\n onZoomOutButtonMouseUp = e => clearInterval(this.zoomOutTicker)\r\n onZoomOutButtonClick = e => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n\r\n clearInterval(this.zoomOutTicker)\r\n this.zoomOutTicker = setInterval(() => {\r\n this.zoom(-0.4, 50, 50)\r\n }, 100)\r\n\r\n this.zoom(-0.4, 50, 50)\r\n }\r\n\r\n onFullscreenButtonClick = e => {\r\n this.setState({\r\n isFullscreen: !this.state.isFullscreen\r\n }, () => {\r\n this.setState({\r\n canvasTranslateY: -50\r\n });\r\n\r\n if (!this.state.isFullscreen) {\r\n this.reset();\r\n }\r\n })\r\n }\r\n\r\n onKeyUp = e => {\r\n if (this.mouseOver) {\r\n if (e.which === 82) {\r\n this.reset()\r\n }\r\n }\r\n }\r\n\r\n onResetButtonClick = e => {\r\n this.reset()\r\n }\r\n\r\n zoom(amount, centerX, centerY) {\r\n if (!this.canUpdateState) {\r\n return\r\n }\r\n\r\n let targetScale = Number((this.state.canvasScale + amount).toFixed(2))\r\n if (targetScale < this.minScale) {\r\n targetScale = this.minScale\r\n }\r\n\r\n this.clampCanvasTranslate(targetScale)\r\n\r\n this.canUpdateState = false\r\n this.setState({\r\n canvasScale: targetScale,\r\n canvasTransformOriginX: centerX,\r\n canvasTransformOriginY: centerY\r\n }, () => {\r\n this.canUpdateState = true\r\n })\r\n }\r\n\r\n reset() {\r\n this.setState({\r\n canvasScale: this.minScale,\r\n canvasTransformOriginX: 50,\r\n canvasTransformOriginY: 50,\r\n canvasTranslateX: 0,\r\n canvasTranslateY: 0\r\n })\r\n }\r\n\r\n render() {\r\n let canvasStyles = {\r\n transform: `translate3d(${this.state.canvasTranslateX}px, ${this.state.canvasTranslateY}px, 0) scale(${this.state.canvasScale})`,\r\n transformOrigin: `${this.state.canvasTransformOriginX}% ${this.state.canvasTransformOriginY}%`\r\n }\r\n\r\n if (this.mouseDown) {\r\n canvasStyles.transition = 'none';\r\n }\r\n\r\n return (\r\n {item.label}
\r\n \r\n \r\n {\r\n if (r !== null) {\r\n this.diagramRef = r;\r\n this.diagramRef.removeEventListener('wheel', this.onWheel);\r\n this.diagramRef.addEventListener('wheel', this.onWheel);\r\n this.diagramRef.removeEventListener('touchmove', this.onTouchMove);\r\n this.diagramRef.addEventListener('touchmove', this.onTouchMove);\r\n }\r\n }}\r\n >\r\n
\r\n \r\n \r\n )\r\n }\r\n}","import React from 'react';\r\nimport {observer} from 'mobx-react';\r\nimport configurationStore from '../../store/configuration';\r\nimport UIServicesRegistry from '@lib/ui-services/UIServicesRegistry';\r\nimport XMessageUIService from '@lib/ui-services/XMessageUIService';\r\nimport Card from '../edit-page/Card';\r\nimport store from '../../store/configuration';\r\nimport IconEdit from '../icons/IconEdit';\r\nimport IconAccept from '../icons/IconAccept';\r\n\r\nconst ConfigurationEditorGeneralInformationCard = observer(\r\n class ConfigurationEditorGeneralInformationCard extends React.Component {\r\n state = {\r\n marketId: 0,\r\n editable: []\r\n }\r\n\r\n onButtonEditClick = field => {\r\n var newEditable = _.xor(this.state.editable, [field.slug]);\r\n configurationStore.generalInformationDuringEdit = newEditable.length > 0;\r\n\r\n this.setState({\r\n editable: newEditable\r\n })\r\n }\r\n\r\n renderField = (field, possibleToEdit) => {\r\n return renderField(field, this.state.editable.includes(field.slug), possibleToEdit, this.onButtonEditClick, '', () => {\r\n });\r\n }\r\n\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n scheduleAtDocumentReady(() => {\r\n this.xMessageUIService = UIServicesRegistry.getService(XMessageUIService)\r\n })\r\n }\r\n\r\n UNSAFE_componentWillMount = () => {\r\n this.setState({\r\n marketSymbol: this.props.model.marketSymbol.value\r\n })\r\n }\r\n\r\n onNameChange = e => {\r\n let brand = \"Cetetherm - \";\r\n let t = configurationStore.formModel.generalInformation.isDalkia;\r\n\r\n if (configurationStore.formModel.generalInformation.isDalkia.value == true) {\r\n brand = \"Dalkia - \";\r\n }\r\n\r\n document.title = brand + e.target.value;\r\n configurationStore.formModel.generalInformation.name.value = e.target.value\r\n\r\n configurationStore.setDirty(true);\r\n }\r\n\r\n onMarketChange = e => {\r\n this.setState({\r\n marketSymbol: e.target.value\r\n })\r\n configurationStore.setDirty(true);\r\n }\r\n\r\n getSelectedMarketName = () => {\r\n var item = this.props.model.marketSymbol.items.filter(x => x.value == this.state.marketSymbol)[0]\r\n return item ? item.text : ''\r\n }\r\n\r\n onDHCustomerChange = e => {\r\n configurationStore.formModel.generalInformation.dhCustomer.value = e.target.value\r\n configurationStore.setDirty(true);\r\n }\r\n\r\n onMarketClick = e => {\r\n if (this.state.marketSymbol !== configurationStore.formModel.generalInformation.marketSymbol.value && configurationStore.generalInformationDuringEdit) {\r\n configurationStore.formModel.generalInformation.marketSymbol.value = this.state.marketSymbol\r\n this.xMessageUIService.pushNotification({\r\n type: 'info',\r\n title: __('Info'),\r\n text: __('Some configuration settings and prices may be changed after changing the market'),\r\n timeout: 5\r\n })\r\n\r\n store.recentlyChangedField = 'generalInformation.marketSymbol';\r\n }\r\n\r\n if (configurationStore.generalInformationDuringEdit) {\r\n this.props.onFormModelChange()\r\n }\r\n\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.marketSymbol)\r\n //configurationStore.setGeneralInformationDuringEdit(!configurationStore.generalInformationDuringEdit)\r\n }\r\n\r\n\r\n onScopeDropdownItemClick = e => {\r\n configurationStore.formModel.generalInformation.configurationScope.value = e.target.value;\r\n configurationStore.setDirty(true);\r\n }\r\n\r\n renderScopeSwitch = () => {\r\n let {items} = this.props.model.configurationScope || [];\r\n if (items.length == 0)\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\r\n
\r\n \r\n {this.props.diagram.toJS().map((img, idx) => (\r\n 
\r\n ))}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderScopeSwitchBody = (items) => {\r\n let selectItems = items.map(x => {\r\n return {\r\n value: x.value,\r\n text: x.text\r\n }\r\n })\r\n\r\n let editableMode = this.state.editable.includes(configurationStore.formModel.generalInformation.configurationScope.slug)\r\n let statusId = configurationStore.formModel.generalInformation.configurationScope.value;\r\n\r\n if (editableMode) {\r\n return (\r\n {__('Scope')}
\r\n \r\n {this.renderScopeSwitchBody(items)}\r\n
\r\n \r\n \r\n
\r\n\r\n )\r\n } else {\r\n let currentItem = items.filter(x => x.value == statusId)[0];\r\n if (currentItem === undefined && items.length > 0)\r\n currentItem = {text: ''}\r\n return (\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.configurationScope)}>\r\n
\r\n \r\n {currentItem.text}\r\n {configurationStore.editableMode &&
\r\n )\r\n }\r\n }\r\n\r\n render() {\r\n let {marketSymbol} = this.props.model\r\n return (\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.configurationScope)}>\r\n
}\r\n \r\n
\r\n {__('Name')}
\r\n \r\n {this.state.editable.includes(configurationStore.formModel.generalInformation.name.slug) ? (\r\n \r\n \r\n )}\r\n
\r\n \r\n \r\n
\r\n ) : (\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.name)}>\r\n
\r\n \r\n {configurationStore.formModel.generalInformation.name.value ? (\r\n {configurationStore.formModel.generalInformation.name.value}\r\n ) : (\r\n {__('None')}.\r\n )}\r\n {configurationStore.editableMode &&
\r\n\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.name)}>\r\n
}\r\n \r\n
\r\n\r\n {__('Project')}
\r\n \r\n {configurationStore.formModel.generalInformation.project.value}\r\n
\r\n \r\n
\r\n {__('Delivery address')}
\r\n \r\n {this.state.editable.includes(configurationStore.formModel.generalInformation.dhCustomer.slug) ? (\r\n
\r\n \r\n \r\n
\r\n\r\n ) : (\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.dhCustomer)}>\r\n
\r\n \r\n {configurationStore.formModel.generalInformation.dhCustomer.value}\r\n {configurationStore.editableMode &&
\r\n )}\r\n this.onButtonEditClick(configurationStore.formModel.generalInformation.dhCustomer)}>\r\n
}\r\n \r\n
\r\n {this.renderScopeSwitch()}\r\n \r\n )\r\n }\r\n }\r\n)\r\n\r\nexport default ConfigurationEditorGeneralInformationCard","import React from 'react';\r\nimport store from '../../store/configuration';\r\nimport EditorMobileNavigationDrawer from './EditorMobileNavigationDrawer';\r\nimport EditorMobileNavigationBar from './EditorMobileNavigationBar';\r\n\r\nexport default class EditorMobileNavigation extends React.PureComponent {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n drawerVisible: false\r\n }\r\n }\r\n\r\n onDrawerToggleClick = () => {\r\n this.setState({\r\n drawerVisible: !this.state.drawerVisible\r\n });\r\n }\r\n\r\n render() {\r\n let availableSteps = store.getAvailableSteps()\r\n let stepIndex = availableSteps.findIndex(x => x.slug === this.props.currentStep);\r\n let step = availableSteps[stepIndex];\r\n\r\n return (\r\n {__('Market')}
\r\n \r\n {this.state.editable.includes(marketSymbol.slug) ? (\r\n
\r\n \r\n \r\n
\r\n\r\n ) :\r\n this.onMarketClick()}>\r\n
\r\n \r\n {this.getSelectedMarketName()}\r\n
\r\n\r\n }\r\n this.onButtonEditClick(marketSymbol)}>\r\n
\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Button from '../common/Button';\r\nimport Assets from '../../Assets';\r\n\r\nexport default class EditorMobileNavigationBar extends React.PureComponent {\r\n render() {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport buildResourcePath from '../../buildResourcePath';\r\n\r\nexport default class EditorMobileNavigationDrawer extends React.PureComponent {\r\n\r\n renderItem = (item, idx) => {\r\n const isCompleted = idx < this.props.currentStepIndex;\r\n let hasIssues = false;\r\n\r\n if (isCompleted) {\r\n let step = this.props.configurator.getStepsManager().getStepByName(item.slug);\r\n if (step) {\r\n hasIssues = step.hasIssues();\r\n }\r\n }\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n 
\r\n\r\n {__('Step')} {this.props.currentStepIndex + 1} / {this.props.availableSteps.length}\r\n
\r\n\r\n \r\n {this.props.currentStep ? this.props.currentStep.name : ''}\r\n
\r\n \r\n \r\n \r\n 
\r\n \r\n )}\r\n
\r\n \r\n\r\n {isCompleted ? (\r\n hasIssues ? (\r\n
\r\n )\r\n }\r\n\r\n render() {\r\n const singleItemHeight = 40;\r\n const foregroundBarHeight = this.props.currentStepIndex * singleItemHeight;\r\n const anyIssues = this.props.availableSteps.filter(\r\n x => {\r\n const step = this.props.configurator.getStepsManager().getStepByName(x.slug);\r\n return step && step.hasIssues();\r\n }\r\n ).length > 0;\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\n \r\n {__('Step')} {idx + 1} / {this.props.availableSteps.length}\r\n
\r\n\r\n \r\n {item.name}\r\n
\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport configurationStore from '../../store/configuration';\r\nimport TechnicalInformationCardIssuesList from './TechnicalInformationCardIssuesList';\r\nimport TechnicalInformationCardIssuesListItem from './TechnicalInformationCardIssuesListItem';\r\nimport IssueExtenions from '../common/IssueExtensions';\r\n\r\nexport default class EditorNavigationButtons extends React.Component {\r\n\r\n state = {\r\n isOverFooter: false,\r\n reScroll: false\r\n }\r\n\r\n componentDidMount() {\r\n window.addEventListener('scroll', this.onWindowScroll)\r\n this.onWindowScroll()\r\n }\r\n\r\n componentWillUnmount() {\r\n window.removeEventListener('scroll', this.onWindowScroll)\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n if (this.props.currentStep !== prevProps.currentStep && this.state.reScroll === false) {\r\n this.setState({\r\n reScroll: true\r\n }, () => {\r\n this.onWindowScroll();\r\n });\r\n }\r\n\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n pxOverFooter: 0\r\n })\r\n }\r\n\r\n ononWindowScrollWrapper = e => {\r\n this.setState({\r\n reScroll: true\r\n }, () => {\r\n this.onWindowScroll(e);\r\n })\r\n\r\n }\r\n\r\n onWindowScroll = e => {\r\n let scrolledY = window.pageYOffset + window.innerHeight\r\n let documentHeight = document.body.scrollHeight\r\n\r\n if (window.pageYOffset > 0 && scrolledY > documentHeight - 44) {\r\n this.setState({\r\n reScroll: false,\r\n isOverFooter: true,\r\n pxOverFooter: scrolledY - (documentHeight - 44),\r\n lastDocumentHeight: documentHeight\r\n })\r\n } else {\r\n this.setState({\r\n reScroll: false,\r\n isOverFooter: false,\r\n lastDocumentHeight: documentHeight\r\n })\r\n }\r\n }\r\n\r\n canRenderNextButton = () => {\r\n if (!this.props.isOnLastStep)\r\n return true;\r\n\r\n return configurationStore.editableMode;\r\n }\r\n\r\n onNextStepButtonClick = () => {\r\n if (this.props.isOnLastStep && !configurationStore.canSave())\r\n return;\r\n\r\n this.props.onNextStepButtonClick();\r\n }\r\n\r\n render() {\r\n let styles = this.state.isOverFooter ? {bottom: this.state.pxOverFooter + 'px'} : {}\r\n let nextButtonClassNames = ['big-button-primary'];\r\n if (!configurationStore.canSave() && this.props.isOnLastStep) {\r\n nextButtonClassNames.push('disabled')\r\n }\r\n\r\n let allIssues = this.props.issues;\r\n\r\n let hasForceToChange = IssueExtenions.hasForceToChange(allIssues);\r\n if (hasForceToChange) {\r\n nextButtonClassNames.push('disabled');\r\n }\r\n\r\n let item = null;\r\n if (allIssues.length > 0) {\r\n item = {\r\n step: allIssues[0].field.step,\r\n items: allIssues\r\n }\r\n }\r\n\r\n return (\r\n \r\n \r\n\r\n {!anyIssues && (\r\n \r\n )}\r\n\r\n {this.props.availableSteps.map(this.renderItem)}\r\n
\r\n \r\n \r\n\r\n \r\n )}\r\n
\r\n \r\n \r\n {__('Previous step')}
\r\n {this.renderInformations()}\r\n {this.canRenderNextButton() && (\r\n \r\n {item !== null &&\r\n this.onItemClick(item)}/>\r\n }\r\n\r\n
\r\n {\r\n if (!hasForceToChange &&\r\n this.onNextStepButtonClick()) ;\r\n }}>\r\n
\r\n \r\n {__(this.props.isOnLastStep ? 'Save' : 'Continue')}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n\r\n )\r\n }\r\n}","import React from 'react';\r\nimport {observer} from 'mobx-react';\r\nimport configurationStore from '@lib/store/configuration';\r\nimport EditorConfigurationStatusDropdown from './EditorConfigurationStatusDropdown';\r\nimport TechnicalInformationCardIssuesList from './TechnicalInformationCardIssuesList';\r\nimport HelpSystemInformation from '../common/HelpSystemInformation';\r\n\r\nconst ConfigurationEditorTechnicalInformationCard = observer(\r\n class ConfigurationEditorTechnicalInformationCard extends React.Component {\r\n onStatusDropdownItemClick = item => {\r\n configurationStore.formModel.generalInformation.status.value = item.id\r\n this.props.onFormModelChange()\r\n configurationStore.setDirty(true);\r\n }\r\n\r\n render() {\r\n const {discountedTotal, currency} = this.props.model\r\n\r\n return (\r\n | {__('Model')} | \r\n{configurationStore.formModel.summary.modelName.value} | \r\n
| {__('Top article number')} | \r\n{items.filter(x => x.item.isFromModel).map(x => renderTopArticleNumber(x.itemViewModel)).join(', ')} | \r\n
| {__('Total PPL')} | \r\n{discountedTotal.value} {currency} | \r\n
\r\n
\r\n \r\n \r\n )\r\n }\r\n\r\n renderProductName() {\r\n let type = configurationStore.getProductType()\r\n return type ? type.text : ''\r\n }\r\n\r\n renderStatusDropdown() {\r\n let editableMode = configurationStore.editableMode;\r\n let items = configurationStore.formModel.generalInformation.status.items.map(x => {\r\n let color = ['#71b850', '#7088ba', '#ff4b5c'][x.value];\r\n\r\n return {\r\n id: x.value,\r\n color: color,\r\n label: x.text\r\n }\r\n })\r\n let currentStatusItem = items.find(x => x.id === configurationStore.formModel.generalInformation.status.value);\r\n return (\r\n \r\n
\r\n \r\n {__('Technical information')}\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n {this.renderProductName()}
\r\n {__('Product')}
\r\n \r\n
\r\n {__('Status')}
\r\n \r\n {this.renderStatusDropdown()}\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n {discountedTotal.visible && {__('Setup')}
\r\n \r\n {configurationStore.formModel.generalInformation.setup.value}\r\n
\r\n \r\n
}\r\n {__('Total PPL')}
\r\n \r\n {discountedTotal.value} {currency}\r\n
\r\n \r\n \r\n
\r\n {__('Issues')}
\r\n \r\n \r\n
\r\n \r\n
\r\n )\r\n // if (!editableMode) {\r\n\r\n // }\r\n\r\n return (\r\n \r\n \r\n
\r\n {currentStatusItem.label}
\r\n \r\n {issues.map((item, idx) => (\r\n \r\n this.onItemClick(item)}/>\r\n \r\n ))}\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport _ from 'lodash';\r\n\r\nexport default class TechnicalInformationCardIssuesListItem extends React.Component {\r\n\r\n getWarnings = () => this.props.item.items.map(x => x.field.warning);\r\n\r\n render() {\r\n let groups = _.groupBy(this.getWarnings(), 'type');\r\n\r\n return (\r\n \r\n {this.props.item.step.getTranslatedName()}: {group.length} {__('issues')}\r\n
)\r\n }\r\n}","import React from 'react';\r\nimport Button from '../../common/Button';\r\n\r\nexport default class EditorConnectionLostAlert extends React.Component {\r\n render() {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Button from '../../common/Button';\r\n\r\nexport default class EditorRestoreFromSnapshotAlert extends React.Component {\r\n render() {\r\n const addLeadingZero = x => (x < 10 ? '0' + x : x)\r\n let snapshotTime = new Date(this.props.snapshotTime)\r\n snapshotTime = `\r\n ${addLeadingZero(snapshotTime.getDate())}.${addLeadingZero(snapshotTime.getMonth())}.${snapshotTime.getFullYear()} \r\n ${addLeadingZero(snapshotTime.getHours())}:${addLeadingZero(snapshotTime.getMinutes())}`\r\n\r\n return (\r\n \r\n {__('There is a communication problem with the server. Please try again or contact support.')}
\r\n\r\n {this.props.snapshotTaken && (\r\n\r\n {__('A snapshot of your current configuration has been saved locally and will be restored upon refresh.')}\r\n \r\n )}\r\n\r\n \r\n\r\n \r\n
\r\n \r\n\r\n {this.props.snapshotTaken && (\r\n
\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Button from '../../common/Button';\r\n\r\nexport default class EditorSnapshotLoadErrorAlert extends React.Component {\r\n render() {\r\n return (\r\n \r\n {__('It looks like there was some communication problem last time, but a snapshot has been taken.')}
\r\n {__('Do you want to load the snapshot from')} {snapshotTime}?
\r\n\r\n
\r\n \r\n {__('Do you want to load the snapshot from')} {snapshotTime}?
\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 Button from '../../common/Button';\r\n\r\nconst WarningAlert = ({text, onCloseClick}) => {\r\n return (\r\n \r\n {__('Snapshot could not be loaded - version mismatch.')}
\r\n {__('Default settings will be used.')}
\r\n\r\n \r\n
\r\n \r\n {__('Default settings will be used.')}
\r\n\r\n \r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default WarningAlert;","import React from 'react';\r\nimport EditPageDocsGenerateModal from './EditPageDocsGenerateModal';\r\nimport FieldSelect from '../fields/FieldSelect';\r\nimport * as Row from '../../layout/Row';\r\n\r\nexport default class EditPageDeliveryDocsGenerateModal extends EditPageDocsGenerateModal {\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.state = {\r\n ...this.state,\r\n languageId: null\r\n }\r\n }\r\n\r\n onLanguageChange = item => {\r\n this.setState({\r\n languageId: item\r\n })\r\n }\r\n\r\n renderBody() {\r\n const languages = this.state.isLoading ? [] : this.state.model.language.items\r\n\r\n return (\r\n \r\n {__(text)}\r\n\r\n
\r\n \r\n \r\n
\r\n {__('Language')}
\r\n \r\n
\r\n )}\r\n\r\n {this.renderBody()}\r\n \r\n \r\n \r\n \r\n
\r\n {__('Specification scope')}
\r\n {this.renderTechnicalSpecificationItems()}\r\n {__('Sections')}
\r\n {this.state.model.outcomes.items.map(this.renderSectionCheckbox)}\r\n\r\n {__('Language')}
\r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n\r\n renderTechnicalSpecificationItems() {\r\n let option = this.state.technicalSpecification === undefined\r\n ? this.state.model.technicalSpecification.value\r\n : this.state.technicalSpecification;\r\n\r\n return (\r\n \r\n )\r\n }\r\n\r\n buildPostModel(configurationEditModel) {\r\n return {\r\n id: this.props.id,\r\n projectId: configurationEditModel.projectId,\r\n type: 'Substation',\r\n technicalSpecification: this.state.technicalSpecification,\r\n outcomes: this.state.selectedSections,\r\n language: this.state.languageId,\r\n configuration: configurationEditModel\r\n }\r\n }\r\n\r\n getDocumentType() {\r\n return 'Substation';\r\n }\r\n}","import React from 'react';\r\nimport EditPageDocsGenerateModal from './EditPageDocsGenerateModal';\r\nimport FieldSelect from '../fields/FieldSelect';\r\nimport store from '@lib/store/configuration';\r\nimport * as Row from '../../layout/Row';\r\n\r\n\r\nexport default class EditPageXlsDocsGenerateModal extends EditPageDocsGenerateModal {\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.state = {\r\n ...this.state,\r\n languageId: null\r\n }\r\n }\r\n\r\n onLanguageChange = item => {\r\n this.setState({\r\n languageId: item\r\n })\r\n }\r\n\r\n executeAction = data => this.configurationAPIService.generateXlsDocumentation(data)\r\n\r\n fetchModalData = () => {\r\n this.configurationAPIService.generateSpecificForOrderProcessing().then(response => {\r\n this.setState({\r\n model: response.data,\r\n languageId: response.data.language.value,\r\n isLoading: false\r\n })\r\n })\r\n }\r\n\r\n renderBody() {\r\n const languages = this.state.isLoading ? [] : this.state.model.language.items\r\n\r\n return (\r\n {__('Language')}
\r\n \r\n
\r\n\r\n \r\n {this.renderFieldInternal()}\r\n
\r\n )\r\n }\r\n\r\n renderFieldInternal() {\r\n var items = this.props.items;\r\n if (this.props.partitionSize) {\r\n return this.renderByPart();\r\n }\r\n\r\n return (\r\n items.map(item => this.renderItem(item))\r\n )\r\n }\r\n\r\n renderByPart() {\r\n var items = this.props.items;\r\n var parts = items.grouping(2);\r\n return (\r\n parts.map((part, idx) => (\r\n \r\n {part.map(item => this.renderItem(item))}\r\n
\r\n ))\r\n )\r\n }\r\n\r\n renderItem(item) {\r\n let itemId = this.generateUniqueId()\r\n\r\n return (\r\n \r\n this.onOptionChange(item)}/>\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Field from './Field'\r\nimport TypingTester from '@lib/TypingTester'\r\n\r\nexport default class FieldCheckboxSelect extends Field {\r\n constructor(props) {\r\n super(props)\r\n this.tester = new TypingTester(250)\r\n this.state = {\r\n selectedOptions: Array.isArray(props.value) ? props.value : []\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n let value = []\r\n if (nextProps.value) {\r\n value = nextProps.value\r\n }\r\n\r\n this.setState({\r\n selectedOptions: value\r\n })\r\n }\r\n\r\n onOptionChange = item => {\r\n let selectedOptions = this.state.selectedOptions\r\n let index = selectedOptions.findIndex(x => x.id === item.value.id);\r\n if (index > -1) {\r\n selectedOptions.splice(index, 1)\r\n } else {\r\n selectedOptions.push({id: item.value.id, quantity: 1})\r\n }\r\n\r\n this.setState({\r\n selectedOptions: selectedOptions\r\n })\r\n\r\n if (this.props.onChange) {\r\n this.props.onChange(selectedOptions)\r\n }\r\n }\r\n\r\n isOptionChecked = value => {\r\n return this.state.selectedOptions.findIndex(x => x.id === value.id) > -1\r\n }\r\n\r\n getValueFromState = item => {\r\n var fromState = this.state.selectedOptions.find(x => x.id === item.value.id);\r\n return fromState ? fromState.quantity : item.value.quantity;\r\n }\r\n\r\n onQuantityChange = (e, item) => {\r\n let index = this.state.selectedOptions.findIndex(x => x.id === item.value.id);\r\n if (index === -1) {\r\n return;\r\n }\r\n\r\n let selectedOptions = [...this.state.selectedOptions];\r\n selectedOptions[index].quantity = Number(e.target.value);\r\n\r\n this.setState({\r\n selectedOptions: selectedOptions\r\n })\r\n\r\n this.tester.record(() => {\r\n this.props.onChange(selectedOptions)\r\n })\r\n }\r\n\r\n renderField() {\r\n var className = ['configuration-radiogroup'];\r\n if (this.props.partitionSize)\r\n className.push('partition')\r\n\r\n return (\r\n \r\n {this.renderFieldInternal()}\r\n
\r\n )\r\n }\r\n\r\n renderFieldInternal() {\r\n var items = this.props.items;\r\n if (this.props.partitionSize) {\r\n return this.renderByPart();\r\n }\r\n\r\n return (\r\n items.map(item => this.renderItem(item))\r\n )\r\n }\r\n\r\n renderByPart() {\r\n var items = this.props.items;\r\n var parts = items.grouping(2);\r\n return (\r\n parts.map(part => (\r\n \r\n {this.props.items.map(item => (\r\n this.renderItem(item)\r\n ))}\r\n
\r\n )\r\n }\r\n\r\n renderItem(item) {\r\n let itemId = this.generateUniqueId();\r\n let disabled = this.props.disabled || item.disabled;\r\n\r\n return (\r\n \r\n this.onOptionChange(item)}/>\r\n \r\n
\r\n )\r\n }\r\n}","export default class FieldExtensions {\r\n static getFieldValue(field) {\r\n if (field.items) {\r\n let val = field.items.find(x => x.value === field.value)\r\n if (typeof val === 'object') {\r\n return val.text\r\n }\r\n }\r\n\r\n return field.value\r\n }\r\n}","import React from 'react';\r\nimport Field from './Field'\r\nimport TypingTester from '@lib/TypingTester'\r\nimport Warning from '../../common/Warning';\r\n\r\nexport default class FieldNumber extends Field {\r\n constructor(props) {\r\n super(props)\r\n\r\n this.willBeUpdatedBySelf = false\r\n this.canAcceptValueUpdate = true\r\n this.tester = new TypingTester(250)\r\n this.state = {\r\n value: props.value || null\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n value: nextProps.value || null\r\n })\r\n }\r\n\r\n shouldComponentUpdate(nextProps, nextState) {\r\n if (!this.willBeUpdatedBySelf) {\r\n if (nextState.value !== this.state.value && !this.canAcceptValueUpdate) {\r\n return false\r\n }\r\n }\r\n\r\n return (\r\n nextState.value !== this.state.value ||\r\n nextProps.value !== this.props.value ||\r\n nextProps.warning !== this.props.warning ||\r\n nextProps.readonly !== this.props.readonly ||\r\n nextProps.disabled !== this.props.disabled ||\r\n nextProps.text !== this.props.text\r\n )\r\n }\r\n\r\n onChange = e => {\r\n let val = e.target.value\r\n if (this.props.field.floatingPoint === false) {\r\n val = val.replace('.', '');\r\n val = val.replace(',', '');\r\n } else if (val && val.includes(',')) {\r\n val = val.replace(',', '.');\r\n }\r\n\r\n this.willBeUpdatedBySelf = true\r\n this.setState({value: val}, () => {\r\n this.willBeUpdatedBySelf = false\r\n this.canAcceptValueUpdate = false\r\n })\r\n\r\n // !!! Do not touch this !!!\r\n // !!! Store must be updated even if we're not done typing, yet !!!\r\n this.updateStoreValue(val)\r\n\r\n this.tester.record(() => {\r\n this.canAcceptValueUpdate = true\r\n this.props.onChange(val)\r\n })\r\n }\r\n\r\n renderInput = () => {\r\n let id = this.generateUniqueId()\r\n return ({this.props.unitLabel}
)}\r\n {this.state.value} {this.props.unitLabel && (\r\n {this.props.unitLabel})}
\r\n }\r\n\r\n renderField() {\r\n return (\r\n \r\n {this.props.readonly ? this.renderReadOnly() : this.renderInput()}\r\n\r\n {this.props.warning && (\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 Field from './Field'\r\n\r\nexport default class FieldRadioSelect extends Field {\r\n constructor(props) {\r\n super(props)\r\n\r\n this.state = {\r\n selectedOption: props.value\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n selectedOption: nextProps.value\r\n })\r\n }\r\n\r\n onOptionChange = item => {\r\n this.setState({\r\n selectedOption: item.value\r\n })\r\n\r\n if (this.props.onChange) {\r\n this.props.onChange(item.value)\r\n }\r\n }\r\n\r\n isOptionChecked = value => {\r\n return this.state.selectedOption === value\r\n }\r\n\r\n renderField() {\r\n return (\r\n \r\n {this.props.items.map(item => (\r\n this.renderItem(item)\r\n ))}\r\n
\r\n )\r\n }\r\n\r\n renderItem(item) {\r\n let itemId = this.generateUniqueId()\r\n return (\r\n \r\n this.onOptionChange(item)}/>\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Field from './Field';\r\nimport hasParentWithClassName from '../../../hasParentWithClassName';\r\nimport WarningsContainer from '../../common/WarningsContainer';\r\nimport InformationsContainer from '../../common/InformationsContainer';\r\n\r\nclass FieldSelectBodyPortal extends React.Component {\r\n constructor(props) {\r\n super(props)\r\n\r\n this.el = document.getElementById('field-select-body-portal')\r\n\r\n if (this.el === null) {\r\n this.el = document.createElement('div')\r\n this.el.setAttribute('id', 'field-select-body-portal')\r\n document.body.appendChild(this.el)\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n let rect = this.props.rootRef.current.getBoundingClientRect()\r\n let height = this.props.buttonRef.current.offsetHeight\r\n\r\n this.el.style.position = 'absolute';\r\n this.el.style.width = rect.width + 'px';\r\n this.el.style.top = Math.floor(rect.top + window.pageYOffset + height - 1) + 'px';\r\n this.el.style.left = rect.left + 'px';\r\n }\r\n\r\n render() {\r\n return ReactDOM.createPortal(\r\n this.props.children,\r\n this.el\r\n )\r\n }\r\n}\r\n\r\nexport default class FieldSelect extends Field {\r\n\r\n static currentlyOpenSelect = null\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.rootRef = React.createRef()\r\n this.buttonRef = React.createRef()\r\n this.state = {\r\n open: false,\r\n selectedOption: props.value,\r\n items: this.removeDuplicated(props.items, (x, y) => x.value === y.value),\r\n playingExitAnimation: false\r\n }\r\n }\r\n\r\n componentDidUpdate() {\r\n if (this.state.open) {\r\n setTimeout(() => {\r\n window.addEventListener('click', this.onWindowClick)\r\n }, 200)\r\n } else {\r\n window.removeEventListener('click', this.onWindowClick);\r\n }\r\n }\r\n\r\n onWindowClick = e => {\r\n if (this.state.open === false) {\r\n return\r\n }\r\n\r\n if (e.target.className && e.target.className.includes('dropdown-item--disabled')) {\r\n return;\r\n }\r\n\r\n var isDropdown = el => hasParentWithClassName(el, 'dropdown') === true\r\n var canHide = false\r\n if (e.target.tagName === 'path')\r\n canHide = !isDropdown(e.target.ownerSVGElement.parentElement)\r\n else\r\n canHide = !isDropdown(e.target.parentElement)\r\n\r\n if (canHide) {\r\n this.hide()\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n }\r\n\r\n removeDuplicated(input, cmp) {\r\n let out = []\r\n\r\n input.forEach(x => {\r\n let wouldDuplicate = false\r\n\r\n out.forEach(y => {\r\n wouldDuplicate = cmp(x, y)\r\n })\r\n\r\n if (!wouldDuplicate) {\r\n out.push(x)\r\n }\r\n })\r\n\r\n return out\r\n }\r\n\r\n componentWillUnmount() {\r\n if (FieldSelect.currentlyOpenSelect === this) {\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n open: false,\r\n selectedOption: nextProps.value,\r\n items: this.removeDuplicated(nextProps.items, (x, y) => x.value === y.value)\r\n })\r\n }\r\n\r\n shouldComponentUpdate(nextProps, nextState) {\r\n return (\r\n nextState.selectedOption !== this.state.selectedOption ||\r\n nextState.items !== this.state.items ||\r\n nextState.open !== this.state.open ||\r\n nextProps.disabled !== this.props.disabled\r\n )\r\n }\r\n\r\n onButtonClick = e => {\r\n if (this.isDisabled() || this.isReadOnly()) {\r\n return\r\n }\r\n\r\n if (FieldSelect.currentlyOpenSelect !== null && FieldSelect.currentlyOpenSelect !== this) {\r\n FieldSelect.currentlyOpenSelect.hide()\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n\r\n if (this.state.open === false) {\r\n FieldSelect.currentlyOpenSelect = this\r\n } else {\r\n FieldSelect.currentlyOpenSelect = null\r\n }\r\n\r\n if (this.state.open) {\r\n this.hide()\r\n } else {\r\n this.show()\r\n }\r\n }\r\n\r\n onItemClick = item => {\r\n this.setState({\r\n selectedOption: item.value,\r\n open: false\r\n })\r\n\r\n if (this.props.onChange) {\r\n this.props.onChange(item.value)\r\n }\r\n }\r\n\r\n show() {\r\n this.setState({open: true})\r\n }\r\n\r\n hide() {\r\n this.setState({open: false})\r\n }\r\n\r\n renderField() {\r\n const currentItem = this.state.items.find(x => x.value === this.state.selectedOption)\r\n const rootClassNames = ['dropdown', 'dropdown--react', 'w-100']\r\n\r\n if (this.isDisabled()) {\r\n rootClassNames.push('dropdown--disabled')\r\n } else {\r\n if (this.state.open) {\r\n rootClassNames.push('dropdown--open')\r\n }\r\n\r\n if (this.state.playingExitAnimation) {\r\n rootClassNames.push('dropdown--exit')\r\n }\r\n }\r\n\r\n if (this.isReadOnly()) {\r\n rootClassNames.push('dropdown--read-only')\r\n }\r\n if (this.props.className) {\r\n rootClassNames.push(this.props.className);\r\n }\r\n\r\n const getCurrentItem = () => currentItem ? currentItem.text : '';\r\n\r\n return (\r\n \r\n \r\n \r\n )\r\n ) : ''}\r\n\r\n {this.props.warning && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n\r\n {this.props.information && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n
\r\n )\r\n }\r\n\r\n renderItem = (item, idx) => {\r\n const classNames = ['dropdown-item']\r\n if (item.value === this.state.selectedOption) {\r\n classNames.push('dropdown-item--selected')\r\n }\r\n if (item.disabled == true) {\r\n classNames.push('dropdown-item--disabled')\r\n }\r\n\r\n var onClick = () => {\r\n if (item.disabled !== true) {\r\n this.onItemClick(item);\r\n }\r\n }\r\n\r\n return (\r\n \r\n
\r\n {this.state.open ? (\r\n this.props.forceNonPortal ? (\r\n \r\n {getCurrentItem()}\r\n
\r\n\r\n \r\n \r\n {this.state.items.map(this.renderItem)}\r\n
\r\n ) : (\r\n \r\n {this.state.items.map(this.renderItem)}\r\n
\r\n \r\n {item.text}\r\n
\r\n )\r\n }\r\n\r\n isDisabled() {\r\n return this.props.disabled || this.state.items.length === 0\r\n }\r\n\r\n isReadOnly() {\r\n return !this.props.forceReadable && (this.props.readonly || this.state.items.length === 1)\r\n }\r\n}","import React from 'react';\r\nimport Field from './Field';\r\nimport {useCallback} from 'react'\r\nimport hasParentWithClassName from '../../../hasParentWithClassName';\r\nimport AutocompleteTextInput from '../../common/AutocompleteTextInput'\r\n\r\nclass FieldSelectBodyPortal extends React.Component {\r\n constructor(props) {\r\n super(props)\r\n\r\n this.el = document.getElementById('field-select-body-portal')\r\n\r\n if (this.el === null) {\r\n this.el = document.createElement('div')\r\n this.el.setAttribute('id', 'field-select-body-portal')\r\n document.body.appendChild(this.el)\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n let rect = this.props.rootRef.current.getBoundingClientRect()\r\n let height = this.props.buttonRef.current.offsetHeight\r\n\r\n this.el.style.position = 'absolute';\r\n this.el.style.width = rect.width + 'px';\r\n this.el.style.top = Math.floor(rect.top + window.pageYOffset + height - 1) + 'px';\r\n this.el.style.left = rect.left + 'px';\r\n }\r\n\r\n render() {\r\n return ReactDOM.createPortal(\r\n this.props.children,\r\n this.el\r\n )\r\n }\r\n}\r\n\r\nexport default class FieldSelectAutoComplete extends Field {\r\n\r\n static currentlyOpenSelect = null\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.rootRef = React.createRef()\r\n this.buttonRef = React.createRef()\r\n this.state = {\r\n open: false,\r\n selectedOption: props.value,\r\n items: this.removeDuplicated(props.items, (x, y) => x.value === y.value),\r\n playingExitAnimation: false,\r\n inputTextValue: '',\r\n itemsCount: props.items.length,\r\n }\r\n }\r\n\r\n componentDidUpdate() {\r\n if (this.state.open) {\r\n window.addEventListener('click', this.onWindowClick);\r\n } else {\r\n window.removeEventListener('click', this.onWindowClick);\r\n }\r\n }\r\n\r\n onWindowClick = e => {\r\n if (this.state.open === false) {\r\n return\r\n }\r\n\r\n var isDropdown = el => hasParentWithClassName(el, 'dropdown') === false\r\n var canHide = false\r\n if (e.target.tagName === 'path')\r\n canHide = isDropdown(e.target.ownerSVGElement.parentElement)\r\n else\r\n canHide = isDropdown(e.target.parentElement)\r\n\r\n if (canHide) {\r\n this.hide()\r\n FieldSelectAutoComplete.currentlyOpenSelect = null\r\n }\r\n }\r\n\r\n removeDuplicated(input, cmp) {\r\n let out = []\r\n\r\n input.forEach(x => {\r\n let wouldDuplicate = false\r\n\r\n out.forEach(y => {\r\n wouldDuplicate = cmp(x, y)\r\n })\r\n\r\n if (!wouldDuplicate) {\r\n out.push(x)\r\n }\r\n })\r\n\r\n return out\r\n }\r\n\r\n componentWillUnmount() {\r\n if (FieldSelectAutoComplete.currentlyOpenSelect === this) {\r\n FieldSelectAutoComplete.currentlyOpenSelect = null\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n const items = this.removeDuplicated(nextProps.items, (x, y) => x.value === y.value);\r\n this.setState({\r\n open: false,\r\n selectedOption: nextProps.value,\r\n items: items,\r\n itemsCount: items.length\r\n })\r\n }\r\n\r\n shouldComponentUpdate(nextProps, nextState) {\r\n return (\r\n nextState.selectedOption !== this.state.selectedOption ||\r\n nextState.items !== this.state.items ||\r\n nextState.open !== this.state.open ||\r\n nextProps.disabled !== this.props.disabled ||\r\n nextState.inputTextValue !== this.state.inputTextValue\r\n )\r\n }\r\n\r\n onButtonClick = e => {\r\n if (this.isDisabled() || this.isReadOnly()) {\r\n return\r\n }\r\n\r\n if (FieldSelectAutoComplete.currentlyOpenSelect !== null && FieldSelectAutoComplete.currentlyOpenSelect !== this) {\r\n FieldSelectAutoComplete.currentlyOpenSelect.hide()\r\n FieldSelectAutoComplete.currentlyOpenSelect = null\r\n }\r\n\r\n if (this.state.open === false) {\r\n FieldSelectAutoComplete.currentlyOpenSelect = this\r\n } else {\r\n FieldSelectAutoComplete.currentlyOpenSelect = null\r\n }\r\n\r\n if (this.state.open) {\r\n this.hide()\r\n } else {\r\n this.show()\r\n }\r\n }\r\n\r\n onItemClick = item => {\r\n this.setState({\r\n selectedOption: item.value,\r\n open: false\r\n })\r\n\r\n if (this.props.onChange) {\r\n this.props.onChange(item.value)\r\n }\r\n }\r\n\r\n show() {\r\n this.setState({open: true})\r\n }\r\n\r\n hide() {\r\n this.setState({open: false})\r\n }\r\n\r\n onInputChange(value) {\r\n this.setState({inputTextValue: value});\r\n }\r\n\r\n onInputEnter = () => {\r\n }\r\n\r\n onOptionClick(option) {\r\n let item = this.state.items.filter(i => i.value == option.value)[0]\r\n if (item !== undefined) {\r\n this.onItemClick(item);\r\n }\r\n this.setState({inputTextValue: this.isMultiSelect() ? '' : item.text});\r\n }\r\n\r\n inputTextValue = () => {\r\n return this.state.inputTextValue;\r\n }\r\n\r\n onFocusChanged(e) {\r\n if(e)\r\n this.setState({inputTextValue: '', open: true});\r\n else\r\n this.setState({open: false});\r\n }\r\n\r\n getItemsOption = () => {\r\n let inputText = this.state.inputTextValue || '';\r\n return this.state.items.filter(x => x.text.toLowerCase().includes(inputText.toLowerCase()) || inputText === '')\r\n }\r\n\r\n renderField() {\r\n const currentItem = this.state.items.find(x => x.value === this.state.selectedOption)\r\n const rootClassNames = ['dropdown', 'dropdown--react', 'w-100']\r\n\r\n if (this.isDisabled()) {\r\n rootClassNames.push('dropdown--disabled')\r\n } else {\r\n if (this.state.open) {\r\n rootClassNames.push('dropdown--open')\r\n }\r\n\r\n if (this.state.playingExitAnimation) {\r\n rootClassNames.push('dropdown--exit')\r\n }\r\n }\r\n\r\n if (this.isReadOnly()) {\r\n rootClassNames.push('dropdown--read-only')\r\n }\r\n\r\n const getCurrentItem = () => currentItem ? currentItem.text : '';\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 renderItem = (item, idx) => {\r\n const classNames = ['dropdown-item']\r\n if (item.value === this.state.selectedOption) {\r\n classNames.push('dropdown-item--selected')\r\n }\r\n\r\n return (\r\n \r\n\r\n {this.isAutocomplete() ?\r\n this.onInputChange(e)}\r\n onEnter={this.onInputEnter}\r\n onOptionClick={(e) => this.onOptionClick(e)}\r\n classNames=\"dropdown-item\"\r\n onFocusChanged={(e) => this.onFocusChanged(e)}\r\n /> :\r\n
\r\n\r\n {this.isAutocomplete() ? \"\" : (this.state.open ? (\r\n this.props.forceNonPortal ? (\r\n \r\n {getCurrentItem()}\r\n
\r\n }\r\n\r\n \r\n \r\n {this.state.items.map(this.renderItem)}\r\n
\r\n ) : (\r\n \r\n {this.state.items.map(this.renderItem)}\r\n
\r\n this.onItemClick(item)}\r\n style={{animationDelay: (idx * 30) + 'ms'}}>\r\n {item.text}\r\n
\r\n )\r\n }\r\n\r\n isDisabled() {\r\n return this.props.disabled || this.state.items.length === 0\r\n }\r\n\r\n isReadOnly() {\r\n return !this.props.forceReadable && (this.props.readonly || this.state.items.length === 1)\r\n }\r\n\r\n isAutocomplete() {\r\n return this.state.itemsCount > 5;\r\n }\r\n\r\n isMultiSelect(){\r\n return Array.isArray(this.state.selectedOption);\r\n }\r\n}","import React from 'react';\r\nimport Field from './Field'\r\nimport TypingTester from '@lib/TypingTester'\r\n\r\nexport default class FieldText extends Field {\r\n constructor(props) {\r\n super(props)\r\n\r\n this.tester = new TypingTester(250)\r\n this.state = {\r\n value: props.value || ''\r\n }\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n value: nextProps.value || ''\r\n })\r\n }\r\n\r\n onChange = e => {\r\n this.setState({value: e.target.value})\r\n\r\n // !!! Do not touch this !!!\r\n // !!! Store must be updated even if we're not done typing, yet !!!\r\n this.updateStoreValue(e.target.value)\r\n\r\n this.tester.record(() => {\r\n this.props.onChange(this.state.value)\r\n })\r\n }\r\n\r\n renderReadOnly = () => {\r\n return {this.state.value} {this.props.unitLabel && (\r\n {this.props.unitLabel})}
\r\n }\r\n\r\n renderField() {\r\n let id = this.generateUniqueId()\r\n return (\r\n \r\n {this.props.readonly\r\n ? this.renderReadOnly()\r\n : e.which === 9 ? this.onTabFocus(e) : {}}\r\n />\r\n }\r\n
\r\n )\r\n }\r\n}","import React, {Component} from 'react'\r\n\r\nclass ConfiguratorPdfPage extends Component {\r\n render() {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport _ from 'lodash';\r\nimport Warning from '../../common/Warning';\r\n\r\ninterface SelfProps {\r\n initialOpen?: boolean,\r\n forceOpen?: boolean,\r\n onOpen?: any,\r\n onClose?: any,\r\n warnings?: any,\r\n label: string,\r\n children: any,\r\n arrowFirst?: boolean,\r\n additionalClasses?: string[]\r\n alwaysOpen?: boolean\r\n}\r\n\r\ninterface SelfState {\r\n open: boolean,\r\n duringOpen: boolean,\r\n duringClose: boolean\r\n}\r\n\r\nexport default class ExpandableContainer extends React.ComponentConfiguratorPdfPage
\r\n\r\n
\r\n )\r\n }\r\n\r\n renderExpandableHeader = () => {\r\n if (this.props.alwaysOpen) {\r\n return (\r\n {this.renderExpandableHeader()}\r\n {warnings.map((x: any, idx) => }/)
)}\r\n
\r\n \r\n {this.props.children}\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 {this.renderHeatExchangerRequirementsColumn(this.props.primary)}\r\n \r\n \r\n
\r\n \r\n {renderField(this.props.primary.inletTemperature)}\r\n {model.primary.inletTemperature.unit}\r\n
\r\n \r\n {renderField(this.props.primary.outletTemperature)}\r\n {model.primary.outletTemperature.unit}\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n {this.renderHeatExchangerRequirementsColumn(this.props.secondary, true)}\r\n \r\n \r\n
\r\n \r\n {renderField(this.props.secondary.outletTemperature)}\r\n {model.secondary.outletTemperature.unit}\r\n
\r\n \r\n {renderField(this.props.secondary.inletTemperature)}\r\n {model.secondary.inletTemperature.unit}\r\n
\r\n \r\n
\r\n\r\n {this.props.children}\r\n \r\n {this.renderStepHorizontalField(model.plateType.label, this.props.plateType, renderField, false)}\r\n {model.numberOfPlates.items.filter(x => x.value !== null).length > 0 && this.renderStepHorizontalField(model.numberOfPlates.label, this.props.numberOfPlates, renderField, false)}\r\n {leftSideUnderExchangerSides ? leftSideUnderExchangerSides.props.children : null}\r\n
\r\n \r\n {this.props.margin && this.props.margin.visible ? (\r\n \r\n ) : (\r\n \r\n ) : model.heatExchangerName && ( //TODO. TWS\r\n \r\n {__('Exchanger not chosen')}\r\n \r\n \r\n )}\r\n {rightSideUnderExchangerSides ? rightSideUnderExchangerSides.props.children : null}\r\n
\r\n \r\n {renderField(this.props.margin)}\r\n {renderField(this.props.marginLock, {\r\n renderLabel: false,\r\n title: model.marginLock.label\r\n })}\r\n
\r\n \r\n {model.heatExchangerName.value}\r\n {model.preHeaterPressureDrop && model.preHeaterPressureDrop.warning &&\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {renderField(prop)}\r\n
\r\n \r\n {this.props.renderField(side.fluid)}\r\n
:\r\n {__('Water')}\r\n }\r\n \r\n {this.props.renderField(side.mixRate)}\r\n {side.mixRate.unit}\r\n
\r\n \r\n {this.props.renderField(side.flow)}\r\n {side.flow.unit}\r\n
\r\n \r\n {this.props.renderField(side.maxPressureDrop)}\r\n {side.maxPressureDrop.unit}\r\n
\r\n \r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.controllerManufacturerFilter)}\r\n {this.renderControlCenterField()}\r\n {this.renderGenericHorizontalField(this.fields.controller)}\r\n {this.renderGenericHorizontalField(this.fields.pumpSwitchBox)}\r\n {this.renderGenericHorizontalField(this.fields.upgradedControllerDisplay)}\r\n {this.renderGenericHorizontalField(this.fields.addOnOption1)}\r\n {this.renderGenericHorizontalField(this.fields.addOnOption2)}\r\n {this.renderGenericHorizontalField(this.fields.addOnOption3)}\r\n {this.renderGenericHorizontalField(this.fields.addOnOption4)}\r\n {this.renderGenericHorizontalField(this.fields.router)}\r\n {this.renderReferenceTemperatureSensor()}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n return (\r\n \r\n {this.renderFieldv2(this.fields.refSensCount)}\r\n
\r\n\r\n {__('pcs')}
\r\n \r\n {this.renderFieldv2(this.fields.referenceTemperatureSensor)}\r\n {renderCount()}\r\n
\r\n ) : (\r\n {this.renderFieldv2(this.fields.referenceTemperatureSensor)}
\r\n )}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n }\r\n\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.temperatureSensorManufacturer)}\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 {jointFlowTemperatureSensors.length > 0 &&\r\n x.readonly)}\r\n label={this.renderLabel(1, 'jointFlowTemperatureSensor')}>\r\n }\r\n {jointReturnTemperatureSensors.length > 0 &&\r\n x.readonly)}\r\n label={this.renderLabel(1, 'jointReturnTemperatureSensor')}>\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 {primarySideEquipmentVisible && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n
\r\n \r\n\r\n
\r\n \r\n {this.renderHeatingLabel(1)}\r\n
\r\n \r\n {this.renderHeatingLabel(2)}\r\n
\r\n \r\n {this.renderHeatingLabel(3)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.flowTemperatureSensor1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.flowTemperatureSensor2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.flowTemperatureSensor3)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.returnTemperatureSensor1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.returnTemperatureSensor2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.returnTemperatureSensor3)}\r\n
\r\n \r\n {jointFlowTemperatureSensors.map(x => (\r\n
\r\n \r\n {this.renderFieldv2(x)}\r\n
\r\n ))}\r\n \r\n {jointReturnTemperatureSensors.map(x => (\r\n
\r\n \r\n {this.renderFieldv2(x)}\r\n
\r\n ))}\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.temperatureSensorPrimaryReturn1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.temperatureSensorPrimaryReturn2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.temperatureSensorPrimaryReturn3)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.outdoorTemperatureSensor)}\r\n
\r\n \r\n
\r\n \r\n {this.renderDHWLabel()}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.dhwFlowTemperatureSensor)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.dhwCircularTemperatureSensor)}\r\n
\r\n \r\n\r\n
\r\n \r\n
\r\n \r\n {__('Primary')}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.tedhFlow)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.tedhRet)}\r\n
\r\n \r\n
\r\n \r\n\r\n \r\n \r\n\r\n {showReturnPressureSensor && (\r\n \r\n }\r\n
\r\n \r\n
\r\n \r\n {this.renderHeatingLabel(1)}\r\n
\r\n \r\n {this.renderHeatingLabel(2)}\r\n
\r\n \r\n {this.renderHeatingLabel(3)}\r\n
\r\n \r\n \r\n \r\n
\r\n )}\r\n {showDifferentialPressureSensor && \r\n
\r\n \r\n {this.renderFieldv2(this.fields.returnPressureSensor1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.returnPressureSensor2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.returnPressureSensor3)}\r\n
\r\n \r\n
\r\n \r\n {this.fields.differentialPressureSensor1.visible && this.renderFieldv2(this.fields.differentialPressureSensor1)}\r\n
\r\n\r\n \r\n {this.fields.differentialPressureSensor2.visible && this.renderFieldv2(this.fields.differentialPressureSensor2)}\r\n
\r\n\r\n \r\n {this.fields.differentialPressureSensor3.visible && this.renderFieldv2(this.fields.differentialPressureSensor3)}\r\n
\r\n \r\n {this.renderFieldv2(this.fields.selectAllThermometers)}\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 {this.fields.dhwFlowThermometer.visible &&\r\n \r\n }\r\n {this.fields.dhwCircularThermometer.visible &&\r\n \r\n }\r\n {this.fields.coldWaterThermometer.visible &&\r\n \r\n }\r\n
\r\n \r\n\r\n
\r\n \r\n {this.renderHeatingLabel(1)}\r\n
\r\n \r\n {this.renderHeatingLabel(2)}\r\n
\r\n \r\n {this.renderHeatingLabel(3)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.flowThermometer1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.flowThermometer2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.flowThermometer3)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.returnThermometer1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.returnThermometer2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.returnThermometer3)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.thermometerPrimaryHeatingReturn1)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.thermometerPrimaryHeatingReturn2)}\r\n
\r\n\r\n \r\n {this.renderFieldv2(this.fields.thermometerPrimaryHeatingReturn3)}\r\n
\r\n \r\n\r\n
\r\n \r\n {this.renderDHWLabel()}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.dhwFlowThermometer)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.dhwCircularThermometer)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.coldWaterThermometer)}\r\n
\r\n \r\n {this.renderGeneralOptionsSection()}\r\n {this.shouldDisplayTemperatureSensors() &&\r\n this.renderSection(this.fields.temperatureSensorManufacturer,\r\n this.fields.flowTemperatureSensor1, this.fields.flowTemperatureSensor2, this.fields.flowTemperatureSensor3,\r\n this.fields.returnTemperatureSensor1, this.fields.returnTemperatureSensor2, this.fields.returnTemperatureSensor3,\r\n this.fields.jointFlowTemperatureSensor1, this.fields.jointFlowTemperatureSensor2, this.fields.jointFlowTemperatureSensor3,\r\n this.fields.jointReturnTemperatureSensor1, this.fields.jointReturnTemperatureSensor2, this.fields.jointReturnTemperatureSensor3,\r\n this.fields.temperatureSensorPrimaryReturn1, this.fields.temperatureSensorPrimaryReturn2, this.fields.temperatureSensorPrimaryReturn3,\r\n this.fields.outdoorTemperatureSensor, this.fields.dhwFlowTemperatureSensor, this.fields.dhwCircularTemperatureSensor)\r\n\r\n && this.renderTemperatureSensorsSection()}\r\n {this.renderPressureSensorsSection()}\r\n {this.renderSection(\r\n this.fields.flowThermometer1,\r\n this.fields.flowThermometer2,\r\n this.fields.flowThermometer3,\r\n this.fields.returnThermometer1,\r\n this.fields.returnThermometer2,\r\n this.fields.returnThermometer3,\r\n this.fields.thermometerPrimaryHeatingReturn1,\r\n this.fields.thermometerPrimaryHeatingReturn2,\r\n this.fields.thermometerPrimaryHeatingReturn3,\r\n this.fields.dhwFlowThermometer,\r\n this.fields.dhwCircularThermometer,\r\n this.fields.coldWaterThermometer) && this.renderThermometers()}\r\n
\r\n )\r\n }\r\n\r\n hasHeatingField = (idx, fieldName) => {\r\n return (\r\n this.props.model[`heating${idx}`] &&\r\n this.props.model[`heating${idx}`][fieldName] &&\r\n this.props.model[`heating${idx}`][fieldName].visible\r\n )\r\n }\r\n\r\n hasPrimarySideEquipmentHeatingField = (idx, fieldName) => {\r\n if (!this.props.model.primarySideEquipment) {\r\n return false;\r\n }\r\n\r\n return (\r\n this.props.model.primarySideEquipment[`heating${idx}`] &&\r\n this.props.model.primarySideEquipment[`heating${idx}`][fieldName] &&\r\n this.props.model.primarySideEquipment[`heating${idx}`][fieldName].visible\r\n )\r\n }\r\n\r\n renderHeatingLabel = (idx) => {\r\n if (this.props.model[`heating${idx}`] !== undefined) {\r\n return (\r\n \r\n {this.props.model[`heating${idx}`].name.value}\r\n
);\r\n }\r\n return '';\r\n }\r\n\r\n renderDHWLabel = () => (\r\n \r\n {this.props.model.dhw ? this.props.model.dhw.name.value : ''}\r\n
\r\n )\r\n\r\n renderLabel = (idx, fieldName) => {\r\n if (this.hasHeatingField(idx, fieldName)) {\r\n return this.props.model[`heating${idx}`][fieldName].label\r\n }\r\n\r\n return ''\r\n }\r\n\r\n renderPrimarySideEquipmentHeatingLabel = (idx, fieldName) => {\r\n if (this.hasPrimarySideEquipmentHeatingField(idx, fieldName)) {\r\n return this.props.model.primarySideEquipment[`heating${idx}`][fieldName].label\r\n }\r\n\r\n return ''\r\n }\r\n\r\n renderLabeledHeatingField = (heatingIndex, field) => {\r\n if (field.visible) {\r\n return (\r\n \r\n
\r\n\r\n \r\n {this.renderGenericHorizontalField(this.fields.capacity)}\r\n
\r\n\r\n \r\n {this.renderGenericHorizontalField(this.fields.quickStepSetup)}\r\n
\r\n \r\n
\r\n \r\n {this.fields.secondarySideIncluded.value ? (\r\n \r\n {this.renderFieldv2(this.fields.heatPumpConnectionsIncluded)}
\r\n {this.renderFieldv2(this.fields.secondarySideIncluded)}
\r\n {this.renderFieldv2(this.fields.proPlusDhwPreheating)}
\r\n {this.renderFieldv2(this.fields.hotWaterCirculation)}
\r\n \r\n
\r\n )\r\n }\r\n\r\n return \r\n
\r\n {this.renderFieldv2(this.fields.isTwoStroke)}
\r\n \r\n
\r\n )\r\n }\r\n\r\n round(n, precision) {\r\n var m = Math.pow(10, precision);\r\n return Math.round(n * m) / m;\r\n }\r\n\r\n renderSecondarySideComponents(model) {\r\n const warnings = [\r\n this.fields.secondaryPipeSize,\r\n this.fields.circulationValve,\r\n this.fields.coldWaterMeter,\r\n this.fields.waterMeterCommunication,\r\n this.fields.circulationPipeSize,\r\n this.fields.safetyValve,\r\n this.fields.coldWaterStrainer,\r\n this.fields.circulationStrainer,\r\n this.fields.manometer,\r\n this.fields.pumpStopThermostat\r\n ].filter(x => x.visible).map(s => s.warning);\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {__('Connection type')}\r\n
\r\n \r\n \r\n \r\n {this.props.model.heating1.name.value}\r\n {this.renderFieldv2(this.fields.connectionTypeH1)}\r\n \r\n\r\n {this.props.model.heating2 ?\r\n \r\n {this.props.model.heating2.name.value}\r\n {this.renderFieldv2(this.fields.connectionTypeH2)}\r\n \r\n : ''}\r\n\r\n {this.props.model.heating3 ?\r\n \r\n {this.props.model.heating3.name.value}\r\n {this.renderFieldv2(this.fields.connectionTypeH3)}\r\n \r\n : ''}\r\n \r\n
\r\n \r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.dhwPreheatingKitHeatExchanger)}\r\n {this.renderGenericHorizontalField(this.fields.dhwPreheatingKitPump)}\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.dhwPreheatingKitThreeWayValve)}\r\n {this.renderGenericHorizontalField(this.fields.dhwPreheatingKitActuator)}\r\n
\r\n \r\n {(this.fields.pumpManufacturer.visible || this.fields.pump.visible || this.fields.circulationFlowFactor.visible) && (\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.pumpManufacturer)}\r\n {this.renderGenericHorizontalField(this.fields.pump, {}, pumpModelTips, undefined, 'has-additional-filters-container', () => {\r\n return (\r\n
\r\n )}\r\n\r\n \r\n {this.renderGenericHorizontalField(this.fields.networkPressureDrop)}\r\n {this.renderGenericHorizontalField(this.fields.requiredLiftingHeight)}\r\n {this.renderGenericHorizontalField(this.fields.pumpFlow, {}, [], setCirculationFlowFactorDefaultValue)}\r\n
\r\n \r\n
\r\n\r\n \r\n {this.renderGenericHorizontalField(this.fields.capacity)}\r\n
\r\n\r\n \r\n {this.renderGenericHorizontalField(this.fields.quickStepSetup)}\r\n
\r\n {this.renderFieldv2(this.fields.secondarySideIncluded)}
\r\n \r\n {this.renderGenericHorizontalField(this.fields.valveSupply, {}, this.doFieldsHaveValues(model.valveSupplyDP, model.valveSupplyKVS) ? [\r\n `${__('dp')}: ${model.valveSupplyDP.value} ${model.valveSupplyDP.unit}`,\r\n `${__('kvs')}: ${model.valveSupplyKVS.value}`\r\n ] : [])}\r\n\r\n {this.shouldShowFillingInSecondarySideComponents() && this.renderGenericHorizontalField(this.fields.filling)}\r\n {this.shouldShowWaterMeterCommunicationInSecondarySideComponents() && this.renderGenericHorizontalField(this.fields.waterMeterCommunication)}\r\n\r\n {this.renderGenericHorizontalField(this.fields.deaerator, {}, this.doFieldsHaveValues(model.deaeratorDP, model.deaeratorKVS) ? [\r\n `${__('dp')}: ${model.deaeratorDP.value} ${model.deaeratorDP.unit}`,\r\n `${__('kvs')}: ${model.deaeratorKVS.value}`\r\n ] : [])}\r\n\r\n {this.renderGenericHorizontalField(this.fields.vacuumDGSR)}\r\n
\r\n\r\n \r\n {this.renderGenericHorizontalField(this.fields.manometer)}\r\n {this.renderGenericHorizontalField(this.fields.installtionKitForDPE)}\r\n {this.renderGenericHorizontalField(this.fields.expansionSectionServiceShutOff)}\r\n {this.shouldShowSafetyValveInSecondarySideComponents() && this.renderGenericHorizontalField(this.fields.safetyValve)}\r\n {this.renderGenericHorizontalField(this.fields.strainerOption)}\r\n
\r\n \r\n {this.getHeatingIndex() === 1 &&
\r\n\r\n {this.renderFieldv2(this.fields.pumpManufacturerLocked)}
}\r\n {this.renderGenericHorizontalField(this.fields.pumpManufacturer, {}, [], () => {\r\n this.fields.pumpManufacturer.value = null;\r\n store.recentlyChangedField = this.fields.pumpManufacturer.getModelPath()\r\n this.props.onFormModelChange();\r\n })}\r\n {this.renderGenericHorizontalField(this.fields.pump, {}, pumpModelTips, () => {\r\n this.fields.pump.value = null;\r\n this.props.onFormModelChange();\r\n }, 'has-additional-filters-container', () => {\r\n return (\r\n \r\n {this.renderGenericHorizontalField(this.fields.networkPressureDrop)}\r\n {this.renderGenericHorizontalField(this.fields.requiredLiftingHeight)}\r\n {this.renderGenericHorizontalField(this.fields.pumpFlow)}\r\n {this.renderGenericHorizontalField(this.fields.bypassFilterConnections)}\r\n {this.renderGenericHorizontalField(this.fields.bypassFilter)}\r\n {this.renderGenericHorizontalField(this.fields.spareCartridge)}\r\n
\r\n \r\n
\r\n {this.renderHeatExchangerRequirements(model)}\r\n {this.renderTanks()}\r\n {this.renderSecondarySideComponents()}\r\n {this.renderPumps()}\r\n \r\n {this.renderGenericHorizontalField(this.fields.capacity)}\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.quickStepSetup)}\r\n
\r\n \r\n
\r\n \r\n )\r\n }\r\n\r\n renderTanks() {\r\n const fields = [this.fields.tank];\r\n if (!this.renderSection(...fields)) {\r\n return \r\n {this.renderGenericHorizontalField(this.fields.heatExchanger)}\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.tank)}\r\n {this.renderGenericHorizontalField(this.fields.tankInsulation)}\r\n {this.renderGenericHorizontalField(this.fields.tankHeater)}\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.controlValve)}\r\n {this.renderGenericHorizontalField(this.fields.primaryActuator)}\r\n {this.renderGenericHorizontalField(this.fields.secondaryActuator)}\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.primaryPump, {}, GetPumpLiftingHeightTips(this.fields.primaryPumpData))}\r\n {this.renderGenericHorizontalField(this.fields.secondaryPump, {}, GetPumpLiftingHeightTips(this.fields.primaryPumpData))}\r\n {this.renderGenericHorizontalField(this.fields.circulationPump, {}, GetPumpLiftingHeightTips(this.fields.primaryPumpData))}\r\n
\r\n \r\n {this.props.children}\r\n
\r\n )\r\n }\r\n\r\n hasMultipleFields = () => this.props.children.filter(x => React.isValidElement(x) && x.type === StepHorizontalDoubleFieldItem).length > 1;\r\n\r\n renderTips() {\r\n if (this.props.inputTips.length === 0) {\r\n return \r\n \r\n
\r\n {this.props.renderAdditionalFilters && \r\n {this.renderTips()}\r\n
\r\n \r\n \r\n
}\r\n \r\n {this.props.renderAdditionalFilters()}\r\n
\r\n \r\n {this.props.inputTips.map((tip, idx) => (\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport IconDefault from '../../icons/IconDefault';\r\n\r\nexport default class StepHorizontalDoubleFieldItem extends React.Component {\r\n renderDefButton() {\r\n let renderButton = () => (\r\n {tip}
\r\n ))}\r\n \r\n
\r\n )\r\n\r\n let renderEmpty = () => (\r\n \r\n \r\n \r\n )\r\n\r\n return (\r\n \r\n {this.props.defaultButtonVisible ? renderButton() : renderEmpty()}\r\n
\r\n )\r\n }\r\n\r\n renderMetaData() {\r\n if (this.props.unit && this.props.defaultButtonVisible) {\r\n return (\r\n \r\n {{this.props.unit}}\r\n
\r\n \r\n {this.renderDefButton()}\r\n
\r\n \r\n {{this.props.unit}}\r\n
\r\n )\r\n }\r\n if (this.props.defaultButtonVisible) {\r\n return (\r\n \r\n {this.renderDefButton()}\r\n
\r\n )\r\n }\r\n }\r\n\r\n render() {\r\n if (this.props.visible === false) {\r\n return \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport IconDefault from '../../icons/IconDefault';\r\n\r\nexport default class StepHorizontalField extends React.Component {\r\n static defaultProps = {\r\n inputTips: []\r\n }\r\n\r\n renderDefButton() {\r\n let renderButton = () => (\r\n \r\n {this.props.label}\r\n
\r\n \r\n {this.props.children}\r\n
\r\n {this.renderMetaData()}\r\n \r\n
\r\n )\r\n\r\n let renderEmpty = () => (\r\n \r\n \r\n \r\n )\r\n\r\n return (\r\n \r\n {this.props.defaultButtonVisible ? renderButton() : renderEmpty()}\r\n
\r\n )\r\n }\r\n\r\n renderMetaData() {\r\n if (this.props.unit && this.props.defaultButtonVisible) {\r\n return (\r\n \r\n {{this.props.unit}}\r\n
\r\n \r\n {this.renderDefButton()}\r\n
\r\n \r\n {{this.props.unit}}\r\n
\r\n )\r\n }\r\n if (this.props.defaultButtonVisible) {\r\n return (\r\n \r\n {this.renderDefButton()}\r\n
\r\n )\r\n }\r\n }\r\n\r\n render() {\r\n if (this.props.visible === false) {\r\n return \r\n
\r\n )\r\n }\r\n\r\n renderTips() {\r\n if (this.props.inputTips.length === 0) {\r\n return \r\n
\r\n \r\n {this.props.label}\r\n
\r\n \r\n {this.props.children}\r\n
\r\n {this.renderMetaData()}\r\n \r\n \r\n
\r\n {this.props.renderAdditionalFilters && \r\n {this.renderTips()}\r\n
\r\n \r\n \r\n
}\r\n \r\n {this.props.renderAdditionalFilters()}\r\n
\r\n \r\n {this.props.inputTips.map((tip, idx) => (\r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport Step from './Step';\r\nimport StepModel from '../../../model/configurator/StepModel';\r\nimport ExpandableContainer from './ExpandableContainer';\r\nimport CrossReferencedHeatingField from '../../../model/configurator/controller/CrossReferencedHeatingField';\r\nimport Field from '../../../model/configurator/Field';\r\nimport CrossReferencedDHWField from '../../../model/configurator/CrossReferencedDHWField';\r\nimport StepHorizontalField from './StepHorizontalField';\r\nimport * as Row from '../../layout/Row';\r\n\r\nexport default class StepOptions extends Step {\r\n renderBody() {\r\n\r\n\r\n return (\r\n {tip}
\r\n ))}\r\n \r\n \r\n \r\n {this.fields.heating1PumpAddon.visible && (\r\n \r\n {this.props.model.heating1.name.value}\r\n {this.renderFieldv2(this.fields.heating1PumpAddon)}\r\n \r\n )}\r\n\r\n {this.fields.heating2PumpAddon.visible && (\r\n \r\n {this.props.model.heating2.name.value}\r\n {this.renderFieldv2(this.fields.heating2PumpAddon)}\r\n \r\n )}\r\n\r\n {this.fields.heating3PumpAddon.visible && (\r\n \r\n {this.props.model.heating3.name.value}\r\n {this.renderFieldv2(this.fields.heating3PumpAddon)}\r\n \r\n )}\r\n\r\n {this.fields.dhwPumpAddon.visible && (\r\n \r\n {this.props.model.dhw.name.value}\r\n {this.renderFieldv2(this.fields.dhwPumpAddon)}\r\n \r\n )}\r\n \r\n \r\n
\r\n {this.renderGenericHorizontalField(this.fields.additionalOptions, {}, [], undefined, 'additional-options')}\r\n \r\n {this.renderAddModuleButton(model)}\r\n \r\n {__('Remove')}\r\n \r\n
\r\n\r\n \r\n \r\n {this.state.isLoading && }\r\n
\r\n )\r\n }\r\n\r\n renderAddModuleButton(model) {\r\n if (model.canAddAndEditRows && model.items.visible) {\r\n return \r\n }\r\n }\r\n\r\n renderImportFromExcelButton(model) {\r\n if (model.canImport && model.items.visible) {\r\n return \r\n }\r\n }\r\n\r\n renderExportModulesExcelButton(model) {\r\n if (model.items.visible) {\r\n return \r\n }\r\n }\r\n\r\n renderShowExcludedModules() {\r\n return (\r\n \r\n {this.renderImportXlsModal()}\r\n {this.renderAddModuleButton(model)}\r\n {this.renderImportFromExcelButton(model)}\r\n {this.renderExportModulesExcelButton(model)}\r\n
\r\n \r\n {model.items.visible && this.renderShowExcludedModules()}\r\n {model.items.visible && this.renderTable(model)}\r\n
\r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n\r\n onShowExcludedModulesClick = () => {\r\n this.setState(prev => ({\r\n showExcludedModules: !prev.showExcludedModules,\r\n isLoading: true\r\n }), () => {\r\n store.setShowExcludedModules(this.state.showExcludedModules);\r\n var model = store.getTransformedFormModel();\r\n let payload = {\r\n configuration: store.getTransformedFormModel(),\r\n items: model.pricing.items\r\n };\r\n this.stepModel.editor.configurationAPIService.configurePricing(payload).then(response => {\r\n this.configurationAPIServiceSuccess(response);\r\n this.setState({\r\n isLoading: false\r\n })\r\n });\r\n })\r\n }\r\n\r\n static getStepModel(model) {\r\n return new StepModel('pricing', model.pricing)\r\n }\r\n}\r\n","import Step from \"./Step\";\r\nimport StepModel from \"../../../model/configurator/StepModel\";\r\nimport Field from \"../../../model/configurator/Field\";\r\nimport ReservedPressureDropForDPCPercent\r\n from '../../../model/configurator/primarySideEquipment/ReservedPressureDropForDPCPercent';\r\nimport ReservedPressureDropForDPCPressure\r\n from '../../../model/configurator/primarySideEquipment/ReservedPressureDropForDPCPressure';\r\nimport ExpandableContainer from \"./ExpandableContainer\";\r\nimport * as Row from '../../layout/Row';\r\nimport StepHorizontalField from \"./StepHorizontalField\";\r\nimport store from '../../../store/configuration';\r\nimport WarningsContainer from '../../common/WarningsContainer';\r\n\r\nexport default class StepPrimarySideEquipment extends Step {\r\n renderBody(model) {\r\n model = model.primarySideEquipment\r\n return (\r\n \r\n {this.renderGenericHorizontalField(this.fields.primaryMainPipeSize)}\r\n\r\n \r\n \r\n {this.renderFieldv2(this.fields.picv)}\r\n \r\n \r\n\r\n {this.renderGenericHorizontalField(this.fields.controlValveManufacturer)}\r\n\r\n \r\n \r\n {this.renderFieldv2(this.fields.flangedControlValvesDemanded)}\r\n {this.renderFieldv2(this.fields.rtzActuatorDemanded)}\r\n \r\n \r\n \r\n \r\n {this.renderFieldv2(this.fields.differentialPressureControllerDPC)}\r\n \r\n \r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.dhStrainer)}\r\n {this.renderGenericHorizontalField(this.fields.pressureMetering)}\r\n {this.renderGenericHorizontalField(this.fields.thermometerPrimarySupply)}\r\n {this.renderGenericHorizontalField(this.fields.thermometerPrimaryReturn)}\r\n {this.renderGenericHorizontalField(this.fields.dhFlowRetShutOff)}\r\n {this.renderGenericHorizontalField(this.fields.primaryOutPipeEMS)}\r\n {this.renderGenericHorizontalField(this.fields.energyMeter)}\r\n {this.renderGenericHorizontalField(this.fields.shutOffValvePrimarySupply)}\r\n {this.renderGenericHorizontalField(this.fields.shutOffValvePrimaryReturn)}\r\n
\r\n \r\n {this.renderGenericHorizontalField(this.fields.primaryFlowForDPCSizing, {}, getPrimaryFlowForDPCSizingTips(), setPrimaryFlowForDPCSizingDefaultValue)}\r\n {this.renderGenericHorizontalField(this.fields.reservedPressureDropForDPCPercent, {label: __('Reserved pressure drop for DPC')})}\r\n {this.renderGenericHorizontalField(this.fields.reservedPressureDropForDPCPressureDrop, {label: __('Reserved pressure drop for DPC')})}\r\n {this.renderGenericHorizontalField(this.fields.differentialPressureController, {}, getDPCPressureDropTips())}\r\n
\r\n \r\n {this.renderGenericHorizontalField(fields.numberOfControlValves)}\r\n {this.renderGenericHorizontalField(fields.availableDP, {}, fields.availableDPCalculated.value ? [\r\n `${__('calculated')}: ${fields.availableDPCalculated.value}`\r\n ] : [])}\r\n {this.renderGenericHorizontalField(fields.cvFlow, {}, fields.cvFlowCalculated.value ? [\r\n `${__('calculated')}: ${fields.cvFlowCalculated.value}`\r\n ] : [])}\r\n {fields.neededKVS.visible && \r\n {fields.neededKVS.value || 0}\r\n }\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n {this.props.model.primarySideEquipment.picv.value ? this.renderCV('Control valve', picvValveFields, true) : this.renderCV('Control valve', valveFields)}\r\n {this.renderCV('KVS', kvsFields)}\r\n {this.renderCV('Actuator type', actuatorTypeFields)}\r\n \r\n \r\n {valveFields.map((field, idx) => (\r\n \r\n CV{idx + 1}\r\n \r\n ))}\r\n \r\n
\r\n \r\n {fields.totalKVS.visible && \r\n {fields.totalKVS.value}\r\n }\r\n\r\n {isHeating && this.renderGenericHorizontalField(fields.isSummerShutOff, {label: ''})}\r\n\r\n {fields.controlValvePressureDrop.visible &&\r\n \r\n {fields.controlValvePressureDrop.value} {fields.controlValvePressureDrop.unit}\r\n {fields.controlValvePressureDrop.warning &&\r\n }\r\n }\r\n
\r\n {heatingModel !== null && heatingModel.heatPumpConnectionsIncluded.value && heatingModel.heatPumpConnectionType.value === 1 &&\r\n \r\n
\r\n );\r\n }\r\n\r\n renderThreeWayValvePressureDropAndKVS = fields => (\r\n \r\n \r\n
\r\n {this.renderCV('Control valve', valveFields)}\r\n {this.renderCV('KVS', kvsFields)}\r\n {this.renderCV('Actuator type', actuatorTypeFields)}\r\n \r\n \r\n \r\n 3-way valve\r\n \r\n \r\n
\r\n \r\n {fields.threeWayValvePressureDrop.visible &&\r\n \r\n {fields.threeWayValvePressureDrop.value} {fields.threeWayValvePressureDrop.unit}\r\n {fields.threeWayValvePressureDrop.warning &&\r\n }\r\n }\r\n
\r\n )\r\n\r\n renderCV(label, fields, possibleDefaultValue) {\r\n\r\n const visible = fields.some(x => x.visible);\r\n if (!visible) {\r\n return \r\n
\r\n )\r\n }\r\n\r\n static getFields(step) {\r\n const createField = name => new Field(name, step)\r\n const createCircuitSection = name => ({\r\n numberOfControlValves: createField(name + '.numberOfControlValves'),\r\n availableDP: createField(name + '.availableDP'),\r\n availableDPCalculated: createField(name + '.availableDPCalculated'),\r\n controlValvePressureDrop: createField(name + '.controlValvePressureDrop'),\r\n threeWayValvePressureDrop: createField(name + '.threeWayValvePressureDrop'),\r\n cvFlow: createField(name + '.cvFlow'),\r\n cvFlowCalculated: createField(name + '.cvFlowCalculated'),\r\n neededKVS: createField(name + '.neededKVS'),\r\n temperatureSensorPrimaryReturn: createField(name + '.temperatureSensorPrimaryReturn'),\r\n thermometerPrimaryHeatingReturn: createField(name + '.thermometerPrimaryHeatingReturn'),\r\n totalKVS: createField(name + '.totalKVS'),\r\n threeWayValveTotalKVS: createField(name + '.threeWayValveTotalKVS')\r\n })\r\n\r\n const createHeatingSection = name => ({\r\n ...createCircuitSection(name),\r\n isSummerShutOff: createField(name + '.isSummerShutOff'),\r\n })\r\n\r\n const createDHWSection = name => ({\r\n ...createCircuitSection(name)\r\n })\r\n\r\n const createCVSection = (name, idx) => ({\r\n controlValve: createField(name + '.cV' + idx + '.controlValve'),\r\n actuatorType: createField(name + '.cV' + idx + '.actuatorType'),\r\n kvs: createField(name + '.cV' + idx + '.kvs'),\r\n controlValvePICV: createField(name + '.cV' + idx + '.controlValvePICV'),\r\n })\r\n\r\n const create3WayValveSection = name => ({\r\n controlValve: createField(name + '.threeWayValve.controlValve'),\r\n actuatorType: createField(name + '.threeWayValve.actuatorType'),\r\n kvs: createField(name + '.threeWayValve.kvs'),\r\n })\r\n\r\n return {\r\n availableHEtoDHRetOrPreh: createField('availableHEtoDHRetOrPreh'),\r\n availableHEtoDHRetOrPrehDN: createField('availableHEtoDHRetOrPrehDN'),\r\n picv: createField('picv'),\r\n controlValveManufacturer: createField('controlValveManufacturer'),\r\n primaryMainPipeSize: createField('primaryMainPipeSize'),\r\n flangedControlValvesDemanded: createField('flangedControlValvesDemanded'),\r\n rtzActuatorDemanded: createField('rtzActuatorDemanded'),\r\n differentialPressureControllerDPC: createField('differentialPressureControllerDPC'),\r\n primaryFlowForDPCSizing: createField('primaryFlowForDPCSizing'),\r\n differentialPressureController: createField('differentialPressureController'),\r\n dpcPressureDrop: createField('dpcPressureDrop'),\r\n reservedPressureDropForDPCPercent: new ReservedPressureDropForDPCPercent('reservedPressureDropForDPCPercent', step),\r\n reservedPressureDropForDPCPressureDrop: new ReservedPressureDropForDPCPressure('reservedPressureDropForDPCPressureDrop', step),\r\n dhStrainer: createField('dhStrainer'),\r\n energyMeter: createField('energyMeter'),\r\n primaryOutPipeEMS: createField('primaryOutPipeEMS'),\r\n dhFlowRetShutOff: createField('dhFlowRetShutOff'),\r\n pressureMetering: createField('pressureMetering'),\r\n primaryTotalFlow: createField('primaryTotalFlow'),\r\n thermometerPrimaryReturn: createField('thermometerPrimaryReturn'),\r\n thermometerPrimarySupply: createField('thermometerPrimarySupply'),\r\n heating1: {\r\n ...createHeatingSection('heating1'),\r\n cv1: createCVSection('heating1', 1),\r\n cv2: createCVSection('heating1', 2),\r\n cv3: createCVSection('heating1', 3),\r\n threeWayValve: create3WayValveSection('heating1')\r\n },\r\n heating2: {\r\n ...createHeatingSection('heating2'),\r\n cv1: createCVSection('heating2', 1),\r\n cv2: createCVSection('heating2', 2),\r\n cv3: createCVSection('heating2', 3),\r\n threeWayValve: create3WayValveSection('heating2')\r\n },\r\n heating3: {\r\n ...createHeatingSection('heating3'),\r\n cv1: createCVSection('heating3', 1),\r\n cv2: createCVSection('heating3', 2),\r\n cv3: createCVSection('heating3', 3),\r\n threeWayValve: create3WayValveSection('heating3')\r\n },\r\n dhw: {\r\n ...createDHWSection('dhw'),\r\n cv1: createCVSection('dhw', 1),\r\n cv2: createCVSection('dhw', 2),\r\n cv3: createCVSection('dhw', 3)\r\n },\r\n tedhFlow: createField('tedhFlow'),\r\n tedhRet: createField('tedhRet'),\r\n shutOffValvePrimarySupply: createField('shutOffValvePrimarySupply'),\r\n shutOffValvePrimaryReturn: createField('shutOffValvePrimaryReturn')\r\n }\r\n }\r\n\r\n static getStepModel(model) {\r\n return new StepModel('primarySideEquipment', model.primarySideEquipment)\r\n }\r\n}","import React from 'react';\r\nimport Step from './Step';\r\nimport SummaryUnitTypeSection from './summary/SummaryUnitTypeSection';\r\nimport SummaryEESLabelSection from './summary/SummaryEESLabelSection';\r\nimport SummaryPricingSection from './summary/SummaryPricingSection';\r\nimport SummaryHeatingTWS from './summary/SummaryHeatingTWS';\r\nimport SummaryHeatingSection from './summary/SummaryHeatingSection';\r\nimport SummaryControllerSection from './summary/SummaryControllerSection';\r\nimport SummaryOptionsSection from './summary/SummaryOptionsSection';\r\nimport SummaryPrimarySideEquipment from './summary/SummaryPrimarySideEquipmentSection';\r\nimport store from '../../../store/configuration';\r\n\r\nexport default class StepSummary extends Step {\r\n\r\n pricingSectionRef = React.createRef()\r\n\r\n stepAboutToBecomeVisible() {\r\n if (this.pricingSectionRef.current) {\r\n this.pricingSectionRef.current.stepAboutToBecomeVisible()\r\n }\r\n }\r\n\r\n renderBody() {\r\n const renderHeatings = () => {\r\n let results = []\r\n for (let i = 1; i <= this.props.model.unitType.heatingSectionCount.value; i++) {\r\n if (typeof this.props.model['heating' + i] !== 'undefined') {\r\n results.push({__(label)}
\r\n \r\n \r\n {fields.map((field, idx) => (\r\n \r\n {this.renderFieldv2(field)}\r\n {withDefaultValue(field) && \r\n ))}\r\n \r\n
\r\n onDefaultButtonClick(field)}>\r\n {__('DEF')}\r\n
}\r\n \r\n {__('Model')}\r\n {this.props.model.summary.modelName.value}\r\n
\r\n\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default class StepUnitType extends Step {\r\n\r\n shouldComponentUpdate(nextProps, nextState) {\r\n return nextProps.model.__version !== this.props.model.__version\r\n }\r\n\r\n renderBody(model) {\r\n if (model.unitType === null) {\r\n return ({__(props.title)}
\r\n \r\n {props.children}\r\n
\r\n \r\n \r\n {this.renderFieldv2(this.fields.productType)}\r\n \r\n\r\n {(!isCustom && this.fields.systemSetup.visible) &&\r\n \r\n {this.renderFieldv2(this.fields.systemSetup)}\r\n }\r\n\r\n {!isCustom && model.unitType.heatingSectionCount.visible && model.unitType.heatingSectionCount.items.length > 0 ? (\r\n \r\n \r\n ) : ''}\r\n\r\n {false && \r\n }\r\n
\r\n\r\n\r\n {\r\n twsEnabled && model.unitType.needsCalculation.visible && \r\n {this.renderFieldv2(this.fields.isFloorstanding)}\r\n
\r\n \r\n
\r\n \r\n {this.renderFieldv2(this.fields.heatingSectionCount)}\r\n
\r\n \r\n {this.renderFieldv2(this.fields.energyMeter)}\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n }\r\n {needsCalculation.primaryTankUnitCapacity.value &&\r\n \r\n
\r\n\r\n\r\n \r\n\r\n
\r\n \r\n
\r\n \r\n {this.fields.application.label}
\r\n \r\n {this.renderFieldv2(this.fields.application)}\r\n \r\n
\r\n {__('General settings')}
\r\n\r\n \r\n {__('Proposed configurations')}
\r\n | {__('Power')} [kW] | \r\n{__('Storage')} [l] | \r\n{__('Operating mode')} | \r\n{__('Load time')} | \r\n\r\n {/* | Load time with recycling flow rate | */}\r\n {/*Load time without recycling flow rate | */}\r\n
|---|
\r\n
\r\n }\r\n {\r\n this.fields.diagram.value.svgDiagram &&\r\n {__('Primary tank')}
\r\n\r\n \r\n\r\n
\r\n \r\n {needsCalculation.primaryTankUnitCapacity.label} {needsCalculation.primaryTankUnitCapacity.value} {needsCalculation.primaryTankUnitCapacity.unit}\r\n
\r\n \r\n
\r\n \r\n {needsCalculation.primaryTankPrimaryStorage.label} {needsCalculation.primaryTankPrimaryStorage.value} {needsCalculation.primaryTankPrimaryStorage.unit}\r\n
\r\n \r\n
\r\n }\r\n \r\n \r\n {__('Needs curve')}
\r\n\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n\r\n | \r\n | {__('Temperature')} | \r\n{__('Pressure')} | \r\n{__('PN')} | \r\n
|---|
\r\n
\r\n \r\n {__('Differential Pressure')}
\r\n \r\n
\r\n \r\n
\r\n\r\n {__('Min.')}
\r\n \r\n {this.renderFieldv2(this.fields.minDifferentialPressure)}\r\n {this.fields.minDifferentialPressure.unit}\r\n
\r\n \r\n
\r\n {__('Max.')}
\r\n \r\n {this.renderFieldv2(this.fields.maxDifferentialPressure)}\r\n {this.fields.maxDifferentialPressure.unit}\r\n
\r\n \r\n {this.props.warning ? (\r\n \r\n \r\n \r\n ) : ''}\r\n\r\n \r\n {this.state.editing ? (\r\n \r\n ) : (\r\n this.props.row.text || this.props.text\r\n )}\r\n \r\n\r\n {this.props.allowEdit ? (\r\n \r\n {this.state.editing ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n ) : ''}\r\n
\r\n \r\n {this.props.step.renderFieldv2(x)}\r\n {x.unit}\r\n
\r\n ) : \r\n {this.props.renderGenericHorizontalField(this.props.fields.connectionTypeDN)}\r\n {this.props.renderGenericHorizontalField(this.props.fields.nonReturnValveHeatingSupply)}\r\n {this.props.renderGenericHorizontalField(this.props.fields.nonReturnValveHPReturn)}\r\n
\r\n \r\n {this.props.renderGenericHorizontalField(this.props.fields.threeWayValveManufacturer)}\r\n {this.props.renderGenericHorizontalField(this.props.fields.threeWayValveSize)}\r\n {this.props.renderGenericHorizontalField(this.props.fields.threeWayValve)}\r\n {this.props.renderGenericHorizontalField(this.props.fields.balancingValveHPSupply)}\r\n {this.props.renderGenericHorizontalField(this.props.fields.separateHeatExchanger)}\r\n
\r\n \r\n {__(this.getLabel())}\r\n {this.props.visible && (\r\n
\r\n )\r\n }\r\n}","export default function doesAnyFieldHaveIssue(fields) {\r\n return fields.filter(x => typeof x.warning !== 'undefined').length > 0;\r\n}","export function GetPumpLiftingHeightTips(model) {\r\n if (model.pumpLiftingHeight.visible === true && model.pumpLiftingHeight.value !== null) {\r\n if (model.pumpFlow.value === null) {\r\n return [`${__('Lifting height')}: ${model.pumpLiftingHeight.value} ${model.pumpLiftingHeight.unit}`]\r\n } else {\r\n return [`${__('Lifting height')}: ${model.pumpLiftingHeight.value} ${model.pumpLiftingHeight.unit} ${(__('at'))} ${model.pumpFlow.value} ${model.pumpFlow.unit}`]\r\n }\r\n }\r\n}","export function hideSummary(summary, items) {\r\n if (items.visible) {\r\n $(summary).css('opacity', 0)\r\n }\r\n}","const ColumnEditable = class ColumnEditable {\r\n isEditable = (row, column, canAddAndEditRows) => {\r\n if (row.isRemoved) {\r\n return false;\r\n }\r\n\r\n if (row.isFromModel) {\r\n let notEdited = ['quantity', 'modulenumber', 'description', 'block', 'factorycost', 'totalfactorycost', 'final', 'margin', 'marginpercentage', 'price'];\r\n return !notEdited.includes(column.slug.toLowerCase()) && !column.readonly;\r\n }\r\n\r\n return !column.readonly || (canAddAndEditRows && (column.slug.toLowerCase() == 'price' || column.slug.toLowerCase() === 'factorycost'));\r\n }\r\n}\r\n\r\nexport default new ColumnEditable()","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport PricingTableRow from './PricingTableRow';\r\nimport APIServicesRegistry from '@lib/api-services/APIServicesRegistry';\r\nimport ConfigurationAPIService from '@lib/api-services/ConfigurationAPIService';\r\n\r\nexport default class PricingTable extends React.Component {\r\n\r\n _isMounted = false;\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.state = {\r\n modulesOptions: [],\r\n selectedRowId: null,\r\n };\r\n scheduleAtDocumentReady(() => {\r\n this.configurationAPIService = APIServicesRegistry.getService(ConfigurationAPIService);\r\n })\r\n\r\n this.tableRefs = React.createRef();\r\n this.pricingTableRowRef = React.createRef();\r\n }\r\n\r\n componentDidMount() {\r\n this.editorStepPricing = document.getElementsByClassName(this.props.stepClassName)[0]\r\n }\r\n\r\n UNSAFE_componentWillMount() {\r\n this._isMounted = true;\r\n document.body.addEventListener('click', this.handleClick.bind(this));\r\n }\r\n\r\n componentWillUnmount() {\r\n this._isMounted = false;\r\n document.body.removeEventListener('click', this.handleClick.bind(this));\r\n }\r\n\r\n handleClick(event) {\r\n if (!this._isMounted) {\r\n return;\r\n }\r\n\r\n if (event.target.id == \"add-module\") {\r\n this.setState({selectedRowId: this.props.rows.length})\r\n return;\r\n }\r\n if (this.tableRefs.current && this.tableRefs.current.contains(event.target) == false)\r\n this.setState({selectedRowId: null})\r\n\r\n }\r\n\r\n static propTypes = {\r\n columns: PropTypes.array.isRequired,\r\n rows: PropTypes.array.isRequired,\r\n onRowColumnChange: PropTypes.func\r\n }\r\n\r\n static defaultProps = {\r\n onRowColumnChange: () => {\r\n }\r\n }\r\n\r\n getModulesByModuleNumber = (value, callback) => {\r\n this.configurationAPIService.getModulesByModuleNumber({\r\n number: value,\r\n marketSymbol: this.props.marketSymbol,\r\n productSymbol: this.props.productTypeSymbol\r\n }).then(response => {\r\n let res = response.data;\r\n callback(res);\r\n })\r\n }\r\n\r\n getModulesByDescription = (value, callback) => {\r\n this.configurationAPIService.getModuleNumbersByDescription({\r\n description: value,\r\n marketSymbol: this.props.marketSymbol,\r\n productSymbol: this.props.productTypeSymbol\r\n }).then(response => {\r\n let res = response.data;\r\n callback(res);\r\n })\r\n }\r\n\r\n render() {\r\n const {columns, rows, canAddAndEditRows} = this.props;\r\n\r\n return (\r\n \r\n {this.props.renderGenericHorizontalField(this.props.fields.singleTwin, {className: 'pump-additional-filter'})}\r\n {this.props.renderGenericHorizontalField(this.props.fields.adjustable, {className: 'pump-additional-filter'})}\r\n {this.props.renderGenericHorizontalField(this.props.fields.dryMotor, {className: 'pump-additional-filter'})}\r\n {this.props.renderGenericHorizontalField(this.props.fields.powerSupply, {className: 'pump-additional-filter'})}\r\n {this.props.renderGenericHorizontalField(this.props.fields.pumpDPE, {className: 'pump-additional-filter'})}\r\n
)}\r\n \r\n \r\n \r\n
\r\n
\r\n )\r\n }\r\n\r\n renderHeaderColumn = column => {\r\n if (column.isNumeric) {\r\n return | # | \r\n {columns.map(this.renderHeaderColumn)}\r\n {canAddAndEditRows &&}\r\n |
|---|
{option.moduleNumber}
\r\n {option.description}
\r\n \r\n
\r\n );\r\n }\r\n\r\n renderDescriptionAutoComplete(column, value) {\r\n let options = this.state.descriptionOptions;\r\n return (\r\n \r\n
\r\n\r\n );\r\n }\r\n\r\n renderEditableColumn(column, value) {\r\n if (column.slug === \"ModuleNumber\")\r\n return this.renderModuleNumberAutoComplete(column, value);\r\n\r\n if (column.slug === \"Description\")\r\n return this.renderDescriptionAutoComplete(column, value);\r\n\r\n let attrs = {};\r\n if (this.isColumnNumeric(column)) {\r\n attrs.pattern = \"[-1-9]+([,\\.][0-9]+)?\";\r\n }\r\n\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n \r\n {value}.\r\n
\r\n )}\r\n \r\n ) : (\r\n this.isColumnEditable(column) && this.rowHasFocus() ? this.renderEditableColumn(column, value) : this.renderValueColumn(column, value)\r\n\r\n )}\r\n \r\n
\r\n )\r\n }\r\n\r\n renderValueColumn(column, value) {\r\n let priceColumns = this.priceColumns;\r\n return (\r\n\r\n \r\n {model.discountedTotal.visible &&
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport ExpandableContainer from '../ExpandableContainer';\r\nimport * as Row from '../../../layout/Row';\r\n\r\nexport default class SummaryControllerSection extends React.Component {\r\n fallback = '-'\r\n\r\n render() {\r\n\r\n if (this.props.model.unitType.isCustomLogic.value)\r\n return (\r\n {__('Total PPL')}\r\n {model.discountedTotal.value}\r\n
}\r\n\r\n {model.factoryTotal.visible && \r\n {__('Total factory cost')}\r\n {model.factoryTotal.value}\r\n
}\r\n\r\n {model.totalMargin.visible && \r\n {__('Total margin')}\r\n {model.totalMargin.value}\r\n
}\r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n\r\n \r\n {this.props.model.unitType.isMaxiCompactLogic.value &&\r\n {this.renderOtherCombibox()} }\r\n \r\n
\r\n \r\n {this.renderTableContainer('General', content)}\r\n
\r\n\r\n \r\n {this.renderTemperatureSensors()}\r\n
\r\n \r\n {this.renderOther()}\r\n
\r\n\r\n \r\n {this.renderThermometerSensors()}\r\n
\r\n \r\n
\r\n {__(title)}
\r\n \r\n \r\n {content}\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | {__('Category')} | \r\n{__('Points')} | \r\n
|---|---|
| {c.category} | \r\n{c.currentPoints} / {c.maximumPoints} | \r\n
\r\n \r\n {this.props.model.ees.label}\r\n \r\n {this.props.model.ees.currentPoints} / {this.props.model.ees.maximumPoints}\r\n
\r\n \r\n \r\n \r\n \r\n {this.renderNumberOfPlates()}\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 renderNumberOfPlates = () => {\r\n let numberOfPlates = this.props.heatingModel.heatExchangerNumberOfPlates\r\n if (typeof numberOfPlates === 'undefined' || numberOfPlates === null) {\r\n return {__('Heat exchanger')}
\r\n \r\n
\r\n {__('Model')}
\r\n {this.props.heatingModel.heatExchangerName.value}
\r\n \r\n
\r\n {__('Capacity')}
\r\n {this.props.heatingModel.capacity.value} {this.props.heatingModel.capacity.unit}
\r\n \r\n
\r\n {__('Number of plates')}
\r\n {this.props.heatingModel.heatExchangerNumberOfPlates}
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderPump() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n return (\r\n {__('Heating output')}
\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n | {__('Primary')} | \r\n{__('Secondary')} | \r\n{__('Unit')} | \r\n
|---|
\r\n
\r\n )\r\n }\r\n\r\n renderPumpWorkingConditions() {\r\n const heatingModel = this.props.heatingModel\r\n const renderRows = () => {\r\n let results = []\r\n\r\n if (this.isFieldAvailable(heatingModel.requiredLiftingHeight)) {\r\n results.push({\r\n label: __('Lifting height'),\r\n value: heatingModel.requiredLiftingHeight.value + ' ' + heatingModel.requiredLiftingHeight.unit\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.pumpLiftingHeight)) {\r\n results.push({\r\n label: __('Max lifting height'),\r\n value: heatingModel.pumpLiftingHeight.value + ' ' + heatingModel.pumpLiftingHeight.unit\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.pumpVoltage)) {\r\n results.push({\r\n label: heatingModel.pumpVoltage.label,\r\n value: heatingModel.pumpVoltage.value + ' ' + heatingModel.pumpVoltage.unit\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.maxPower)) {\r\n results.push({\r\n label: heatingModel.maxPower.label,\r\n value: heatingModel.maxPower.value + ' ' + heatingModel.maxPower.unit\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.maxCurrent)) {\r\n results.push({\r\n label: heatingModel.maxCurrent.label,\r\n value: heatingModel.maxCurrent.value + ' ' + heatingModel.maxCurrent.unit\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.pumpFlow)) {\r\n results.push({\r\n label: heatingModel.pumpFlow.label,\r\n value: heatingModel.pumpFlow.value + ' ' + heatingModel.pumpFlow.unit\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.pumpAddOn)) {\r\n results.push({\r\n label: heatingModel.pumpAddOn.label,\r\n value: this.getFieldValue(heatingModel.pumpAddOn)\r\n })\r\n }\r\n\r\n results = results.map((r, idx) => (\r\n {__('Pump')}
\r\n \r\n \r\n {this.isFieldAvailable(heatingModel.pumpManufacturer) && (\r\n \r\n \r\n )}\r\n\r\n {this.isFieldAvailable(heatingModel.pump) && (\r\n \r\n \r\n )}\r\n \r\n
\r\n \r\n
\r\n {__('Manufacturer')}
\r\n {this.getFieldValue(heatingModel.pumpManufacturer)}
\r\n \r\n
\r\n {__('Model')}
\r\n {this.getFieldValue(heatingModel.pump)}
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderSecondarySideComponents() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n const leftRowsResults = () => {\r\n let results = []\r\n\r\n if (this.isFieldAvailable(heatingModel.secondaryPipeSize)) {\r\n results.push({\r\n label: heatingModel.secondaryPipeSize.label + \" / \" + __('Connection type'),\r\n value: (\"DN\" + this.getFieldValue(heatingModel.secondaryPipeDN) + \" / \" + this.getFieldValue(heatingModel.secondaryPipeSize))\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.circulationValve)) {\r\n results.push({\r\n label: heatingModel.circulationValve.label,\r\n value: this.getFieldValue(heatingModel.circulationValve)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.coldWaterMeter)) {\r\n results.push({\r\n label: heatingModel.coldWaterMeter.label,\r\n value: this.getFieldValue(heatingModel.coldWaterMeter)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.valveSupply)) {\r\n results.push({\r\n label: heatingModel.valveSupply.label,\r\n value: this.getFieldValue(heatingModel.valveSupply)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.filling)) {\r\n results.push({\r\n label: heatingModel.filling.label,\r\n value: this.getFieldValue(heatingModel.filling)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.deaerator)) {\r\n results.push({\r\n label: heatingModel.deaerator.label,\r\n value: this.getFieldValue(heatingModel.deaerator)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.vacuumDGSR)) {\r\n results.push({\r\n label: heatingModel.vacuumDGSR.label,\r\n value: this.getFieldValue(heatingModel.vacuumDGSR)\r\n })\r\n }\r\n\r\n return results\r\n }\r\n\r\n const rightRowsResults = () => {\r\n let results = []\r\n\r\n if (this.isFieldAvailable(heatingModel.circulationPipeDN)) {\r\n results.push({\r\n label: __('Circulation pipe size') + \" / \" + __('Connection type'),\r\n value: (\"DN\" + this.getFieldValue(heatingModel.circulationPipeDN) + \" / \" + this.getFieldValue(heatingModel.circulationPipeSize))\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.safetyValve)) {\r\n results.push({\r\n label: heatingModel.safetyValve.label,\r\n value: this.getFieldValue(heatingModel.safetyValve)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.coldWaterStrainer)) {\r\n results.push({\r\n label: heatingModel.coldWaterStrainer.label,\r\n value: this.getFieldValue(heatingModel.coldWaterStrainer)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.dhWcStrainer)) {\r\n results.push({\r\n label: heatingModel.dhWcStrainer.label,\r\n value: this.getFieldValue(heatingModel.dhWcStrainer)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.strainerOption)) {\r\n results.push({\r\n label: heatingModel.strainerOption.label,\r\n value: this.getFieldValue(heatingModel.strainerOption)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.manometer)) {\r\n results.push({\r\n label: heatingModel.manometer.label,\r\n value: this.getFieldValue(heatingModel.manometer)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.serviceBypass)) {\r\n results.push({\r\n label: heatingModel.serviceBypass.label,\r\n value: this.getFieldValue(heatingModel.serviceBypass)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.ThermostaticSafetyMixingValve)) {\r\n results.push({\r\n label: heatingModel.ThermostaticSafetyMixingValve.label,\r\n value: this.getFieldValue(heatingModel.ThermostaticSafetyMixingValve)\r\n })\r\n }\r\n\r\n return results\r\n }\r\n\r\n const renderLeftRows = () => {\r\n let results = leftRowsResults()\r\n if (results.length) {\r\n return (\r\n {__('Pump working conditions')}
\r\n \r\n \r\n \r\n {renderRows()}\r\n \r\n
\r\n
\r\n \r\n
\r\n )\r\n }\r\n return \r\n \r\n \r\n {transformResults(results)}\r\n \r\n
\r\n
\r\n \r\n
\r\n )\r\n }\r\n return \r\n \r\n \r\n {transformResults(results)}\r\n \r\n
\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n isPumpAvailable() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n return (\r\n this.isFieldAvailable(heatingModel.pumpManufacturer) &&\r\n this.isFieldAvailable(heatingModel.pump)\r\n )\r\n }\r\n\r\n isSecondarySideComponentsAvailable() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n return (\r\n this.isFieldAvailable(heatingModel.filling) ||\r\n this.isFieldAvailable(heatingModel.pressureMetering) ||\r\n this.isFieldAvailable(heatingModel.safetyValve) ||\r\n this.isFieldAvailable(heatingModel.primaryPipeSize) ||\r\n this.isFieldAvailable(heatingModel.deaerator)\r\n )\r\n }\r\n\r\n isFieldAvailable = x => (typeof x !== 'undefined' && x.value && x.visible)\r\n\r\n getFieldValue(field) {\r\n if (field.items) {\r\n let val = field.items.find(x => x.value === field.value)\r\n if (typeof val === 'object') {\r\n return val.text\r\n }\r\n }\r\n\r\n return field.value\r\n }\r\n}\r\n","import React from 'react';\r\nimport ExpandableContainer from '../ExpandableContainer';\r\nimport * as Row from '../../../layout/Row';\r\n\r\nexport default class SummaryHeatingTWS extends React.Component {\r\n render() {\r\n const heatExchangerOutput = this.props.heatingModel.heatExchangerOutput || []\r\n const hasHeatExchangerOutput = heatExchangerOutput.length > 0\r\n\r\n return (\r\n {__('Secondary side components')}
\r\n \r\n \r\n {renderLeftRows()}\r\n {renderRightRows()}\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 renderOutputData(output) {\r\n const renderRows = () => {\r\n let result = []\r\n\r\n for (let row of output) {\r\n result.push(\r\n {__('Heat exchanger')}
\r\n \r\n
\r\n {__('Model')}
\r\n {heatExchangerName}
\r\n \r\n
\r\n {__('Capacity')}
\r\n {this.props.heatingModel.capacity.value} {this.props.heatingModel.capacity.unit}
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderTanks() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n let results = []\r\n if (this.isFieldAvailable(heatingModel.tank)) {\r\n results.push({\r\n label: heatingModel.tank.label,\r\n value: this.getFieldValue(heatingModel.tank)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.tankInsulation)) {\r\n results.push({\r\n label: heatingModel.tankInsulation.label,\r\n value: this.getFieldValue(heatingModel.tankInsulation)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.tankHeater)) {\r\n results.push({\r\n label: heatingModel.tankHeater.label,\r\n value: this.getFieldValue(heatingModel.tankHeater)\r\n })\r\n }\r\n\r\n return (\r\n {__('Heating output')}
\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n | {__('Primary')} | \r\n{__('Secondary')} | \r\n{__('Unit')} | \r\n
|---|
\r\n
\r\n )\r\n }\r\n\r\n renderSecondarySideComponents() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n let results = []\r\n if (this.isFieldAvailable(heatingModel.controlValve)) {\r\n results.push({\r\n label: heatingModel.controlValve.label,\r\n value: this.getFieldValue(heatingModel.controlValve)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.primaryActuator)) {\r\n results.push({\r\n label: heatingModel.primaryActuator.label,\r\n value: this.getFieldValue(heatingModel.primaryActuator)\r\n })\r\n }\r\n\r\n if (this.isFieldAvailable(heatingModel.secondaryActuator)) {\r\n results.push({\r\n label: heatingModel.secondaryActuator.label,\r\n value: this.getFieldValue(heatingModel.secondaryActuator)\r\n })\r\n }\r\n\r\n return (\r\n {__('Tanks')}
\r\n \r\n
\r\n \r\n \r\n \r\n {results.map((r, idx) => (\r\n
\r\n
\r\n | {r.label} | \r\n{this.getFieldValue(r)} | \r\n
\r\n
\r\n )\r\n }\r\n\r\n isTanksAvailable() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n return (\r\n this.isFieldAvailable(heatingModel.tank) ||\r\n this.isFieldAvailable(heatingModel.tankInsulation) ||\r\n this.isFieldAvailable(heatingModel.tankHeater)\r\n )\r\n }\r\n\r\n isSecondarySideComponentsAvailable() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n return (\r\n this.isFieldAvailable(heatingModel.controlValve) ||\r\n this.isFieldAvailable(heatingModel.primaryActuator) ||\r\n this.isFieldAvailable(heatingModel.secondaryActuator)\r\n )\r\n }\r\n\r\n isPumpAvailable() {\r\n const heatingModel = this.props.heatingModel\r\n\r\n return (\r\n this.isFieldAvailable(heatingModel.primaryPump) ||\r\n this.isFieldAvailable(heatingModel.secondaryPump) ||\r\n this.isFieldAvailable(heatingModel.circulationPump)\r\n )\r\n }\r\n\r\n isFieldAvailable = x => (typeof x !== 'undefined' && x.value && x.visible)\r\n\r\n getFieldValue(field) {\r\n if (field.items) {\r\n let val = field.items.find(x => x.value === field.value)\r\n if (typeof val === 'object') {\r\n return val.text\r\n }\r\n }\r\n\r\n return field.value\r\n }\r\n\r\n renderPumps() {\r\n const data = [this.props.heatingModel.primaryPumpData, this.props.heatingModel.secondaryPumpData, this.props.heatingModel.circulationPumpData].filter(x => x.visible);\r\n const renderLabel = prop => {__('Secondary side components')}
\r\n \r\n
\r\n \r\n \r\n \r\n {results.map((r, idx) => (\r\n
\r\n
\r\n | {r.label} | \r\n{this.getFieldValue(r)} | \r\n
\r\n
\r\n {__(title)}
\r\n \r\n \r\n {content}\r\n
\r\n
\r\n \r\n
\r\n )}\r\n\r\n {this.props.model.optionsAndAccessories.iqHeatCloud.value && (\r\n {this.props.model.optionsAndAccessories.commisioning.label}
\r\n {this.getFieldValue(this.props.model.optionsAndAccessories.commisioning)}
\r\n \r\n
\r\n )}\r\n\r\n {this.props.model.optionsAndAccessories.pipeInsulation.value && (\r\n {this.props.model.optionsAndAccessories.iqHeatCloud.label}
\r\n {this.getFieldValue(this.props.model.optionsAndAccessories.iqHeatCloud)}
\r\n \r\n
\r\n )}\r\n\r\n {isAnyPumpAddOnAvailable() && (\r\n {this.props.model.optionsAndAccessories.pipeInsulation.label}
\r\n {this.getFieldValue(this.props.model.optionsAndAccessories.pipeInsulation)}
\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n {__('Pump add on')}
\r\n \r\n \r\n \r\n
\r\n
\r\n | {this.props.model.heating1.name.value} | )}\r\n {hasHeating2 && (\r\n{this.props.model.heating2.name.value} | )}\r\n {hasHeating3 && (\r\n{this.props.model.heating3.name.value} | )}\r\n {hasDHW && ({this.props.model.dhw.name.value} | )}\r\n
|---|---|---|---|
| {this.getFieldValue(this.props.model.heating1.pumpAddOn)} | )}\r\n {hasHeating2 && (\r\n{this.getFieldValue(this.props.model.heating2.pumpAddOn)} | )}\r\n {hasHeating3 && (\r\n{this.getFieldValue(this.props.model.heating3.pumpAddOn)} | )}\r\n {hasDHW && (\r\n{this.getFieldValue(this.props.model.dhw.pumpAddOn)} | )}\r\n
| # | \r\n {columns.map(column => (\r\n{column.name} | \r\n ))}\r\n
|---|---|
| \r\n {idx + 1}.\r\n | \r\n\r\n {columns.map((column, idx) => (\r\n{this.renderCell(item, column)} | \r\n ))}\r\n
\r\n
\r\n \r\n
\r\n {__('Other components')}
\r\n \r\n {this.renderSimpleField(this.props.model.primarySideEquipment.dhStrainer)}\r\n {this.renderSimpleField(this.props.model.primarySideEquipment.pressureMetering)}\r\n {this.renderSimpleField(this.props.model.primarySideEquipment.thermometerPrimarySupply)}\r\n {this.renderSimpleField(this.props.model.primarySideEquipment.thermometerPrimaryReturn)}\r\n {this.renderSimpleField(this.props.model.primarySideEquipment.dhFlowRetShutOff)}\r\n {this.renderSimpleField(this.props.model.primarySideEquipment.primaryOutPipeEMS)}\r\n {this.renderSimpleField(this.props.model.primarySideEquipment.energyMeter)}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n renderHeating(label, model) {\r\n const forLoop = (i, fn) => {\r\n let results = []\r\n for (let j = 0; j < i; j++) {\r\n results.push(fn(j))\r\n }\r\n return results\r\n }\r\n\r\n const hasCV = propertyName => model['cV1'] && model['cV1'][propertyName].visible\r\n\r\n return (\r\n {__('Control valves')}
\r\n \r\n {this.renderSimpleField(pseModel.primaryMainPipeSize)}\r\n {this.renderSimpleField(pseModel.controlValveManufacturer)}\r\n
\r\n \r\n
\r\n\r\n )\r\n }\r\n\r\n renderSimpleField(field) {\r\n if (typeof field.value === 'undefined' || field.value === null) {\r\n return {label}
\r\n {this.renderSimpleField(model.availableDP)}\r\n {this.renderSimpleField(model.neededKVS)}\r\n\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n\r\n | \r\n {forLoop(model.numberOfControlValves.value, idx => (\r\n | {__('CV' + (idx + 1))} | ))}\r\n{__('Unit')} | \r\n
|---|---|---|
| {model[`cV1`].controlValve.label}\r\n | \r\n {forLoop(model.numberOfControlValves.value, idx => ({model[`cV${idx + 1}`] && this.getFieldValue(model[`cV${idx + 1}`].controlValve)} | ))}\r\n\r\n |
| {model[`cV1`].controlValvePICV.label}\r\n | \r\n {forLoop(model.numberOfControlValves.value, idx => ({model[`cV${idx + 1}`] && this.getFieldValue(model[`cV${idx + 1}`].controlValvePICV)} | ))}\r\n\r\n |
| {model[`cV1`].kvs.label}\r\n | \r\n {forLoop(model.numberOfControlValves.value, idx => ({model[`cV${idx + 1}`] && this.getFieldValue(model[`cV${idx + 1}`].kvs)} | ))}\r\n\r\n |
| {model[`cV1`].dn.label}\r\n | \r\n {forLoop(model.numberOfControlValves.value, idx => ({model[`cV${idx + 1}`] && this.getFieldValue(model[`cV${idx + 1}`].dn)} | ))}\r\n\r\n |
| {model.cvFlow.label} | \r\n{this.getFieldValue(model.cvFlow)} | \r\n{model.cvFlow.unit} | \r\n
| {model.totalKVS.label} | \r\n{this.getFieldValue(model.totalKVS)} | \r\n\r\n |
| {model.controlValvePressureDrop.label} | \r\n{this.getFieldValue(model.controlValvePressureDrop)} | \r\n{model.controlValvePressureDrop.unit} | \r\n
| {model[`cV1`].actuatorType.label} | \r\n {forLoop(model.numberOfControlValves.value, idx => ({model[`cV${idx + 1}`] && this.getFieldValue(model[`cV${idx + 1}`].actuatorType)} | ))}\r\n\r\n |
| {model[`cV1`].actuatorControlSignal.label} | \r\n {forLoop(model.numberOfControlValves.value, idx => ({model[`cV${idx + 1}`] && this.getFieldValue(model[`cV${idx + 1}`].actuatorControlSignal)} | ))}\r\n\r\n |
\r\n
\r\n )\r\n }\r\n\r\n getFieldValue(field) {\r\n if (field.items) {\r\n let val = field.items.find(x => x.value === field.value)\r\n if (typeof val === 'object') {\r\n return val.text\r\n }\r\n }\r\n\r\n return field.value\r\n }\r\n}","import React from 'react';\r\nimport ExpandableContainer from '../ExpandableContainer';\r\nimport * as Row from '../../../layout/Row';\r\n\r\nexport default class SummaryUnitTypeSection extends React.Component {\r\n render() {\r\n return (\r\n {field.label}
\r\n {this.getFieldValue(field)} {field.unit}
\r\n {this.renderGeneralInformation()}
\r\n\r\n \r\n
\r\n )\r\n }\r\n\r\n renderDesignData() {\r\n const model = this.props.model\r\n\r\n const hasHeating1DesignData = typeof model.heating1 !== 'undefined'\r\n const hasHeating2DesignData = typeof model.heating2 !== 'undefined'\r\n const hasHeating3DesignData = typeof model.heating3 !== 'undefined'\r\n const hasDHWDesignData = typeof model.dhw !== 'undefined'\r\n const hasDesignData = typeof model.unitType.design !== 'undefined'\r\n\r\n const renderRow = (label, design) => (\r\n {__('General information')}
\r\n \r\n \r\n \r\n
\r\n
\r\n | {__('Model')} | \r\n{selectedModel.text} | \r\n
| {__('Setup')} | \r\n{selectedSetup.text} | \r\n
| {__('Options')} | \r\n{unitTypeModel.energyMeter.value && 'Energy meter'} | \r\n
\r\n
\r\n )\r\n }\r\n\r\n renderThumbnail() {\r\n\r\n }\r\n\r\n renderDifferentialPressure() {\r\n return (\r\n {__('Design data')}
\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n | {__('Temperature')} | \r\n{__('Pressure')} | \r\n{__('PN')} | \r\n
|---|
\r\n
\r\n )\r\n }\r\n}","import React from \"react\";\r\nimport Field from \"@lib/model/configurator/Field\";\r\n\r\nexport default class Apartment extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.step = this.props.step;\r\n this.renderField = this.props.renderFieldv2;\r\n }\r\n\r\n render() {\r\n return (\r\n {__('Differential pressure')}
\r\n \r\n {this.props.model.unitType.minDifferentialPressure.value} - {this.props.model.unitType.maxDifferentialPressure.value} {this.props.model.unitType.maxDifferentialPressure.unit}\r\n
\r\n \r\n
\r\n\r\n \r\n {this.renderField(\"t1Studio\")}\r\n {this.renderField(\"t1\")}\r\n {this.renderField(\"t2\")}\r\n {this.renderField(\"t3\")}\r\n {this.renderField(\"t4\")}\r\n {this.renderField(\"t5\")}\r\n {this.renderField(\"t6\")}\r\n
\r\n \r\n {this.renderField(\"park\")}\r\n {this.renderField(\"standing\")}\r\n {this.renderField(\"situation\")}\r\n
\r\n \r\n
\r\n \r\n {this.renderField(\"tdhw\")}\r\n {this.renderField(\"tcw\")}\r\n
\r\n \r\n {this.renderField(\"maxChargingTime\")}\r\n {this.renderField(\"primaryTank\")}\r\n {this.renderField(\"aquaEfficiency\", false)}\r\n
\r\n \r\n
\r\n )\r\n }\r\n}\r\n","import * as React from 'react';\r\n\r\n\r\nexport default class NeedsCalculationGraph extends React.Component {\r\n svgElement;\r\n tooltipElement;\r\n\r\n componentDidUpdate() {\r\n this.initialize();\r\n }\r\n\r\n componentDidMount() {\r\n this.initialize();\r\n }\r\n\r\n initialize() {\r\n this.svgElement.addEventListener('mousemove', this.handleGraphMouseMove);\r\n this.svgElement.querySelectorAll('[data-point]').forEach(pointNode => {\r\n pointNode.addEventListener('mouseenter', () => this.handlePointMouseEnter(pointNode));\r\n pointNode.addEventListener('mouseleave', () => this.handlePointMouseLeave(pointNode));\r\n });\r\n }\r\n\r\n handlePointMouseEnter(point) {\r\n if (this.tooltipElement) {\r\n\r\n this.tooltipElement.innerHTML = `\r\n \r\n {includeLabel && {field.label} }\r\n
\r\n \r\n {this.renderFieldv2(field)}\r\n {field.unit}\r\n
\r\n ${point.dataset.label}
\r\n ${point.dataset.x} ${this.props.metaData.bottomAxis.unit}
\r\n ${point.dataset.y} ${this.props.metaData.leftAxis.unit}
`;\r\n\r\n this.tooltipElement.style.opacity = '1';\r\n }\r\n }\r\n\r\n handlePointMouseLeave(point) {\r\n if (this.tooltipElement) {\r\n this.tooltipElement.style.opacity = '0';\r\n }\r\n }\r\n\r\n handleGraphMouseMove = (event) => {\r\n if (this.tooltipElement) {\r\n const tooltipRect = this.tooltipElement.getBoundingClientRect();\r\n\r\n this.tooltipElement.style.left = (event.offsetX - (tooltipRect.width / 2)) + 'px';\r\n this.tooltipElement.style.top = (event.offsetY - tooltipRect.height - 20) + 'px';\r\n }\r\n };\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import * as React from 'react';\r\n\r\nexport default class NeedsCalculationRow extends React.Component {\r\n render() {\r\n if (this.props.model) {\r\n return ( this.tooltipElement = e} className=\"needs-calculation-tooltip\">
\r\n this.svgElement = e} dangerouslySetInnerHTML={{__html: this.props.code}}>
\r\n \r\n {this.props.row.number}\r\n
\r\n )\r\n\r\n return super.renderNameColumn(column, value, c);\r\n }\r\n}","import React from 'react'\r\nimport IndexPage from '../index-table/IndexPage'\r\nimport ConfigurationAPIService from '@lib/api-services/ConfigurationAPIService';\r\nimport ConfigurationsAPIService from '@lib/api-services/ConfigurationsAPIService';\r\nimport ConfigurationsIndexTable from '../configurations/ConfigurationsIndexTable'\r\n\r\nclass ConfigurationsIndexPage extends React.Component {\r\n render() {\r\n return (\r\n \r\n {__(name)}\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default new ConfigurationTag()","import React from 'react';\r\nimport Modal from '@lib/components/common/Modal';\r\nimport Button from '../common/Button';\r\nimport CustomerFeedbackAPIService from '@lib/api-services/CustomerFeedbackAPIService';\r\nimport APIServicesRegistry from '@lib/api-services/APIServicesRegistry';\r\nimport Loader from '@lib/components/common/Loader';\r\n\r\nexport default class CustomerFeedback extends React.Component {\r\n state = {\r\n isOpen: false,\r\n isProcessing: false,\r\n subject: '',\r\n body: ''\r\n }\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n scheduleAtDocumentReady(() => {\r\n this.customerFeedbackAPIService = APIServicesRegistry.getService(CustomerFeedbackAPIService);\r\n })\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n this.setIsOpen(false)}>\r\n {__('Give feedback')} \r\n \r\n
this.setIsOpen(true)}>Give feedback\r\n
\r\n \r\n {this.state.isProcessing && }\r\n
\r\n \r\n this.setSubject(e.target.value)} value={this.state.subject}\r\n type=\"text\"/>\r\n
\r\n \r\n \r\n