\r\n {loading ? (\r\n \r\n )\r\n\r\n }\r\n\r\n\r\n\r\n\r\n let contentReturn = (\r\n \r\n
\r\n \r\n \r\n\r\n \r\n \r\n {description}
\r\n \r\n\r\n \r\n {contentPicture}\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n Operation mode:
\r\n \r\n \r\n {circuit}, {operation_mode}
\r\n \r\n \r\n\r\n \r\n \r\n Material hardness:
\r\n \r\n \r\n {material_hardness}
\r\n \r\n \r\n\r\n \r\n \r\n Technology category:
\r\n \r\n \r\n {mill_category}
\r\n \r\n \r\n\r\n \r\n \r\n Industry sector:
\r\n \r\n \r\n {industry_sector}
\r\n \r\n \r\n
\r\n
\r\n
\r\n
Results from grinding trials \r\n\r\n\r\n
\r\n {\r\n setValueXAxes(newValue);\r\n }}\r\n inputValue={inputValueXAxes}\r\n onInputChange={(event, newInputValue) => {\r\n setInputValueXAxes(newInputValue);\r\n }}\r\n id=\"controllable-states-demo\"\r\n\r\n options={optionsXAxes}\r\n style={{ width: 300 }}\r\n renderInput={(params) => \r\n {\r\n setValueYAxes(newValue);\r\n }}\r\n inputValue={inputValueYAxes}\r\n onInputChange={(event, newInputValue) => {\r\n setInputValueYAxes(newInputValue);\r\n }}\r\n id=\"controllable-states-demo\"\r\n\r\n options={optionsXAxes}\r\n style={{ width: 300 }}\r\n renderInput={(params) =>
\r\n\r\n\r\n
\r\n\r\n
\r\n {isDataAvailable}\r\n \r\n
\r\n\r\n Please note annotations:\r\n\r\n
\r\n \r\n 0)
\r\n \r\n\r\n \r\n Batch
\r\n \r\n \r\n a)
\r\n \r\n\r\n \r\n Laboratory
\r\n \r\n\r\n \r\n *Grinding aids used\r\n
\r\n
\r\n\r\n\r\n\r\n\r\n
\r\n
\r\n
\r\n
Technology Readyness Level (TRL EU) \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
Accuracy Index \r\n
\r\n
\r\n \r\n \r\n\r\n \r\n \r\n
\r\n
\r\n
\r\n
Function principle \r\n
\r\n \r\n
\r\n
\r\n
\r\n );\r\n }\r\n\r\n let contentSourcePicture;\r\n if (source_picture != null && source_picture.length > 0) {\r\n contentSourcePicture = (\r\n \r\n
\r\n );\r\n }\r\n\r\n let contentSourceFunctionPicture;\r\n if (source_FunctionPicture != null && source_FunctionPicture.length > 0) {\r\n contentSourceFunctionPicture = (\r\n \r\n
\r\n );\r\n }\r\n\r\n let contentManufacturers;\r\n if (manufacturers != null && manufacturers.length > 0) {\r\n contentManufacturers = (\r\n \r\n
\r\n );\r\n }\r\n\r\n\r\n\r\n\r\n useEffect(() => {\r\n let active = true;\r\n\r\n //if (!loading) {\r\n // return [];\r\n //}\r\n\r\n (async () => {\r\n\r\n const mills = await fetch(\"api/mills\")\r\n .then(response => {\r\n return response.json();\r\n })\r\n\r\n if (active) {\r\n setOptions(Object.keys(mills).map((id) => mills[id]));\r\n setGetID(Object.keys(mills).map((id) => mills[id]));\r\n }\r\n })();\r\n\r\n return () => {\r\n active = false;\r\n };\r\n }, [loading]);\r\n\r\n var contentKeywords;\r\n if (keywords != null) {\r\n contentKeywords = (\r\n \r\n
\r\n )\r\n }\r\n\r\n\r\n var mailSubject = \"mailto:fgt-support@ecra-online.org?subject=Ecra-FGT_Feedback \" + mill_name;\r\n\r\n\r\n return (\r\n \r\n
\r\n
ECRA Technology Database \r\n
\r\n {autoCompleteReturn}\r\n
\r\n
\r\n {contentReturn}\r\n {contentFunctionPicture}\r\n {contentTrials}\r\n {contentReportTrials}\r\n {industrialScaleSlider}\r\n {accuracyIndexSlider}\r\n {contentVideo}\r\n {contentSource}\r\n {contentSourcePicture}\r\n {contentSourceFunctionPicture}\r\n {contentManufacturers}\r\n {contentKeywords}\r\n
\r\n
\r\n Last update of data: {dateOfUpdate}\r\n
\r\n
\r\n
\r\n \r\n {/* \r\n
\r\n Technology Selection: \r\n \r\n \r\n\r\n After all scenario settings have been defined, there are\r\n two options how to compare different comminution\r\n technologies. The first option is “Select all suitable technologies (Filters applied)”,\r\n means, that all suitable comminution technologies listed in\r\n ECRA’s Technology Database will be involved in the\r\n evaluation process. Please note, that all filed\r\n technologies in this case will be compared in relation\r\n to a cement-based reference, carefully defined by ECRA’s\r\n grinding experts.
\r\n \r\n \r\n Problems with evaluation procedure? Please contact\r\n ECRA’s Technical Support: \r\n \r\n \r\n \r\n fgt-support@ecra-online.org\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n}\r\nfunction IconAllMillsSelected2(props) {\r\n return (\r\n \r\n \r\n );\r\n}\r\n\r\nexport default function IconStart() {\r\n const classes = useStyles();\r\n\r\n return (\r\n \r\n
\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nconst theDefaultContext = React.createContext(null);\r\n\r\nexport default theDefaultContext;\r\n","import React, { useState } from \"react\";\r\nimport Backdrop from \"@material-ui/core/Backdrop\";\r\nimport CircularProgress from \"@material-ui/core/CircularProgress\";\r\nimport Button from \"@material-ui/core/Button\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport { IconButton, Paper, Tab, Tabs } from \"@material-ui/core\";\r\nimport InfoButtonApp from \"./infoButton_App\";\r\nimport HelpOutlineIcon from \"@material-ui/icons/HelpOutline\";\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root1: {\r\n display: \"flex\",\r\n width: \"40px\",\r\n margin: \"auto\",\r\n flexWrap: \"wrap\",\r\n \"& > *\": {\r\n width: theme.spacing(\"auto\"),\r\n height: theme.spacing(\"auto\"),\r\n },\r\n },\r\n root2: {\r\n justifyContent: \"center\",\r\n display: \"flex\",\r\n flexWrap: \"wrap\",\r\n padding: \"5rem 4rem 4rem 4rem\",\r\n \"& > *\": {\r\n width: theme.spacing(120),\r\n height: theme.spacing(\"auto\"),\r\n },\r\n },\r\n root3: {\r\n justifyContent: \"center\",\r\n },\r\n root4Button: {\r\n fullWidth: \"true\",\r\n display: \"flex\",\r\n margin: \"auto\",\r\n flexWrap: \"wrap\",\r\n },\r\n\r\n backdrop: {\r\n zIndex: theme.zIndex.drawer + 1,\r\n color: \"#fff\",\r\n },\r\n}));\r\n\r\nexport default function InfoButtonFilter() {\r\n const [value, setValue] = useState();\r\n\r\n const handleChange = (event, newValue) => {\r\n setValue(newValue);\r\n };\r\n const classes = useStyles();\r\n const [open, setOpen] = useState(false);\r\n const handleClose = () => {\r\n setOpen(false);\r\n };\r\n\r\n const handleToggle = () => {\r\n setOpen(!open);\r\n };\r\n\r\n return (\r\n \r\n
\r\n Which Filters are applied?\r\n \r\n\r\n \r\n {/* \r\n
\r\n Which filters are applied? \r\n \r\n General Information: Filters are\r\n applied to exclude technology-types from the\r\n evaluation procedure, which to not fulfil the chosen\r\n ‘type of application’. The filters vary with the\r\n ‘type of application’ and are active, if ‘all\r\n suitable technologies’ is selected. For ‘choose\r\n technologies individually’, no filters are applied\r\n for the evaluation. In this case, the evaluation\r\n results need to be interpreted carefully.\r\n
\r\n \r\n Crushing: Applied filters: Not yet\r\n implemented.\r\n
\r\n \r\n Coarse grinding: Applied filters:\r\n If the ‘maximum feed size’ {\"<=\"} 5 mm or the\r\n ‘typical fineness’ {\">=\"} 5 mm a technology is\r\n excluded from evaluation.\r\n
\r\n \r\n Fine grinding: Applied filters: If\r\n the ‘maximum feed size’ {\"<=\"} 5 mm or the ‘typical\r\n fineness’ {\">=\"} 90 µm a technology is excluded from\r\n evaluation.\r\n
\r\n \r\n Ultra-fine grinding: Applied\r\n filters: If the ‘typical fineness’ {\">=\"} 8 µm a\r\n technology is excluded from evaluation.\r\n
\r\n \r\n Raw material grinding: Applied\r\n filters: If the ‘maximum feed size’ {\"<=\"} 5 mm or\r\n the ‘typical fineness’ {\">=\"} 90 µm a technology is\r\n excluded from evaluation. The applied bonus for\r\n ‘drying’ has been increased.\r\n
\r\n \r\n Press anywhere on this page to close this info\r\n window.\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 label=\"Add all technologies\"\r\n /> \r\n\r\n\r\n
\r\n {\r\n setOpen(true);\r\n }}\r\n onClose={() => {\r\n setOpen(false);\r\n }}\r\n getOptionSelected={(option, value) =>\r\n option.name === value.name\r\n }\r\n getOptionLabel={(option) => option.name}\r\n options={options}\r\n loading={loading}\r\n onChange={(event, value) => {\r\n setCountMill(value.name);\r\n setGetID(value.id);\r\n }}\r\n renderInput={(params) => (\r\n \r\n {loading ? (\r\n \r\n
\r\n \r\n Add to List\r\n \r\n \r\n
\r\n
{text01} \r\n
\r\n {millListNoDublicates !== [] ? (\r\n
\r\n {millListNoDublicates.map((t) => (\r\n \r\n\r\n \r\n {t.Millname}\r\n \r\n\r\n deleteTask(e, t.id)}\r\n >\r\n delete entry \r\n \r\n
\r\n \r\n ))}\r\n \r\n ) : null}\r\n
\r\n \r\n Selection \r\n \r\n \r\n {/* Choose how you want to analyse: */}\r\n \r\n \r\n \r\n \r\n \r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport Backdrop from \"@material-ui/core/Backdrop\";\r\nimport CircularProgress from \"@material-ui/core/CircularProgress\";\r\nimport Button from \"@material-ui/core/Button\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport { IconButton, Paper, Tab, Tabs } from \"@material-ui/core\";\r\nimport InfoButtonApp from \"./infoButton_App\";\r\nimport HelpOutlineIcon from \"@material-ui/icons/HelpOutline\";\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root1: {\r\n display: \"flex\",\r\n width: \"40px\",\r\n margin: \"auto\",\r\n flexWrap: \"wrap\",\r\n \"& > *\": {\r\n width: theme.spacing(\"auto\"),\r\n height: theme.spacing(\"auto\"),\r\n },\r\n },\r\n root2: {\r\n justifyContent: \"center\",\r\n display: \"flex\",\r\n flexWrap: \"wrap\",\r\n padding: \"5rem 4rem 4rem 4rem\",\r\n \"& > *\": {\r\n width: theme.spacing(120),\r\n height: theme.spacing(\"auto\"),\r\n },\r\n },\r\n root3: {\r\n justifyContent: \"center\",\r\n },\r\n\r\n inner: {\r\n textAlign: \"justify\",\r\n justifyContent: \"center\",\r\n display: \"flex\",\r\n flexWrap: \"wrap\",\r\n width: \"90%\",\r\n },\r\n\r\n backdrop: {\r\n zIndex: theme.zIndex.drawer + 1,\r\n color: \"#fff\",\r\n },\r\n}));\r\n\r\nexport default function InfoButtonGui() {\r\n const [value, setValue] = useState();\r\n\r\n const handleChange = (event, newValue) => {\r\n setValue(newValue);\r\n };\r\n const classes = useStyles();\r\n const [open, setOpen] = useState(false);\r\n const handleClose = () => {\r\n setOpen(false);\r\n };\r\n\r\n const handleToggle = () => {\r\n setOpen(!open);\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n {/* \r\n
\r\n Guideline: \r\n \r\n
\r\n \r\n Here you will find instructions and\r\n explanations for each topic.\r\n
\r\n \r\n \r\n \r\n\r\n {/*
\r\n \r\n */}\r\n
\r\n \r\n User Guide \r\n \r\n {/* Old Version: \r\n Use Icon above to have a look at the instruction manual for each Article. */}\r\n Click on icon above to view the user guide for ECRA`s\r\n Technology-Evaluation-Tool.\r\n
\r\n \r\n \r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport Backdrop from \"@material-ui/core/Backdrop\";\r\nimport CircularProgress from \"@material-ui/core/CircularProgress\";\r\nimport Button from \"@material-ui/core/Button\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport { IconButton, Paper, Tab, Tabs } from \"@material-ui/core\";\r\nimport InfoButtonApp from \"./infoButton_App\";\r\nimport HelpOutlineIcon from \"@material-ui/icons/HelpOutline\";\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root1: {\r\n display: \"flex\",\r\n width: \"40px\",\r\n margin: \"auto\",\r\n flexWrap: \"wrap\",\r\n \"& > *\": {\r\n width: theme.spacing(\"auto\"),\r\n height: theme.spacing(\"auto\"),\r\n },\r\n },\r\n root2: {\r\n justifyContent: \"center\",\r\n display: \"flex\",\r\n flexWrap: \"wrap\",\r\n \"& > *\": {\r\n width: theme.spacing(120),\r\n height: theme.spacing(\"auto\"), \r\n },\r\n },\r\n root3: {\r\n justifyContent: \"center\",\r\n },\r\n\r\n inner: {\r\n textAlign: \"justify\",\r\n justifyContent: \"center\",\r\n display: \"flex\",\r\n flexWrap: \"wrap\",\r\n width: \"90%\",\r\n },\r\n\r\n backdrop: {\r\n zIndex: theme.zIndex.drawer + 1,\r\n color: \"#fff\",\r\n },\r\n}));\r\n\r\nexport default function InfoButtonSce() {\r\n const [value, setValue] = useState();\r\n\r\n const handleChange = (event, newValue) => {\r\n setValue(newValue);\r\n };\r\n const classes = useStyles();\r\n const [open, setOpen] = useState(false);\r\n const handleClose = () => {\r\n setOpen(false);\r\n };\r\n\r\n const handleToggle = () => {\r\n setOpen(!open);\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n {/* \r\n
\r\n Scenarios: \r\n \r\n \r\n To evaluate various comminution technologies to a\r\n cement-based reference, ECRA’s grinding expert team has\r\n identified 6 different categories, which consist of\r\n ‘quality’, ‘feed / flexibility’, ‘operation’,\r\n ‘maintenance’, ‘efficiency’ and ‘environmental impact’.
\r\n \r\n \r\n\r\n {/*
\r\n \r\n */}\r\n
Pre },\r\n];\r\n\r\nvar markFeed = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markOperation = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 17, label: Pre },\r\n];\r\n\r\nvar markMaintenance = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markEfficiency = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\n\r\nvar markEnvironment = [\r\n { value: 0, label: \"0\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCatDefault() {\r\n const classes = useStyles();\r\n const [valueQuality, setValueQualtiy] = useState(28);\r\n const [valueFeed, setValueFeed] = useState(15);\r\n const [valueOperation, setValueOperation] = useState(17);\r\n const [valueMaintenance, setValueMaintenance] = useState(15);\r\n const [valueEfficiency, setValueEfficiency] = useState(20);\r\n const [valueEnvironment, setValueEnvironment] = useState(5);\r\n\r\n const handleChangeQuality = (e, newValue) => {\r\n setValueQualtiy(newValue);\r\n };\r\n\r\n const handleChangeFeed = (e, newValue) => {\r\n setValueFeed(newValue);\r\n };\r\n\r\n const handleChangeOperation = (e, newValue) => {\r\n setValueOperation(newValue);\r\n };\r\n\r\n const handleChangeMaintenance = (e, newValue) => {\r\n setValueMaintenance(newValue);\r\n };\r\n\r\n const handleChangeEfficiency = (e, newValue) => {\r\n setValueEfficiency(newValue);\r\n };\r\n\r\n const handleChangeEnvironment = (e, newValue) => {\r\n setValueEnvironment(newValue);\r\n };\r\n\r\n return (\r\n \r\n \r\n Quality: {valueQuality}\r\n \r\n \r\n Feed / Flexibility: {valueFeed}\r\n \r\n \r\n Operation: {valueOperation}\r\n \r\n \r\n Maintenance: {valueMaintenance}\r\n \r\n \r\n Efficiency: {valueEfficiency}\r\n \r\n \r\n Environmental Impact: {valueEnvironment}\r\n \r\n
\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport Typography from \"@material-ui/core/Typography\";\r\nimport Slider from \"@material-ui/core/Slider\";\r\n\r\n// Slider-API from: https://material-ui.com/api/slider/\r\n\r\nvar markQualtiy = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markFeed = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 10, label: Pre },\r\n];\r\n\r\nvar markOperation = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markMaintenance = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markEfficiency = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\n\r\nvar markEnvironment = [\r\n { value: 0, label: \"0\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCatEnergy() {\r\n const classes = useStyles();\r\n const [valueQuality, setValueQualtiy] = useState(15);\r\n const [valueFeed, setValueFeed] = useState(10);\r\n const [valueOperation, setValueOperation] = useState(15);\r\n const [valueMaintenance, setValueMaintenance] = useState(15);\r\n const [valueEfficiency, setValueEfficiency] = useState(40);\r\n const [valueEnvironment, setValueEnvironment] = useState(5);\r\n\r\n const handleChangeQuality = (e, newValue) => {\r\n setValueQualtiy(newValue);\r\n };\r\n\r\n const handleChangeFeed = (e, newValue) => {\r\n setValueFeed(newValue);\r\n };\r\n\r\n const handleChangeOperation = (e, newValue) => {\r\n setValueOperation(newValue);\r\n };\r\n\r\n const handleChangeMaintenance = (e, newValue) => {\r\n setValueMaintenance(newValue);\r\n };\r\n\r\n const handleChangeEfficiency = (e, newValue) => {\r\n setValueEfficiency(newValue);\r\n };\r\n\r\n const handleChangeEnvironment = (e, newValue) => {\r\n setValueEnvironment(newValue);\r\n };\r\n\r\n return (\r\n \r\n \r\n Quality: {valueQuality}\r\n \r\n \r\n Feed / Flexibility: {valueFeed}\r\n \r\n \r\n Operation: {valueOperation}\r\n \r\n \r\n Maintenance: {valueMaintenance}\r\n \r\n \r\n Efficiency: {valueEfficiency}\r\n \r\n \r\n Environmental Impact: {valueEnvironment}\r\n \r\n
\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport Typography from \"@material-ui/core/Typography\";\r\nimport Slider from \"@material-ui/core/Slider\";\r\n\r\n// Slider-API from: https://material-ui.com/api/slider/\r\n\r\nvar markQualtiy = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markFeed = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 10, label: Pre },\r\n];\r\n\r\nvar markOperation = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\n\r\nvar markMaintenance = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 25, label: Pre },\r\n];\r\n\r\nvar markEfficiency = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markEnvironment = [\r\n { value: 0, label: \"0\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCatOperationAndMaintenance() {\r\n const classes = useStyles();\r\n const [valueQuality, setValueQualtiy] = useState(15);\r\n const [valueFeed, setValueFeed] = useState(10);\r\n const [valueOperation, setValueOperation] = useState(30);\r\n const [valueMaintenance, setValueMaintenance] = useState(25);\r\n const [valueEfficiency, setValueEfficiency] = useState(15);\r\n const [valueEnvironment, setValueEnvironment] = useState(5);\r\n\r\n const handleChangeQuality = (e, newValue) => {\r\n setValueQualtiy(newValue);\r\n };\r\n\r\n const handleChangeFeed = (e, newValue) => {\r\n setValueFeed(newValue);\r\n };\r\n\r\n const handleChangeOperation = (e, newValue) => {\r\n setValueOperation(newValue);\r\n };\r\n\r\n const handleChangeMaintenance = (e, newValue) => {\r\n setValueMaintenance(newValue);\r\n };\r\n\r\n const handleChangeEfficiency = (e, newValue) => {\r\n setValueEfficiency(newValue);\r\n };\r\n\r\n const handleChangeEnvironment = (e, newValue) => {\r\n setValueEnvironment(newValue);\r\n };\r\n\r\n return (\r\n \r\n \r\n Quality: {valueQuality}\r\n \r\n \r\n Feed / Flexibility: {valueFeed}\r\n \r\n \r\n Operation: {valueOperation}\r\n \r\n \r\n Maintenance: {valueMaintenance}\r\n \r\n \r\n Efficiency: {valueEfficiency}\r\n \r\n \r\n Environmental Impact: {valueEnvironment}\r\n \r\n
\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport Typography from \"@material-ui/core/Typography\";\r\nimport Slider from \"@material-ui/core/Slider\";\r\n\r\n// Slider-API from: https://material-ui.com/api/slider/\r\n\r\nvar markQualtiy = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50 },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 45, label: Pre },\r\n];\r\n\r\nvar markFeed = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markOperation = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 10, label: Pre },\r\n];\r\n\r\nvar markMaintenance = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 10, label: Pre },\r\n];\r\n\r\nvar markEfficiency = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markEnvironment = [\r\n { value: 0, label: \"0\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCatQuality() {\r\n const classes = useStyles();\r\n const [valueQuality, setValueQualtiy] = useState(45);\r\n const [valueFeed, setValueFeed] = useState(15);\r\n const [valueOperation, setValueOperation] = useState(10);\r\n const [valueMaintenance, setValueMaintenance] = useState(10);\r\n const [valueEfficiency, setValueEfficiency] = useState(15);\r\n const [valueEnvironment, setValueEnvironment] = useState(5);\r\n\r\n const handleChangeQuality = (e, newValue) => {\r\n setValueQualtiy(newValue);\r\n };\r\n\r\n const handleChangeFeed = (e, newValue) => {\r\n setValueFeed(newValue);\r\n };\r\n\r\n const handleChangeOperation = (e, newValue) => {\r\n setValueOperation(newValue);\r\n };\r\n\r\n const handleChangeMaintenance = (e, newValue) => {\r\n setValueMaintenance(newValue);\r\n };\r\n\r\n const handleChangeEfficiency = (e, newValue) => {\r\n setValueEfficiency(newValue);\r\n };\r\n\r\n const handleChangeEnvironment = (e, newValue) => {\r\n setValueEnvironment(newValue);\r\n };\r\n\r\n return (\r\n \r\n \r\n Quality: {valueQuality}\r\n \r\n \r\n Feed / Flexibility: {valueFeed}\r\n \r\n \r\n Operation: {valueOperation}\r\n \r\n \r\n Maintenance: {valueMaintenance}\r\n \r\n \r\n Efficiency: {valueEfficiency}\r\n \r\n \r\n Environmental Impact: {valueEnvironment}\r\n \r\n
\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport Typography from \"@material-ui/core/Typography\";\r\nimport Slider from \"@material-ui/core/Slider\";\r\n\r\n// Slider-API from: https://material-ui.com/api/slider/\r\n\r\nvar markQualtiy = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50 },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 50, label: Pre },\r\n];\r\n\r\nvar markFeed = [\r\n { value: 0 },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 0, label: Pre },\r\n];\r\n\r\nvar markOperation = [\r\n { value: 0 },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 0, label: Pre },\r\n];\r\n\r\nvar markMaintenance = [\r\n { value: 0 },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 0, label: Pre },\r\n];\r\n\r\nvar markEfficiency = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50 },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 50, label: Pre },\r\n];\r\n\r\nvar markEnvironment = [\r\n { value: 0 },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 0, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCatQualityAndEfficiency() {\r\n const classes = useStyles();\r\n const [valueQuality, setValueQualtiy] = useState(50);\r\n const [valueFeed, setValueFeed] = useState(0);\r\n const [valueOperation, setValueOperation] = useState(0);\r\n const [valueMaintenance, setValueMaintenance] = useState(0);\r\n const [valueEfficiency, setValueEfficiency] = useState(50);\r\n const [valueEnvironment, setValueEnvironment] = useState(0);\r\n\r\n const handleChangeQuality = (e, newValue) => {\r\n setValueQualtiy(newValue);\r\n };\r\n\r\n const handleChangeFeed = (e, newValue) => {\r\n setValueFeed(newValue);\r\n };\r\n\r\n const handleChangeOperation = (e, newValue) => {\r\n setValueOperation(newValue);\r\n };\r\n\r\n const handleChangeMaintenance = (e, newValue) => {\r\n setValueMaintenance(newValue);\r\n };\r\n\r\n const handleChangeEfficiency = (e, newValue) => {\r\n setValueEfficiency(newValue);\r\n };\r\n\r\n const handleChangeEnvironment = (e, newValue) => {\r\n setValueEnvironment(newValue);\r\n };\r\n\r\n return (\r\n \r\n \r\n Quality: {valueQuality}\r\n \r\n \r\n Feed / Flexibility: {valueFeed}\r\n \r\n \r\n Operation: {valueOperation}\r\n \r\n \r\n Maintenance: {valueMaintenance}\r\n \r\n \r\n Efficiency: {valueEfficiency}\r\n \r\n \r\n Environmental Impact: {valueEnvironment}\r\n \r\n
\r\n );\r\n}\r\n","import React, { useState, useContext } from \"react\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\nimport Typography from \"@material-ui/core/Typography\";\r\nimport Slider from \"@material-ui/core/Slider\";\r\n//import Button from \"@material-ui/core/Button\";\r\n\r\nimport theDefaultContext from \"../../defaultContext\";\r\n\r\nconst inputStyle = {\r\n color: \"blue\",\r\n border: \"none\",\r\n size: \"small\",\r\n margin: \"dense\",\r\n outline: \"none\",\r\n width: 50,\r\n};\r\n\r\n// Slider-API from: https://material-ui.com/api/slider/\r\nvar markQualtiy = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 28, label: Pre },\r\n];\r\n\r\nvar markFeed = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markOperation = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 17, label: Pre },\r\n];\r\n\r\nvar markMaintenance = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\nvar markEfficiency = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\n\r\nvar markEnvironment = [\r\n { value: 0, label: \"0\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCatCustom() {\r\n //////////////////////////////////////////////////////////////////////////// Provider Werte:\r\n const { setCategoryQualityCustom } = useContext(theDefaultContext);\r\n const { setCategoryFeedFlexCustom } = useContext(theDefaultContext);\r\n const { setCategoryOperationCustom } = useContext(theDefaultContext);\r\n const { setCategoryMaintenanceCustom } = useContext(theDefaultContext);\r\n const { setCategoryEfficiencyCustom } = useContext(theDefaultContext);\r\n const { setCategoryEnvironmentCustom } = useContext(theDefaultContext);\r\n\r\n /////////////////////////////////////////////////////////////////////////// Slider Values für den Provider:\r\n const classes = useStyles();\r\n const [valueQuality, setValueQualtiy] = useState(28);\r\n const [valueFeed, setValueFeed] = useState(15);\r\n const [valueOperation, setValueOperation] = useState(17);\r\n const [valueMaintenance, setValueMaintenance] = useState(15);\r\n const [valueEfficiency, setValueEfficiency] = useState(20);\r\n const [valueEnvironment, setValueEnvironment] = useState(5);\r\n\r\n //////////////////////////////////// SwitchValue:\r\n const { limitOfSliderCategorie, setLimitOfSliderCategorie } =\r\n useContext(theDefaultContext);\r\n\r\n const handleChangeQuality = (e, newValue) => {\r\n setValueQualtiy(newValue);\r\n setCategoryQualityCustom(newValue / 100);\r\n };\r\n\r\n const handleChangeFeed = (e, newValue) => {\r\n setValueFeed(newValue);\r\n setCategoryFeedFlexCustom(newValue / 100);\r\n };\r\n\r\n const handleChangeOperation = (e, newValue) => {\r\n setValueOperation(newValue);\r\n setCategoryOperationCustom(newValue / 100);\r\n };\r\n\r\n const handleChangeMaintenance = (e, newValue) => {\r\n setValueMaintenance(newValue);\r\n setCategoryMaintenanceCustom(newValue / 100);\r\n };\r\n\r\n const handleChangeEfficiency = (e, newValue) => {\r\n setValueEfficiency(newValue);\r\n setCategoryEfficiencyCustom(newValue / 100);\r\n };\r\n\r\n const handleChangeEnvironment = (e, newValue) => {\r\n setValueEnvironment(newValue);\r\n setCategoryEnvironmentCustom(newValue / 100);\r\n };\r\n\r\n const SumSlider =\r\n valueQuality +\r\n valueFeed +\r\n valueOperation +\r\n valueMaintenance +\r\n valueEfficiency +\r\n valueEnvironment;\r\n\r\n let ColorSumSlider;\r\n if (SumSlider > 100) {\r\n ColorSumSlider = (\r\n \r\n {\" \"}\r\n Sum of Categories: {SumSlider} %{\" \"} (Categories must be normalised)\r\n
\r\n );\r\n setLimitOfSliderCategorie(true);\r\n } else {\r\n ColorSumSlider = (\r\n \r\n Sum of Categories: {SumSlider} % (Categories must be normalised)\r\n
\r\n );\r\n\r\n setLimitOfSliderCategorie(true);\r\n }\r\n if (SumSlider === 100) {\r\n ColorSumSlider = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSlider} %\r\n
\r\n );\r\n setLimitOfSliderCategorie(false);\r\n }\r\n\r\n return (\r\n \r\n {/*
Warning:
\r\n
Do not apply more or less than 100 %
*/}\r\n
Please note:
\r\n
\r\n Values can be typed in by selecting the blue numbers next to\r\n your category.\r\n
\r\n
\r\n
\r\n Quality:{\" \"}\r\n {\r\n setValueQualtiy(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n\r\n
\r\n Feed / Flexibility:{\" \"}\r\n {\r\n setValueFeed(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n\r\n
\r\n Operation:{\" \"}\r\n {\r\n setValueOperation(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Maintenance:{\" \"}\r\n {\r\n setValueMaintenance(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Efficiency:{\" \"}\r\n {\r\n setValueEfficiency(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Environmental Impact:{\" \"}\r\n {\r\n setValueEnvironment(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n {ColorSumSlider}\r\n
\r\n
\r\n \r\n {/* \r\n
\r\n Scenario Details: \r\n \r\n \r\n As mentioned above, ECRA’s grinding expert team as\r\n identified 5 different categories in order to create a\r\n realistic evaluation procedure. The category ‘quality’\r\n and ‘feed / flexibility’ as well as their derived\r\n criteria are covering the most relevant product related\r\n specifications. Others like ‘operation’, ‘maintenance’,\r\n ‘efficiency’ as well as ‘environmental impact’ reflect\r\n process related aspects. To receive more detailed\r\n information on each criterion, please use the\r\n description therein.\r\n \r\n
\r\n \r\n \r\n
Pre },\r\n];\r\nconst marks02 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\nconst marks03 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks04 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\n//Feed / Flexibility\r\nconst marks05 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 60, label: Pre },\r\n];\r\nconst marks06 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\n\r\n//Operation\r\nconst marks07 = [\r\n { value: 0, label: \"0\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\nconst marks08 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 25, label: Pre },\r\n];\r\nconst marks09 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks10 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks11 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\n\r\n//Maintenance\r\nconst marks12 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\nconst marks13 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks14 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\n\r\n//Efficiency\r\nconst marks15 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100 },\r\n { value: 95, label: Pre },\r\n];\r\nconst marks16 = [\r\n { value: 0 },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\n//Environmental Impact\r\nconst marks17 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\nconst marks18 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50 },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 50, label: Pre },\r\n];\r\nconst marks19 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCritDefault() {\r\n const classes = useStyles();\r\n const [valuePSD, setValuePSD] = useState(35);\r\n const [valueMaxFineness, setValueMaxFineness] = useState(30);\r\n const [valueDehydration, setValueDehydration] = useState(20);\r\n const [valueDrying, setValueDrying] = useState(15);\r\n const [valueMaxFeedSize, setValueMaxFeedSize] = useState(60);\r\n const [valueProductChangingTime, setValueProductChangingTime] = useState(\r\n 40\r\n );\r\n const [\r\n valueUnderstandingOfProcess,\r\n setValueUnderstandingOfProcess,\r\n ] = useState(5);\r\n const [valueSensitivityOfProcess, setValueSensitivityOfProcess] = useState(\r\n 25\r\n );\r\n const [\r\n valueControlabilityPersonnel,\r\n setValueControlabilityPersonnel,\r\n ] = useState(20);\r\n const [valueAvailableExperience, setValueAvailableExperience] = useState(\r\n 20\r\n );\r\n const [valueThroughput, setValueThroughput] = useState(30);\r\n const [valueMaintenanceTime, setValueMaintenanceTime] = useState(40);\r\n const [\r\n valueComplexityOfMaintenance,\r\n setValueComplexityOfMaintenance,\r\n ] = useState(20);\r\n const [valueWearCosts, setValueWearCosts] = useState(40);\r\n const [valueEnergyDemand, setValueEnergyDemand] = useState(95);\r\n const [valueWaterDemand, setValueWaterDemand] = useState(5);\r\n const [valueDustEmissions, setValueDustEmissions] = useState(30);\r\n const [valueNoise, setValueNoise] = useState(50);\r\n const [valueEffectOfVibration, setValueEffectOfVibration] = useState(20);\r\n\r\n const handleChangePSD = (e, newValue) => {\r\n setValuePSD(newValue);\r\n };\r\n\r\n const handleChangeMaxFineness = (e, newValue) => {\r\n setValueMaxFineness(newValue);\r\n };\r\n\r\n const handleChangeDehydration = (e, newValue) => {\r\n setValueDehydration(newValue);\r\n };\r\n\r\n const handleChangeDrying = (e, newValue) => {\r\n setValueDrying(newValue);\r\n };\r\n\r\n const handleChangeMaxFeedSize = (e, newValue) => {\r\n setValueMaxFeedSize(newValue);\r\n };\r\n\r\n const handleChangeProductChangingTime = (e, newValue) => {\r\n setValueProductChangingTime(newValue);\r\n };\r\n\r\n const handleChangeUnderstandingOfProcess = (e, newValue) => {\r\n setValueUnderstandingOfProcess(newValue);\r\n };\r\n\r\n const handleChangeSensitivityOfProcess = (e, newValue) => {\r\n setValueSensitivityOfProcess(newValue);\r\n };\r\n\r\n const handleChangeControlabilityPersonnel = (e, newValue) => {\r\n setValueControlabilityPersonnel(newValue);\r\n };\r\n\r\n const handleChangeAvailableExperience = (e, newValue) => {\r\n setValueAvailableExperience(newValue);\r\n };\r\n\r\n const handleChangeThroughput = (e, newValue) => {\r\n setValueThroughput(newValue);\r\n };\r\n\r\n const handleChangeMaintenanceTime = (e, newValue) => {\r\n setValueMaintenanceTime(newValue);\r\n };\r\n\r\n const handleChangeComplexityOfMaintenance = (e, newValue) => {\r\n setValueComplexityOfMaintenance(newValue);\r\n };\r\n\r\n const handleChangeWearCosts = (e, newValue) => {\r\n setValueWearCosts(newValue);\r\n };\r\n\r\n const handleChangeEnergyDemand = (e, newValue) => {\r\n setValueEnergyDemand(newValue);\r\n };\r\n\r\n const handleChangeWaterDemand = (e, newValue) => {\r\n setValueWaterDemand(newValue);\r\n };\r\n\r\n const handleChangeDustEmissions = (e, newValue) => {\r\n setValueDustEmissions(newValue);\r\n };\r\n\r\n const handleChangeNoise = (e, newValue) => {\r\n setValueNoise(newValue);\r\n };\r\n\r\n const handleChangeEffectOfVibration = (e, newValue) => {\r\n setValueEffectOfVibration(newValue);\r\n };\r\n\r\n return (\r\n \r\n
Quality \r\n
\r\n Slope of Particle Size Distribution: {valuePSD}\r\n \r\n
\r\n\r\n
\r\n Maximum Fineness: {valueMaxFineness}\r\n \r\n
\r\n\r\n
\r\n Dehydration: {valueDehydration}\r\n \r\n
\r\n
\r\n Drying: {valueDrying}\r\n \r\n
\r\n\r\n
\r\n
\r\n
Feed / Flexibility \r\n\r\n
\r\n Max. Feed Size: {valueMaxFeedSize}\r\n \r\n
\r\n
\r\n Product Changing Time: {valueProductChangingTime}\r\n \r\n
\r\n\r\n
\r\n
\r\n
Operation \r\n\r\n
\r\n Understanding of Process: {valueUnderstandingOfProcess}\r\n \r\n
\r\n
\r\n Sensitivity of Process: {valueSensitivityOfProcess}\r\n \r\n
\r\n
\r\n Controlabillity/ Personnel: {valueControlabilityPersonnel}\r\n \r\n
\r\n
\r\n Available Experience: {valueAvailableExperience}\r\n \r\n
\r\n
\r\n Throughput: {valueThroughput}\r\n \r\n
\r\n\r\n
\r\n
\r\n
Maintenance \r\n\r\n
\r\n Maintenance Time: {valueMaintenanceTime}\r\n \r\n
\r\n
\r\n Complexity of Maintenance: {valueComplexityOfMaintenance}\r\n \r\n
\r\n
\r\n Wear Costs: {valueWearCosts}\r\n \r\n
\r\n\r\n
\r\n
\r\n
Efficiency \r\n\r\n
\r\n Energy Demand: {valueEnergyDemand}\r\n \r\n
\r\n
\r\n Water Demand: {valueWaterDemand}\r\n \r\n
\r\n\r\n
\r\n
\r\n
Environmental Impact \r\n\r\n
\r\n Dust Emissions: {valueDustEmissions}\r\n \r\n
\r\n
\r\n Noise: {valueNoise}\r\n \r\n
\r\n
\r\n Effect of Vibration: {valueEffectOfVibration}\r\n \r\n
\r\n
Warning:
\r\n
\r\n Do not apply more or less than 100 % (Work in progress) \r\n
\r\n
Pre },\r\n];\r\nconst marks02 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\nconst marks03 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks04 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 15, label: Pre },\r\n];\r\n\r\n//Feed / Flexibility\r\nconst marks05 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 60, label: Pre },\r\n];\r\nconst marks06 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\n\r\n//Operation\r\nconst marks07 = [\r\n { value: 0, label: \"0\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\nconst marks08 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 25, label: Pre },\r\n];\r\nconst marks09 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks10 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks11 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\n\r\n//Maintenance\r\nconst marks12 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\nconst marks13 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\nconst marks14 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 40, label: Pre },\r\n];\r\n\r\n//Efficiency\r\nconst marks15 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100 },\r\n { value: 95, label: Pre },\r\n];\r\nconst marks16 = [\r\n { value: 0 },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 5, label: Pre },\r\n];\r\n\r\n//Environmental Impact\r\nconst marks17 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 30, label: Pre },\r\n];\r\nconst marks18 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25, label: \"25 %\" },\r\n { value: 50 },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 50, label: Pre },\r\n];\r\nconst marks19 = [\r\n { value: 0, label: \"0 %\" },\r\n { value: 25 },\r\n { value: 50, label: \"50 %\" },\r\n { value: 75, label: \"75 %\" },\r\n { value: 100, label: \"100 %\" },\r\n { value: 20, label: Pre },\r\n];\r\n\r\nconst useStyles = makeStyles({\r\n root: {\r\n width: 300,\r\n },\r\n});\r\n\r\nexport default function SliderCritCustom() {\r\n /////////////////////////////////////////////////////////////////////////// Slider Values für den Provider:\r\n const { setPsd } = useContext(theDefaultContext);\r\n const { setMaxFineness } = useContext(theDefaultContext);\r\n const { setDehydration } = useContext(theDefaultContext);\r\n const { setDrying } = useContext(theDefaultContext);\r\n const { setMaxFeedSize } = useContext(theDefaultContext);\r\n const { setProductChangingTime } = useContext(theDefaultContext);\r\n const { setUnderstandingOfProcess } = useContext(theDefaultContext);\r\n const { setSensitivityOfProcess } = useContext(theDefaultContext);\r\n const { setControlabilityPersonnel } = useContext(theDefaultContext);\r\n const { setAvailableExperience } = useContext(theDefaultContext);\r\n const { setThroughput } = useContext(theDefaultContext);\r\n const { setMaintenanceTime } = useContext(theDefaultContext);\r\n const { setComplexityOfMaintenance } = useContext(theDefaultContext);\r\n const { setWearCosts } = useContext(theDefaultContext);\r\n const { setEnergyDemand } = useContext(theDefaultContext);\r\n const { setWaterDemand } = useContext(theDefaultContext);\r\n const { setDustEmissions } = useContext(theDefaultContext);\r\n const { setNoise } = useContext(theDefaultContext);\r\n const { setEffectOfVibration } = useContext(theDefaultContext);\r\n\r\n /////////////////////////////////////////////////////////////////////////// Slider Values für diese Funktion:\r\n const classes = useStyles();\r\n const [valuePSD, setValuePSD] = useState(35);\r\n const [valueMaxFineness, setValueMaxFineness] = useState(30);\r\n const [valueDehydration, setValueDehydration] = useState(20);\r\n const [valueDrying, setValueDrying] = useState(15);\r\n const [valueMaxFeedSize, setValueMaxFeedSize] = useState(60);\r\n const [valueProductChangingTime, setValueProductChangingTime] =\r\n useState(40);\r\n const [valueUnderstandingOfProcess, setValueUnderstandingOfProcess] =\r\n useState(5);\r\n const [valueSensitivityOfProcess, setValueSensitivityOfProcess] =\r\n useState(25);\r\n const [valueControlabilityPersonnel, setValueControlabilityPersonnel] =\r\n useState(20);\r\n const [valueAvailableExperience, setValueAvailableExperience] =\r\n useState(20);\r\n const [valueThroughput, setValueThroughput] = useState(30);\r\n const [valueMaintenanceTime, setValueMaintenanceTime] = useState(40);\r\n const [valueComplexityOfMaintenance, setValueComplexityOfMaintenance] =\r\n useState(20);\r\n const [valueWearCosts, setValueWearCosts] = useState(40);\r\n const [valueEnergyDemand, setValueEnergyDemand] = useState(95);\r\n const [valueWaterDemand, setValueWaterDemand] = useState(5);\r\n const [valueDustEmissions, setValueDustEmissions] = useState(30);\r\n const [valueNoise, setValueNoise] = useState(50);\r\n const [valueEffectOfVibration, setValueEffectOfVibration] = useState(20);\r\n\r\n //////////////////////////////////// SwitchValue:\r\n const { limitOfSliderCriteria, setLimitOfSliderCriteria } =\r\n useContext(theDefaultContext);\r\n\r\n //////////////////////////////////////////////////////////////////////////////////// HandleChange\r\n const handleChangePSD = (e, newValue) => {\r\n setValuePSD(newValue);\r\n setPsd(newValue / 100);\r\n };\r\n\r\n const handleChangeMaxFineness = (e, newValue) => {\r\n setValueMaxFineness(newValue);\r\n setMaxFineness(newValue / 100);\r\n };\r\n\r\n const handleChangeDehydration = (e, newValue) => {\r\n setValueDehydration(newValue);\r\n setDehydration(newValue / 100);\r\n };\r\n\r\n const handleChangeDrying = (e, newValue) => {\r\n setValueDrying(newValue);\r\n setDrying(newValue / 100);\r\n };\r\n\r\n const handleChangeMaxFeedSize = (e, newValue) => {\r\n setValueMaxFeedSize(newValue);\r\n setMaxFeedSize(newValue / 100);\r\n };\r\n\r\n const handleChangeProductChangingTime = (e, newValue) => {\r\n setValueProductChangingTime(newValue);\r\n setProductChangingTime(newValue / 100);\r\n };\r\n\r\n const handleChangeUnderstandingOfProcess = (e, newValue) => {\r\n setValueUnderstandingOfProcess(newValue);\r\n setUnderstandingOfProcess(newValue / 100);\r\n };\r\n\r\n const handleChangeSensitivityOfProcess = (e, newValue) => {\r\n setValueSensitivityOfProcess(newValue);\r\n setSensitivityOfProcess(newValue / 100);\r\n };\r\n\r\n const handleChangeControlabilityPersonnel = (e, newValue) => {\r\n setValueControlabilityPersonnel(newValue);\r\n setControlabilityPersonnel(newValue / 100);\r\n };\r\n\r\n const handleChangeAvailableExperience = (e, newValue) => {\r\n setValueAvailableExperience(newValue);\r\n setAvailableExperience(newValue / 100);\r\n };\r\n\r\n const handleChangeThroughput = (e, newValue) => {\r\n setValueThroughput(newValue);\r\n setThroughput(newValue / 100);\r\n };\r\n\r\n const handleChangeMaintenanceTime = (e, newValue) => {\r\n setValueMaintenanceTime(newValue);\r\n setMaintenanceTime(newValue / 100);\r\n };\r\n\r\n const handleChangeComplexityOfMaintenance = (e, newValue) => {\r\n setValueComplexityOfMaintenance(newValue);\r\n setComplexityOfMaintenance(newValue / 100);\r\n };\r\n\r\n const handleChangeWearCosts = (e, newValue) => {\r\n setValueWearCosts(newValue);\r\n setWearCosts(newValue / 100);\r\n };\r\n\r\n const handleChangeEnergyDemand = (e, newValue) => {\r\n setValueEnergyDemand(newValue);\r\n setEnergyDemand(newValue / 100);\r\n };\r\n\r\n const handleChangeWaterDemand = (e, newValue) => {\r\n setValueWaterDemand(newValue);\r\n setWaterDemand(newValue / 100);\r\n };\r\n\r\n const handleChangeDustEmissions = (e, newValue) => {\r\n setValueDustEmissions(newValue);\r\n setDustEmissions(newValue / 100);\r\n };\r\n\r\n const handleChangeNoise = (e, newValue) => {\r\n setValueNoise(newValue);\r\n setNoise(newValue / 100);\r\n };\r\n\r\n const handleChangeEffectOfVibration = (e, newValue) => {\r\n setValueEffectOfVibration(newValue);\r\n setEffectOfVibration(newValue / 100);\r\n };\r\n\r\n const SumSliderQuality =\r\n valuePSD + valueMaxFineness + valueDehydration + valueDrying;\r\n const SumSliderFeed = valueMaxFeedSize + valueProductChangingTime;\r\n const SumSliderOperation =\r\n valueUnderstandingOfProcess +\r\n valueSensitivityOfProcess +\r\n valueControlabilityPersonnel +\r\n valueAvailableExperience +\r\n valueThroughput;\r\n const SumSliderMaintenance =\r\n valueMaintenanceTime + valueComplexityOfMaintenance + valueWearCosts;\r\n const SumSliderEfficiency = valueEnergyDemand + valueWaterDemand;\r\n const SumSliderEnvironment =\r\n valueDustEmissions + valueNoise + valueEffectOfVibration;\r\n\r\n let statusWarningHigh = Please adapt your importances!
;\r\n let statusWarningLow = Please adapt your importances!
;\r\n\r\n let SumSliderColorQuality;\r\n let SumSliderColorFeed;\r\n let SumSliderColorOperation;\r\n let SumSliderColorMaintenance;\r\n let SumSliderColorEfficiency;\r\n let SumSliderColorEnvironment;\r\n\r\n let setStatusSliderColorQuality = true;\r\n let setStatusSliderColorFeed = true;\r\n let setStatusSliderColorOperation = true;\r\n let setStatusSliderColorMaintenance = true;\r\n let setStatusSliderColorEfficiency = true;\r\n let setStatusSliderColorEnvironment = true;\r\n\r\n if (SumSliderQuality > 100) {\r\n SumSliderColorQuality = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderQuality} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorQuality = true;\r\n } else {\r\n SumSliderColorQuality = (\r\n \r\n Sum of categories: {SumSliderQuality} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorQuality = true;\r\n }\r\n if (SumSliderQuality === 100) {\r\n SumSliderColorQuality = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderQuality} %\r\n
\r\n );\r\n setStatusSliderColorQuality = false;\r\n }\r\n\r\n if (SumSliderFeed > 100) {\r\n SumSliderColorFeed = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderFeed} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorFeed = true;\r\n } else {\r\n SumSliderColorFeed = (\r\n \r\n Sum of categories: {SumSliderFeed} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorFeed = true;\r\n }\r\n if (SumSliderFeed === 100) {\r\n SumSliderColorFeed = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderFeed} %\r\n
\r\n );\r\n setStatusSliderColorFeed = false;\r\n }\r\n\r\n if (SumSliderOperation > 100) {\r\n SumSliderColorOperation = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderOperation} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorOperation = true;\r\n } else {\r\n SumSliderColorOperation = (\r\n \r\n Sum of categories: {SumSliderOperation} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorOperation = true;\r\n }\r\n if (SumSliderOperation === 100) {\r\n SumSliderColorOperation = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderOperation} %{\" \"}\r\n
\r\n );\r\n setStatusSliderColorOperation = false;\r\n }\r\n\r\n if (SumSliderMaintenance > 100) {\r\n SumSliderColorMaintenance = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderMaintenance} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorMaintenance = true;\r\n } else {\r\n SumSliderColorMaintenance = (\r\n \r\n Sum of categories: {SumSliderMaintenance} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorMaintenance = true;\r\n }\r\n if (SumSliderMaintenance === 100) {\r\n SumSliderColorMaintenance = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderMaintenance} %{\" \"}\r\n
\r\n );\r\n setStatusSliderColorMaintenance = false;\r\n }\r\n\r\n if (SumSliderEfficiency > 100) {\r\n SumSliderColorEfficiency = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderEfficiency} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorEfficiency = true;\r\n } else {\r\n SumSliderColorEfficiency = (\r\n \r\n Sum of categories: {SumSliderEfficiency} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorEfficiency = true;\r\n }\r\n if (SumSliderEfficiency === 100) {\r\n SumSliderColorEfficiency = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderEfficiency} %{\" \"}\r\n
\r\n );\r\n setStatusSliderColorEfficiency = false;\r\n }\r\n\r\n if (SumSliderEnvironment > 100) {\r\n SumSliderColorEnvironment = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderEnvironment} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorEnvironment = true;\r\n } else {\r\n SumSliderColorEnvironment = (\r\n \r\n Sum of categories: {SumSliderEnvironment} % (Categories must be normalised)\r\n
\r\n );\r\n setStatusSliderColorEnvironment = true;\r\n }\r\n if (SumSliderEnvironment === 100) {\r\n SumSliderColorEnvironment = (\r\n \r\n {\" \"}\r\n Sum of categories: {SumSliderEnvironment} %{\" \"}\r\n
\r\n );\r\n setStatusSliderColorEnvironment = false;\r\n }\r\n\r\n if (\r\n setStatusSliderColorQuality ||\r\n setStatusSliderColorFeed ||\r\n setStatusSliderColorOperation ||\r\n setStatusSliderColorMaintenance ||\r\n setStatusSliderColorEfficiency ||\r\n setStatusSliderColorEnvironment === true\r\n ) {\r\n setLimitOfSliderCriteria(true);\r\n } else {\r\n setLimitOfSliderCriteria(false);\r\n }\r\n\r\n return (\r\n \r\n {/*
Warning:
\r\n
Do not apply more or less than 100 %
*/}\r\n
Please note:
\r\n
\r\n Values can be typed in by selecting the blue numbers next to\r\n your category.\r\n
\r\n
\r\n \r\n
Quality \r\n
\r\n Slope of Particle Size Distribution:\r\n {\r\n setValuePSD(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n\r\n
\r\n Maximum Fineness:{\" \"}\r\n {\r\n setValueMaxFineness(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n\r\n
\r\n Dehydration:{\" \"}\r\n {\r\n setValueDehydration(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Drying:{\" \"}\r\n {\r\n setValueDrying(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n\r\n {SumSliderColorQuality}\r\n
\r\n
\r\n\r\n
Feed / Flexibility \r\n
\r\n Max. Feed Size:{\" \"}\r\n {\r\n setValueMaxFeedSize(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Product Changing Time:{\" \"}\r\n {\r\n setValueProductChangingTime(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n {SumSliderColorFeed}\r\n\r\n
\r\n
\r\n
Operation \r\n\r\n
\r\n Understanding of Process:{\" \"}\r\n {\r\n setValueUnderstandingOfProcess(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Sensitivity of Process:{\" \"}\r\n {\r\n setValueSensitivityOfProcess(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Controlabillity/ Personnel:{\" \"}\r\n {\r\n setValueControlabilityPersonnel(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Available Experience:{\" \"}\r\n {\r\n setValueAvailableExperience(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Throughput:{\" \"}\r\n {\r\n setValueAvailableExperience(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n {SumSliderColorOperation}\r\n\r\n
\r\n
\r\n
Maintenance \r\n\r\n
\r\n Maintenance Time:{\" \"}\r\n {\r\n setValueMaintenanceTime(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Complexity of Maintenance:{\" \"}\r\n {\r\n setValueComplexityOfMaintenance(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Wear Costs:{\" \"}\r\n {\r\n setValueWearCosts(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n {SumSliderColorMaintenance}\r\n\r\n
\r\n
\r\n
Efficiency \r\n\r\n
\r\n Energy Demand:{\" \"}\r\n {\r\n setValueEnergyDemand(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Water Demand:{\" \"}\r\n {\r\n setValueWaterDemand(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n {SumSliderColorEfficiency}\r\n\r\n
\r\n
\r\n
Environmental Impact \r\n\r\n
\r\n Dust Emissions:{\" \"}\r\n {\r\n setValueDustEmissions(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Noise:{\" \"}\r\n {\r\n setValueNoise(parseInt(newValue.target.value));\r\n }}\r\n />\r\n \r\n
\r\n
\r\n Effect of Vibration:{\" \"}\r\n {\r\n setValueEffectOfVibration(\r\n parseInt(newValue.target.value)\r\n );\r\n }}\r\n />\r\n \r\n
\r\n {SumSliderColorEnvironment}\r\n
\r\n
\r\n );\r\n } else {\r\n content = \r\n\r\n
}\r\n label=\"Customise (on your own responsibility)\"\r\n /> \r\n \r\n
\r\n Be aware that in case of an inexperienced user this option can\r\n have a high impact on the analysis. Only change the values if\r\n you are conscious of the effects.\r\n
\r\n
\r\n {content}\r\n
\r\n {/*
\r\n \r\n Scenario Details */}\r\n \r\n If you want to see an overview of the predefined weighting of\r\n all categories and criteria:\r\n
*/}\r\n \r\n \r\n */}\r\n
\r\n
European standard setting: \r\n
\r\n The ‘European standard setting’ has been proposed by the\r\n ECRA grinding experts. By selection of this setting type,\r\n the importance of all evaluation categories and criteria is\r\n predefined by the ECRA expert team to be in a good agreement\r\n with European market requirements (2020). Please note, that\r\n the selection of this setting predefines the importance of\r\n all categories and criteria.\r\n
\r\n
\r\n
Energy scenario: \r\n
\r\n By using the ‚energy scenario‘, a focus is set on the\r\n category ‚efficiency‘ with an importance of 40 %. The\r\n importance of all remaining categories are in the range of 5\r\n to 15 %. This setting is used to identify technologies with\r\n a low specific energy and water demand for cement grinding.\r\n Please note, that the selection of this setting predefines\r\n the importance of all categories and criteria.{\" \"}\r\n
\r\n
\r\n
Quality scenario: \r\n
\r\n To set the evaluation prioritisation on the category\r\n ‘quality’, the ‘quality scenario’ is predestined. The\r\n importance of ‘quality’ is set to 45 %, whereas all others\r\n vary between 5 to 15 %. This setting is used to identify\r\n technologies which provide an excellent product quality.\r\n Please note, that the selection of this setting predefines\r\n the importance of all categories and criteria.{\" \"}\r\n
\r\n
\r\n
Operation and maintenance scenario: \r\n
\r\n The ‘operation and maintenance scenario’ mainly focusses on\r\n the category ‘operation’ (30 % importance) and ‘maintenance’\r\n (25 % importance). With this option, it is possible to\r\n identify comminution devices with low maintenance effort,\r\n combined with good operation conditions. Please note, that\r\n the selection of this setting predefines the importance of\r\n all categories and criteria.{\" \"}\r\n
\r\n
\r\n
Quality and efficiency scenario: \r\n
\r\n In this scenario, the importance of ‘quality’ and\r\n ‘efficiency’ is set to 50 %, so that all other categories do\r\n not have any impact on the evaluation procedure. This\r\n scenario might be of interest, wherever the requirements of\r\n comminution are restricted to a fast, efficient production\r\n of high quality cement. Please note, that the selection of\r\n this setting predefines the importance of all categories and\r\n criteria.{\" \"}\r\n
\r\n
\r\n
Customised setting: \r\n
\r\n Please select this option to be able to set the category and\r\n criteria importance based on your own requirements and\r\n experiences.
\r\n
\r\n How to cite: Evaluation results have been created\r\n by individual user settings and do not necessarily comply\r\n with evaluation standards defined by ECRA’s grinding\r\n experts.\r\n
\r\n
\r\n \r\n Scenarios \r\n \r\n Type of Scenario: \r\n {\r\n setCategoryQuality(valueScenario);\r\n }}\r\n >\r\n \r\n {content2}\r\n \r\n \r\n );\r\n}\r\n","import React, { useState, useContext } from \"react\";\r\nimport InfoButtonApp from \"../../../../Container/InfoButton/infoButton_App\";\r\n\r\nimport Radio from \"@material-ui/core/Radio\";\r\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\r\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\r\nimport FormControl from \"@material-ui/core/FormControl\";\r\nimport FormLabel from \"@material-ui/core/FormLabel\";\r\n\r\nimport theDefaultContext from \"../defaultContext\";\r\n\r\nexport default function TypeOfApplication() {\r\n const { setFinalValueTypeOfApp } = useContext(theDefaultContext);\r\n\r\n const [valueTypeOfApp, setValueTypeOfApp] = useState(\"SC_Fine\"); // Default Value\r\n\r\n const handleChange = (event) => {\r\n setValueTypeOfApp(event.target.value);\r\n };\r\n setFinalValueTypeOfApp(valueTypeOfApp);\r\n\r\n let content;\r\n if (valueTypeOfApp === \"SC_Fine\") {\r\n content = (\r\n \r\n
Fine grinding: \r\n
\r\n Typical application for cement grinding in a fineness-range\r\n between 90 µm and 6 µm (D50).\r\n
\r\n
\r\n
Raw material grinding: \r\n
\r\n This option stands for common requirements for raw material\r\n grinding. This includes a focus on narrow ‘Particle size\r\n distributions’ (PSD).\r\n
\r\n
\r\n
Coarse grinding: \r\n
\r\n Option to choose for a needed fineness-range between 5 mm\r\n and 250 µm (D50). This setting might be of interest in case\r\n of pre-grinding devices.\r\n
\r\n
\r\n
Crushing: \r\n
\r\n This type of application is used for evaluating technologies\r\n suitable for crushing, where high throughputs and only a low\r\n amount of fines are of interest.\r\n
\r\n
\r\n
Ultra-fine grinding: \r\n
\r\n The option for ultra-fine grinding is implemented to\r\n evaluate technologies, which provide a fineness-range\r\n between 8 µm and 2 µm (D50).\r\n
\r\n
\r\n \r\n Type of Application \r\n \r\n BETA ~Work in progress \r\n
*/}\r\n \r\n \r\n Choose your comminution task:\r\n \r\n {\r\n setValueTypeOfApp(valueTypeOfApp);\r\n }}\r\n >\r\n {/* \r\n {content}\r\n \r\n \r\n );\r\n}\r\n","import React, { useContext, useState, useEffect } from \"react\";\r\nimport theDefaultContext from \"../../defaultContext\";\r\nimport { Backdrop, Button, ButtonBase, Paper } from \"@material-ui/core\";\r\nimport { HorizontalBar, Bar, Radar } from \"react-chartjs-2\";\r\n//import Axios from \"axios\";\r\n//import Table from \"reactstrap/lib/Table\";\r\nimport Autocomplete from \"@material-ui/lab/Autocomplete\";\r\nimport TextField from \"@material-ui/core/TextField\";\r\nimport CircularProgress from \"@material-ui/core/CircularProgress\";\r\nimport { makeStyles } from \"@material-ui/core/styles\";\r\n//import LinearProgress from \"@material-ui/core/LinearProgress\";\r\n//import IconDownloadSymbol from \"../../../../../Container/Icons/iconDownloadExcelFile\";\r\nimport CloudUploadIcon from \"@material-ui/icons/CloudUpload\";\r\n//import { isJSDocTemplateTag } from \"typescript\";\r\n//import fileDownload from \"js-file-download\";\r\nimport IconStart from \"../../../../../Container/Icons/iconStart\";\r\nimport IconSearch from \"../../../../../Container/Icons/iconDatabase\";\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\n\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel'; \r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root: {\r\n \"& > *\": {\r\n margin: theme.spacing(1),\r\n },\r\n color: \"#008000\",\r\n },\r\n root2: {\r\n justifyContent: \"center\",\r\n display: \"flex\",\r\n zIndex: 1,\r\n //position: \"absolute\", // löst Symbol von restlichen Layern\r\n flexWrap: \"wrap\",\r\n \"& > *\": {\r\n width: theme.spacing(60),\r\n height: theme.spacing(\"auto\"),\r\n },\r\n },\r\n backdrop: {\r\n zIndex: theme.zIndex.drawer + 1,\r\n color: \"#fff\",\r\n },\r\n}));\r\n\r\nexport default function DataSummaryFunction() {\r\n //manipulate Material UI CSS -> https://www.youtube.com/watch?v=rEHvPiLWSbQ\r\n const stylesLoadingChart = {\r\n rootLadebalken: {\r\n height: 80,\r\n backgroundColor: \"#ecf01494\",\r\n },\r\n\r\n rootStartButton: {\r\n //align: \"center\",\r\n fontSize: \"1.2rem\",\r\n backgroundColor: \"#F7F7F7\",\r\n padding: \"1rem 1rem 1rem 1rem\", // Abstand nach: Höhre BreiteRechts Tiefe BreiteLinks\r\n },\r\n };\r\n\r\n const stylesExcel = {\r\n root: {\r\n color: \"#008000\",\r\n },\r\n };\r\n const classes = useStyles();\r\n\r\n let normalise = false;\r\n // const useStylesLoadingChart = makeStyles(stylesLoadingChart);\r\n // const classesLoading = useStylesLoadingChart();\r\n\r\n const useStylesExcel = makeStyles(stylesExcel);\r\n //const classesExcel = useStylesExcel();\r\n\r\n //Radio-Button Type of Application\r\n const { finalValueTypeOfApp } = useContext(theDefaultContext);\r\n finalValueTypeOfApp.toString();\r\n let typeOfAppLabel = \"default\";\r\n if (finalValueTypeOfApp == \"SC_Raw_material\") {\r\n typeOfAppLabel = \"Raw material grinding\";\r\n } else if (finalValueTypeOfApp == \"SC_Crushing\") {\r\n typeOfAppLabel = \"Crushing\";\r\n } else if (finalValueTypeOfApp == \"SC_Coarse\") {\r\n typeOfAppLabel = \"Coarse grinding\";\r\n } else if (finalValueTypeOfApp == \"SC_Fine\") {\r\n typeOfAppLabel = \"Fine grinding\";\r\n } else if (finalValueTypeOfApp == \"SC_Ultrafine\") {\r\n typeOfAppLabel = \"Ultra-fine grinding\";\r\n }\r\n\r\n //Slider Alle Custom-Werte aus Scenarios\r\n const { categoryQualityCustom } = useContext(theDefaultContext);\r\n const { categoryFeedFlexCustom } = useContext(theDefaultContext);\r\n const { categoryOperationCustom } = useContext(theDefaultContext);\r\n const { categoryMaintenanceCustom } = useContext(theDefaultContext);\r\n const { categoryEfficiencyCustom } = useContext(theDefaultContext);\r\n const { categoryEnvironmentCustom } = useContext(theDefaultContext);\r\n\r\n //Slider alle PresetKategorien\r\n const { categoryQuality } = useContext(theDefaultContext);\r\n const { categoryFeedFlex } = useContext(theDefaultContext);\r\n const { categoryOperation } = useContext(theDefaultContext);\r\n const { categoryMaintenance } = useContext(theDefaultContext);\r\n const { categoryEfficiency } = useContext(theDefaultContext);\r\n const { categoryEnvironment } = useContext(theDefaultContext);\r\n\r\n //Slider alle Custom-Werte aus Scenario-Details\r\n const { psd } = useContext(theDefaultContext);\r\n const { maxFineness } = useContext(theDefaultContext);\r\n const { dehydration } = useContext(theDefaultContext);\r\n const { drying } = useContext(theDefaultContext);\r\n const { maxFeedSize } = useContext(theDefaultContext);\r\n const { productChangingTime } = useContext(theDefaultContext);\r\n const { understandingOfProcess } = useContext(theDefaultContext);\r\n const { sensitivityOfProcess } = useContext(theDefaultContext);\r\n const { controlabilityPersonnel } = useContext(theDefaultContext);\r\n const { availableExperience } = useContext(theDefaultContext);\r\n const { throughput } = useContext(theDefaultContext);\r\n const { maintenanceTime } = useContext(theDefaultContext);\r\n const { complexityOfMaintenance } = useContext(theDefaultContext);\r\n const { wearCosts } = useContext(theDefaultContext);\r\n const { energyDemand } = useContext(theDefaultContext);\r\n const { waterDemand } = useContext(theDefaultContext);\r\n const { dustEmissions } = useContext(theDefaultContext);\r\n const { noise } = useContext(theDefaultContext);\r\n const { effectOfVibration } = useContext(theDefaultContext);\r\n\r\n // Mill Selection\r\n const { millSelectionUserChoice } = useContext(theDefaultContext);\r\n // const { millSelectionCountMill } = useContext(theDefaultContext);\r\n // const { selectMillReceivedValue } = useContext(theDefaultContext);\r\n const { allMillsWithoutFilters, setAllMillsWithoutFilters } =\r\n useContext(theDefaultContext);\r\n\r\n // (SwitchValues) Variablen für Status der aktiven Benutzer-Auswahl für alle Artikel\r\n const { categoryRadioScenario } = useContext(theDefaultContext);\r\n const { criteriaRadioScenario } = useContext(theDefaultContext);\r\n const { limitOfSliderCategorie } = useContext(theDefaultContext);\r\n const { limitOfSliderCriteria } = useContext(theDefaultContext);\r\n const { millSelectRadioStatus } = useContext(theDefaultContext);\r\n \r\n let FilterStatus = \"default\";\r\n if (millSelectRadioStatus == \"all\") {\r\n FilterStatus = \"active filter\";\r\n } else {\r\n FilterStatus = \"inactive filter\";\r\n }\r\n\r\n\r\n\r\n\r\n // Finale Werte für Axios Formula (Konvertiere String in Float)\r\n //Categories:\r\n let finalValueQuality = parseFloat(categoryQuality);\r\n let finalValueFeedFlex = parseFloat(categoryFeedFlex);\r\n let finalValueOperation = parseFloat(categoryOperation);\r\n let finalValueMaintenance = parseFloat(categoryMaintenance);\r\n let finalValueEfficiency = parseFloat(categoryEfficiency);\r\n let finalValueEnvironment = parseFloat(categoryEnvironment);\r\n\r\n //Criterias:\r\n let finalValuePsd = parseFloat(psd);\r\n let finalValueMaxFineness = parseFloat(maxFineness);\r\n let finalValueDehydration = parseFloat(dehydration);\r\n let finalValueDrying = parseFloat(drying);\r\n let finalValueMaxFeedSize = parseFloat(maxFeedSize);\r\n let finalValueProductChangingTime = parseFloat(productChangingTime);\r\n let finalValueUnderstandingOfProcess = parseFloat(understandingOfProcess);\r\n let finalValueSensitivityOfProcess = parseFloat(sensitivityOfProcess);\r\n let finalValueControlabilityPersonnel = parseFloat(controlabilityPersonnel);\r\n let finalValueAvailableExperience = parseFloat(availableExperience);\r\n let finalValueThroughput = parseFloat(throughput);\r\n let finalValueMaintenanceTime = parseFloat(maintenanceTime);\r\n let finalValueComplexityOfMaintenance = parseFloat(complexityOfMaintenance);\r\n let finalValueWearCosts = parseFloat(wearCosts);\r\n let finalValueEnergyDemand = parseFloat(energyDemand);\r\n let finalValueWaterDemand = parseFloat(waterDemand);\r\n let finalValueDustEmissions = parseFloat(dustEmissions);\r\n let finalValueNoise = parseFloat(noise);\r\n let finalValueEffectOfVibration = parseFloat(effectOfVibration);\r\n\r\n // Mapping from Result for BarCharts\r\n const [finalScore, setFinalScore] = useState([]);\r\n const [finalList, setFinalList] = useState([]);\r\n const [options, setOptions] = useState([]);\r\n\r\n ///////////////////////////Variablen für ChartBars\r\n let finalMillsID = [];\r\n const [millSelek, setMillSelek] = useState(0);\r\n const [inspectMill, setInspectMill] = useState(\"\");\r\n //let finalInspectMill = inspectMill;\r\n\r\n // Avarage for all Category\r\n const [averageScoreQuality, setAverageScoreQuality] = useState([]);\r\n const [averageScoreFeed, setAverageScoreFeed] = useState([]);\r\n const [averageScoreOperation, setAverageScoreOperation] = useState([]);\r\n const [averageScoreMaintenance, setAverageScoreMaintenance] = useState([]);\r\n const [averageScoreEfficiency, setAverageScoreEfficiency] = useState([]);\r\n const [averageScoreEnvironmImp, setAverageScoreEnvironmImp] = useState([]);\r\n\r\n // const [resultBackend, setResultBackend] = useState(options.result); // einzelnes Element aus Array zuweisen\r\n const [axiosResponse, setAxiosResponse] = useState([]);\r\n const [loadAnalysis, setLoadAnalysis] = useState(false);\r\n const [analysisIsReadyToShow, setAnalysisIsReadyToShow] = useState(false);\r\n\r\n // const [count, setCount] = useState(0);\r\n var DisableButton = false;\r\n const [state, setState] = React.useState({\r\n checkedF: false, \r\n });\r\n //console.log(\"state.checkedF\" + state.checkedF)\r\n const handleChange = (event) => {\r\n setState({ ...state, [event.target.name]: event.target.checked });\r\n };\r\n\r\n\r\n\r\n\r\n // (SwitchValues_Methods) Methoden für Status der aktiven Benutzer-Auswahl für alle Artikel\r\n //Articel: Scenarios:\r\n if (categoryRadioScenario === \"Custom\") {\r\n finalValueQuality = categoryQualityCustom;\r\n finalValueFeedFlex = categoryFeedFlexCustom;\r\n finalValueOperation = categoryOperationCustom;\r\n finalValueMaintenance = categoryMaintenanceCustom;\r\n finalValueEfficiency = categoryEfficiencyCustom;\r\n finalValueEnvironment = categoryEnvironmentCustom;\r\n } else {\r\n finalValueQuality = categoryQuality;\r\n finalValueFeedFlex = categoryFeedFlex;\r\n finalValueOperation = categoryOperation;\r\n finalValueMaintenance = categoryMaintenance;\r\n finalValueEfficiency = categoryEfficiency;\r\n finalValueEnvironment = categoryEnvironment;\r\n }\r\n /////////////////////////////////////////////////////////////////////////////////////////FINAL VALUES:\r\n // Articel: Scenario-Details:\r\n if (criteriaRadioScenario === true) {\r\n finalValuePsd = psd;\r\n finalValueMaxFineness = maxFineness;\r\n finalValueDehydration = dehydration;\r\n finalValueDrying = drying;\r\n finalValueMaxFeedSize = maxFeedSize;\r\n finalValueProductChangingTime = productChangingTime;\r\n finalValueUnderstandingOfProcess = understandingOfProcess;\r\n finalValueSensitivityOfProcess = sensitivityOfProcess;\r\n finalValueControlabilityPersonnel = controlabilityPersonnel;\r\n finalValueAvailableExperience = availableExperience;\r\n finalValueThroughput = throughput;\r\n finalValueMaintenanceTime = maintenanceTime;\r\n finalValueComplexityOfMaintenance = complexityOfMaintenance;\r\n finalValueWearCosts = wearCosts;\r\n finalValueEnergyDemand = energyDemand;\r\n finalValueWaterDemand = waterDemand;\r\n finalValueDustEmissions = dustEmissions;\r\n finalValueNoise = noise;\r\n finalValueEffectOfVibration = effectOfVibration;\r\n } else {\r\n //manuell, da es nur eine Preset für Scenario Details gibt:\r\n finalValuePsd = 0.35;\r\n finalValueMaxFineness = 0.3;\r\n finalValueDehydration = 0.2;\r\n finalValueDrying = 0.15;\r\n finalValueMaxFeedSize = 0.6;\r\n finalValueProductChangingTime = 0.4;\r\n finalValueUnderstandingOfProcess = 0.05;\r\n finalValueSensitivityOfProcess = 0.25;\r\n finalValueControlabilityPersonnel = 0.2;\r\n finalValueAvailableExperience = 0.2;\r\n finalValueThroughput = 0.3;\r\n finalValueMaintenanceTime = 0.4;\r\n finalValueComplexityOfMaintenance = 0.2;\r\n finalValueWearCosts = 0.4;\r\n finalValueEnergyDemand = 0.95;\r\n finalValueWaterDemand = 0.05;\r\n finalValueDustEmissions = 0.3;\r\n finalValueNoise = 0.5;\r\n finalValueEffectOfVibration = 0.2;\r\n }\r\n\r\n // Logik, damit der Wert 0 in die Rechnung übernommen wird:\r\n if (finalValueQuality === 0) {\r\n finalValueQuality = 0.001;\r\n } else {\r\n }\r\n if (finalValueFeedFlex === 0) {\r\n finalValueFeedFlex = 0.001;\r\n } else {\r\n }\r\n if (finalValueOperation === 0) {\r\n finalValueOperation = 0.001;\r\n } else {\r\n }\r\n if (finalValueMaintenance === 0) {\r\n finalValueMaintenance = 0.001;\r\n } else {\r\n }\r\n if (finalValueEfficiency === 0) {\r\n finalValueEfficiency = 0.001;\r\n } else {\r\n }\r\n if (finalValueEnvironment === 0) {\r\n finalValueEnvironment = 0.001;\r\n } else {\r\n }\r\n\r\n if (finalValuePsd === 0) {\r\n finalValuePsd = 0.001;\r\n } else {\r\n }\r\n if (finalValueMaxFineness === 0) {\r\n finalValueMaxFineness = 0.001;\r\n } else {\r\n }\r\n if (finalValueDehydration === 0) {\r\n finalValueDehydration = 0.001;\r\n } else {\r\n }\r\n if (finalValueDrying === 0) {\r\n finalValueDrying = 0.001;\r\n } else {\r\n }\r\n if (finalValueMaxFeedSize === 0) {\r\n finalValueMaxFeedSize = 0.001;\r\n } else {\r\n }\r\n if (finalValueProductChangingTime === 0) {\r\n finalValueProductChangingTime = 0.001;\r\n } else {\r\n }\r\n if (finalValueUnderstandingOfProcess === 0) {\r\n finalValueUnderstandingOfProcess = 0.001;\r\n } else {\r\n }\r\n if (finalValueSensitivityOfProcess === 0) {\r\n finalValueSensitivityOfProcess = 0.001;\r\n } else {\r\n }\r\n if (finalValueControlabilityPersonnel === 0) {\r\n finalValueControlabilityPersonnel = 0.001;\r\n } else {\r\n }\r\n if (finalValueAvailableExperience === 0) {\r\n finalValueAvailableExperience = 0.001;\r\n } else {\r\n }\r\n if (finalValueThroughput === 0) {\r\n finalValueThroughput = 0.001;\r\n } else {\r\n }\r\n if (finalValueMaintenanceTime === 0) {\r\n finalValueMaintenanceTime = 0.001;\r\n } else {\r\n }\r\n if (finalValueComplexityOfMaintenance === 0) {\r\n finalValueComplexityOfMaintenance = 0.001;\r\n } else {\r\n }\r\n if (finalValueWearCosts === 0) {\r\n finalValueWearCosts = 0.001;\r\n } else {\r\n }\r\n if (finalValueEnergyDemand === 0) {\r\n finalValueEnergyDemand = 0.001;\r\n } else {\r\n }\r\n if (finalValueWaterDemand === 0) {\r\n finalValueWaterDemand = 0.001;\r\n } else {\r\n }\r\n if (finalValueDustEmissions === 0) {\r\n finalValueDustEmissions = 0.001;\r\n } else {\r\n }\r\n if (finalValueNoise === 0) {\r\n finalValueNoise = 0.001;\r\n } else {\r\n }\r\n if (finalValueEffectOfVibration === 0) {\r\n finalValueEffectOfVibration = 0.001;\r\n } else {\r\n }\r\n\r\n //Axios Formular:\r\n let triggerAxios = () => {\r\n setAnalysisIsReadyToShow(false);\r\n setInspectMill(\"undefined\")\r\n setFinalList([])\r\n const text = \"löse Funktion >>triggerAxios<< aus\";\r\n const axios = require(\"axios\");\r\n let data = JSON.stringify({\r\n typeOfApplication: finalValueTypeOfApp,\r\n scenarioStatus: categoryRadioScenario,\r\n comparisonMills: finalMillsID,\r\n millSelectStatus: millSelectRadioStatus,\r\n inputPresets: [\r\n {\r\n category: \"Quality\",\r\n criteria: \"KGV_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValuePsd,\r\n maximumWeights: 7,\r\n thresholds: 5,\r\n },\r\n {\r\n category: \"Quality\",\r\n criteria: \"Feinheit_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValueMaxFineness,\r\n maximumWeights: 8,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Quality\",\r\n criteria: \"Dehydration_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValueDehydration,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Quality\",\r\n criteria: \"Trocknen_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValueDrying,\r\n maximumWeights: 7,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Feed/Flexibility\",\r\n criteria: \"MaxAufgabekorngroesse_SC\",\r\n categoriesImportance: finalValueFeedFlex,\r\n criteriaImportance: finalValueMaxFeedSize,\r\n maximumWeights: 8,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Feed/Flexibility\",\r\n criteria: \"Wechselzeit_SC\",\r\n categoriesImportance: finalValueFeedFlex,\r\n criteriaImportance: finalValueProductChangingTime,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"ProzessVerstaendniss_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueUnderstandingOfProcess,\r\n maximumWeights: 8,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Sensibilitaet_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueSensitivityOfProcess,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Kontrollierbarkeit_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueControlabilityPersonnel,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Erfahrung_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueAvailableExperience,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Durchsatz_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueThroughput,\r\n maximumWeights: 9,\r\n thresholds: 4,\r\n },\r\n {\r\n category: \"Maintenance\",\r\n criteria: \"Instandhaltungszeit_SC\",\r\n categoriesImportance: finalValueMaintenance,\r\n criteriaImportance: finalValueMaintenanceTime,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Maintenance\",\r\n criteria: \"Instandhaltung_SC\",\r\n categoriesImportance: finalValueMaintenance,\r\n criteriaImportance: finalValueComplexityOfMaintenance,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Maintenance\",\r\n criteria: \"Verschleisskosten_SC\",\r\n categoriesImportance: finalValueMaintenance,\r\n criteriaImportance: finalValueWearCosts,\r\n maximumWeights: 7,\r\n thresholds: 4,\r\n },\r\n {\r\n category: \"Efficiency\",\r\n criteria: \"Energiebedarf_SC\",\r\n categoriesImportance: finalValueEfficiency,\r\n criteriaImportance: finalValueEnergyDemand,\r\n maximumWeights: 8,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Efficiency\",\r\n criteria: \"Wasserbedarf_SC\",\r\n categoriesImportance: finalValueEfficiency,\r\n criteriaImportance: finalValueWaterDemand,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Environmental_Impact\",\r\n criteria: \"Staubemissionen_SC\",\r\n categoriesImportance: finalValueEnvironment,\r\n criteriaImportance: finalValueDustEmissions,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Environmental_Impact\",\r\n criteria: \"Laerm_SC\",\r\n categoriesImportance: finalValueEnvironment,\r\n criteriaImportance: finalValueNoise,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Environmental_Impact\",\r\n criteria: \"Schwingungseinwirkung_SC\",\r\n categoriesImportance: finalValueEnvironment,\r\n criteriaImportance: finalValueEffectOfVibration,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n ],\r\n });\r\n let config = {\r\n method: \"post\",\r\n url: \"/api/mills/analyze/all\",\r\n headers: {\r\n \"Content-Type\": \"application/json\",\r\n },\r\n data: data,\r\n };\r\n axios(config)\r\n .then((response) => {\r\n ////console.log(JSON.stringify(response.data)); // zeig Werte der Backend Rechnung\r\n setAxiosResponse(response.data);\r\n setOptions(Object.keys(data).map((result) => data[result]));\r\n \r\n if (response.data !== null) { // TODO\r\n //console.log(\"response.data\" + response.data);\r\n setAnalysisIsReadyToShow(true);\r\n }\r\n })\r\n .catch((error) => {\r\n //console.log(error);\r\n });\r\n\r\n\r\n\r\n\r\n setInspectMill(finalList[0][0]);\r\n try {\r\n\r\n\r\n setFinalScore([axiosResponse.map((item) => item.finalScore)]); //item.finalScore\r\n setFinalList([axiosResponse.map((item) => item.millname)]);\r\n\r\n setAverageScoreQuality([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.quality\r\n .comparisonResult +\r\n item.result.verticalMillComparison.quality\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.quality\r\n .comparisonResult +\r\n item.result.hororMillComparison.quality\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n setAverageScoreFeed([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.feed.comparisonResult +\r\n item.result.verticalMillComparison.feed\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.feed\r\n .comparisonResult +\r\n item.result.hororMillComparison.feed\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreOperation([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.operation\r\n .comparisonResult +\r\n item.result.verticalMillComparison.operation\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.operation\r\n .comparisonResult +\r\n item.result.hororMillComparison.operation\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreMaintenance([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.maintenance\r\n .comparisonResult +\r\n item.result.verticalMillComparison.maintenance\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.maintenance\r\n .comparisonResult +\r\n item.result.hororMillComparison.maintenance\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreEfficiency([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.efficiency\r\n .comparisonResult +\r\n item.result.verticalMillComparison.efficiency\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.efficiency\r\n .comparisonResult +\r\n item.result.hororMillComparison.efficiency\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreEnvironmImp([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.environmentalImpact\r\n .comparisonResult +\r\n item.result.verticalMillComparison\r\n .environmentalImpact.comparisonResult +\r\n item.result.rollerPressMillComparison\r\n .environmentalImpact.comparisonResult +\r\n item.result.hororMillComparison.environmentalImpact\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n\r\n } catch {\r\n\r\n }\r\n };\r\n\r\n \r\n\r\n\r\n let triggerExcelFile = () => {\r\n //const text = \"löse Funktion >>triggerAxios<< aus\";\r\n const axios = require(\"axios\");\r\n let data = JSON.stringify({\r\n typeOfApplication: finalValueTypeOfApp,\r\n scenarioStatus: categoryRadioScenario,\r\n comparisonMills: finalMillsID,\r\n millSelectStatus: millSelectRadioStatus, \r\n inputPresets: [\r\n {\r\n category: \"Quality\",\r\n criteria: \"KGV_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValuePsd,\r\n maximumWeights: 7,\r\n thresholds: 5,\r\n },\r\n {\r\n category: \"Quality\",\r\n criteria: \"Feinheit_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValueMaxFineness,\r\n maximumWeights: 8,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Quality\",\r\n criteria: \"Dehydration_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValueDehydration,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Quality\",\r\n criteria: \"Trocknen_SC\",\r\n categoriesImportance: finalValueQuality,\r\n criteriaImportance: finalValueDrying,\r\n maximumWeights: 7,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Feed/Flexibility\",\r\n criteria: \"MaxAufgabekorngroesse_SC\",\r\n categoriesImportance: finalValueFeedFlex,\r\n criteriaImportance: finalValueMaxFeedSize,\r\n maximumWeights: 8,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Feed/Flexibility\",\r\n criteria: \"Wechselzeit_SC\",\r\n categoriesImportance: finalValueFeedFlex,\r\n criteriaImportance: finalValueProductChangingTime,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"ProzessVerstaendniss_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueUnderstandingOfProcess,\r\n maximumWeights: 8,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Sensibilitaet_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueSensitivityOfProcess,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Kontrollierbarkeit_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueControlabilityPersonnel,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Erfahrung_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueAvailableExperience,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Operation\",\r\n criteria: \"Durchsatz_SC\",\r\n categoriesImportance: finalValueOperation,\r\n criteriaImportance: finalValueThroughput,\r\n maximumWeights: 9,\r\n thresholds: 4,\r\n },\r\n {\r\n category: \"Maintenance\",\r\n criteria: \"Instandhaltungszeit_SC\",\r\n categoriesImportance: finalValueMaintenance,\r\n criteriaImportance: finalValueMaintenanceTime,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Maintenance\",\r\n criteria: \"Instandhaltung_SC\",\r\n categoriesImportance: finalValueMaintenance,\r\n criteriaImportance: finalValueComplexityOfMaintenance,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Maintenance\",\r\n criteria: \"Verschleisskosten_SC\",\r\n categoriesImportance: finalValueMaintenance,\r\n criteriaImportance: finalValueWearCosts,\r\n maximumWeights: 7,\r\n thresholds: 4,\r\n },\r\n {\r\n category: \"Efficiency\",\r\n criteria: \"Energiebedarf_SC\",\r\n categoriesImportance: finalValueEfficiency,\r\n criteriaImportance: finalValueEnergyDemand,\r\n maximumWeights: 8,\r\n thresholds: 3,\r\n },\r\n {\r\n category: \"Efficiency\",\r\n criteria: \"Wasserbedarf_SC\",\r\n categoriesImportance: finalValueEfficiency,\r\n criteriaImportance: finalValueWaterDemand,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Environmental_Impact\",\r\n criteria: \"Staubemissionen_SC\",\r\n categoriesImportance: finalValueEnvironment,\r\n criteriaImportance: finalValueDustEmissions,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Environmental_Impact\",\r\n criteria: \"Laerm_SC\",\r\n categoriesImportance: finalValueEnvironment,\r\n criteriaImportance: finalValueNoise,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n {\r\n category: \"Environmental_Impact\",\r\n criteria: \"Schwingungseinwirkung_SC\",\r\n categoriesImportance: finalValueEnvironment,\r\n criteriaImportance: finalValueEffectOfVibration,\r\n maximumWeights: 7,\r\n thresholds: 1,\r\n },\r\n ],\r\n });\r\n const FileDownload = require(\"js-file-download\");\r\n let config = {\r\n method: \"post\",\r\n responseType: \"blob\",\r\n url: \"api/download\",\r\n headers: {\r\n \"Content-Type\": \"application/json\",\r\n // \"Content-Disposition\": \"attachment;filename=ExcelReport.xls\",\r\n // \"Content-Type\": \"application/ms-excel\",\r\n },\r\n data: data,\r\n };\r\n axios(config)\r\n .then((response) => {\r\n //console.log(\"response.data\" + response.data.length);\r\n var currentdate = new Date(); \r\n FileDownload(response.data, [\"FGT_AHP_\" + yyyymmddhhmm(currentdate)+\"_\" + finalValueTypeOfApp+\"_\"+categoryRadioScenario+\".xlsx\"]);\r\n \r\n \r\n\r\n })\r\n .catch((error) => {\r\n //console.log(error);\r\n });\r\n };\r\n\r\n // Avarages Logic\r\n useEffect(() => {\r\n\r\n try {\r\n\r\n\r\n setFinalScore([axiosResponse.map((item) => item.finalScore)]); //item.finalScore\r\n setFinalList([axiosResponse.map((item) => item.millname)]);\r\n\r\n setAverageScoreQuality([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.quality\r\n .comparisonResult +\r\n item.result.verticalMillComparison.quality\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.quality\r\n .comparisonResult +\r\n item.result.hororMillComparison.quality\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n setAverageScoreFeed([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.feed.comparisonResult +\r\n item.result.verticalMillComparison.feed\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.feed\r\n .comparisonResult +\r\n item.result.hororMillComparison.feed\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreOperation([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.operation\r\n .comparisonResult +\r\n item.result.verticalMillComparison.operation\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.operation\r\n .comparisonResult +\r\n item.result.hororMillComparison.operation\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreMaintenance([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.maintenance\r\n .comparisonResult +\r\n item.result.verticalMillComparison.maintenance\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.maintenance\r\n .comparisonResult +\r\n item.result.hororMillComparison.maintenance\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreEfficiency([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.efficiency\r\n .comparisonResult +\r\n item.result.verticalMillComparison.efficiency\r\n .comparisonResult +\r\n item.result.rollerPressMillComparison.efficiency\r\n .comparisonResult +\r\n item.result.hororMillComparison.efficiency\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n setAverageScoreEnvironmImp([\r\n axiosResponse.map(\r\n (item) =>\r\n (\r\n (item.result.ballMillComparison.environmentalImpact\r\n .comparisonResult +\r\n item.result.verticalMillComparison\r\n .environmentalImpact.comparisonResult +\r\n item.result.rollerPressMillComparison\r\n .environmentalImpact.comparisonResult +\r\n item.result.hororMillComparison.environmentalImpact\r\n .comparisonResult) /\r\n 4\r\n ).toFixed(1),\r\n 2\r\n ),\r\n ]);\r\n\r\n\r\n } catch {\r\n\r\n }\r\n\r\n\r\n }, [axiosResponse]);\r\n\r\n function yyyymmddhhmm(dateIn) {\r\n var yyyy = dateIn.getFullYear();\r\n var mm = dateIn.getMonth() + 1; // getMonth() is zero-based\r\n var dd = dateIn.getDate();\r\n var h = dateIn.getHours();\r\n if (h < 10) {\r\n h = [\"0\" + h];\r\n }\r\n var m = dateIn.getMinutes(); \r\n if (m < 10) {\r\n m = [\"0\" + m];\r\n }\r\n\r\n\r\n return String(10000 * yyyy + 100 * mm + dd+\"-\"+h+m); // Leading zeros for mm and dd\r\n }\r\n\r\n\r\n\r\n // Ladebalken für jede Berechnung\r\n let contentLoadingAct;\r\n const [open, setOpen] = useState(false);\r\n const triggerLoadingProzess = () => {\r\n setOpen(!open);\r\n };\r\n let triggerLoadingAct = () => {\r\n contentLoadingAct = (\r\n \r\n \r\n \r\n
\r\n Loading ... \r\n \r\n \r\n {\" \"}\r\n \r\n \r\n );\r\n };\r\n\r\n // Continue Button ausblenden, wenn Werte aus Scenarios und Scenario-Details gößer als 100% sind\r\n let contentA;\r\n let contentB; \r\n \r\n \r\n // DisableButton = false;\r\n // if (categoryRadioScenario === \"Custom\") {\r\n\r\n if (limitOfSliderCriteria === true && limitOfSliderCategorie === true && categoryRadioScenario === \"Custom\") {\r\n contentA = (\r\n
\r\n );\r\n DisableButton = true;\r\n contentB =
;\r\n } else {\r\n\r\n DisableButton = false;\r\n\r\n if (limitOfSliderCategorie === true && categoryRadioScenario === \"Custom\") {\r\n contentA = (\r\n
\r\n The sum of the categories is not 100%.\r\n \r\n \r\n );\r\n DisableButton = true;\r\n normalise = true;\r\n } else {\r\n contentA = (
);\r\n DisableButton = false;\r\n normalise = false;\r\n //console.log(\"DisableButton\" + DisableButton);\r\n }\r\n //console.log(\"DisableButton\" + DisableButton)\r\n if (limitOfSliderCriteria === true && categoryRadioScenario === \"Custom\") {\r\n contentB = (\r\n
\r\n );\r\n DisableButton = true;\r\n normalise = true;\r\n } else {\r\n contentB = (
);\r\n DisableButton = false;\r\n normalise = false;\r\n //console.log(\"DisableButton\" + DisableButton);\r\n }\r\n\r\n\r\n } \r\n\r\n // } \r\n \r\n // Switch Value für Artikel: Mill Selection.\r\n if (millSelectRadioStatus === \"all\" || allMillsWithoutFilters === true) {\r\n finalMillsID = [\r\n 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,\r\n 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36,\r\n 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53,\r\n 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67\r\n ];\r\n } else if (\r\n millSelectRadioStatus === \"individual\" &&\r\n allMillsWithoutFilters === false\r\n ) {\r\n finalMillsID = millSelectionUserChoice;\r\n }\r\n\r\n let warntextMillSelection;\r\n if (millSelectRadioStatus === \"\") {\r\n DisableButton = true;\r\n warntextMillSelection =\r\n \"You have not selected a mill, please enter a mill in Articel >>Mill Selection<< for comparison\";\r\n } else {\r\n DisableButton = false;\r\n\r\n }\r\n\r\n // BarChart JS\r\n let scaleBarChart_Mini = {\r\n yAxes: [\r\n {\r\n ticks: {\r\n display: true,\r\n autoSkip: false,\r\n maxTicksLimit: 10,\r\n beginAtZero: true,\r\n suggestedMax: 100,\r\n },\r\n gridLines: {\r\n display: true,\r\n },\r\n },\r\n ],\r\n xAxes: [\r\n {\r\n categoryPercentage: 0.5, // Abstand zwischen den Balken -> Warum keine Auswirkung?\r\n gridLines: {\r\n display: false,\r\n offsetGridLines: false,\r\n },\r\n },\r\n ],\r\n };\r\n\r\n //Button Switch -> Show Graphics\r\n const [checked, setChecked] = useState(false);\r\n\r\n let triggerContenChartsandGraphics = () => {\r\n setChecked(true);\r\n if (checked === true) {\r\n contenChartsandGraphics = Hallo
;\r\n } else {\r\n contenChartsandGraphics = null;\r\n }\r\n };\r\n\r\n const [progress, setProgress] = useState(0);\r\n const [buffer, setBuffer] = useState(10);\r\n const progressRef = React.useRef(() => {});\r\n\r\n useEffect(() => {\r\n if (loadAnalysis == true) {\r\n progressRef.current = () => {\r\n if (progress > 100) {\r\n setProgress(0);\r\n setBuffer(10);\r\n }\r\n // else {\r\n // const diff = Math.random() * 10;\r\n // const diff2 = Math.random() * 10;\r\n // setProgress(progress + diff);\r\n // setBuffer(progress + diff + diff2);\r\n // }\r\n if (progress >= 100) {\r\n setLoadAnalysis(false);\r\n ////console.log(\"progress war bei 100\");\r\n }\r\n if (analysisIsReadyToShow == true) {\r\n ////console.log(\"Axios war schneller fertig\");\r\n setProgress(100);\r\n }\r\n };\r\n } else {\r\n progressRef.current = () => {};\r\n }\r\n // Falls das mal jemand weiterbearbeitet, sorry für das folgende...\r\n if ((limitOfSliderCriteria === true && limitOfSliderCategorie === true) || (limitOfSliderCriteria == \"\" && limitOfSliderCategorie == \"\") || (limitOfSliderCriteria == \"\" && limitOfSliderCategorie == true) || (limitOfSliderCriteria == true && limitOfSliderCategorie == \"\") || state.checkedF == true) {\r\n DisableButton = false;\r\n } else {\r\n DisableButton = true;\r\n }\r\n\r\n\r\n //console.log(\"DisableButton\" + DisableButton)\r\n\r\n //console.log(\"limitOfSliderCriteria\" + limitOfSliderCriteria)\r\n\r\n //console.log(\"limitOfSliderCategorie\" + limitOfSliderCategorie)\r\n\r\n });\r\n\r\n useEffect(() => {\r\n const timer = setInterval(() => {\r\n progressRef.current();\r\n }, 1400); // Dauer, bis der Ladebalken fertig ist\r\n\r\n return () => {\r\n clearInterval(timer);\r\n };\r\n }, []);\r\n\r\n useEffect(() => {\r\n // UseEffect -> nur für console Log Ausgabe\r\n // //console.log(\"inspectMill\", inspectMill);\r\n // //console.log(\"AxiosResponse\", axiosResponse);\r\n // //console.log(\"AxiosResponse.millname\", axiosResponse.millname);\r\n }, [inspectMill, axiosResponse, options]);\r\n\r\n let contenChartsandGraphics; // gibt den gesamten Kontext an Grafik wieder\r\n\r\n let finalListAsObject = finalList.map((item) => {\r\n let objectArray = Object.entries(item);\r\n //Lösungsansatz aus:\r\n //https://stackoverflow.com/questions/42974735/create-object-from-array/42974762\r\n\r\n let objectMapping = objectArray.map(\r\n (elements) =>\r\n (elements = Object.assign(\r\n {},\r\n elements.reduce((acc, cur) => ({\r\n Millname: cur,\r\n keys: parseInt(acc),\r\n }))\r\n ))\r\n );\r\n\r\n return objectMapping;\r\n });\r\n\r\n\r\n //console.log(\"inspectMill\"+ inspectMill)\r\n if (finalListAsObject != null && finalListAsObject != \"\") {\r\n\r\n var linkToDB = \"\"\r\n //console.log(\" finalListAsObject\" + finalListAsObject[0][0][\"Millname\"])\r\n if (inspectMill == null || inspectMill == \"\" || inspectMill == \"undefined\") {\r\n var linkToDB = \"/technologydatabase?name=\" + finalListAsObject[0][0][\"Millname\"];\r\n\r\n }\r\n if (inspectMill != null && inspectMill != \"\" && inspectMill != \"undefined\") {\r\n var linkToDB = \"/technologydatabase?name=\" + inspectMill;\r\n }\r\n //console.log(\"inspectMill\" + inspectMill)\r\n\r\n }\r\n\r\n if (\r\n checked === true &&\r\n analysisIsReadyToShow === true &&\r\n loadAnalysis === false\r\n ) {\r\n\r\n var diagramHeight = Math.ceil(finalList[0].length * 10);\r\n\r\n if (finalList[0].length<10) {\r\n diagramHeight = 100;\r\n }\r\n \r\n\r\n\r\n contenChartsandGraphics = (\r\n \r\n
\r\n
\r\n
\r\n \r\n Final Ranking \r\n \r\n Total number of technologies involved in\r\n calculation: {finalList[0].length} out of 67\r\n
\r\n \r\n Type of Application: {typeOfAppLabel} (\r\n {FilterStatus})\r\n
\r\n {/* //finalValueTypeOfApp */}\r\n Scenario : {categoryRadioScenario}
\r\n \r\n option.Millname.toString() //+ //console.log(\"\")\r\n }\r\n />\r\n \r\n \r\n \r\n \r\n option.Millname\r\n } //option.Millname\r\n defaultValue={finalListAsObject[0][0]} \r\n onClick\r\n onChange={(event, value) => {\r\n setMillSelek(value.keys);\r\n setInspectMill(value.Millname);\r\n }}\r\n style={{ width: 300 }}\r\n renderInput={(params) => (\r\n \r\n Go to Database \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 if (loadAnalysis === true) {\r\n triggerLoadingAct();\r\n } else {\r\n }\r\n let textFinishedLoading;\r\n if (\r\n checked === true &&\r\n analysisIsReadyToShow === true &&\r\n loadAnalysis === false\r\n ) {\r\n textFinishedLoading =
;\r\n }\r\n\r\n\r\n\r\n var ButtonEvalText;\r\n ButtonEvalText = \"Start evaluation\";\r\n \r\n\r\n var disabledStyle;\r\n if (DisableButton == true) {\r\n disabledStyle = (\r\n { color: 'red' }\r\n )\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\r\n \r\n {\r\n triggerContenChartsandGraphics();\r\n triggerAxios();\r\n setLoadAnalysis(true);\r\n setProgress(0);\r\n setBuffer(10);\r\n triggerLoadingProzess();\r\n triggerLoadingAct();\r\n }}\r\n >\r\n \r\n \r\n */}\r\n \r\n {\r\n\r\n\r\n const user = \"xyz\";\r\n fetch(\"api/counter_AHP_Start/\" + String(user))\r\n\r\n \r\n if (DisableButton == false) {\r\n setFinalList([])\r\n finalListAsObject = [];\r\n setInspectMill(\"\")\r\n // //console.log(\"inspectMill2\" + inspectMill)\r\n triggerContenChartsandGraphics();\r\n triggerAxios();\r\n setLoadAnalysis(true);\r\n setProgress(0);\r\n setBuffer(10);\r\n triggerLoadingProzess();\r\n triggerLoadingAct();\r\n } \r\n\r\n }\r\n }\r\n >\r\n \r\n {ButtonEvalText} \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n {warntextMillSelection}
\r\n {contentA}\r\n {contentB}\r\n {textFinishedLoading} \r\n \r\n \r\n {contenChartsandGraphics}\r\n
\r\n
\r\n \r\n
\r\n {/* How to */}\r\n \r\n
\r\n \r\n \r\n \r\n ); \r\n } else {\r\n {\r\n // if there's no user, show the login form\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 To improve your browsing experience ECRA uses cookies. By using the login to this website you agree to store the login-information in cookies.\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","// In production, we register a service worker to serve assets from local cache.\r\n\r\n// This lets the app load faster on subsequent visits in production, and gives\r\n// it offline capabilities. However, it also means that developers (and users)\r\n// will only see deployed updates on the \"N+1\" visit to a page, since previously\r\n// cached resources are updated in the background.\r\n\r\n// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.\r\n// This link also includes instructions on opting out of this behavior.\r\n\r\nconst isLocalhost = Boolean(\r\n window.location.hostname === \"localhost\" ||\r\n // [::1] is the IPv6 localhost address.\r\n window.location.hostname === \"[::1]\" ||\r\n // 127.0.0.1/8 is considered localhost for IPv4.\r\n window.location.hostname.match(\r\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\r\n )\r\n);\r\n\r\nexport default function register() {\r\n if (process.env.NODE_ENV === \"production\" && \"serviceWorker\" in navigator) {\r\n // The URL constructor is available in all browsers that support SW.\r\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location);\r\n if (publicUrl.origin !== window.location.origin) {\r\n // Our service worker won't work if PUBLIC_URL is on a different origin\r\n // from what our page is served on. This might happen if a CDN is used to\r\n // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374\r\n return;\r\n }\r\n\r\n window.addEventListener(\"load\", () => {\r\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\r\n\r\n if (isLocalhost) {\r\n // This is running on localhost. Lets check if a service worker still exists or not.\r\n checkValidServiceWorker(swUrl);\r\n } else {\r\n // Is not local host. Just register service worker\r\n registerValidSW(swUrl);\r\n }\r\n });\r\n }\r\n}\r\n\r\nfunction registerValidSW(swUrl) {\r\n navigator.serviceWorker\r\n .register(swUrl)\r\n .then((registration) => {\r\n registration.onupdatefound = () => {\r\n const installingWorker = registration.installing;\r\n installingWorker.onstatechange = () => {\r\n if (installingWorker.state === \"installed\") {\r\n if (navigator.serviceWorker.controller) {\r\n // At this point, the old content will have been purged and\r\n // the fresh content will have been added to the cache.\r\n // It's the perfect time to display a \"New content is\r\n // available; please refresh.\" message in your web app.\r\n console.log(\r\n \"New content is available; please refresh.\"\r\n );\r\n } else {\r\n // At this point, everything has been precached.\r\n // It's the perfect time to display a\r\n // \"Content is cached for offline use.\" message.\r\n //console.log(\"Content is cached for offline use.\");\r\n }\r\n }\r\n };\r\n };\r\n })\r\n .catch((error) => {\r\n console.error(\"Error during service worker registration:\", error);\r\n });\r\n}\r\n\r\nfunction checkValidServiceWorker(swUrl) {\r\n // Check if the service worker can be found. If it can't reload the page.\r\n fetch(swUrl)\r\n .then((response) => {\r\n // Ensure service worker exists, and that we really are getting a JS file.\r\n if (\r\n response.status === 404 ||\r\n response.headers.get(\"content-type\").indexOf(\"javascript\") ===\r\n -1\r\n ) {\r\n // No service worker found. Probably a different app. Reload the page.\r\n navigator.serviceWorker.ready.then((registration) => {\r\n registration.unregister().then(() => {\r\n window.location.reload();\r\n });\r\n });\r\n } else {\r\n // Service worker found. Proceed as normal.\r\n registerValidSW(swUrl);\r\n }\r\n })\r\n .catch(() => {\r\n console.log(\r\n \"No internet connection found. App is running in offline mode.\"\r\n );\r\n });\r\n}\r\n\r\nexport function unregister() {\r\n if (\"serviceWorker\" in navigator) {\r\n navigator.serviceWorker.ready.then((registration) => {\r\n registration.unregister();\r\n });\r\n }\r\n}\r\n","import React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport { BrowserRouter } from \"react-router-dom\";\r\nimport App from \"./App\";\r\nimport registerServiceWorker from \"./registerServiceWorker\";\r\nimport \"./custom.css\";\r\n\r\nconst baseUrl = document.getElementsByTagName(\"base\")[0].getAttribute(\"href\");\r\nconst rootElement = document.getElementById(\"root\");\r\n\r\nReactDOM.render(\r\n\r\n \r\n ,\r\n rootElement\r\n);\r\n\r\nregisterServiceWorker();\r\n"],"sourceRoot":""} ![](\"/image/ecra_logo.png\"/){kind=logo}
\r\n