\r\n {t('back_to_template_wrn')}\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n {currentLanguage?.name ?? ''} \r\n
\r\n \r\n {actions}\r\n
\r\n \r\n );\r\n}\r\n\r\nSideBar.propTypes = {\r\n actions: PropTypes.any,\r\n children: PropTypes.any\r\n}","import SideBar from './side-bar';\r\nexport default SideBar;","import React from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport PropTypes from 'prop-types';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n content: {\r\n flexGrow: 1,\r\n overflow: 'auto',\r\n padding: theme.spacing(1, 0, 2, 2),\r\n marginTop: '64px',\r\n display: 'flex'\r\n }\r\n}));\r\n\r\nexport default function Main(props) {\r\n const classes = useStyles();\r\n\r\n const { children } = props;\r\n return (\r\n \r\n {children}\r\n
\r\n );\r\n}\r\n\r\nMain.propTypes = {\r\n children: PropTypes.any,\r\n}","import Main from './main';\r\nexport default Main;","import React from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport CircularProgress from '@material-ui/core/CircularProgress';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n content: {\r\n display: 'flex',\r\n margin: theme.spacing(1),\r\n justifyContent: 'center',\r\n alignItems:'center'\r\n },\r\n test: {\r\n position: 'fixed',\r\n top: '50%',\r\n left: '50%'\r\n }\r\n}));\r\n\r\nexport default function Progress(props) {\r\n const classes = useStyles()\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nProgress.defaultProps = {\r\n open: false\r\n}","import React from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport CssBaseline from '@material-ui/core/CssBaseline';\r\nimport Header from '../header';\r\nimport SideBar from '../side-bar';\r\nimport Main from '../main';\r\nimport PropTypes from 'prop-types';\r\nimport Progress from '../shared/progress';\r\nimport { MuiThemeProvider, createTheme } from '@material-ui/core/styles';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root: {\r\n display: 'flex',\r\n height: '100vh'\r\n },\r\n content: {\r\n display:'flex'\r\n },\r\n contentLoader: {\r\n width: '100%',\r\n display: 'flex',\r\n justifyContent: 'center',\r\n alignItems:'center'\r\n },\r\n '@global': {\r\n '*': {\r\n 'scrollbar-width': 'thin',\r\n },\r\n '*::-webkit-scrollbar': {\r\n width: '8px',\r\n height: '8px'\r\n },\r\n '*::-webkit-scrollbar-track': {\r\n '-webkit-box-shadow': 'inset 0 0 6px rgba(0,0,0,0.00)'\r\n },\r\n '*:hover': {\r\n '&::-webkit-scrollbar-thumb': {\r\n backgroundColor: '#B9B9B9'\r\n }\r\n },\r\n '*::-webkit-scrollbar-thumb': {\r\n backgroundColor: '#d1d1d1',\r\n borderRadius: '4px',\r\n }\r\n }\r\n}));\r\n\r\nconst theme = createTheme({\r\n palette: {\r\n secondary: {\r\n main: '#a90e11'\r\n }\r\n },\r\n typography: {\r\n body1: {\r\n textOverflow: 'ellipsis',\r\n overflow: 'hidden',\r\n whiteSpace: 'nowrap',\r\n }\r\n }\r\n});\r\n\r\nexport default function Layout(props) {\r\n const classes = useStyles();\r\n\r\n const getLoader = () => {\r\n return \r\n }\r\n\r\n const getContentLoader = () => {\r\n return {getLoader()}
;\r\n }\r\n\r\n const { headerText, actions, children, sideBar, useHomeAlert, useLoader } = props;\r\n return (\r\n \r\n {headerText} \r\n {useLoader ? getLoader() : sideBar} \r\n {useLoader ? getContentLoader() : children} \r\n
\r\n \r\n {t('restore_wrn')}\r\n
\r\n \r\n );\r\n}\r\n\r\nOpenTemplateDialog.propTypes = {\r\n open: PropTypes.bool.isRequired,\r\n setOpen: PropTypes.func.isRequired,\r\n defaultTemplateAction: PropTypes.func.isRequired,\r\n restoreTemplateAction: PropTypes.func.isRequired\r\n}","import OpenTemplateDialog from './open-template-dialog';\r\nexport default OpenTemplateDialog;","import React, { useState } from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport Grid from '@material-ui/core/Grid';\r\nimport { Container } from '@material-ui/core';\r\nimport Box from '@material-ui/core/Box';\r\nimport Typography from '@material-ui/core/Typography';\r\nimport { useHistory } from \"react-router-dom\";\r\nimport PropTypes from 'prop-types';\r\nimport LocalStorage from '../../utils/local-storage';\r\nimport OpenTemplateDialog from '../open-template-dialog';\r\nimport CustomTooltip from '../shared/tooltip';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root: {\r\n flexGrow: 1,\r\n },\r\n templateCard: {\r\n flexGrow: 1,\r\n width: '240px',\r\n height: '240px',\r\n marginBottom: '56px',\r\n opacity: 1,\r\n },\r\n templatePreview: {\r\n opacity: 1,\r\n width: '156px',\r\n height: '220px',\r\n borderRadius: '3px',\r\n border: 'solid 2px white',\r\n backgroundColor: 'white',\r\n '&:hover': {\r\n border: 'solid 2px #a90e11',\r\n borderRadius: '3px',\r\n cursor: 'pointer'\r\n }\r\n },\r\n landscapePreview: {\r\n opacity: 1,\r\n width: '220px',\r\n height: '156px',\r\n borderRadius: '3px',\r\n border: 'solid 2px white',\r\n backgroundColor: 'white',\r\n '&:hover': {\r\n border: 'solid 2px #a90e11',\r\n borderRadius: '3px',\r\n cursor: 'pointer'\r\n }\r\n },\r\n preview: {\r\n width: '220px',\r\n height: '220px',\r\n display: 'flex',\r\n justifyContent: 'center',\r\n alignItems: 'center'\r\n },\r\n templateName: {\r\n width: '208px',\r\n height: '16px',\r\n margin: '4px 0 0',\r\n fontFamily: 'Roboto',\r\n fontSize: '12px',\r\n fontWeight: 'normal',\r\n fontStretch: 'normal',\r\n fontStyle: 'normal',\r\n lineHeight: '1.33',\r\n letterSpacing: 'normal',\r\n textAlign: 'center',\r\n color: '#23303f'\r\n },\r\n thumbnailImg: {\r\n objectFit: 'contain',\r\n width: '100%',\r\n height: '100%'\r\n }\r\n}));\r\n\r\nexport default function TemplateSelectionGrid(props) {\r\n const classes = useStyles();\r\n const [open, setOpen] = useState(false);\r\n const [templateId, setTemplateId] = useState('');\r\n const [templateName, setTemplateName] = useState('');\r\n const { templates, disabledTemplateSelection } = props;\r\n const history = useHistory();\r\n\r\n const openTemplateDialog = async (id, name) => {\r\n if (disabledTemplateSelection)\r\n return;\r\n setTemplateName(name);\r\n setTemplateId(id);\r\n const isExist = await LocalStorage.isTemplateExist(id);\r\n if (isExist) {\r\n const storageTemplate = await LocalStorage.getItem(id);\r\n if (storageTemplate !== null)\r\n setOpen(true);\r\n else\r\n openTemplateById(id, name);\r\n }\r\n else\r\n openTemplateById(id, name);\r\n }\r\n\r\n const openDefaultTemplate = async () => {\r\n await LocalStorage.removeItem(templateId)\r\n openTemplate();\r\n }\r\n\r\n const openTemplateById = (templateId, templateName) => {\r\n history.push(`/template/${templateId}`, { templateId: templateId, templateName: templateName });\r\n }\r\n\r\n const openTemplate = () => {\r\n history.push(`/template/${templateId}`, { templateId: templateId, templateName: templateName });\r\n }\r\n\r\n const getDialogContent = () => {\r\n return \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {template.title}\r\n \r\n \r\n \r\n
\r\n openTemplateDialog(template.id, template.title)}>\r\n 
\r\n
\r\n \r\n {name} \r\n {children}\r\n
\r\n );\r\n}\r\n\r\nFilterBar.propTypes = {\r\n children: PropTypes.object.isRequired,\r\n name: PropTypes.object.isRequired,\r\n}","import FilterBar from './filter-bar';\r\nexport default FilterBar;","import React, { Component } from 'react';\r\nimport UploadConfiguration from '../upload-configuration';\r\nimport Filter from '../filter';\r\nimport Layout from '../layout';\r\nimport TemplateSelectionGrid from '../template-selection-grid';\r\nimport FilterRadio from '../filter-radio';\r\nimport FilterCheckbox from '../filter-checkbox';\r\nimport FilterBar from '../filter-bar';\r\nimport Progress from '../shared/progress';\r\nimport TemplateService from '../../services/template-service';\r\nimport LocalStorage from '../../utils/local-storage';\r\nimport LanguageHelper from '../../utils/language-helper';\r\n\r\nexport default class TemplateSelection extends Component {\r\n static displayName = TemplateSelection.name;\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isPublic: props.isPublic === undefined ? true : props.isPublic,\r\n loading: true,\r\n disabledTemplateSelection: false,\r\n templates: [],\r\n selectedTemplate: {},\r\n machineTypes: [],\r\n solidCamVersions: [],\r\n orientations: [],\r\n selectedMachineType: 0,\r\n selectedVersion: 0,\r\n selectedOrientation: []\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.getAllTemplates();\r\n }\r\n\r\n handleMachineTypeFilter = (value) => {\r\n this.setState({ selectedMachineType: value });\r\n this.setFiltersToLocalStorage('machineType', value);\r\n }\r\n\r\n handleVersionFilter = (value) => {\r\n this.setState({ selectedVersion: value });\r\n this.setFiltersToLocalStorage('version', value);\r\n }\r\n\r\n handleOrientationFilter = (id, checked) => {\r\n const newSelectedOrientation = [...this.state.selectedOrientation.filter(i => i !== id)];\r\n if (checked)\r\n newSelectedOrientation.push(id);\r\n if (newSelectedOrientation.length > 0) {\r\n this.setState({ selectedOrientation: newSelectedOrientation });\r\n this.setFiltersToLocalStorage('orientationType', newSelectedOrientation);\r\n }\r\n }\r\n\r\n setDisableTemplateSelection = (disabled) => {\r\n this.setState({ disabledTemplateSelection: disabled });\r\n }\r\n\r\n contentProgress = () => {\r\n const style = {\r\n display:'flex',\r\n width: '100%',\r\n justifyContent: 'center'\r\n }\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n renderFilter = () => {\r\n const { loading } = this.state;\r\n\r\n const filterContent = () => {\r\n const machineTypes = \r\n \r\n }\r\n label={{t('empty_value')} }\r\n />\r\n \r\n
\r\n )\r\n };\r\n\r\n const renderEditMode = () => {\r\n\r\n return (\r\n \r\n {t('predefined_value')} }\r\n />\r\n \r\n setSelected(e.target.value)}\r\n value={selected}\r\n variant=\"filled\"\r\n disabled={paramType!==0}\r\n >\r\n {parameterItems}\r\n \r\n \r\n
\r\n \r\n }\r\n label={{t('user_defined_value')} }\r\n />\r\n setUserValue(e.target.value)}\r\n value={userValue}\r\n className={classes.formControl}\r\n disabled={paramType !== 1}/>\r\n
\r\n \r\n {contents}\r\n
\r\n ) :\r\n (\r\n \r\n {contents}\r\n
\r\n );\r\n }\r\n\r\n static formatStringToCamelCase = str => {\r\n const splitted = str.split(\"-\");\r\n if (splitted.length === 1) return splitted[0];\r\n return (\r\n splitted[0] +\r\n splitted\r\n .slice(1)\r\n .map(word => word[0].toUpperCase() + word.slice(1))\r\n .join(\"\")\r\n );\r\n };\r\n\r\n static getStyleObjectFromString = str => {\r\n const style = {};\r\n str.split(\";\").forEach(el => {\r\n const [property, value] = el.split(\":\");\r\n if (!property) return;\r\n\r\n const formattedProperty = this.formatStringToCamelCase(property.trim());\r\n style[formattedProperty] = value.trim();\r\n });\r\n\r\n return style;\r\n };\r\n}\r\n\r\nBlockItem.defaultProps = {\r\n parameters: []\r\n}\r\n\r\nBlockItem.propTypes = {\r\n parameters: PropTypes.arrayOf(PropTypes.object),\r\n blockId: PropTypes.string.isRequired,\r\n handleChangeParameterItem: PropTypes.func.isRequired,\r\n parameterMode: PropTypes.number.isRequired,\r\n node: PropTypes.object.isRequired,\r\n sectionLinks: PropTypes.array\r\n}\r\n","import BlockItem from './block-item';\r\nexport default BlockItem;","import React from 'react';\r\nimport BlockItem from '../block-item';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport Paper from '@material-ui/core/Paper';\r\nimport PropTypes from 'prop-types';\r\nimport TextSecondary from '../shared/text-secondary';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n paper: {\r\n marginBottom: theme.spacing(2),\r\n display: 'flex',\r\n flexDirection: 'column',\r\n alignItems: 'center'\r\n },\r\n paperHeader: {\r\n alignSelf: 'flex-end',\r\n },\r\n pageItem: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n alignItems: 'center'\r\n }\r\n}));\r\n\r\nexport default function PageItemPreview(props) {\r\n const classes = useStyles();\r\n\r\n const { pageNumber, pageCount, blocks, settings, parameters, handleChangeParameterItem, parameterMode, sectionLinks} = props;\r\n\r\n const getPageItem = (items) => {\r\n const content =\r\n items.map(item => {\r\n const sectionParams = parameters[item.sectionTypeId];\r\n return \r\n {pageNumber}/{pageCount} \r\n
\r\n \r\n {getPageItem(blocks)}\r\n
\r\n \r\n {[...row]}\r\n
\r\n );\r\n row.splice(0);\r\n }\r\n\r\n }\r\n if (row.length > 0)\r\n multipleContent.push(\r\n \r\n {[...row]}\r\n
\r\n );\r\n return multipleContent;\r\n }\r\n\r\n const getActiveBtnStyle = (isActive) => {\r\n if (isActive)\r\n return { color: 'black' };\r\n return {};\r\n }\r\n\r\n const zoomWrapper = (content) => {\r\n return (\r\n \r\n \r\n \r\n {setCurrentPage(number-1)}}\r\n />\r\n of {count} \r\n \r\n \r\n
\r\n ) : null;\r\n }\r\n\r\n const getZoomPanel = (handlers) => {\r\n const { zoomIn, zoomOut, resetTransform, setTransform } = handlers;\r\n return (\r\n \r\n \r\n customZoom(zoomInScale, zoomIn, setTransform)}>\r\n \r\n \r\n \r\n customZoom(zoomOutScale, zoomOut, setTransform)}>\r\n \r\n \r\n \r\n resetZoomTransform(resetTransform)}>\r\n \r\n \r\n \r\n zoomToFit(setTransform)} style={getActiveBtnStyle(paginationMode)}>\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n const getHomeButton = () => {\r\n return \r\n {t('back_to_template_btn')} \r\n \r\n
;\r\n }\r\n\r\n const getMainPageStyle = () => {\r\n if (paginationMode)\r\n return { overflow: 'hidden' };\r\n return null;\r\n }\r\n\r\n const { showHomeButton } = props;\r\n return (\r\n \r\n {showHomeButton ? getHomeButton() : ''}\r\n
\r\n );\r\n}\r\nPage.defaultProps = {\r\n loading: false,\r\n showHomeButton: true,\r\n paginationDisabled: false,\r\n blocksSize: {},\r\n nodes:[]\r\n}\r\n\r\nPage.propTypes = {\r\n loading: PropTypes.bool,\r\n showHomeButton: PropTypes.bool,\r\n paginationDisabled: PropTypes.bool,\r\n settings: PropTypes.object.isRequired,\r\n pages: PropTypes.array.isRequired,\r\n nodes: PropTypes.array,\r\n blocksSize: PropTypes.any,\r\n parameters: PropTypes.any.isRequired,\r\n handleChangeParameterItem: PropTypes.func.isRequired,\r\n parameterMode: PropTypes.number.isRequired,\r\n}","import Page from './page';\r\nexport default Page;","import React from 'react';\r\nimport CustomCheckbox from '../shared/checkbox';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport TextSecondary from '../shared/text-secondary';\r\nimport PropTypes from 'prop-types';\r\nimport { useTranslation } from 'react-i18next';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n repeatOnEachPage: {\r\n marginLeft: theme.spacing(2)\r\n }\r\n}));\r\n\r\n\r\nexport default function HeaderControl(props) {\r\n const { t } = useTranslation();\r\n const classes = useStyles();\r\n\r\n const renderElements = () => {\r\n const { header, handleRepeatHeader, handleHeaderEnable } = props;\r\n if (!header.headerBlockId)\r\n return;\r\n return (\r\n <>\r\n \r\n {loading ? : zoomWrapper(renderPage())}\r\n
\r\n \r\n {content}\r\n
\r\n );\r\n}\r\n\r\nHeaderControl.propTypes = {\r\n header: PropTypes.object.isRequired,\r\n handleRepeatHeader: PropTypes.func.isRequired,\r\n handleHeaderEnable: PropTypes.func.isRequired\r\n}","import HeaderControl from './header-control';\r\nexport default HeaderControl;","import FooterControl from './footer-control';\r\nexport default FooterControl;","import React from 'react';\r\nimport CustomCheckbox from '../shared/checkbox';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport TextSecondary from '../shared/text-secondary';\r\nimport PropTypes from 'prop-types';\r\nimport { useTranslation } from 'react-i18next';\r\n\r\nexport default function FooterControl (props){\r\n const { t } = useTranslation();\r\n\r\n const renderElements = () => {\r\n const { footer, handleFooterEnable } = props;\r\n if (!footer.footerBlockId)\r\n return;\r\n return (\r\n \r\n {content}\r\n
\r\n );\r\n}\r\n\r\nFooterControl.propTypes = {\r\n footer: PropTypes.object.isRequired,\r\n handleFooterEnable: PropTypes.func.isRequired,\r\n}","import React from 'react';\r\nimport { withStyles } from '@material-ui/core/styles';\r\nimport Typography from '@material-ui/core/Typography';\r\nimport PropTypes from 'prop-types';\r\n\r\nconst styles = {\r\n root: {\r\n fontFamily: 'Roboto',\r\n fontSize: '12px',\r\n fontWeight: 'normal',\r\n fontStretch: 'normal',\r\n fontStyle: 'normal',\r\n lineHeight: 1.33,\r\n letterSpacing: 'normal',\r\n textTransform: 'none',\r\n textDecoration: 'underline',\r\n color: '#a90e11'\r\n }\r\n};\r\n\r\nfunction TextSecondaryButton(props) {\r\n const { classes } = props;\r\n return \r\n {t('reset_btn')} \r\n
\r\n \r\n {t('reset_wrn')}\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nSectionItemControl.propTypes = {\r\n section: PropTypes.object.isRequired,\r\n handleSectionEnable: PropTypes.func,\r\n handleSectionPageBreak: PropTypes.func,\r\n handleSectionForcePageBreak: PropTypes.func,\r\n handleRepeatHeader: PropTypes.func,\r\n handleHeaderEnable: PropTypes.func,\r\n handleFooterEnable: PropTypes.func,\r\n handleChangeStyle: PropTypes.func,\r\n handleSectionReset: PropTypes.func,\r\n handleChooseStyle: PropTypes.func\r\n}","import SectionItemControl from './section-item-control';\r\nexport default SectionItemControl;","import React from 'react';\r\nimport SectionItemControl from '../section-item-control'\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport PropTypes from 'prop-types';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n content: {\r\n width: '100%',\r\n paddingLeft: theme.spacing(2)\r\n }\r\n}));\r\n\r\nexport default function SectionListControl(props){\r\n\r\n const renderElements = () => {\r\n const {\r\n sections,\r\n handleSectionEnable,\r\n handleSectionPageBreak,\r\n handleRepeatHeader,\r\n handleSectionForcePageBreak,\r\n handleChangeStyle,\r\n handleHeaderEnable,\r\n handleFooterEnable,\r\n handleSectionReset,\r\n handleChooseStyle} = props;\r\n\r\n let content = sections.map(section =>\r\n \r\n
\r\n \r\n \r\n event.stopPropagation()}\r\n onFocus={(event) => event.stopPropagation()}\r\n control={\r\n handleSectionEnable(section.id, !section.enabled)}\r\n />}\r\n label={{section.type.name} } />\r\n \r\n
\r\n \r\n \r\n \r\n {t('focus_btn')} \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n handleSectionPageBreak(section.id, !selected.usePageBreak)}*/}\r\n {/* name=\"usePageBreak\"*/}\r\n {/* />*/}\r\n {/* }*/}\r\n {/* label={Use Page Break }*/}\r\n {/*/>*/}\r\n handleSectionForcePageBreak(section.id, !selected.forcePageBreak)}\r\n name=\"forcePageBreak\"\r\n />\r\n }\r\n label={{t('force_page_break')} }\r\n />\r\n
\r\n \r\n \r\n {t('styles')} \r\n \r\n {styles}\r\n \r\n \r\n
\r\n {/*TODO: Need to hide*/}\r\n {/*\r\n \r\n \r\n
\r\n \r\n {contents}\r\n
\r\n );\r\n}\r\n\r\nSectionListControl.propTypes = {\r\n sections: PropTypes.array.isRequired,\r\n handleSectionEnable: PropTypes.func,\r\n handleSectionPageBreak: PropTypes.func,\r\n handleSectionForcePageBreak: PropTypes.func,\r\n handleRepeatHeader: PropTypes.func,\r\n handleHeaderEnable: PropTypes.func,\r\n handleFooterEnable: PropTypes.func,\r\n handleChangeStyle: PropTypes.func,\r\n handleSectionReset: PropTypes.func,\r\n handleChooseStyle: PropTypes.func\r\n}","import SectionListControl from './section-list-control';\r\nexport default SectionListControl;","import React from 'react';\r\nimport Accordion from '@material-ui/core/Accordion';\r\nimport AccordionSummary from '@material-ui/core/AccordionSummary';\r\nimport AccordionDetails from '@material-ui/core/AccordionDetails';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport TextPrimary from '../shared/text-primary';\r\nimport TextSecondary from '../shared/text-secondary';\r\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\r\nimport SectionListControl from '../section-list-control'\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport CustomCheckbox from '../shared/checkbox';\r\nimport PropTypes from 'prop-types';\r\nimport CustomTooltip from '../shared/tooltip';\r\nimport { useTranslation } from 'react-i18next';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n content: {\r\n padding: '0px 24px 0 24px',\r\n display: 'flex',\r\n flexWrap: 'wrap'\r\n },\r\n pageTitle: {\r\n width:'200px'\r\n },\r\n expanded: {\r\n backgroundColor: '#f1f3f5'\r\n },\r\n summaryContent: {\r\n '&.Mui-expanded': {\r\n margin: 0\r\n }\r\n }\r\n}));\r\n\r\nexport default function PageItemControl(props) {\r\n\r\n const { page, handlePageEnable, handlePageBreak, expanded, handleChange} = props;\r\n\r\n const classes = useStyles();\r\n const { t } = useTranslation();\r\n\r\n const handleSectionEnable = (sectionId, enabled) => {\r\n props.handleSectionEnable(page.id, sectionId, enabled);\r\n }\r\n\r\n const handleSectionPageBreak = (sectionId, usePageBreak) => {\r\n props.handleSectionPageBreak(page.id, sectionId, usePageBreak);\r\n }\r\n\r\n const handleSectionForcePageBreak = (sectionId, forcePageBreak) => {\r\n props.handleSectionForcePageBreak(page.id, sectionId, forcePageBreak);\r\n }\r\n\r\n const handleRepeatHeader = (sectionId, repeatOnEachPage) => {\r\n props.handleRepeatHeader(page.id, sectionId, repeatOnEachPage);\r\n }\r\n\r\n const handleHeaderEnable = (sectionId, enabled) => {\r\n props.handleHeaderEnable(page.id, sectionId, enabled);\r\n }\r\n\r\n const handleFooterEnable = (sectionId, enabled) => {\r\n props.handleFooterEnable(page.id, sectionId, enabled);\r\n }\r\n\r\n const handleChangeStyle = (sectionId, styleId) => {\r\n props.handleChangeStyle(page.id, sectionId, styleId);\r\n }\r\n\r\n const handleSectionReset = (sectionId) => {\r\n props.handleSectionReset(page.id, sectionId);\r\n }\r\n\r\n const handleChooseStyle = (section) => {\r\n props.handleChooseStyle(page.id, section);\r\n }\r\n\r\n return (\r\n \r\n \r\n handleChange(e.target.checked)} disabled={!enabled} />}\r\n label={{t('view_mode')} }\r\n />\r\n \r\n
\r\n );\r\n}\r\n\r\nViewModeControl.propTypes = {\r\n viewMode: PropTypes.number.isRequired,\r\n handleChange: PropTypes.func.isRequired\r\n}","import ViewModeControl from './view-mode-control';\r\nexport default ViewModeControl;","import React from 'react';\r\nimport PageItemControl from '../page-item-control'\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { useTranslation } from 'react-i18next'\r\nimport TextSubHeader from '../shared/text-sub-header';\r\nimport ViewModeControl from '../view-mode-control';\r\nimport Progress from '../shared/progress';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n heading: {\r\n height: '28px',\r\n margin: '8px 12px 30px 24px'\r\n },\r\n controls: {\r\n overflowY: 'auto',\r\n overflowX: 'hidden'\r\n }\r\n}));\r\n\r\nexport default function TemplateListControl(props) {\r\n const [expanded, setExpanded] = React.useState(false);\r\n const { t } = useTranslation();\r\n\r\n const handleChange = (panel) => (event, isExpanded) => {\r\n setExpanded(isExpanded ? panel : false);\r\n };\r\n\r\n\r\n const classes = useStyles();\r\n const {\r\n pages,\r\n loading,\r\n parameterMode,\r\n enabledEditMode,\r\n handlePageEnable,\r\n handlePageBreak,\r\n handleSectionEnable,\r\n handleSectionPageBreak,\r\n handleRepeatHeader,\r\n handleSectionForcePageBreak,\r\n handleChangeStyle,\r\n handleHeaderEnable,\r\n handleFooterEnable,\r\n handleSectionReset,\r\n handleChangeParameterViewMode,\r\n handleChooseStyle} = props;\r\n\r\n const pageControls = () => pages.map(page =>\r\n \r\n {pageControls()}\r\n
\r\n \r\n );\r\n }\r\n\r\n return (\r\n <>\r\n \r\n {t('template_settings')} \r\n
\r\n {loading ? : getContent()}\r\n \r\n );\r\n}\r\n","import TemplateListControl from './template-list-control';\r\nexport default TemplateListControl;","import React, { useState } from 'react';\r\nimport TemplateService from '../../services/template-service';\r\nimport ActionButton from '../shared/action-button';\r\nimport CustomSnackBar from '../shared/snack-bar';\r\nimport { useTranslation } from 'react-i18next';\r\nimport PropTypes from 'prop-types';\r\nimport LanguageHelper from '../../utils/language-helper';\r\n\r\nexport default function DownloadConfiguration(props) {\r\n const [open, setOpen] = useState(false);\r\n const { t } = useTranslation();\r\n const { parameters, pages, templateId, disabled } = props;\r\n\r\n const saveConfiguration = async () => {\r\n const currentLanguageCode = LanguageHelper.getCurrentLanguageAsync();\r\n const config = { parameters: parameters, pages: pages };\r\n const response = await TemplateService.saveConfiguration(templateId, config, currentLanguageCode);\r\n \r\n response.blob().then(blob => {\r\n let url = window.URL.createObjectURL(blob);\r\n let a = document.createElement('a');\r\n a.href = url;\r\n a.download = 'configuration.sst';\r\n a.click();\r\n //TODO: Remove a object\r\n });\r\n }\r\n\r\n const handleSave = async () => {\r\n await saveConfiguration();\r\n handleOpen();\r\n }\r\n\r\n const handleOpen= () => {\r\n setOpen(true);\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n {props.children ?? t('not_found_page')}
\r\n\r\n
\r\n \r\n \r\n \r\n {t('style_picker')} \r\n \r\n \r\n
\r\n \r\n
\r\n - \r\n {getStyleItems()}\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n {getPreview()}\r\n
\r\n