history.push('/welcome')} label1='Home' isActive2={true} value2={()=>history.push('/admin')} label2='Administration'\r\n isActive3={false} label3='Staff-Administration' />\r\n \r\n Staff Administration
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default EmployeeAssign;\r\n\r\n\r\n\r\n","import { KeyboardDatePicker } from '@material-ui/pickers'\r\nimport React, { useState } from 'react'\r\nimport ReactModal from 'react-modal'\r\nimport { OnboardSelect } from '../../Onboard/OnboardComponents/Dropdown/Select';\r\n\r\nexport function AddReleaseModalPopup({ isOpen, setShowModal, children }) {\r\n\r\n return (<>\r\n\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '10em',\r\n left: '20em',\r\n width: '873px',\r\n height: '500px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '0',\r\n right: '0px',\r\n bottom: '0px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n )\r\n}\r\n\r\n\r\nconst category = [\r\n { id: 1, value: \"Production Releases\" },\r\n { id: 2, value: \"Planned Releases\" }\r\n]\r\n\r\nfunction AddReleaseUpdate(props) {\r\n const editMode = props.editMode;\r\n const [publishedDate, setPublishedDate] = useState();\r\n \r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n \r\n const PublishedDateHandler = (date) => {\r\n setPublishedDate(formatDate(date));\r\n props.addDateToRelease('publishedDate', formatDate(date))\r\n }\r\n\r\n return (\r\n <>\r\n \r\n { props.addReleaseValidation && Please ensure you have filled all the inputs with \"*\" mark
}\r\n \r\n \r\n {props.data.length === 0? No Releases Found for Selected Year & Month
: <> {props.data.map((data, i) =>\r\n \r\n \r\n {data.title}
\r\n {roleSelected==='Admin' && \r\n props.editHandler(data)} > \r\n props.deleteHandler(data)} style={{marginLeft:'30px'}}> \r\n
}\r\n \r\n {data.description}
\r\n \r\n )}}\r\n \r\n )\r\n}\r\n","import React, { useEffect, useState } from 'react';\r\nimport ClearFilter from '../../ReportTables/ClearFilters/ClearFilter';\r\nimport Filter from '../../ReportTables/ReportFilters/ReportFilters';\r\nimport HomeBreadcrumb from '../Welcome-LandingPage/Home-Breadcrumb';\r\nimport AddReleaseUpdate, { AddReleaseModalPopup } from './AddReleaseUpdate';\r\nimport { ReleaseCard } from './ProductionPlanned';\r\nimport './ReleaseHandler.css';\r\nimport { DeleteFragment, DeleteModalPopup } from '../../Onboard/OnboardComponents/Modals/DeleteModalPopup';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { createLatestReleasesStart, deleteLatestReleasesStart, getLatestReleasesStart, updateLatestReleasesStart } from '../../../actions/welcomePage.action';\r\n\r\nconst DATA = {\r\n period_data: [\r\n { id: 33, value: '2022-December', isChecked: false },\r\n { id: 32, value: '2022-November', isChecked: false },\r\n { id: 31, value: '2022-October', isChecked: false },\r\n { id: 30, value: '2022-September', isChecked: false },\r\n { id: 29, value: '2022-August', isChecked: false },\r\n { id: 28, value: '2022-July', isChecked: false },\r\n { id: 27, value: '2022-June', isChecked: false },\r\n { id: 25, value: '2022-May', isChecked: false },\r\n { id: 24, value: '2022-April', isChecked: false },\r\n { id: 1, value: '2022-March', isChecked: false },\r\n { id: 2, value: '2022-February', isChecked: false },\r\n { id: 3, value: '2022-January', isChecked: false },\r\n { id: 4, value: '2021-December', isChecked: false },\r\n { id: 5, value: '2021-November', isChecked: false },\r\n ],\r\n category_data: [\r\n { id: 1, value: 'All', isChecked: false },\r\n { id: 2, value: 'Production Releases', isChecked: false },\r\n { id: 3, value: 'Planned Releases', isChecked: false },\r\n ]\r\n};\r\nconst initialState = {\r\n category: '',\r\n publishedDate: '',\r\n title: '',\r\n description: '',\r\n filteredDate: '',\r\n link: '',\r\n}\r\n\r\nfunction ReleaseHandler() {\r\n\r\n const dispatch = useDispatch();\r\n const LatestReleases = useSelector(state => state.welcomePageReducer.LatestReleases);\r\n useEffect(() => {\r\n dispatch(getLatestReleasesStart());\r\n }, [dispatch]);\r\n\r\n const ProductionData = LatestReleases?.[0]?.items;\r\n const PlannedData = LatestReleases?.[1]?.items;\r\n\r\n\r\n const [filters, setFilters] = useState([]);\r\n const [clearFilters, setClearFilters] = useState(false);\r\n const [period_data, setPeriod_data] = useState([]);\r\n const [category_data, setCategory_data] = useState([]);\r\n const [showAddReleaseModal, setShowAddReleaseModal] = useState(false);\r\n const [showEditreleaseModal, setShowEditreleaseModal] = useState(false);\r\n const [showDeleteReleaseModal, setShowDeleteReleaseModal] = useState(false);\r\n const [deleteReleaseId, setDeleteReleaseId] = useState('');\r\n const [addRelease, setAddRelease] = useState(initialState)\r\n const [editReleaseId, setEditReleaseId] = useState('');\r\n const [editReleaseInfo, setEditReleaseInfo] = useState(initialState);\r\n const [releaseUpdateData, setReleaseUpdateData] = useState([]);\r\n const [releasePlannedData, setReleasePlannedData] = useState([]);\r\n const [clickedState, setClickedState] = useState('');\r\n const roleSelected = localStorage.getItem('RoleSelected');\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n const formatFilteredDate = date => {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n return [month, '01', year].join('/');\r\n }\r\n\r\n useEffect(() => {\r\n setCategory_data(DATA.category_data);\r\n setPeriod_data(DATA.period_data);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (ProductionData) {\r\n ProductionData.map(data => {\r\n data.publishedDate = formatDate(data.date);\r\n data.filteredDate = formatFilteredDate(data.date);\r\n data.category = 'Production Releases';\r\n })\r\n setReleaseUpdateData(ProductionData);\r\n }\r\n if (PlannedData) {\r\n PlannedData.map(data => {\r\n data.publishedDate = formatDate(data.date);\r\n data.filteredDate = formatFilteredDate(data.date);\r\n data.category = 'Planned Releases';\r\n });\r\n setReleasePlannedData(PlannedData)\r\n }\r\n }, [PlannedData, ProductionData])\r\n\r\n\r\n\r\n const addDateToRelease = (name, value) => {\r\n if (name === 'publishedDate' && value === '') {\r\n\r\n\r\n }\r\n const newFormData = { ...addRelease };\r\n newFormData[name] = value;\r\n setAddRelease(newFormData)\r\n }\r\n const handleAddRelease = (event) => {\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...addRelease };\r\n newFormData[fieldName] = fieldValue;\r\n setAddRelease(newFormData);\r\n }\r\n\r\n function DateFormatHandler(date, fil) {\r\n let d = '';\r\n if (date === '') d = new Date();\r\n else d = new Date(date)\r\n let month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n if (fil === 'filtered') return [month, year].join('/01/')\r\n else return [month, day, year].join('/');\r\n }\r\n\r\n const dispatchItem = data => {\r\n let item = {}\r\n let temp_arr = [];\r\n item.title = data.title;\r\n item.date = data.publishedDate;\r\n item.link = data.link;\r\n item.description = data.description;\r\n temp_arr.unshift(item)\r\n return temp_arr\r\n }\r\n\r\n\r\n const [addReleaseValidation, setAddReleaseValidation] = useState(false);\r\n\r\n const AddReleaseSubmit = (event) => {\r\n event.preventDefault();\r\n const newRelease = {\r\n item: Math.floor(Math.random() * 1000),\r\n category: addRelease.category,\r\n publishedDate: DateFormatHandler(addRelease.publishedDate, 'published'),\r\n filteredDate: DateFormatHandler(addRelease.publishedDate, 'filtered'),\r\n title: addRelease.title,\r\n description: addRelease.description,\r\n link: addRelease.link,\r\n };\r\n const newReleaseObjCheck = {\r\n category: addRelease.category,\r\n publishedDate: DateFormatHandler(addRelease.publishedDate, 'published'),\r\n title: addRelease.title,\r\n description: addRelease.description,\r\n }\r\n const isEmpty = Object.values(newReleaseObjCheck).some(x => (x === null || x === '' || x === 'NaN/NaN/NaN'));\r\n if (addRelease.category === 'Production Releases' && !isEmpty) {\r\n const newReleases = [newRelease, ...releaseUpdateData];\r\n setReleaseUpdateData(newReleases);\r\n let item = dispatchItem(newRelease);\r\n dispatch(createLatestReleasesStart({ channel: 1, data: item }))\r\n }\r\n if (addRelease.category === 'Planned Releases' && !isEmpty) {\r\n const newReleases = [newRelease, ...releasePlannedData];\r\n setReleasePlannedData(newReleases);\r\n let item = dispatchItem(newRelease);\r\n !isEmpty && dispatch(createLatestReleasesStart({ channel: 2, data: item }))\r\n }\r\n const newReleaseArr = [];\r\n newReleaseArr.push(newReleaseObjCheck);\r\n var releaseProps = newReleaseArr.map(el => {\r\n return Object.keys(el).reduce((newObj, key) => {\r\n const value = el[key];\r\n if (value === '' && value === 'NaN/NaN/NaN') {\r\n newObj[key] = value;\r\n }\r\n return newObj;\r\n }, {});\r\n });\r\n if (!isEmpty && releaseProps.length > 0) setShowAddReleaseModal(false)\r\n else setAddReleaseValidation(true);\r\n dispatch(getLatestReleasesStart())\r\n }\r\n\r\n\r\n const handleAddReleaseCancel = () => {\r\n setShowAddReleaseModal(false);\r\n }\r\n\r\n let today = new Date();\r\n let currentDate = []\r\n let newDate = `${(today.getMonth()) < 10 ? '0' + (today.getMonth()) : (today.getMonth())}/01/${today.getFullYear()}`;\r\n currentDate.unshift(newDate);\r\n let recentDate = `${(today.getMonth() + 1) < 10 ? '0' + (today.getMonth() + 1) : (today.getMonth() + 1)}/01/${today.getFullYear()}`;\r\n currentDate.unshift(recentDate)\r\n\r\n const handleEditReleaseDate = (name, value) => {\r\n const newFormData = { ...editReleaseInfo };\r\n newFormData[name] = value;\r\n setEditReleaseInfo(newFormData);\r\n }\r\n\r\n\r\n\r\n const editHandler = (data) => {\r\n setShowEditreleaseModal(true);\r\n setEditReleaseId(data.item);\r\n setDeleteReleaseId(data.item);\r\n const formValues = {\r\n category: data.category,\r\n publishedDate: DateFormatHandler(data.publishedDate, 'published'),\r\n filteredDate: DateFormatHandler(data.publishedDate, 'filtered'),\r\n title: data.title,\r\n description: data.description,\r\n link: data.link,\r\n };\r\n setEditReleaseInfo(formValues);\r\n }\r\n\r\n const handleEditReleaseUpdate = event => {\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...editReleaseInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setEditReleaseInfo(newFormData);\r\n }\r\n\r\n const handleEditReleaseSubmit = (event) => {\r\n event.preventDefault();\r\n let category_release;\r\n if (clickedState === 'production') category_release = releaseUpdateData[releaseUpdateData.findIndex(data => data.item === editReleaseId)].category;\r\n if (clickedState === 'planned') category_release = releasePlannedData[releasePlannedData.findIndex(data => data.item === editReleaseId)].category;\r\n\r\n const editedRelease = {\r\n item: editReleaseId,\r\n category: editReleaseInfo.category,\r\n publishedDate: editReleaseInfo.publishedDate,\r\n filteredDate: editReleaseInfo.filteredDate,\r\n title: editReleaseInfo.title,\r\n description: editReleaseInfo.description,\r\n link: editReleaseInfo.link,\r\n };\r\n\r\n if (category_release === 'Production Releases') {\r\n console.log(deleteReleaseId, editReleaseId)\r\n if (editReleaseInfo.category === 'Production Releases') {\r\n const newReleases = [...releaseUpdateData];\r\n const index = releaseUpdateData.findIndex(data => data.item === editReleaseId);\r\n newReleases[index] = editedRelease;\r\n setReleaseUpdateData(newReleases);\r\n dispatch(updateLatestReleasesStart({ channel: 1, serial: editReleaseId, data: dispatchItem(editedRelease) }))\r\n }\r\n else {\r\n const newReleases = [...releaseUpdateData];\r\n const newPlanned = [...releasePlannedData];\r\n const index = releaseUpdateData.findIndex(data => data.item === editReleaseId);\r\n newReleases.splice(index, 1);\r\n newPlanned.unshift({ ...editedRelease, item: Math.floor(Math.random() * 1000) })\r\n setReleaseUpdateData(newReleases);\r\n setReleasePlannedData(newPlanned);\r\n dispatch(deleteLatestReleasesStart({ channel: 1, serial: deleteReleaseId }))\r\n dispatch(createLatestReleasesStart({ channel: 2, data: dispatchItem(editedRelease) }))\r\n }\r\n }\r\n if (category_release === 'Planned Releases') {\r\n console.log(deleteReleaseId, editReleaseId)\r\n if (editReleaseInfo.category === 'Planned Releases') {\r\n const newReleases = [...releasePlannedData];\r\n const index = releasePlannedData.findIndex(data => data.item === editReleaseId);\r\n newReleases[index] = editedRelease;\r\n setReleasePlannedData(newReleases);\r\n dispatch(updateLatestReleasesStart({ channel: 2, serial: editReleaseId, data: dispatchItem(editedRelease) }))\r\n }\r\n else {\r\n const newReleases = [...releaseUpdateData];\r\n const newPlanned = [...releasePlannedData];\r\n const index = releasePlannedData.findIndex(data => data.item === editReleaseId);\r\n newPlanned.splice(index, 1);\r\n newReleases.unshift({ ...editedRelease, item: Math.floor(Math.random() * 1000) })\r\n setReleaseUpdateData(newReleases);\r\n setReleasePlannedData(newPlanned);\r\n dispatch(deleteLatestReleasesStart({ channel: 2, serial: deleteReleaseId }))\r\n dispatch(createLatestReleasesStart({ channel: 1, data: dispatchItem(editedRelease) }))\r\n }\r\n }\r\n setShowEditreleaseModal(false);\r\n }\r\n const handleEditCancel = event => {\r\n setShowEditreleaseModal(false)\r\n }\r\n\r\n const onAddingPeriodFilters = (option, drpdwnID) => {\r\n let temp_ARR = [...period_data]\r\n temp_ARR.map(itm => {\r\n if (option.value === itm.value && option.isChecked === false) {\r\n itm.isChecked = !option.isChecked;\r\n }\r\n return ' ';\r\n })\r\n setPeriod_data(temp_ARR);\r\n let temp_arr = [...category_data];\r\n temp_arr.map((itm, i) => {\r\n if (option.value === itm.value && option.isChecked === false) {\r\n itm.isChecked = !option.isChecked;\r\n }\r\n return ' ';\r\n });\r\n setCategory_data(temp_arr);\r\n if (option.value === 'All' || filters.includes('All')) {\r\n let temp_arr = [...category_data];\r\n temp_arr.map(item => {\r\n if (item.value === 'Production Releases') {\r\n item.isChecked = true;\r\n }\r\n if (item.value === 'Planned Releases') {\r\n item.isChecked = true;\r\n }\r\n return '';\r\n })\r\n filters.includes('Production Releases') && filters.splice(filters.indexOf('Production Releases'), 1);\r\n filters.includes('Planned Releases') && filters.splice(filters.indexOf('Planned Releases'), 1);\r\n setCategory_data(temp_arr);\r\n }\r\n if ((filters.includes('Production Releases') && option.value === 'Planned Releases') ||\r\n (filters.includes('Planned Releases') && option.value === 'Production Releases')) {\r\n let temp_Arr = [...category_data];\r\n temp_Arr.map(item => {\r\n if (item.value === 'All') {\r\n item.isChecked = true;\r\n }\r\n return '';\r\n });\r\n setCategory_data(temp_Arr);\r\n }\r\n if (filters.includes(option.value)) {\r\n return ' ';\r\n }\r\n\r\n if (filters.length === 0) {\r\n setClearFilters(false);\r\n }\r\n let fltrs;\r\n if ((filters.includes('All') && option.value === 'Production Releases') ||\r\n (filters.includes('All') && option.value === 'Planned Releases')) {\r\n fltrs = [...filters];\r\n\r\n }\r\n else {\r\n fltrs = [...filters, option.value];\r\n }\r\n setFilters(fltrs);\r\n }\r\n\r\n\r\n const filterByReferenceValue = (arr1, arr2) => {\r\n let res = [];\r\n res = arr1.filter(el => {\r\n return arr2.find(element => {\r\n return element === el.value;\r\n });\r\n });\r\n return res;\r\n }\r\n const filterByReferenceDate = (arr1, arr2) => {\r\n let res = [];\r\n res = arr1.filter(el => {\r\n return arr2.find(element => {\r\n return element === el.filteredDate;\r\n });\r\n });\r\n return res;\r\n }\r\n\r\n\r\n const FormatDateHandler = (filters) => {\r\n let fltrs = [];\r\n fltrs = filters.map(fil => {\r\n let sub_year = fil.substring(0, 4);\r\n let sub_month = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"].indexOf(fil.substring(5, fil.length).toLowerCase());\r\n return ((sub_month < 10 ? `0${sub_month + 1}` : sub_month + 1) + '/01/' + sub_year);\r\n })\r\n return fltrs;\r\n }\r\n\r\n\r\n const periodFilters = filterByReferenceValue(DATA.period_data, filters).map(fil => fil.value);\r\n const releaseFilters = filterByReferenceValue(DATA.category_data, filters).map(fil => fil.value);\r\n const productionFilters = filterByReferenceDate(releaseUpdateData, FormatDateHandler(periodFilters));\r\n const currentMonthProdFilters = filterByReferenceDate(releaseUpdateData, currentDate);\r\n const plannedFilters = filterByReferenceDate(releasePlannedData, FormatDateHandler(periodFilters));\r\n const currentMonthPlanFilters = filterByReferenceDate(releasePlannedData, currentDate);\r\n\r\n\r\n const clearFilterHandler = () => {\r\n dispatch(getLatestReleasesStart())\r\n setFilters([]);\r\n setClearFilters(true);\r\n }\r\n\r\n const deleteHandler = (data) => {\r\n setShowDeleteReleaseModal(true);\r\n setDeleteReleaseId(data.item);\r\n }\r\n\r\n\r\n const handleDeleteRelease = () => {\r\n if (clickedState === 'production') {\r\n const newRelease = [...releaseUpdateData];\r\n const index = releaseUpdateData.findIndex((data) => data.item === deleteReleaseId);\r\n newRelease.splice(index, 1);\r\n setReleaseUpdateData(newRelease);\r\n dispatch(deleteLatestReleasesStart({ channel: 1, serial: deleteReleaseId }))\r\n\r\n }\r\n if (clickedState === 'planned') {\r\n const newRelease = [...releasePlannedData];\r\n const index = releasePlannedData.findIndex((data) => data.item === deleteReleaseId);\r\n newRelease.splice(index, 1);\r\n setReleasePlannedData(newRelease);\r\n dispatch(deleteLatestReleasesStart({ channel: 2, serial: deleteReleaseId }))\r\n }\r\n setShowDeleteReleaseModal(false);\r\n }\r\n\r\n\r\n return \r\n \r\n \r\n Latest Updates
\r\n {roleSelected === 'Admin' && setShowAddReleaseModal(true)}> Add Releases
}\r\n \r\n setClickedState('production')} />\r\n setClickedState('planned')} />\r\n ) : <>}\r\n {<>\r\n {(releaseFilters.includes('Production Releases') && !releaseFilters.includes('Planned Releases')) &&\r\n \r\n {showAddReleaseModal && \r\n }\r\n {showEditreleaseModal && \r\n }\r\n {showDeleteReleaseModal && \r\n setShowDeleteReleaseModal(false)}\r\n queueName={(clickedState === 'production' ? releaseUpdateData : releasePlannedData)\r\n [(clickedState === 'production' ? releaseUpdateData : releasePlannedData)\r\n .findIndex(data => data.item === deleteReleaseId)].title} />\r\n }\r\n ;\r\n}\r\n\r\nexport default ReleaseHandler","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAsCAYAAAAEuLqPAAAABHNCSVQICAgIfAhkiAAABIBJREFUWEetWEFS20AQnHWcM84hpxxiCpPKDfMCzAvifACkfADygsALMC+QzAdwXoB5AeaWSkzhHHLKIXCOo03PeleshaRZh6jKZVtajXp7ZnpmpCjgiNpJK2vSgdIUkaK2vWWC75lWNG4QXabfYv6/8qGkO/jhukkXWNeV1uI6g7hz64bTeFe6RwawmaRa075SNKTfdJjOYvOAaDPpkqYefvYygIOh18WHAYBoX1wQdZKRJnqHhbvpNB7X7Qhre+wiAE5wz/XZNBZZkwFsJhEbZAbg50iiNNpIBoiLAxj+CMADab0IgA3sdZIZU6yatJ5+iWd1Rvc3kltmIWQt2wkCAH8HscAuAPUX+FyCfo4P8QgCwFb2OwkH31rdzgDUBWwMd6Xi00MZMFHfSQ6xs5OqWLDp+gtL79Wc2i5bJBAiAwsR0juNprrO5jSuigUHkOkn0ifwbrcxp1MJiAygkxzB6Cd/J2UsuOBbWkd0jEw4qmNBBvA2adMfOsogOgWxmQDYyEZyH98u5++xjvViTHNKn8yAQ8/KBz1gSW6xyOAhW/7O/HNg6P8Gof9wZzxiZhBsBkSTZqwPLl0NK4EgZBd4Ow8xugQiQL5rAZjUekZXRtkCAspzlxEu/L8D6N26Ul0JwC/DoXXAjwmPiVoQlQCQVgl2Hq0iq8V0c8qI8xOI025ZRpQC8ETlO8SkK6VSXZ67cs5pWdagPALgRbwC9b06/6E+gCCiusbDtnOsoFtlcfQIAIxesahI9dzTfgK9L+pYspticVorNjZLAECXkV3J7x6tD+xrSoc3cVzlDudWtHEzrFt363IALCx6jpRjDWnC7xWNR24IVQ9ATScMIyzDvLvaLgiNDbtix3fFAwBXy4V8z40o2nbxYSm+EplbbPLW6MMc3RUaXAPA7v4WBsSodwCKgcfuAxUzqRHJmxbL1gLACp2MR6PYJZfFg9usiwW1aifjKxyMjLTSo7Pph891WlC8hk1MTFrCjSq04VyS2UW2HHLg2fN3+D9AI3ocAiRv7xBvKh88NL1Pb2LTYIQemAH61KA+Cg83JGsh1dK6nHsLE7Qq96kgJnWgQrPAt2FVdKLwgzvZVsgcZ9AvJp+toq6zQSkNSwAQAxD13L/xKTpQCsCNXcEM2PmAxQQf906AlbAlKWERAOvOQwwEzH3OgBtAfYN4eXGKIObMEA9P+C5VPs0GNpFlNIayl2/AzZoAzTpgUoLphKFtEb63YNX4cbfiPm7ve0aI+GQeWP+gBasAtlnURxadu4xxtcCxIHaxqz7QX1+YL0w19cvxQytNUEXhdcyqQOy7g3OTLV68LXdENjiMcXQ46jmGS+GNiATEFjsebk2GFOX6cVMKfc8UDXBh8dYLQLjiNebqMrQ7diO90qrPrf3CDHoNjbdshXpT3pZjIsK8d4jXb1EOZGFlxk0HjI3Ldo61PaYYn/ztmHkwUYo5chA8FywFjq14GM+5U16aiKvo50m5oaCSGY2kCls5GVUZ33szfOWuNXT2kn9nqvHTnTv7uv9Digv/+l9rzcA+4+ZKbQAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAsCAYAAAAEuLqPAAAABHNCSVQICAgIfAhkiAAABEJJREFUWEetWEtS20AQtfgucRZZZYE5AfYJsE8QOEFgya+wTwA+gaH4LVFOEOcEmBPEnCD2IisWgS0/5z3VtKsZpOlRhalSWfKMel7/XvcoqUSMXq9XXVhYOMDSTVw198oQvyNcA1w3u7u7fC49EusNt/k11tWttZgfJklyL+t2dnZa1jsmgLOzsxRCv00mk+9PT0/tTqeTbXB+fl7Hf03MNR24ZX8zWMWUby7ARn0I/vr6+tra39+nuQvH6elpc2Zmhi66ArBbWMC0WgwA+v2KFtjb2+N9cADwMRYcYH0H63kfHCYAZ+4Rfpeh3cr29jbvCwcA/MZkLWYthcQCiLKCcwEDllnRtLSPBuCswOBbCmkmAYt1WwCQfigACG8jsHpFseDS9S82fXh8fKxJtlggTBdQ8Pz8/Nrs7OwtMmFQFAsCkOYHyB7A1gHkxAJiAkBQHUHoodYkzwoSfJ7GXbiC7xcOE8Dl5WXt5eXlyBGOJhtSLzmCYx2X5PwD7gcAOQBxpf9tAYFO5sM9I7xKksEGq1ot77+PDUK9uUQ4LfP8/FwjiLm5uRH5Aes28XjlgEWBMF2Qt3nIpxpEDH0HAbjU+oUNqakZUMpdYglyRytUqgsB6DIcWwe0ZZQlgiAKAUAAfUlNomnVd41ixiE4oZWXEbkAFKmM8WLdSiUjJrJyjiwZ5DUo7wCooONcM+Q/rJ1w81DjQVcuLi6SF5i27+IoDwCDjt1OsJ4r7q/ASp9CVnJKDSB3yc+MNwAU7Qb9Ll2SZ/oUltgqcody6wjrVmTdFACJBeiofYKSWy9qPJQgUq50wmTJJctqAE4rrGlXTAGoiA3muxLSkPhwJib4oOWckuyY7uG2FbotA6AmzKgXAH7gOffRvGkoK1SXncVYBqBMJyMAYmg2D4hSNouFpGwn4zFcH37vQ5OfIa39uYuLi6FLy0YiAsvQrTN3m4HnhJNuj6FRNwaICuQuAQhTbYCppMGIkVOBJutwxTpYjg0JwUSVYB20BJClhkUmIUSxWaBlOBYdEgA72WrMOY4CePKBxqs+rzuB0YVLaJwATD73kAuZlOaBHAtUCGCEieVYC6gAuoclMiZEAJMJqxYT5gAYT2Mg9iwnbsAvP1jocQIlmBnmUFxwQwDZaTY2gvPMGGs9eVdxyQkB0Hzk8SEENUz4akHZ+JFXkb7X/LiB50ZGxZKK8GlpLigDmGvJHdj8B26zjBEAYgWziy27oeey6eGG2rOaTsux5niw24b1OaYsEPftgJpXdbz5HdEmJuVkkyIzutYXEQuI6wkPYXbJkDd0/a4ndD5iZshBNGXFw0HzJrY7liO9qxFUimOM57Zfb3LbcleiiZgv6xPxCEJGPPnmac4TNOZoYv11bIznFLXmOPpcoIVLxWOf6J+Ii8zPkzLiaIh3+laFNQ+n/iZgsS/yHzb5zHtsdCf/IWb+WHGh5/8BXbXEXkO/Gg0AAAAASUVORK5CYII=\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAlCAYAAAAjt+tHAAAABHNCSVQICAgIfAhkiAAABYRJREFUWEetmElSG1kQhinGJbjXjmhxAuQTWJwA+gSIJbN0AvAJEPMScYKGEyBOYHECRITXblgyBOr/e52pSIoqyRHuiijz9IZ8f/45lrOx/+k5OTmpZlm23+/3axLZ1fjb+vr65Sjx2bANp6enKxJY0Z6rjY2Nbtne/f39uenp6TutI6+lt673T71fhp1DXikAafRd69VwaVvCVotAaC8Xnr+9vS1ubW11DNA/mvumM3t+5ujoqDY+Pr6j3w/ae8HeQgAuUNo3X15e2lNTUy1RulKmkfZzya6Ez6+trfWKALhM7Xs0QLOS+VchgOPj47YWl4T+E5uxr/5850CRXc/OzirSCBNhhkvtq5kvDEwgGQ9a60jmsgFkf78MQAOHckp1eFeb0bLUpkZv22z/qPP1CFYy+tEk+o2v7BQCAOHMzExHWiy4/TS+2NzcrBvdC7pgzhx0TOOewF7pd1dmuHbg0V90rofGehrM6wxgb0qd0Ghi01JErshI0SBBUMo7Zxe1dXHPAejvw/Pzc6/ZbLLHzdjRcNb232tPbWgYunPlNTJwOOWc1m7wZoSaGRIDExMTLYEkFPdk9wPWnVnGMk+KsLIoqIJesQ1duxGAOeR10Bw5B7qkEQHAgOax81e95JFlYyKB1e9aIQC/QOivsG0egEUIwmokGfu9Qgi+vr5W8j6g9Ybmeu6Qkl8OIGgHMyDkojwD7wRErdGozAlZG8qA2ZXsV7G92A0ad8VESxo0mXeNMYs07spM55pelMkqk5OT1QgAH9JZTDB4xCy2v/1gAo9LLZJuk4NIWEsXYcdBJBSFKGcksJ3zAfyEcLu1iIk4SOvttM4/flDDgbPE3YQeQhw1IDw9e/rVHiphXeeIjMUUYlnWLcqcFDmt3ZC2EwBpT9msQaPHbQSQdxw7s6e/uwKVOXskK8w1rAJa2r7zxJb5hISlUMpdjEbYmOcdO54jBPqT/OBD5Yty8mNTeImzGWFC3temd3k+FCBsCEOXUbOYpHA8rWPTXv4yXXKQZ1UmWJbMv7V3Ffo6GlQl3FPqmLFCRDxKQLXELMkE+IBsThUse7qSsZiXQXFKJjMAFJ2me6b7hObwCzLivliqmDfTZHSdAXwAwJZ2EwjtvcfBjEUUvIsgQiT1AYD9XPsUTtHpNIaJecxAndd4Vlp/kdZ1GDAnTGwECh60d5UICI1I8jHLN5jsv1pgdfrAmgjKLGU4JQu9bb3n3ojY4Z7myA08CQAMkIaZUBFCmT0r5Q0KkbNMWFoJr1h+WADAA9qp9WqIai50Nii7ngkHnZD2Y++LCCBonoYxWQHeuqOksT3cQ5qvug8MqlMUFkIUrTmEkGVPNDBgZhl7enq6jY4Wktu7xtTlu5kBQIh99f6PDeY8S9R62RtqoTw1EjSq6oxaIXwHWsWu+RcAwOQtAOoakGxSHgghiCkSeheWb0oBKpBzAgmdtNvJiUE0DIDnGPZn3kJ7anTNPMdHYUW9XqAUM/W8XowAAKM7KRMa5ckMmpj3LgjvduGxynn75Wt5m44CEL6ibuiSHADORbwPeoDfBeDp1n0mAE3aO8MDLb3R0OINbPwOAO+syIiKjppHhzPp5gbUAEC+0YgAXJsRPtCRPLpgnBCnnNeb+kYzMyxf50G964rDJxYhFz+rEE67VSXH5+1vFyRqfS2CNc2pfllexoe23OjDKdGG/gCTkLvJ5XtFlw+bkzxAAe4eZvLNSumnmaVlekF/Rn7rRyD2fwsArui9UoTVi8r6qC+jug4jBDaoC1TEjv7S58PM4NGFdL+U5Rqa6iWRoTVfRu0yloYC8ENkSwTrcgT7t12ZzEcr3XyKl17sh38JQLzp8PDws/r/P+Rkn+O8nOuHSvLP7e3tH2XIiub/BZvXPc8wKhHWAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAsCAYAAAB7aah+AAAABHNCSVQICAgIfAhkiAAAA1tJREFUWEfll79v00AUx99dwh7+gkaQSmwNEjOEv4DyB0BsiR2QGNgIGxthQGJBdhmQmBomBoaamSHphtQg0h2JdCb18X0Xn7k45+ZsQELqSa5S++4+79e9905QjRFcidpqQfextIenq7dQNMPfRAjai6dhUtxWVOUEl6OhEhrC40QRTbLfbWy2lf1OxIJux7NwbvavBAo60Qgb38JzLAUN4qMwtgUNtqNuqmiITW+whuKUrhpYZZA20SkgkBba7aaCdoSitpI0kT9hNn7fiR6wWWHC3VoamUVBO2qpJh3k/vmt1hw+uglNjTnzL5U0ykGdqAfzHeD5JIkG+r2gQCnq87s305CDZGXUAvEO7I+i5PyOGjSPv4SzvwaqGq0bNcrCeafqxvZ8BMvbjaC7nSjR4foHA3575g3am4Yb5xZlQZiboDnvoAENcGz8x6yzdT07b9VMd+fS62tSys+MwgaPpaJDJNgPS3R6TzWbI7FIv+t/Fb1Clnj3/4MaUj7S8hONWSNOPUsF0o+skVykL/X/in7U1sjfO8uZ3uFtF7l/co6yMrAPoXpGiyKIpaUFTewqWunAcgZWKe3D9m1EzCEvRkrYMaBCLZojj4Xx13DkMmup6TRE6YLW0k3GURiYXMcgG8J1J8uBc9FEyXaUBieoAAlNP2BAaDYumqpqhOCSDeBzAB+ibA+9TJdvKGAKq+mwsjeX566B6KhaWmAM0Hu7PzBAp0b9ToQ1dIgyvOzTsmGXCRtihy/89AJ+4oZkZayBjGTFeq990qAxB0YRkoF0+4VvK1Yo1cgi542F7XgnZDuKs2ZkzQqVQDDZhMN6E0Qu0L9ZHaltu3XTWe2TaZVgzoAPLId4yeJjQLqVDqzLdK4DaAdAWf9WWaNNIHznBn6tIy2sa/GRyJuTOhqVCeJ6Xw8E3yHaomI2yA88ofcuux/5aMThnl6gPg7nAFIL5Leund/sVOUKEN2r+YA4cxizFA9odgP8hu8nSL7sl7XhDWKJ0QIl1KS4mKktsz2F2Vjj+qDSKLQyxFmH11sjFwgmH8CeTzgZnwXhtUJPVrjkcjeDayP6tNg3dCFlD3P5SQBLZBPF0lEANch2si+gbB7AztDOQVp1orV64g3OrpU+IOe90xdkfHW+QL8Adi+f6gKuqHUAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAsCAYAAAB7aah+AAAABHNCSVQICAgIfAhkiAAAAyZJREFUWEflV7tuE1EQZV3YrZE/AP9BHIkanC8gfAGOROOXEksUdCwdnUF+0WE3SFQJFQUFm5oizhfg9Eg4pS0/OMfMtcbru/bdFRQoK13t7t07c+Y9s969BFev18svl8tTrCLIC8JihHuwWCwG9Xo9CLP14uJ0Op23oDkVulvch/Kcx/0Bnz3PCyaTydNGozE2/GMBAeQChE+wbrD8arXa14LiO7WjII+xRtPp9NCAJQEiA58Mut3uMcx3AKbUZoj9Affb7fYZtCpCkONEGhmiZrOZTafT35R/zCea6ggAxpxrhWNpZKharVYxlUoR6BLO98UvJWjxjHsAKmqTrr6HN1zf6Y+w5NyDAONyuTz6a0CuAjn7iOEMk9DhiS8EzMe9pgNQIOGaGAiEb5yB4I+9Z8OSqKC560C+76fiOCqXyz2SfItnOtj8IQi/EwyR9BLReI3HLwL+HHsX2Psp7++RzJ/+C6AXotGVaFQSDb6KRh15/5VYozj+4Vnn8NZN7p/kEdtAJpM5l1a9UiQMRGlns9lQd9FYCStd8hxEefEBI+zAAIV60RhnTiqVCjvv1hVpOgFhn8mC+aBWq5VMrSNQCORSauAYIXxoaw1WIA0CBidmHjBAaNP3TVc1QkjLbuK9AaE4K2xcUUCBSLgGIZWq3mzPBQMi3ziMXGF91vOBQYsCWtInsLeZ01bndZvQIKHwfQegs70aidko2Ua/F59wnwPjymeamRq/NqwQqZEeNsxgoR1vA4F/+hxGbFaIBYSZbciw3geCibQYlUtbPrJpBLOUmLBhc6mzN4jEQqyEtQHZEjAUANb5TdM5aeQAxKqwNZFqOlgky5TA+tP4EmoUJYttPz4QfQdOH8LVwOQbetBR5P+Ri0YS7pytfSwP9a2g65suVbYAcTYdGC2VTTYSlH+A0OQHvt8iD+mXrSsOUADqAJr0w5ValanXAKLGyYGiPK8rxK7kddbIBgRNKP0rlqFdIKT15DB/chlNI6y+a9zy95HVgz/HuNOsA1sDNEDaya4Y1nNRob0Gourz+Xyrn7iign71W7kXCAz31q1doMZXdwvoN1seh7n7DiivAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAUCAYAAADlep81AAAABHNCSVQICAgIfAhkiAAAA51JREFUSEuVVktS20AQ7ZGdNc4JMGVTlV3MCTAnAA4QLOUCOCewOEGUCyCZCyBOYHECk12qggtnyQqzoyqyJq9HM6rJIBmjha3PTPfr16+7R9A7L78bd4qWPBbCOyQqutjeIRKD0oy8w8+KyFtKKm68XNwmywDP219i26VnvcuREMLH+qHZI4n+eIIykrTkdwW+wSCD27Hspnj3I7kPsm18vQlIASERkiBmo+SB6NYjCpuc+PuxX0gKYXy3AgHQkmR4tfg63QSsERCMDqSkGJsHigmiO/wfC4loF8H4rWg5tfSBItgYcQBY39UAM9GmIPkVKFbdqxbQWT+e4EOIxc9C0JhTAqMz3E+T3wGnbevL78epCoToCJuGuOdgdvAfXt0HFxsBcVSyTde8EQZuKCefRTnqxzMY2IOBKm3GEKeHWcDzSkJP3l+AtoSsbTIb8+l9cOR/irtFTgnsoygoFTnYstZXDOkUzbCoAyYCMJGwU/1+br+zo9J6YdY6MPaZ2RQenWI/V5y6wFKIgCZI1Z5JlXmHz3fatlqvAFlgUEg0dIyNYew7Ivn4VglrOxlMPoCNgwoQWJE5PcDZNxRCVL3vxSdglQOX8HvEfsUmMLwRemIHhHQNrYhZCxzxK3HqFMasGbsKYWfpSUrdgrCCUKAE9PGkqMpBZ00TawCkWAMLr4pCa+bJZaPOThVgWdFzPD8JvxdHoO0cuU+miyCw9dHIUEn1NSI6sNNrpX9eBwitYwXWTlwfo14cQzw++l1kNJSoSqkBBUoTWdAhwO45mmARzsDSqe2gKnNLwPwdmUAMdAFAob2+AqNbil1lJSiiDOk7NemrNOGwYVVJJqVkYZIZLa5jZKFkVMLuIkgVk2WL4aoe2Gz+pwHjXJUulz7mj+kjeE7dpqjXc9Wo2aVnW2hahmGC+xjuD8AmBrFqA1wU3O+4qsf2+teiLAWWaScR2LqgNrGIJ3WaMQ6ggZWrJ/XNsIN0odFGYGWC12zvJwaz7+6pHR1qDrUp4ZavxoZHEf65pHZNv3CFWfdsWgo7B2BOGeunw/OQ1hjONVXdOFxN5DhScJvnqc3nGqZ8BYOB0UITsLP9+NwAMHvVKaFMUdXF3f0bAZnFtccJiB9CTVHKt8bBl/7lIUQxEAUG6DuOKzaorQBZwAY4hfkFxouaWxsupREMT05901Gjbvu7ANkGWGctsVbVlbfb6iDWytePguTLWrYeoY+XbXTmrvkH0+IGSmPZVJwAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAUCAYAAADlep81AAAABHNCSVQICAgIfAhkiAAAA1dJREFUSEuVVl1O6mAQpRDhUe8KhBVcXQF1BVdWcOmj/OTCCigrAOPfo7gC6wqAFagrEB9NTMQ30QTuOc2MGfoDleRLaTvfzJkzZ+ark/vhbzAY7JVKpT/YVsUqr1arPVwPxM2D4zhz/J8tl8u7r6+vabfb5X3mn5PV8vLy8i9s6wDgmj3PuJ8AxEye8R3B7RqbAOBO2+32JEusrYAIBEF9smEcThHETwtycXFRhy337Js9MwD3G43GzSZgqYDglJleS8bPuD5gsVSnzWazsy1blnZnZ2cIEGR2Kgnt456MeicnJ8rqmqtEQADTkwzfce2AjVk+nx+DqZtWq8XsM//gK2Ai8HEEHy79YbGkPhLrRx2tARLB3opO7j4/P+sUJcpGMBU4sGULfbE8ZAHvKd4J9txYIdNnsVhkue5RrqOrq6sywI1gy6YIYO9Z+29AUqIxjNg1HoJzEwOydPf2mc1K9EJQewD1G+9mWDXsZ4kVtI8/PTBU0VJhX/gMi3aMF9qHgAwY3rvW2fn5eQfBBsjk17YWFj8T+HiCj0MFJKw8AXAXJR/qczB/jGdMfIV1xLjOJjAClgFyMHbV0dnZmVsoFHpJ4hTGrqkZ24V4TuaCaEOYJEJQBPTGQGCgksQA3scAKWtwHmsK0cxblI0kP5qgkcUbAZHCf1gjBPDUyBjHAAnVt7A5tOU15b9PATSH/XFCDI4X6nAYZoiMRzIvYqDkXRWOKhFNUIRjPK/ZANrmVsAClCXpw96P2IdgdKR8U66gOLgWi0VNy6eaiLKhXUJ7sitB9GhZC6yMwraG1udcyklp2dUHls01DZjgPBw9ilLnCDYF0aEo9iy5nl2c6Bx4CjDEKXOM5eVIybEpwCBLzvgdax8TpVH9LmsKtvoYbJyunBkxzZgA1Mf37NGyGL310ThDfCn0kBxHySOu9eiexKNDWGGWPLtmWDyTPDjgYRnOC6uDtP9mpDzChoz4WGTpFOD8pK7eeNoLtQRGIDwa6GxOcKqFDWDYuQpA9/KQZYlSE9r6+cGASZ8TFDN1hddTDYDyVPGMRw1LXDZgN36u2KQyAdINUgLOC1fOrdTKiUYCiHeU9qmRtPlHgKwD+d7R7go/xBD8Bd358fr6+uL7/kcWnUVt/gPFbRQgkryBvgAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAlCAYAAAAjt+tHAAAABHNCSVQICAgIfAhkiAAABBNJREFUWEe1V89P1FAQnresV+GgJxNZfupBA9486XL0JP4BQrsGPRgDXk0MkBivQmKMPw7tgomJF/CqJMAfYMB4QN1dWGO8g+fdPr959tXXsi3tLjRpdtu+N/P1m/lmpoIyHtaAMy4FzWLbKM5t/HeXKvZiRjPBcpFlozXozEiiZzh/5iSteoKKMDBCktxyzbaz2NJrMwGYHHT24Xx7qWoXtQFryHGlpEmRpz73m13PCiIAAEOjTSm72UBXQ3xx6/a+T/c0bgUOhaRblKM6nH4kIacFiR383zIcB2GxCk5PMy9H9LPlamkzClD4Thw86DFoGQOtPYjviqabBO2r53lyqYm1kh5IIdfKldI7hGZO7/WIxjksOOdxbwP7102nQpDtVmw38DU54OzBkcgRDOsDTryGui6A7kJWWicGnQ0w1StO0Rg1yDLAcc5cL1ftgHmBuMI/zbtVO3gL3sBG+NeMd1ogzAjefNZ0xHt9tlfgbwz+lP0QAAajbmIBqJzDb7dHciatY70uJ4UFIxbb0SFgMABW5OtEAFiwmcuTxSFgurI6D8UbytB2UgPQ4WBVcCJ2AoBpNsORioEAwEWn0GzIXhNAKxkdBbBtACqTIyHA9UO81QKzI6W4YTqXxLn8/0DyPlWJZyRkJgZ8FfRAnioJ/eRRavkHIFR8wkRI+bhcKz05DgCBDE253u1/pSpm0vF6995BxwC4mHC386XJsgwYwL2rUQCocC+j9zoKQXIOhEOAEN1H3F8cGwCfvmJgEL0Ab7jN17cvvOlrRf/y96m9YwNgdkdtNOiSKgm94aQcKFfvvD+UA9jnSVrICZrRL3OoFOs4x8iwIxWYgHmOQLnfSgSADfEy9ERXIgM163OUAb1eT1ZI8sWjALSUIYcHTepMFMBSpbR2KAeGHAu0W7qrYq+FGuJgLigjDFZyCBJkGC1EcSqI0M4FbF0NOQ0q8tQVCwA0rWLhTdOAnmZUoyI626IOfIoLi4XeIhtKukI0qMDOVX0xK1zccJIU6zTPeDaUeTWa9eEliloBiQC4cSBLQ/MAaFtUwyrL0JPX2AB6xYpTK/3STuBg0Zz5eI1WFA+0bs1eDbEax0BaGeakPK8BeHniDjpiDp7B2B4ZRjWItlQwMVw+Z77F0o/J30pyoNoEoSZrfMjojG+nHcfLUMpLh2RYLb01QagYE31ACx/3a8LRM2GoErYpQw1C5Ygvt8wAdOxCCeMnkdXvXG6V/e6u/bVVIeJPNwylY5lCkEZeada0PQ+kMZ5mTWYAyNw6MqeexniqNZIKsFdI9V2gP8dSGc64iJtRfA6gLaJCZf4Ey4iBjE54JRhI/IrH3/Bq3DrhYxSF6cD84hZc1XKe98gjcfqEnaNvyD9N0Xi+XJna0b7+AlqB2Zbpi0cQAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAlCAYAAAAjt+tHAAAABHNCSVQICAgIfAhkiAAAA81JREFUWEfFWM9PE0EU7tAEbtKDnkykXDxpwJsnWY6e1L/AciJQGunVxKCJ8VoaSpETNSEx8VK8KgnlDzBoPHgUYryDN0igft/kzTg72e52Co2TbOjOvHnvm+/9mLeoXOBoNpuPu93uCrZN4/mKp1Uul+uBaqy4CtnYaDSWlVI17DnCs4PfEcBMCYi5EF1GNgjA+vr6MU+NE0dGAUC1AOTpyMjI5MLCwmEoCAsAyqehaJwKTk9Pv1Wr1WPSjddnOKU1CJkneKehT1zD8wPPgWPYuqVWqxXGxsbIkB6Li4v7PkAlPt3CQsEsXlxczObz+QIMtQ3d+MvT53DSFtYpW8GzCzbeA/xLS6lSjBEafQW5DuT3PKNz2NOy8tj8Ey9kwk6KEb4XIVz0UWe9Q2cHMhPQMwsQJUc+wu8Z6LTMKwh3iRaT9hTcIEpyrr+zDJt1YWTFNcQ1YbtNhiuVCkHmYgAETI4CQE9A4/D5cr+GjRxcwFOXRI92AcGsra1FdEkWgH0IcTNdMBNq3JVnZhg9IQC0O5gVEmwDYyDNrjv6ZUAD2NjYKILKCdd6UhploRsYgARhzAUAVF1aWlqVmvHQNQ62YkUNcm8kmBlLOiCDGCAABGDh/PxcB6Hks3UPptziEyMCQF8AwOtLA5DojUSRTdfNzU1dMdPG/Pz8yVUAYAwwGzhIpWUA7Nz3ASBG3vpzQ4uBBBfAzeXmlQGgIgaNUYgYOIYBXjScn0yiH2nHsh4bl2HA3o5Go7klmQUItNtpMYAg/ODHAPdhbhXPsjlMUik2fu5A0K+El8oCF7D0EQepANLSEGv5NAYQkF98Boy801nVsxiwt6F7a0ohup6QBbsJMVDCXMncqtjL9y248B3cVMoC0DMN+80CF5DEwB7YO0I8Rey60gDsYPMj70S6m5EgvOGfFif63MstvFtQrlk91dnZWZHGKdsTQJp/Q9fYG46OjrIvYPpGJgNSAcjFEcsCIK8TuTDwQCtQqg2Fvxwjdbfnk0DUGcWGFsFJZu3IioF+0vCWAYAOuCMNqW08TdsOi7Fm1CDIApCYBfDnTfcU+B74zXdpwy0IgCnwQ8ZEfPB1TKVO+tjbUNLwjh8LoHfbA0GRj9DB7wtd2vvpCd1KOFAaGhA0atItGIDju38BI0GEk9xNygRcRt/9eRYefrqBndkgBkJTrZf8wLfh/wRwCMoOrwoAMqAIXfzE66spZcEYymA2pcUAq1fwJ1goUnMTYt89tyHhqadAu263hjngDnZEJ+4Xt2JVwy31HAvXhmlcdP/B3wYA8J8aevwFXcrj0Bw8/FcAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAuCAYAAADUfRIMAAAABHNCSVQICAgIfAhkiAAAA7FJREFUWEftWEtOG0EQZYxkLwMnCCgHwJyA8QkCu+xsLwHJ2OssAptsbRDGywwnwEjZY58gcIAoww3MDnvjvDeqHtU082l/2NFSy+3+1Kuqrl+Pt7Fi6/f7Vc/zfoCMj76F/oj/w+Pj44ss0t4qmDc3N4c4/0vASOoZ/bPQHJ2cnNTS6C8N2u12tyqVyj8B7ACgRwCRPMBwbz6fX5yenp7bwEuDQso2iHWhykuokuO4DQaDHQCSoQmY2V4nKKWpA7QG0JFNGExx7gDru1gP9frSkkKNQxD8+i6gosYDcBoC4N5IZdSL+SFUeGSp14d6HzD3gjVadKJlSiqGwoNV60xkNLJOtX0iMHoPTD0DjAzSqLYWNiQYQw+HztDvS6USxwTvkgFzT9hDiQhIYLvdgrlGyvxGpqRQ3yMO7OFgvAdzAebqAGrCFTjeEEs9x9BHp4+OsR6Y9aVAp9PpdqfTmfBwGmga0aK5TEmNes19Ub1QaxQAjHqvrq6+GIBWq/W3CMysFxnSiCq2iMXR5/r6uoX7vsT6d1zDz5VBSYAWWi6X25CM90WXCXQgIOjm5uY3aOH32kBdOV90n3NEkkCe5hoxJqQduzDgBArABlTLFJbbtCvlbXQChauE4oO3IMxxosGYGH3OeO+QdreIuUJQUesfEgLhfTg9g0ai6dyalQD0gUJQbjZBAcMJiO7rVGXF6MzQtzCoBraDODRxLjWSEyBpOUnKjRLcH7JAXdRqpP0AfWP1H+o11vsuhiTV/F2OyxwhGrF0KWxO1iuxl/URK7s4n4r/RkW3RKy4jMlDLgTVwT6tmhcfjoo4V+BcUFWyMO7mSmFloh5U3cmSNq8aDHCo7so991laYZXRTAN+AyoB/A6bffQXSOgzs1j3WmgssmGIarJpqsnUMGhlDBvQJHGn6gAALM5ZaTwCuKaBY0klb1LCHfQnGM0hU5hWWdG9avFFgBHmWE3ydX5kUmIEKoB8t9AlnsCZT85UHi00pDR9W8ATMF3jVXk66/PdMpvNGhYg1dzOeybkXbDQZ5FOowwh0L6n3GIMM6fx6EohvldXy8naZ96zjGieeShhcxTGzKK23FUBeV59EhgTdM5Jvk/4K98K1iahZjjG0pKyvAQ4K7/40tchZZqkgVxy9N3HfKBYN3DiTvUzng+k19fXDr4PGf9ai8TK9Z5hvdXIT00pIqpkTgzRzbchPojfFNgLqJ2+z+gU24mOSE7vlQXA9NaEYSYCPiMT3yVLEs47FupXwX9rI7QK/m85EQAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAuCAYAAADUfRIMAAAABHNCSVQICAgIfAhkiAAAA+9JREFUWEftWEtS20AQ7XGUdcwJgMJUZYc5AfYJArusYikHSMw6C2CTLeYCkZwcAFOVPXCCOLtUxVTEDcw6tievRzPySJZkyTa7qMpFMZ9+092vPzOC1vzcfb8pJZ1BTAu/On5DSTT4OvIu8kSLdTDdPf9YCvI1GAHsEQK3tcy7/shrZ8lfGdTd8evSoT8MCCGnwcjrMQBrPpMUYOwAvwuMn6eBVwdt+F1odikkXQUPXtcW7L72d+REHWgMbbc2B7rvB/BlB6duQ5u7tOB3Df8Oc0fCod3glxfa8+toOoCmb54F1I3MeISThgC4MVrp8UuMD2DCk4R5G34Le24x9oQ5ZnTiy9VUE4U3NlOmUaTR82y2Vww8I9l74YjH2V95JIRgUjHBqhEJ4dBDOHxk7SCAhTSZOHwA4ydoyxoNNHBSG0H94LfnprVU+7MGeQxEGDLtYZ54DcIhIo8gDwIDXsdMpSmdI0xaHKM4xH1NUGDmVwIVE9oKQm+sADJA8w5dNJ7vU21e4y/4qYmYVAnAmLfTCPaM8P7IfSh7gEIizRziWDvIIhKPdfa+fCAhrrDmE8j1eW1QZU6kOnKoO0Myh59CJNfATgQRaO2tIPl9Y6BlT151XemMxIl8KiXHZO73bfT+vswBSoEC0EWocAkr/OxQWom99ibELKfAbQjtw6/hgkBJdU4kPNd/8HaXHm7ZAt0Z/FChIugQQT9M70nV1syqk4qAZbDzpICVY8TooV2q7BzNlshLfZVBVfjM62ciiSP/niP1nZUFVBZbrme0Qif323TliEFzinmW/P+gC1b5b97nJVLUzV/nslfSCfpfbl2WfqXYq3Mv90eJbl6Hkmq6dcaK25i1cq+d7LO6eQU87zI4VS4FLtS0irBUJeqhoTvN0za/XdFpr4rZEsDoMlBxvFIZSSfwayxu4fcEc7W4sth+XcqU+YIBuknPdJNmOKFpqqtPA6oizn1tGVAI5psBdxpDALdtYLuRbsoZXaME7EDwz5pDx1zCEkQqQRJzIFbA6iaHKIknpiQqUF2o+d5SV4ATmBQNtilnVfxqWyEFPIar2uwqkar6NzQhNwXIZu4WXROKzK3a2JfU4+sItzNiSofChAX7Co8TTJ64YNtEKuPHQvCGb+6zF8JclBD4Ko0hl6rJTQIqRfSTACsnOg0ff6P7iWJn9FYQM3ddDe39MZatKdUohO2584udvinQhKYWQ9W7j3mg2DSwcRtXKcPeUAUyv/9M6dSKr41obBTjxy2EYzOK0/nDBP/LNZEPYd6G+EK80GBXMDs/dHB2inliZ6RS95UKYPbSBDGTuRc3M5h44QlmRaD5NodC+1bwDz8ydtSq/uoNAAAAAElFTkSuQmCC\"","import ReactModal from \"react-modal\";\r\nimport { useState } from 'react';\r\nimport { OnboardSelect } from './../../../Onboard/OnboardComponents/Dropdown/Select';\r\nimport RequestDropdown from \"../../../Onboard/OnboardComponents/Dropdown/RequestDropdown\";\r\nimport { updateNewUserRoleStart } from \"../../../../actions/Administration/staffAdmin.action\";\r\nimport { useDispatch } from \"react-redux\";\r\n\r\nexport function RequestRole(props) {\r\n const [roleData, setRoleData] = useState();\r\n const dispatch = useDispatch();\r\n const ROLE_CATEGORY = [\r\n { id: 1, value: 'Delivery' },\r\n { id: 2, value: 'Delivery Support' },\r\n { id: 3, value: 'Overhead' },\r\n { id: 4, value: 'Hosted Resource' },\r\n ]\r\n\r\n const onAddinputhandler = (name, value) => {\r\n let temp = { ...roleData };\r\n temp[name] = value;\r\n setRoleData(temp)\r\n }\r\n const onChangeinputhandler = (e) => {\r\n setRoleData({ ...roleData, [e.target.name]: e.target.value });\r\n }\r\n\r\n const handleSubmitRequest = () => {\r\n dispatch(updateNewUserRoleStart(roleData))\r\n props.handleDeleteQueue(roleData);\r\n }\r\n\r\n return <>\r\n \r\n \r\n
\r\n Request New Role\r\n
\r\n
\r\n {props.delete === true ?\r\n
\r\n
We have successfully received your request to add a new role.
\r\n
\r\n
Role Category:{props.roles.RoleCategory}
\r\n
Role Name :{props.roles.UserRole}
\r\n
\r\n
You will receive an email confirmation from the administrator to the registered mail ID
\r\n
\r\n : <>\r\n
\r\n
Role Category * \r\n
\r\n
\r\n
\r\n Role Name * \r\n
\r\n \r\n
\r\n \r\n Description * \r\n
\r\n \r\n }\r\n
\r\n \r\n {props.buttonOne}\r\n \r\n :\r\n \r\n \r\n {props.buttonOne}\r\n \r\n \r\n {props.buttonTwo} \r\n \r\n \r\n }\r\n \r\n \r\n}\r\n\r\n\r\nexport function RequestRoleModelPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '15em',\r\n left: '30em',\r\n width: '650px',\r\n height: '350px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n","import React, { useEffect } from 'react'\r\nimport { OnboardSelect } from './../../../Onboard/OnboardComponents/Dropdown/Select';\r\nimport { useState } from 'react';\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\nimport './EmployeeDetails.css'\r\nimport { RequestRole, RequestRoleModelPopup } from './RequestNewRoleModel';\r\nimport DatePickerHandle from './../../../Onboard/OnboardComponents/KeyboardDatePicker';\r\nimport InformationIcon from \"./../../../../assets/images/Information_Icon.png\";\r\nimport dataSaveClose_icon from \"./../../../../assets/onboard-images/dataSaveClose_icon.png\";\r\n\r\n\r\nimport ToolTip from 'react-power-tooltip';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { getRoleCategory, updateSupervisorEmployeeMappingStart } from '../../../../actions/Administration/staffAdmin.action';\r\nimport moment from 'moment';\r\nimport RequestDropdown from '../../../Onboard/OnboardComponents/Dropdown/RequestDropdown';\r\nimport { ActivateModelPopup, DataRetainModel } from '../Employee-Assignment/AssignModel';\r\nimport { getRoleBasedView } from '../../../../actions/Administration/admin.action';\r\nconst Newemployee = (props) => {\r\n\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const supervisorInfo = useSelector((state) => state.staffAdminReducer.supervisorInfo);\r\n const roleCategory = useSelector((state) => state.staffAdminReducer.roleCategory);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getRoleCategory());\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\nconsole.log('supervisorInfo::::::::::',supervisorInfo)\r\n\r\n const [supervisorMapData, setSupervisorMapData] = useState();\r\n const [showRequestRole, setShowRequestRole] = useState();\r\n const [showRoleRequestSent, setShowRoleRequestSent] = useState();\r\n const [showDataRetainModel,setShowDataRetainModel] = useState(false)\r\n const [ValidFrom, setValidFrom] = useState(supervisorInfo.HireDate);\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const [showInfobar, setShowInfobar] = useState(false);\r\n const [validation, setValidation] = useState(false);\r\n const [toggleValue, setToggleValue] = useState(supervisorInfo.view === 'edit' ? true : false);\r\n const [showTooltip, setShowTooltip] = useState(false);\r\n const[dataRetain,setDataRetain] =useState('')\r\n\r\n const [userRoleSelect, setUserRoleSelect] = useState([])\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n\r\n const handleRoleCategorySelect = (name, value, id) => {\r\n let temp = { ...supervisorMapData };\r\n temp[name] = value;\r\n setSupervisorMapData(temp);\r\n let arr1 = [...roleCategory];\r\n let arr2 = arr1.find((a, i, arr) => a.RoleCategory === value)\r\n let selectedRole = arr2.RoleName;\r\n setUserRoleSelect(selectedRole);\r\n }\r\n\r\n const handleUserRoleSelect = (name, value, id) => {\r\n let temp = { ...supervisorMapData };\r\n temp[name] = value;\r\n setSupervisorMapData(temp);\r\n }\r\n const ValidFromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n let temp = { ...supervisorMapData };\r\n temp.ValidFrom = formatDate(date);\r\n setSupervisorMapData(temp);\r\n setToggleValue(false)\r\n }\r\n const ValidToDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n let temp = { ...supervisorMapData };\r\n temp.ValidTo = formatDate(date);\r\n setSupervisorMapData(temp);\r\n setToggleValue(false)\r\n }\r\n props.setcompareValidTo(supervisorMapData?.ValidTo)\r\n\r\n const formatDatefromString = (seldate) =>{\r\n var date = new Date(seldate); // M-D-YYYY\r\nvar d = date.getDate();\r\nvar m = date.getMonth() + 1;\r\nvar y = date.getFullYear();\r\n\r\nreturn (m <= 9 ? '0' + m : m) + '/' + (d <= 9 ? '0' + d : d) + '/' + y;\r\n}\r\n\r\n\r\n const onChangeGeneraltoggle = (event) => {\r\n const checked = event.target.checked;\r\n props.AccountCreatedHandle(checked)\r\n let temp = { ...supervisorMapData };\r\n temp.EmployeeID = supervisorInfo.EmployeeID;\r\n temp.SupEmployeeID = supervisorInfo.SupervisorID;\r\n let dispObj = {\r\n EmployeeID : temp.EmployeeID,\r\n RoleCategory : temp.RoleCategory,\r\n SupEmployeeID : temp.SupEmployeeID,\r\n UserRole : temp.UserRole,\r\n ValidFrom : temp.ValidFrom ? temp.ValidFrom : supervisorInfo.HireDate,\r\n ValidTo : temp.ValidTo,\r\n YesNo: 1\r\n }\r\n console.log(dispObj)\r\n const temp_Arr = {\r\n EmployeeID: temp.EmployeeID,\r\n SupervisorID: temp.SupEmployeeID,\r\n ValidFrom: temp.ValidFrom ? temp.ValidFrom : supervisorInfo.HireDate,\r\n ValidTo: temp.ValidTo,\r\n roleCategory: temp.RoleCategory,\r\n UserRole: temp.UserRole\r\n };\r\n const isEmptyInput = Object.values(temp_Arr).some(x => (x === null || x === '' || x === undefined || x === 'Invalid Date'));\r\n const isValidDate = moment(temp.ValidTo).isAfter(temp.ValidFrom ? temp.ValidFrom : supervisorInfo.HireDate)\r\n console.log(temp.ValidTo , formatDatefromString(supervisorInfo.ValidTo))\r\n console.log(moment(temp.ValidTo).isAfter(formatDatefromString(supervisorInfo.ValidTo)))\r\n const compareValidToDate = moment(temp.ValidTo).isAfter(formatDatefromString(supervisorInfo.ValidTo))\r\n const compareValidFromDate = moment(temp.ValidFrom ? temp.ValidFrom : supervisorInfo.HireDate).isAfter(formatDatefromString(supervisorInfo.ValidTo))\r\n console.log(compareValidToDate)\r\n const ExistingValidToEmployee = supervisorInfo.NewExisting === 1 ? compareValidToDate : true ;\r\n const ExistingValidFromEmployee = supervisorInfo.NewExisting === 1 ? compareValidFromDate : true ;\r\n \r\n if (isEmptyInput) {\r\n setShowInfobar(true);\r\n setValidation('Please Ensure you filled all the above input to onboard an Account ')\r\n }\r\n else if(!ExistingValidFromEmployee){\r\n setShowInfobar(true);\r\n setValidation(`Please ensure ValidFrom is after ${formatDatefromString(supervisorInfo.ValidTo)}`)\r\n }\r\n else if(!ExistingValidToEmployee){\r\n setShowInfobar(true);\r\n setValidation(`Please ensure ValidTo is after ${formatDatefromString(supervisorInfo.ValidTo)}`)\r\n }\r\n else if (!isValidDate) {\r\n setShowInfobar(true);\r\n setValidation('Please ensure \"Valid To\" date is placed after \"Valid From\" date')\r\n }\r\n if (!isEmptyInput && isValidDate && ExistingValidToEmployee && ExistingValidFromEmployee) {\r\n setValidation('')\r\n setShowInfobar(false)\r\n if(supervisorInfo.NewExisting === 1){\r\n setShowDataRetainModel(true)\r\n }\r\n else{\r\n console.log(dispObj)\r\n dispatch(updateSupervisorEmployeeMappingStart(dispObj))\r\n setToggleValue(true)\r\n }\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (supervisorInfo?.view === 'edit') {\r\n var temp_Arr = {\r\n EmployeeID: supervisorInfo.EmployeeID,\r\n SupEmployeeID: supervisorInfo.SupervisorID,\r\n ValidFrom: formatDate(supervisorInfo.ValidFrom),\r\n ValidTo: formatDate(supervisorInfo.ValidTo),\r\n RoleCategory: supervisorInfo.RoleCategory,\r\n UserRole: supervisorInfo.UserRole\r\n }\r\n setSupervisorMapData(temp_Arr)\r\n setValidFrom(supervisorInfo.ValidFrom);\r\n setValidTo(supervisorInfo.ValidTo);\r\n }\r\n }, [])\r\n\r\n const [roleData, setRoleData] = useState({})\r\n const handleRequestSubmit = data => {\r\n setRoleData(data);\r\n setShowRequestRole(false);\r\n setShowRoleRequestSent(true)\r\n }\r\n\r\n let disptemp = { ...supervisorMapData };\r\n disptemp.EmployeeID = supervisorInfo.EmployeeID;\r\n disptemp.SupEmployeeID = supervisorInfo.SupervisorID;\r\n let dispYesDataRetainObj = {\r\n EmployeeID : disptemp.EmployeeID,\r\n RoleCategory : disptemp.RoleCategory,\r\n SupEmployeeID : disptemp.SupEmployeeID,\r\n UserRole : disptemp.UserRole,\r\n ValidFrom : disptemp.ValidFrom ? disptemp.ValidFrom : supervisorInfo.HireDate,\r\n ValidTo : disptemp.ValidTo,\r\n YesNo: 1\r\n }\r\n console.log(dispYesDataRetainObj)\r\n\r\n\r\nconst YesDataRetainHandle = () =>{\r\ndispatch(updateSupervisorEmployeeMappingStart(dispYesDataRetainObj));\r\nsetShowDataRetainModel(false)\r\nsetToggleValue(true)\r\n }\r\n\r\n let dispNoDataRetainObj = {\r\n EmployeeID : disptemp.EmployeeID,\r\n RoleCategory : disptemp.RoleCategory,\r\n SupEmployeeID : disptemp.SupEmployeeID,\r\n UserRole : disptemp.UserRole,\r\n ValidFrom : disptemp.ValidFrom ? disptemp.ValidFrom : supervisorInfo.HireDate,\r\n ValidTo : disptemp.ValidTo,\r\n YesNo: 0\r\n }\r\n console.log(dispNoDataRetainObj)\r\n\r\n\r\nconst NoDataRetainHandle = () =>{\r\ndispatch(updateSupervisorEmployeeMappingStart(dispNoDataRetainObj));\r\nsetShowDataRetainModel(false)\r\nsetToggleValue(true)\r\n }\r\n \r\n \r\n \r\n useEffect(() => {\r\n props.newEmployeeToggleChange(toggleValue);\r\n }, [toggleValue,props])\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n // const DataRetain = (data) => {\r\n // console.log('data',data)\r\n // if(data === 'YES'){\r\n // let dispDataRetainObj = {\r\n // EmployeeID : disptemp.EmployeeID,\r\n // RoleCategory : disptemp.RoleCategory,\r\n // SupEmployeeID : disptemp.SupEmployeeID,\r\n // UserRole : disptemp.UserRole,\r\n // ValidFrom : disptemp.ValidFrom ? disptemp.ValidFrom : supervisorInfo.HireDate,\r\n // ValidTo : disptemp.ValidTo,\r\n // YesNo: 1\r\n // }\r\n // dispatch(updateSupervisorEmployeeMappingStart(dispDataRetainObj))\r\n // setShowDataRetainModel(false);\r\n // setToggleValue(true)\r\n // }\r\n // else if(data === 'NO'){\r\n // let dispNoDataRetainObj = {\r\n // EmployeeID : disptemp.EmployeeID,\r\n // RoleCategory : disptemp.RoleCategory,\r\n // SupEmployeeID : disptemp.SupEmployeeID,\r\n // UserRole : disptemp.UserRole,\r\n // ValidFrom : disptemp.ValidFrom ? disptemp.ValidFrom : supervisorInfo.HireDate,\r\n // ValidTo : disptemp.ValidTo,\r\n // YesNo: 0\r\n // }\r\n // dispatch(updateSupervisorEmployeeMappingStart(dispNoDataRetainObj))\r\n // setShowDataRetainModel(false);\r\n // setToggleValue(true)\r\n // }\r\n // }\r\n return (\r\n <>\r\n \r\n
General Informations
\r\n
This page enables to add new employee mapping. For more guidance, click on the Hints link on the right.
\r\n
\r\n Employee Name
{supervisorInfo.EmployeeName}
Primary Functional Supervisor
{supervisorInfo.Supervisor}
\r\n
\r\n \r\n \r\n
Role Category * \r\n
\r\n {supervisorInfo.RoleCategory ?
{supervisorInfo?.RoleCategory}
:\r\n
}\r\n
\r\n
\r\n \r\n \r\n
User Role *
{supervisorInfo.view === \"edit\" ? '' :
setShowRequestRole(true)}>REQUEST NEW ROLE
}
\r\n
\r\n {supervisorInfo.UserRole ?
{supervisorInfo?.UserRole}
:\r\n
}
\r\n
\r\n {RoleBasedView?.[0]?.StaffAdmin?.[0]?.ReadWrite === 1 ? \r\n ValidFromDateHandler(date)}\r\n />\r\n ValidToDateHandler(date)}\r\n />\r\n : \r\n \r\n
\r\n
{supervisorInfo.ValidFrom}
\r\n
\r\n
{supervisorInfo.ValidTo}
\r\n
Initial Save
\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n By selecting the toggle you set an initial saving of this record and being populated in your mapped employees list. \r\n \r\n \r\n
\r\n
\r\n {showInfobar &&
\r\n
{validation}
\r\n
setShowInfobar(false)} />
\r\n
}\r\n {showRequestRole &&
\r\n setShowRequestRole(false)}\r\n />\r\n \r\n }\r\n\r\n {showRoleRequestSent &&
\r\n {\r\n dispatch(getRoleCategory())\r\n setShowRoleRequestSent(false); setShowRequestRole(false)\r\n }}\r\n />\r\n \r\n }\r\n\r\n {showDataRetainModel &&
\r\n \r\n }\r\n\r\n
\r\n \r\n {props.mode === 'Edit' ? 'Edit' : 'Add' } Role and Account\r\n
\r\n {validation && Please Ensure you filled all the inputs with \" * \" mark
}\r\n \r\n \r\n Role * \r\n
\r\n \r\n Site \r\n
\r\n \r\n\r\n \r\n \r\n Region \r\n
\r\n \r\n Account \r\n
\r\n \r\n\r\n \r\n \r\n ValidFromDateHandler(date)}\r\n />\r\n
\r\n \r\n ValidToDateHandler(date)}\r\n />\r\n
\r\n \r\n\r\n \r\n {props.mode === 'Edit' ? 'UPDATE' : 'ADD' } \r\n CANCEL \r\n \r\n \r\n \r\n}\r\n\r\nexport function AddRoleAccountPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '24%',\r\n left: '25%',\r\n width: '700px',\r\n height: '430px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\n\r\nexport function UserDropdown(props) {\r\n const dispatch = useDispatch();\r\n // let saveUserStoredStatus = useSelector((state) => state.adminViewReducer.saveUserStoredStatus);\r\n // console.log('saveUserStoredFilter',saveUserStoredStatus)\r\n const { data, value, id, className, name, onChange, editValue } = props;\r\n const [openData, setOpenData] = useState(false);\r\n const [Inputvalue, setInputValue] = useState(props.inputvalue);\r\n const [query, setQuery] = useState('');\r\n const filterQuery = options => {\r\n return options?.filter(option => {\r\n if (query === '') return option;\r\n else if (option[value]?.toLowerCase().includes(query.toLowerCase().trim()))\r\n return option;\r\n })\r\n }\r\n\r\n\r\n useEffect(() => {\r\n if (!openData) setQuery('')\r\n }, [openData])\r\n\r\n useEffect(() => {\r\n setInputValue(editValue);\r\n }, [editValue, name, setInputValue]);\r\n\r\n const dropdownHandler = (event, option) => {\r\n setInputValue(option[value]);\r\n dispatch(saveUserStoredStatus(option[value]))\r\n setOpenData(!openData);\r\n props.addValueToQueue(name, option[value], option[id]);\r\n }\r\n const dropDownref = useRef();\r\n const inputValueRef = useRef();\r\n useEffect(() => {\r\n const handleClickOutside = (event) => {\r\n if (dropDownref.current && !dropDownref.current.contains(event.target)) {\r\n if (!openData)\r\n setOpenData(openData);\r\n }\r\n }\r\n document.addEventListener(\"click\", handleClickOutside);\r\n return () => {\r\n document.removeEventListener(\"click\", handleClickOutside);\r\n };\r\n }, [dropDownref]);\r\n\r\n return (\r\n \r\n \r\n \r\n
{\r\n setQuery(e.target.value);\r\n setOpenData(true);\r\n setInputValue(null)\r\n }}\r\n onClick={() => {\r\n setOpenData(!openData);\r\n }}\r\n placeholder='Select'\r\n />\r\n
{\r\n setOpenData(!openData);\r\n }}\r\n ref={dropDownref}\r\n >\r\n {!openData ?
:\r\n
}\r\n
\r\n
\r\n {openData &&
\r\n {filterQuery(data)?.map((option,i) =>\r\n ({\r\n dropdownHandler(event, option)} \r\n }>\r\n {option?.[value]} \r\n {option?.Contractual === 'Yes' && )\r\n )}\r\n }\r\n
\r\n \r\n )\r\n}\r\n","import React, { useEffect, useState } from 'react';\r\nimport { OnboardSelect } from '../../../Onboard/OnboardComponents/Dropdown/Select';\r\nimport MOCKDATA from './Tab.json';\r\nimport DatePickerHandle from '../../../Onboard/OnboardComponents/KeyboardDatePicker';\r\nimport filterIcon from './../../../../assets/images/Filter_Icon.png';\r\nimport moment from 'moment';\r\nimport { UserDropdown } from '../../AdminFirstPage/Users/UserModels';\r\n\r\n\r\n\r\n\r\nfunction formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n}\r\n\r\n\r\nexport function AccountAssignmentModal(props) {\r\n const [ValidFrom, setValidFrom] = useState(new Date(''));\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const editMode = props.editMode;\r\n const [addFormInfo, setAddFormInfo] = useState({})\r\n const [editFormInfo, setEditFormInfo] = useState({})\r\n\r\n useEffect(() => {\r\n if (editMode) {\r\n setValidFrom(props.editedInfo.value3);\r\n setValidTo(props.editedInfo.value4);\r\n let temp_Arr = {\r\n value1: props.editedInfo.value1,\r\n value2: props.editedInfo.value2,\r\n value3: (props.editedInfo.value3),\r\n value4: (props.editedInfo.value4),\r\n }\r\n setEditFormInfo(temp_Arr)\r\n }\r\n }, [])\r\n const addValueToAccount = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[name] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData[name] = value;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n const ValidfromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n addValueToAccount('value3', formatDate(date))\r\n }\r\n const ValidtoDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n addValueToAccount('value4', formatDate(date))\r\n }\r\n\r\n const [validation, setValidation] = useState('');\r\n const onSubmitAccount = (event) => {\r\n event.preventDefault();\r\n let temp_arr;\r\n temp_arr = !editMode ? {\r\n value1: addFormInfo.value1,\r\n value2: addFormInfo.value2,\r\n value3: (addFormInfo.value3),\r\n value4: (addFormInfo.value4),\r\n } : {\r\n value2: editFormInfo.value2,\r\n value3: (editFormInfo.value3),\r\n value4: (editFormInfo.value4),\r\n }\r\n const accountRepeat = Object.values(props.accountData).some(x => x.value1 === addFormInfo.value1);\r\n const isEmptyInput = Object.values(temp_arr).some(x => (x === null || x === '' || x === undefined));\r\n const isValidDate = moment(temp_arr.value4).isAfter(temp_arr.value3)\r\n if (isEmptyInput) {\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ');\r\n }\r\n else if (!isValidDate) {\r\n setValidation('Please ensure \"Valid to\" date is placed after \"Valid from\" date ');\r\n }\r\n else if (accountRepeat){\r\n setValidation('Account already exists. Please Select Different Account')\r\n }\r\n else {\r\n props.onAccountSubmitHandle(editMode ? editFormInfo : addFormInfo)\r\n setValidation('');\r\n setAddFormInfo(null);\r\n }\r\n }\r\n return (\r\n <>\r\n \r\n \r\n
{editMode ? 'EDIT' : 'ADD'} ACCOUNT
\r\n
{validation}
\r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nexport function QueueAssignmentAddModal(props) {\r\n const [ValidFrom, setValidFrom] = useState(null);\r\n const [ValidTo, setValidTo] = useState(null);\r\n const editMode = props.editMode;\r\n const [addFormInfo, setAddFormInfo] = useState({})\r\n const [editFormInfo, setEditFormInfo] = useState({})\r\n\r\n \r\n const addValueToQueue = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData.value2 = value;\r\n let queue = props.data.find((a, i, arr) => a.QueueID === id)\r\n newFormData.value1 = queue?.Customer;\r\n newFormData.value3 = queue?.Language;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData.value2 = value;\r\n let queue = props.data.find((a, i, arr) => a.QueueID === id)\r\n newFormData.value1 = queue?.Customer;\r\n newFormData.value3 = queue?.Language;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n\r\n const addDateToQueue = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[name] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData[name] = value;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n const ValidFromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n addDateToQueue('value4', formatDate(date))\r\n }\r\n const ValidToDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n addDateToQueue('value5', formatDate(date))\r\n }\r\n\r\nconst [selectedData, setSelectedData] = useState()\r\n\r\nuseEffect(() => {\r\n \r\n setSelectedData(props.data)\r\n}, [props]);\r\n\r\nconst toggle =(opdata) => {\r\n const newData = [...selectedData];\r\n newData.map((itm, i) => {\r\n if (opdata?.QueueID === itm?.QueueID) {\r\n newData.splice(i, 1, {\r\n QueueID: itm.QueueID,\r\n QueueName: itm.QueueName,\r\n Customer:itm.Customer,\r\n Language:itm.Language,\r\n Selected: !itm.Selected\r\n });\r\n setSelectedData(newData);\r\n }})\r\n };\r\n\r\n const [checkedAll, setCheckedAll] = useState(false)\r\n\r\n const handleChange = event => {\r\n if (event.target.checked) {\r\n const newData = [...selectedData];\r\n newData.map((itm, i) => {\r\n newData.splice(i, 1, {\r\n QueueID: itm.QueueID,\r\n QueueName: itm.QueueName,\r\n Customer:itm.Customer,\r\n Language:itm.Language,\r\n Selected: true\r\n });\r\n setSelectedData(newData);\r\n })\r\n } else {\r\n const newData = [...selectedData];\r\n newData.map((itm, i) => {\r\n newData.splice(i, 1, {\r\n QueueID: itm.QueueID,\r\n QueueName: itm.QueueName,\r\n Customer:itm.Customer,\r\n Language:itm.Language,\r\n Selected: false\r\n });\r\n setSelectedData(newData);\r\n })\r\n }\r\n setCheckedAll(current => !current);\r\n };\r\n\r\nconsole.log('selectedData',selectedData)\r\n\r\n const [validation, setValidation] = useState('');\r\n\r\n const onSubmitAccount = (event) => {\r\n event.preventDefault();\r\n\r\n let DispQueues = selectedData.filter((el) =>{\r\n return el.Selected === true});\r\n let Queues = DispQueues.map(queue => {\r\n return {\r\n value1:queue.Customer,\r\n value2:queue.QueueName,\r\n value3:queue.Language,\r\n value4: (addFormInfo.value4),\r\n value5: (addFormInfo.value5),\r\n }\r\n });\r\n\r\n console.log('Queues',Queues,DispQueues)\r\n let temp_arr;\r\n temp_arr = !editMode ? {\r\n value2: addFormInfo.value2,\r\n value4: (addFormInfo.value4),\r\n value5: (addFormInfo.value5),\r\n } : {\r\n value2: editFormInfo.value2,\r\n value4: (editFormInfo.value4),\r\n value5: (editFormInfo.value5),\r\n }\r\n // const queueRepeat = Object.values(props.queueData).some(x => x.value2 === addFormInfo.value2);\r\n // const isEmptyInput = Object.values(temp_arr).some(x => (x === null || x === '' || x === undefined));\r\n const isValidDate = moment(temp_arr.value5).isAfter(temp_arr.value4)\r\n // if (isEmptyInput) {\r\n // setValidation('Please Ensure you filled all the inputs with \" * \" mark ');\r\n // }\r\n if (!isValidDate) {\r\n setValidation('Please ensure \"Valid to\" date is placed after \"Valid from\" date ');\r\n }\r\n // else if (queueRepeat){\r\n // setValidation('Queue already exists. Please Select Different Queue')\r\n // }\r\n else {\r\n props.onAccountSubmitHandle(editMode ? editFormInfo : Queues)\r\n setValidation('');\r\n setAddFormInfo(null);\r\n }\r\n }\r\n\r\n const Type = [\r\n {\r\n Type: \"All Queues\",\r\n id: \"1\"\r\n }, {\r\n Type: \"Selected Queues\",\r\n id: \"2\"\r\n }\r\n ]\r\n\r\n const [queues, setqueues] = useState();\r\n const addValueToStatus = (name, value) => {\r\n const newFormData = { ...queues };\r\n if (name !== 'Select') {\r\n newFormData[name] = value;\r\n setqueues(newFormData)\r\n \r\n }\r\n }\r\n console.log('queues',queues?.Type)\r\n\r\n const QueueDataHandler = () =>{\r\n if(queues?.Type === 'Selected Queues'){\r\n let DispQueues = selectedData.filter((el) =>{\r\n return el.Selected === true});\r\n return DispQueues\r\n }\r\n else{\r\n return selectedData \r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n {editMode ? 'EDIT' : 'ADD'} Queue\r\n
\r\n
{validation}
\r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nexport function QueueAssignmentModal(props) {\r\n const [ValidFrom, setValidFrom] = useState(new Date(''));\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const editMode = props.editMode;\r\n const [addFormInfo, setAddFormInfo] = useState({})\r\n const [editFormInfo, setEditFormInfo] = useState({})\r\n\r\n useEffect(() => {\r\n if (editMode) {\r\n setValidFrom(props.editedInfo.value4);\r\n setValidTo(props.editedInfo.value5);\r\n let temp_Arr = {\r\n value1: props.editedInfo.value1,\r\n value2: props.editedInfo.value2,\r\n value3: (props.editedInfo.value3),\r\n value4: (props.editedInfo.value4),\r\n value5: (props.editedInfo.value5),\r\n }\r\n setEditFormInfo(temp_Arr)\r\n }\r\n }, [])\r\n const addValueToQueue = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData.value2 = value;\r\n let queue = props.data.find((a, i, arr) => a.QueueID === id)\r\n newFormData.value1 = queue?.Customer;\r\n newFormData.value3 = queue?.Language;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData.value2 = value;\r\n let queue = props.data.find((a, i, arr) => a.QueueID === id)\r\n newFormData.value1 = queue?.Customer;\r\n newFormData.value3 = queue?.Language;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n\r\n const addDateToQueue = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[name] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData[name] = value;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n const ValidFromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n addDateToQueue('value4', formatDate(date))\r\n }\r\n const ValidToDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n addDateToQueue('value5', formatDate(date))\r\n }\r\n const [validation, setValidation] = useState('');\r\n\r\n const onSubmitAccount = (event) => {\r\n event.preventDefault();\r\n let temp_arr;\r\n temp_arr = !editMode ? {\r\n value2: addFormInfo.value2,\r\n value4: (addFormInfo.value4),\r\n value5: (addFormInfo.value5),\r\n } : {\r\n value2: editFormInfo.value2,\r\n value4: (editFormInfo.value4),\r\n value5: (editFormInfo.value5),\r\n }\r\n const queueRepeat = Object.values(props.queueData).some(x => x.value2 === addFormInfo.value2);\r\n const isEmptyInput = Object.values(temp_arr).some(x => (x === null || x === '' || x === undefined));\r\n const isValidDate = moment(temp_arr.value5).isAfter(temp_arr.value4)\r\n if (isEmptyInput) {\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ');\r\n }\r\n else if (!isValidDate) {\r\n setValidation('Please ensure \"Valid to\" date is placed after \"Valid from\" date ');\r\n }\r\n else if (queueRepeat){\r\n setValidation('Queue already exists. Please Select Different Queue')\r\n }\r\n else {\r\n props.onAccountSubmitHandle(editMode ? editFormInfo : addFormInfo)\r\n setValidation('');\r\n setAddFormInfo(null);\r\n }\r\n }\r\n\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n {editMode ? 'EDIT' : 'ADD'} Queue\r\n
\r\n
{validation}
\r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nexport function IDAssignmentModal(props) {\r\n const [ValidFrom, setValidFrom] = useState(new Date(''));\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const editMode = props.editMode;\r\n const [addFormInfo, setAddFormInfo] = useState({})\r\n const [editFormInfo, setEditFormInfo] = useState({})\r\n\r\n useEffect(() => {\r\n if (editMode) {\r\n setValidFrom(props.editedInfo.value4);\r\n setValidTo(props.editedInfo.value5);\r\n let temp_Arr = {\r\n value1: props.editedInfo.value1,\r\n value2: props.editedInfo.value2,\r\n value3: (props.editedInfo.value3),\r\n value4: (props.editedInfo.value4),\r\n value5: (props.editedInfo.value5),\r\n }\r\n setEditFormInfo(temp_Arr)\r\n }\r\n }, [])\r\n const addValueToID = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[name] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData[name] = value;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n const handleAddFormValue = (event) => {\r\n if (editMode) {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...editFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setEditFormInfo(newFormData);\r\n }\r\n else {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...addFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setAddFormInfo(newFormData);\r\n }\r\n }\r\n const ValidfromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n addValueToID('value4', formatDate(date))\r\n }\r\n const ValidtoDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n addValueToID('value5', formatDate(date))\r\n }\r\n\r\n const [validation, setValidation] = useState('');\r\n const onSubmitAccount = (event) => {\r\n event.preventDefault();\r\n let temp_arr;\r\n temp_arr = !editMode ? {\r\n value1: addFormInfo.value1,\r\n value2: addFormInfo.value2,\r\n value3: (addFormInfo.value3),\r\n value4: (addFormInfo.value4),\r\n value5: (addFormInfo.value5)\r\n } : {\r\n value1: editFormInfo.value1,\r\n value2: editFormInfo.value2,\r\n value3: (editFormInfo.value3),\r\n value4: (editFormInfo.value4),\r\n value5: (editFormInfo.value5)\r\n }\r\n console.log('idrepeat',addFormInfo,props.IDdata)\r\n const IDaccountRepeat = Object.values(props.IDdata).some(x => x.value1 === addFormInfo.value1 && x.value3 === addFormInfo.value3);\r\n const isEmptyInput = Object.values(temp_arr).some(x => (x === null || x === '' || x === undefined));\r\n const isValidDate = moment(temp_arr.value5).isAfter(temp_arr.value4)\r\n if (isEmptyInput) {\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ');\r\n }\r\n else if (!isValidDate) {\r\n setValidation('Please ensure \"Valid to\" date is placed after \"Valid from\" date ');\r\n }\r\n else if (IDaccountRepeat){\r\n setValidation('Account already exists with the selected ID. Please Use the different ID.')\r\n }\r\n else {\r\n props.onAccountSubmitHandle(editMode ? editFormInfo : addFormInfo)\r\n setValidation('');\r\n setAddFormInfo(null);\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n
{editMode ? 'EDIT' : 'ADD'} ID
\r\n
{validation}
\r\n
\r\n
\r\n \r\n )\r\n}","import React, { useEffect, useState } from 'react';\r\nimport { OnboardSelect } from '../../../Onboard/OnboardComponents/Dropdown/Select';\r\nimport moment from 'moment';\r\nimport DatePickerHandle from '../../../Onboard/OnboardComponents/KeyboardDatePicker';\r\n\r\nfunction formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n}\r\n\r\n\r\nexport function SLAAssignmentModal(props) {\r\n const [ValidFrom, setValidFrom] = useState(new Date(''));\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const editMode = props.editMode;\r\n const [addFormInfo, setAddFormInfo] = useState({})\r\n const [editFormInfo, setEditFormInfo] = useState({});\r\n const [placeholder, setPlaceholder] = useState('Example : 38.45 %');\r\n const [selectedtype, setSelectedType] = useState('');\r\n const [description, setDescription] = useState('');\r\n const [AccountsSLA, setAccountsSLA] = useState([])\r\n\r\n const [AccountSLAID, setAccountSLAID] = useState(null)\r\n useEffect(() => {\r\n if (editMode) {\r\n setValidFrom(props.editedInfo.value6);\r\n setValidTo(props.editedInfo.value7);\r\n let temp_Arr = {\r\n value1: props.editedInfo.value1,\r\n value2: props.editedInfo.value2,\r\n value3: (props.editedInfo.value3),\r\n value4: (props.editedInfo.value4),\r\n value5: (props.editedInfo.value5),\r\n value6: (props.editedInfo?.value6),\r\n value7: (props.editedInfo?.value7),\r\n value8: props.editedInfo?.value8\r\n }\r\n setEditFormInfo(temp_Arr);\r\n console.log(props.data,)\r\n let SLA = props.SLATemplatesForEdit.find((a, i, arr) => a?.['template Name'] === props.editedInfo.value3)\r\n console.log(SLA)\r\n setDescription(SLA?.description)\r\n setAccountSLAID(SLA?.accountSLAID)\r\n formatTypeManager(SLA?.formatType)\r\n }\r\n }, []);\r\n\r\n\r\n\r\n const formatTypeManager = (value) => {\r\n if (!isNaN(value)) {\r\n setPlaceholder('Example: 000'); setSelectedType('Number');\r\n }\r\n else if (value.includes('%')) {\r\n setPlaceholder('Example : 38.56 %'); setSelectedType('Percentage');\r\n }\r\n else if (value.includes(':')) {\r\n setPlaceholder('HH : MM : SS'); setSelectedType('Time');\r\n }\r\n }\r\n\r\n const addValueToTemplate = (name, value, id) => {\r\n const newFormData = { ...addFormInfo };\r\n newFormData.value1 = value;\r\n let accounts = props.data.filter((a, i, arr) => a.account === value)\r\n setAccountsSLA(accounts)\r\n setAddFormInfo(newFormData)\r\n }\r\n\r\n\r\n const addValueToSLA = (name, value, id) => {\r\n const newFormData = { ...addFormInfo };\r\n newFormData.value3 = value;\r\n let SLA = props.data.find((a, i, arr) => a.accountSLAID === id)\r\n newFormData.value2 = SLA?.['slA/KPI'];\r\n setDescription(SLA?.description)\r\n formatTypeManager(SLA?.formatType)\r\n setAccountSLAID(SLA?.accountSLAID)\r\n setAddFormInfo(newFormData)\r\n }\r\n\r\n const handleAddFormSLA = event => {\r\n if (editMode) {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...editFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setEditFormInfo(newFormData);\r\n }\r\n else {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...addFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setAddFormInfo(newFormData);\r\n }\r\n }\r\n\r\n const addDateToSLA = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[name] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData[name] = value;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n const ValidFromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n addDateToSLA('value6', formatDate(date))\r\n }\r\n const ValidToDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n addDateToSLA('value7', formatDate(date))\r\n }\r\n const [validation, setValidation] = useState('');\r\n\r\n const FormatTypeValidation = (type, value) => {\r\n switch (type) {\r\n case 'Percentage': {\r\n return value?.match(/^(100(\\.0{1,2})?|[1-9]?\\d(\\.\\d{1,2})?)$/) === null && value?.includes('%');\r\n }\r\n case 'Time': {\r\n return moment(value, ['HH:mm:ss', 'HH:mm', 'h:mm', 'h:mm A', 'hh:mm A', 'HH:MM:SS A'], true).isValid();\r\n }\r\n case 'Number': {\r\n return !isNaN(value);\r\n }\r\n default: { }\r\n }\r\n }\r\n const onSubmitAccount = (event) => {\r\n event.preventDefault();\r\n const temp_Arr = !editMode ? {\r\n value1: addFormInfo.value1,\r\n value2: addFormInfo.value2,\r\n value3: addFormInfo.value3,\r\n value4: (addFormInfo.value4),\r\n value5: (addFormInfo.value5),\r\n value6: (addFormInfo.value6),\r\n value7: (addFormInfo.value7)\r\n } : {\r\n value1: editFormInfo.value1,\r\n value2: editFormInfo.value2,\r\n value3: editFormInfo.value3,\r\n value4: (editFormInfo.value4),\r\n value5: (editFormInfo.value5),\r\n value6: (editFormInfo.value6),\r\n value7: (editFormInfo.value7)\r\n }\r\n const slaRepeat = Object.values(props.SLAData).some(x => x.value3 === addFormInfo.value3);\r\n const isEmpty = Object.values(temp_Arr).some(temp => (temp === null || temp === '' || temp === undefined));\r\n const isValidType = FormatTypeValidation(selectedtype, temp_Arr.value4)\r\n const isValidDate = moment(temp_Arr.value7).isAfter(temp_Arr.value6)\r\n const isWeightingValidated = temp_Arr.value5?.match(/^(100(\\.0{1,2})?|[1-9]?\\d(\\.\\d{1,2})?)$/) === null && temp_Arr.value5?.includes('%');\r\n if (isEmpty) {\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else if (!isValidDate) {\r\n setValidation('Please ensure \"Valid to\" date is placed after \"Valid from\" date ')\r\n }\r\n else if (!isValidType) {\r\n setValidation('Please ensure Target type entry is relevant to the format selected ')\r\n }\r\n else if (!isWeightingValidated) {\r\n setValidation('Please ensure Weighting entry is relevant to the \"%\" format')\r\n }\r\n else if (slaRepeat){\r\n setValidation('Item Name already exists.Please Select Different Item Name')\r\n }\r\n else {\r\n props.onAccountSubmitHandle(editMode ? editFormInfo : addFormInfo, AccountSLAID)\r\n setValidation('');\r\n setAddFormInfo(null);\r\n }\r\n }\r\n return (\r\n <>\r\n \r\n \r\n
{editMode ? 'EDIT' : 'ADD'} SLA/KPI
\r\n
{validation}
\r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nexport function VolumeAssignmentModal(props) {\r\n const [ValidFrom, setValidFrom] = useState(new Date(''));\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const editMode = props.editMode;\r\n const [addFormInfo, setAddFormInfo] = useState({})\r\n const [editFormInfo, setEditFormInfo] = useState({});\r\n const [placeholder, setPlaceholder] = useState('Example : 38.45 %');\r\n const [selectedtype, setSelectedType] = useState('');\r\n const [description, setDescription] = useState('');\r\n const [AccountsVolumetric, setAccountsVolumetric] = useState([])\r\n\r\n const [AccountVolumeID, setAccountVolumeID] = useState(null)\r\n useEffect(() => {\r\n if (editMode) {\r\n setValidFrom(props.editedInfo.value6);\r\n setValidTo(props.editedInfo.value7);\r\n let temp_Arr = {\r\n value1: props.editedInfo.value1,\r\n value2: props.editedInfo.value2,\r\n value3: (props.editedInfo.value3),\r\n value4: (props.editedInfo.value4),\r\n value5: (props.editedInfo.value5),\r\n value6: (props.editedInfo?.value6),\r\n value7: (props.editedInfo?.value7),\r\n value8: props.editedInfo?.value8\r\n }\r\n setEditFormInfo(temp_Arr);\r\n let SLA = props.VolumeTemplatesForEdit.find((a, i, arr) => a?.['template Name'] === props.editedInfo.value3)\r\n console.log('sla::::::::::',SLA)\r\n setDescription(SLA?.description)\r\n setAccountVolumeID(SLA?.accountVoumetricID)\r\n formatTypeManager(SLA?.formatType)\r\n }\r\n }, []);\r\n\r\n\r\n\r\n const formatTypeManager = (value) => {\r\n if (!isNaN(value)) {\r\n setPlaceholder('Example: 000'); setSelectedType('Number');\r\n }\r\n else if (value.includes('%')) {\r\n setPlaceholder('Example : 38.56 %'); setSelectedType('Percentage');\r\n }\r\n else if (value.includes(':')) {\r\n setPlaceholder('HH : MM : SS'); setSelectedType('Time');\r\n }\r\n }\r\n\r\n const addValueToTemplate = (name, value, id) => {\r\n const newFormData = { ...addFormInfo };\r\n newFormData.value1 = value;\r\n let accounts = props.VolumeTemplates.filter((a, i, arr) => a.account === value)\r\n setAccountsVolumetric(accounts)\r\n setAddFormInfo(newFormData)\r\n }\r\n\r\n\r\n const addValueToSLA = (name, value, id) => {\r\n const newFormData = { ...addFormInfo };\r\n newFormData.value3 = value;\r\n let SLA = props.VolumeTemplates.find((a, i, arr) => a.accountVoumetricID === id)\r\n newFormData.value2 = SLA?.['slA/KPI'];\r\n setDescription(SLA?.description)\r\n formatTypeManager(SLA?.formatType)\r\n setAccountVolumeID(SLA?.accountVoumetricID)\r\n setAddFormInfo(newFormData)\r\n }\r\n\r\n const handleAddFormSLA = event => {\r\n if (editMode) {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...editFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setEditFormInfo(newFormData);\r\n }\r\n else {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...addFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setAddFormInfo(newFormData);\r\n }\r\n }\r\n\r\n const addDateToSLA = (name, value, id) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[name] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addFormInfo };\r\n newFormData[name] = value;\r\n setAddFormInfo(newFormData)\r\n }\r\n }\r\n const ValidFromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n addDateToSLA('value6', formatDate(date))\r\n }\r\n const ValidToDateHandler = (date) => {\r\n setValidTo(formatDate(date));\r\n addDateToSLA('value7', formatDate(date))\r\n }\r\n const [validation, setValidation] = useState('');\r\n\r\n const FormatTypeValidation = (type, value) => {\r\n switch (type) {\r\n case 'Percentage': {\r\n return value?.match(/^(100(\\.0{1,2})?|[1-9]?\\d(\\.\\d{1,2})?)$/) === null && value?.includes('%');\r\n }\r\n case 'Time': {\r\n return moment(value, ['HH:mm:ss', 'HH:mm', 'h:mm', 'h:mm A', 'hh:mm A', 'HH:MM:SS A'], true).isValid();\r\n }\r\n case 'Number': {\r\n return !isNaN(value);\r\n }\r\n default: { }\r\n }\r\n }\r\n const onSubmitAccount = (event) => {\r\n event.preventDefault();\r\n const temp_Arr = !editMode ? {\r\n value1: addFormInfo.value1,\r\n value2: addFormInfo.value2,\r\n value3: addFormInfo.value3,\r\n value4: (addFormInfo.value4),\r\n value5: (addFormInfo.value5),\r\n value6: (addFormInfo.value6),\r\n value7: (addFormInfo.value7)\r\n } : {\r\n value1: editFormInfo.value1,\r\n value2: editFormInfo.value2,\r\n value3: editFormInfo.value3,\r\n value4: (editFormInfo.value4),\r\n value5: (editFormInfo.value5),\r\n value6: (editFormInfo.value6),\r\n value7: (editFormInfo.value7)\r\n }\r\n const volumeRepeat = Object.values(props.VolumeData).some(x => x.value3 === addFormInfo.value3);\r\n const isEmpty = Object.values(temp_Arr).some(temp => (temp === null || temp === '' || temp === undefined));\r\n const isValidType = FormatTypeValidation(selectedtype, temp_Arr.value4)\r\n const isValidDate = moment(temp_Arr.value7).isAfter(temp_Arr.value6)\r\n const isWeightingValidated = temp_Arr.value5?.match(/^(100(\\.0{1,2})?|[1-9]?\\d(\\.\\d{1,2})?)$/) === null && temp_Arr.value5?.includes('%');\r\n if (isEmpty) {\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else if (!isValidDate) {\r\n setValidation('Please ensure \"Valid to\" date is placed after \"Valid from\" date ')\r\n }\r\n else if (!isValidType) {\r\n setValidation('Please ensure Target type entry is relevant to the format selected ')\r\n }\r\n else if (!isWeightingValidated) {\r\n setValidation('Please ensure Weighting entry is relevant to the \"%\" format')\r\n }\r\n else if (volumeRepeat){\r\n setValidation('Item Name already exists.Please Select Different Item Name')\r\n }\r\n else {\r\n console.log(AccountVolumeID)\r\n props.onAccountSubmitHandle(editMode ? editFormInfo : addFormInfo, AccountVolumeID)\r\n setValidation('');\r\n setAddFormInfo(null);\r\n }\r\n }\r\n return (\r\n <>\r\n \r\n \r\n
{editMode ? 'EDIT' : 'ADD'} Volumetrics
\r\n
{validation}
\r\n
\r\n
\r\n \r\n )\r\n}","import ReactModal from \"react-modal\";\r\n\r\nReactModal.setAppElement('#root')\r\nexport function QueueassignPopup({ isOpen, setShowModal,children }) {\r\n return (<>\r\n \r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '12em',\r\n left: '30em',\r\n width: '600px',\r\n height: '340px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n // position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n
\r\n )\r\n}\r\n\r\nexport function QueueassignAddPopup({ isOpen, setShowModal,children }) {\r\n return (<>\r\n \r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '10em',\r\n left: '30em',\r\n width: '650px',\r\n height: '400px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n // position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n
\r\n )\r\n}\r\n\r\nexport function SLAModalPopup({ isOpen, setShowModal,children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '10em',\r\n left: '30em',\r\n width: '660px',\r\n height: '510px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}","import React, { Fragment, useEffect, useState } from 'react';\r\nimport './EmployeeTab.css';\r\nimport AddAccount_Icon from '../../../../assets/images/AddAccount_Icon.png';\r\nimport Add_Queue_Icon from '../../../../assets/images/Add_Queue_Icon.png';\r\nimport Add_SLA_KPI_Icon from '../../../../assets/images/Add_SLA_KPI_Icon.png';\r\nimport AddID_Icon from '../../../../assets/images/AddID_Icon.png';\r\nimport Inactive_Img from \"../../../../assets/admin-images/Inactive_Indication_Icon.png\";\r\nimport Add_Volumetric_Icon from \"../../../../assets/admin-images/Add_Volumetric_Icon.png\";\r\nimport Search_Icon from \"../../../../assets/images/Search_Icon.png\"\r\nimport Edit_Icon from \"../../../../assets/images/Edit_Icon.png\"\r\nimport MOCKDATA from './Tab.json'\r\nimport { AccountAssignmentModal, IDAssignmentModal, QueueAssignmentAddModal, QueueAssignmentModal } from './QueueAssignmentModal';\r\nimport { SLAAssignmentModal, VolumeAssignmentModal } from './SLAAssignmentModel';\r\nimport moment from 'moment';\r\nimport { QueueassignAddPopup, QueueassignPopup, SLAModalPopup } from './ModelPopUps';\r\nimport TooltipHandler from '../../../Onboard/OnboardComponents/TooltipHandler';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { getAccountSLA, getAccountSLAForEdit, getIDAccounts, getQueueData, getSLAAccounts, getStaffAccounts } from '../../../../actions/Administration/staffAdmin.action';\r\nimport { getVolumeTemplates, getVolumeTemplatesForEdit } from './../../../../actions/Administration/staffAdmin.action';\r\nimport { getRoleBasedView } from '../../../../actions/Administration/admin.action';\r\n\r\n\r\nfunction EmployeeTabHandler(props) {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const AccountsInfo = useSelector((state) => state.staffAdminReducer.staffAccounts);\r\n const queueLists = useSelector((state) => state.staffAdminReducer.queueData);\r\n const SLATemplates = useSelector((state) => state.staffAdminReducer.accountSLA);\r\n const VolumeTemplates = useSelector((state) => state.staffAdminReducer.volumeTemplates);\r\n const SLATemplatesForEdit = useSelector((state) => state.staffAdminReducer.accountSLAForEdit);\r\n const VolumeTemplatesForEdit = useSelector((state) => state.staffAdminReducer.volumeTemplatesForEdit);\r\n console.log('create', VolumeTemplates, 'edit', VolumeTemplatesForEdit)\r\n const supervisorInfo = useSelector((state) => state.staffAdminReducer.supervisorInfo);\r\n const idAccounts = useSelector((state) => state.staffAdminReducer.idAccounts);\r\n const slaAccounts = useSelector((state) => state.staffAdminReducer.slaAccounts);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getStaffAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID));\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n\r\n const [AddTab, setAddTab] = useState('Add Account');\r\n const [imgSrc, setImgSrc] = useState(AddAccount_Icon);\r\n const [tab, setTab] = useState('account');\r\n const [editRowID, setEditRowID] = useState(null);\r\n const [editFormInfo, setEditFormInfo] = useState({});\r\n const [searchColumns, setSearchColumns] = useState([\r\n 'value1', 'value2'\r\n ]);\r\n const [accountData, setAccountData] = useState([]);\r\n const [queueData, setQueueData] = useState([]);\r\n const [IDdata, setIDData] = useState([]);\r\n const [SLAData, setSLAData] = useState([]);\r\n const [VolumeData, setVolumeData] = useState([]);\r\n const [headerData, setHeaderData] = useState(MOCKDATA.ACCOUNT_ASSIGNMENTS.headers)\r\n const [VolumeID, setVolumeID] = useState(null)\r\n const [endDateKey, setEndDateKey] = useState('');\r\n\r\n const [slashow, setslaShow] = useState(false)\r\n\r\n useEffect(() => {\r\n switch (props.tab) {\r\n case 'account': {\r\n setImgSrc(AddAccount_Icon)\r\n setAddTab('Add Account')\r\n setTab('account');\r\n setSearchColumns(['value1', 'value2'])\r\n setHeaderData(MOCKDATA.ACCOUNT_ASSIGNMENTS.headers);\r\n dispatch(getStaffAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n setAccountData(props.StaffAdminData)\r\n setEndDateKey('value4');\r\n setslaShow(false);\r\n break;\r\n }\r\n case 'queue': {\r\n setImgSrc(Add_Queue_Icon)\r\n setAddTab('Add Queue')\r\n setTab('queue');\r\n setHeaderData(MOCKDATA.QUEUE_ASSIGNMENTS.headers);\r\n dispatch(getQueueData(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n setQueueData(props.StaffAdminData)\r\n setEndDateKey('value5');\r\n setslaShow(false);\r\n break;\r\n }\r\n\r\n case 'assign': {\r\n setImgSrc(AddID_Icon);\r\n setAddTab('Add ID');\r\n setTab('assign');\r\n setHeaderData(MOCKDATA.ID_ASSIGNMENTS.headers);\r\n setSearchColumns(['value1', 'value2', 'value3']);\r\n dispatch(getIDAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n setIDData(props.StaffAdminData)\r\n setEndDateKey('value5');\r\n setslaShow(false);\r\n break;\r\n }\r\n\r\n case 'slakpi': {\r\n setImgSrc(Add_SLA_KPI_Icon)\r\n setAddTab('Add SLA/KPI')\r\n setTab('slakpi');\r\n setHeaderData(MOCKDATA.SLA_ASSIGNMENTS.headers);\r\n setSearchColumns(['value1', 'value2', 'value3', 'value4'])\r\n dispatch(getSLAAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getAccountSLA(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getAccountSLAForEdit(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n setSLAData(props.StaffAdminData)\r\n setEndDateKey('value7');\r\n setslaShow(true);\r\n break;\r\n }\r\n\r\n case 'volume': {\r\n setImgSrc(Add_Volumetric_Icon)\r\n setAddTab('Add Volumetric')\r\n setTab('volume');\r\n setHeaderData(MOCKDATA.VOLUME_ASSIGNMENTS.headers);\r\n setSearchColumns(['value1', 'value2', 'value3', 'value4'])\r\n dispatch(getSLAAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getVolumeTemplates(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getVolumeTemplatesForEdit(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n setVolumeData(props.StaffAdminData)\r\n setEndDateKey('value7');\r\n setslaShow(true);\r\n break;\r\n }\r\n default: { }\r\n }\r\n }, [props.tab]);\r\n\r\n\r\n\r\n\r\n const dispatchObjHandle = () => {\r\n switch (props.tab) {\r\n case 'account': {\r\n let temp = [...accountData];\r\n let arr2 = temp.map(arr => (\r\n {\r\n Customer: arr.value1,\r\n CustomerType: arr.value2,\r\n ValidFrom: arr.value3,\r\n ValidTo: arr.value4,\r\n ID: typeof arr.ID === 'string' ? '' : arr.ID\r\n }\r\n ))\r\n let arr1 = [{\r\n EmployeeID: supervisorInfo.EmployeeID,\r\n SupEmployeeID: supervisorInfo.SupervisorID,\r\n Details: arr2\r\n }]\r\n return arr1;\r\n }\r\n case 'queue': {\r\n let temp = [...queueData];\r\n let arr2 = temp.map(arr => (\r\n {\r\n Customer: arr.value1,\r\n QueueName: arr.value2,\r\n Language: arr.value3,\r\n ValidFrom: arr.value4,\r\n ValidTo: arr.value5,\r\n ID: typeof arr.ID === 'string' ? '' : arr.ID\r\n }\r\n ))\r\n let arr1 = [{\r\n EmployeeID: supervisorInfo.EmployeeID,\r\n SupEmployeeID: supervisorInfo.SupervisorID,\r\n Details: arr2\r\n }]\r\n return arr1;\r\n }\r\n case 'assign': {\r\n let temp = [...IDdata];\r\n let arr2 = temp.map(arr => (\r\n {\r\n Customer: arr.value1,\r\n IDAssigned: arr.value2,\r\n SystemName: arr.value3,\r\n ValidFrom: arr.value4,\r\n ValidTo: arr.value5,\r\n ID: typeof arr.ID === 'string' ? '' : arr.ID\r\n }\r\n ))\r\n let arr1 = [{\r\n EmployeeID: supervisorInfo.EmployeeID,\r\n SupEmployeeID: supervisorInfo.SupervisorID,\r\n Details: arr2\r\n }]\r\n return arr1;\r\n }\r\n case 'slakpi': {\r\n let temp = [...SLAData];\r\n let arr2 = temp.map(arr => (\r\n {\r\n Customer: arr.value1,\r\n Target: arr.value4,\r\n Weighting: arr.value5,\r\n ValidFrom: arr.value6,\r\n ValidTo: arr.value7,\r\n AccountSLAID: arr.value8,\r\n ID: typeof arr.ID === 'string' ? '' : arr.ID\r\n }\r\n ))\r\n let arr1 = [{\r\n EmployeeID: supervisorInfo.EmployeeID,\r\n SupEmployeeID: supervisorInfo.SupervisorID,\r\n Details: arr2\r\n }]\r\n console.log('posting data sla', arr1)\r\n return arr1;\r\n }\r\n case 'volume': {\r\n console.log('VolumeData', VolumeData)\r\n let temp = [...VolumeData];\r\n let arr2 = temp.map(arr => (\r\n {\r\n Customer: arr.value1,\r\n Target: arr.value4,\r\n Weighting: arr.value5,\r\n ValidFrom: arr.value6,\r\n ValidTo: arr.value7,\r\n AccountVolumetricID: arr.value8,\r\n ID: typeof arr.ID === 'string' ? '' : arr.ID\r\n }\r\n ))\r\n let arr1 = [{\r\n EmployeeID: supervisorInfo.EmployeeID,\r\n SupEmployeeID: supervisorInfo.SupervisorID,\r\n Details: arr2\r\n }]\r\n console.log('posting data', arr1)\r\n return arr1;\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n const onAccountSubmitHandle = (formData, slaId) => {\r\n switch (props.tab) {\r\n case 'account': {\r\n const newAccount = {\r\n ID: (Math.random() * 10000).toString(),\r\n value1: formData.value1,\r\n value2: formData.value2,\r\n value3: (formData.value3),\r\n value4: (formData.value4),\r\n }\r\n const newAccounts = [newAccount, ...accountData]\r\n setAccountData(newAccounts);\r\n setShowaddAccountModal(false);\r\n dispatch(getStaffAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID));\r\n break;\r\n };\r\n case 'queue': {\r\n console.log('formData', formData)\r\n const newQueue = formData.map(queue => {\r\n return {\r\n ID: (Math.random() * 10000).toString(),\r\n value1: queue.value1,\r\n value2: queue.value2,\r\n value3: queue.value3,\r\n value4: queue.value4,\r\n value5: queue.value5,\r\n }\r\n });\r\n console.log('formData', newQueue, queueData)\r\n // const newQueue = {\r\n // ID: (Math.random() * 10000).toString(),\r\n // value1: formData.value1,\r\n // value2: formData.value2,\r\n // value3: (formData.value3),\r\n // value4: (formData.value4),\r\n // value5: (formData.value5),\r\n // }\r\n const newQueues = newQueue.concat(queueData)\r\n setQueueData(newQueues)\r\n setShowAddQueueModal(false);\r\n dispatch(getQueueData(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n }\r\n case 'assign': {\r\n const newid = {\r\n ID: (Math.random() * 10000).toString(),\r\n value1: formData.value1,\r\n value2: formData.value2,\r\n value3: (formData.value3),\r\n value4: (formData.value4),\r\n value5: (formData.value5),\r\n }\r\n const newids = [newid, ...IDdata]\r\n setIDData(newids)\r\n setShowAddIDModal(false);\r\n break;\r\n }\r\n case 'slakpi': {\r\n const newsla = {\r\n ID: (Math.random() * 10000).toString(),\r\n value1: formData.value1,\r\n value2: formData.value2,\r\n value3: (formData.value3),\r\n value4: (formData.value4),\r\n value5: (formData.value5),\r\n value6: (formData.value6),\r\n value7: (formData.value7),\r\n value8: slaId\r\n }\r\n const newslas = [newsla, ...SLAData];\r\n setSLAData(newslas);\r\n setShowAddSLAModal(false);\r\n break;\r\n }\r\n case 'volume': {\r\n const newvolume = {\r\n ID: (Math.random() * 10000).toString(),\r\n value1: formData.value1,\r\n value2: formData.value2,\r\n value3: (formData.value3),\r\n value4: (formData.value4),\r\n value5: (formData.value5),\r\n value6: (formData.value6),\r\n value7: (formData.value7),\r\n value8: slaId\r\n }\r\n const newvolumes = [newvolume, ...VolumeData];\r\n setVolumeData(newvolumes);\r\n setShowAddVolumeModal(false);\r\n break;\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n\r\n useEffect(() => {\r\n props.DispatchObjectManager(dispatchObjHandle());\r\n }, [accountData, queueData, IDdata, SLAData, VolumeData])\r\n\r\n\r\n const [filter, setFilter] = useState('');\r\n function searchRows(rows) {\r\n return rows?.filter((row) =>\r\n searchColumns?.some(\r\n (column) =>\r\n row?.[column]?.toString()?.toLowerCase()?.indexOf(filter?.toLowerCase()) > -1,\r\n ),\r\n );\r\n }\r\n\r\n const [showAddAccountModal, setShowaddAccountModal] = useState(false);\r\n const [showAddQueueModal, setShowAddQueueModal] = useState(false);\r\n const [showAddIDModal, setShowAddIDModal] = useState(false);\r\n const [showAddSLAModal, setShowAddSLAModal] = useState(false);\r\n const [showAddVolumeModal, setShowAddVolumeModal] = useState(false);\r\n const [showEditAccountModal, setShowEditAccountModal] = useState(false);\r\n const [showEditQueueModal, setShowEditQueueModal] = useState(false);\r\n const [showEditIDModal, setShowEditIDModal] = useState(false);\r\n const [showEditSLAModal, setShowEditSLAModal] = useState(false);\r\n const [showEditVolumeModal, setShowEditVolumeModal] = useState(false);\r\n\r\n const AddModalHandleClick = () => {\r\n switch (tab) {\r\n case 'account': setShowaddAccountModal(true); break;\r\n case 'queue': setShowAddQueueModal(true)\r\n dispatch(getQueueData(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n case 'assign': setShowAddIDModal(true);\r\n dispatch(getIDAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n case 'slakpi': setShowAddSLAModal(true);\r\n dispatch(getSLAAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getAccountSLA(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getAccountSLAForEdit(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n case 'volume': setShowAddVolumeModal(true);\r\n dispatch(getSLAAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getVolumeTemplates(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getVolumeTemplatesForEdit(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n default: { }\r\n }\r\n }\r\n\r\n const EditModalHandleClick = () => {\r\n switch (tab) {\r\n case 'account': setShowEditAccountModal(true); break;\r\n case 'queue': setShowEditQueueModal(true);\r\n dispatch(getQueueData(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n case 'assign': setShowEditIDModal(true);\r\n dispatch(getIDAccounts(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n case 'slakpi': setShowEditSLAModal(true);\r\n dispatch(getAccountSLA(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getAccountSLAForEdit(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n case 'volume': setShowEditVolumeModal(true);\r\n dispatch(getVolumeTemplates(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getVolumeTemplatesForEdit(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n break;\r\n default: { }\r\n }\r\n }\r\n\r\n const EditModalHandler = (event, data) => {\r\n event.preventDefault();\r\n switch (props.tab) {\r\n case 'account':\r\n setEditRowID(data.ID);\r\n EditModalHandleClick();\r\n const formValues = {\r\n value1: data.value1,\r\n value2: data.value2,\r\n value3: data.value3,\r\n value4: data.value4\r\n };\r\n setEditFormInfo(formValues);\r\n break;\r\n case 'queue':\r\n case 'assign': {\r\n setEditRowID(data.ID);\r\n EditModalHandleClick();\r\n const formValues = {\r\n value1: data.value1,\r\n value2: data.value2,\r\n value3: data.value3,\r\n value4: data.value4,\r\n value5: data.value5\r\n\r\n };\r\n setEditFormInfo(formValues);\r\n break;\r\n }\r\n case 'slakpi': {\r\n setEditRowID(data.ID);\r\n EditModalHandleClick();\r\n const formValues = {\r\n value1: data.value1,\r\n value2: data.value2,\r\n value3: data.value3,\r\n value4: data.value4,\r\n value5: data.value5,\r\n value6: data.value6,\r\n value7: data.value7,\r\n value8: data.value8\r\n };\r\n setEditFormInfo(formValues);\r\n break;\r\n }\r\n case 'volume': {\r\n console.log('value8', data)\r\n setEditRowID(data.ID);\r\n EditModalHandleClick();\r\n const formValues = {\r\n value1: data.value1,\r\n value2: data.value2,\r\n value3: data.value3,\r\n value4: data.value4,\r\n value5: data.value5,\r\n value6: data.value6,\r\n value7: data.value7,\r\n value8: data.value8\r\n };\r\n setEditFormInfo(formValues);\r\n break;\r\n }\r\n\r\n default: { }\r\n }\r\n\r\n }\r\n\r\n\r\n const handleEditQueueSubmit = (editedData, slaId) => {\r\n switch (props.tab) {\r\n case 'account': {\r\n const editedAccount = {\r\n ID: editRowID,\r\n value1: editedData.value1,\r\n value2: editedData.value2,\r\n value3: editedData.value3,\r\n value4: editedData.value4\r\n };\r\n\r\n const newAccounts = [...accountData];\r\n const index = accountData.findIndex((account) => account.ID === editRowID);\r\n newAccounts[index] = editedAccount;\r\n setAccountData(newAccounts);\r\n setEditRowID(null);\r\n setShowEditAccountModal(false);\r\n break;\r\n }\r\n case 'queue': {\r\n const editedQueue = {\r\n ID: editRowID,\r\n value1: editedData.value1,\r\n value2: editedData.value2,\r\n value3: editedData.value3,\r\n value4: editedData.value4,\r\n value5: editedData.value5,\r\n };\r\n\r\n const newQueues = [...queueData];\r\n const index = queueData.findIndex((queue) => queue.ID === editRowID);\r\n newQueues[index] = editedQueue;\r\n setQueueData(newQueues);\r\n setEditRowID(null);\r\n setShowEditQueueModal(false)\r\n break;\r\n }\r\n case 'assign': {\r\n const editedId = {\r\n ID: editRowID,\r\n value1: editedData.value1,\r\n value2: editedData.value2,\r\n value3: editedData.value3,\r\n value4: editedData.value4,\r\n value5: editedData.value5\r\n };\r\n\r\n const newids = [...IDdata];\r\n const index = IDdata.findIndex((info) => info.ID === editRowID);\r\n newids[index] = editedId;\r\n setIDData(newids);\r\n setEditRowID(null);\r\n setShowEditIDModal(false)\r\n break;\r\n }\r\n case 'slakpi': {\r\n const editedSLA = {\r\n ID: editRowID,\r\n value1: editedData.value1,\r\n value2: editedData.value2,\r\n value3: editedData.value3,\r\n value4: editedData.value4,\r\n value5: editedData.value5,\r\n value6: editedData.value6,\r\n value7: editedData.value7,\r\n value8: editedData.value8\r\n };\r\n const newslas = [...SLAData];\r\n const index = SLAData.findIndex((sla) => sla.ID === editRowID);\r\n newslas[index] = editedSLA;\r\n setSLAData(newslas);\r\n setEditRowID(null);\r\n setShowEditSLAModal(false)\r\n break;\r\n }\r\n case 'volume': {\r\n console.log('editedData', editedData)\r\n const editedVolume = {\r\n ID: editRowID,\r\n value1: editedData.value1,\r\n value2: editedData.value2,\r\n value3: editedData.value3,\r\n value4: editedData.value4,\r\n value5: editedData.value5,\r\n value6: editedData.value6,\r\n value7: editedData.value7,\r\n value8: editedData.value8\r\n };\r\n console.log('................', VolumeData)\r\n const newvolumes = [...VolumeData];\r\n const index = VolumeData.findIndex((volume) => volume.ID === editRowID);\r\n newvolumes[index] = editedVolume;\r\n setVolumeData(newvolumes);\r\n setEditRowID(null);\r\n setShowEditVolumeModal(false)\r\n break;\r\n }\r\n default: { }\r\n }\r\n }\r\n const handleEditQueueCancel = event => {\r\n event.preventDefault();\r\n setEditRowID(null);\r\n setShowEditAccountModal(false);\r\n setShowEditQueueModal(false);\r\n setShowEditIDModal(false);\r\n setShowEditSLAModal(false);\r\n setShowEditVolumeModal(false);\r\n }\r\n\r\n\r\n\r\n const TableDataHandler = () => {\r\n switch (props.tab) {\r\n case 'account': return searchRows(accountData)\r\n case 'queue': return searchRows(queueData)\r\n case 'assign': return searchRows(IDdata)\r\n case 'slakpi': return searchRows(SLAData)\r\n case 'volume': return searchRows(VolumeData)\r\n default: { }\r\n }\r\n }\r\n\r\n console.log('queueLists', queueLists, queueData)\r\n let result = queueLists.filter(o1 => !queueData.some(o2 => o1.QueueName === o2.value2));\r\n // const repeatqueues = queueLists.filter((el) =>{\r\n // return el?.QueueName === queueLists?.QueueName});\r\n\r\n console.log('queueLists', result)\r\n return (\r\n <>\r\n \r\n
\r\n \r\n \r\n
setFilter(e.target.value)} />\r\n
\r\n
\r\n
\r\n
{AddTab} \r\n
\r\n \r\n {TableDataHandler().length === 0 ?
\r\n \r\n {headerData.map(header => (\r\n \r\n {header.caption} \r\n ))\r\n }\r\n
\r\n \r\n
\r\n No records found. This data grid enables adding/editing the corresponding sub-categories.\r\n To add new queue entries, click on {`\"${AddTab}\"`} link.\r\n
\r\n
:\r\n
\r\n \r\n \r\n \r\n {headerData.filter(header => header.caption !== \"value\").map(header => (\r\n {header.caption} {' '} \r\n \r\n \r\n \r\n {slashow === false ? <> {TableDataHandler().map((info, i) =>\r\n (\r\n {Object.values(info).slice(1, info.length).map((value, idx) => (\r\n {value} \r\n ))}\r\n {RoleBasedView?.[0]?.StaffAdmin?.[0]?.ReadWrite === 1 ? <>\r\n \r\n \r\n EditModalHandler(event, info)}>\r\n \r\n
\r\n {endDateKey && moment(info[endDateKey]).isAfter(new Date()) ? '' :\r\n \r\n \r\n Inactive
\r\n }\r\n\r\n \r\n : ''}\r\n\r\n ))}\r\n :\r\n <>\r\n {TableDataHandler().map((info, i) =>\r\n (\r\n {info?.value1} \r\n {info?.value2} \r\n {info.value3} \r\n {info.value4} \r\n {info.value5} \r\n {info.value6} \r\n {info.value7} \r\n\r\n {RoleBasedView?.[0]?.StaffAdmin?.[0]?.ReadWrite === 1 ? <>\r\n \r\n \r\n EditModalHandler(event, info)}>\r\n \r\n
\r\n {endDateKey && moment(info[endDateKey]).isAfter(new Date()) ? '' :\r\n \r\n \r\n Inactive
\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 setShowaddAccountModal(false)} editMode={false}\r\n onAccountSubmitHandle={onAccountSubmitHandle}\r\n AccountsInfo={AccountsInfo} accountData={accountData}\r\n />\r\n \r\n }\r\n\r\n {showEditAccountModal && \r\n \r\n }\r\n\r\n {showAddQueueModal && \r\n setShowAddQueueModal(false)} editMode={false}\r\n onAccountSubmitHandle={onAccountSubmitHandle}\r\n data={result} queueData={queueData}\r\n />\r\n \r\n }\r\n\r\n\r\n {showEditQueueModal && \r\n \r\n }\r\n\r\n\r\n {(showAddIDModal) && \r\n setShowAddIDModal(false)} editMode={false}\r\n onAccountSubmitHandle={onAccountSubmitHandle} IDdata={IDdata}\r\n />\r\n \r\n }\r\n\r\n {showEditIDModal && \r\n \r\n }\r\n\r\n {(showAddSLAModal) && \r\n setShowAddSLAModal(false)} editMode={false} SLAData={SLAData}\r\n onAccountSubmitHandle={onAccountSubmitHandle} SLATemplatesForEdit={SLATemplatesForEdit}\r\n />\r\n \r\n }\r\n\r\n {showEditSLAModal && \r\n \r\n }\r\n\r\n {(showAddVolumeModal) && \r\n setShowAddVolumeModal(false)} editMode={false} VolumeData={VolumeData}\r\n onAccountSubmitHandle={onAccountSubmitHandle} VolumeTemplatesForEdit={VolumeTemplatesForEdit}\r\n />\r\n \r\n }\r\n\r\n {showEditVolumeModal && \r\n \r\n }\r\n \r\n )\r\n}\r\n\r\nexport default EmployeeTabHandler","import React from 'react'\r\nimport { PreviewNonvoiceCard } from '../../../Onboard/OnboardComponents/Preview/PreviewCard'\r\nimport { Row, Col } from 'react-bootstrap';\r\n\r\nconst PreviewTab = (props) => {\r\n const previewToggleHandler = (value, tab) => {\r\n return value === 'Yes' ? true : false\r\n }\r\n return (<>\r\n \r\n This preview enables to view the previous steps filled status/update.
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nexport default PreviewTab","import React, { useEffect, useState } from 'react';\r\nimport './EmployeeDetails.css';\r\nimport Account_Assignment_HoverStateIcon from \"../../../../assets/admin-images/Account_Assignment_HoverStateIcon.png\";\r\nimport Account_Assignment_NormalStateIcon from \"../../../../assets/admin-images/Account_Assignment_NormalStateIcon.png\";\r\nimport AWSQueueLanguage_Assignment_HoverStateIcon from \"../../../../assets/admin-images/AWSQueueLanguage_Assignment_HoverStateIcon.png\";\r\nimport AWSQueueLanguage_Assignment_NormalStateIcon from \"../../../../assets/admin-images/AWSQueueLanguage_Assignment_NormalStateIcon.png\";\r\nimport ID_Assignment_HoverStateIcon from \"../../../../assets/admin-images/ID_Assignment_HoverStateIcon.png\";\r\nimport ID_Assignment_NormalStateIcon from \"../../../../assets/admin-images/ID_Assignment_NormalStateIcon.png\";\r\nimport Preview_HoverStateIcon from \"../../../../assets/admin-images/Preview_HoverStateIcon.png\";\r\nimport Preview_NormalStateIcon from \"../../../../assets/admin-images/Preview_NormalStateIcon.png\";\r\nimport SLA_KPI_AssignmentWeighting_HoverStateIcon from \"../../../../assets/admin-images/SLA_KPI_AssignmentWeighting_HoverStateIcon.png\";\r\nimport SLA_KPI_AssignmentWeighting_NormalStateIcon from \"../../../../assets/admin-images/SLA_KPI_AssignmentWeighting_NormalStateIcon.png\";\r\nimport Volumetric_Normal_Icon from \"../../../../assets/admin-images/Volumetric_Normal_Icon.png\";\r\nimport Volumetric_Hover_Icon from \"../../../../assets/admin-images/Volumetric_Selected_Icon.png\";\r\nimport dataSaveClose_icon from \"../../../../assets/onboard-images/dataSaveClose_icon.png\";\r\nimport dataSave_icon from \"../../../../assets/onboard-images/dataSave_icon.png\";\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\nimport Newemployee from './Newemployee';\r\nimport EmployeeTabHandler from '../Tab-components/EmployeeTabHandler';\r\nimport PreviewTab from '../Tab-components/PreviewTab';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { getAccountAssignment, getIdAssignment, getQueueAssignment, getQueueData, getSlaAssignment, getStaffPreview, getVolumeAssignment, updateAccountEmployeeStart, updateIdAssignmentStart, updateQueueAssignmentStart, updateSlaAssignmentStart } from '../../../../actions/Administration/staffAdmin.action';\r\nimport { ActivateModelPopup, AdminCancelModel, AdminSubmitModel, UnsavedModel } from '../Employee-Assignment/AssignModel';\r\nimport { updateVolumeAssignmentStart } from './../../../../actions/Administration/staffAdmin.action';\r\nimport { AdminNextModel } from './../Employee-Assignment/AssignModel';\r\nimport { getRoleBasedView } from '../../../../actions/Administration/admin.action';\r\nimport { CancelModalPopup, NextButtonFragment } from '../../../Onboard/OnboardComponents/Modals/OnboardButtonsPopup';\r\n\r\nfunction Image(props) {\r\n return (<>\r\n \r\n {props.label}
\r\n {props.children}\r\n \r\n )\r\n}\r\n\r\nconst BUTTONS = [\r\n { id: 1, label: 'PREVIOUS' },\r\n { id: 2, label: 'SAVE' },\r\n { id: 3, label: 'CANCEL' },\r\n { id: 4, label: 'NEXT' },\r\n { id: 5, label: 'SUBMIT' },\r\n\r\n]\r\n\r\n\r\nfunction EmployeeDetails() {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const supervisorInfo = useSelector((state) => state.staffAdminReducer.supervisorInfo);\r\n const accountAssignmentStaff = useSelector((state) => state.staffAdminReducer.accountAssignmentStaff);\r\n const idAssignment = useSelector((state) => state.staffAdminReducer.idAssignment);\r\n const queueAssignment = useSelector((state) => state.staffAdminReducer.queueLists);\r\n const staffPreview = useSelector((state) => state.staffAdminReducer.staffPreview);\r\n const slaAssignment = useSelector((state) => state.staffAdminReducer.slaAssignment);\r\n const volumeAssignment = useSelector((state) => state.staffAdminReducer.volumeAssignment);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n // const updatedAccountResponse = useSelector((state) => state.staffAdminReducer.updatedAccountResponse);\r\n // const updatedQueueResponse = useSelector((state) => state.staffAdminReducer.updatedQueueResponse);\r\n // const updatedIDResponse = useSelector((state) => state.staffAdminReducer.updatedIDResponse);\r\n // const updatedSLAResponse = useSelector((state) => state.staffAdminReducer.updatedSLAResponse);\r\n // const updatedVolumeResponse = useSelector((state) => state.staffAdminReducer.updatedVolumeResponse);\r\n\r\n\r\n //const [generalTab, setGeneralTab] = useState(supervisorInfo?.view === 'edit' ? 'preview' : 'account');\r\n const [generalTab, setGeneralTab] = useState('preview')\r\n const [accountImgSrc, setAccountImgSrc] = useState();\r\n const [AWSImgSrc, setAWSImgSrc] = useState();\r\n\r\n const [SLAImgSrc, setSLAImgSrc] = useState();\r\n const [IDImgSrc, setIDImgSrc] = useState();\r\n const [VolumeImgSrc, setVolumeImgSrc] = useState();\r\n const [previewImgSrc, setPreviewImgSrc] = useState();\r\n const [showButtons, setShowButtons] = useState([0, 1, 1, 1, 0]);\r\n const [dataSaveInfo, setDataSaveInfo] = useState(false);\r\n const [showUnsavedModal, setShowUnsavedModal] = useState(false);\r\n // const [showCanceldModal, setShowCancelModal] = useState(false);\r\n // const [showSubmitModal, setShowSubmitModal] = useState(false);\r\n\r\n const [accountUpdatedData, setAccountUpdatedData] = useState([])\r\n const [queueUpdatedData, setQueueUpdatedData] = useState([])\r\n const [IDUpdatedData, setIDUpdatedData] = useState([])\r\n const [SLAUpdatedData, setSLAUpdatedData] = useState([])\r\n const [VolumeUpdatedData, setVolumeUpdatedData] = useState([])\r\n const [isAccountCreated, setIsAccountCreated] = useState(false);\r\n const [accountNotCreated, setAccountNotCreated] = useState(false);\r\n // const [accountNotSubmitted, setAccountNotSubmitted] = useState(false);\r\n const [showUnsavedNextModal,setShowUnsavedNextModal] = useState(false);\r\n const [showUnsavedPreviousModal,setShowUnsavedPreviousModal] = useState(false);\r\n const [showUnsavedbreadcrumbModal,setShowUnsavedbreadcrumbModal] = useState(false);\r\n\r\n const [accountModifiedData,setAccountModifiedData] = useState([]);\r\n const [queueModifiedData,setQueueModifiedData] = useState([]);\r\n const [IDModifiedData,setIDModifiedData] = useState([]);\r\n const [SLAModifiedData,setSLAModifiedData] = useState([]);\r\n const [VolumeModifiedData,setVolumeModifiedData] = useState([]);\r\n\r\n // const [showUnsavedData,setShowUnsavedData] = useState(false);\r\n\r\n const[compareValidTo,setcompareValidTo] = useState('');\r\n const dispatchNavigationHandle = () => {\r\n dispatch(getAccountAssignment(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getQueueAssignment(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getIdAssignment(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getSlaAssignment(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getVolumeAssignment(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatch(getStaffPreview(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n }\r\n\r\n\r\n useEffect(() => {\r\n switch (generalTab) {\r\n case 'account': {\r\n setAccountImgSrc(Account_Assignment_HoverStateIcon);\r\n setAWSImgSrc(AWSQueueLanguage_Assignment_NormalStateIcon);\r\n setSLAImgSrc(SLA_KPI_AssignmentWeighting_NormalStateIcon);\r\n setIDImgSrc(ID_Assignment_NormalStateIcon);\r\n setVolumeImgSrc(Volumetric_Normal_Icon);\r\n setPreviewImgSrc(Preview_NormalStateIcon);\r\n setShowButtons([0, 1, 1, 1, 0]);\r\n dispatchNavigationHandle();\r\n break;\r\n }\r\n case 'queue': {\r\n setAccountImgSrc(Account_Assignment_NormalStateIcon);\r\n setAWSImgSrc(AWSQueueLanguage_Assignment_HoverStateIcon);\r\n setSLAImgSrc(SLA_KPI_AssignmentWeighting_NormalStateIcon);\r\n setIDImgSrc(ID_Assignment_NormalStateIcon);\r\n setVolumeImgSrc(Volumetric_Normal_Icon);\r\n setPreviewImgSrc(Preview_NormalStateIcon)\r\n setShowButtons([1, 1, 1, 1, 0]);\r\n dispatch(getQueueData(supervisorInfo.EmployeeID, supervisorInfo.SupervisorID))\r\n dispatchNavigationHandle();\r\n break;\r\n }\r\n case 'assign': {\r\n setAccountImgSrc(Account_Assignment_NormalStateIcon);\r\n setAWSImgSrc(AWSQueueLanguage_Assignment_NormalStateIcon);\r\n setSLAImgSrc(SLA_KPI_AssignmentWeighting_NormalStateIcon);\r\n setIDImgSrc(ID_Assignment_HoverStateIcon);\r\n setVolumeImgSrc(Volumetric_Normal_Icon);\r\n setPreviewImgSrc(Preview_NormalStateIcon);\r\n setShowButtons([1, 1, 1, 1, 0]);\r\n dispatchNavigationHandle();\r\n break;\r\n }\r\n case 'slakpi': {\r\n setAccountImgSrc(Account_Assignment_NormalStateIcon);\r\n setAWSImgSrc(AWSQueueLanguage_Assignment_NormalStateIcon);\r\n setSLAImgSrc(SLA_KPI_AssignmentWeighting_HoverStateIcon);\r\n setIDImgSrc(ID_Assignment_NormalStateIcon);\r\n setVolumeImgSrc(Volumetric_Normal_Icon);\r\n setPreviewImgSrc(Preview_NormalStateIcon);\r\n setShowButtons([1, 1, 1, 1, 0]);\r\n dispatchNavigationHandle();\r\n break;\r\n }\r\n case 'volume': {\r\n setAccountImgSrc(Account_Assignment_NormalStateIcon);\r\n setAWSImgSrc(AWSQueueLanguage_Assignment_NormalStateIcon);\r\n setSLAImgSrc(SLA_KPI_AssignmentWeighting_NormalStateIcon);\r\n setIDImgSrc(ID_Assignment_NormalStateIcon);\r\n setVolumeImgSrc(Volumetric_Hover_Icon);\r\n setPreviewImgSrc(Preview_NormalStateIcon);\r\n setShowButtons([1, 1, 1, 1, 0]);\r\n dispatchNavigationHandle();\r\n break;\r\n }\r\n case 'preview': {\r\n setAccountImgSrc(Account_Assignment_NormalStateIcon);\r\n setAWSImgSrc(AWSQueueLanguage_Assignment_NormalStateIcon)\r\n setSLAImgSrc(SLA_KPI_AssignmentWeighting_NormalStateIcon);\r\n setIDImgSrc(ID_Assignment_NormalStateIcon);\r\n setVolumeImgSrc(Volumetric_Normal_Icon);\r\n setPreviewImgSrc(Preview_HoverStateIcon);\r\n setShowButtons([1, 0, 1, 0, 0]);\r\n dispatchNavigationHandle();\r\n break;\r\n }\r\n default: { }\r\n }\r\n }, [generalTab]);\r\n const generaltabRows = ['account', 'queue', 'assign', 'slakpi','volume', 'preview'];\r\n const ObjectEquateHandle = (data, updatedData) => {\r\n if (data?.length === updatedData?.length) {\r\n const eq = JSON.stringify(data) === JSON.stringify(updatedData)\r\n return eq;\r\n }\r\n else {\r\n return false;\r\n }\r\n }\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n};\r\n\r\n useEffect(() => {\r\n let tempacc = [...accountAssignmentStaff];\r\n let arr1 = tempacc.map(arr => ({\r\n Customer: arr?.['account Name'],\r\n CustomerType: arr.customerType,\r\n ValidFrom: formatDate(arr.validFrom),\r\n ValidTo: formatDate(arr.validTo),\r\n ID: typeof arr.ID === 'string' ? '' : arr.id\r\n }))\r\n setAccountModifiedData(arr1)\r\n return arr1\r\n}, [accountAssignmentStaff])\r\n\r\nuseEffect(() => {\r\n let tempqueue = [...queueAssignment];\r\n let arrqueue = tempqueue.map(arr => ({\r\n Customer: arr.account,\r\n QueueName: arr.queueName,\r\n Language: arr.language,\r\n ValidFrom: formatDate(arr?.validFrom),\r\n ValidTo: formatDate(arr?.validTo),\r\n ID: typeof arr.ID === 'string' ? '' : arr.id\r\n }))\r\n setQueueModifiedData(arrqueue)\r\n return arrqueue\r\n}, [queueAssignment])\r\n\r\nuseEffect(() => {\r\n let tempid = [...idAssignment];\r\n let arrid = tempid.map(arr => ({\r\n Customer: arr.customer,\r\n IDAssigned: arr.idAssigned,\r\n SystemName: arr.systemName,\r\n ValidFrom: formatDate(arr?.validFrom),\r\n ValidTo: formatDate(arr?.validTo),\r\n ID: typeof arr.ID === 'string' ? '' : arr.id\r\n }))\r\n setIDModifiedData(arrid)\r\n return arrid\r\n}, [idAssignment])\r\n\r\nuseEffect(() => {\r\n let tempsla = [...slaAssignment];\r\n let arrsla = tempsla.map(arr => ({\r\n Customer: arr.account,\r\n Target: arr.target,\r\n Weighting: arr.weighting,\r\n ValidFrom: formatDate(arr.validFrom),\r\n ValidTo: formatDate(arr.validTo),\r\n AccountSLAID: arr.accountSLAID,\r\n ID: typeof arr.ID === 'string' ? '' : arr.id\r\n }))\r\n setSLAModifiedData(arrsla)\r\n return arrsla\r\n}, [slaAssignment])\r\n\r\nuseEffect(() => {\r\n let tempVolume = [...volumeAssignment];\r\n let arrVolume = tempVolume.map(arr => ({\r\n Customer: arr.account,\r\n Target: arr.target,\r\n Weighting: arr.weighting,\r\n ValidFrom: formatDate(arr.validFrom),\r\n ValidTo: formatDate(arr.validTo),\r\n AccountVolumetricID : arr.accountVolumetricTempalteID,\r\n ID: typeof arr.ID === 'string' ? '' : arr.id\r\n }))\r\n setVolumeModifiedData(arrVolume)\r\n return arrVolume\r\n}, [volumeAssignment])\r\n \r\n\r\n const nextModelNohandler = () =>{\r\n let index = generaltabRows.indexOf(generalTab);\r\n let currentTab = generaltabRows[index + 1];\r\n setGeneralTab(currentTab);\r\n setShowUnsavedNextModal(false);\r\n setAccountUpdatedData(accountAssignmentStaff)\r\n setQueueUpdatedData(queueAssignment)\r\n setIDUpdatedData(idAssignment)\r\n setSLAUpdatedData(slaAssignment)\r\n setVolumeUpdatedData(volumeAssignment)\r\n }\r\n\r\n const previousModelNohandler = () => {\r\n let index = generaltabRows.indexOf(generalTab);\r\n let currentTab = generaltabRows[index - 1];\r\n setGeneralTab(currentTab);\r\n setShowUnsavedPreviousModal(false)\r\n setAccountUpdatedData(accountAssignmentStaff)\r\n setQueueUpdatedData(queueAssignment)\r\n setIDUpdatedData(idAssignment)\r\n setSLAUpdatedData(slaAssignment)\r\n setVolumeUpdatedData(volumeAssignment)\r\n }\r\nconst saveButtonHandler = () => {\r\nif(supervisorInfo.view === \"edit\"){\r\n setDataSaveInfo(true)\r\n}\r\nelse{\r\n if (isAccountCreated) {\r\n setDataSaveInfo(true);\r\n setAccountNotCreated(false);\r\n } else{ setAccountNotCreated(true)}\r\n }\r\n\r\n\r\n window.scroll({\r\n top: 0,\r\n left: 0,\r\n behavior: 'smooth'\r\n });\r\n switch (generalTab) {\r\n case 'account': dispatch(updateAccountEmployeeStart(accountUpdatedData));\r\n break;\r\n case 'queue':\r\n dispatch(updateQueueAssignmentStart(queueUpdatedData)); break;\r\n case 'assign':\r\n dispatch(updateIdAssignmentStart(IDUpdatedData)); break;\r\n case 'slakpi': dispatch(updateSlaAssignmentStart(SLAUpdatedData)); break;\r\n case 'volume': dispatch(updateVolumeAssignmentStart(VolumeUpdatedData)); break;\r\n\r\n default: { }\r\n }\r\n setShowUnsavedModal(false);\r\n setShowUnsavedNextModal(false);\r\n setShowUnsavedPreviousModal(false);\r\n let index = generaltabRows.indexOf(generalTab);\r\n let currentTab = generaltabRows[index + 1];\r\n setGeneralTab(currentTab);\r\n dispatchNavigationHandle();\r\n setAccountUpdatedData(accountAssignmentStaff)\r\n setQueueUpdatedData(queueAssignment)\r\n setIDUpdatedData(idAssignment)\r\n setSLAUpdatedData(slaAssignment)\r\n setVolumeUpdatedData(volumeAssignment)\r\n }\r\n const validationCancelHandle = (response, resolve) => {\r\n if (ObjectEquateHandle(response, resolve)) {\r\n // setShowCancelModal(true);\r\n history.push('/admin/staff')\r\n setShowUnsavedModal(false);\r\n }\r\n else {\r\n // setShowCancelModal(false);\r\n setShowUnsavedModal(true);\r\n }\r\n }\r\n\r\n const cancelButtonHandler = () => {\r\n switch (generalTab) {\r\n case 'account': validationCancelHandle(accountModifiedData, accountUpdatedData?.[0]?.Details); break;\r\n case 'queue': validationCancelHandle(queueModifiedData, queueUpdatedData?.[0]?.Details); break;\r\n case 'assign': validationCancelHandle(IDModifiedData, IDUpdatedData?.[0]?.Details); break;\r\n case 'slakpi': validationCancelHandle(SLAModifiedData, SLAUpdatedData?.[0]?.Details); break;\r\n case 'volume': validationCancelHandle(VolumeModifiedData, VolumeUpdatedData?.[0]?.Details); break;\r\n case 'preview': validationCancelHandle(1,1); break;\r\n default: { }\r\n }\r\n }\r\n\r\n const validationNextHandle = (response, resolve) => {\r\n if (ObjectEquateHandle(response, resolve)) {\r\n // saveButtonHandler();\r\n let index = generaltabRows.indexOf(generalTab);\r\n let currentTab = generaltabRows[index + 1];\r\n setGeneralTab(currentTab);\r\n }\r\n else {\r\n // setShowCancelModal(false);\r\n setShowUnsavedNextModal(true);\r\n }\r\n }\r\n\r\n\r\n const nextButtonHandler = () => {\r\n switch (generalTab) {\r\n case 'account': validationNextHandle(accountModifiedData, accountUpdatedData?.[0]?.Details); break;\r\n case 'queue': validationNextHandle(queueModifiedData, queueUpdatedData?.[0]?.Details); break;\r\n case 'assign': validationNextHandle(IDModifiedData, IDUpdatedData?.[0]?.Details); break;\r\n case 'slakpi': validationNextHandle(SLAModifiedData, SLAUpdatedData?.[0]?.Details); break;\r\n case 'volume': validationNextHandle(VolumeModifiedData, VolumeUpdatedData?.[0]?.Details); break;\r\n default: { }\r\n }\r\n }\r\n\r\n \r\n const [showTabModal, setShowTabModal] = useState(false);\r\n const [tabForYesButton, setTabForYesButton] = useState(null);\r\n\r\n let accountValidation = accountUpdatedData?.[0]?.Details === undefined ? true : ObjectEquateHandle(accountModifiedData, accountUpdatedData?.[0]?.Details);\r\n let queueValidation = queueUpdatedData?.[0]?.Details === undefined ? true : ObjectEquateHandle(queueModifiedData, queueUpdatedData?.[0]?.Details);\r\n let IdValidation = IDUpdatedData?.[0]?.Details === undefined ? true : ObjectEquateHandle(IDModifiedData, IDUpdatedData?.[0]?.Details);\r\n let SLAValidation = SLAUpdatedData?.[0]?.Details === undefined ? true : ObjectEquateHandle(SLAModifiedData, SLAUpdatedData?.[0]?.Details);\r\n let volumeValidation = VolumeUpdatedData?.[0]?.Details === undefined ? true : ObjectEquateHandle(VolumeModifiedData, VolumeUpdatedData?.[0]?.Details)\r\n\r\nlet TabChangeValidation = accountValidation && queueValidation && IdValidation && SLAValidation && volumeValidation\r\n// console.log('accountValidation',accountModifiedData, accountUpdatedData?.[0]?.Details,accountValidation)\r\nconst staffAdminTabButtonHandle = (tab) => {\r\n if(!TabChangeValidation){\r\n setShowTabModal(true);\r\n setTabForYesButton(tab)\r\n }\r\n else{\r\n setGeneralTab(tab)\r\n }\r\n}\r\n\r\nconst tabYesButtonHandle = () => {\r\n saveButtonHandler();\r\n setShowTabModal(false);\r\n setAccountUpdatedData(accountAssignmentStaff)\r\n setQueueUpdatedData(queueAssignment)\r\n setIDUpdatedData(idAssignment)\r\n setSLAUpdatedData(slaAssignment)\r\n setVolumeUpdatedData(volumeAssignment)\r\n setGeneralTab(tabForYesButton)\r\n}\r\n\r\nconst tabNoButtonHandle = () => {\r\n setShowTabModal(false)\r\n setGeneralTab(tabForYesButton)\r\n setAccountUpdatedData(accountAssignmentStaff)\r\n setQueueUpdatedData(queueAssignment)\r\n setIDUpdatedData(idAssignment)\r\n setSLAUpdatedData(slaAssignment)\r\n setVolumeUpdatedData(volumeAssignment)\r\n}\r\n\r\n\r\n\r\n\r\n\r\n const ValidatePreviousData = (response, resolve) => {\r\n if (ObjectEquateHandle(response, resolve)) {\r\n // saveButtonHandler();\r\n let index = generaltabRows.indexOf(generalTab);\r\n let currentTab = generaltabRows[index - 1];\r\n setGeneralTab(currentTab);\r\n }\r\n else {\r\n // setShowCancelModal(false);\r\n setShowUnsavedPreviousModal(true);\r\n }\r\n }\r\n const previousButtonHandler = () => {\r\n switch (generalTab) {\r\n case 'account': ValidatePreviousData(accountModifiedData, accountUpdatedData?.[0]?.Details); break;\r\n case 'queue': ValidatePreviousData(queueModifiedData, queueUpdatedData?.[0]?.Details); break;\r\n case 'assign': ValidatePreviousData(IDModifiedData, IDUpdatedData?.[0]?.Details); break;\r\n case 'slakpi': ValidatePreviousData(SLAModifiedData, SLAUpdatedData?.[0]?.Details); break;\r\n case 'volume': ValidatePreviousData(VolumeModifiedData, VolumeUpdatedData?.[0]?.Details); break;\r\n case 'preview' : ValidatePreviousData(1,1); break;\r\n default: { }\r\n }\r\n }\r\n \r\n // const submitButtonHandler = () => {\r\n // if(isAccountCreated){\r\n // setShowSubmitModal(true);\r\n // setAccountNotSubmitted(false);\r\n // setDataSaveInfo(false);\r\n // } \r\n // else{\r\n // setAccountNotSubmitted(true);\r\n // setShowSubmitModal(false);\r\n // setDataSaveInfo(false)\r\n // }\r\n \r\n // window.scroll({\r\n // top: 0,\r\n // left: 0,\r\n // behavior: 'smooth'\r\n // });\r\n // }\r\n \r\n const ButtonClickHandler = (button) => {\r\n switch (button) {\r\n case 'next': nextButtonHandler(); break;\r\n case 'previous': previousButtonHandler(); break;\r\n case 'submit': break;\r\n case 'save': saveButtonHandler(); break;\r\n case 'cancel': cancelButtonHandler(); break;\r\n default: { }\r\n }\r\n }\r\n const onClickViewDetails = title => {\r\n switch (title) {\r\n case 'Account Assignment': setGeneralTab('account'); break;\r\n case 'AWS Queue / Language Assignment': setGeneralTab('queue'); break;\r\n case 'ID Assignment': setGeneralTab('assign'); break;\r\n case 'SLA / KPI Assignment & Weighting': setGeneralTab('slakpi'); break;\r\n case 'Volumetrics': setGeneralTab('volume'); break;\r\n default: ;\r\n }\r\n }\r\n const DispatchObjectManager = (data) => {\r\n switch (generalTab) {\r\n case 'account': setAccountUpdatedData(data); break;\r\n case 'queue': setQueueUpdatedData(data); break;\r\n case 'assign': setIDUpdatedData(data); break;\r\n case 'slakpi': setSLAUpdatedData(data); break;\r\n case 'volume': setVolumeUpdatedData(data); break;\r\n default: { }\r\n }\r\n }\r\n const StaffAdminDataHandle = () => {\r\n switch (generalTab) {\r\n case 'account': {\r\n let temp = [...accountAssignmentStaff];\r\n let arr1 = temp.map(arr => ({\r\n ID: arr?.id,\r\n value1: arr?.['account Name'],\r\n value2: arr?.customerType,\r\n value3: formatDate(arr?.validFrom),\r\n value4: formatDate(arr?.validTo)\r\n }))\r\n return arr1\r\n\r\n }\r\n case 'queue': {\r\n let temp = [...queueAssignment];\r\n let arr1 = temp.map(arr => ({\r\n ID: arr?.id,\r\n value1: arr?.account,\r\n value2: arr?.queueName,\r\n value3: arr?.language,\r\n value4: formatDate(arr?.validFrom),\r\n value5: formatDate(arr?.validTo)\r\n }))\r\n return arr1\r\n }\r\n case 'assign': {\r\n let temp = [...idAssignment];\r\n let arr1 = temp.map(arr => ({\r\n ID: arr?.id,\r\n value1: arr?.customer,\r\n value2: arr?.idAssigned,\r\n value3: arr?.systemName,\r\n value4: formatDate(arr?.validFrom),\r\n value5: formatDate(arr?.validTo)\r\n }))\r\n return arr1\r\n }\r\n case 'slakpi': {\r\n let temp = [...slaAssignment];\r\n let arr1 = temp.map(arr => ({\r\n ID: arr?.id,\r\n value1: arr?.account,\r\n value2: arr?.['slA/KPI'],\r\n value3: arr?.['item Name'],\r\n value4: arr?.target,\r\n value5: arr?.weighting,\r\n value6: formatDate(arr?.validFrom),\r\n value7: formatDate(arr?.validTo),\r\n value8:arr?.accountSLAID\r\n }))\r\n return arr1\r\n }\r\n case 'volume': {\r\n let temp = [...volumeAssignment];\r\n let arr1 = temp.map(arr => ({\r\n ID: arr?.id,\r\n value1: arr?.account,\r\n value2: arr?.['slA/KPI'],\r\n value3: arr?.['item Name'],\r\n value4: arr?.target,\r\n value5: arr?.weighting,\r\n value6: formatDate(arr?.validFrom),\r\n value7: formatDate(arr?.validTo),\r\n value8:arr?.accountVolumetricTempalteID\r\n }))\r\n return arr1\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n\r\n let accountUpdateDetails = accountUpdatedData?.[0]?.Details !== undefined ? accountUpdatedData?.[0]?.Details : []\r\n let CompareAccountValidDates = Object.values(accountUpdateDetails).some((value) => value.ValidTo > compareValidTo)\r\n\r\n let queueUpdateDetails = queueUpdatedData?.[0]?.Details !== undefined ? queueUpdatedData?.[0]?.Details : []\r\n let CompareQueueValidDates = Object.values(queueUpdateDetails).some((value) => value.ValidTo > compareValidTo)\r\n\r\n let IDUpdateDetails = IDUpdatedData?.[0]?.Details !== undefined ? IDUpdatedData?.[0]?.Details : []\r\n let CompareIDValidDates = Object.values(IDUpdateDetails).some((value) => value.ValidTo > compareValidTo)\r\n\r\n let SLAUpdateDetails = SLAUpdatedData?.[0]?.Details !== undefined ? SLAUpdatedData?.[0]?.Details : []\r\n let CompareSLAValidDates = Object.values(SLAUpdateDetails).some((value) => value.ValidTo > compareValidTo)\r\n\r\n let VolumeUpdateDetails = VolumeUpdatedData?.[0]?.Details !== undefined ? VolumeUpdatedData?.[0]?.Details : []\r\n let CompareVolumeValidDates = Object.values(VolumeUpdateDetails).some((value) => value.ValidTo > compareValidTo)\r\n\r\n\r\n const [showpath, setShowpath] = useState(false);\r\n const [NewEmployeeToggle,setNewEmployeeToggle ] = useState(false);\r\n const [ToggleValidation,setToggleValidation ] = useState(false);\r\n\r\n const BreadcrumbValidationHandler = (path) => {\r\n \r\n if (!NewEmployeeToggle) {\r\n setToggleValidation(true)\r\n }\r\n else if(!TabChangeValidation){\r\n setShowUnsavedbreadcrumbModal(true);\r\n setShowpath(path)\r\n }\r\n else{\r\n history.push(path)\r\n }\r\n}\r\n\r\nconst BreadcrumbValidationYesButtonHandle = () => {\r\n saveButtonHandler();\r\n setShowUnsavedbreadcrumbModal(false)\r\n history.push(showpath)\r\n}\r\n\r\nconst BreadcrumbValidationNoButtonHandle = () => {\r\n setShowUnsavedbreadcrumbModal(false)\r\n history.push(showpath)\r\n}\r\n\r\n\r\n return (\r\n <>\r\n \r\n
BreadcrumbValidationHandler('/welcome')} label1='Home' isActive2={true} value2={()=>BreadcrumbValidationHandler(\"/admin\")} label2='Administration'\r\n isActive3={true} label3='Staff-Administration' isActive4={false} value3={()=>BreadcrumbValidationHandler(\"/admin/staff\")} label4='Add Mapping' />\r\n New Employee Mapping
\r\n {dataSaveInfo && \r\n
Data has been saved successfully
\r\n
setDataSaveInfo(false)} />
\r\n
\r\n
Data has not been saved. Please check the toggle before saving
\r\n
setAccountNotCreated(false)} />
\r\n
\r\n
General Informations data has not been saved. Please check the Initial Save before proceeding
\r\n
setToggleValidation(false)} />
\r\n
\r\n
Data has not been submitted. Please check the toggle before submitting
\r\n
setAccountNotCreated(false)} />
\r\n
setIsAccountCreated(d)} setcompareValidTo = {(v) => setcompareValidTo(v)}\r\n newEmployeeToggleChange={(checked) => setNewEmployeeToggle(checked)}\r\n />\r\n\r\n {(generalTab === 'account' && CompareAccountValidDates) ? \r\n
Account Assignment valid to date is after the Role valid to date
\r\n
Queue Assignment valid to date is after the Role valid to date
\r\n
ID Assignment valid to date is after the Role valid to date
\r\n
SLA / KPI Assignment valid to date is after the Role valid to date
\r\n
Volumetrics valid to date is after the Role valid to date
\r\n \r\n Account \r\n staffAdminTabButtonHandle('queue')} onMouseEnter={() => generalTab !== 'queue' && setAWSImgSrc(AWSQueueLanguage_Assignment_HoverStateIcon)} onMouseLeave={() => generalTab !== 'queue' && setAWSImgSrc(AWSQueueLanguage_Assignment_NormalStateIcon)}> \r\n staffAdminTabButtonHandle('assign')} onMouseEnter={() => generalTab !== 'assign' && setIDImgSrc(ID_Assignment_HoverStateIcon)} onMouseLeave={() => generalTab !== 'assign' && setIDImgSrc(ID_Assignment_NormalStateIcon)}> \r\n staffAdminTabButtonHandle('slakpi')} onMouseEnter={() => generalTab !== 'slakpi' && setSLAImgSrc(SLA_KPI_AssignmentWeighting_HoverStateIcon)} onMouseLeave={() => generalTab !== 'slakpi' && setSLAImgSrc(SLA_KPI_AssignmentWeighting_NormalStateIcon)}> \r\n staffAdminTabButtonHandle('volume')} onMouseEnter={() => generalTab !== 'volume' && setVolumeImgSrc(Volumetric_Hover_Icon)} onMouseLeave={() => generalTab !== 'volume' && setVolumeImgSrc(Volumetric_Normal_Icon)}> \r\n staffAdminTabButtonHandle('preview')} onMouseEnter={() => generalTab !== 'preview' && setPreviewImgSrc(Preview_HoverStateIcon)} onMouseLeave={() => generalTab !== 'preview' && setPreviewImgSrc(Preview_NormalStateIcon)}> \r\n
\r\n \r\n {generalTab === 'preview' ? {\r\n BUTTONS.map((button, i) => (\r\n <> {showButtons[i] === 1 && ButtonClickHandler(button.label.toLowerCase())}>\r\n {button.label} } \r\n ))\r\n } : ''}\r\n\r\n\r\n \r\n history.push('/admin/staff')} handleNoButton={() => { setShowUnsavedModal(false) }}/>\r\n \r\n }\r\n \r\n {/* {showCanceldModal && \r\n history.push('/admin/staff')} handleNoButton={() => { setShowCancelModal(false) }} />\r\n \r\n } */}\r\n\r\n {showUnsavedNextModal && \r\n \r\n }\r\n\r\n {showUnsavedPreviousModal && \r\n {saveButtonHandler(); \r\n let index = generaltabRows.indexOf(generalTab);\r\n let currentTab = generaltabRows[index - 1];\r\n setGeneralTab(currentTab)\r\n }} handleNoButton={previousModelNohandler}\r\n handleSaveButton={()=>{ }} />\r\n \r\n }\r\n\r\n {/* {showSubmitModal && \r\n {\r\n setShowSubmitModal(false);\r\n history.push('/admin/staff')\r\n }}\r\n queueName={supervisorInfo.EmployeeName}\r\n />\r\n } */}\r\n\r\n {showTabModal && \r\n }\r\n\r\n {showUnsavedbreadcrumbModal && \r\n \r\n }\r\n \r\n\r\n\r\n\r\n )\r\n}\r\n\r\nexport default EmployeeDetails;","export default __webpack_public_path__ + \"static/media/HeroBanner_Image.5a326b24.png\";","export default __webpack_public_path__ + \"static/media/RoleSpecificAccess_Image.14a7351e.png\";","export default __webpack_public_path__ + \"static/media/HelpCenter_Image.34cc23f1.png\";","export default \"data:image/png;base64,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\"","import React from 'react'\r\nimport HeroBannerImg from './../../../assets/images/HeroBanner_Image.png';\r\nimport RolespecificImg from './../../../assets/images/RoleSpecificAccess_Image.png';\r\nimport HelpcenterImg from './../../../assets/images/HelpCenter_Image.png';\r\nimport UserGuidesIcon from \"../../../assets/images/UserGuides_Icon.png\";\r\nimport TrainingVideosIcon from \"../../../assets/images/TrainingVideos_Icon.png\";\r\nimport EmailToReportingTeamIcon from \"../../../assets/images/EmailToReportingTeam_Icon.png\";\r\nimport MSChatIcon from \"../../../assets/images/MSChat_Icon.png\";\r\nimport ITSMPortalIcon from \"../../../assets/images/ITSMPortal.png\";\r\nimport DXCLogoImg from '../../../assets/images/DXC_Logo_Footer_Normal.png';\r\nimport LogoutImg from '../../../assets/images/Logout_Icon.png';\r\nimport GSDLogo from '../../../assets/images/GSDInsight_Logo.png'\r\nimport './FirstVisitor.css';\r\nimport { Col, ListGroup } from 'react-bootstrap';\r\nimport { Row } from 'react-bootstrap';\r\nimport ConstructURLs from '../../../constants/urls';\r\nimport { useDispatch } from 'react-redux';\r\nimport { useSelector } from 'react-redux';\r\nimport { useEffect } from 'react';\r\nimport { getUserToken } from '../../../actions/user.action';\r\nimport { useHistory } from 'react-router-dom';\r\n const FirstVisitor = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let userInfo = useSelector((state) => state.userReducer.userInfo);\r\n let url = window.location.href;\r\n const logoutHandler = () => {\r\n window.localStorage.clear();\r\n window.location.href = ConstructURLs(\"LOG_OUT_URL\");\r\n };\r\n useEffect(() => {\r\n console.log(\"Window URL \" + url);\r\n let isLocalhost = url.includes(\"localhost\");\r\n console.log(\"isLocalhost \" + isLocalhost);\r\n if (isLocalhost) {\r\n dispatch(getUserToken());\r\n }\r\n }, [dispatch]);\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
GSD Insight \r\n
\r\n
\r\n
Welcome to GSD Insight!
\r\n
\r\n
We appreciate your interest to GSD Insight. You have
\r\n
\r\n
history.push('/githublanding')}>\r\n \r\n
EXPLORE GITHUB
\r\n \r\n \r\n
\r\n
Hi, {userInfo.name} \r\n \r\n
\r\n
\r\n
\r\n
For your role specific access
\r\n
Send an email to GSD Insight support team with following informations:
\r\n
Name → Email → Role → Account
\r\n
(Note: Approval from the GSD Modern Workplace Site Manager attached)
\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n Help Center \r\n history.push('/githublanding')}>User Guides \r\n history.push('/training')}>Trainings \r\n \r\n Email to Reporting Team \r\n \r\n \r\n Microsoft Teams Chat \r\n \r\n history.push('/request')}>ITSM Service Portal \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
© DXC Technology Company \r\n
\r\n
\r\n
\r\n \r\n
\r\n {/*
\r\n
history.push(`/admin/${props.pathname}`)}>\r\n {props.buttonValue} \r\n \r\n
*/}\r\n
\r\n \r\n Select Month {\r\n setSelectedDate(date)\r\n props.HandleSLAMonth(date)\r\n }}\r\n format=\"MMMM YYYY\"\r\n style={{ width: '300px' }}\r\n error={false}\r\n helperText={null}\r\n />\r\n \r\n \r\n
All Exemption {props.counters?.Total?.toString()}
\r\n
Voice {props.counters?.Voice?.toString()}
\r\n
Non voice {props.counters?.['Non-Voice']?.toString()}
\r\n
\r\n { }} icon={downloadIcon} />\r\n \r\n\r\n\r\n \r\n )\r\n}\r\nexport default FilterTab;\r\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAASCAYAAABb0P4QAAAABHNCSVQICAgIfAhkiAAAA7FJREFUOE99VH9o1GUYf573+71zp86myJo2b253utZKqWXWHxOFaQZOSAvU2m07SsgikCiKCIygCAsq/2o0725zEYMKIkOUhBKnCzacMlm5H7bFLLPdps1zd/e+T5937OadP/rCe9/3+b7vfZ7n83k+78t7i9t98bzJ1aLkKTFcQ0KLmclDRKWYX2RiEpYCxIR4HL//YJwzLF8Z0r1t/S/+Mb0283B9MPq+kOxSRAm8zwpxN7F0udodTzlTk4520+TQPODmA3AZRhX2rCMyy4hVT2rq+o4vh/fEZwEbApE/UcFBh+mLgxfCg9nZ7jbfvfTzuam5vmoRfQDgO2MDDV1ZgNEhIfMzM28QojOge4JFfhHmCaPVdVaisTlPSC9QpCpEqBpxFSlbMV9WrF6NXAh15gIqegVU/KC1jUT8WFyAUYQxhO+MdwEhExJNQLtRTI+z8PdY+hCAb9wOyLQl1t/Qa7OEy5uXppPuYlRmNcsTh4GjU0rUv44y8ZTP/av1bGjS7oX+P90GGApExkD3dQA2/59+dYGWQkXmNeXydtGmlBQnxYhG+Z9G+xvfvkk5GDmJIIAOd6Jrhx2tulmSf19lPV45eOnaPtpnGoKRWnZUi9GmoGqjn4pXLqQbiTSdPzlKI79ON/jrWH/jM3bCtstQ6RMjtBHZiqFVIb7P2EAmQFuxww/dt6KAd++vJn/Fohwi79R+RyN9YxbqEFjWWcAhdHRaw7qymJ8cvYSNs0ixWYtdHgi/1XG58oMjT3NhSX4O2Gd7jlP3sWGq2uSnrqPDZEg2w9iRqyKqvmWg/ttbNXz2gXbvvORkYlO4Uu18a80dwerfe4I27Cinlx5p04lryYgFPAWqSwxRG6zwzRzH+3vTb7uu2H+HSmOr2DE9Lx9YT2s2L58FzFSWAbMLHzUepfMdo50cCkYH4avT8N8qe46xloCmF6GlsrbBAX4sG/BOYDmAGQ2TOnXF4/GWwBqrYYYgzmoRMJej++ueDFeSpXw3MAt4k3IgegkV1WSMfauOMG8rmvLc/WuLuBc2yaaZ2ftD0zlq398105QV0R7QHYNJP/b4TEdz7wvWA7NPqKxppXK9Z3zzPXk1z1fwtr0P5+T88VAftb57Oss2wch6RG/iYngcmsVR7TB0u4xvIxg3EBtcCOWuo2q1ljk5xu4YNSN9cdx8Wca26baWN+ffk0ovdJS3DNdpsWFVgvqJlMGFwC58msaJng9tH1UeetCk5V5WPCXGnEKyWMtAOJYp+z/T575CPaUK3QAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAUCAYAAABmvqYOAAAABHNCSVQICAgIfAhkiAAAAtxJREFUOE+llE1IVFEUx8+5r/kwFaOSIIPKec9cFLQQwk24aSNBQSJ9Oe/NBLoxo6JFRRFRghBpLSImnTfPoVCMINDaBNKikLJFELRwZoQWLYowF5Y28+7pvFej44gzg97Ve/ee8zv/+7/nXoQiw9DMa0RgcFhtsdic9QmpKCexUAKD9xPhMwR6yXHxUuCEWANEt5CUu4XhqtlEAOMc1EiA30uBWwkjqQeiPSSUlAs/sfvRtrINSnl+sg3iAKt4sghHesU74XqrDXo3mAgdD2rmfSSaxqBqtQDISwi4GYDEsjSCOUDYt6RcXi2m3kqEw4twXTM/s7qfAIJ9lUpuMhJWEcK5LJyAHhSBzyxTrqsmCRKGmdSt/ERjpeejheBc/OMKuKMslghNFIIDeuclLTTkx/hlxUjuXCTVOrtkCysvBe52Cx8oAG51YURCIlyMT4Ue5hdcIxzq80HWlDG2JriuDpzhg+5ntae5fx8X65TsOisf4+57i86BrmpLramhwGEbKM0tOcq9W5ZXwIsyMxxLtb8P1lk1fJPbiWgn34RDgNhVEO6Agmr0CCKedZNQOK3q+V8gTSQreFdfWeUpRfHN2HL+Df/7uMhT5bd9oyjcARm7zE3C59/ofNv2wk0+zYMCPEf5TyOUfZJg1oPergylYxzygi3sdGId+Dxvw4glQ0MleOrED7ONdV7AYxF+R9pqzWYUMMBqZ/h8KpkRZ/iVLPw1IuzgZ3UcCLdbSaM5vGeg0raV8/yINC0rSLKSrQnwXB8DeAf/RlCLHuaXI8oFqllvL69dcOFtgf69Cioh7uM2vv6Dvl/V1xfKf1zmPu7kYp+4tzNZCCv2SEFD/kw6Hkl1zOYWDqtWYwZkC0lxL57Sv7hwt3K9tQXTcpKVPkckTsIuht+xkuHbJVi1akgOnCZBwDe2RxNIvXNT5d0j0GqvG66rsQArNdmaBrahx1/1pzvyoSO9HrCT+xf+1HLBNa4QdAAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAALCAYAAAByF90EAAAABHNCSVQICAgIfAhkiAAAAK9JREFUKFNjTFCdb/D/P0M/4x+GwAUPEj8wkACAehcAlR9YcDtxAWOCyvwD/xkY7IECF4CGORJrGMgQoAPiQfYysjAoMiYozBf4x8JwgJGBQZ9Yw1AMYWRIBLsIZCIphmEzBOwqWJAQYxguQ1AMIuQyfIZgGITLMAZWhgnwgIWGCXrkwr2GLIHmTVCSEADbisMQrC7CEWZ4DcFrELI3mRgZJoCiGF9axeo1EhI3XCkAa6JzU68WVgcAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAALCAYAAAByF90EAAAABHNCSVQICAgIfAhkiAAAAKNJREFUKFNjZMADEhTmC/xnYVjPyMhQuOB24gV8ahlxSUIN2Q+UNwDiD0DDHPEZhtUgNENgduE1DMMgNEM+Al3iADSp4P9/hnh8LkMxCJshMO8kqM5fgM8wuEH4DIH5DZ9hYIOIMYSQYYykGILPMMYElfkH/jMw2AMVgQOWUHrBahgLgyEj0N8G//4zbGBiZAgg1hBkw0BsoL4EnAkSXyrGJgcAHvlyU9IFNQcAAAAASUVORK5CYII=\"","import ReactModal from \"react-modal\";\r\n\r\nReactModal.setAppElement('#root')\r\nexport function GenericModal({ isOpen, setShowModal, children,height,width }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '10em',\r\n left: '20em',\r\n width: '600px',\r\n height: '500px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '0em',\r\n right: '0px',\r\n bottom: '0px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\n\r\n\r\n\r\n","import React, { useEffect, useState } from 'react';\r\n\r\n\r\nconst Exemption_initialState = {\r\n name: [],\r\n data: [],\r\n comments: '',\r\n type: '',\r\n penalty: '',\r\n}\r\n\r\nexport function ExemptionModalHandler(props) {\r\n const [selectedType, setSelectedType] = useState('Valid');\r\n const [editFormInfo, setEditFormInfo] = useState({});\r\n const [addExemptionForm, setAddExemptionForm] = useState(Exemption_initialState);\r\n\r\n let editMode = props.editMode;\r\n\r\n useEffect(() => {\r\n let temp = {\r\n comments: props.ExemptionData.Comments,\r\n type: props.ExemptionData.Type,\r\n penalty: props.ExemptionData.Penalty,\r\n };\r\n setSelectedType(props.ExemptionData.Type)\r\n setEditFormInfo(temp)\r\n }, [])\r\n\r\n const onChangeExemptionRadio = (value) => {\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData['type'] = value;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addExemptionForm };\r\n newFormData['type'] = value;\r\n setAddExemptionForm(newFormData)\r\n }\r\n }\r\n const onChangeExemptionInput = (event) => {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo };\r\n newFormData[fieldName] = fieldValue;\r\n setEditFormInfo(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...addExemptionForm };\r\n newFormData[fieldName] = fieldValue;\r\n setAddExemptionForm(newFormData)\r\n }\r\n }\r\n\r\n const onClickFormSubmit = (event) => {\r\n console.log(editFormInfo)\r\n props.handleExemptionFormSubmit(editMode ? editFormInfo : addExemptionForm)\r\n }\r\n return (\r\n <>\r\n \r\n \r\n )\r\n}\r\n\r\n\r\n\r\n\r\nexport function RequestModalHandler(props) {\r\n return (\r\n <>\r\n \r\n \r\n
\r\n Request for SLA Data Exclusion\r\n
\r\n
\r\n
The {props.ExclusionName} SLA date exclusion request received successfully.\r\n You will receive an email confirmation from the administrator to the registered mail ID ({props.userEmail}).
\r\n
\r\n \r\n CLOSE \r\n \r\n \r\n \r\n )\r\n}","export const slaFailure_actionTypes = {\r\n\r\n // GET\r\n GET_EXEMPTION_DATA_START: \"GET_EXEMPTION_DATA_START\",\r\n GET_EXEMPTION_DATA_SUCCESS: \"GET_EXEMPTION_DATA_SUCCESS\",\r\n\r\n // EDIT\r\n UPDATE_EXISTING_COMMENT_START: \"UPDATE_EXISTING_COMMENT_START\",\r\n UPDATE_EXISTING_COMMENT_SUCCESS: \"UPDATE_EXISTING_COMMENT_SUCCESS\",\r\n\r\n GET_EXCLUSION_DATA_START: \"GET_EXCLUSION_DATA_START\",\r\n GET_EXCLUSION_DATA_SUCCESS: \"GET_EXCLUSION_DATA_SUCCESS\",\r\n\r\n UPDATE_EXCLUSION_COMMENT_START: \"UPDATE_EXCLUSION_COMMENT_START\",\r\n UPDATE_EXCLUSION_COMMENT_SUCCESS: \"UPDATE_EXCLUSION_COMMENT_SUCCESS\",\r\n}","import { slaFailure_actionTypes as actionTypes } from './../../constants/Administration/SLAFailure-actionTypes';\r\n\r\nexport const getExemptionDataStart = (custId, servId, month) => ({\r\n type: actionTypes.GET_EXEMPTION_DATA_START,\r\n custId, servId, month\r\n});\r\n\r\n\r\nexport const updateExistingCommentStart = (custId, servId, month, sla, id) => ({\r\n type: actionTypes.UPDATE_EXISTING_COMMENT_START,\r\n custId, servId, month, sla, id\r\n});\r\n\r\nexport const updateExistingCommentSuccess = () => ({\r\n type: actionTypes.UPDATE_EXISTING_COMMENT_SUCCESS\r\n});\r\n\r\nexport const getExclusionDataStart = (custId, servId, month) => ({\r\n type: actionTypes.GET_EXCLUSION_DATA_START,\r\n custId, servId, month\r\n});\r\n\r\n\r\nexport const updateExclusionCommentStart = (custId, servId, month, sla, id) => ({\r\n type: actionTypes.UPDATE_EXCLUSION_COMMENT_START,\r\n custId, servId, month, sla, id\r\n});\r\n\r\nexport const updateExclusionCommentSuccess = () => ({\r\n type: actionTypes.UPDATE_EXCLUSION_COMMENT_SUCCESS\r\n});\r\n\r\n\r\n\r\n\r\n","import React, { useEffect, useState } from 'react';\r\nimport AddComments_Icon from '../../../../assets/admin-images/AddComments_Icon.png';\r\nimport Expand_DownArrow from '../../../../assets/admin-images/Expand_DownArrow.png';\r\nimport Collapse_UpArrow from '../../../../assets/admin-images/Collapse_UpArrow.png';\r\nimport Edit_Icon from \"../../../../assets/images/Edit_Icon.png\";\r\nimport DATA from './../DATA.json';\r\nimport { GenericModal } from '../../General/SLA-modal';\r\nimport { ExclusionModalHandler, ExemptionModalHandler } from '../ModalHandler';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getUserData } from '../../../../actions/user.action';\r\nimport TooltipHandler from '../../../Onboard/OnboardComponents/TooltipHandler';\r\nimport { updateExistingCommentStart } from '../../../../actions/Administration/SLAFailure.action';\r\nimport { getExemptionDataStart } from './../../../../actions/Administration/SLAFailure.action';\r\n\r\n\r\n\r\n\r\n\r\nexport default function TableBodyHandler({ key, info, updateExistingComment,RoleBasedView}) {\r\n const dispatch = useDispatch();\r\n let userInfo = useSelector((state) => state.userReducer.userInfo);\r\n useEffect(() => {\r\n dispatch(getUserData());\r\n }, [dispatch]);\r\n const [ExemptionData, setExemptionData] = useState([]);\r\n const [showAccordion, setShowAccordion] = useState(false);\r\n const [showExemptionModal, setShowExemptionModal] = useState(false);\r\n const [exemptionModalInfo, setExemptionModalInfo] = useState([]);\r\n const [editMode, setEditMode] = useState(false);\r\n const [validation, setValidation] = useState('');\r\n\r\n\r\n\r\n const currentDateHandler = () => {\r\n let today = new Date();\r\n let month = today.getUTCMonth() + 1;\r\n let day = today.getUTCDate();\r\n let year = today.getUTCFullYear();\r\n let hours = today.getHours();\r\n let minutes = today.getMinutes();\r\n let seconds = today.getSeconds();\r\n let newdate = (month < 10 ? '0' + month : month) + \"/\" + (day < 10 ? '0' + day : day) + \"/\" + year;\r\n let newTime = (hours < 10 ? '0' + hours : hours) + \":\" + (minutes < 10 ? '0' + minutes : minutes) + \":\" + (seconds < 10 ? '0' + seconds : seconds) + ' hours';\r\n let current_date = [];\r\n current_date.push(newdate);\r\n current_date.push(newTime);\r\n return current_date.join(' ');\r\n }\r\n const createdUserDetails = () => {\r\n let temp_arr = [];\r\n temp_arr.push(userInfo?.name);\r\n temp_arr.push(userInfo?.email);\r\n return temp_arr.join(' ');\r\n }\r\n\r\n\r\n const penaltyExemptionHandler = (data) => {\r\n if (data.type === 'Valid') return data.penalty ;\r\n else return '0'\r\n }\r\n\r\n const handleExemptionFormSubmit = (data) => {\r\n console.log(data)\r\n const newExemption = {\r\n Commenter: createdUserDetails(),\r\n CommentDate: currentDateHandler(),\r\n Comments: data.comments,\r\n Type: data.type,\r\n Penalty: penaltyExemptionHandler(data),\r\n sla:info.ID\r\n }\r\n const newExemptions = [newExemption, ...ExemptionData]\r\n const temp_Arr = {\r\n Comments: data.comments,\r\n Type: data.type,\r\n // Penalty: penaltyExemptionHandler(data),\r\n }\r\n const isEmptyInput = Object.values(temp_Arr).some(x => (x === null || x === '' || x === undefined));\r\n if (isEmptyInput) {\r\n setShowExemptionModal(true);\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else{\r\n setExemptionData(newExemptions);\r\n setShowExemptionModal(false);\r\n updateExistingComment(newExemption)\r\n }\r\n \r\n \r\n }\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n function DateHandle(value) {\r\n let str = value.split('T');\r\n str[0] = formatDate(str[0]);\r\n str[1] = str[1] + ' hours';\r\n return str.join('\\t')\r\n }\r\n useEffect(() => {\r\n if (info?.Comments?.length > 0) {\r\n let arr1 = [...info?.Comments];\r\n arr1.reverse()\r\n let arr2 = arr1.map((a, i, arr) => {\r\n return {\r\n Commenter: a?.Commenter,\r\n CommentDate: DateHandle(a?.CommentDate),\r\n Comments: a?.Comments,\r\n Type: a?.Type,\r\n Penalty: a?.Penalty,\r\n ID: a?.ID\r\n }\r\n })\r\n setExemptionData(arr2)\r\n }\r\n else setExemptionData([]);\r\n }, [])\r\n\r\n console.log('RoleBasedView',RoleBasedView)\r\n return (<>\r\n \r\n {info?.Month} \r\n {info?.SLA} \r\n {info?.Type} \r\n {info?.['Minimum Target']} \r\n {info?.['Expected Target']} \r\n {info?.Performance?.Value} \r\n {info?.Performance?.Met} \r\n {info?.Performance?.All} \r\n {info?.Status} \r\n {RoleBasedView === 0 ? \r\n \r\n {\r\n setEditMode(false)\r\n ExemptionData.length !== 0 && setShowAccordion(!showAccordion);\r\n setExemptionModalInfo({})\r\n }}>\r\n \r\n {ExemptionData.length !== 0 && (showAccordion ? \r\n \r\n : \r\n {\r\n setEditMode(false)\r\n ExemptionData.length !== 0 ? setShowAccordion(!showAccordion) : setShowExemptionModal(true);\r\n setExemptionModalInfo({})\r\n }}>\r\n \r\n {ExemptionData.length !== 0 ? (showAccordion ? }\r\n \r\n }\r\n\r\n \r\n\r\n {(showAccordion) &&\r\n \r\n \r\n \r\n {DATA.header2.map(data => ({data.label} ))}
\r\n \r\n {ExemptionData?.map(data => (\r\n
\r\n\r\n {Object.values(data).slice(0, 5).map((value, i) => (
{value} ))}\r\n {ExemptionData?.indexOf(data) === 0 ? (RoleBasedView === 1 &&
\r\n {\r\n setEditMode(true)\r\n setShowExemptionModal(true);\r\n console.log(ExemptionData?.[0])\r\n setExemptionModalInfo(ExemptionData?.[0])\r\n }}>\r\n ) :
}
\r\n ))}\r\n
\r\n }\r\n\r\n {showExemptionModal && \r\n setShowExemptionModal(false)}\r\n handleExemptionFormSubmit={handleExemptionFormSubmit}\r\n SLA_name={info?.SLA} ExemptionData={exemptionModalInfo}\r\n editMode={editMode}\r\n />\r\n }\r\n\r\n )\r\n}","import React, { useEffect, useState } from 'react';\r\nimport FilterTab from '../FilterTab';\r\nimport AboveMinimalTargetIcon from \"../../../../assets/images/AboveMinimalTarget_Status.png\";\r\nimport BelowMinimalTargetIcon from \"../../../../assets/images/BelowMinimalTarget_Status.png\";\r\nimport SLADataExclusion_Icon from '../../../../assets/admin-images/SLADataExclusion_Icon.png';\r\nimport DATA from './../DATA.json'\r\nimport TableBodyHandler from './SLA-Exemption-Table';\r\nimport './../SLA-Admin.css';\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getExemptionDataStart, updateExistingCommentStart } from '../../../../actions/Administration/SLAFailure.action';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { getRoleBasedView } from '../../../../actions/Administration/admin.action';\r\n\r\n\r\nfunction SLAExemptionHandler() {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let ExemptionData = useSelector((state) => state.slaFailureReducer.ExemptionData);\r\n let AccountDetails = useSelector((state) => state.adminAccountReducer.AccountDetails);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\nconsole.log(AccountDetails)\r\n console.log(ExemptionData, AccountDetails);\r\n const [selectedDate, setSelectedDate] = useState()\r\n useEffect(() => {\r\n dispatch(getExemptionDataStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID, formatMonthDate(new Date())))\r\n // dispatch(getExemptionDataStart('20', '15', '2022-07-01'))\r\n setSelectedDate(formatMonthDate(new Date()))\r\n }, [])\r\n const formatMonthDate = (date) => {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n return [year,month,'01'].join('-');\r\n }\r\n const HandleSLAMonth = (value) => {\r\n setSelectedDate(formatMonthDate(value))\r\n console.log(formatMonthDate(value))\r\n // dispatch(getExemptionDataStart('20', '15', formatMonthDate(value)))\r\n dispatch(getExemptionDataStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID, formatMonthDate(value)))\r\n }\r\n console.log(selectedDate)\r\n const updateExistingComment = newExemption => {\r\n console.log(newExemption)\r\n \r\n let temp = {\r\n Comment: newExemption.Comments,\r\n Type: newExemption.Type,\r\n Penalty: Number(newExemption.Penalty)\r\n }\r\n console.log(temp)\r\n console.log(newExemption.sla)\r\n // dispatch(updateExistingCommentStart('20', '15', '2022-07-01',newExemption.sla, temp))\r\n // dispatch(getExemptionDataStart('20', '15', '2022-07-01'))\r\n \r\n dispatch(updateExistingCommentStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID, (selectedDate),newExemption.sla, temp))\r\n dispatch(getExemptionDataStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID, (selectedDate)))\r\n }\r\n \r\n\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch]);\r\n\r\n console.log('RoleBasedView',RoleBasedView?.[0]?.SLAExemption?.[0]?.ReadWrite)\r\n return (\r\n <>\r\n \r\n history.push('/welcome')} label1='Home' isActive2={true} value2={()=>history.push('/admin')} label2='Administration' isActive3={false}\r\n label3={ExemptionData?.[0]?.Customer?.Name + ' - ' + ExemptionData?.[0]?.ServiceDesk?.Name + \" - SLA Failure Exemption \" } />\r\n \r\n
Legend: \r\n
Above Minimal Target
Below Minimal Target\r\n
\r\n \r\n \r\n {DATA.header.map(data => ({data.label} ))} \r\n \r\n {ExemptionData?.[0]?.Rows?.map((info, i) => )}\r\n \r\n
\r\n No Data Found for Selected Year & Month
: '' }\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default SLAExemptionHandler","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAUCAYAAABSx2cSAAAABHNCSVQICAgIfAhkiAAAAm5JREFUOE+Vk11oUmEYx5/37JyT+f3BKoPGKosmMYrNooho1FpR3QwqGJU60bUyCrrIBi2oGHSRLVaNFaSzWRc1BkMa1WQXA9e8arsIDG0GNRqDTEPTY563V0Gwmc6ey/d9fs//+URArK3GraBZ7j4C2IcB0tm38oaqKISHURZkWK6PgAd4wPMI0GeMqUelYIx4mkJwCwC9QWc0DjcFsJ+AVgJeIEFSzqDxYCnY0jDAcFF2AiM0hQwax1cCLpBIMQKsRxg+DYaMTZXCYR7gPVEXEmWaQJOOoOF65TCmOl0h/VghcHrT4zqgIPk0YJ4rfF+adpgvgE11ztukhItSlSDFcTzFpzPRxM/fVwaDBnc2SEnY2vjMI5CwzbahFla1VpwT9L8Kg/OaL/krxl0mjXz4T5gCXrZOq+xXqkVyxWoh6G/sgshCAu6ax2Fz4yqYeP4xTXPJalBAorDbubSlCub8yau6I3taNdDb4QWhlIUvgQjoDtfCsc56sJvexmYn58+ukKZeFsESJdNj7WvatmXnmpxi16ERUG+QQffw0Vz6Qzf9Ka/rg42VcQ+KYLGcMbRe2n6iobkG7JZx0LXUQmhmEfIl9LSN/Qj4F9sF8qSnCMYowyurRS8kKoFkRzbVc/U5xV6LF8i+Q2D6W2Rg9pSyZLctW4fuCcS0uePO3pXa3WpIxtPwzjMHru6pDLHjrpBppOyc9RqnSSRjbPEop6miqbRQwvji35NdjlC7r+yc/15JTG6EbPoSK6u83CUXwwD95DCmlwOz/zzCNIXBjhH1Guk3OmcQYFklYN6HFES0YBQZNU+0/wPmfSnMcH8ArOhmesmGvtYAAAAASUVORK5CYII=\"","import ReactModal from \"react-modal\";\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\nimport { useState } from 'react';\r\nimport { useDispatch } from 'react-redux';\r\nimport { updateValidToDateStart } from'../../../actions/Administration/admin.action'\r\nexport function ActivationRequestModal(props) {\r\n\r\n const dispatch = useDispatch();\r\n const [validation, setValidation] = useState('');\r\n const [ValidFrom, setValidFrom] = useState('');\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n const ValidFromDateHandler = (date) => {\r\n setValidFrom(formatDate(date));\r\n }\r\n const onSubmitRequest = () => {\r\n \r\n let obj = [{\r\n Account: props.data?.['Account Name'],\r\n Servicedesk: props.data?.['Site Name'],\r\n ValidUntil: ValidFrom\r\n }]\r\n if(ValidFrom){\r\n props.handleSubmitClick()\r\n dispatch(updateValidToDateStart(obj))\r\n setValidation('')\r\n }\r\n else{\r\n props.handleinvalidSubmitClick()\r\n setValidation('Please Ensure you filled the inputs with \" * \" mark ')\r\n }\r\n \r\n \r\n }\r\n return <>\r\n \r\n \r\n \r\n
Request for Account Re-Activation\r\n
\r\n
{validation}
\r\n \r\n
\r\n
Account Name: {props.data?.['Account Name']}{props.data.AccountName}
\r\n
Site Name: {props.data?.['Site Name']}{props.data.SiteName}
\r\n
\r\n Set Valid To * \r\n ValidFromDateHandler(date)}\r\n format=\"MM/DD/YYYY\"\r\n style={{ width: 380 }}\r\n />\r\n
\r\n
\r\n
\r\n \r\n SUBMIT \r\n \r\n \r\n CANCEL \r\n \r\n \r\n\r\n \r\n \r\n}\r\n\r\n\r\nexport function RequestSentModal(props) {\r\n\r\n return (<>\r\n \r\n \r\n
\r\n Request for Account Re-Activation\r\n
\r\n
\r\n
The {props.data?.['Account Name']} - {props.data?.['Site Name']}\r\n {props.data.AccountName} - {props.data.SiteName} \r\n account activation request received successfully. You will receive an email\r\n confirmation from the administrator to the registered mail ID ({props.data?.['Created By']}{props.data.CreatedBy}).\r\n
\r\n
\r\n \r\n CLOSE \r\n \r\n \r\n \r\n )\r\n}\r\n\r\n\r\nexport function ActivateModelPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '15em',\r\n left: '30em',\r\n width: '500px',\r\n height: '300px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAt9JREFUSEutVktu2lAUxSABQ7qCegdxxq1U0y4gzg7cIR+peF4pZtCxXYnPMHQFgQUk8aAd16wAdwVhCAxwz7Huax/+kFQq0pOf3+eccz++F6N25jefz83j8XhlGIaNYyaGJcdjPJM0TaN6vb7q9XpJFYxRtkFgrN8A4BrPpQAlu92OwLV2u22BmGcckmPcYT4uIyoQzGYzB4dvcekbAH3P87ZBEHRardYFQDskgOrtfr9fqz0Q+hDhYsvt9/tLXfQJwXQ6dQEc4rA9GAxivFt4v6FSjDXGVi6T6EKsG2tnI9wd4X2hSP4QiPKFAoebSORihIfDIaRarH3BxRSu+Eyrms3mCAJGtBjKPREU6ZZkBPQ5gH5idEXNEhc7cINDYKVGJ1Br4j6CbkByrUhw32JMMgKoX2Bhi4WRKLdw2NZ9yflkMvnA53A4vM/vASMGRkQM4nEfGK4h6mOoNWGyyUOc68rzYGXvYglT14ZLEyRFQisMsNGHVOzCPLomwjwsA5H0rVXlPe77xIKbHYVlcMJsAOsSrE9Q/6pKvQDUAECgwk+seIJA4ro44NAC+o5W1Jgx2FRfawHgOQKJp44XkCClaqhnUJl23wX5Aa540FmqCBj8RqPRFZFv8QyBGdEjZQQ/BPS+hIAfHkuHw3RW5ELwXgje5AlOTIKLLs9ljeR5gUTdybv8n4KsQKpIqoJ8kqYAiauyJBcPJoPPlNSIi2n6nz+0DcuNfGgbxOuyqlS8K4sFxGSBzAdfS89iqeCmskIr0/yiXyPVui8sdo+4+4vuApaNOe//LXaigL4slGscDNB4vpaVazSaT6z/bE4schL8R+B8VI3n2YbDQALgisHH0BuOBfCVBDoW5XdY80objpbHmSUYt3DRWLlIALKWKaU94pypCUsC6d/nW6YikZgw5UhGk1kQE/ZhnmF/xsOUfRvPFUj9FzV9RaIF32HwAUBAAvO3xhrrfcTSce5vy2/MfWnoIDzgAgAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAABHNCSVQICAgIfAhkiAAAAKlJREFUWEdjjFeZ/59hEADGQeeQBbcTBiRcElQXgO2Fh8ioQ0ZDBC0ljqYR9KxJtRDZMOkCMO9BjA/INSC5CKCaQ2AGgVxAThEw6hCapZHRqMEVtHRJrKAsumEyMJuSCUDZOiAPe9YmKdeMOoSUGBjNNQOaa/BF1WjUDNqoAbdHoABXoUVM1I52J2ChRFIRT0oBR6raUYfQrIVGalQQdAilBlKqf9CMjwAAwVXehejB9zQAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAABHNCSVQICAgIfAhkiAAAAIZJREFUWEdjjFeZ/59hEADGQeeQBbcTBiRcElQXgO2Fh8ioQ0ZDBC0ljqYR9Kw5GiKjIUKouB5NI8MjjWyYdIFhw+QLhKIbp3xArgFDQJ4BVnmS0sioQ8iOAzI0khQ1ZJhPtJZRhwyPcoToCCdD4WgaGU0jhJLNaBoZOmmEUFzSWn7QjI8AAIcftIXE58mTAAAAAElFTkSuQmCC\"","import React, {useState } from 'react'\r\nimport { KeyboardDatePicker, KeyboardTimePicker } from '@material-ui/pickers';\r\nimport clock_normal from '../../../../assets/images/Clock_Normal.png';\r\nimport Add_Dates from '../../../../assets/admin-images/Add_Dates.png';\r\nimport Remove_Dates from '../../../../assets/admin-images/Remove_Dates.png';\r\nimport { useEffect } from 'react';\r\n\r\nfunction formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n}\r\nfunction formatTime(time) {\r\n let today = new Date(time),\r\n hours = today.getHours(),\r\n minutes = today.getMinutes(),\r\n seconds = '00'\r\n if (hours < 10)\r\n hours = '0' + hours;\r\n \r\n if (minutes < 2)\r\n minutes = '0' + minutes;\r\n return [hours, minutes, seconds].join(':');\r\n}\r\n\r\nconst formatTimeIST=(date) =>{\r\n let hms = date;\r\nvar target = new Date(\"1970-01-01T\" + hms);\r\nreturn target\r\n}\r\n\r\nfunction AddDateTimeFormat(props) {\r\n const [selectedDate, setSelectedDate] = useState(new Date('01/01/2000'));\r\n const [startTime, setStartTime] = useState(new Date(''));\r\n const [endTime, setEndTime] = useState(new Date(''));\r\n useEffect(() => {\r\n const {EndTime, StartTime, Date:date = ''} = props.rows;\r\n // const { Date:date = '', EndTimeDateObj:endTime = '', StartTimeDateObj:startTime = '', } = props.rows;\r\n // console.log(\"rows in Add date time format :::::::::::\", props.rows);\r\n // if(date) {\r\n // \r\n // } \r\n setSelectedDate(new Date(date));\r\n setEndTime(formatTimeIST(EndTime));\r\n // setStartTime(new Date(startTime));\r\n setStartTime(formatTimeIST(StartTime))\r\n // if(endTime) {\r\n // setEndTime(new Date(endTime));\r\n // console.log(endTime)\r\n // }\r\n // else{\r\n // setEndTime(formatTimeIST(EndTime))\r\n // }\r\n // if(startTime) {\r\n // setStartTime(new Date(startTime));\r\n // }\r\n // else{\r\n // setStartTime(formatTimeIST(StartTime))\r\n // }\r\n \r\n }, [props.rows]);\r\n \r\n return (<>\r\n \r\n\r\n \r\n Date * \r\n\r\n {\r\n setSelectedDate(formatDate(date));\r\n props.onChangeExclusionDate('Date', formatDate(date))\r\n }}\r\n minDate={new Date('01/01/1990')}\r\n format=\"MM/DD/YYYY\"\r\n error={false}\r\n helperText={null}\r\n\r\n />
\r\n \r\n
Start Time * \r\n
{\r\n setStartTime(new Date(date));\r\n props.onChangeExclusionDate('StartTime', formatTime(date))\r\n }}\r\n keyboardIcon={ \r\n
End Time * \r\n
{\r\n // here date is actual date object, b4 conversion\r\n setEndTime(new Date(date));\r\n props.onChangeExclusionDate('EndTime', formatTime(date))\r\n }}\r\n keyboardIcon={ \r\n
\r\n
\r\n )\r\n}\r\n\r\n\r\n\r\n\r\nexport function ExclusionModalHandler(props) {\r\n console.log(props.ExclusionData)\r\n // const Exclusion_initialState = {\r\n // Comments: '',\r\n \r\n // }\r\n const [displayRows, setDisplayRows] = useState([])\r\n const [exclusionData, setExclusionData] = useState([])\r\n const [commentAttribute, setCommentAttribute] = useState('');\r\n const [validation, setValidation] = useState('');\r\n const [editFormInfo, setEditFormInfo] = useState({});\r\n // const [addExemptionForm, setAddExemptionForm] = useState(Exclusion_initialState);\r\n let editMode = props.editMode;\r\n\r\n const onChangeExclusionDate = (type, date, index) => {\r\n const allDisplayRows = [...displayRows];\r\n console.log(allDisplayRows)\r\n const updateDisplayRows = allDisplayRows.map((row, i) => {\r\n if( i === index ) {\r\n return {\r\n ...row,\r\n // [type+'DateObj']: new Date(), // actualTimeObj ||\r\n [type]: date\r\n }\r\n } else {\r\n return row;\r\n }\r\n });\r\n setDisplayRows(updateDisplayRows);\r\n \r\n }\r\n const onClickAddNewDate = () => {\r\n let arr1 = [...displayRows];\r\n let temp = { id: displayRows.length + 1 }\r\n arr1.push(temp);\r\n setDisplayRows(arr1);\r\n console.log(displayRows)\r\n }\r\n\r\n const onClickDeleteButton = (id) => {\r\n let getExistingRows = [...displayRows];\r\n // console.log(\"before delete :::::\", arr1)\r\n // arr1.splice(i,1)\r\n // console.log(\"after delete :::::::\", arr1)\r\n const getDeletedRows = getExistingRows.filter((obj, i) => i !== id);\r\n console.log(\"after delete :::::::\", getDeletedRows)\r\n setDisplayRows(getDeletedRows)\r\n }\r\n const onChangeExclusionInput = (event) => {\r\n event.preventDefault();\r\n // setCommentAttribute(event.target.value);\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n if (editMode) {\r\n const newFormData = { ...editFormInfo};\r\n newFormData[fieldName] = fieldValue;\r\n setCommentAttribute(newFormData)\r\n }\r\n else {\r\n const newFormData = { ...displayRows };\r\n newFormData[fieldName] = fieldValue;\r\n setCommentAttribute(newFormData)\r\n }\r\n }\r\n const onClickSubmit=(event)=>{\r\n event.preventDefault();\r\n let temp = {\r\n comments:commentAttribute,\r\n data:displayRows\r\n }\r\n console.log(temp)\r\n // const temp_arr = Object.values(displayRows).every(row => Object.values(row).length >= 3)\r\n // console.log('temp_arr',temp_arr)\r\n // if(!temp_arr){\r\n // setValidation('Please Ensure you filled all the inputs with \" * \" mark')\r\n // }\r\n // else{\r\n props.handleExclusionFormSubmit(temp);\r\n // }\r\n }\r\n console.log(displayRows)\r\n console.log(commentAttribute)\r\n useEffect(() => {\r\n let temp = [\r\n {\r\n Date:'',\r\n EndTime:'',\r\n StartTime:''\r\n }\r\n ]\r\n console.log(props.ExclusionData?.Data)\r\n setDisplayRows(props.ExclusionData ? (props.ExclusionData?.Data !== null ? props.ExclusionData?.Data : temp) : temp);\r\n }, [])\r\n \r\n return (\r\n <>\r\n \r\n \r\n )\r\n}\r\n\r\n\r\n","import React, { useEffect, useState } from 'react';\r\nimport SLADataExclusion_Icon from '../../../../assets/admin-images/SLADataExclusion_Icon.png';\r\nimport Expand_DownArrow from '../../../../assets/admin-images/Expand_DownArrow.png';\r\nimport Collapse_UpArrow from '../../../../assets/admin-images/Collapse_UpArrow.png';\r\nimport AboveMinimalTargetIcon from \"../../../../assets/images/AboveMinimalTarget_Status.png\";\r\nimport BelowMinimalTargetIcon from \"../../../../assets/images/BelowMinimalTarget_Status.png\";\r\nimport Edit_Icon from \"../../../../assets/images/Edit_Icon.png\";\r\nimport DATA from './../DATA.json';\r\nimport { GenericModal } from '../../General/SLA-modal';\r\nimport { RequestModalHandler } from '../ModalHandler';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getUserData } from '../../../../actions/user.action';\r\nimport { ActivateModelPopup } from '../../Administration_firstpage.js/ActivationModel';\r\nimport TooltipHandler from '../../../Onboard/OnboardComponents/TooltipHandler';\r\nimport { ExclusionModalHandler } from './ExclusionModalHandler';\r\nimport { getExclusionDataStart, updateExclusionCommentStart } from './../../../../actions/Administration/SLAFailure.action';\r\n\r\n\r\nexport default function TableBodyHandler({ info,selectedDate }) {\r\n const dispatch = useDispatch();\r\n let userInfo = useSelector((state) => state.userReducer.userInfo);\r\n let AccountDetails = useSelector((state) => state.adminAccountReducer.AccountDetails);\r\n useEffect(() => {\r\n dispatch(getUserData());\r\n }, [dispatch]);\r\n\r\n const [showAccordion, setShowAccordion] = useState(false);\r\n const [showExclusionModal, setShowExclusionModal] = useState(false);\r\n const [addExclusionID, setAddExclusionID] = useState(null);\r\n const [ExclusionComments, setExclusionComments] = useState([]);\r\n const [showRequestModal, setShowRequestModal] = useState(false);\r\n const [exclusionModalInfo, setExclusionModalInfo] = useState([]);\r\n const [editMode, setEditMode] = useState(false);\r\n const [validation, setValidation] = useState('')\r\n const [emptyRowData,setEmptyRowData] = useState(false)\r\n console.log(info)\r\n const handleExclusionFormSubmit = data => {\r\n console.log(data);\r\n let temp_arr = [...data.data];\r\n console.log(temp_arr)\r\n let tempArray2 = temp_arr.map(role => {\r\n return {\r\n Date: role.Date ,\r\n EndTime: role.EndTime ,\r\n StartTime: role.StartTime,\r\n \r\n } \r\n });\r\n const newExclusion = {\r\n info:info.ID,\r\n Comments :data.comments.comments,\r\n Data : tempArray2\r\n }\r\n console.log(newExclusion);\r\n let isEmptyInput = false;\r\n const filterd = tempArray2\r\n .forEach(row => {\r\n const values = Object.values(row);\r\n console.log(\"values::: 57 :::::::::\", values);\r\n if(isEmptyInput) {\r\n return\r\n } \r\n if(values.includes(undefined) || values.includes('')) {\r\n isEmptyInput = true;\r\n return;\r\n }\r\n // return !values.includes(undefined) // values.every((v) => v !== undefined || v !== null)\r\n });\r\n console.log(\"values::: 60 :::::::\", filterd)\r\n // const isEmptyInput = tempArray2\r\n // // .filter(row => {\r\n // // return Object.values(row).every(x => (x || x !== null || x !== '' || x !== undefined))\r\n // // })\r\n // .every(row => {\r\n \r\n // return Object.values(row).length >= 3 ;\r\n // });\r\n console.log(\"row values ::::::::::\",isEmptyInput );\r\n // const tempArr = tempArray2.every(row => {\r\n // const yes = Object.values(row).some(x => (x === null || x === '' || x === undefined))\r\n // console.log(\"row values ::::::::::\",Object.values(row), Object.values(row).length, yes );\r\n // setEmptyRowData(yes)\r\n // return Object.values(row);\r\n // });\r\n // const tempArr = tempArray2.every(row => Object.values(row).some(x => (x === undefined)))\r\n // console.log(tempArr)\r\n\r\n if(isEmptyInput){\r\n setShowExclusionModal(true)\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark')\r\n }\r\n // else if(!tempArr){\r\n // setShowExclusionModal(true)\r\n // setValidation('Please Ensure you filled all the inputs with \" * \" mark')\r\n // }\r\n // else if(tempArray2.length === 0){\r\n // setShowExclusionModal(true)\r\n // setValidation('Please Ensure ') \r\n // }\r\n else{\r\n if(ExclusionComments !== null) {\r\n const newRoles = [newExclusion,...ExclusionComments];\r\n setExclusionComments(newRoles)\r\n }\r\n else{\r\n const newRoles = [newExclusion];\r\n setExclusionComments(newRoles)\r\n }\r\n setShowExclusionModal(false);\r\n setValidation('')\r\n }\r\n\r\n let dataArr = temp_arr.map(role => {\r\n return {\r\n \"Date\": role.Date,\r\n \"StartTime\": role.StartTime,\r\n \"EndTime\": role.EndTime\r\n }\r\n });\r\n const dispObj ={\r\n \"Comment\": data.comments.comments,\r\n \"Data\": dataArr\r\n }\r\n console.log(newExclusion.info) //props.selectedDate\r\n dispatch(updateExclusionCommentStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID, selectedDate,newExclusion.info, dispObj))\r\n dispatch(getExclusionDataStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID, selectedDate))\r\n\r\n console.log('dispatchdata::::::::::',AccountDetails.CustomerID, AccountDetails.ServiceDeskID, selectedDate,newExclusion.info)\r\n\r\n\r\n // dispatch(updateExclusionCommentStart('20', '15', '2022-07-01',newExclusion.info, dispObj))\r\n // dispatch(getExclusionDataStart('20', '15', '2022-07-01'))\r\n }\r\n \r\n useEffect(() => {\r\n let temp_arr=[...DATA.ExclusionData[0].comments];\r\n let tempArr = info.Comments\r\n tempArr && tempArr.reverse()\r\n console.log(tempArr, temp_arr)\r\n setExclusionComments(tempArr)\r\n }, [])\r\n\r\n // useEffect(() => {\r\n // console.log(info)\r\n // if (info?.Comments?.length > 0) {\r\n // let arr1 = [...info?.Comments];\r\n // console.log(arr1)\r\n // const arr3 = [...info?.Comments[0].Data]\r\n // const tempArray2 = arr3.map((date)=>{\r\n // return{\r\n // Date: date.Date,\r\n // EndTime: date.EndTime,\r\n // StartTime: date.StartTime\r\n // }\r\n // })\r\n // let arr2 = arr1.map((a, i, arr) => {\r\n // return {\r\n // Data : tempArray2,\r\n // Comments :a?.Comments\r\n // }\r\n // })\r\n // setExclusionComments(arr2)\r\n // }\r\n // else setExclusionComments([]);\r\n // }, [])\r\n const formatDatefromString = (seldate) =>{\r\n var date = new Date(seldate); // M-D-YYYY\r\n\t\tvar d = date.getDate();\r\n\t\tvar m = date.getMonth() + 1;\r\n\t\tvar y = date.getFullYear();\r\n\r\n\t\treturn (d <= 9 ? '0' + d : d) + '/' + (m <= 9 ? '0' + m : m) + '/' + y;\r\n }\r\n console.log('..............',info.SLA)\r\n return (<>\r\n \r\n {info.Month} \r\n {info.SLA} \r\n {info.Type} \r\n {info?.['Minimum Target']} \r\n {info?.['Expected Target']} \r\n {info.Performance.Value}\r\n {info.WDE.Value}\r\n \r\n {info.Performance.Met} \r\n {info.WDE.Met} \r\n {info.Performance.All} \r\n {info.WDE.All} \r\n {info.Status} \r\n {\r\n setAddExclusionID(info.id)\r\n ExclusionComments !== null ? setShowAccordion(!showAccordion) : setShowExclusionModal(true)\r\n setEditMode(false)\r\n setExclusionModalInfo('')\r\n }}>\r\n {ExclusionComments !== null ? (showAccordion ? }\r\n \r\n \r\n\r\n {(showAccordion) &&\r\n \r\n \r\n \r\n {DATA.header2WDE.map(data => ({data.label} ))}
\r\n \r\n {ExclusionComments?.map(comment => (\r\n
\r\n \r\n {comment?.Data?.map((value, i) => (\r\n \r\n {formatDatefromString(value.Date)} \r\n {value.StartTime} \r\n {value.EndTime}
))} \r\n {comment.Comments} \r\n {(ExclusionComments.indexOf(comment) === 0 && info.status !== 'Completed' && ExclusionComments !== null) ? \r\n {\r\n const element = ExclusionComments.find(details => details === info.Comments)\r\n const index = ExclusionComments.indexOf(element) + 1;\r\n setAddExclusionID(index);\r\n setEditMode(true)\r\n setShowExclusionModal(true);\r\n setExclusionModalInfo(ExclusionComments?.[0])\r\n }}>\r\n \r\n \r\n \r\n )\r\n )}\r\n
\r\n }\r\n {showExclusionModal && \r\n setShowExclusionModal(false)} validation={validation}\r\n handleExclusionFormSubmit={handleExclusionFormSubmit} ExclusionData={exclusionModalInfo}\r\n ExclusionName={info.SLA}\r\n />\r\n \r\n }\r\n {(!showExclusionModal && showRequestModal) && \r\n setShowRequestModal(false)}\r\n userEmail={userInfo?.email}\r\n // ExclusionName={ExclusionComments[ExclusionComments.findIndex((data,i) => i === addExclusionID)].SLA}\r\n />\r\n \r\n }\r\n )\r\n\r\n}","import React, { useEffect, useState } from 'react';\r\nimport FilterTab from '../FilterTab';\r\nimport AboveMinimalTargetIcon from \"../../../../assets/images/AboveMinimalTarget_Status.png\";\r\nimport BelowMinimalTargetIcon from \"../../../../assets/images/BelowMinimalTarget_Status.png\";\r\nimport SLAFailureExemption from \"../../../../assets/images/SLAFailureExemption_Icon.png\";\r\nimport DATA from './../DATA.json';\r\nimport './../SLA-Admin.css';\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\nimport TableBodyHandler from './SLA-Exclusion-Table';\r\nimport { useSelector } from 'react-redux';\r\nimport { useDispatch } from 'react-redux';\r\nimport { getExclusionDataStart } from '../../../../actions/Administration/SLAFailure.action';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\n\r\nfunction SLAExclusionHandler() {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let ExclusionData = useSelector((state) => state.slaFailureReducer.ExclusionData);\r\n console.log(ExclusionData)\r\n let AccountDetails = useSelector((state) => state.adminAccountReducer.AccountDetails);\r\n console.log(ExclusionData)\r\n const [selectedDate, setSelectedDate] = useState()\r\n useEffect(() => {\r\n // dispatch(getExclusionDataStart('20', '15', '2022-07-01'))\r\n dispatch(getExclusionDataStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID,formatMonthDate(new Date())))\r\n setSelectedDate(formatMonthDate(new Date()))\r\n }, [])\r\n\r\n\r\n const formatMonthDate = (date) => {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n return [year, month, '01'].join('-');\r\n }\r\n\r\n const HandleSLAMonth = (value) => {\r\n setSelectedDate(formatMonthDate(value))\r\n console.log(formatMonthDate(value))\r\n dispatch(getExclusionDataStart(AccountDetails.CustomerID, AccountDetails.ServiceDeskID,formatMonthDate(value)))\r\n }\r\n return (\r\n <>\r\n \r\n history.push('/welcome')} label1='Home' isActive2={true} value2={()=>history.push('/admin')} label2='Administration' isActive3={false} \r\n label3={ExclusionData?.[0]?.Customer?.Name + ' - ' + ExclusionData?.[0]?.ServiceDesk?.Name + \" - SLA Data Exclusion\"} />\r\n \r\n \r\n
Legend: \r\n
Above Minimal Target
Below Minimal Target\r\n
WDE With Data Exclusion \r\n
\r\n \r\n \r\n {DATA.headerWDE.map(data => ({data.label} ))} \r\n \r\n {ExclusionData?.[0]?.Rows?.map((info, i) => )}\r\n \r\n
\r\n No Data Found for Selected Year & Month
: '' }\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default SLAExclusionHandler","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","import React, { useState } from 'react'\r\nimport { ListGroup, Offcanvas } from 'react-bootstrap'\r\n\r\nexport const AccountsOffcanvas = (props) => {\r\n \r\n return (\r\n <>\r\n \r\n \r\n {props.Title} \r\n \r\n \r\n {\r\n \r\n {props.ScorCardOffCanvasData.map((data, index) => (\r\n {data.Account} \r\n ))}\r\n \r\n }\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport const AccountsOffcanvasTL = (props) => {\r\n \r\n return (\r\n <>\r\n \r\n \r\n {props.Title} \r\n \r\n \r\n {\r\n \r\n {props.ScorCardOffCanvasData.map((data, index) => (\r\n {data.value} \r\n ))}\r\n \r\n }\r\n
\r\n \r\n \r\n \r\n )\r\n}","import React, { useEffect, useState } from 'react';\r\nimport PerformanceScoreCup from \"../../assets/images/PerformanceScoreCup.png\";\r\nimport DownloadIcon from \"../../assets/images/Download.png\"\r\nimport AccountAssignmentIcon from \"../../assets/images/AccountAssignmentIcon.png\"\r\nimport AboveMinimalTarget_Status from \"../../assets/images/AboveMinimalTarget_Status.png\"\r\nimport AboveRequiredTarget_Status from \"../../assets/images/AboveRequiredTarget_Status.png\"\r\nimport BelowMinimalTarget_Status from \"../../assets/images/BelowMinimalTarget_Status.png\"\r\nimport './AgentScorecard.css'\r\nimport Box from '../Box/box';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getScoreCardData, getScoreCardOffCanvasData } from './../../actions/ScoreCard&TeamKPI.action';\r\nimport DatePickerHandle from '../Onboard/OnboardComponents/KeyboardDatePicker';\r\nimport { AccountsOffcanvas } from './AccountsOffcanvas';\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\n\r\n\r\n\r\nfunction AgentScoreCard() {\r\n const dispatch = useDispatch();\r\n let ScoreCardData = useSelector((state) => state.ScoreCardReducer.ScorCardData);\r\n let ScorCardOffCanvasData = useSelector((state) => state.ScoreCardReducer.ScorCardOffCanvasData);\r\n let selectedAgentScoreCardDate = useSelector((state) => state.ScoreCardReducer.selectedAgentScoreCardDate);\r\n\r\n const ScorCardData = ScoreCardData ? ScoreCardData : {}\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, '01', year].join('/');\r\n }\r\n\r\n const [selectedDate, setSelectedDate] = useState(formatDate(new Date()));\r\n \r\n\r\n const ValidFromDateHandler = (date) => {\r\n setSelectedDate((date === null || date === undefined) ? null : formatDate(date));\r\n }\r\n console.log('selectedDate',selectedDate)\r\n\r\n useEffect(() => {\r\n dispatch(getScoreCardData(selectedDate,selectedAgentScoreCardDate));\r\n dispatch(getScoreCardOffCanvasData(selectedAgentScoreCardDate))\r\n }, [dispatch,selectedDate,selectedAgentScoreCardDate]);\r\n\r\n const getArrowMark = (color) => {\r\n switch(color){\r\n case 'Green': {\r\n return (
);\r\n }\r\n }\r\n }\r\n const [showOffCanvas,setShowOffCanvas] = useState(false)\r\n return (\r\n <>\r\n \r\n \r\n \r\n
Legend: \r\n
Above Required Target\r\n
Above Minimal Target\r\n
Below Minimal Target\r\n
\r\n {ScorCardData.agentname}
\r\n \r\n {/* \r\n Employee ID {ScorCardData.employeeid} Alias {ScorCardData.alias} FTE {ScorCardData.FTE} \r\n
\r\n
\r\n \r\n \r\n
Overall Performance Score \r\n
\r\n
{getArrowMark(ScorCardData?.['Last Month'])} {ScorCardData.ScorePM} for last month \r\n
\r\n \r\n
Account Assignment \r\n
\r\n
{setShowOffCanvas(true)}} style={{cursor:'pointer'}}>{ScorCardData.accounts}
\r\n
setShowOffCanvas(false)} show={showOffCanvas} Title='Account Assignment'/>\r\n
\r\n \r\n
\r\n
Download CSV \r\n
\r\n \r\n {}} click={false}/>)}\r\n \r\n\r\n \r\n )\r\n}\r\n\r\nexport default AgentScoreCard","import React, { useEffect } from 'react'\r\nimport { useState } from 'react';\r\nimport searchIcon from '../../../../assets/images/Search_Icon.png';\r\nimport RequestForReopen_Icon from './../../../../assets/onboard-images/RequestForReopen_Icon.png'\r\nimport RequestForDisbaled_Icon from './../../../../assets/onboard-images/RequestForDisbaled_Icon.png'\r\nimport Edit_Icon from './../../../../assets/images/Edit_Icon.png';\r\nimport deleteIcon from './../../../../assets/onboard-images/Delete_Icon.png'\r\nimport Eye_ViewDetails_Icon from './../../../../assets/onboard-images/Eye_ViewDetails_Icon.png';\r\nimport { useHistory } from 'react-router-dom';\r\nimport AdminBreadcrumb from '../../../Administration/General/Admin-breadcrumb';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getOnboardAccounts, getRoleTabData, updateReOpenRequestStart, updateReOpenRequestSuccess, viewAccountDetails } from '../../../../actions/Onboard.action';\r\nimport { ActivateModelPopup } from '../../../Administration/Administration_firstpage.js/ActivationModel';\r\nimport { AccountDeleted, DeleteModalPopup, OnboardRequestAdmin } from '../Modals/DeleteModalPopup';\r\nimport './Onboardlanding.css';\r\nimport TooltipHandler from './../TooltipHandler';\r\nimport { updateDeleteAccountStart } from './../../../../actions/Onboard.action';\r\nimport { DeleteFragment, DeletedModalPopup } from './../Modals/DeleteModalPopup';\r\nimport { getRoleBasedView } from '../../../../actions/Administration/admin.action';\r\nconst MOCK_DATA = [\r\n {\r\n // \"path\": \"data:image/png;base64,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\",\r\n \"Account Name\": \"Audi\",\r\n \"Site Name\": \"Derby UK\",\r\n \"Created By\": \"Hruby, Tomas (thruby@dxc.com)\",\r\n \"Valid From\": \"08/05/2021\",\r\n \"Valid TO\": \"08/07/2023\",\r\n // \"Status\": \"Saved\"\r\n }]\r\nconst Headers = [\r\n {\r\n id: 1,\r\n label: \"Account Logo\"\r\n },\r\n {\r\n id: 2,\r\n label: \"Account Name\"\r\n },\r\n {\r\n id: 3,\r\n label: \"Site Name\"\r\n },\r\n {\r\n id: 4,\r\n label: \"Created By\"\r\n },\r\n {\r\n id: 5,\r\n label: \"Created Date\"\r\n },\r\n {\r\n id: 6,\r\n label: \"Valid From\"\r\n },\r\n {\r\n id: 7,\r\n label: \"Valid To\"\r\n },\r\n {\r\n id: 8,\r\n label: \"Status\"\r\n },\r\n {\r\n id: 9,\r\n label: \"\"\r\n },\r\n {\r\n id: 10,\r\n label: \"\"\r\n },\r\n {\r\n id: 11,\r\n label: \"\"\r\n }\r\n]\r\nconst OnboardLanding = () => {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n let onboardAccounts = useSelector((state) => state.onboardReducer.onboardAccounts);\r\n const [onboardAccountsData, setOnboardAccountsData] = useState(MOCK_DATA);\r\n const [viewDetailsID, setViewDetailsID] = useState(null);\r\n const [deleteAccountObj, setDeleteAccountObj] = useState()\r\n const accountData = [];\r\n\r\n useEffect(() => {\r\n dispatch(getOnboardAccounts())\r\n }, [dispatch]);\r\n\r\n useEffect(() => {\r\n\r\n }, [])\r\n const [filter, setFilter] = useState('');\r\n const [searchColumns, setSearchColumns] = useState([]);\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n };\r\n const StatusHandleIcon = (status) => {\r\n switch (status) {\r\n case 'Saved': return Edit_Icon;\r\n case 'Submitted': return RequestForReopen_Icon;\r\n case 'Pending': return RequestForDisbaled_Icon;\r\n case 'Re-Open': return Edit_Icon;\r\n case 'Completed': return '';\r\n default: { }\r\n }\r\n }\r\n const StatusHandleText = (status) => {\r\n switch (status) {\r\n case 'Saved':\r\n case 'Re-Open':\r\n return 'Edit Account Details';\r\n case 'Submitted': return 'Request for Re-open';\r\n case 'Pending': return 'Re-open request sent to administrator';\r\n case 'Completed': return '';\r\n default: { }\r\n }\r\n }\r\n const StatusColorHandle = (status) => {\r\n switch (status) {\r\n // case 'Saved': return '#ffbb33';\r\n // case 'Submitted': return '#33b5e5';\r\n case 'Pending': return '#ff4444';\r\n //case 'Re-Open': return '#00695c';\r\n //case 'Completed': return '#00C851';\r\n default: { }\r\n }\r\n }\r\n useEffect(() => {\r\n setOnboardAccountsData((onboardAccounts.statusCode) ? [] : onboardAccounts);\r\n setSearchColumns(['Account Name', 'Site Name', 'Created By'])\r\n }, [onboardAccounts]);\r\n\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n const AccountViewDetailsHandle = (id) => {\r\n let selectedAccount = onboardAccountsData[id - 1];\r\n let temp_arr = {\r\n AccountName: selectedAccount['Account Name'],\r\n SiteName: selectedAccount['Site Name'],\r\n ValidFrom: formatDate(selectedAccount['Valid From']),\r\n ValidTo: formatDate(selectedAccount['Valid To']),\r\n mode: 'view',\r\n }\r\n dispatch(viewAccountDetails(temp_arr))\r\n history.push('/onboardAccount')\r\n }\r\n\r\n\r\n\r\n const [showReuqestModal, setShowRequestModal] = useState(false);\r\n const [showDeleteModal, setShowDeleteModal] = useState(false);\r\n const [showAccountDeletedModal, setShowAccountDeletedModal] = useState(false)\r\n\r\n const AccountEditDetailsHandle = (id, status) => {\r\n setViewDetailsID(id);\r\n let selectedAccount = onboardAccountsData[id - 1];\r\n let temp_arr = {\r\n AccountName: selectedAccount['Account Name'],\r\n SiteName: selectedAccount['Site Name'],\r\n ValidFrom: formatDate(selectedAccount['Valid From']),\r\n ValidTo: formatDate(selectedAccount['Valid To']),\r\n mode: 'edit',\r\n }\r\n let temp_arr2 = {\r\n Account: selectedAccount['Account Name'],\r\n Servicedesk: selectedAccount['Site Name'],\r\n Status: \"Submitted\"\r\n }\r\n\r\n switch (status) {\r\n case 'Re-Open':\r\n case 'Saved': {\r\n dispatch(viewAccountDetails(temp_arr))\r\n history.push('/onboardAccount')\r\n break\r\n }\r\n case 'Completed': { break }\r\n case 'Submitted': {\r\n dispatch(updateReOpenRequestStart(temp_arr2))\r\n dispatch(getOnboardAccounts())\r\n setShowRequestModal(true);\r\n break;\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n const AccountDeleteHandle = (info) => {\r\n let dispObj = {\r\n Customer:info?.['Account Name'],\r\n ServiceDesk:info?.['Site Name']\r\n }\r\n setDeleteAccountObj(dispObj)\r\n setShowDeleteModal(true)\r\n }\r\n const handleYesDeleteAccount = () =>{\r\n setShowDeleteModal(false)\r\n dispatch(updateDeleteAccountStart(deleteAccountObj))\r\n dispatch(getOnboardAccounts())\r\n setShowAccountDeletedModal(true)\r\n }\r\n const handleNoDeleteAccount = () =>{\r\n setShowDeleteModal(false)\r\n }\r\n\r\n const AccountCreateDetails = () => {\r\n\r\n let temp_arr = {}\r\n dispatch(viewAccountDetails(temp_arr))\r\n history.push('/onboardAccount')\r\n }\r\n\r\n const getClientCustID = () => {\r\n return onboardAccounts.CustomerID;\r\n };\r\n\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n return (\r\n\r\n \r\n history.push('/welcome')} label1='Home' isActive2={false} label2='Onboard' />\r\n Onboard
\r\n {(RoleBasedView?.[0]?.AccountOnboard?.[0]?.ReadWrite === 1) ? Onboard New Account
: ''}\r\n \r\n \r\n {searchRows(onboardAccountsData)?.length === 0 ?\r\n \r\n \r\n \r\n \r\n {Headers.map(header => ( {header.label} ))}\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n No records found.
\r\n
\r\n \r\n :\r\n \r\n \r\n \r\n \r\n {Headers.map(header => ( {header.label} ))}\r\n \r\n \r\n \r\n {searchRows(onboardAccountsData).map((info) => (\r\n \r\n {info?.['Account Name']} \r\n {info?.['Site Name']} \r\n {info?.['Created By']} \r\n {formatDate(info?.['Created Date'])} \r\n {formatDate(info?.['Valid From'])} \r\n {formatDate(info?.['Valid To'])} \r\n {info?.Status} \r\n \r\n AccountEditDetailsHandle(info?.RowNo, info?.Status)}>\r\n {info?.Status === 'Completed'? '' : \r\n \r\n \r\n AccountDeleteHandle(info)}>\r\n {info?.Status !== 'Saved'? '' : \r\n \r\n AccountViewDetailsHandle(info?.RowNo)} >\r\n \r\n \r\n ))}\r\n \r\n
\r\n }\r\n \r\n {\r\n showReuqestModal && \r\n index === viewDetailsID)]['Account Name']}\r\n siteName={onboardAccountsData[onboardAccountsData.findIndex((_, index) => index === viewDetailsID)]['Site Name']}\r\n email={onboardAccountsData[onboardAccountsData.findIndex((_, index) => index === viewDetailsID)]['Created By']} requestHeading=\"Request for Re-open\"\r\n onClick={() => {\r\n dispatch(getOnboardAccounts())\r\n setShowRequestModal(false)\r\n }}\r\n />\r\n \r\n }\r\n\r\n {showDeleteModal && \r\n }\r\n\r\n {showAccountDeletedModal && \r\n {setShowAccountDeletedModal(false);dispatch(getOnboardAccounts())}}\r\n />\r\n }\r\n \r\n\r\n )\r\n}\r\n\r\nexport default OnboardLanding","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAABHNCSVQICAgIfAhkiAAAAilJREFUOE+9lEtr1FAUx8+5BgYfVdwWXDjJDBS1CPWx8IEb0U+gUGweFUaKuBH8Gi4EpwiaVwVB/QAu1IXdiCAIXZkmER/gQkGwUChO7vGfdGboYnRCBQPhcifn/OZ/zvnfy9R/HPOBLcw3SegwERMzrTDR7TD1lgYxdVbkEDmW3yVWNmCKSDY2E7kBrhaRKE6963VgVZZjhjYwXRJZY0WXwsRbrv6kFZ4l0Y8RMoF1IcquxnWgbFv+OybVZiUXBrBhGyooPRPSSZzOH60FRLkFVPyMUm//qATHCn4AOhFlnlETGAgCMwCtPwAz/N7E96rf4x6Ggv8DnGtHp42i0Jr5CVRNKpFTf1NXSO97nHcSxjS/YcJfUdL0IMFr+de08B30tmAShRLKcnXfTtgK9txfsSPpwblGQzUOsN2M2mVgnDvJcLpmsAhnXwGsEKFH4/qG2Flg9yiSIyMb7Zj+MoJO7GCZ8lfn8wHQNYOL0DpZaPV8KXc+DQVY/gIUdwE8VBtom/5lZi6PoUatr5WmG2HurVSHYDtAJL0kUmc09WYVGZEQd+LUeVgLiNJeoe0nt5bstX1Ha3Ufl8ZHnO8m5nI8yty3tYCjejg3He9W68VnAHaiT+9xCw2P4rZK3lQSQBFPYTB3o1X31j8NpUzuNO/t2zAax6LEfbHVSmMVuq3gDfw3g6QveH+N9SHRwTIG19+5kbYB8DyATzHJXTB3jVuGP8DY63tpbeY3sZMPXQvoxg4AAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAABHNCSVQICAgIfAhkiAAAAbdJREFUOE/NlL9Kw1AUxs2fClYQHMTJxUWapKMvIIiPYEE6SVWoKDg4+QAOIiJ2KLopOPkATm5Obk3SoYuri1BQA7FJ/J2QSIZq0rp44XJP7znnu98550uViWQ5jtNWFKUeRdGUXGF72NemaW6nMUVORYIAszkMwWFHSWJqu4BaRcBiIsKMsyFArD3LslrisG27CctziVFV9bJSqRRiqriu+yFlsndTsJQNvib3F1K+YRjlIiyFoZQYUZY6LAF/KCzxx+3JWyngJwmTPwD63Jf+H6D0b8DSdb1FH7UgCHZ+K5fBPTODexlKQKBP02P9JTK64dzI61fGL3MQNSwpyGNNHIKeBnDnMFnRpQS6BYBNiSFndejkmGwf/wylrvDQQ+ahI5IWwzC8qlarj5n7W+5rIwHSmjMe2E9A+tibPHYnv6lodEBYv5I7y3BONU07wG4jpXhQYwF2u902pW7BbEBpOnadsmV44wH2er053/dfpPdsD3bfn+JYDBM5vXOWYflE/5b/NBRJ7nQ6C2htHXYnWSkVYfhGwjRbRC9/DnmrlOiwNlSHSOSQso6TfuWBiX8gj3ueN/8FEmgbSsHCm+0AAAAASUVORK5CYII=\"","import React, { useEffect, useRef } from 'react'\r\nimport './Request.css';\r\nimport { useState } from 'react';\r\nimport ReactModal from \"react-modal\";\r\nimport { OnboardSelect } from '../Onboard/OnboardComponents/Dropdown/Select';\r\nimport deleteIcon from '../../assets/images/Delete_Icon.png';\r\nimport DATA from './DATA.json'\r\nimport RequestDropdown from '../Onboard/OnboardComponents/Dropdown/RequestDropdown';\r\nimport DatePickerHandle from '../Onboard/OnboardComponents/KeyboardDatePicker';\r\nimport { useDispatch } from 'react-redux';\r\n\r\n\r\nReactModal.setAppElement('#root')\r\nexport function AdminRequestPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n \r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '10em',\r\n left: '20em',\r\n width: '680px',\r\n height: '500px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n // position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n
\r\n )\r\n}\r\n\r\nexport function AdminRequestModel(props) {\r\n const dispatch = useDispatch();\r\n const [file, setFile] = useState(\"\");\r\n const [error, setError] = useState();\r\n const [datacard, setDatacard] = useState(false);\r\n const [ValidUntil, setValidUntil] = useState(null);\r\n function handleUpload(event) {\r\n event.preventDefault();\r\n const file = event.target.files[0];\r\n if (file && file.size > 1000000) {\r\n setError('Please upload a file less than 1MB');\r\n setFile('');\r\n setDatacard(false);\r\n } else if (file) {\r\n setFile(file);\r\n setError('');\r\n setDatacard(true);\r\n }\r\n }\r\n\r\n function generateRandomId() {\r\n return 'file-' + Math.random().toString(36).substr(2, 9);\r\n }\r\n\r\n const hiddenFileInput = useRef(null);\r\n function deleteHandler() {\r\n setFile('');\r\n setDatacard(false);\r\n props.DeleteUploadedFile()\r\n hiddenFileInput.current.value = null;\r\n }\r\n\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n console.log('mmmmmmmmmmmmmmmmmmmm', props.EditRequestForm)\r\n\r\n useEffect(() => {\r\n if (props.editMode) {\r\n setValidUntil(props.EditRequestForm?.['ValidUntil'])\r\n }\r\n }, [dispatch, props.EditRequestForm, props.editMode])\r\n\r\n const ValidToDateHandler = (date) => {\r\n console.log('date:::::', date)\r\n props.addValueToQueue('ValidUntil', (date === null || date === undefined) ? null : formatDate(date));\r\n setValidUntil((date === null || date === undefined) ? null : formatDate(date));\r\n\r\n }\r\n\r\n useEffect(() => {\r\n props.dispatchFileUpload(file);\r\n props.dispatchFileName(file.name)\r\n }, [file, props])\r\n\r\n return (\r\n <>\r\n \r\n \r\n
{props.EditRequestForm.title}
\r\n
{props.validation}
\r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\n\r\nexport const UserReuqestModal = (props) => {\r\n const dispatch = useDispatch();\r\n const [file, setFile] = useState(\"\");\r\n const [error, setError] = useState();\r\n const [datacard, setDatacard] = useState(false);\r\n const [ValidUntil, setValidUntil] = useState(null);\r\n const editMode = props.editMode\r\n function handleUpload(event) {\r\n event.preventDefault();\r\n const file = event.target.files[0];\r\n if (file && file.size > 1000000) {\r\n setError('Please upload a file less than 1MB');\r\n setFile('');\r\n setDatacard(false);\r\n } else if (file) {\r\n setFile(file);\r\n setError('');\r\n setDatacard(true);\r\n }\r\n }\r\n\r\n function generateRandomId() {\r\n return 'file-' + Math.random().toString(36).substr(2, 9);\r\n }\r\n\r\n const hiddenFileInput = useRef(null);\r\n function deleteHandler() {\r\n setFile('');\r\n setDatacard(false);\r\n props.DeleteUploadedFile()\r\n hiddenFileInput.current.value = null;\r\n }\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n console.log('mmmmmmmmmmmmmmmmmmmm', props.EditRequestForm)\r\n\r\n useEffect(() => {\r\n if (editMode) {\r\n setValidUntil(props.EditRequestForm?.['ValidUntil'])\r\n }\r\n }, [dispatch, props.EditRequestForm, editMode])\r\n\r\n const ValidToDateHandler = (date) => {\r\n console.log('date:::::', date)\r\n props.addValueToQueue('ValidUntil', (date === null || date === undefined) ? null : formatDate(date));\r\n setValidUntil((date === null || date === undefined) ? null : formatDate(date));\r\n\r\n }\r\n useEffect(() => {\r\n props.dispatchFileUpload(file);\r\n props.dispatchFileName(file.name)\r\n }, [file, props])\r\n\r\n return (\r\n <>\r\n \r\n \r\n
{editMode ? 'Edit' : 'Add'} Request / Incident
\r\n
{props.validation}
\r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nexport default UserReuqestModal","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAPCAYAAAARZmTlAAAABHNCSVQICAgIfAhkiAAAAK1JREFUOE+l1NENhCAMBuDWXZzjRjmYTBzl5rjcKiIlB0EEWiwvRiX/RwkFIQyzbsYf8Np/1tK7dtR5GD942GKwB6eFWnmEuIC88+oV0AUIgYiwu681+N8uNdQDKD8iWmgEXJCnEAfckFlIAjQRKSQFuggHzQBDpAfhAp/cV8UxHTVwPl29Sbc+KiamPuBuCBZpViSsIOEipIakFUwjCaInXRXcFpX/xZXMhNZzTysFqhDtyBtDAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAPCAYAAAARZmTlAAAABHNCSVQICAgIfAhkiAAAAL5JREFUOE+t1MsRwiAQBuB/rcASvHi3A+1EqAzSkZ4dZyzBApxglhHyEMluIhcyw5KPXR4ERTN7Z0KLY3O3VjENJA2OQICL8QFeA4mQEZBWpYBmkSKghKrIFAjAdUO4dGU75zILMvqJFIEXTv5hn92Y10BFpAakDDTQFyIBtNAI0QAaKCNLACkUkTWABKJ/AHMQI/k4xnvwOabS52YaN/wfERp/syaVy7cBh7XAMCP+ZoD7fuN3bssXbWkGtXlvv3fKEGllk60AAAAASUVORK5CYII=\"","import React, { useEffect, useState } from 'react'\r\nimport Expand_DownArrow from './../../assets/onboard-images/Expand_DownArrow.png';\r\nimport Collapse_UpArrow from './../../assets/onboard-images/Collapse_UpArrow.png';\r\nimport Edit_Icon from './../../assets/onboard-images/Edit_Icon.png';\r\n\r\n\r\nfunction RequestTableHandle({ info, HandleEditRequestClick }) {\r\n\r\n const [ID,SetID] = useState();\r\n const urlfile = `${process.env.REACT_APP_BASE_URL}/api/file/${ID}`\r\n\r\n useEffect(()=>{\r\n if(ID){\r\n window.open(urlfile);\r\n }\r\n },[ID,urlfile])\r\n \r\n\r\n const [showAccordion, setShowAccordion] = useState(false);\r\n function RequestDateFormat(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n}\r\n return (<>\r\n \r\n {info?.['Request / Incident Title']} \r\n {RequestDateFormat(info?.['Created Date'])} \r\n {info?.Type} \r\n {info?.Status} \r\n \r\n {info?.Status === 'Completed' || info?.View === 0 ? '' : \r\n \r\n {info?.View === 0 ? '' : \r\n \r\n\r\n {(showAccordion) &&\r\n \r\n \r\n \r\n Last Updated Date \r\n Comments \r\n File Attachments \r\n
\r\n \r\n {info?.UserComments?.map((update, i) => (\r\n \r\n
\r\n {RequestDateFormat(update?.['Last Updated Date'])} \r\n {update.Comments} \r\n {SetID(update.FileStore)}} style={{ width: '30%', color: '#5F249F', textDecoration: 'underline',cursor: 'pointer' }}>{update.FileName} \r\n
\r\n ))}\r\n
\r\n \r\n
{update.Comments}
\r\n
\r\n
\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default RequestTableHandle","export const request_actionTypes = {\r\n GET_REQUEST_DATA: \"GET_REQUEST_DATA\",\r\n REQUEST_DATA: \"REQUEST_DATA\",\r\n\r\n UPDATE_NEW_REQUEST_START: \"UPDATE_NEW_REQUEST_START\",\r\n UPDATE_NEW_REQUEST_SUCCESS: \"UPDATE_NEW_REQUEST_SUCCESS\",\r\n\r\n UPDATE_EDIT_REQUEST_START: \"UPDATE_EDIT_REQUEST_START\",\r\n UPDATE_EDIT_REQUEST_SUCCESS: \"UPDATE_EDIT_REQUEST_SUCCESS\",\r\n\r\n GET_ADMIN_REQUEST_DATA: \"GET_ADMIN_REQUEST_DATA\",\r\n ADMIN_REQUEST_DATA: \"ADMIN_REQUEST_DATA\",\r\n\r\n UPDATE_EDIT_ADMIN_REQUEST_START: \"UPDATE_EDIT_ADMIN_REQUEST_START\",\r\n UPDATE_EDIT_ADMIN_REQUEST_SUCCESS: \"UPDATE_EDIT_ADMIN_REQUEST_SUCCESS\",\r\n\r\n GET_REQUEST_DROPDOWN_DATA: \"GET_REQUEST_DROPDOWN_DATA\",\r\n REQUEST_DROPDOWN_DATA: \"REQUEST_DROPDOWN_DATA\",\r\n\r\n GET_UPLOADED_FILE_DATA: \"GET_UPLOADED_FILE_DATA\",\r\n UPLOADED_FILE_DATA: \"UPLOADED_FILE_DATA\",\r\n}\r\n","import { request_actionTypes as actionTypes} from './../constants/request-actionTypes';\r\n\r\nexport const getRequestData = (date, requesttype, status) => (\r\n {\r\n type: actionTypes.GET_REQUEST_DATA,\r\n date: date,\r\n requesttype: requesttype,\r\n status: status\r\n }\r\n )\r\n\r\n export const updateNewRequestStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_NEW_REQUEST_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n export const updateNewRequestSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_NEW_REQUEST_SUCCESS,\r\n }\r\n )\r\n\r\n export const updateEditRequestStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_EDIT_REQUEST_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n export const updateEditRequestSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_EDIT_REQUEST_SUCCESS,\r\n }\r\n )\r\n\r\n export const getAdminRequestData = (date, requesttype, status) => (\r\n {\r\n type: actionTypes.GET_ADMIN_REQUEST_DATA,\r\n date: date,\r\n requesttype: requesttype,\r\n status: status\r\n }\r\n )\r\n\r\n // export const getAdminRequestData = (data) => (\r\n // {\r\n // type: actionTypes.GET_ADMIN_REQUEST_DATA,\r\n // payload: data,\r\n // }\r\n // )\r\n \r\n export const updateEditAdminRequestStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_EDIT_ADMIN_REQUEST_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n \r\n export const updateEditAdminRequestSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_EDIT_ADMIN_REQUEST_SUCCESS,\r\n }\r\n )\r\n\r\n export const getRequestDropdownData = (data) => (\r\n {\r\n type: actionTypes.GET_REQUEST_DROPDOWN_DATA,\r\n payload: data,\r\n }\r\n )\r\n\r\n export const getUplodedFileData = (uploadfileid) => (\r\n {\r\n type: actionTypes.GET_UPLOADED_FILE_DATA,\r\n uploadfileid: uploadfileid\r\n }\r\n )","import React, { Fragment, useEffect } from 'react'\r\nimport { useState } from 'react';\r\nimport { ModalAccountPopup } from '../Onboard/OnboardComponents/Modals/ModalQueuePopup';\r\nimport searchIcon from './../../assets/onboard-images/Search_Icon.png';\r\nimport './Request.css';\r\nimport UserReuqestModal from './RequestModals';\r\nimport AdminBreadcrumb from '../Administration/General/Admin-breadcrumb';\r\nimport filterIcon from '../../assets/images/Filter_Icon.png';\r\nimport RefreshIcon from '../../assets/images/Reset_Icon.png';\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\nimport Button from './../ReportTables/ReportFilters/Button';\r\nimport DATA from './DATA.json';\r\nimport RequestTableHandle from './RequestTableHandle';\r\nimport '../Administration/SLA-Administration/SLA-Admin.css';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getUserData } from '../../actions/user.action';\r\nimport RequestDropdown from '../Onboard/OnboardComponents/Dropdown/RequestDropdown';\r\nimport { getRequestData, getRequestDropdownData, updateEditRequestStart, updateNewRequestStart } from './../../actions/request.action';\r\nimport { useHistory } from 'react-router-dom';\r\nimport axios from 'axios';\r\n\r\n\r\nconst RequestIncidentMain = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let RequestData = useSelector((state) => state.requestReducer.RequestData);\r\n let RequestDropdownData = useSelector((state) => state.requestReducer.RequestDropdownData);\r\n useEffect(() => {\r\n dispatch(getUserData());\r\n dispatch(getRequestData('', '', ''));\r\n dispatch(getRequestDropdownData());\r\n }, [dispatch]);\r\n const [RequestIncidentData, setRequestIncidentData] = useState([])\r\n const [showAddRequestModel, setShowAddRequestModel] = useState(false);\r\n const [showEditRequestModal, setShowEditRequestModal] = useState(false);\r\n const [filter, setFilter] = useState('');\r\n const [updatedFileData, setUpdatedFileData] = useState()\r\n const [searchColumns, setSearchColumns] = useState(['Request / Incident Title']);\r\n const [reuqestDate, setRequestDate] = useState(new Date(''));\r\n function RequestDateFormat(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n\r\n useEffect(() => {\r\n setRequestIncidentData((RequestData.statusCode) ? [] : RequestData)\r\n }, [RequestData])\r\n\r\n\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n }\r\n\r\n const [AddRequestForm, setAddRequestForm] = useState({});\r\n const [editRequestID, setEditRequestID] = useState(null);\r\n const [EditRequestForm, setEditrequestForm] = useState();\r\n\r\n\r\n const [validation, setValidation] = useState('');\r\n const addValueToRequest = (name, value) => {\r\n const newFormData = { ...AddRequestForm };\r\n if (name !== 'Select') {\r\n newFormData[name] = value;\r\n setAddRequestForm(newFormData)\r\n }\r\n }\r\n\r\n const handleUserAddRequest = (event) => {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n if (fieldValue !== 'Select') {\r\n const newFormData = { ...AddRequestForm };\r\n newFormData[fieldName] = fieldValue;\r\n setAddRequestForm(newFormData)\r\n }\r\n }\r\n\r\n function formatDate() {\r\n var d = new Date(),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n };\r\n function formatTime() {\r\n return new Date().getHours() + ':' + new Date().getMinutes() + ':' + new Date().getSeconds();\r\n }\r\n\r\nconst[uploadedFileId,setUploadedFileId] = useState();\r\nconst[uploadedFileName,setUploadedFileName] = useState()\r\nuseEffect(()=>{\r\n if(updatedFileData){\r\n const formData = new FormData();\r\n\r\n formData.append('File', updatedFileData);\r\n\r\n fetch(\r\n `${\r\n process.env.REACT_APP_BASE_URL\r\n }/api/file`,\r\n {\r\n method: 'POST',\r\n body: formData,\r\n }\r\n )\r\n .then((response) => response.json())\r\n .then((result) => {\r\n console.log('Success:', result);\r\n setUploadedFileId(result.id);\r\n })\r\n .catch((error) => {\r\n console.error('Error:', error);\r\n });\r\n\r\n }\r\n},[updatedFileData]) \r\n\r\nconst deleteFile = async (fileId) => {\r\n try {\r\n const response = await axios.delete(`/api/file/${fileId}`);\r\n if (response.status === 200) {\r\n setUploadedFileId(null);\r\n setUploadedFileName(null)\r\n } else {\r\n alert('file not deleted')\r\n }\r\n } catch (error) {\r\n // Handle error.\r\n }\r\n };\r\n \r\nconst DeleteUploadedFile = () =>{\r\n deleteFile(uploadedFileId);\r\n }\r\n \r\n console.log('uploadedFileId',uploadedFileId,uploadedFileName)\r\n\r\n const handleRequestFormSubmit = event => {\r\n event.preventDefault();\r\n console.log(AddRequestForm);\r\n const temp_details = {\r\n\r\n id: RequestIncidentData?.length + 1,\r\n 'Request / Incident Title': AddRequestForm.title,\r\n 'Created Date': formatDate(),\r\n Type: AddRequestForm.type,\r\n Status: 'New',\r\n\r\n }\r\n let temp_updates = {\r\n UserComments: [{\r\n 'Last Updated Date': `${formatDate()}, ${formatTime()}`,\r\n Comments: AddRequestForm.comments,\r\n FileStore: uploadedFileId,\r\n FileName: uploadedFileName\r\n }]\r\n }\r\n\r\n\r\n const newRequest = Object.assign(temp_details, temp_updates)\r\n const newRequests = [newRequest, ...RequestIncidentData]\r\n const temp_Arr = {\r\n type: AddRequestForm.type,\r\n title: AddRequestForm.title,\r\n comments: AddRequestForm.comments\r\n }\r\n let dispatchObj = {\r\n Title: AddRequestForm.title,\r\n Type: AddRequestForm.type,\r\n Status: 'New',\r\n Comments: AddRequestForm.comments,\r\n FileStore: uploadedFileId,\r\n FileName: uploadedFileName\r\n }\r\n const isEmptyInput = Object.values(temp_Arr).some(x => (x === null || x === '' || x === undefined));\r\n if (isEmptyInput) {\r\n setShowAddRequestModel(true);\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else {\r\n setRequestIncidentData(newRequests)\r\n setShowAddRequestModel(false);\r\n dispatch(updateNewRequestStart(dispatchObj))\r\n setValidation('')\r\n }\r\n }\r\n const handleRequestFormCancel = event => {\r\n event.preventDefault();\r\n setShowAddRequestModel(false);\r\n setValidation('')\r\n }\r\nconst [CompleteTask,setCompleteTask] = useState('')\r\n const HandleEditRequestClick = (info) => {\r\n setEditRequestID(info.IncidentID)\r\n setShowEditRequestModal(true)\r\n const formValues = {\r\n type: info?.Type,\r\n status: info?.Status,\r\n title: info?.['Request / Incident Title'],\r\n createdDate: info?.['Created Date'],\r\n comments: '',\r\n file: info?.FileStore,\r\n UserDetails: info?.TaskDetails?.[0]?.UserDetails,\r\n ValidUntil: info?.TaskDetails?.[0]?.ValidUntil,\r\n };\r\n console.log('formValues', formValues)\r\n setEditrequestForm(formValues);\r\n setCompleteTask(info?.TaskDetails?.[0]?.ValidUntil)\r\n }\r\n\r\n // console.log('CompleteTask2',CompleteTask,EditRequestForm?.ValidUntil)\r\n\r\n const onClickSelect = (name) => {\r\n const newFormData = { ...EditRequestForm };\r\n newFormData[name] = '';\r\n setEditrequestForm(newFormData)\r\n\r\n }\r\n\r\n const editValueToRequest = (name, value) => {\r\n const newFormData = { ...EditRequestForm };\r\n if (value !== 'Select') {\r\n newFormData[name] = value;\r\n setEditrequestForm(newFormData);\r\n }\r\n }\r\n const handleUserEditRequest = event => {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...EditRequestForm };\r\n newFormData[fieldName] = fieldValue;\r\n setEditrequestForm(newFormData);\r\n }\r\n console.log('CompleteTask',formatDate(CompleteTask),(EditRequestForm?.ValidUntil))\r\n console.log('EditRequestForm:::', EditRequestForm)\r\n // submit\r\n const handleRequesEditSubmit = event => {\r\n event.preventDefault();\r\n const temp_details = {\r\n IncidentID: editRequestID,\r\n 'Request / Incident Title': EditRequestForm.title,\r\n 'Created Date': formatDate(EditRequestForm.createdDate),\r\n Type: EditRequestForm.type,\r\n Status: EditRequestForm.status,\r\n TaskDetails: [\r\n {\r\n UserDetails: EditRequestForm.UserDetails,\r\n ValidUntil: EditRequestForm.ValidUntil\r\n }\r\n ]\r\n }\r\n let temp_updates = {\r\n 'Last Updated Date': `${formatDate()}, ${formatTime()}`,\r\n Comments: EditRequestForm.comments,\r\n FileStore: uploadedFileId,\r\n FileName: uploadedFileName\r\n }\r\n const dispatchEditObj = {\r\n Title: EditRequestForm.title,\r\n Type: EditRequestForm.type,\r\n Status: EditRequestForm.status,\r\n Comments: EditRequestForm.comments,\r\n IncidentID: editRequestID,\r\n ValidUntil: EditRequestForm.ValidUntil,\r\n FileStore: uploadedFileId,\r\n FileName: uploadedFileName\r\n }\r\n const newRequests = [...RequestIncidentData];\r\n const temp_Arr = {\r\n status: EditRequestForm.status,\r\n comments: EditRequestForm.comments\r\n }\r\n const isEmptyInput = Object.values(temp_Arr).some(x => (x === null || x === '' || x === undefined));\r\n console.log('CompleteTask',formatDate(CompleteTask),formatDate(EditRequestForm.ValidUntil))\r\n if (isEmptyInput) {\r\n setShowEditRequestModal(true);\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else if(EditRequestForm.type === 'Task' && EditRequestForm.status !== 'Completed'){\r\n setShowEditRequestModal(true);\r\n setValidation('Please Ensure that Status Selected is set to Completed to Update the Role Validity')\r\n }\r\n else {\r\n const index = RequestIncidentData.findIndex((data, index) => data.IncidentID === editRequestID);\r\n let editedRequestUpdates = newRequests[index]?.UserComments;\r\n editedRequestUpdates.unshift(temp_updates)\r\n let obj2 = { UserComments: editedRequestUpdates }\r\n let adminRequestUpdates = newRequests[index]?.AdminComments;\r\n let admindata = { AdminComments: adminRequestUpdates }\r\n const newRequest = Object.assign(temp_details, obj2, admindata)\r\n newRequests[index] = newRequest;\r\n setRequestIncidentData(newRequests);\r\n dispatch(updateEditRequestStart(dispatchEditObj))\r\n setEditRequestID(null);\r\n setShowEditRequestModal(false)\r\n setValidation(''); \r\n }\r\n }\r\n\r\n console.log('RequestIncidentData', RequestIncidentData)\r\n const handleRequestEditCancel = event => {\r\n event.preventDefault();\r\n setEditRequestID(null);\r\n setShowEditRequestModal(false);\r\n setValidation('')\r\n }\r\n\r\n\r\n\r\n const [filterSelected, setFilterSelected] = useState('');\r\n const [statusSelected, setStatusSelected] = useState('');\r\n const [selectedType, setSelectedType] = useState('')\r\n const [isRefreshClicked, setIsRefreshedClicked] = useState(false);\r\n\r\n\r\n useEffect(() => {\r\n if (filterSelected || statusSelected || selectedType) {\r\n dispatch(getRequestData(filterSelected ? filterSelected : '', selectedType ? selectedType : '', statusSelected ? statusSelected : ''));\r\n }\r\n }, [dispatch, filterSelected, selectedType, statusSelected]);\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n history.push('/welcome')} label1='Home' isActive1={false} label2='Requests' />\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n {DATA.UserHeader.map(data => ({data.value} ))} \r\n \r\n {searchRows(RequestIncidentData)?.map((info, i) =>\r\n\r\n \r\n
\r\n \r\n \r\n \r\n\r\n \r\n\r\n {showAddRequestModel && \r\n { }}\r\n EditRequestForm={EditRequestForm} validation={validation} dispatchFileUpload={data =>\r\n setUpdatedFileData(data)} dispatchFileName={data => setUploadedFileName(data)} DeleteUploadedFile={DeleteUploadedFile}\r\n />\r\n \r\n }\r\n {showEditRequestModal && \r\n \r\n setUpdatedFileData(data)} dispatchFileName={data => setUploadedFileName(data)} DeleteUploadedFile={DeleteUploadedFile}\r\n\r\n />\r\n \r\n }\r\n\r\n\r\n \r\n )\r\n}\r\n\r\nexport default RequestIncidentMain","export default __webpack_public_path__ + \"static/media/WhyGSDInsight_HeroBanner.780e851d.png\";","export default __webpack_public_path__ + \"static/media/CentralisedData_Image.6f6702d8.png\";","export default __webpack_public_path__ + \"static/media/Availability_Image.c5c77f39.png\";","export default __webpack_public_path__ + \"static/media/Customisation_Image.c97a6fea.png\";","export default __webpack_public_path__ + \"static/media/EasytoAccess_Image.411721cd.png\";","export default __webpack_public_path__ + \"static/media/Presentation_Image.3bf080cf.png\";","export default __webpack_public_path__ + \"static/media/TopDownBottomUp_Image.0a505262.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAKCAYAAAC9vt6cAAAABHNCSVQICAgIfAhkiAAAAIVJREFUKFNjZGBgMADifiAOBOIPQEwMSAAqsgfiREYgcQDKuQCkHYkwBKR5PtQWR5ABAlBD9IE0IUOQNScC1S8AGQACxBiCoRmkEWYAIUOwakY3AJchAUh+BjsbOZSRXQATR/bOA6CgAlQCQzM2F2AzBCSGVTM+A5C9MwHd2YS8gCxPkA0AiL8hS9zg6I4AAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAKCAYAAAC9vt6cAAAABHNCSVQICAgIfAhkiAAAAIVJREFUKFNjZMANBIBS64G4EIgv4FLGiEMCpHk/EBsA8QcgdsRlCDYDkDXDzMdpCLoByJo/AnU7AHEBEMfjcgmyAdg0w/y+AJchMAPwaYZ5A6shIAOI0YzTEJABB4DYHohhfsYZZVBTkF1iCDIAFFUbgDgAX3yjRTfIEBBIwJUO0NTj5gIA8BAnK5HMCycAAAAASUVORK5CYII=\"","export default __webpack_public_path__ + \"static/media/Incidents_Image.2b8589d9.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAABHNCSVQICAgIfAhkiAAAAQBJREFUOE+N1LESgjAMAFDCr7l65zfIBsy6qrOrwKa/oD/goB/liElpetCmJL1TuNI+kjYFCt/6vr/j7bdpmgf3adeu6840pm1bdwX689DeT64sIEEAcKI54zheCIQI4mBWwTnEEwgkjCKiFOMmghLkUgTYcJomMAP9ENrWdf12mF+3VVCDwgZoIL75hWuyi9YhRMT9ITIN1KAkMiOYRJSNjB8Mw/AUUqPHV6zDo7D7U9HGLbf9s3Fi2SSYAWIzARdYbvtx9g1/ByGJBRgwrY4sJ8VhGmTYZRchWCELKGHZOlLAKkmTTj8dWqlk5n3RGk5p8gBKtyzLjwWKIiz4Y/oH2/CpoDuuRCUAAAAASUVORK5CYII=\"","export default __webpack_public_path__ + \"static/media/Email_HeroImage.876e7e0e.png\";","import ReactModal from \"react-modal\";\r\nimport Incidents_Image from './../../../assets/github-images/Incidents_Image.png';\r\nimport WindowClose_Icon from './../../../assets/github-images/WindowClose_Icon.png';\r\nimport Email_HeroImage from './../../../assets/github-images/Email_HeroImage.png';\r\n\r\nimport { useHistory } from 'react-router-dom';\r\nimport { Link } from 'react-router-dom';\r\n\r\nexport function RequestTab(props) {\r\n const history =useHistory();\r\n return <>\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n
Incidents / Requests
Create an incident record to \r\n document a deviation from an expected standard of operation or alternatively submit a request to flag \r\n other types of problems or proposals related to GSD Insight Platform. Click on the create button \r\n to open Incident / Request section.This formal process enables dialogue between the submitter and \r\n the assigned engineer, provides an audit trail, and a mechanism for prioritization and tracking.\r\n
CREATE NOW \r\n
\r\n
\r\n \r\n \r\n}\r\n\r\nexport function EmailTab(props) {\r\n const history =useHistory();\r\n return <>\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n
Email
For Incidents / Requests please click on the following link.
\r\n
CREATE NOW \r\n
For any other Queries / Suggestions feel free to contact us via email.
\r\n
EMAIL US \r\n
\r\n
\r\n \r\n \r\n}\r\n\r\n\r\nexport function RequestTabPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '25%',\r\n left: '25%',\r\n width: '760px',\r\n height: '450px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\nexport function VideoModelPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n \r\n background: ' #63666A66 0% 0% no-repeat padding-box',\r\n opacity: '1',\r\n \r\n },\r\n content: {\r\n top: '50%',\r\n left: '50%',\r\n right: 'auto',\r\n bottom: 'auto',\r\n marginRight: '-30%',\r\n transform: 'translate(-50%, -50%)',\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}","import React from 'react'\r\nimport GSDInsight_Logo from './../../assets/images/GSDInsight_Logo.png';\r\nimport DXC_Logo_Footer_Normal from './../../assets/images/DXC_Logo_Footer_Normal.png';\r\nimport Menu_DownArrow from './../../assets/images/Menu_DownArrow.png';\r\nimport Menu_UpArrow from './../../assets/images/Menu_UpArrow.png';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useState } from 'react';\r\nimport { useRef } from 'react';\r\nimport { useEffect } from 'react';\r\nimport { EmailTab, RequestTab, RequestTabPopup } from './GitHub_LandingPage/Models';\r\nimport { Link } from 'react-router-dom';\r\nexport function GithubHeader() {\r\n const history = useHistory();\r\n const [solution,setSolution] = useState(false);\r\n const dropDownref = useRef();\r\n useEffect(() => {\r\n const handleClickOutside = (event) => {\r\n if (dropDownref.current && !dropDownref.current.contains(event.target)) {\r\n if (!solution)\r\n setSolution(solution);\r\n }\r\n }\r\n document.addEventListener(\"click\", handleClickOutside);\r\n return () => {\r\n document.removeEventListener(\"click\", handleClickOutside);\r\n };\r\n }, [dropDownref]);\r\n\r\n return (\r\n <>\r\n \r\n history.push(\"/githublanding\")}>
GSD Insight
\r\n history.push(\"/whygsd\")}>Why GSD Insight
\r\n setSolution(!solution)} ref={dropDownref}>Solution \r\n
history.push(\"/getstarted\")}> Get Started
\r\n {solution && \r\n
history.push(\"/architecture\")}>Architecture
\r\n
history.push(\"/product\")}>Product Requirements
\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\n\r\nconst CONTACT = [\r\n {\r\n id: 1,\r\n href: \"mailto:GSD_Insight_Support@dxc.com\",\r\n name: 'Email'\r\n },\r\n {\r\n id: 2,\r\n href: \"https://teams.microsoft.com/l/team/19%3aI-wF3DALEKei_jMiwPbiE4IDvpni3HCHbbZajBRyNk81%40thread.tacv2/conversations?groupId=b47fd5cb-2b61-4939-9254-7be4518dd717&tenantId=93f33571-550f-43cf-b09f-cd331338d086\",\r\n name: ' MS Teams'\r\n }\r\n]\r\nconst WHY_GSD = [\r\n {\r\n id: 1,\r\n href: \"/architecture\",\r\n name: 'SOLUTION'\r\n },\r\n {\r\n id: 2,\r\n href: '/getstarted',\r\n name: 'GET STARTED'\r\n },\r\n {\r\n id: 3,\r\n href: \"/developer\",\r\n name: 'DEVELOPER'\r\n },\r\n {\r\n id: 4,\r\n href: \"/security\",\r\n name: 'SECURITY'\r\n },\r\n {\r\n id: 5,\r\n href: \"/user\",\r\n name: 'USER'\r\n },\r\n {\r\n id: 6,\r\n href: \"/training\",\r\n name: 'TRAINING'\r\n }\r\n \r\n]\r\nconst PRODUCTS = [\r\n {\r\n id: 1,\r\n href: \"/overview\",\r\n name: 'Overview'\r\n },\r\n {\r\n id: 2,\r\n href: \"/design\",\r\n name: 'Design'\r\n },\r\n {\r\n id: 3,\r\n href: \"/features\",\r\n name: 'Features'\r\n }\r\n]\r\nconst RELEASES = [\r\n {\r\n id: 1,\r\n href: \"/welcome/release\",\r\n name: 'What’s New '\r\n },\r\n {\r\n id: 2,\r\n href: \"/welcome/release\",\r\n name: 'Upcoming Releases'\r\n }\r\n]\r\nconst SUPPORT = [\r\n {\r\n id: 1,\r\n href: \"/notinproduction\",\r\n name: 'Incidents / Requests'\r\n },\r\n {\r\n id: 2,\r\n href: \"/notinproduction\",\r\n name: 'FAQ'\r\n }\r\n]\r\nexport function Footer() {\r\n const history = useHistory();\r\n const [showRequestModel, setShowRequestModel] = useState(false);\r\n const [showEmailModel, setShowEmailModel] = useState(false);\r\n return (\r\n <>\r\n \r\n \r\n\r\n \r\n\r\n\r\n {showRequestModel && \r\n setShowRequestModel(false)}\r\n />\r\n }\r\n\r\n {showEmailModel && \r\n setShowEmailModel(false)}\r\n />\r\n }\r\n \r\n )\r\n}\r\n\r\n\r\n\r\n","import React from 'react'\r\nimport './../GitHub/GitHub_LandingPage/GitHubPage.css';\r\nimport AdminBreadcrumb from '../Administration/General/Admin-breadcrumb'\r\nimport WhyGSDInsight_HeroBanner from './../../assets/images/WhyGSDInsight_HeroBanner.png';\r\nimport CentralisedData_Image from './../../assets/images/CentralisedData_Image.png';\r\nimport Availability_Image from './../../assets/images/Availability_Image.png';\r\nimport Customisation_Image from './../../assets/images/Customisation_Image.png';\r\nimport EasytoAccess_Image from './../../assets/images/EasytoAccess_Image.png';\r\nimport Presentation_Image from './../../assets/images/Presentation_Image.png';\r\nimport TopDownBottomUp_Image from './../../assets/images/TopDownBottomUp_Image.png';\r\nimport AgentScorecard_Icon from './../../assets/images/AgentScorecard_Icon.png';\r\nimport SupervisorDashboard_Icon from './../../assets/images/SupervisorDashboard_Icon.png';\r\nimport SiteLevel_Icon from './../../assets/images/SiteLevel_Icon.png';\r\nimport GlobalKPI_Icon from './../../assets/images/GlobalKPI_Icon.png';\r\nimport TrendAnalysis_Icon from './../../assets/images/TrendAnalysis_Icon.png';\r\nimport RoleBasedAccess_Icon from './../../assets/images/RoleBasedAccess_Icon.png';\r\nimport PreviousArrow_Disabled_Icon from './../../assets/images/PreviousArrow_Disabled_Icon.png';\r\nimport PreviousArrow_Icon from './../../assets/images/PreviousArrow_Icon.png';\r\nimport NextArrow_Disabled_Icon from './../../assets/images/NextArrow_Disabled_Icon.png';\r\nimport NextArrow_Icon from './../../assets/images/NextArrow_Icon.png';\r\nimport { useState } from 'react';\r\nimport { Footer} from './HeaderFooter';\r\nimport { useHistory } from 'react-router-dom';\r\nconst WhyGsd = () => {\r\n const history = useHistory();\r\n const [row1, setRow1] = useState(true);\r\n const [row2, setRow2] = useState(false);\r\n const previousHandler = () => {\r\n setRow1(true);\r\n setRow2(false);\r\n }\r\n const nexthandler = () => {\r\n setRow1(false);\r\n setRow2(true);\r\n }\r\n const column1 = [\r\n {\r\n id: 1,\r\n imageSrc: CentralisedData_Image,\r\n name: 'Centralised Data',\r\n description: 'The unique platform integrating all of your data from multiple channels, supported by fully or semi-automated mechanisms. Secure your data in a modernised, state of the art solution developed by the Global Service Desk organisation.'\r\n },\r\n {\r\n id: 2,\r\n imageSrc: Availability_Image,\r\n name: 'Availability',\r\n description: 'Time or geography creates no boundaries in getting the data available to you anytime, anywhere. Reporting services with ‘round the clock’ accessibility for constant control and use of data.'\r\n },\r\n {\r\n id: 3,\r\n imageSrc: Customisation_Image,\r\n name: 'Customization',\r\n description: 'GSD Insight enables the user to tailor their needs with personalised reporting views and metrics.'\r\n }\r\n ]\r\n const column2 = [\r\n {\r\n id: 1,\r\n imageSrc: EasytoAccess_Image,\r\n name: 'Easy to Access',\r\n description: 'Simplified steps to define your role and Account information, you are just one click away from GSD Insight experience. The platform is straightforward to use, intuitive navigation through the site will help to find the searched content effortlessly.'\r\n },\r\n {\r\n id: 2,\r\n imageSrc: Presentation_Image,\r\n name: 'Presentation Format & Downloadable Content',\r\n description: 'A very modern GSD Insight interface offers exclusive presentation format and user-friendly downloadable content.'\r\n },\r\n {\r\n id: 3,\r\n imageSrc: TopDownBottomUp_Image,\r\n name: 'Top Down – Bottom Up',\r\n description: 'Data driven approach delivering detailed and high level, cumulated representation to oversee all layers of operational performance.'\r\n }\r\n ]\r\n const score_card = [\r\n {\r\n id: 1,\r\n imageSrc: AgentScorecard_Icon,\r\n description: 'Agent Score Card for monthly agent performance assessment.'\r\n },\r\n {\r\n id: 2,\r\n imageSrc: SupervisorDashboard_Icon,\r\n description: 'Supervisor Dashboard for desk managers to manage client contractual performance.'\r\n },\r\n {\r\n id: 3,\r\n imageSrc: SiteLevel_Icon,\r\n description: 'Site level balanced scorecard and operational metrices across accounts served (Views dissected by Account / Language / Channel / P&L Region).'\r\n }\r\n ]\r\n const global_KPI = [\r\n {\r\n id: 1,\r\n imageSrc: GlobalKPI_Icon,\r\n description: 'Global KPI / Metrices and key indices.'\r\n },\r\n {\r\n id: 2,\r\n imageSrc: TrendAnalysis_Icon,\r\n description: 'Trend analytics across time.'\r\n },\r\n {\r\n id: 3,\r\n imageSrc: RoleBasedAccess_Icon,\r\n description: 'Non-functional Role Based Access / Reports / compliance with applicable legislation.'\r\n }\r\n ]\r\n\r\n return (\r\n <>\r\n \r\n \r\n
history.push('/githublanding')} label1='Home' isActive2={false} label2='Why GSD Insight' />\r\n \r\n \r\n
\r\n
\r\n
Why GSD Insight
\r\n
GSD Insight brings all relevant data together from various sources and visualises it to enable data-driven analytics and reporting.
\r\n
\r\n
Why GSD Insight
\r\n
GSD Insight brings all relevant data together from various sources and visualises it to enable data-driven analytics and reporting.
\r\n
\r\n \r\n
\r\n Customer Centric System
\r\n \r\n {row1 &&
{column1.map((data, index) =>\r\n \r\n {data.name}
{data.description}
)}\r\n }\r\n {row2 &&
{column2.map((data, index) =>\r\n \r\n {data.name}
{data.description}
)}\r\n }\r\n
\r\n {row1 ? {row1 ? 1 : 2}/2 \r\n {row1 ? \r\n \r\n
{score_card.map((data, index) =>\r\n {data.description}
\r\n
{global_KPI.map((data, index) =>\r\n {data.description}
\r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default WhyGsd","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAABHNCSVQICAgIfAhkiAAAA5xJREFUeF7tW9FxEzEQzVUAqYCkAqACnApIKsCpgFAB5o8/SAVcKiAd4FRAUgFHBSQVmPeOXY/usHSSIk8kW5rxeO5uV973tFrt6uTmIHFbrVbX6PJtYLfLpmlOAnWSiDdJejE6AQGryD6PQUIXqRuttk0CHmDV7YRlr/D8mcicgIBlNJJIxW0ScANAM5ddcBYCflMJ+MdA9YA6BWoMqEGwrgKRq1m0Wl0Go6mzKBqZYM0DaiJUM8GaCtdaoBZDDgZs1SDuf4Xa+8AV6hpB9yxQ5yDLPOARmyrBFWUlINRlpuRTJEIp+piyU5/n7gFbzyYrAb6u4iuXwn1T9OFrb/UAX6Z85VKMXoo+fO2tHuDLlK9citFL0YevvQMPwA+fQvGlr7LIcala7+WlMD5FH74Y1gTgR59D6Y+voiF3DwIO9TqF8Sn68MVhEsDS9YevoikHAsx+9OVodBKTAwF3AHgxQQYrtn66PDEBfMFK72W7hS33IYNo84Cg0XtKAkLAbpKtBBjBy4wBRXiABG5OQ9re4XMHb5w6kzBwhCI9QIB/AZL5BrcmEQsQceUzPYojAOAZ9LhaaeCz4WxBwvkUCUURICP/ywDPYzg8lMVRZxsncpcgwbmalUZAC5DvBCyX6tPxwSqQRMCcHtqch69KI4BrvB6qem0LeKNdZacXFEMAQM1k7nNknauUxImf4gJO2VIJ+ITRX7gCnJFOd5A9tsnuAwGDVH1MxD4Q8AAPsC6ZpRJwBVBzzymwMzHgCICZA7A557Vs7HwXWSdZxXgAwQAY83zdsfoAL2BJ/l+DXIebL+TBOeTa4oOgEEC3/2aAuQC4S70GcHoJR57pMttvPOc9a8vVA2ZiMbfbBtUdQI7/j8DkSGVUTwGfQZ/yZREwtlZqAP4Jg7k+P75tCUESwDiwcacoSw8w0Ulu/xH3pqq/KVJaCDCB6kzBbAmQUWfZq/PZtPsGFxxdghkAwjWnwZF8ayBUXXoBgyfJ6FuWBFjAEzQN51EYr41PCYpz6LBC1CKKuNcrQ64ELGAk3Z6NNT/L3qWOWui3EMolU0tpdnFIInMloIOB6r7WsjeCCHMF6fOIXAnQlyvc5NwUA0Kx9/KjkrqvKHMnwJnHh7JQCRhuqlQPGE8BzjUtLviOzbmbKvtu/fyE7EzdEfc1Wgf1waVK096QPkKmgWyVKUZum7eD8wEhne2KbANWPu8KmBgcJCD2z84xv5edzt4T8BehTjEJhU21lwAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADoAAABACAYAAABLAmSPAAAABHNCSVQICAgIfAhkiAAAA9pJREFUaEPtm99x1DAQxuMK4J0H8sA78MoLRwdQAUcFJBVwVABUwKWCDBVw6SBUwJVAKji+z7Myik7/VpYvNiPNeJyxZe/+tLvSan3pzmbeDofDOVT8iYPnknaLh151JU+e8hmAXkDel5Eyny0B9DEgdzieW7C/8PefBDw94Kn0mT8oFYVVXVi645uu64KweGaDPp8WBVoCu1hQgaU7/rZc9jOsSssdtcWCivty9n0hVHf8G6D7/wY0ALkCJGPV2xZn0RJIcfPlTEZaSPSnW+85Gy/GogWQ3wG5xtEvPTiYaEy7vEBJCljhuIzFUSS+uG66E08wJiHPQJpXEvYGx0e5UD9hcIRyQefCHpw0XNgRlgyNG6/XBfWMLIVkw1aAvBT3tdPFuqAeSLrOaxnmJGwFyA/wnK0nXawH6oE0QreQ8j4FWwvS+K4H9sno3UsI0hIaha0N6cBSNpebi1GgKcgU7FSQvlmpGDQXMgL7Dve4obZzV80S0odHbKq17xWBaiEDsLYeTNAng6QgNWgpZAR2ckg16FhID+xJIFWgGkj0fStr6LfIfnElM+LeF2caeTlxmuW6GqHou4Zg5p5syUThFJBZFh0BaRhUsBp5OZY0faIW1Qh1LMn3M/4eaSyrkaeBjFpUI9QDeYWXcz+4w2ES7KhlNfK0kEFQjVAfJCYgxqmvHuuF1cgrgfSCaoTGII1CngT7HqxGXinkEahGaA5kChb3WQHorS/tKK2TgWLFwqSKubwcUNZ9+03/MBlNBRmBdRX25q7Qa4OOpvaTC2n63QL05QA6NWQGbDBBHwl6BtDemB1e9FVcKOg+lqJ0M5MM8PKVmXhyh9oTs9FdiAPKUklO/YmFtb7ZoAdLyaDimphMQQssB42utYv1d0BZaIv257vwzMCksmhNyNQguPergcoIbHE2tR1eGtzpISFFtw3OZjIqt6gVf0ewcq8oJjFAXA64fJwrrXhvWahq0QisraNq4oGC7sBpeH8gtrjVY7zVtWgCVgUpCnLSMHVdDST73gB0NSmoJ2bVkB5QbWydBlQUXfOsqbTZZoPL2RadL6jW19z+DTQygtZCP73ryrLAdYvfKDVtj878Htr/9mf2FnUU1ICyL7dFmwaaGLZTu+4wW5qEOKYflON6Z3YLy7RoA7VM3Cw694TBnnWb6zbXXeg62ly3uW5z3fntR9vyEkh4W2bUMqPwXujBtmlQqd9EJ9o57q+lT2ibtsV9ViBSzcgLlVK07/n3kcmVPFGFIQXo3g+Bat9zh6SnLwkd/SplZIXd/mbDH2uU/peg7Rms2F9rCaX/UPH/C3Wy/Fp5RkcZAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAABHNCSVQICAgIfAhkiAAAA8dJREFUeF7tWzts00AY9l1Qm2Qgdia6gLoBA4+NCSSYmJBAAgkmBsoEUqnoAANigKGorUQnysAEEkMrMTFRCSYmXgOwIRgoS22HIUklcsd3jp24qRPbiS92dMnSKjn/j+/+1/3+j2iSP7VabX+1un0il6NHNY0d5JxPc67tA1udEJIX7PFdHX9sQrQ/+O6HptHvjQb7XCxOvi8UCr9kikhkELcs6ySl9Fyjwc9CqUOD8ABY33I58pox9sowjHeD0Ap6NjEATNMsUbpnBoJeHVTpbkoKMADsM8b+rZbL5UoSYAwMgKv4PGONWZhvIQmhwmjAZWqU5pYBxMKgQAwEQKVSucEYvw+BjTChJf1uUUrulUqllX7p9wUAdv0IIXQZTE/3yzjh5zY4Z7Owhi9x6cYGwLb/XgOzJ2AU+9m4wsVcz7Ep13V979M4z8VSwrIqi0hat+IwGP5asmQYpbmofCMDYNuV5wg+l6MSTnMdgvELXS9diSJDJAAsy14DsfNRCGZozbph6BfC5AkFYJR2vlPZKJbQE4DR8PnQPe4ZE7oC4Eb71TDyo/A7ssNMt+wQCICb5z9lMNX1izfiNzsWVCcEAoCg9yZDRU6/Snc+t4GgeGZXnOj8wi1vHyfFNUt0UDbf7Cybd1iAONjAX3AeT622l42XBVeY9h+gdgCAwPcAC+7IliJN+tjghwiIdz0ZWgCI3Ud5vzmsI21aIIijNMr5Kc8KWgBg929j9xfSEmyYfGEF87CCR4KnzwLsr7I6OVGVs23LWarrctsLorNULuuHWwCIHh6weBtVUBnrhPLVatUhXSwWpYMANzgleoyOBSD1LaKzk9ox16/8sABASlxCSpxzADDN9Mw/DeWFzp4bENG3r9e3f8ow6zCaaSnvyZXPTx4gW1v2RUq1l2HCJv172soLfRjTLpE0ip8sKO9kABRFAMBegz8MrduTFeWbAGjrBCnwA/49nrSJB9HLkvJN+fhHYprWb5S/U7IByJ7yzkvZTQFAVXb9n0Xlm6mQ1+ACNhPuIMsCsqq8qy8fA6C8CygfBJVPg8oXQsqXwsofhpQ/DivfEBm3xIBA1pqioissGqNyP76maNpu4Ckqzg0TE5PSld/VFhcCjF+MqP5qzLUCdV+ONuOA4q/H3ZQo5n/VHJDworHSIzKuK4hhaHWHpNyAKIai1RyTa7vCKAxHh9WLvYenQ7vBSo/K+oKiusPS7Tpd4XH50YoJki5MtC1B4SszHghKX5ryJx1lr835QVD64mQAEOpdnQ2qw5S8PN2tIM369fn/fOW1/+wf+cMAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAABHNCSVQICAgIfAhkiAAAA+FJREFUeF7tWz1oFEEU3pkTkkvh7R4IpokELNTCHwJiFUErQRAUFGJlYawUYjCFFiGFFpEkoJWxsDJgkYAgWBnQSgR/C7UTLYxNdvcs7i7gzfjN3e5lc7m7/b/dZXLNHXszb9775v3N2zdEiflTqVSGyuWNE7kcPaIo7ADnfJhzZS+WVQkh/WJ5PKviyyRE+YNnPxSFfq/V2OeBgb63+Xz+V5wskjiIG4YxSik9V6vxMxDqYJg1ANa3XI68ZIw91zTtTRha7eZGBoCu6wVKd42D0Sthhe4kpAADwD5h7N9isVgsRQFGaAAswacYq01AffNRMOVGAyZToTS3ACBmwwIRCoBSqXSdMT4DhjU3pmP636CUTBcKhYdB6QcCALt+mBC6gEVPBV044nmrnLMJaMMXv3R9A2Caf69isUdYyPdcv8z5HM+xKddUdfdjP/N8CWEYpTkErZt+Fuj9WDKvaYVJr+t6BsA0S0/hfMa8Ek5yHJzxkqoWLnvhwRMAhmEug9h5LwRTNGZF09QLbvy4ApClnW8V1osmdAUgGzbvusddfUJHACxvv+hGPgv/IzqMd4oObQGw4vynFIa6oHjDf7Oj7fKEtgDA6b1KUZITVOjWeatwiqe3+YnWB1Z6+yCqVdNEB2nzjda0eYsGiIMN7AXn8cRy+7jxMmAKw84D1BYA4PjuYsDtuLlIkj42+B4c4h2bhyYAYveR3q/16kibFAjiKI10ftDWgiYA2P1b2P3ZpBjr5brQgilowX2xpkMDzK9xVXK8Crc0874+dGx6xOuUQONEZalYVA81ARA1PGDxOhC1iCYJ4d+9aNQ/j58dih0EmMFJUWOsawBC3xwqO4kdc53C9woAhMR5hMTJOgC6npz6JyG8kNk2AyLq9tXqxs+INNkXmaSEt5ns7+/bR9bXzYuUKs98cR7B4KSFFyIwplwiSSQ/aRC+HgGQFAEAcxn20LNqT1qEbwCgrBCEwA/4eSwCrXYlkSbhG8zyj0TXjd9IfwdduQ85IH3C11/KrgkAynHn/2kUvhEKeQUmYDJhDiE3uOP0tApvMcx3AJDeBKR3gtKHQekTIelTYekPQ9Ifh6UviAgApC+Jpa0oKqrCojAa78dRFE3aDGxBxblh/8ie2IXfVhYXDOy8GJH91ZilBfK+HG34Aclfj1shUfT/ytkgYXtjqVtkLFMQzdDyNklZDlE0RcvZJrdpCllojnbLF7s3T7tWg6VulXU4RXmbpW0QsqQJXpqkbblcTcBpYdlono7pwsSmJkh8ZcYGQepLU06TkPbanBMEqS9OtgFCvquz7fIwKS9Pd0pI0359/j9+T7X/467/0QAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAABHNCSVQICAgIfAhkiAAAA8JJREFUeF7tWztoFEEY3pkTcpfC273KNJF0auEDQawUtBIEQUEhVhbGSiEGU2gRUmgRSQKxMhZWBiwSEAQrA1qJEF+FWgiihREku3sWdxfwZv3msnvZ3Gt372535phLc2Ef/+Ob/zX//kO0mP+KxeJwobB5PJWihzSN7XMcZ8RxtD1gqxNC0pw9rpXwYxOi/ca175pGv5bL7OPg4MCbTCbzM04RSRzELcs6QSk9Vy47Z6DU/k54AKwvqRR5wRh7ZhjG605oNXq3awCYppmldNcYBL3SqdLNlORgANjHjP1bzOVy+W6A0TEAruKTjJXHYb6ZbggVRAMuU6Q0NQ8gZjoFoiMA8vn8dcacaQhsBAkd032LUjKVzWYftEu/LQCw6gcJofNgeqpdxl1+b9Vx2Dis4VNUupEBsO2/V8HsIRhFfjeqcBGfd7Ao13R996Mo70VSwrLys0haN6MwSP5ZMmcY2YmwfEMDYNv5Jwg+o2EJi3wOwXhJ17OXw8gQCgDLspdB7HwYghI9s2IY+oUgeQIB6KWVr1U2jCW0BKA3fD5wjVvGhKYAuNF+MYh8L9xHdhhrlh0aAuDm+Q8Sprp28Ub8Zocb1QkNAUDQeylRkdOu0rXvrSIonq6LE7UX3PJ2oVtcZaKDsvlGbdm8wwL4xgb+gv24sNo+brwsuMKIfwO1AwAEvrt44HbcUoikjwW+h4B4x5OhCgBffZT360ltaUWBwLfSKOeHPCuoAoDVv4XVnxElWJJ8YQWTsIL7nKfPAuzPcXVyPOWWptcq/45OHU1S3zpevLOUy+kHqgDwHh6weBWnVFz5t8+3+pvHzg4LBwFucJL3GCsWgNQ3i85OrNtcPwAygICUOIeUOFEBwDTjN3/ORyYQPDcgvG9fKm3+iNP8/bRlAiGdHthLNjbsi5RqT5MCQCZLYEy7REQVPzJYAi+KAIC9DH8Q0u0RDQLS/gpBCnyHFHgkSReQJyY474lpWr9Q/g6JAkBkTEBZvM4BKMhQ/4twB74vgAvYzF8SK2YJTh8A5V1A+SCofBpUvhBSvhRWfjOk/HZY+YZIvyUGBJJoivKGqNcVlq4pmpQbcBC+rf0R3hGua4tzAPofRlT/NOZagbofR7figOKfx92UyOd/1RyQ8LpBSo/IuK7Ah6HVHZJyAyIfilZzTG7bFXphODqojdt6eLo/KhuEH7+v9LC0B1AvDU2HGZL29Ap0Ab+F9MbwdEwHJrYtQeEjMx4ISh+a8ruEssfm/CAofXCyARDqHZ1tVEcoeXi6WUEl+/H5/+rTuP9exynmAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAABHNCSVQICAgIfAhkiAAAA7xJREFUeF7tWz1s00AU9l2QmmQgdia6gLoBAz8bE0gwMSGBBBJMDJQJpFLRAQbEAENRWwmmloEJJIZWYmKiEkxM/A3AhmCgLLUdhvxU5Mx3iZ26qRPbcey76NIllX333rvv3t89vyNayn+1Wm1/tdo4kcvRo5rGDjqOM+U42j6w1Qkhec4ez+r4sQnR/uDZD02j35tN9rlYnHhfKBR+pSkiSYO4ZVknKaXnmk3nLBZ1KAkPgPUtlyOvGWOvDMN4l4RW0NyhAWCaZonSPdMQ9GrSRfdaJAcDwD5j7N9KuVyuDAOMxAC4C59jrDkD9S0MQ6gwGjCZGqW5JQAxnxSIRABUKpUbjDn3IbARJnRK7y1Kyb1SqfRkUPoDAYBdP0IIXQLT04MyHvK8dcdhM9CGL3HpxgbAtv9eA7NlMIo9N65wMcc72JTrur73aZx5sRZhWZUFBK1bcRhkP5YsGkZpNirfyADYduU5nM/lqIRFjoMzfqHrpStRZIgEgGXZqyB2PgpBicasGYZ+IUyeUABGaee7FxtFE/oCMBo2H7rHfX1CTwBcb78SRn4U3iM6TPeKDoEAuHH+k4ShblC84b/ZsaA8IRAAOL03EiU5gy66e946nOKZXX6i+4Gb3j4eFleZ6CBtvtmdNu/QAH6wgb3gPC4st08bLwumMOU/QO0AAI7vAQbcSVsKkfSxwQ/hEO96MnQA4LuP9H4jqyOtKBD4URrp/KSnBR0AsPu3sfvzogTLki+0YA5a8Ijz9GmA/TWtSo63ONu2Wv/quqjyQVsSXlkql/XDHQB4DQ9YvE1zF/jiq9Vqi0WxWBQOAmA4xWuMLQ1A6FtAZSfVY64fABlAQEhcREicbQFgmumrP+cjEwieGRBet6/XGz/TVH8/bZlAyOcnDpDNTfsipdrLrACQSRMY0y4RUcmPDJrAkyIAYK/CHoRUe0SDgLC/RhACPyAEHs/SBOTxCc5HYprWb6S/k6IAEOkTkBZvcACqMuT/IsyBnwtgAjbzp8SKaYIzBkB5E1DeCSofBpVPhJRPhZU/DCl/HFa+IDIuiQGBLIqivCDqVYWlK4pmZQYchK2thvCK8K6yePtIqvyHEcU/jblaoO7H0bYfUPzzuBsSef+vmg0SXjVI6RYZ1xR4M7S6TVKuQ+RN0Wq2yW2bwig0R4eVcfs3T49bZcPw4++Vbpb2ABqlpukoTdLeukJNwK8ho9E8ndKFiW1NUPjKjAeC0pem/Cah7LU5PwhKX5wMAEK9q7NBeYSSl6d7JVSyX5//D+lpuP+Fs7oVAAAAAElFTkSuQmCC\"","export default __webpack_public_path__ + \"static/media/HeroBanner.e00bd8ba.png\";","export default __webpack_public_path__ + \"static/media/Achievements_Image.d82b4c35.png\";","export default __webpack_public_path__ + \"static/media/OnboardSteps_Image.61db0463.png\";","export default __webpack_public_path__ + \"static/media/WhatisGSDInsight_Image.3fefaca7.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAoCAYAAADZn1szAAAABHNCSVQICAgIfAhkiAAAABtJREFUKFNjjFeZ/58BCTCOCoyGByI9DJbkAAAozVVRbvucbwAAAABJRU5ErkJggg==\"","export const github_actionTypes = {\r\n GET_TILES_DATA: \"GET_TILES_DATA\",\r\n TILES_DATA: \"TILES_DATA\",\r\n\r\n}\r\n","\r\nimport { github_actionTypes as actionTypes} from './../constants/github-actionTypes';\r\n\r\n\r\nconst initialState = {\r\n developerCard: {},\r\n errorVisibility:{},\r\n designCard:{},\r\n TilesData:[]\r\n}\r\n\r\nconst githubReducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case 'SET_DEVELOPER_CARD_DATA':\r\n return {\r\n ...state, developerCard: action.payload\r\n };\r\n case 'SET_AXIOS_ERROR_DATA':\r\n return {\r\n ...state, errorVisibility: action.payload\r\n };\r\n case 'SET_DESIGN_CARD_DATA':\r\n return {\r\n ...state, designCard: action.payload\r\n };\r\n case actionTypes.GET_TILES_DATA:\r\n return { ...state };\r\n case actionTypes.TILES_DATA:\r\n return { ...state, TilesData: action.payload };\r\n default: return state\r\n\r\n }\r\n}\r\n\r\nexport default githubReducer ;","\r\nimport { github_actionTypes as actionTypes} from './../constants/github-actionTypes';\r\n\r\nexport const setDeveloperCard = (data) => (\r\n {\r\n type: 'SET_DEVELOPER_CARD_DATA',\r\n payload: data,\r\n }\r\n )\r\n\r\n export const setErrorData = (data) => (\r\n {\r\n type: 'SET_AXIOS_ERROR_DATA',\r\n payload: data,\r\n }\r\n )\r\n\r\n export const setDesignCard = (data) => (\r\n {\r\n type: 'SET_DESIGN_CARD_DATA',\r\n payload: data,\r\n }\r\n )\r\n export const getTilesData = (data) => (\r\n {\r\n type: actionTypes.GET_TILES_DATA,\r\n payload: data,\r\n }\r\n )","import React from 'react'\r\nimport WindowClose_Icon from './../../../assets/github-images/WindowClose_Icon.png';\r\n\r\nconst PlatformVideo = (props) => {\r\n return (\r\n \r\n\r\n
\r\n This GSD Insight Demo Video is intended exclusively for the users and viewers of GSD Insight Portal.\r\n The content of this video is based on the GSD Insight design concepts and sample account data, hence the \r\n inserted screens may slightly differ from what the user can find in GSD Insight production environment.
\r\n\r\n \r\n )\r\n}\r\n\r\nexport default PlatformVideo","import React, { useState } from 'react'\r\nimport './GitHubPage.css';\r\nimport HeroBanner from './../../../assets/images/HeroBanner.png';\r\nimport Achievements_Image from './../../../assets/images/Achievements_Image.png';\r\nimport OnboardSteps_Image from './../../../assets/images/OnboardSteps_Image.png';\r\nimport WhatisGSDInsight_Image from './../../../assets/images/WhatisGSDInsight_Image.png';\r\nimport Platform_VideoLink_Image from './../../../assets/images/Platform_VideoLink_Image.png';\r\nimport Onboard_Icon from './../../../assets/images/Onboard_Icon.png';\r\nimport Account_Icon from './../../../assets/images/Account_Icon.png';\r\nimport User_Icon from './../../../assets/images/User_Icon.png';\r\nimport VoiceData_Icon from './../../../assets/images/VoiceData_Icon.png';\r\nimport NonVoiceData_Icon from './../../../assets/images/NonVoiceData_Icon.png';\r\nimport Vertical_Strip_Icon from './../../../assets/images/Vertical_Strip_Icon.png'\r\nimport { Footer} from './../HeaderFooter';\r\nimport githubReducer from './../../../reducers/github.reducer';\r\nimport { useSelector } from 'react-redux';\r\nimport { useEffect } from 'react';\r\nimport { useDispatch } from 'react-redux';\r\nimport { getTilesData } from './../../../actions/github.action';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { VideoModelPopup } from './Models';\r\nimport PlatformVideo from './PlatformVideo';\r\n\r\n\r\n\r\nconst INFO_CARDS = [\r\n {\r\n id: 1,\r\n name: 'Built to reduce manual work, utilize automated or semi-automated solutions to get your data and visualize in standard views.',\r\n imgsrc: ''\r\n },\r\n {\r\n id: 2,\r\n name: 'One stop shop leveraging all channels, both for Voice and Non-voice offering so comprehensive overview of your services.',\r\n imgsrc: ''\r\n },\r\n {\r\n id: 3,\r\n imgsrc: \"\",\r\n name: 'Empower all the Users at all organizational levels through Operational Reports, Dashboards or Agent Scorecard.',\r\n }\r\n]\r\nconst GitHubPage = () => {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const [showVideoModel, setShowVideoModel] = useState(false);\r\n let TilesData = useSelector((state) => state.githubReducer.TilesData);\r\n console.log('TilesData:::::::::::::',TilesData?.[0]?.['accounts Onboarded'])\r\n useEffect(() => {\r\n dispatch(getTilesData())\r\n }, [dispatch]);\r\n\r\n const GRID_TEXT = [\r\n {\r\n id: 1,\r\n name: 'Sites Utilizing the Platform',\r\n title: TilesData?.[0]?.['sites Utilizing the Platform']\r\n },\r\n {\r\n id: 2,\r\n name: 'Accounts Onboarded',\r\n title: TilesData?.[0]?.['accounts Onboarded']\r\n },\r\n {\r\n id: 3,\r\n name: 'Agents Telephony Data Integrated',\r\n title: TilesData?.[0]?.['agents Telephony Data Integrated']\r\n },\r\n {\r\n id: 4,\r\n name: 'GB Data Consumed (Voice & Non-Voice)',\r\n title: TilesData?.[0]?.['gb Data Consumed (Voice & Non-Voice)']\r\n }\r\n ]\r\n\r\n return (\r\n \r\n \r\n \r\n
Value Proposition of GSD Insight
\r\n
Unified Reporting and Analytics Platform for you to make better business decisions.
\r\n
\r\n \r\n \r\n {INFO_CARDS.map((cards, i) =>\r\n
\r\n )}\r\n
The Platform
setShowVideoModel(true)}/>
\r\n
\r\n \r\n \r\n {GRID_TEXT?.map((grid, id) =>\r\n
{grid.title === null ? '0' : grid.title}
{grid.name}
)}\r\n
\r\n A few simple steps to get you onboarded
\r\n
\r\n
Onboard
A standard onboarding template will guide you through the process.
\r\n
1. Account and Site Location
Define the account name and site location (this defines time zone).
\r\n
2. User Role Access
Define user roles to which you would like to get access.
\r\n
3. Data (Voice & Non Voice)
For various channels you have the ability to define data source, type, datapoints and measurement criteria. You provide us the data and SLA or KPI formulas and we will calculate and visualise them in your reports.
\r\n
\r\n \r\n \r\n
What is GSD Insight
\r\n
Get to know more on the Concept, Design, Features and Functionalities of the platform.
\r\n
\r\n \r\n\r\n {showVideoModel && \r\n setShowVideoModel(false)}\r\n />\r\n }\r\n \r\n\r\n \r\n )\r\n}\r\n\r\nexport default GitHubPage","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAQCAYAAAAxtt7zAAAABHNCSVQICAgIfAhkiAAAACRJREFUGFdjjFeZ/58BBv4zmjCSIQDXD2UwYgiQYSiGFrrYAgCABSgNY15SxwAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAaCAYAAABVX2cEAAAABHNCSVQICAgIfAhkiAAAAb1JREFUOE/d1b1Kw1AUB/D/SVsdBD9AcFQ0nUTUN6ggOLg5OCjGBEFH6xPYzg7WUUETfQA3UVzMI1TEqUVcRUSlqNS293pSG4it7U07iYELyf345Zx78kEIHIZ+dEGguWBf2HMCsty+j1XdPgfRLEk8C4gBHqiEhQCtAMjBKuZDkNK7fuIBxmi5S3xeqsASxXoFUY7ndVMQEpDzGmgHoGEQlo5z5pkKWx/d7ytqsQdeU8U4HHqUHBYv5E6M8UC5Y4yhMoOM0cd3JDLK+7fYUWS8uMjYiiR699PyIXPE7pcR7FIFW8699VKfdkOaHtYtSkMHdxuvwclVKIor7pviluXkZ+rBUFgd5N+jAVRiTaBfQSVm6Lb3NE9yRa41CZfLvcnl2ROEhNfvpXyct6Y9XYmZcdsUEkmtjASiSDK6zUgaZWREFK5GyDg5ywmF/SiCbqd8zMlbqY6r6S00/zKW4AC95nKabttpmqP2hOoFd+6sm1AFMPTDFEHbbgZKiPRJfq1aDOWjUcMWWmCnoTFVisFxZWT/FsMbp3bL37U2/ki1zSCKQGKcr3qI/5UF/sq2jzRsLEXIiNtL7Wx4q7lfeNx+pciaRp8AAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAABHNCSVQICAgIfAhkiAAABNNJREFUOE+NVX1MlWUUP+d573vvhYBcGyVQVnLVUlzmH86YFMsNSejD5qrFN0k0J5Uum1vLWLm2aq0wtxoKePnY0qKt1qRNm5l/4B9Ic8sQuBcZGJYUJBFwue/znH4vIjG6fbz/vPc9z3l+55zf+Z1zmfAUrWi8kx1nHTM/jM9VTJIkpFKIJM49n31G8R4VlmEW6iSjWm2Jfn/oYsXP83zmfnJJoC6HRe0TpgAR9zNLlwiHWKSd2ZoUpY3RxoPfyQh4jxCtFhLXN4WZzhpt7WnqK+5YCA7ghu9g1ETmdUXc3hAqH46VwXzb9pVHE8aj4wUsvBeBLvjN9OO1fZVX5/u4wGJIsptC5af+C3Dhecmy+n1ieKshnd8c3hb6GzC47GLF72l2TjR1V1z8twDVVK16A2mpHrK3414BCUU06c0xgQUUgL+1APwR/PWD8w5i84cIdRNZY+A9FfbbmPhmgN0LvyXgOB6gl4gpTouTGxNYM+VYhicAlkOksnHRbZQPbz84TAVImMlADPwbbOPEchyqaCNltpCop/4RmJgfCPaWfutSUHpHg58tSTaskpCRXyzHYu3Ris2kVtZVf+LUldqzlVHXFxzXIN4ToCIrZsaGzM6m0DPv/5/mFaU3ZihlMkk0lGRNQU25oKguSnZnS6hw7DrGjCqg28sor0bY+WKq98aeTwhJLHgK0ppv9cRNv4vqslAJhoc7QFcYVD0J10nQ9LUS6TocLnvZvToDjAachvNqNGsSAQZg7kHDBsDfNHyGWXlPehN/D0fGfMfQvCQm6kMymQSdgbZLRmgQti3EOjfYu+007sisjq1sJWYcYJsM8QY4LcLhYrxxh3wIhmM5jpHfjO+vvNrZHRHfXeyNxtu29EanrTxkvxeBTgkr20P85mzGfzXPLaMsUJ9sCM2DKuC8mJS0IocIVHMmylM7bfHdB36fdbOHvQsJ7ccOyROjnkOABDBQN8uxVDWGyw/Eal7psoZXQVOF0fSOEmoSD+cB8CDoOoe3y3GmIrqsLesFdiSdldmFpk3OAKPkIXDWjOZ97J/Q3bVDlRPXgxQHGl7DsimBzw+QW5VydBDZef3Kn1/b8/Qvxel1DxFbLQj0PIteg0HagYV18BoVxJ8CaAMi+VBWP76HEe0cnHw2UQ1KPGAUeTkqhWJTGyo4HwyVFbrBi5YGl1jKnMTPowgYjyl6lMhTNcexMc6IYpUFOd2PwxQA3453nBGZUszJkM6XvolIWeQGbx2A14mYHSLOeWXZxeD5FQxKvrI44Ih5C53ujNm88hV1iY54koyOxlns2URiqkXx26LVEcWSDHXsx0a8G40aQaZpAK41jvrIsnUAjXN7MuICRxDtxWBf6YexmleYfigA8G9A003guRcV7cZu6FNsr1dkVmFtnojS1IBX+d6YHRZXxrsAXH9MRK1H9CPCppE8np7GCyW/zg+CnVBmsJgs4nIADbKWImVLBjSfhAwHRTOWl7yEJn+Gbwsct/DM7JNTQYofQUm3QKv97ohj/ocQ6CfYRuG8HOVdBucbkTXAuAuNfexacA7jvJ9ENsK+FcusdcY6J6ulweWsZA3+6x4kRSsBnoCzRVDJNLJMQDPbkJErw7WYxwxc/Bx+Z0DRBwAMIYF2I2pPU7j4iov5J5eibQseKcDEAAAAAElFTkSuQmCC\"","export const UploadActionTypes = {\r\n SET_SELECTED_VOLUME_FIELDS: \"SET_SELECTED_VOLUME_FIELDS\",\r\n SET_SELECTED_SLAKPI_FIELDS: \"SET_SELECTED_SLAKPI_FIELDS\",\r\n SET_SELECTED_ACCOUNT_DETAILS: \"SET_SELECTED_ACCOUNT_DETAILS\",\r\n SET_SELECTED_SLAKLP_VOLUME_TAB:\"SET_SELECTED_SLAKLP_VOLUME_TAB\",\r\n SET_SELECTED_VOICE_NONVOICE_TAB: \"SET_SELECTED_VOICE_NONVOICE_TAB\",\r\n SET_SELECTED_VOICE_NONVOICE_ITEM: \"SET_SELECTED_VOICE_NONVOICE_ITEM\",\r\n SET_DATA_ADMINISTRATION_VALIDATION:\"SET_DATA_ADMINISTRATION_VALIDATION\",\r\n SET_SELECTED_VOLUME_SLA_DATE:\"SET_SELECTED_VOLUME_SLA_DATE\",\r\n SET_SELECTED_ITEM:\"SET_SELECTED_ITEM\",\r\n\r\n GET_UPLOAD_ACCOUNTS: \"GET_UPLOAD_ACCOUNTS\",\r\n UPLOAD_ACCOUNTS: \"UPLOAD_ACCOUNTS\",\r\n\r\n GET_SLAKPI_VOLUME_TEMPLATES: \"GET_SLAKPI_VOLUME_TEMPLATES\",\r\n SLAKPI_VOLUME_TEMPLATES: \"SLAKPI_VOLUME_TEMPLATES\",\r\n\r\n UPDATE_SELECTED_SLAKPI_VOLUME_START: \"UPDATE_SELECTED_SLAKPI_VOLUME_START\",\r\n UPDATE_SELECTED_SLAKPI_VOLUME_SUCCESS: \"UPDATE_SELECTED_SLAKPI_VOLUME_SUCCESS\",\r\n\r\n UPDATE_CUSTOM_TEMPLATE_START: \"UPDATE_CUSTOM_TEMPLATE_START\",\r\n UPDATE_CUSTOM_TEMPLATE_SUCCESS: \"UPDATE_CUSTOM_TEMPLATE_SUCCESS\",\r\n\r\n GET_FILE_UPLOAD_DATA: \"GET_FILE_UPLOAD_DATA\",\r\n FILE_UPLOAD_DATA: \"FILE_UPLOAD_DATA\",\r\n\r\n UPDATE_FILE_UPLOAD_DATA_START: \"UPDATE_FILE_UPLOAD_DATA_START\",\r\n UPDATE_FILE_UPLOAD_DATA_SUCCESS: \"UPDATE_FILE_UPLOAD_DATA_SUCCESS\",\r\n\r\n GET_NONVOICE_CARDS_DATA: \"GET_NONVOICE_CARDS_DATA\",\r\n NONVOICE_CARDS_DATA: \"NONVOICE_CARDS_DATA\",\r\n\r\n GET_UPLOAD_PRIVIEW_DATA: \"GET_UPLOAD_PRIVIEW_DATA\",\r\n UPLOAD_PRIVIEW_DATA: \"UPLOAD_PRIVIEW_DATA\",\r\n\r\n GET_VOLUME_SLAKPI_SELECTEDTEMPLATES_DATA: \"GET_VOLUME_SLAKPI_SELECTEDTEMPLATES_DATA\",\r\n VOLUME_SLAKPI_SELECTEDTEMPLATES_DATA: \"VOLUME_SLAKPI_SELECTEDTEMPLATES_DATA\",\r\n\r\n UPDATE_VOLUME_SLAKPI_DATA_START: \"UPDATE_VOLUME_SLAKPI_DATA_START\",\r\n UPDATE_VOLUME_SLAKPI_DATA_SUCCESS: \"UPDATE_VOLUME_SLAKPI_DATA_SUCCESS\",\r\n\r\n GET_VOICENONVOICE_ITEMS: \"GET_VOICENONVOICE_ITEMS\",\r\n VOICENONVOICE_ITEMS: \"VOICENONVOICE_ITEMS\",\r\n\r\n};\r\n\r\n","\r\nimport { UploadActionTypes as actionTypes} from \"../constants/uploads-actionTypes\";\r\n\r\nexport const setSelectedVolumeFields = (data) => ({\r\n type: actionTypes.SET_SELECTED_VOLUME_FIELDS,\r\n payload: data\r\n});\r\n\r\n\r\nexport const setSelectedSLAKPIFields = (data) => ({\r\n type: actionTypes.SET_SELECTED_SLAKPI_FIELDS,\r\n payload: data\r\n});\r\n\r\nexport const setSelectedAccountDetails = (data) => ({\r\n type: actionTypes.SET_SELECTED_ACCOUNT_DETAILS,\r\n payload: data\r\n});\r\n\r\nexport const setSelectedSLAKPIVolumeTab = (data) => ({\r\n type: actionTypes.SET_SELECTED_SLAKLP_VOLUME_TAB,\r\n payload: data\r\n});\r\n\r\nexport const setSelectedVoiceNonVoiceTab = (data) => ({\r\n type: actionTypes.SET_SELECTED_VOICE_NONVOICE_TAB,\r\n payload: data\r\n});\r\n\r\nexport const setSelectedVoiceNonVoiceItem = (data) => ({\r\n type: actionTypes.SET_SELECTED_VOICE_NONVOICE_ITEM,\r\n payload: data\r\n});\r\n\r\n export const setDataAdministrationValidation = (data) => ({\r\n type: actionTypes.SET_DATA_ADMINISTRATION_VALIDATION,\r\n payload: data\r\n });\r\n\r\nexport const setSelectedVolumeSlaDate = (data) => ({\r\n type: actionTypes.SET_SELECTED_VOLUME_SLA_DATE,\r\n payload: data\r\n});\r\n\r\nexport const setSelectedItem = (data) => ({\r\n type: actionTypes.SET_SELECTED_ITEM,\r\n payload: data\r\n});\r\n\r\nexport const getUploadAccounts = (data) => (\r\n {\r\n type: actionTypes.GET_UPLOAD_ACCOUNTS,\r\n payload: data,\r\n }\r\n )\r\n\r\n export const getSLAKPIVolumeTemplates = (customerID,category,itemID) => (\r\n {\r\n type: actionTypes.GET_SLAKPI_VOLUME_TEMPLATES,\r\n customerID:customerID,\r\n category: category,\r\n itemID:itemID\r\n }\r\n )\r\n\r\n export const updateSelectedSLAKPIVolumeStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_SELECTED_SLAKPI_VOLUME_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n \r\n export const updateSelectedSLAKPIVolumeSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_SELECTED_SLAKPI_VOLUME_SUCCESS,\r\n }\r\n )\r\n\r\n export const updateCustomTemplateStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_CUSTOM_TEMPLATE_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n \r\n export const updateCustomTemplateSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_CUSTOM_TEMPLATE_SUCCESS,\r\n }\r\n )\r\n\r\n export const getFileUploadData = (customerID,servicedeskID,selectedVoiceNonVoiceTab) => (\r\n {\r\n type: actionTypes.GET_FILE_UPLOAD_DATA,\r\n customerID:customerID,\r\n servicedeskID:servicedeskID,\r\n selectedVoiceNonVoiceTab:selectedVoiceNonVoiceTab\r\n\r\n }\r\n )\r\n\r\n export const updateFileUploadDataStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_FILE_UPLOAD_DATA_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n export const updateFileUploadDataSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_FILE_UPLOAD_DATA_SUCCESS,\r\n }\r\n )\r\n\r\n export const getNonvoiceCardsData = (customerID,servicedeskID,selectedVoiceNonVoiceTab,month) => (\r\n {\r\n type: actionTypes.GET_NONVOICE_CARDS_DATA,\r\n customerID:customerID,\r\n servicedeskID:servicedeskID,\r\n selectedVoiceNonVoiceTab:selectedVoiceNonVoiceTab,\r\n month:month\r\n }\r\n )\r\n\r\n export const getUploadPreviewData = (customerID,servicedeskID,month) => (\r\n {\r\n type: actionTypes.GET_UPLOAD_PRIVIEW_DATA,\r\n customerID:customerID,\r\n servicedeskID:servicedeskID,\r\n month:month\r\n }\r\n )\r\n\r\n export const getVolumeSlakpiSelectedTemplatesData = (customerID,servicedeskID,category,month,itemname) => (\r\n {\r\n type: actionTypes.GET_VOLUME_SLAKPI_SELECTEDTEMPLATES_DATA,\r\n customerID:customerID,\r\n servicedeskID:servicedeskID,\r\n category:category,\r\n month:month,\r\n itemname:itemname\r\n }\r\n )\r\n\r\n export const updateVolumeSLAKPIDataStart = (data) => (\r\n {\r\n type: actionTypes.UPDATE_VOLUME_SLAKPI_DATA_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n \r\n export const updateVolumeSLAKPIDataSuccess = () => (\r\n {\r\n type: actionTypes.UPDATE_VOLUME_SLAKPI_DATA_SUCCESS,\r\n }\r\n )\r\n\r\n export const getVoiceNonvoiceItems = (data) => (\r\n {\r\n type: actionTypes.GET_VOICENONVOICE_ITEMS,\r\n payload: data,\r\n }\r\n )\r\n","import { useEffect, useState } from \"react\";\r\nimport ReactModal from \"react-modal\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useHistory } from \"react-router-dom/cjs/react-router-dom.min\";\r\nimport { getVoiceNonvoiceItems, setSelectedItem } from \"../../../actions/uploads.action\";\r\n\r\n\r\n\r\nReactModal.setAppElement('#root')\r\nexport function ItemSelectionModalPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n background: ' #63666A66 0% 0% no-repeat padding-box',\r\n opacity: '1',\r\n },\r\n content: {\r\n top: '50%',\r\n left: '50%',\r\n right: 'auto',\r\n bottom: 'auto',\r\n marginRight: '-30%',\r\n transform: 'translate(-50%, -50%)',\r\n margin: '20px',\r\n padding: '30px',\r\n\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\n\r\nexport function ItemSelectionModal(props){\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n let voicenonvoiceitems = useSelector((state) => state.uploadReducer.voicenonvoiceitems);\r\n console.log('voicenonvoiceitems',voicenonvoiceitems)\r\n\r\n useEffect(()=>{\r\n dispatch(getVoiceNonvoiceItems())\r\n },[dispatch])\r\n\r\n const [selectedItem, setselectedItem] = useState('');\r\n const [ItemId, setItemId] = useState('');\r\n\r\n // console.log('selectedItem',selectedItem)\r\n return(\r\n <>\r\n Select Item
\r\n \r\n {voicenonvoiceitems?.map((role,id) =>\r\n \r\n \r\n {role.ItemName} \r\n
)}\r\n \r\n \r\n {history.push('/upload/dataAdmin');dispatch(setSelectedItem(selectedItem))}}>\r\n PROCEED\r\n \r\n \r\n CANCEL\r\n \r\n \r\n \r\n )\r\n\r\n}","import React, { useEffect, useState } from 'react'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb';\r\n\r\nimport searchIcon from './../../../assets/onboard-images/Search_Icon.png';\r\n// import ActivateDisabledIcon from './../../../assets/images/Activate_Disabled_Icon.png';\r\n// import ActivateIcon from './../../../assets/images/Activate_Icon.png';\r\nimport menuIcon from './../../../assets/images/Dotted_ContextMenu_Icon.png';\r\nimport FileUpload_Icon from './../../../assets/images/FileUpload_Icon.png';\r\nimport UploadAdministration_Icon from './../../../assets/images/UploadAdministration_Icon.png';\r\nimport Admindata from '../../Administration/Administration_firstpage.js/Admin.json';\r\n// import TooltipHandler from '../../Onboard/OnboardComponents/TooltipHandler';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { ActivateModelPopup, ActivationRequestModal, RequestSentModal } from '../../Administration/Administration_firstpage.js/ActivationModel';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getUploadAccounts, setSelectedAccountDetails } from '../../../actions/uploads.action';\r\nimport { ItemSelectionModal, ItemSelectionModalPopup } from '../Data-Administration/ItemSelectionModel';\r\n\r\nfunction UploadAccountList() {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n let uploadAccounts = useSelector((state) => state.uploadReducer.uploadAccounts);\r\nconsole.log('uploadAccounts',uploadAccounts)\r\n useEffect(() =>{\r\n dispatch(getUploadAccounts())\r\n },[dispatch])\r\n\r\n\r\n\r\n\r\n const [showRequestForm, setShowRequestForm] = useState(false);\r\n const [showRequestSent, setShowRequestSent] = useState(false);\r\n const [filter, setFilter] = useState('');\r\n const [showNonvoiceItemSelectionModel,setShowNonvoiceItemSelectionModel] = useState(false)\r\n const [searchColumns, setSearchColumns] = useState([\r\n 'Account Name', 'Site Name', 'Created By'\r\n ]);\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n };\r\n const menuoptions = [\r\n {\r\n id: 1,\r\n imageSrc: FileUpload_Icon,\r\n name: 'File Upload - Voice & Non Voice',\r\n value: '/upload/account'\r\n }, {\r\n id: 2,\r\n imageSrc: UploadAdministration_Icon,\r\n name: 'Upload Data Administration',\r\n value: \"\"\r\n }\r\n ];\r\n\r\n \r\n const [selectedAccount, setSelectedAccount] = useState({});\r\n const [openDownload, setOpenDownload] = useState(false);\r\n const [dropdownIndex, setDropdownIndex] = useState(null);\r\n\r\n const onClickAccountRow = (data, id) => {\r\n switch (data?.Status) {\r\n case 'Active': {\r\n setDropdownIndex(id)\r\n setSelectedAccount(data);\r\n \r\n setOpenDownload(!openDownload);\r\n break;\r\n }\r\n case 'Inactive': {\r\n if (data?.Request !== 'Sent') {\r\n setSelectedAccount(data);\r\n setShowRequestForm(true);\r\n setShowRequestSent(false);\r\n }\r\n break;\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
history.push('/welcome')} label1='Home' isActive2={false} label2='Upload' />\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {Admindata.headers.map(header => ( {header.label} ))}\r\n \r\n \r\n \r\n \r\n {searchRows(uploadAccounts).map((info, rowId) => (\r\n \r\n {info?.['Account Name']} \r\n {info?.['Site Name']} \r\n {info?.['Created By']} \r\n {(info?.['Created Date'])} \r\n {(info?.['Valid From'])} \r\n {(info?.['Valid From'])} \r\n
{info?.['Status']} \r\n {setDropdownIndex(rowId)\r\n setSelectedAccount(info);\r\n setOpenDownload(!openDownload);dispatch(setSelectedAccountDetails(info))}}>{\r\n <>\r\n \r\n {(openDownload && dropdownIndex === rowId) && (\r\n
\r\n {menuoptions.map(data => (\r\n {data.id === 1 ? history.push(data.value) : setShowNonvoiceItemSelectionModel(true)}} >\r\n )\r\n )}\r\n )}
\r\n ))}\r\n \r\n
\r\n \r\n {showRequestForm && \r\n {\r\n setShowRequestForm(false);\r\n setShowRequestSent(true);\r\n }} data={selectedAccount}\r\n handleCancelClick={() => setShowRequestForm(false)}\r\n />\r\n }\r\n \r\n {showRequestSent && \r\n {\r\n setShowRequestSent(false);\r\n setShowRequestForm(false);\r\n }}\r\n />\r\n }\r\n\r\n {showNonvoiceItemSelectionModel && \r\n setShowNonvoiceItemSelectionModel(false)} \r\n />\r\n }\r\n\r\n\r\n\r\n\r\n \r\n \r\n \r\n\r\n\r\n \r\n
This page enables to view the previous steps filled status/update.
\r\n
\r\n Select Month
\r\n \r\n ValidFromDateHandler(date)}\r\n />\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {/*
\r\n Non Voice
\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{UploadpreviewData?.[0]?.NonVoiceHeader.map((data,id) => (\r\n
{data.ItemName}
\r\n \r\n
\r\n
\r\n \r\n \r\n File Upload \r\n Volume Data \r\n SLAs/KPIs Data \r\n \r\n \r\n \r\n \r\n {data?.['File Upload']} \r\n {data.Volume} \r\n {data?.['SLA/KPI']} \r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n {\r\n dispatch(setWidgetPreviewTab(data.ItemName))\r\n props.onClickViewDetails(data.ItemName);\r\n }}>View Details
\r\n
\r\n
\r\n
setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n background: ' #63666A66 0% 0% no-repeat padding-box',\r\n opacity: '1',\r\n },\r\n content: {\r\n top: '50%',\r\n left: '50%',\r\n right: 'auto',\r\n bottom: 'auto',\r\n marginRight: '-30%',\r\n transform: 'translate(-50%, -50%)',\r\n margin: '20px',\r\n padding: '30px',\r\n\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\nconst PERIOD = [\r\n { id: 1, value: 'Day' },\r\n { id: 2, value: 'Week' },\r\n { id: 3, value: 'Custom Period' },\r\n { id: 4, value: 'Month' }\r\n]\r\nexport function FileUploadFragment(props) {\r\n const dispatch = useDispatch();\r\n\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const SelectedVoiceNonVoiceTab = useSelector((state) => state.uploadReducer.SelectedVoiceNonVoiceTab);\r\n const SelectedVoiceNonVoiceItem = useSelector((state) => state.uploadReducer.SelectedVoiceNonVoiceItem);\r\n \r\n\r\n const [ValidFrom, setValidFrom] = useState(new Date(''));\r\n const [ValidTo, setValidTo] = useState(new Date(''));\r\n const [month, setMonth] = useState(new Date(''));\r\n const [day, setDay] = useState(new Date(''));\r\n\r\n function formatDate(date) {\r\n var d = new Date(date)\r\n let dt = d.toLocaleDateString('en-us', { month: \"short\", year: \"numeric\" }),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n return [month, day, year].join('/');\r\n }\r\n function formatMonthDate(date) {\r\n return new Date(date).toLocaleDateString('en-us', { month: \"long\", year: \"numeric\" })\r\n }\r\n\r\n\r\n // useEffect(() => {\r\n // if (props.editMode) {\r\n // setSelectedValue(props.editFileUpload.selectedValue[0])\r\n // switch(props.editFileUpload.selectedValue[0]){\r\n // case 'Month':\r\n // {\r\n // setMonth(props.editFileUpload.selectedValue[1])\r\n // break;\r\n // }\r\n // case 'Day' :\r\n // {\r\n // setDay(props.editFileUpload.selectedValue[1])\r\n // break;\r\n // }\r\n // default:{\r\n // setValidFrom(props.editFileUpload.selectedValue[1])\r\n // setValidTo(props.editFileUpload.selectedValue[2])\r\n // }\r\n // }\r\n // let temp_Obj = {\r\n // fileSize: props.editFileUpload.fileSize,\r\n // fileName: props.editFileUpload.fileName,\r\n // fileType: props.editFileUpload.fileType,\r\n // uploadedDate: props.editFileUpload.uploadedDate,\r\n // uploader: props.editFileUpload.uploader\r\n // }\r\n // setUploadedFile(temp_Obj)\r\n // setDatacard(true)\r\n // }\r\n // }, [props.editMode])\r\n\r\n const [addFileUpload, setAddFileUpload] = useState({});\r\n const addDateToFileUpload = (period) => {\r\n const newFormData = { ...addFileUpload };\r\n newFormData['period'] = period;\r\n setAddFileUpload(newFormData)\r\n }\r\n\r\n\r\n\r\n\r\n const [selectedValue, setSelectedValue] = useState('')\r\n const DisplayPeriodHandle = () => {\r\n switch (selectedValue) {\r\n case 'Day': return (<>\r\n Select Day * \r\n { DateHandler(date, selectedValue) }}\r\n format=\"MM/DD/YYYY\"\r\n style={{ width: '300px', marginTop: 10 }}\r\n error={false}\r\n helperText={null}\r\n />\r\n
\r\n );\r\n case 'Custom Period':\r\n case 'Week': return (<>\r\n { DateHandler(date, selectedValue, 'valid_from') }}\r\n />\r\n { DateHandler(date, selectedValue, 'valid_to') }}\r\n />\r\n\r\n )\r\n case 'Month': return (<>\r\n Select Month * \r\n { DateHandler(date, selectedValue) }}\r\n format=\"MM/YYYY\"\r\n style={{ width: '300px', marginTop: 10 }}\r\n error={false}\r\n helperText={null}\r\n />\r\n
\r\n );\r\n default: { }\r\n }\r\n }\r\n const [dates, setDates] = useState([]);\r\n const DateHandler = (date, value, validity) => {\r\n switch (value) {\r\n case 'Month': {\r\n setMonth(formatMonthDate(date));\r\n let period = `Month - ${formatMonthDate(date)}`\r\n addDateToFileUpload(period, value);\r\n break;\r\n }\r\n case 'Day': {\r\n setDay(formatDate(date));\r\n let period = `Day - ${formatDate(date)}`\r\n addDateToFileUpload(period, value);\r\n break;\r\n }\r\n\r\n case 'Custom Period':\r\n case 'Week':\r\n {\r\n let valids = [...dates]\r\n if (validity === 'valid_from') {\r\n setValidFrom(formatDate(date));\r\n valids.push(formatDate(date));\r\n setDates(valids)\r\n }\r\n if (validity === 'valid_to') {\r\n setValidTo(formatDate(date))\r\n valids.push(formatDate(date))\r\n setDates(valids)\r\n }\r\n const isValidDate = moment(valids[valids.length - 1]).isAfter(valids[valids.length - 2])\r\n let str = '';\r\n if (isValidDate) {\r\n str = `${value} - ${valids[valids.length - 2]} to ${valids[valids.length - 1]}`\r\n }\r\n else str = `${value} - ${valids[valids.length - 1]} to ${valids[valids.length - 2]}`\r\n addDateToFileUpload(str, value)\r\n\r\n break;\r\n }\r\n\r\n default: { }\r\n }\r\n }\r\n\r\n\r\n const [uploadedFileId, setUploadedFileId] = useState();\r\n const [file, setFile] = useState(\"\");\r\n const [fileName, setFileName] = useState(\"\");\r\n const [fileSize, setFileSize] = useState(\"\");\r\n const [fileFormat, setFileFormat] = useState(\"\");\r\n const [error, setError] = useState();\r\n\r\n const handleUpload = async (event) => {\r\n event.preventDefault();\r\n const file = event.target.files[0];\r\n const MAX_SIZE_MB = 20;\r\n const MAX_SIZE_BYTES = MAX_SIZE_MB * 1024 * 1024;\r\n \r\n if (file && file.size > MAX_SIZE_BYTES) {\r\n setError('Please upload a file less than 20MB');\r\n setFile('');\r\n } else if (file) {\r\n setError('');\r\n setFile(file);\r\n \r\n const formData = new FormData();\r\n formData.append('File', file);\r\n \r\n try {\r\n const response = await fetch(`${process.env.REACT_APP_BASE_URL}/api/file`, {\r\n method: 'POST',\r\n body: formData,\r\n });\r\n const result = await response.json();\r\n console.log('Success:', result);\r\n setUploadedFileId(result.id);\r\n setFileName(file.name);\r\n setFileSize(file.size);\r\n setFileFormat(file.type === 'text/csv' ? 'csv' : (file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' ? 'xlsx' : ''));\r\n } catch (error) {\r\n console.error('Error:', error);\r\n }\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if(props.EditMode){\r\n setFileName(props.editFileUpload?.['File Name'])\r\n setFileSize(props.editFileUpload?.['Size'])\r\n setFileFormat(props.editFileUpload?.['Format'])\r\n setUploadedFileId(props.editFileUpload?.FileStoreID)\r\n setAddFileUpload({period : props.editFileUpload.Period})\r\n }\r\n }, [props.editFileUpload,props.EditMode])\r\n\r\n\r\n function generateRandomId() {\r\n return 'file-' + Math.random().toString(36).substr(2, 9);\r\n }\r\n\r\n const hiddenFileInput = useRef(null);\r\n\r\n const deleteFile = async (fileId) => {\r\n try {\r\n const response = await axios.delete(`/api/file/${fileId}`);\r\n if (response.status === 200) {\r\n setUploadedFileId(null);\r\n setFileName(null);\r\n setFile('')\r\n } else {\r\n alert('file not deleted')\r\n }\r\n } catch (error) {\r\n alert('delete error')\r\n }\r\n };\r\n\r\n\r\n\r\n function deleteHandler() {\r\n setFileName('');\r\n setFileSize('');\r\n setFileFormat('');\r\n deleteFile(uploadedFileId)\r\n hiddenFileInput.current.value = null;\r\n }\r\n\r\n\r\n\r\n // const deleteFile = async (fileId) => {\r\n // try {\r\n // const response = await axios.delete(`/api/file/${fileId}`);\r\n // if (response.status === 200) {\r\n // setUploadedFileId(null);\r\n // setUploadedFileName(null)\r\n // } else {\r\n // alert('file not deleted')\r\n // }\r\n // } catch (error) {\r\n // // Handle error.\r\n // }\r\n // };\r\n\r\n // const DeleteUploadedFile = () =>{\r\n // deleteFile(uploadedFileId);\r\n // }\r\n\r\n\r\n\r\n // const handleFileUploadSubmit = () => {\r\n\r\n // const dispObj = [{\r\n // \"ID\":props.EditMode ? props.editFileUpload.ID :'',\r\n // \"FileName\": file.name,\r\n // \"FileFormat\": \"xsxl\",\r\n // \"FileStoreID\": uploadedFileId,\r\n // \"FileSize\": file.size,\r\n // \"Period\": addFileUpload.period,\r\n // \"VoiceNonVoice\": SelectedVoiceNonVoiceTab,\r\n // \"VoiceNonVoiceItemName\": SelectedVoiceNonVoiceItem,\r\n // \"CustomerID\": SelectedAccountDetails.CustomerID,\r\n // \"ServicedeskID\": SelectedAccountDetails.ServiceDeskID\r\n // }]\r\n // console.log('dispObj', dispObj)\r\n // dispatch(updateFileUploadDataStart(dispObj))\r\n // dispatch(getFileUploadData(SelectedAccountDetails.CustomerID ? SelectedAccountDetails.CustomerID : '', SelectedAccountDetails.ServiceDeskID ? SelectedAccountDetails.ServiceDeskID : '', SelectedVoiceNonVoiceItem))\r\n\r\n // props.handleFileUploadCancel()\r\n // }\r\n\r\n const [validation, setValidation] = useState('')\r\n\r\n const handleFileUploadSubmit = async () => {\r\n const dispObj = [{\r\n \"ID\": props.EditMode ? props.editFileUpload.ID : '',\r\n \"FileName\": fileName,\r\n \"FileFormat\": fileFormat,\r\n \"FileStoreID\": uploadedFileId,\r\n \"FileSize\": fileSize,\r\n \"Period\": addFileUpload.period,\r\n \"VoiceNonVoice\": SelectedVoiceNonVoiceTab,\r\n \"VoiceNonVoiceItemName\": SelectedVoiceNonVoiceItem,\r\n \"CustomerID\": SelectedAccountDetails.CustomerID,\r\n \"ServicedeskID\": SelectedAccountDetails.ServiceDeskID\r\n }];\r\n let ValidationData = {\r\n \"FileName\": fileName,\r\n \"FileFormat\": fileFormat,\r\n \"FileStoreID\": uploadedFileId,\r\n \"FileSize\": fileSize,\r\n \"Period\": addFileUpload.period,\r\n \"VoiceNonVoice\": SelectedVoiceNonVoiceTab,\r\n \"VoiceNonVoiceItemName\": SelectedVoiceNonVoiceItem,\r\n \"CustomerID\": SelectedAccountDetails.CustomerID,\r\n \"ServicedeskID\": SelectedAccountDetails.ServiceDeskID\r\n\r\n }\r\n console.log('ValidationData::::::::::', ValidationData, dispObj, props.editFileUpload)\r\n const isEmptyInput = Object.values(ValidationData).some(x => (x === null || x === '' || x === undefined));\r\n if(isEmptyInput){\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else{\r\n dispatch(updateFileUploadDataStart(dispObj));\r\n setTimeout(() => {\r\n dispatch(getFileUploadData(\r\n SelectedAccountDetails.CustomerID || '',\r\n SelectedAccountDetails.ServiceDeskID || '',\r\n SelectedVoiceNonVoiceItem\r\n ));\r\n }, 1000);\r\n props.handleFileUploadCancel();\r\n }\r\n }\r\n\r\n \r\n \r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n
{props.EditMode ? 'Edit Uploaded File' : 'File Upload'}
\r\n
\r\n
{validation}
\r\n
\r\n
\r\n )\r\n\r\n}\r\n","import React, { Fragment, useEffect, useState } from 'react'\r\nimport searchIcon from './../../../assets/onboard-images/Search_Icon.png'\r\nimport editIcon from './../../../assets/onboard-images/Edit_Icon.png'\r\n// import deleteIcon from './../../../assets/onboard-images/Delete_Icon.png'\r\nimport TooltipHandler from './../../../components/Onboard/OnboardComponents/TooltipHandler'\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { FileUploadFragment, FileUploadModalPopup } from './UploadModal'\r\nimport { getFileUploadData } from '../../../actions/uploads.action'\r\nimport { getRoleBasedView } from '../../../actions/Administration/admin.action'\r\n\r\n// const DATA = [\r\n// {\r\n// fileName: 'AbandonRateExcelReport',\r\n// fileType: 'CSV',\r\n// fileSize: '145KB',\r\n// uploadedDate: \"11/12/2021\",\r\n// period: 'Day - 09/05/2022',\r\n// uploader: \"GHOSH, AMITH (amith.ghosh@dxc.com)\",\r\n// },\r\n\r\n// {\r\n// fileName: 'GlobalSummaryReport_AUDI',\r\n// fileType: 'CSV',\r\n// fileSize: '455KB',\r\n// uploadedDate: \"09/05/2022\",\r\n// period: 'Week - 01/05/2022 to 07/05/2022',\r\n// uploader: \"GHOSH, AMITH (amith.ghosh@dxc.com)\",\r\n// },\r\n\r\n// {\r\n// fileName: 'OnboardAccountRetail',\r\n// fileType: 'CSV',\r\n// fileSize: '768KB',\r\n// uploadedDate: \"24/02/2022\",\r\n// period: 'Month - April 2022',\r\n// uploader: \"GHOSH, AMITH (amith.ghosh@dxc.com)\",\r\n// },\r\n// {\r\n// fileName: 'AdminRequestGSD_Insight',\r\n// fileType: 'XLSX',\r\n// fileSize: '346KB',\r\n// uploadedDate: \"05/04/2022\",\r\n// period: 'Custom Period - 01/05/2022 to 11/05/2022',\r\n// uploader: \"GHOSH, AMITH (amith.ghosh@dxc.com)\",\r\n// },]\r\n\r\nconst HEADERS = [\r\n { id: 1, caption: \"File Name\" },\r\n { id: 2, caption: \"Format\" },\r\n { id: 3, caption: \"Size\" },\r\n { id: 4, caption: \"Uploaded Date\" },\r\n { id: 5, caption: \"Period\" },\r\n { id: 6, caption: \"Created By\" },\r\n]\r\n\r\n\r\nfunction FileUploadhandler() {\r\n const dispatch = useDispatch();\r\n // let userInfo = useSelector((state) => state.userReducer.userInfo);\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const FileUploadData = useSelector((state) => state.uploadReducer.FileUploadData);\r\n const SelectedVoiceNonVoiceItem = useSelector((state) => state.uploadReducer.SelectedVoiceNonVoiceItem)\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n\r\n const [fileUploadData, setFileUploadData] = useState([]);\r\n\r\n useEffect(() => {\r\n if (SelectedVoiceNonVoiceItem) {\r\n dispatch(getFileUploadData(SelectedAccountDetails.CustomerID ? SelectedAccountDetails.CustomerID : '', SelectedAccountDetails.ServiceDeskID ? SelectedAccountDetails.ServiceDeskID : '', SelectedVoiceNonVoiceItem))\r\n }\r\n }, [dispatch, SelectedAccountDetails, SelectedVoiceNonVoiceItem]);\r\n\r\n useEffect(() => {\r\n setFileUploadData(FileUploadData)\r\n }, [FileUploadData])\r\n console.log('FileUploadData',FileUploadData)\r\n\r\n const [filter, setFilter] = useState('');\r\n // const [searchColumns, setSearchColumns] = useState(['File Name', 'Format', 'Period']);\r\n let searchColumns = ['File Name', 'Format', 'Period']\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n };\r\n\r\n // const [FileOriginData, setFileOriginData] = useState(DATA)\r\n const [showAddFileModal, setShowAddFileModal] = useState(false);\r\n const [addFileUpload, setAddFileUpload] = useState({});\r\n \r\n\r\n // const [editFileModal, showEditFileModal] = useState(false);\r\n\r\n // const selectedPeriodHandle = (value) => {\r\n // let perAr = value.split(' - ');\r\n // switch (perAr[0]) {\r\n // case 'Day':\r\n // case 'Month': return perAr\r\n // default: return [perAr[0], ...perAr[1].split(' to ')]\r\n // }\r\n // }\r\n\r\n const [EditMode,setEditMode] = useState(false)\r\n const onClickEditRow = (index, data) => {\r\n setEditMode(true)\r\n // setEditFileID(index);\r\n setAddFileUpload(data);\r\n setShowAddFileModal(true);\r\n }\r\n\r\n\r\n\r\n // const handleFileEditSubmit = () => {\r\n // const newFile = {\r\n // fileName: addFileUpload.fileName,\r\n // fileType: addFileUpload.fileType,\r\n // fileSize: addFileUpload.fileSize,\r\n // uploadedDate: addFileUpload.uploadedDate,\r\n // period: addFileUpload.period,\r\n // uploader: addFileUpload.uploader,\r\n // }\r\n // const newFiles = [...FileOriginData];\r\n // const index = FileOriginData.findIndex((_, index) => index === editFileID);\r\n // newFiles[index] = newFile;\r\n // setFileOriginData(newFiles);\r\n // console.log(newFiles)\r\n // // setEditFileID(null);\r\n // setShowAddFileModal(false);\r\n // }\r\n // const [deleteModal, showDeleteModal] = useState(false);\r\n // const [deleteFileID, setDeleteFileID] = useState(null);\r\n\r\n // const handleDeleteFile = () => {\r\n // const newFiles = [...FileOriginData];\r\n // const index = FileOriginData.findIndex((_, index) => index === deleteFileID);\r\n // newFiles.splice(index, 1);\r\n // setFileOriginData(newFiles);\r\n // setDeleteFileID(null)\r\n // showDeleteModal(false);\r\n // }\r\n\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n
setFilter(e.target.value)} />\r\n
\r\n
{ setShowAddFileModal(true);setEditMode(false)}}>\r\n UPLOAD\r\n \r\n
}\r\n \r\n \r\n {searchRows(fileUploadData)?.length === 0 ?\r\n \r\n \r\n \r\n \r\n {HEADERS.map(header => (\r\n {header.caption} {' '} \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n No records found. This data grid enables adding/editing the corresponding sub-categories.
\r\n
\r\n :\r\n \r\n \r\n \r\n {HEADERS.map(header => (\r\n {header.caption} {' '} \r\n \r\n \r\n \r\n {\r\n fileUploadData && searchRows(fileUploadData)?.map((data, index) => (\r\n \r\n {data?.['File Name']} \r\n {data.Format} \r\n {data.Size} \r\n {data?.['Uploaded Date']} \r\n {data.Period} \r\n {data?.['Name of the Uploader']} \r\n {RoleBasedView?.[0]?.['File Upload']?.[0]?.ReadWrite === 1 && \r\n { onClickEditRow(index, data) }}>\r\n \r\n }\r\n \r\n ))\r\n }\r\n \r\n
\r\n }\r\n {showAddFileModal && \r\n setShowAddFileModal(false)} editMode={false}\r\n EditMode={EditMode}\r\n />\r\n }\r\n {/* {editFileModal && \r\n showEditFileModal(false)}\r\n \r\n />\r\n } */}\r\n {/* {deleteModal && \r\n {\r\n showDeleteModal(false);\r\n setDeleteFileID(null);\r\n }}\r\n queueName={FileOriginData[FileOriginData.findIndex((_, index) => index === deleteFileID)].fileName + '.'\r\n + FileOriginData[FileOriginData.findIndex((_, index) => index === deleteFileID)].fileType}\r\n />\r\n } */}\r\n \r\n )\r\n}\r\n\r\nexport default FileUploadhandler","import React, { useEffect, useState } from 'react';\r\nimport TooltipHandler from '../../Onboard/OnboardComponents/TooltipHandler';\r\nimport './../Upload-Navigation/UploadNavigation.css';\r\nimport Information_Icon from './../../../assets/onboard-images/Information_Icon.png';\r\nimport ContractualSLAIcon from \"./../../../assets/images/Contractual_SLAs.png\";\r\nimport { useSelector } from 'react-redux';\r\n\r\n\r\nexport function isEditableForDate(selectedVolumeSlaDate) {\r\n // console.log('Selected SLA Date:', selectedVolumeSlaDate);\r\n const currentDate = new Date();\r\n const currentMonth = currentDate.getMonth(); // 0-indexed\r\n const currentYear = currentDate.getFullYear();\r\n\r\n // Check if selectedVolumeSlaDate is valid\r\n if (!selectedVolumeSlaDate) {\r\n // console.error('Invalid selectedVolumeSlaDate:', selectedVolumeSlaDate);\r\n return false; // Not editable if date is invalid\r\n }\r\n\r\n // Selected date\r\n const selectedDate = new Date(selectedVolumeSlaDate);\r\n const selectedMonth = selectedDate.getMonth();\r\n const selectedYear = selectedDate.getFullYear();\r\n\r\n // Determine if the selected date is in the current month\r\n const isCurrentMonth = (selectedYear === currentYear && selectedMonth === currentMonth);\r\n const isPreviousMonth = (selectedYear === currentYear && selectedMonth === currentMonth - 1) ||\r\n (selectedYear === currentYear - 1 && selectedMonth === 11 && currentMonth === 0); // for December to January\r\n const isFutureMonth = (selectedYear > currentYear) || \r\n (selectedYear === currentYear && selectedMonth > currentMonth);\r\n\r\n // console.log(`isCurrentMonth: ${isCurrentMonth}, isPreviousMonth: ${isPreviousMonth}, isFutureMonth: ${isFutureMonth}`);\r\n\r\n // Input is editable if it's the current month, the previous month, or any future month\r\n return isCurrentMonth || isPreviousMonth || isFutureMonth;\r\n}\r\n\r\nexport function FormInputFormat({ field, AddValueToUploadForm ,RBACEditable}) {\r\n const selectedVolumeSlaDate = useSelector((state) => state.uploadReducer.selectedVolumeSlaDate);\r\n const isEditable = isEditableForDate(selectedVolumeSlaDate);\r\n\r\n const [hasInteracted, setHasInteracted] = useState(false);\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n \r\n return [year,month, '01'].join('/');\r\n }\r\n\r\n const placeholderHandle = () => {\r\n switch (field.FormatType) {\r\n case '0':\r\n case 'Number = Numerator / Denominator': return '12345';\r\n case '%':\r\n case 'Percentage = Numerator / Denominator': return '45%';\r\n case 'hh:mm:ss':\r\n case 'Time = Numerator / Denominator': return 'HH:MM:SS';\r\n default: return '';\r\n }\r\n }\r\n\r\n const [inputValues, setInputValues] = useState({\r\n item1: '',\r\n item2: '',\r\n item3: ''\r\n });\r\n\r\n useEffect(() => {\r\n if (field) {\r\n const newValues = {\r\n item1: '',\r\n item2: field.Value !== null ? field.Value : '',\r\n item3: field.Divider !== null ? field.Divider : ''\r\n };\r\n\r\n // Check if field.Value or field.Divider is null to clear item2/item3\r\n if (field.Value === null) newValues.item2 = '';\r\n if (field.Divider === null) newValues.item3 = '';\r\n\r\n setInputValues(newValues);\r\n // Trigger calculation immediately after setting initial values\r\n calculateResult(newValues.item2, newValues.item3);\r\n }\r\n }, [field]);\r\n\r\n const calculateResult = (item2, item3) => {\r\n let result = '';\r\n if (item2 && item3) {\r\n switch (field.FormatType) {\r\n case '0':\r\n const num2 = parseFloat(item2);\r\n const num3 = parseFloat(item3);\r\n if (!isNaN(num2) && !isNaN(num3) && num3 !== 0) {\r\n result = (num2 / num3).toFixed(2);\r\n }\r\n break;\r\n case '%':\r\n const perc2 = parseFloat(item2);\r\n const perc3 = parseFloat(item3);\r\n if (!isNaN(perc2) && !isNaN(perc3) && perc3 !== 0) {\r\n result = ((perc2 / perc3) * 100).toFixed(2) + '%';\r\n }\r\n break;\r\n case 'hh:mm:ss':\r\n const seconds2 = parseInt(item2, 10) || 0;\r\n const seconds3 = parseInt(item3, 10) || 1; // Avoid division by zero\r\n if (seconds3 > 0) {\r\n const totalSecondsResult = seconds2 / seconds3;\r\n const hours = Math.floor(totalSecondsResult / 3600);\r\n const minutes = Math.floor((totalSecondsResult % 3600) / 60);\r\n const seconds = Math.floor(totalSecondsResult % 60);\r\n result = `${hours}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\r\n }\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n\r\n // Update item1 with the calculated result\r\n setInputValues(prevValues => ({\r\n ...prevValues,\r\n item1: result || ''\r\n }));\r\n };\r\n\r\n const onUploadFormChange = (event) => {\r\n const newFormData = { ...inputValues };\r\n const name = event.target.name;\r\n const value = event.target.value;\r\n\r\n // Allow only numeric input for time fields\r\n if (field.FormatType.startsWith('Time') && (name === 'item2' || name === 'item3')) {\r\n if (!/^\\d*$/.test(value)) {\r\n return; // Ignore non-numeric input\r\n }\r\n }\r\n\r\n newFormData[name] = value;\r\n setInputValues(newFormData);\r\n setHasInteracted(true);\r\n };\r\n\r\n // Calculate result whenever item2 or item3 changes\r\n useEffect(() => {\r\n const { item2, item3 } = inputValues;\r\n if (hasInteracted) {\r\n calculateResult(item2, item3);\r\n }\r\n }, [inputValues.item2, inputValues.item3, hasInteracted]);\r\n\r\n // Log inputValues whenever they change\r\n useEffect(() => {\r\n console.log('Current input values:', inputValues);\r\n }, [inputValues]);\r\n\r\n useEffect(() => {\r\n const { item2, item3 } = inputValues;\r\n if (hasInteracted) {\r\n const temp_Arr = {\r\n \"AccountSLAID\": field.AccountSLAID,\r\n \"Value\": item2,\r\n \"Divider\": item3\r\n };\r\n console.log('Submitting:', temp_Arr);\r\n AddValueToUploadForm(temp_Arr);\r\n setHasInteracted(false);\r\n }\r\n }, [inputValues.item2, inputValues.item3, hasInteracted]); // Keep this to handle subsequent changes\r\n\r\n return (\r\n \r\n \r\n {field.SLATemplate} \r\n {field.Contractual && }\r\n \r\n \r\n \r\n \r\n \r\n = \r\n / \r\n
\r\n \r\n );\r\n}\r\n\r\n\r\n\r\n\r\nexport function FormInputText({ field, AddValueToUploadForm, RBACEditable }) {\r\n const selectedVolumeSlaDate = useSelector((state) => state.uploadReducer.selectedVolumeSlaDate);\r\n const isEditable = isEditableForDate(selectedVolumeSlaDate);\r\n\r\n console.log('isEditable',isEditable)\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n \r\n return [year,month, '01'].join('/');\r\n }\r\n\r\n const fieldNamehandle = (fieldName) => {\r\n return fieldName.split(' ').join('_');\r\n }\r\n\r\n const placeholderHandle = () => {\r\n switch (field.FormatType) {\r\n case '0': return '12345'\r\n case '%': return '45%'\r\n case 'hh:mm:ss': return 'HH:MM:SS'\r\n default: { }\r\n }\r\n }\r\nconst[value,setValue] = useState()\r\nconst [error, setError] = useState('');\r\nuseEffect(() => {\r\n // Clear the value if the field is null\r\n if (field.Value === null) {\r\n setValue('');\r\n } else if (field.FormatType === 'hh:mm:ss') {\r\n // Convert seconds to hh:mm:ss for display\r\n setValue(secondsToTime(field.Value) || ''); \r\n } else {\r\n setValue(field.Value || ''); // Set to field.Value or empty string if undefined\r\n }\r\n}, [field]);\r\n\r\nconst validateInput = (value) => {\r\n switch (field.FormatType) {\r\n case '0':\r\n case '%':\r\n if (!/^\\d*$/.test(value)) {\r\n return 'Please enter a valid number.';\r\n }\r\n break;\r\n // case '%':\r\n // if (!/^\\d+(\\.\\d+)?%$/.test(value)) {\r\n // return 'Please enter a valid percentage (e.g., 45%).';\r\n // }\r\n // break;\r\n case 'hh:mm:ss':\r\n if (!/^\\d+:[0-5]\\d:[0-5]\\d$/.test(value)){\r\n return 'Please enter a valid time (HH:MM:SS).';\r\n }\r\n break;\r\n default:\r\n return '';\r\n }\r\n return '';\r\n}\r\n\r\nconst convertTimeToSeconds = (time) => {\r\n const [hours, minutes, seconds] = time.split(':').map(Number);\r\n return (hours * 3600) + (minutes * 60) + seconds;\r\n};\r\n\r\nconst secondsToTime = (seconds) => {\r\n const hours = Math.floor(seconds / 3600);\r\n const minutes = Math.floor((seconds % 3600) / 60);\r\n const secs = seconds % 60;\r\n return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;\r\n};\r\n\r\nconst onUploadFormChange = (event) => {\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n\r\n // Validate the input\r\n const validationError = validateInput(fieldValue);\r\n setError(validationError);\r\n setValue(fieldValue);\r\n\r\n const temp_Arr = {\r\n \"AccountSLAID\": field.AccountSLAID,\r\n \"Value\": fieldValue\r\n };\r\n\r\n // Update AddValueToUploadForm when the input is cleared or there's no validation error\r\n if (fieldValue === '' || !validationError) {\r\n if (field.FormatType === 'hh:mm:ss') {\r\n const seconds = convertTimeToSeconds(fieldValue);\r\n temp_Arr.Value = seconds;\r\n }\r\n AddValueToUploadForm(temp_Arr);\r\n }\r\n}\r\n return (\r\n <>\r\n \r\n \r\n )\r\n}\r\n\r\n\r\n","import React, { useEffect, useState } from 'react'\r\nimport './../Upload-Navigation/UploadNavigation.css'\r\nimport './FileUpload.css'\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\nimport ContractualSLAIcon from \"./../../../assets/images/Contractual_SLAs.png\";\r\nimport Download_Normal from './../../../assets/images/Download_Normal.png'\r\nimport closeIcon from './../../../assets/images/Close_Window_Icon.png'\r\nimport yesIcon from './../../../assets/onboard-images/Complete_Yes_Icon.png'\r\nimport { FormInputFormat, FormInputText, isEditableForDate } from './FormInput';\r\nimport UploadAdministration_Icon from './../../../assets/images/UploadAdministration_Icon.png'\r\n//import DATA from './DATA.json'\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { setDataAdministrationValidation, setSelectedVolumeSlaDate, updateVolumeSLAKPIDataStart } from '../../../actions/uploads.action';\r\nimport { getRoleBasedView } from '../../../actions/Administration/admin.action';\r\n \r\nfunction FormFieldHandler({ error, setError }) {\r\n const dispatch = useDispatch();\r\n const history = useHistory(); \r\n const volumeSlakpiSelectedTemplates = useSelector((state) => state.uploadReducer.volumeSlakpiSelectedTemplates);\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const SelectedVoiceNonVoiceItem = useSelector((state) => state.uploadReducer.SelectedVoiceNonVoiceItem);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n \r\n \r\n \r\nconst[Data,setData] = useState()\r\n \r\nuseEffect(()=>{\r\n setData(volumeSlakpiSelectedTemplates)\r\n},[volumeSlakpiSelectedTemplates])\r\n \r\n\r\nfunction formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [year,month, '01'].join('/');\r\n}\r\n \r\n const [selectedDate, setSelectedDate] = useState(formatDate(new Date()));\r\n\r\n const ValidFromDateHandler = (date) => {\r\n setSelectedDate((date === null || date === undefined) ? null : formatDate(date));\r\n }\r\n\r\nuseEffect(()=>{\r\n if(selectedDate){\r\n dispatch(setSelectedVolumeSlaDate(selectedDate))\r\n }\r\n},[dispatch,selectedDate])\r\n\r\n\r\n\r\n const FormFieldManager = (field) => {\r\n switch (field?.noCols) {\r\n case 1:\r\n return \r\n
Data has been saved successfully
\r\n
setDataSaved(false)} />
\r\n
Note: You can not edit data for the past months.\r\n If you need to change historical data, please raise a request through the GSD Insight \r\n history.push('/request')}> Request/Incident module .
\r\n}\r\n {Data?.length === 0 ?\r\n <>\r\n \r\n No Fields are selected to upload Volume Data \r\n
\r\n
history.push('/upload/dataAdmin')}>Upload Data Administration \r\n
\r\n \r\n : \r\n \r\n \r\n \r\n {Data?.map(field => (FormFieldManager(field)))}\r\n
\r\n \r\n \r\n SAVE\r\n \r\n \r\n \r\n }\r\n \r\n )\r\n}\r\n \r\nexport default FormFieldHandler","import React from 'react';\r\nimport { Accordion } from 'react-bootstrap';\r\nimport './../../Onboard/OnboardComponents/Accordion/Accordion.css';\r\n\r\nfunction UploadAccordion({ ACCORDION_INFO, openAccordion, onAccordionOpen }) {\r\n return (\r\n {/* Use activeKey for controlled component */}\r\n {\r\n ACCORDION_INFO.map((accordion, i) => (\r\n \r\n onAccordionOpen(i.toString())} // Call the handler on header click\r\n >\r\n {accordion.label} \r\n \r\n \r\n {accordion.Info}\r\n \r\n \r\n ))\r\n }\r\n \r\n );\r\n}\r\n\r\nexport default UploadAccordion;\r\n","import React, { useEffect, useState } from 'react';\r\nimport FileUploadhandler from '../File-Upload/FileUploadhandler';\r\nimport FormFieldHandler from '../File-Upload/FormFieldHandler';\r\nimport { getVolumeSlakpiSelectedTemplatesData } from '../../../actions/uploads.action';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport UploadAccordion from './UploadAccordion';\r\n\r\nfunction VoiceTabDetails(props) {\r\n const dispatch = useDispatch();\r\n const [openAccordion, setOpenAccordion] = useState(null);\r\n const [error, setError] = useState(null);\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const SelectedVoiceNonVoiceItem = useSelector((state) => state.uploadReducer.SelectedVoiceNonVoiceItem);\r\n const selectedVolumeSlaDate = useSelector((state) => state.uploadReducer.selectedVolumeSlaDate);\r\n const dataAdministrationValidation = useSelector((state) => state.uploadReducer.dataAdministrationValidation);\r\n\r\n console.log('dataAdministrationValidation',dataAdministrationValidation)\r\n\r\n const ACCORDION_INFO = [\r\n {\r\n id: 1,\r\n label: 'File Upload',\r\n Info: \r\n },\r\n {\r\n id: 3,\r\n label: 'SLA/KPI Data',\r\n Info: \r\n }\r\n ];\r\n\r\n useEffect(() => {\r\n if (openAccordion) {\r\n dispatch(getVolumeSlakpiSelectedTemplatesData(\r\n SelectedAccountDetails.CustomerID || '',\r\n SelectedAccountDetails.ServiceDeskID || '',\r\n openAccordion === '1' ? 'Volume' : 'SLA/KPI',\r\n selectedVolumeSlaDate,\r\n SelectedVoiceNonVoiceItem\r\n ));\r\n }\r\n }, [openAccordion, dispatch, SelectedAccountDetails, SelectedVoiceNonVoiceItem, selectedVolumeSlaDate]);\r\n\r\n const handleAccordionOpen = (id) => {\r\n // Check if the clicked accordion is already open\r\n if (openAccordion === id) {\r\n // If it's already open, check validation before closing\r\n if (dataAdministrationValidation) {\r\n setOpenAccordion(null); // Close the accordion if validation passes\r\n setError(null);\r\n } else {\r\n console.log('Data Not Saved. Cannot close this section.'); // Prevent closing if validation fails\r\n // Optionally, show an alert or message to the user\r\n setError('Validation failed. Cannot close this section.');\r\n }\r\n } else {\r\n // If trying to open a different accordion, validate first\r\n if (dataAdministrationValidation) {\r\n setOpenAccordion(id); // Update the state if validation passes\r\n setError(null);\r\n } else {\r\n console.log('Validation failed. Cannot open this section.'); // Prevent the accordion from opening\r\n // Optionally, show an alert or message to the user\r\n setError('Data Not Saved. Cannot open this section.');\r\n }\r\n }\r\n };\r\n\r\n\r\n console.log('openAccordion',openAccordion)\r\n\r\n return (\r\n \r\n \r\n \r\n AWS (ASD) Telephony \r\n
\r\n \r\n \r\n );\r\n}\r\n\r\nexport default VoiceTabDetails;\r\n","import React, { useEffect, useState } from 'react'\r\nimport backArrow from './../../../assets/onboard-images/Back_Arrow.png';\r\nimport FileUploadhandler from '../File-Upload/FileUploadhandler';\r\nimport SLAKPIUploadManager from '../File-Upload/SLAKPIUploadManager';\r\nimport VolumeUploadManager from '../File-Upload/VolumeUploadManager';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getNonvoiceCardsData, getVolumeSlakpiSelectedTemplatesData, setSelectedVoiceNonVoiceItem } from './../../../actions/uploads.action';\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\nimport FormFieldHandler from '../File-Upload/FormFieldHandler';\r\nimport UploadAccordion from './UploadAccordion';\r\n\r\n\r\nfunction NonVoicetabDetails(props) {\r\n const dispatch = useDispatch();\r\n const [error, setError] = useState(null);\r\n const ACCORDION_INFO = [\r\n {\r\n id: 1,\r\n label: 'File Upload',\r\n Info: \r\n },\r\n {\r\n id: 3,\r\n label: 'SLA/KPI Data',\r\n Info: \r\n }\r\n ];\r\n const [widget, setWidget] = useState();\r\n const widgetHandler = card => {\r\n if (card.Deleted === false) {\r\n setWidget(card)\r\n // props.widgetCardHandler('widget');\r\n }\r\n }\r\n\r\n console.log('widget',widget)\r\n \r\n\r\n const NonvoiceCardsData = useSelector((state) => state.uploadReducer.NonvoiceCardsData);\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const dataAdministrationValidation = useSelector((state) => state.uploadReducer.dataAdministrationValidation);\r\n\r\n console.log('NonvoiceCardsData',NonvoiceCardsData)\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [year,month, '01'].join('/');\r\n}\r\n\r\nconst [selectedDate, setSelectedDate] = useState(formatDate(new Date()));\r\n\r\n\r\nconst SelectedDateHandler = (date) => {\r\n setSelectedDate((date === null || date === undefined) ? null : formatDate(date));\r\n}\r\n\r\nconsole.log('selectedDate',selectedDate)\r\n\r\n useEffect(()=>{\r\n dispatch(getNonvoiceCardsData(SelectedAccountDetails.CustomerID ? SelectedAccountDetails.CustomerID : '', SelectedAccountDetails.ServiceDeskID ? SelectedAccountDetails.ServiceDeskID : '','Non-Voice',selectedDate))\r\n},[dispatch,SelectedAccountDetails,selectedDate])\r\n\r\n\r\n\r\n\r\n\r\nconst [openAccordion, setOpenAccordion] = useState(null);\r\n// const validation = true; // Assuming this will be dynamically set in a real application\r\nconst SelectedVoiceNonVoiceItem = useSelector((state) => state.uploadReducer.SelectedVoiceNonVoiceItem);\r\nconst selectedVolumeSlaDate = useSelector((state) => state.uploadReducer.selectedVolumeSlaDate);\r\n\r\nuseEffect(() => {\r\n console.log('useEffect triggered');\r\n console.log('openAccordion',openAccordion === '1')\r\n if (openAccordion) {\r\n console.log('Dispatching action'); // Debug log\r\n dispatch(getVolumeSlakpiSelectedTemplatesData(\r\n SelectedAccountDetails.CustomerID || '',\r\n SelectedAccountDetails.ServiceDeskID || '',\r\n openAccordion === '1' ? 'Volume' : 'SLA/KPI',\r\n selectedVolumeSlaDate,\r\n SelectedVoiceNonVoiceItem\r\n ));\r\n }\r\n}, [openAccordion, dispatch, SelectedAccountDetails, SelectedVoiceNonVoiceItem,selectedVolumeSlaDate]);\r\n\r\nconst handleAccordionOpen = (id) => {\r\n // Check if the clicked accordion is already open\r\n if (openAccordion === id) {\r\n // If it's already open, check validation before closing\r\n if (dataAdministrationValidation) {\r\n setOpenAccordion(null); // Close the accordion if validation passes\r\n setError(null);\r\n } else {\r\n console.log('Data Not Saved. Cannot close this section.'); // Prevent closing if validation fails\r\n // Optionally, show an alert or message to the user\r\n setError('Validation failed. Cannot close this section.');\r\n }\r\n } else {\r\n // If trying to open a different accordion, validate first\r\n if (dataAdministrationValidation) {\r\n setOpenAccordion(id); // Update the state if validation passes\r\n setError(null);\r\n } else {\r\n console.log('Validation failed. Cannot open this section.'); // Prevent the accordion from opening\r\n // Optionally, show an alert or message to the user\r\n setError('Data Not Saved. Cannot open this section.');\r\n }\r\n }\r\n};\r\n\r\n\r\n\r\n\r\n return (\r\n <>\r\n {!widget ? <> Select Month
\r\n \r\n SelectedDateHandler(date)}\r\n />\r\n
: ''}\r\n \r\n {!widget ? Non Voice Item
\r\n
Note: Greyed out items related data feed is managed globally
\r\n
:\r\n \r\n {widget && \r\n
{\r\n setWidget('')\r\n localStorage.removeItem('NonVoiceItem');\r\n // props.widgetCardHandler('nonvoice');\r\n }}>\r\n {widget.ItemName} \r\n
\r\n {/* {widget.ItemName === \"Chat Tool\" &&
}\r\n {widget.ItemName === 'workforce' &&
}\r\n {widget.ItemName === 'ticket' &&
}\r\n {widget.ItemName === 'email' &&
}\r\n {widget.ItemName === 'customer' &&
}\r\n {widget.ItemName === 'non_aquaa' &&
}\r\n {widget.ItemName === 'web' &&
} */}\r\n\r\n
\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default NonVoicetabDetails","import React, { useEffect, useState } from 'react';\r\nimport voiceImage from './../../../assets/onboard-images/Voice_Normal_Icon.png'\r\nimport voiceHoverImage from './../../../assets/onboard-images/Voice_Hover_and_Selected_Icon.png'\r\nimport nonVoiceImage from './../../../assets/onboard-images/NonVoice_Normal_Icon.png'\r\nimport nonVoiceHoverImage from './../../../assets/onboard-images/NonVoice_Hover_and_Selected_Icon.png'\r\nimport previewImage from './../../../assets/onboard-images/Preview_Normal_Icon.png'\r\nimport previewHoverImage from './../../../assets/onboard-images/Preview_Hover_and_Selected_Icon.png'\r\nimport UploadAdministration_Icon from './../../../assets/images/UploadAdministration_Icon.png'\r\n\r\n\r\nimport UploadPreview from './PreviewUpload';\r\nimport VoiceTabDetails from './VoiceUpload';\r\nimport NonVoicetabDetails from './NonVoiceUpload';\r\nimport { useHistory} from 'react-router-dom';\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { setSelectedVoiceNonVoiceItem, setSelectedVoiceNonVoiceTab } from './../../../actions/uploads.action';\r\nimport { ItemSelectionModal, ItemSelectionModalPopup } from '../Data-Administration/ItemSelectionModel';\r\n\r\n\r\n\r\n\r\nfunction Image({ onClick, src, children, onMouseEnter, onMouseLeave }) {\r\n return <>\r\n \r\n \r\n \r\n}\r\n\r\nfunction UploadNavigation() {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const SelectedVolumeFields = useSelector((state) => state.uploadReducer.SelectedVolumeFields);\r\n const SelectedSLAKPIFields = useSelector((state) => state.uploadReducer.SelectedSLAKPIFields);\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n\r\n const [generalTab, setGeneralTab] = useState('Voice');\r\n const [voiceImgSrc, setVoiceImgSrc] = useState();\r\n const [nonVoiceImgSrc, setNonvoiceImgSrc] = useState();\r\n const [previewImgSrc, setPreviewImgSrc] = useState();\r\n const [showNonvoiceItemSelectionModel,setShowNonvoiceItemSelectionModel] = useState(false)\r\n\r\n useEffect(() => {\r\n switch (generalTab) {\r\n case 'Voice': {\r\n setPreviewImgSrc(previewImage);\r\n setNonvoiceImgSrc(nonVoiceImage);\r\n setVoiceImgSrc(voiceHoverImage);\r\n break;\r\n }\r\n case 'Non-Voice': {\r\n setPreviewImgSrc(previewImage);\r\n setNonvoiceImgSrc(nonVoiceHoverImage);\r\n setVoiceImgSrc(voiceImage);\r\n break;\r\n }\r\n case 'Preview': {\r\n setPreviewImgSrc(previewHoverImage);\r\n setNonvoiceImgSrc(nonVoiceImage);\r\n setVoiceImgSrc(voiceImage);\r\n break;\r\n }\r\n default: { }\r\n }\r\n }, [generalTab]);\r\n\r\n const onClickViewDetails = title => {\r\n switch (title) {\r\n case 'Voice': setGeneralTab('Voice'); break;\r\n default: setGeneralTab('Non-Voice');\r\n }\r\n }\r\n\r\n const uploadTabHandler = () => {\r\n switch (generalTab) {\r\n case 'Voice':\r\n return \r\n default: { }\r\n }\r\n }\r\n\r\n useEffect(()=>{\r\n dispatch(setSelectedVoiceNonVoiceTab(generalTab))\r\n if(generalTab === 'Voice'){\r\n dispatch(setSelectedVoiceNonVoiceItem('AWS (ASD) Telephony'))\r\n }\r\n },[dispatch,generalTab])\r\n\r\n return (\r\n \r\n history.push('/welcome')} label1='Home' isActive2={true} label2='Upload' value2={()=>history.push('/upload')}\r\n isActive3={false} label3={SelectedAccountDetails?.['Account Name'] + '-' + SelectedAccountDetails?.['Site Name']} />\r\n \r\n {SelectedAccountDetails?.['Account Name']} - {SelectedAccountDetails?.['Site Name']}
\r\n
{ setShowNonvoiceItemSelectionModel(true) }}\r\n style={{ width: '290px'}}\r\n >\r\n Upload Data Administration \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n {setGeneralTab('Voice')}}\r\n onMouseEnter={() => generalTab !== 'Voice' && setVoiceImgSrc(voiceHoverImage)} onMouseLeave={() => generalTab !== 'Voice' && setVoiceImgSrc(voiceImage)}>\r\n \r\n Voice
{generalTab === 'Voice' &&
} \r\n setGeneralTab('Non-Voice')}\r\n onMouseEnter={() => generalTab !== 'Non-Voice' && setNonvoiceImgSrc(nonVoiceHoverImage)} onMouseLeave={() => generalTab !== 'Non-Voice' && setNonvoiceImgSrc(nonVoiceImage)}>\r\n \r\n Non Voice
\r\n {generalTab === 'Non-Voice' &&
} \r\n setGeneralTab('Preview')}\r\n onMouseEnter={() => generalTab !== 'Preview' && setPreviewImgSrc(previewHoverImage)} onMouseLeave={() => generalTab !== 'Preview' && setPreviewImgSrc(previewImage)}>\r\n \r\n Preview
\r\n {generalTab === 'Preview' &&
} \r\n \r\n
\r\n {uploadTabHandler()}\r\n \r\n\r\n\r\n {showNonvoiceItemSelectionModel && \r\n setShowNonvoiceItemSelectionModel(false)} \r\n />\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default UploadNavigation","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAQCAYAAAAMJL+VAAAABHNCSVQICAgIfAhkiAAAAkRJREFUOE+VVNtxnEAQ7MXo2+cIhMunKn2SgQgBJ2DtRmDIAGVABoucwJ0iEM6AT1f5VHUZ+P51x7pni8UcQlKZH1470z09PaMwufTaFs7hOxQ6dYRp9uYw/f/es76yGh/QNr/MPpxV4YE/GzisEKPAEXkP6EhBN79Np7/Y3Cnc8GwmZxxcFZ3UgxDQiV31F7hVPQoV4WfvkDKuZlwjuT2AT86LH/UIuLaZAzZMeJBAfm/xjK3/TxIkkDP4D898ZsKWzKvA/NvadpHj+5PZKl+WQ97sTD6Tq+J7ymr0a1JR0oxx7Vw6X1WM9sfOpIpo+yhGNtVtqCpluVuy3JDlgfeURFLWvFIKZZDgtb4MqtSK+tZM8PH+yZglJpQjyNYJ28BuqvOLuCub0iyWpMqxB66HWwJZYvgWiEjO5DUTi+zt6CLfmJgfJxZ7y5ZLIEzuZZ1K/s+mIpXiDAD1/c6U7yUfLcpmilziMBfjUTnciXvO5kBf26Q/EvlIn8dopCdDI7tFida2ogyXImmohEwvl5ofeiClNUEiGaxeoZpLJslwgcQPH2dn2rfbtT1w+pO5paeTLPOg2ZjM2zSAsKoQNGqs2KsJiIvQMbak75N5xSOAT8rSZUJFKq8xd5OsDBkY7+tnrhFW4Bs5gHhzAHuZ7iWDnAEMA6aZoGKQVNMSRBpWc8AkcTH0KfVrBOh4/xQILfXrBcDZFDs8MvFXlr9RJ5SDAWTprRh4x3u7tCqmQIsAHoTOwomukgXH8sm04OFONu3/rPG/LqdW13173ooAAAAASUVORK5CYII=\"","import { useEffect, useState } from \"react\";\r\nimport ReactModal from \"react-modal\";\r\nimport RequestDropdown from \"../../Onboard/OnboardComponents/Dropdown/RequestDropdown\";\r\nimport { OnboardSelect } from \"../../Onboard/OnboardComponents/Dropdown/Select\";\r\nimport Contractual_SLA_Icon from './../../../assets/images/Contractual_SLA_Icon.png';\r\nimport { useSelector } from \"react-redux\";\r\nimport { getSLAKPIVolumeTemplates, updateCustomTemplateStart } from \"../../../actions/uploads.action\";\r\nimport { useDispatch } from \"react-redux\";\r\n\r\nconst FormType = [\r\n { id: 1, value: \"Percentage\" },\r\n { id: 1, value: \"Time\" },\r\n { id: 1, value: \"Number\" },\r\n { id: 1, value: \"Percentage = Numerator / Denominator\" },\r\n { id: 1, value: \"Number = Numerator / Denominator\" },\r\n { id: 1, value: \"Time = Numerator / Denominator\" },\r\n\r\n]\r\nexport function AddFormModal(props) {\r\n const dispatch = useDispatch();\r\n \r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const SelectedSLAKPIVolumeTab = useSelector((state) => state.uploadReducer.SelectedSLAKPIVolumeTab);\r\n const selectedItem = useSelector((state) => state.uploadReducer.selectedItem);\r\n\r\n console.log('selectedItem',selectedItem)\r\n const [AddFormField, setAddFormField] = useState({});\r\n const [validation, setValidation] = useState('');\r\n const [check, setCheck] = useState(false);\r\n const editMode = props.editMode;\r\n useEffect(() => {\r\n editMode && setAddFormField(props.editFormField)\r\n editMode && setCheck(props.editFormField.contractual)\r\n }, [editMode,props])\r\n \r\n\r\n const onChangeContractual = (event) => {\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.checked;\r\n const newFormData = { ...AddFormField };\r\n newFormData[fieldName] = fieldValue;\r\n setAddFormField(newFormData)\r\n setCheck(!check)\r\n }\r\n\r\n \r\n const handleFormFieldChange = (event) => {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...AddFormField };\r\n newFormData[fieldName] = fieldValue;\r\n setAddFormField(newFormData)\r\n }\r\n\r\n const addValueToUser = (name, value) => {\r\n const newFormData = { ...AddFormField };\r\n if (name !== 'Select') {\r\n newFormData[name] = value;\r\n setAddFormField(newFormData)\r\n }\r\n }\r\n console.log('newFormData', AddFormField)\r\n\r\n let DispObj = [{\r\n \"Template\":AddFormField.name,\r\n \"Type\":AddFormField.type,\r\n \"Description\":AddFormField.description,\r\n \"Contractual\":AddFormField.contractual === true ? 1 : 0,\r\n \"CustomerID\":SelectedAccountDetails.CustomerID,\r\n \"Category\" :SelectedSLAKPIVolumeTab,\r\n \"ItemID\":selectedItem.ItemID\r\n }]\r\n\r\n const handleAddCustomTemplate = () => {\r\n\r\n const RequiredFields = {\r\n \"Template\":AddFormField.name,\r\n \"Type\":AddFormField.type,\r\n \"Description\":AddFormField.description,\r\n }\r\n const isEmptyInput = Object.values(RequiredFields).some(x => (x === null || x === '' || x === undefined));\r\n\r\n if(isEmptyInput){\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else{\r\n console.log('checked',DispObj)\r\n dispatch(updateCustomTemplateStart(DispObj))\r\n props.handleAddTemplateModelClose()\r\n setTimeout(() => {\r\n dispatch(getSLAKPIVolumeTemplates(\r\n SelectedAccountDetails.CustomerID || '',\r\n SelectedSLAKPIVolumeTab,selectedItem.ItemID\r\n ));\r\n }, 1000);\r\n }\r\n }\r\n\r\n const handleEditCustomTemplate = () =>{\r\n \r\n props.handleEditFormField(AddFormField)\r\n }\r\n\r\n console.log('DispObj',props.editFormField)\r\n\r\n return <>\r\n \r\n \r\n
\r\n {editMode ? 'Edit' : 'Add'} {props.title}\r\n
\r\n
\r\n {validation}
\r\n \r\n
Name * \r\n {editMode ?\r\n
\r\n {props.editFormField?.name}\r\n
\r\n :
}\r\n
\r\n
Type * \r\n {editMode ?\r\n
\r\n {props.editFormField?.newFormatType}\r\n
\r\n :
}\r\n
\r\n
Description * \r\n {editMode ?\r\n
\r\n {props.editFormField?.description}\r\n
\r\n :
}\r\n
\r\n
\r\n
\r\n Contractual SLAs/KPIs \r\n \r\n
\r\n\r\n \r\n \r\n {editMode ? 'UPDATE' : 'ADD'}\r\n \r\n \r\n CANCEL\r\n \r\n \r\n \r\n \r\n}\r\n\r\n\r\nexport function AddVolumePopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n background: '#63666A66 0% 0% no-repeat padding-box',\r\n opacity: '1',\r\n },\r\n content: {\r\n top: '50%',\r\n left: '50%',\r\n right: 'auto',\r\n bottom: 'auto',\r\n transform: 'translate(-50%, -50%)',\r\n margin:'20px',\r\n padding:'30px',\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\nexport function CancelFieldFragment(props) {\r\n return <>\r\n \r\n \r\n
\r\n Unsaved Changes\r\n
\r\n
\r\n\r\n
There are unsaved changes on this page. {props.tab} Data Selection Processs \r\n
\r\n
\r\n \r\n SAVE\r\n \r\n \r\n YES\r\n \r\n \r\n NO\r\n \r\n \r\n \r\n \r\n}\r\n\r\n\r\n\r\nexport function CancelYesNoFragment(props) {\r\n return <>\r\n \r\n \r\n
You have not selected any Fields File Upload Screen \r\n
\r\n
\r\n \r\n YES\r\n \r\n \r\n NO\r\n \r\n \r\n \r\n \r\n}","import React, { useState } from 'react';\r\nimport './DataAdmin.css';\r\nimport Contractual_SLA_Icon from './../../../assets/images/Contractual_SLA_Icon.png';\r\nimport edit from './../../../assets/images/Edit_Icon.png';\r\n\r\nexport function FormField(props) {\r\n const [showTooltip, setShowTooltip] = useState(false);\r\n\r\n const className = props.isSelected ? 'switch active' : 'switch';\r\n\r\n return (\r\n \r\n setShowTooltip(true)} \r\n onMouseLeave={() => setShowTooltip(false)}\r\n >\r\n
{props.fieldName}
\r\n {showTooltip && (\r\n
\r\n {props.isSelected && (\r\n \r\n Edit \r\n \r\n )}\r\n {props.description} \r\n \r\n )}\r\n
\r\n
\r\n {props.contractual && \r\n {props.toggleView === true &&
\r\n \r\n \r\n }\r\n
\r\n );\r\n}\r\n","import React, { useEffect, useState } from 'react';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { DeleteModalPopup } from '../../Onboard/OnboardComponents/Modals/DeleteModalPopup';\r\nimport { CancelModalPopup } from '../../Onboard/OnboardComponents/Modals/OnboardButtonsPopup';\r\nimport Contractual_SLA_Icon from './../../../assets/images/Contractual_SLA_Icon.png';\r\nimport { AddFormModal, AddVolumePopup, CancelFieldFragment } from './AddFormModal';\r\nimport { FormField } from './FormField';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { updateSelectedSLAKPIVolumeStart } from '../../../actions/uploads.action';\r\nimport { getRoleBasedView } from '../../../actions/Administration/admin.action';\r\n\r\nexport function FormFieldHandle(props) {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const SelectedAccountDetails = useSelector(state => state.uploadReducer.SelectedAccountDetails);\r\n const SelectedSLAKPIVolumeTab = useSelector(state => state.uploadReducer.SelectedSLAKPIVolumeTab);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n const selectedItem = useSelector((state) => state.uploadReducer.selectedItem);\r\n\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n\r\n const [editMode, setEditMode] = useState(false);\r\n const [showAddVolume, setShowAddVolume] = useState(false);\r\n const [editFormField, setEditFormField] = useState();\r\n const [editFieldID, setEditFieldID] = useState(null);\r\n const [selectedTemplates, setSelectedTemplates] = useState([]);\r\n const [checkedAll, setCheckedAll] = useState(false);\r\nconst[showCancelModal,setShowCancelModal] = useState(false)\r\n useEffect(() => {\r\n setSelectedTemplates(props.data || []);\r\n }, [props.data]);\r\n\r\n const toggleTemplate = (templateID) => {\r\n setSelectedTemplates(prevTemplates => {\r\n return prevTemplates.map(template => {\r\n if (template.templateID === templateID) {\r\n return { ...template, toggle: !template.toggle };\r\n }\r\n return template;\r\n });\r\n });\r\n // Call onTemplateChange with true to indicate changes\r\n props.onTemplateChange(true);\r\n };\r\n\r\n const handleSelectAll = (event) => {\r\n const isChecked = event.target.checked;\r\n const updatedTemplates = selectedTemplates.map(template => ({\r\n ...template,\r\n toggle: isChecked,\r\n }));\r\n setSelectedTemplates(updatedTemplates);\r\n setCheckedAll(isChecked);\r\n };\r\n\r\n const dispatchSelectedTemplatesHandler = () => {\r\n return selectedTemplates\r\n .filter(template => template.toggle)\r\n .map(data => ({\r\n AccountID: SelectedAccountDetails.CustomerID,\r\n SLATemplateID: data.templateID,\r\n ServicedeskID: SelectedAccountDetails.ServiceDeskID,\r\n Contractual: data.contractual ? 1 : 0,\r\n toggle: data.toggle ? 1 : 0,\r\n Category: SelectedSLAKPIVolumeTab,\r\n ItemID: selectedItem.ItemID\r\n }));\r\n };\r\n\r\n const onClickSaveFormField = () => {\r\n props.onTemplateChange(false);\r\n const templatesToDispatch = dispatchSelectedTemplatesHandler();\r\n dispatch(updateSelectedSLAKPIVolumeStart(templatesToDispatch));\r\n if(SelectedSLAKPIVolumeTab === 'Volume'){\r\n props.shiftToSLAKPITab()\r\n }\r\n else{\r\n history.push('/upload/account');\r\n }\r\n window.scrollTo(0, 0);\r\n \r\n };\r\n\r\n const onClickEditForm = (field, index) => {\r\n setEditMode(true);\r\n setEditFieldID(index);\r\n setShowAddVolume(true);\r\n setEditFormField(field);\r\n };\r\n\r\n const handleEditFormField = (editedRow) => {\r\n const updatedTemplates = selectedTemplates.map((template, index) => \r\n index === editFieldID ? { ...editedRow, id: editFieldID } : template\r\n );\r\n setSelectedTemplates(updatedTemplates);\r\n setEditFieldID(null);\r\n setShowAddVolume(false);\r\n };\r\n\r\n const onClickCancelButton = () => {\r\n const templatesAreEqual = JSON.stringify(props.data) === JSON.stringify(selectedTemplates);\r\n if (templatesAreEqual) {\r\n history.push('/upload');\r\n } else {\r\n setShowCancelModal(true);\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n Select a custom data field for your {props.tabName} data - {selectedItem.ItemName}
\r\n {RoleBasedView?.[0]?.['File Upload']?.[0]?.ReadWrite === 1 && { setShowAddVolume(true); setEditMode(false); }}> \r\n Add {props.tabName} Data \r\n
}\r\n \r\n \r\n {RoleBasedView?.[0]?.['File Upload']?.[0]?.ReadWrite === 1 && \r\n \r\n \r\n \r\n Select All\r\n
}\r\n \r\n Legend:
\r\n
Contractual SLAs/KPIs \r\n
\r\n \r\n {selectedTemplates.map((field, i) => (\r\n onClickEditForm(field, i)}\r\n isSelected={field.toggle}\r\n togglehandler={() => toggleTemplate(field.templateID)}\r\n toggleView={RoleBasedView?.[0]?.['File Upload']?.[0]?.ReadWrite === 1 ? true : false}\r\n />\r\n ))}\r\n \r\n {RoleBasedView?.[0]?.['File Upload']?.[0]?.ReadWrite === 1 && \r\n \r\n SAVE\r\n \r\n \r\n CANCEL\r\n \r\n }\r\n\r\n {showAddVolume && \r\n \r\n setShowAddVolume(false)} \r\n editFormField={editFormField} \r\n handleEditFormField={handleEditFormField}\r\n />\r\n \r\n }\r\n\r\n {showCancelModal && \r\n \r\n setShowCancelModal(false)}\r\n />\r\n \r\n }\r\n \r\n );\r\n}\r\n","import React, { useEffect, useState } from 'react';\r\nimport './DataAdmin.css'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb';\r\nimport FileUpload_Icon from './../../../assets/images/FileUpload_Icon.png';\r\nimport { Tab, Tabs } from 'react-bootstrap';\r\nimport { FormFieldHandle } from './UploadDataAdmin';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getSLAKPIVolumeTemplates, setSelectedSLAKPIFields, setSelectedSLAKPIVolumeTab, setSelectedVolumeFields } from '../../../actions/uploads.action';\r\n\r\n\r\n\r\nfunction DataAdministration() {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const SlaKpiVolumeTemplates = useSelector((state) => state.uploadReducer.SlaKpiVolumeTemplates);\r\n const SelectedAccountDetails = useSelector((state) => state.uploadReducer.SelectedAccountDetails);\r\n const dataAdministrationValidation = useSelector((state) => state.uploadReducer.dataAdministrationValidation);\r\n const selectedItem = useSelector((state) => state.uploadReducer.selectedItem);\r\n\r\n console.log('selectedItem',selectedItem.ItemID)\r\n\r\n\r\n const [validation, setValidation] = useState(false);\r\n const [error, setError] = useState(false);\r\n const [fieldKey, setfieldKey] = useState('Volume')\r\n console.log('validation',validation)\r\n const handleTabSelect = (key) => {\r\n if (validation === true) {\r\n setError(true)\r\n }\r\n else {\r\n setError(false)\r\n setfieldKey(key)\r\n }\r\n\r\n }\r\n\r\n useEffect(()=>{\r\n if(validation === false){\r\n setError(validation)\r\n }\r\n },[validation])\r\n\r\n const handler = (data) => {\r\n console.log('data', data)\r\n setValidation(data)\r\n }\r\n\r\n console.log('validation', validation)\r\n\r\n\r\n const shiftToSLAKPITab = () => {\r\n console.log('clicked:::::::::::::::::::::::::::::')\r\n setfieldKey('sla/kpi')\r\n }\r\n\r\n useEffect(() => {\r\n dispatch(getSLAKPIVolumeTemplates(SelectedAccountDetails.CustomerID ? SelectedAccountDetails.CustomerID : '', fieldKey,selectedItem.ItemID))\r\n dispatch(setSelectedSLAKPIVolumeTab(fieldKey))\r\n }, [dispatch, fieldKey, SelectedAccountDetails])\r\n\r\n\r\n console.log('field', fieldKey)\r\n\r\n return (\r\n <>\r\n { validation ? setError(true) : history.push('/welcome') }} label1='Home' isActive2={true} label2='Uploads' value2={() => { validation ? setError(true) : history.push('/upload') }}\r\n isActive3={false} label3={SelectedAccountDetails?.['Account Name'] + '-' + SelectedAccountDetails?.['Site Name']} />\r\n \r\n \r\n {SelectedAccountDetails?.['Account Name']} - {SelectedAccountDetails?.['Site Name']} - Upload Data Administration
\r\n
{ validation ? setError(true) : history.push('/upload/account') }}>\r\n File Upload - Voice & Non Voice \r\n \r\n
\r\n {error && }\r\n \r\n \r\n \r\n {\r\n console.log(fields) \r\n dispatch(setSelectedVolumeFields(fields))\r\n }} onTemplateChange={(templateChanges) => handler(templateChanges)} shiftToSLAKPITab={shiftToSLAKPITab}/>\r\n \r\n \r\n handler(templateChanges)}\r\n onSaveButtonClick={fields => dispatch(setSelectedSLAKPIFields(fields))} />\r\n \r\n \r\n \r\n\r\n \r\n \r\n )\r\n}\r\n\r\nexport default DataAdministration","\r\nimport React from \"react\"\r\nimport { Bar } from \"react-chartjs-2\"\r\n\r\nexport function VerticalBarChart(props) {\r\n return (<>\r\n \r\n \r\n \r\n {props.heading}
\r\n \r\n \r\n {props.yAxesTitle}
\r\n \r\n
\r\n \r\n {props.xAxesTitle} \r\n \r\n \r\n )\r\n}\r\n\r\n\r\n\r\nexport function StackedBarCharts(props) {\r\n return (<>\r\n \r\n \r\n \r\n \r\n \r\n \r\n {props.yAxesTitle}
\r\n \r\n
\r\n \r\n {props.xAxesTitle} \r\n \r\n \r\n )\r\n}\r\n\r\n\r\nexport function StackedLineBarCharts(props) {\r\n return (<>\r\n \r\n \r\n \r\n {props.heading}
\r\n \r\n \r\n \r\n {props.yAxesTitle}
\r\n \r\n
\r\n \r\n {props.xAxesTitle} \r\n \r\n \r\n )\r\n}","import ReactModal from \"react-modal\";\r\nimport Download_Icon from \"../../assets/images/Download_Icon.png\"\r\nimport CloseWindow_Normal from '../../assets/images/CloseWindow_Normal.png';\r\nimport { Bar } from 'react-chartjs-2';\r\nimport './Analytics.css';\r\nimport * as htmlToImage from 'html-to-image';\r\n\r\n\r\nconst exportAsPicture = (id, image) => {\r\n htmlToImage.toPng(document.getElementById(id), {\r\n quality: 0.90,\r\n })\r\n .then(function (dataUrl) {\r\n let link = document.createElement('a');\r\n link.download = image;\r\n link.href = dataUrl;\r\n link.click()\r\n })\r\n .catch(function (error) {\r\n console.error('oops, something went wrong!', error);\r\n });\r\n}\r\n\r\nexport function CalendarModel(props) {\r\n\r\n return <>\r\n \r\n \r\n {props.heading === true ? \r\n {`${props.day.format('DD')}/${props.day.format('MM')}/${props.day.format('YYYY')}`} - Standard Telephony By Half Hour\r\n
:
}\r\n \r\n \r\n \r\n {props.heading === true ? \r\n
{props.yAxesTitle}
\r\n
{props.target}
\r\n
}\r\n \r\n \r\n {props.yAxesTitle}
\r\n \r\n
\r\n \r\n {props.xAxesTitle} \r\n \r\n}\r\n\r\nexport function CalendarvaluesModel(props) {\r\n\r\n return <>\r\n \r\n \r\n \r\n {props.heading}\r\n
\r\n \r\n \r\n \r\n {props.title === true ? \r\n
{props.yAxesTitle}
{props.target}
\r\n
}\r\n \r\n \r\n {props.yAxesTitle}
\r\n \r\n
\r\n \r\n {props.xAxesTitle} \r\n \r\n}\r\n\r\nexport function PastMonthTrendsModel(props) {\r\n\r\n return <>\r\n \r\n \r\n \r\n {props.heading}\r\n
\r\n \r\n \r\n\r\n \r\n {props.yAxesTitle}
\r\n \r\n
\r\n \r\n {props.xAxesTitle} \r\n \r\n}\r\n\r\n\r\nexport function CalendarModelpopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '10em',\r\n left: '15em',\r\n width: '1100px',\r\n height: '550px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n","import React, { useEffect, useState } from 'react'\r\nimport { VerticalBarChart } from './Bar-charts';\r\nimport './Analytics.css';\r\nimport moment from 'moment';\r\nimport './Analytics.css'\r\nimport { CalendarModel, CalendarModelpopup } from './DTM-ModalPopup';\r\nimport Download_Icon from \"../../assets/images/Download_Normal.png\"\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getDTMAnalyticsData, getDTMAnalyticsHalfHour, getDTMAnalyticsMonth, updateRegionalSiteCustomerID, updateRegionalSiteCustomerName } from '../../actions/regionalSite.action';\r\nimport AdminBreadcrumb from '../Administration/General/Admin-breadcrumb';\r\nimport * as htmlToImage from 'html-to-image';\r\nimport { saveAccountLocationName, saveSelectedMenuItem, updateDTMReportDate, updateSelectedAccountName } from '../../actions/tabMenu.action';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useLocation } from 'react-router';\r\n\r\nfunction DTMAnalyticsHandler() {\r\n\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const location = useLocation();\r\n // const customerID = useSelector((state) => state.regionalSiteReducer.rgnCustId);\r\n // const serviceID = useSelector((state) => state.regionalSiteReducer.rgnServiceID);\r\n\r\nconst reportcustomerID = useSelector((state) => state.regionalSiteReducer.rgnCustId);\r\nconst reportserviceID = useSelector((state) => state.regionalSiteReducer.rgnServiceID);\r\nconst selectedSLA = useSelector((state) => state.regionalSiteReducer.selectedSLA);\r\nconst reportcustomerName = useSelector((state) => state.regionalSiteReducer.rgnCustName);\r\nlet selectedCustIDServID = useSelector((state) => state.welcomePageReducer.selectedCustIDServID);\r\n console.log('selectedCustIDServID',selectedCustIDServID)\r\n const customerID = reportcustomerID === null ? selectedCustIDServID.CustomerID : reportcustomerID;\r\n const serviceID = reportserviceID === '' ? selectedCustIDServID.ServiceDeskID : reportserviceID;\r\n const customerName = reportcustomerName === null ? selectedCustIDServID.CustomerName : reportcustomerName\r\n const selectedDate = useSelector((state) => state.tabReducer.DTMReportPageDate);\r\n const DTMAnalytics = useSelector((state) => state.regionalSiteReducer.DTMAnalytics);\r\n const DTMHalfHour = useSelector((state) => state.regionalSiteReducer.DTMHalfHour);\r\n const DTMMonthlyData = useSelector((state) => state.regionalSiteReducer.DTMMonthlyData);\r\n \r\n // const initialDate = useSelector((state) => state.userReducer.selectedDate);\r\n\r\n const formatDate = (date) => {\r\n let d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n return [year, month, '01'].join('-');\r\n\r\n }\r\n\r\n\r\n const formatTime = (value) => {\r\n let totalSeconds = value;\r\n let hours = Math.floor(totalSeconds / 3600);\r\n totalSeconds %= 3600; let minutes = Math.floor(totalSeconds / 60);\r\n let seconds = parseInt(totalSeconds % 60);\r\n minutes = String(minutes).padStart(2, \"0\");\r\n hours = String(hours).padStart(2, \"0\");\r\n seconds = String(seconds).padStart(2, \"0\");\r\n if (seconds.length < 2)\r\n seconds = '0' + seconds;\r\n return (hours + \":\" + minutes + \":\" + seconds);\r\n }\r\n\r\n const [currentDate, setCurrentDate] = useState(moment())\r\n useEffect(() => {\r\n let newDate = new Date(selectedDate)\r\n let year = !isNaN(newDate?.getFullYear()) ? newDate?.getFullYear() : new Date().getFullYear();\r\n let month = !isNaN(newDate?.getMonth()) ? newDate?.getMonth() : new Date().getMonth();\r\n setCurrentDate(moment().set({ 'year': year, 'month': month }))\r\n const myDate = moment().set({ 'year': year, 'month': month })\r\n let obj1 = {\r\n // customerID:location.pathname=== 'reports' ? customerID : '60',\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '',\r\n date: formatDate(myDate),\r\n item: selectedSLA.slaItem\r\n }\r\n let obj3 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '12+month',\r\n date: formatDate(myDate),\r\n item: selectedSLA.slaItem\r\n }\r\n dispatch(getDTMAnalyticsData(obj1))\r\n dispatch(getDTMAnalyticsMonth(obj3))\r\n }, [])\r\n\r\n\r\n\r\n const [DTMAnalyticsData, setDTMAnalyticsData] = useState([]);\r\n const [DTMHalfHourData, setDTMHalfHourData] = useState([]);\r\n const [DTMMonthlyInfo, setDTMMonthlyInfo] = useState([]);\r\n\r\n useEffect(() => {\r\n setDTMAnalyticsData(DTMAnalytics);\r\n setDTMHalfHourData(DTMHalfHour);\r\n setDTMMonthlyInfo(DTMMonthlyData)\r\n }, [DTMAnalytics, DTMHalfHour, DTMMonthlyData])\r\n\r\n\r\n function OnClickBarHandle(label) {\r\n let newDate = new Date(label?.chart?.tooltip?.title?.[0]);\r\n let year = newDate.getFullYear();\r\n let month = newDate.getMonth();\r\n // dispatch(updateDTMReportDate(formatDate(newDate)));\r\n let obj1 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '',\r\n date: formatDate(newDate || new Date()),\r\n item: selectedSLA.slaItem\r\n }\r\n let obj3 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '12+month',\r\n date: formatDate(newDate || new Date()),\r\n item: selectedSLA.slaItem\r\n }\r\n setShowOffCanvasModel(false)\r\n dispatch(getDTMAnalyticsData(obj1))\r\n dispatch(getDTMAnalyticsMonth(obj3))\r\n setCurrentDate(moment().set({ 'year': year, 'month': month }));\r\n\r\n }\r\n\r\n const monthlyoptions = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n x1: {\r\n display: true,\r\n title: {\r\n display: false,\r\n text: 'October 21'\r\n }\r\n },\r\n y: {\r\n display: true,\r\n title: {\r\n display: false,\r\n text: 'Calls Handled'\r\n },\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n onClick: (label => OnClickBarHandle(label)),\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n displayColors: false,\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: function (context) {\r\n return context[0].label\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString() + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`\r\n }\r\n }\r\n }\r\n },\r\n onHover: (event, chartElement) => {\r\n const target = event.native ? event.native.target : event.target;\r\n target.style.cursor = chartElement[0] ? 'pointer' : 'default';\r\n }\r\n };\r\n const timeoptions = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n xAxes: {\r\n ticks: {\r\n maxRotation: 90,\r\n minRotation: 90\r\n },\r\n },\r\n yAxes: {\r\n display: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: function (context) {\r\n return context[0].label\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString() \r\n }\r\n }\r\n }\r\n },\r\n }\r\n \r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n x1: {\r\n display: true,\r\n },\r\n y: {\r\n display: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: context => {\r\n return context[0].label.includes(':') ? context[0].label : `${currentDate.format('MM')}/${context[0].label}/${currentDate.format('YYYY')}`\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString()\r\n }\r\n }\r\n }\r\n },\r\n }\r\n const DTMoptions = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n x1: {\r\n display: true,\r\n },\r\n y: {\r\n display: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: context => {\r\n return context[0].label.includes(':') ? context[0].label : `${currentDate.format('MM')}/${context[0].label}/${currentDate.format('YYYY')}`\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString() + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`\r\n }\r\n }\r\n }\r\n },\r\n }\r\n const [showOffCanvasModel, setShowOffCanvasModel] = useState(false)\r\n const [showCalendarModel, setShowCalendarModel] = useState(false);\r\n function daysInMonth(d) {\r\n let date = new Date(d)\r\n return new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();\r\n }\r\n const DTMLabelsHandler = (label) => {\r\n switch (label) {\r\n case 'dailyPerformance':\r\n case 'DTM': {\r\n const temp_arr = [];\r\n let n = 1;\r\n while (n <= daysInMonth(currentDate)) {\r\n temp_arr.push(n);\r\n n++;\r\n }\r\n return temp_arr;\r\n }\r\n case 'CalendarPopup':\r\n case 'HandledDetails': {\r\n const temp_arr = [];\r\n let a = 0\r\n while (a <= 23) {\r\n temp_arr.push(`${a}:00`);\r\n temp_arr.push(`${a}:30`);\r\n a++;\r\n }\r\n return temp_arr;\r\n }\r\n case 'pastMonthTrends': {\r\n var monthName = [\"Jan\", \"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"];\r\n var d = new Date(currentDate);\r\n d.setDate(1);\r\n let temp_arr = [];\r\n for (let i = 12; i >= 0; i--) {\r\n temp_arr[i] = monthName[d.getMonth()] + ' ' + d.getFullYear()\r\n d.setMonth(d.getMonth() - 1);\r\n }\r\n // let temp_arr = Array.apply(0, Array(12)).map(function (_, i) { return `${moment().month(i).format('MMM')} ${moment().month(i).format('YYYY')}` });\r\n return temp_arr\r\n }\r\n\r\n default: { }\r\n }\r\n }\r\n\r\n const dataFixedvValues = (data) => {\r\n switch (selectedSLA.format) {\r\n case 'Percentage': return (data?.fvalue * 100)?.toFixed(2)\r\n case 'Number': return (data?.fvalue);\r\n case 'Time': return (data?.fvalue)?.toFixed(2)\r\n default: { }\r\n }\r\n }\r\n\r\n const DTMChartsDataHandler = (data, label) => {\r\n let temp_dtm = [];\r\n data?.[label]?.map((data, i) => {\r\n temp_dtm[i] = dataFixedvValues(data)\r\n })\r\n return temp_dtm;\r\n }\r\n\r\n\r\n\r\n const [day, setDay] = useState('')\r\n const [targetValue, setTargetValue] = useState(null)\r\n const calendarClickHandle = (day) => {\r\n debugger\r\n setDay(day);\r\n let temp = DTMChartsDataHandler(DTMAnalyticsData, 'dailyperformance');\r\n const dt = new Date(day).getDate();\r\n setTargetValue(temp[dt - 1]);\r\n let obj2 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: 'halfhour',\r\n date: day.format('MM/DD/YYYY'),\r\n item: selectedSLA.item\r\n }\r\n dispatch(getDTMAnalyticsHalfHour(obj2))\r\n setShowCalendarModel(true);\r\n }\r\n const CalendarDailyValues = (day) => {\r\n let temp_dtm = [];\r\n DTMAnalyticsData?.dailyperformance?.map((data, i) => {\r\n temp_dtm[i] = data?.fvalue\r\n })\r\n const dt = new Date(day).getDate();\r\n let val = temp_dtm[dt - 1]\r\n switch (selectedSLA.format) {\r\n case 'Percentage': {\r\n if (!isNaN(val) && val !== null) return parseFloat(val * 100)?.toFixed(2) + ' %';\r\n return ''\r\n }\r\n case 'Time': {\r\n if (!isNaN(val) && val !== null) return formatTime(val);\r\n return ''\r\n }\r\n case 'Number': {\r\n if (!isNaN(val) && val !== null) return (val);\r\n return\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n const weekDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\r\n const [calendar, setCalendar] = useState([])\r\n const [weekOfTheYear, setWeekOfTheYear] = useState([]);\r\n const startingDate = currentDate.clone().startOf('month').format('MM/DD/YYYY');\r\n const endingDate = currentDate.clone().endOf('month').format('MM/DD/YYYY');\r\n function beforeToday(day) {\r\n if (day.isBefore(new Date(startingDate), \"day\")) return \"Yes its working\"\r\n }\r\n function afterToday(day) {\r\n if (day.isAfter(new Date(endingDate), \"day\")) return \"Yes its working\"\r\n }\r\n\r\n useEffect(() => {\r\n const startDay = currentDate.clone().startOf(\"month\").startOf(\"week\");\r\n const endDay = currentDate.clone().endOf(\"month\").endOf(\"week\");\r\n const day = startDay.clone().subtract(1, \"day\");\r\n const temp_calendar = [];\r\n while (day.isBefore(endDay, \"day\")) {\r\n temp_calendar.push(Array(7).fill(0).map(() => day.add(1, \"day\").clone()))\r\n }\r\n const temp_arr_one = temp_calendar[0]?.map(day => {\r\n if (Number(day.format('DD')) > 20) return '';\r\n else return day\r\n })\r\n const temp_arr_two = temp_calendar[temp_calendar.length - 1]?.map(day => {\r\n if (Number(day.format('DD')) < 10) return '';\r\n else return day\r\n })\r\n temp_calendar[0] = temp_arr_one;\r\n temp_calendar[temp_calendar.length - 1] = temp_arr_two;\r\n setCalendar(temp_calendar);\r\n let temp_week = temp_calendar?.map((week) => {\r\n if (temp_calendar?.indexOf(week) === 0) return week?.[week?.length - 1].format('WW');\r\n else return week[1] ? week[1].format('WW') : week[0].format('WW');\r\n });\r\n setWeekOfTheYear(temp_week);\r\n }, [currentDate]);\r\n\r\n const exportAsPicture = (id, image) => {\r\n htmlToImage.toPng(document.getElementById(id), {\r\n quality: 0.90,\r\n })\r\n .then(function (dataUrl) {\r\n let link = document.createElement('a');\r\n link.download = image;\r\n link.href = dataUrl;\r\n link.click()\r\n })\r\n .catch(function (error) {\r\n console.error('oops, something went wrong!', error);\r\n });\r\n }\r\n\r\n const ReportRedirect = () => {\r\n if (DTMAnalytics?.servicedesk?.id) {\r\n window.localStorage.setItem('ServiceDeskID', DTMAnalytics?.servicedesk?.id);\r\n }\r\n if (DTMAnalytics?.customer?.id) {\r\n window.localStorage.setItem('CustomerID', DTMAnalytics?.customer?.id);\r\n }\r\n dispatch(updateRegionalSiteCustomerID(DTMAnalytics?.customer?.id));\r\n dispatch(updateRegionalSiteCustomerName(DTMAnalytics?.customer?.name));\r\n dispatch(updateSelectedAccountName(DTMAnalytics?.customer?.name));\r\n dispatch(saveAccountLocationName(DTMAnalytics?.servicedesk?.name));\r\n dispatch(saveSelectedMenuItem(\"reports\"));\r\n dispatch(updateDTMReportDate(new Date(formatDate(currentDate))));\r\n history.push(\"/reports\");\r\n }\r\n return (\r\n <>\r\n {/* history.push('/welcome')} label1='Home' isActive2={true} label2='Reports' value2={()=>history.push('/regional')}\r\n isActive3={true} label3={customerName} value3={ReportRedirect} isActive4={true}\r\n label4='DTM' value4={ReportRedirect} isActive5={true} label5={currentDate.format('MMMM') + ' - ' + currentDate.format('YYYY')} value5={ReportRedirect}\r\n label6={\"Analytics - \" + selectedSLA.slaItem} isActive6={false}\r\n />\r\n \r\n {customerName} - {selectedSLA.slaItem} - {`${currentDate.format('MMMM')} ${currentDate.format('YYYY')}`}
\r\n { exportAsPicture('whatever', selectedSLA.slaItem) }}>\r\n
\r\n
\r\n \r\n
{selectedSLA.slaItem}
\r\n
{selectedSLA.format === 'Time' ? formatTime(DTMAnalyticsData?.currentmonth?.[0]?.fvalue) : DTMAnalyticsData?.currentmonth?.[0]?.value}
\r\n
setShowOffCanvasModel(true)} >
Past 12 Months Trend
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {currentDate.format('YYYY')} {weekDays.map((week, i) => ({week} ))}\r\n \r\n \r\n \r\n {calendar?.map((week, i) => (\r\n {weekOfTheYear?.[i]}
Week \r\n {week?.map((day) => (\r\n {day && day.format(\"DD MMM\").toString()}
\r\n calendarClickHandle(day)}>{CalendarDailyValues(day)}
\r\n ))} ))}\r\n \r\n
\r\n \r\n \r\n \r\n setShowCalendarModel(false)}\r\n yAxesTitle={selectedSLA.slaItem + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`}\r\n xAxesTitle={`${currentDate.format('MMMM')}, ${currentDate.format('YYYY')}`} id='calendar'\r\n image={selectedSLA.slaItem + `_${selectedSLA.format === 'Percentage' ? '(%)' : ''}_halfHour_report`}\r\n labels={DTMLabelsHandler('CalendarPopup')} data={DTMChartsDataHandler(DTMHalfHourData, 'halfhourdata')} color='#00968F'\r\n options={ timeoptions}\r\n />\r\n \r\n }\r\n {showOffCanvasModel && \r\n setShowOffCanvasModel(false)}\r\n yAxesTitle={selectedSLA.slaItem + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`}\r\n xAxesTitle='Month & Year' id='yearly'\r\n image={selectedSLA.slaItem + `_${selectedSLA.format === 'Percentage' ? '(%)' : ''}_yearly_report`}\r\n labels={DTMLabelsHandler('pastMonthTrends')} data={DTMChartsDataHandler(DTMMonthlyInfo, 'monthdata')} color='#00A3E1'\r\n options={monthlyoptions}\r\n />\r\n \r\n }\r\n \r\n )\r\n}\r\n\r\nexport default DTMAnalyticsHandler;","import React, { useEffect, useState } from 'react'\r\nimport { StackedBarCharts, StackedLineBarCharts, VerticalBarChart } from './Bar-charts';\r\nimport './Analytics.css';\r\nimport moment from 'moment';\r\nimport { CalendarModelpopup, CalendarvaluesModel, PastMonthTrendsModel } from './DTM-ModalPopup';\r\nimport AboveRequiredTarget_Status from \"../../assets/images/AboveRequiredTarget_Status.png\"\r\nimport BelowMinimalTarget_Status from \"../../assets/images/BelowMinimalTarget_Status.png\"\r\nimport BelowMinimalTargetIcon from \"../../assets/images/BelowMinimalTarget_Status.png\";\r\nimport Download_Icon from \"../../assets/images/Download_Normal.png\"\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getDTMAnalyticsData, getDTMAnalyticsHalfHour, getDTMAnalyticsMonth, updateRegionalSiteCustomerID, updateRegionalSiteCustomerName } from '../../actions/regionalSite.action';\r\nimport { useHistory, useLocation } from 'react-router-dom';\r\nimport AdminBreadcrumb from '../Administration/General/Admin-breadcrumb';\r\nimport * as htmlToImage from 'html-to-image';\r\nimport { saveAccountLocationName, saveSelectedMenuItem, updateDTMReportDate, updateSelectedAccountName } from '../../actions/tabMenu.action';\r\n\r\nfunction daysInMonth(d) {\r\n let date = new Date(d)\r\n return new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();\r\n}\r\n\r\n\r\nfunction DTMAnalyticsSLA() {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const location = useLocation();\r\n // const customerID = useSelector((state) => state.regionalSiteReducer.rgnCustId);\r\n // const serviceID = useSelector((state) => state.regionalSiteReducer.rgnServiceID);\r\n const reportcustomerID = useSelector((state) => state.regionalSiteReducer.rgnCustId);\r\nconst reportserviceID = useSelector((state) => state.regionalSiteReducer.rgnServiceID);\r\nconst selectedSLA = useSelector((state) => state.regionalSiteReducer.selectedSLA);\r\nconst reportcustomerName = useSelector((state) => state.regionalSiteReducer.rgnCustName);\r\nlet selectedCustIDServID = useSelector((state) => state.welcomePageReducer.selectedCustIDServID);\r\n console.log('selectedCustIDServID',selectedCustIDServID)\r\n const customerID = reportcustomerID === null ? selectedCustIDServID.CustomerID : reportcustomerID;\r\n const serviceID = reportserviceID === '' ? selectedCustIDServID.ServiceDeskID : reportserviceID;\r\n const customerName = reportcustomerName === null ? selectedCustIDServID.CustomerName : reportcustomerName\r\n\r\n const selectedDate = useSelector((state) => state.tabReducer.DTMReportPageDate);\r\n const DTMAnalytics = useSelector((state) => state.regionalSiteReducer.DTMAnalytics);\r\n const DTMHalfHour = useSelector((state) => state.regionalSiteReducer.DTMHalfHour);\r\n const DTMMonthlyData = useSelector((state) => state.regionalSiteReducer.DTMMonthlyData);\r\n function formatDatehandle(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n\r\n const formatTime = (value) => {\r\n let totalSeconds = value;\r\n let hours = Math.floor(totalSeconds / 3600);\r\n totalSeconds %= 3600; let minutes = Math.floor(totalSeconds / 60);\r\n let seconds = parseInt(totalSeconds % 60);\r\n minutes = String(minutes).padStart(2, \"0\");\r\n hours = String(hours).padStart(2, \"0\");\r\n seconds = String(seconds).padStart(2, \"0\");\r\n if (seconds.length < 2)\r\n seconds = '0' + seconds;\r\n return (hours + \":\" + minutes + \":\" + seconds);\r\n\r\n\r\n }\r\n\r\n const formatDate = (date) => {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n return [year, month, '01'].join('-');\r\n }\r\n\r\n const [currentDate, setCurrentDate] = useState(moment())\r\n useEffect(() => {\r\n let newDate = new Date(selectedDate)\r\n let year = !isNaN(newDate?.getFullYear()) ? newDate?.getFullYear() : new Date().getFullYear();\r\n let month = !isNaN(newDate?.getMonth()) ? newDate?.getMonth() : new Date().getMonth();\r\n setCurrentDate(moment().set({ 'year': year, 'month': month }))\r\n const myDate = moment().set({ 'year': year, 'month': month })\r\n let obj1 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '',\r\n date: formatDate(myDate),\r\n item: selectedSLA.item\r\n }\r\n let obj3 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '12+month',\r\n date: formatDate(myDate),\r\n item: selectedSLA.item\r\n }\r\n dispatch(getDTMAnalyticsData(obj1))\r\n dispatch(getDTMAnalyticsMonth(obj3))\r\n }, [])\r\n\r\n const [DTMAnalyticsData, setDTMAnalyticsData] = useState([]);\r\n const [DTMHalfHourData, setDTMHalfHourData] = useState([]);\r\n const [DTMMonthlyInfo, setDTMMonthlyInfo] = useState([]);\r\n\r\n useEffect(() => {\r\n setDTMAnalyticsData(DTMAnalytics);\r\n setDTMHalfHourData(DTMHalfHour);\r\n setDTMMonthlyInfo(DTMMonthlyData)\r\n }, [DTMAnalytics, DTMHalfHour, DTMMonthlyData])\r\n\r\n\r\n const [showCalendarvalueModel, setShowCalendarvalueModel] = useState(false);\r\n const [dropdownIndex, setDropdownIndex] = useState(null);\r\n const [weekIndex, setWeekIndex] = useState(null);\r\n const [showTooltip, setShowTooltip] = useState(false);\r\n const [showPastMonthTrends, setShowPastMonthTrends] = useState(false);\r\n const [showPerformanceVolume, setShowPerformanceVolume] = useState(false);\r\n\r\n\r\n\r\n\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n xAxes: {\r\n display: true,\r\n stacked: true\r\n },\r\n yAxes: {\r\n display: true,\r\n stacked: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n displayColors: false,\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: context => {\r\n return context[0].label.includes(':') ? context[0].label : `${currentDate.format('MM')}/${context[0].label}/${currentDate.format('YYYY')}`\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString()\r\n }\r\n }\r\n }\r\n },\r\n }\r\n\r\n const DTMoptions = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n xAxes: {\r\n display: true,\r\n stacked: true\r\n },\r\n yAxes: {\r\n display: true,\r\n stacked: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n displayColors: false,\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: context => {\r\n return context[0].label.includes(':') ? context[0].label : `${currentDate.format('MM')}/${context[0].label}/${currentDate.format('YYYY')}`\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString() + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`\r\n }\r\n }\r\n }\r\n },\r\n }\r\n\r\n const monthlyoptions = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n xAxes: {\r\n display: true,\r\n stacked: true\r\n },\r\n yAxes: {\r\n display: true,\r\n stacked: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n onClick: (context) => {\r\n setShowPerformanceVolume(false);\r\n setShowPastMonthTrends(false)\r\n let newDate = new Date(context?.chart?.tooltip?.title?.[0]);\r\n let year = !isNaN(newDate?.getFullYear()) ? newDate?.getFullYear() : new Date().getFullYear();\r\n let month = !isNaN(newDate?.getMonth()) ? newDate?.getMonth() : new Date().getMonth();\r\n setCurrentDate(moment().set({ 'year': year, 'month': month }))\r\n const myDate = moment().set({ 'year': year, 'month': month })\r\n let obj1 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '',\r\n date: formatDate(myDate),\r\n item: selectedSLA.item\r\n }\r\n \r\n let obj3 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '12+month',\r\n date: formatDate(myDate),\r\n item: selectedSLA.item\r\n }\r\n dispatch(getDTMAnalyticsData(obj1))\r\n dispatch(getDTMAnalyticsMonth(obj3))\r\n },\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n displayColors: false,\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: context => {\r\n return context[0].label.includes(':') ? context[0].label : `${context[0].label}`\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString() + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`\r\n }\r\n }\r\n }\r\n },\r\n onHover: (event, chartElement) => {\r\n const target = event.native ? event.native.target : event.target;\r\n target.style.cursor = chartElement[0] ? 'pointer' : 'default';\r\n }\r\n }\r\n\r\n const performanceoptions = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n legend: {\r\n display: false,\r\n\r\n },\r\n title: {\r\n display: false,\r\n },\r\n scales: {\r\n xAxes: {\r\n display: true,\r\n stacked: true\r\n },\r\n yAxes: {\r\n display: true,\r\n stacked: true,\r\n ticks: {\r\n callback: function (value) {\r\n return selectedSLA.format === 'Time' ? formatTime(value) : value\r\n }\r\n },\r\n },\r\n },\r\n onClick: (context) => {\r\n setShowPerformanceVolume(false);\r\n setShowPastMonthTrends(false)\r\n let newDate = new Date(context?.chart?.tooltip?.title?.[0]);\r\n let year = !isNaN(newDate?.getFullYear()) ? newDate?.getFullYear() : new Date().getFullYear();\r\n let month = !isNaN(newDate?.getMonth()) ? newDate?.getMonth() : new Date().getMonth();\r\n setCurrentDate(moment().set({ 'year': year, 'month': month }))\r\n const myDate = moment().set({ 'year': year, 'month': month })\r\n let obj1 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '',\r\n date: formatDate(myDate),\r\n item: selectedSLA.item\r\n }\r\n \r\n let obj3 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: '12+month',\r\n date: formatDate(myDate),\r\n item: selectedSLA.item\r\n }\r\n dispatch(getDTMAnalyticsData(obj1))\r\n dispatch(getDTMAnalyticsMonth(obj3))\r\n },\r\n plugins: {\r\n legend: { display: false, position: 'right' },\r\n tooltip: {\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: { weight: '400' },\r\n displayColors: false,\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize: 5,\r\n bodyFont: { weight: 'bolder' },\r\n callbacks: {\r\n title: context => {\r\n return context[0].label.includes(':') ? context[0].label : `${context[0].label}`\r\n },\r\n label: function (context) {\r\n return selectedSLA.format === 'Time' ? formatTime(context.raw) : context.raw.toString() \r\n }\r\n }\r\n }\r\n },\r\n onHover: (event, chartElement) => {\r\n const target = event.native ? event.native.target : event.target;\r\n target.style.cursor = chartElement[0] ? 'pointer' : 'default';\r\n }\r\n }\r\n\r\n\r\n const DTMLabelsHandler = (label) => {\r\n switch (label) {\r\n case 'dailyPerformance':\r\n case 'DTM': {\r\n const temp_arr = [];\r\n let n = 1;\r\n while (n <= daysInMonth(currentDate)) {\r\n temp_arr.push(n);\r\n n++;\r\n }\r\n return temp_arr;\r\n }\r\n case 'CalendarPopup':\r\n case 'HalfHour': {\r\n const temp_arr = [];\r\n let a = 0\r\n while (a <= 23) {\r\n temp_arr.push(`${a}:00`);\r\n temp_arr.push(`${a}:30`);\r\n a++;\r\n }\r\n return temp_arr;\r\n }\r\n case 'performanceVolume':\r\n case 'pastMonthTrends': {\r\n var monthName = [\"Jan\", \"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"];\r\n var d = new Date(currentDate);\r\n d.setDate(1);\r\n let temp_arr = [];\r\n for (let i = 12; i >= 0; i--) {\r\n temp_arr[i] = monthName[d.getMonth()] + ' ' + d.getFullYear()\r\n d.setMonth(d.getMonth() - 1);\r\n }\r\n // let temp_arr = Array.apply(0, Array(12)).map(function (_, i) { return `${moment().month(i).format('MMM')} ${moment().month(i).format('YYYY')}` });\r\n return temp_arr\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n const DTMChartsDataHandler = (label) => {\r\n switch (label) {\r\n case 'DTM': {\r\n let temp_dtm = [];\r\n DTMAnalyticsData?.daytomonth?.map((data, i) => {\r\n temp_dtm[i] = selectedSLA.format === 'Percentage' ? parseFloat(((data?.numerator / data?.denominator) * 100).toFixed(2)) : parseInt(data?.numerator)\r\n })\r\n return temp_dtm;\r\n }\r\n case 'dailyPerformance': {\r\n let temp_daily = [];\r\n DTMAnalyticsData?.dailyperformance?.map((data, i) => {\r\n temp_daily[i] = selectedSLA.format === 'Percentage' ? data?.numerator : data?.numerator - data?.denominator\r\n })\r\n return temp_daily;\r\n }\r\n case 'HalfHour': {\r\n let temp_half = [];\r\n DTMAnalyticsData?.halfhourdata?.map((data, i) => {\r\n temp_half[i] = selectedSLA.format === 'Percentage' ? data?.numerator : data?.numerator - data?.denominator\r\n })\r\n return temp_half;\r\n }\r\n case 'CalendarPopup': {\r\n let temp_half = [];\r\n DTMHalfHourData?.halfhourdata?.map((data, i) => {\r\n temp_half[i] = selectedSLA.format === 'Percentage' ? data?.numerator : data?.numerator - data?.denominator\r\n })\r\n return temp_half;\r\n }\r\n case 'pastMonthTrends': {\r\n let temp_pastMonth = [];\r\n DTMMonthlyInfo?.monthdata?.map((data, i) => {\r\n temp_pastMonth[i] = selectedSLA.format === 'Percentage' ? parseFloat(((data?.numerator / data?.denominator) * 100).toFixed(2)) : data?.numerator - data?.denominator\r\n })\r\n return temp_pastMonth;\r\n }\r\n case 'performanceVolume': {\r\n let temp_perf = [];\r\n DTMMonthlyInfo?.monthdata?.map((data, i) => {\r\n temp_perf[i] = selectedSLA.format === 'Percentage' ? data?.numerator : data?.numerator - data?.denominator\r\n })\r\n return temp_perf;\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n const DTMStackedChartsDataHandler = (label) => {\r\n\r\n let temp_arr = [...DTMLabelsHandler(label)];\r\n switch (label) {\r\n case 'DTM': {\r\n let temp_dtm = [];\r\n DTMAnalyticsData?.daytomonth?.map((data, i) => {\r\n temp_dtm[i] = parseInt(data?.difference)\r\n })\r\n return temp_dtm;\r\n }\r\n case 'dailyPerformance': {\r\n let temp_daily = [];\r\n DTMAnalyticsData?.dailyperformance?.map((data, i) => {\r\n temp_daily[i] = selectedSLA.format === 'Percentage' ? data?.difference : data?.denominator\r\n })\r\n return temp_daily;\r\n }\r\n case 'HalfHour': {\r\n let temp_half = [];\r\n DTMAnalyticsData?.halfhourdata?.map((data, i) => {\r\n temp_half[i] = selectedSLA.format === 'Percentage' ? data?.difference : data?.denominator\r\n })\r\n return temp_half;\r\n }\r\n case 'CalendarPopup': {\r\n let temp_half = [];\r\n DTMHalfHourData?.halfhourdata?.map((data, i) => {\r\n temp_half[i] = selectedSLA.format === 'Percentage' ? data?.difference : data?.denominator\r\n })\r\n return temp_half;\r\n }\r\n case 'pastMonthTrends': {\r\n let temp_perf = [];\r\n return temp_perf;\r\n }\r\n case 'performanceVolume': {\r\n let temp_perf = [];\r\n DTMMonthlyInfo?.monthdata?.map((data, i) => {\r\n temp_perf[i] = selectedSLA.format === 'Percentage' ? data?.difference : parseInt(data?.denominator)\r\n })\r\n return temp_perf;\r\n }\r\n default: { }\r\n\r\n }\r\n };\r\n\r\n\r\n const DTMLineBarBgAdjustHandle = (color) => {\r\n switch (color) {\r\n case 'red': return BelowMinimalTarget_Status;\r\n case 'green': return AboveRequiredTarget_Status;\r\n case 'yellow': return BelowMinimalTargetIcon;\r\n default: return;\r\n }\r\n }\r\n\r\n const [day, setDay] = useState('');\r\n const [targetValue, setTargetValue] = useState(null)\r\n\r\n const calendarClickHandle = (day) => {\r\n setDay(day);\r\n const dt = new Date(day).getDate();\r\n let obj2 = {\r\n customerID: customerID,\r\n serviceID: serviceID,\r\n view: 'halfhour',\r\n date: day.format('MM/DD/YYYY'),\r\n item: selectedSLA.item\r\n }\r\n dispatch(getDTMAnalyticsHalfHour(obj2))\r\n setTargetValue(DTMAnalyticsData?.dailyperformance?.[dt - 1]);\r\n setShowCalendarvalueModel(true);\r\n }\r\n const CalendarDailyValues = (day) => {\r\n const dt = new Date(day).getDate();\r\n return DTMAnalyticsData?.dailyperformance?.[dt - 1]\r\n }\r\n\r\n\r\n const weekDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\r\n const [calendar, setCalendar] = useState([])\r\n const [weekOfTheYear, setWeekOfTheYear] = useState([]);\r\n const startingDate = currentDate.clone().startOf('month').format('MM/DD/YYYY');\r\n const endingDate = currentDate.clone().endOf('month').format('MM/DD/YYYY');\r\n function beforeToday(day) {\r\n if (day.isBefore(new Date(startingDate), \"day\")) return \"Yes its working\"\r\n }\r\n function afterToday(day) {\r\n if (day.isAfter(new Date(endingDate), \"day\")) return \"Yes its working\"\r\n }\r\n\r\n useEffect(() => {\r\n const startDay = currentDate.clone().startOf(\"month\").startOf(\"week\");\r\n const endDay = currentDate.clone().endOf(\"month\").endOf(\"week\");\r\n const day = startDay.clone().subtract(1, \"day\");\r\n const temp_calendar = [];\r\n while (day.isBefore(endDay, \"day\")) {\r\n temp_calendar.push(Array(7).fill(0).map(() => day.add(1, \"day\").clone()))\r\n }\r\n const temp_arr_one = temp_calendar[0].map(day => {\r\n if (Number(day.format('DD')) > 20) return '';\r\n else return day\r\n })\r\n const temp_arr_two = temp_calendar[temp_calendar.length - 1].map(day => {\r\n if (Number(day.format('DD')) < 10) return '';\r\n else return day\r\n })\r\n temp_calendar[0] = temp_arr_one;\r\n temp_calendar[temp_calendar.length - 1] = temp_arr_two;\r\n setCalendar(temp_calendar);\r\n let temp_week = temp_calendar.map((week) => {\r\n if (temp_calendar?.indexOf(week) === 0) return week?.[week?.length - 1].format('WW');\r\n else return week?.[1] ? week?.[1]?.format('WW') : week?.[0]?.format('WW');\r\n });\r\n setWeekOfTheYear(temp_week);\r\n }, [currentDate]);\r\n\r\n const exportAsPicture = (id, image) => {\r\n htmlToImage.toPng(document.getElementById(id), {\r\n quality: 0.90,\r\n })\r\n .then(function (dataUrl) {\r\n let link = document.createElement('a');\r\n link.download = image;\r\n link.href = dataUrl;\r\n link.click()\r\n })\r\n .catch(function (error) {\r\n console.error('oops, something went wrong!', error);\r\n });\r\n }\r\n const ReportRedirect = () => {\r\n if (DTMAnalytics?.servicedesk?.id) {\r\n window.localStorage.setItem('ServiceDeskID', DTMAnalytics?.servicedesk?.id);\r\n }\r\n if (DTMAnalytics?.customer?.id) {\r\n window.localStorage.setItem('CustomerID', DTMAnalytics?.customer?.id);\r\n }\r\n dispatch(updateRegionalSiteCustomerID(DTMAnalytics?.customer?.id));\r\n dispatch(updateRegionalSiteCustomerName(DTMAnalytics?.customer?.name));\r\n dispatch(updateSelectedAccountName(DTMAnalytics?.customer?.name));\r\n dispatch(saveAccountLocationName(DTMAnalytics?.servicedesk?.name));\r\n dispatch(saveSelectedMenuItem(\"reports\"));\r\n dispatch(updateDTMReportDate(new Date(formatDate(currentDate))));\r\n history.push(\"/reports\");\r\n }\r\n\r\n return (\r\n <>\r\n {/* history.push('/welcome')} label1='Home' isActive2={true} label2='Reports' value2={()=>history.push('/regional')}\r\n isActive3={true} label3={customerName} value3={ReportRedirect} isActive4={true}\r\n label4='DTM' value4={ReportRedirect} isActive5={true} label5={currentDate.format('MMMM') + ' - ' + currentDate.format('YYYY')} value5={ReportRedirect}\r\n label6={\"Analytics - \" + selectedSLA.slaItem} isActive6={false}\r\n />\r\n \r\n \r\n {customerName} - {selectedSLA.slaItem} - {`${currentDate.format('MMMM')} ${currentDate.format('YYYY')}`}
\r\n { exportAsPicture('whatever', selectedSLA.slaItem) }} style={{ cursor: 'pointer' }}>\r\n
\r\n
\r\n \r\n
{selectedSLA.slaItem}
\r\n
{selectedSLA.format === 'Time' ? formatTime(DTMAnalyticsData?.currentmonth?.[0]?.fvalue) : DTMAnalyticsData?.currentmonth?.[0]?.value}
\r\n
\r\n
Expected Target
\r\n
{selectedSLA.format === 'Time' ? formatTime(DTMAnalyticsData?.slasetting?.[0]?.expectedtarget) : DTMAnalyticsData?.slasetting?.[0]?.expectedtarget + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`}
\r\n
\r\n
Minimum Target
\r\n
{selectedSLA.format === 'Time' ? formatTime(DTMAnalyticsData?.slasetting?.[0]?.minimumtarget) : DTMAnalyticsData?.slasetting?.[0]?.minimumtarget + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`}
\r\n
setShowPastMonthTrends(true)}> Past 12 Months Trend
\r\n setShowPerformanceVolume(true)}>Performance Vs Volume
\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n {currentDate.format('YYYY')} {weekDays.map((week, i) => ({week} ))}\r\n \r\n \r\n \r\n {calendar.map((week, i) => (\r\n {weekOfTheYear[i]}
Week \r\n {week.map((day, idx) => (\r\n {day && day.format(\"DD MMM\").toString()}
\r\n\r\n CalendarDailyValues(day) && calendarClickHandle(day)}\r\n onMouseOver={() => {\r\n setDropdownIndex(i);\r\n setWeekIndex(idx);\r\n CalendarDailyValues(day) && setShowTooltip(true)\r\n }}\r\n onMouseLeave={() => {\r\n setShowTooltip(false);\r\n setWeekIndex(null);\r\n setDropdownIndex(null);\r\n }}>\r\n {CalendarDailyValues(day) && (selectedSLA.format === 'Time' ? formatTime(CalendarDailyValues(day)?.numerator) : CalendarDailyValues(day)?.value)}\r\n \r\n {(showTooltip && dropdownIndex === i && weekIndex === idx) && (\r\n
\r\n {day.format('MM/DD/YYYY')} \r\n {DTMAnalyticsData?.slasetting?.[0]?.numerator} : {CalendarDailyValues(day)?.numerator}
\r\n {DTMAnalyticsData?.slasetting?.[0]?.denominator} : {CalendarDailyValues(day)?.denominator}
\r\n {DTMAnalyticsData?.slasetting?.[0]?.difference} : {CalendarDailyValues(day)?.difference}
\r\n )}\r\n {(CalendarDailyValues(day)?.color !== null && CalendarDailyValues(day)) &&
}\r\n
))\r\n } ))}\r\n \r\n
\r\n \r\n \r\n {\r\n showCalendarvalueModel && \r\n setShowCalendarvalueModel(false)}\r\n heading={`(${formatDatehandle(targetValue?.date)}) - Standard Telephony By Half Hour `} title={true}\r\n yAxesTitle={selectedSLA.slaItem + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}` }\r\n target={targetValue?.value} Arrcolor={targetValue?.color}\r\n numerator={DTMAnalyticsData?.slasetting?.[0]?.numerator}\r\n difference={DTMAnalyticsData?.slasetting?.[0]?.difference}\r\n xAxesTitle={`${currentDate.format('MMMM')}, ${currentDate.format('YYYY')}`}\r\n labels={DTMLabelsHandler('CalendarPopup')} data={DTMChartsDataHandler('CalendarPopup')}\r\n stackedData={DTMStackedChartsDataHandler('CalendarPopup')} color='#006975' stackedColor='#FFCD00'\r\n options={options} />\r\n \r\n }\r\n\r\n {\r\n showPerformanceVolume && \r\n setShowPerformanceVolume(false)}\r\n heading='' title={false} target='' \r\n yAxesTitle={selectedSLA.slaItem + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`}\r\n numerator={DTMAnalyticsData?.slasetting?.[0]?.numerator}\r\n difference={DTMAnalyticsData?.slasetting?.[0]?.difference}\r\n xAxesTitle={`${currentDate.format('MMMM')}, ${currentDate.format('YYYY')}`}\r\n labels={DTMLabelsHandler('performanceVolume')} data={DTMChartsDataHandler('performanceVolume')}\r\n stackedData={DTMStackedChartsDataHandler('performanceVolume')} color='#006975' stackedColor='#FFCD00'\r\n options={performanceoptions} />\r\n\r\n \r\n }\r\n {\r\n showPastMonthTrends && \r\n setShowPastMonthTrends(false)}\r\n heading=''\r\n yAxesTitle={selectedSLA.slaItem + ` ${selectedSLA.format === 'Percentage' ? '(%)' : ''}`}\r\n xAxesTitle={`${currentDate.format('MMMM')}, ${currentDate.format('YYYY')}`}\r\n labels={DTMLabelsHandler('pastMonthTrends')} data={DTMChartsDataHandler('pastMonthTrends')}\r\n color='#6CC24A'\r\n options={monthlyoptions} />\r\n \r\n }\r\n \r\n )\r\n}\r\n\r\nexport default DTMAnalyticsSLA","import React, { useEffect, useRef } from 'react'\r\nimport './AccountAdmin.css';\r\nimport Admindata from './Admin.json';\r\nimport menuIcon from '../../../assets/images/Dotted_ContextMenu_Icon.png';\r\nimport ActivateDisabledIcon from '../../../assets/images/Activate_Disabled_Icon.png';\r\nimport ActivateIcon from '../../../assets/images/Activate_Icon.png';\r\nimport StaffAdministration_Icon from '../../../assets/images/StaffAdministration_Icon.png';\r\nimport searchIcon from './../../../assets/onboard-images/Search_Icon.png';\r\nimport edit_Icon from '../../../assets/images/Edit_Icon.png';\r\nimport SLADataExclusion_Icon from '../../../assets/images/SLADataExclusion_Icon.png';\r\nimport SLAFailureExemption_Icon from '../../../assets/images/SLAFailureExemption_Icon.png';\r\nimport Eye_ViewDetails_Icon from '../../../assets/onboard-images/Eye_ViewDetails_Icon.png';\r\n\r\nimport { useState } from 'react';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { ActivateModelPopup, ActivationRequestModal, RequestSentModal } from './ActivationModel';\r\nimport AdminBreadcrumb from '../General/Admin-breadcrumb';\r\nimport TooltipHandler from '../../Onboard/OnboardComponents/TooltipHandler';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getAdminAccounts, getRoleBasedView, saveStaffAdminActiveTab, updateAccountDetails } from '../../../actions/Administration/admin.action';\r\nimport { saveAccountSite, viewAccountDetails } from '../../../actions/Onboard.action';\r\nimport { getMappedEmployees } from '../../../actions/Administration/staffAdmin.action';\r\nconst AdminLanding = () => {\r\n const history = useHistory()\r\n const dispatch = useDispatch();\r\n let AdminAccounts = useSelector((state) => state.adminAccountReducer.AdminAccounts);\r\n const mappedEmployees = useSelector((state) => state.staffAdminReducer.mappedEmployees);\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n const [filter, setFilter] = useState('');\r\n const [showRequestForm, setShowRequestForm] = useState(false);\r\n const [showRequestSent, setShowRequestSent] = useState(false);\r\n const [searchColumns, setSearchColumns] = useState([\r\n 'Account Name', 'Site Name', 'Created By'\r\n ]);\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n };\r\n\r\n function formatDate(date) {\r\n if(date === null){\r\nreturn not defined
\r\n }\r\n else{\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n }\r\n useEffect(() => {\r\n dispatch(getAdminAccounts());\r\n dispatch(getMappedEmployees());\r\n }, [dispatch]);\r\n\r\nconst [adminData,setAdminData] = useState([]);\r\n\r\nuseEffect(() => {\r\n setAdminData((AdminAccounts.statusCode) ? [] : AdminAccounts)\r\n}, [dispatch,AdminAccounts]);\r\n\r\n\r\n const menuOptions = [\r\n {\r\n id: 1,\r\n imageSrc: SLAFailureExemption_Icon,\r\n name: 'SLA Failure Exemption',\r\n value: \"admin/Exemption\"\r\n }, \r\n // {\r\n // id: 2,\r\n // imageSrc: SLADataExclusion_Icon,\r\n // name: 'SLA Data Exclusion',\r\n // value: \"admin/Exclusion\"\r\n // },\r\n {\r\n id: 3,\r\n imageSrc: edit_Icon,\r\n name: 'Edit',\r\n value: \"admin/account\"\r\n }\r\n ];\r\n\r\n\r\n const [selectedAccount, setSelectedAccount] = useState({});\r\n const [openDownload, setOpenDownload] = useState(false);\r\n const [dropdownIndex, setDropdownIndex] = useState(null);\r\n\r\n const onClickAccountRow = (data, id) => {\r\n let temp_arr = {\r\n AccountName: data?.['Account Name'],\r\n SiteName: data?.['Site Name'],\r\n ValidFrom: formatDate(data?.['Valid From']),\r\n ValidTo: formatDate(data?.['Valid To']),\r\n mode: 'edit',\r\n CustomerID:data?.CustomerID,\r\n ServiceDeskID: data?.ServiceDeskID\r\n }\r\n switch (data?.Status) {\r\n case 'Active': {\r\n setDropdownIndex(id)\r\n setSelectedAccount(data);\r\n dispatch(viewAccountDetails(temp_arr));\r\n dispatch(updateAccountDetails(temp_arr));\r\n dispatch(saveAccountSite(temp_arr));\r\n setOpenDownload(true);\r\n break;\r\n }\r\n case 'Inactive': {\r\n if (data?.Request !== 'Sent') {\r\n setSelectedAccount(data);\r\n setShowRequestForm(true);\r\n setShowRequestSent(false);\r\n }\r\n break;\r\n }\r\n default: { }\r\n }\r\n }\r\n\r\n\r\n const dropDownref = useRef();\r\n useEffect(() => {\r\n const handleClickOutside = (event) => {\r\n if (dropDownref.current && !dropDownref.current.contains(event.target)) {\r\n if (!openDownload)\r\n setOpenDownload(openDownload);\r\n }\r\n }\r\n document.addEventListener(\"click\", handleClickOutside);\r\n return () => {\r\n document.removeEventListener(\"click\", handleClickOutside);\r\n };\r\n }, [dropDownref]);\r\n\r\n const AccountViewDetailsHandle = (data,id) => {\r\n let temp_arr = {\r\n AccountName: data?.['Account Name'],\r\n SiteName: data?.['Site Name'],\r\n ValidFrom: formatDate(data?.['Valid From']),\r\n ValidTo: formatDate(data?.['Valid To']),\r\n mode: 'view',\r\n CustomerID:data?.CustomerID,\r\n ServiceDeskID: data?.ServiceDeskID\r\n }\r\n dispatch(viewAccountDetails(temp_arr))\r\n // dispatch(updateAccountDetails(temp_arr));\r\n dispatch(saveAccountSite(temp_arr));\r\n history.push('/admin/account')\r\n }\r\n \r\n \r\n return (\r\n \r\n
history.push('/welcome')} label1='Home' isActive2={false} label2='Administration' />\r\n \r\n \r\n \r\n setOpenDownload(false)}>
Accounts
\r\n
\r\n
\r\n \r\n \r\n \r\n {Admindata.headers.map(header => ( {header.label} ))}\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n No records found.history.push('/getstarted')}>page for more information regarding the access permissions. \r\n
\r\n
\r\n \r\n :\r\n \r\n \r\n \r\n setOpenDownload(false)}>\r\n {Admindata.headers.map(header => ( {header.label} ))}\r\n \r\n \r\n \r\n {searchRows(adminData).map((info, rowId) => (\r\n <> \r\n setOpenDownload(false)}> \r\n setOpenDownload(false)}>{info?.['Account Name']} \r\n setOpenDownload(false)}>{info?.['Site Name']} \r\n setOpenDownload(false)}>{info?.['Created By']} \r\n setOpenDownload(false)}>{formatDate(info?.['Created Date'])} \r\n setOpenDownload(false)}>{formatDate(info?.['Valid From'])} \r\n setOpenDownload(false)}>{formatDate(info?.['Valid To'])} \r\n setOpenDownload(false)}>
{info?.['Status']} \r\n {info?.['Access'] === 'Read' ? AccountViewDetailsHandle(info,info?.RowNo)}> : \r\n <> onClickAccountRow(info, rowId)}>{\r\n info?.Status === 'Active' ? <>\r\n \r\n {(openDownload && dropdownIndex === rowId) && (\r\n
\r\n {menuOptions.map(data => (\r\n history.push(data.value)} >\r\n )\r\n )}\r\n )}
}\r\n } } \r\n \r\n ))}\r\n \r\n setOpenDownload(false)}>
\r\n
\r\n {showRequestForm && \r\n {\r\n setShowRequestForm(false);\r\n setShowRequestSent(true);\r\n }} data={selectedAccount} handleinvalidSubmitClick={() => { setShowRequestForm(true) }}\r\n handleCancelClick={() => setShowRequestForm(false)}\r\n />\r\n }\r\n\r\n {showRequestSent && \r\n {\r\n setShowRequestSent(false);\r\n setShowRequestForm(false);\r\n dispatch(getAdminAccounts())\r\n }}\r\n />\r\n }\r\n }\r\n \r\n \r\n \r\n {RoleBasedView?.[0]?.StaffAdmin?.[0]?.Read === 1 ? setOpenDownload(false)}>\r\n \r\n Staff Administration Detailed administration of Employees (CCOW, RCOW).\r\n Data maintenance in relation to Role registration, Account assignments,\r\n Channel/Tool/Identifier utilisation, Scorecard KPI/SLA assignments. \r\n
\r\n \r\n
Mapped Employees \r\n
{mappedEmployees?.length} {history.push('./admin/staff');dispatch(saveStaffAdminActiveTab('mapped'))}}>VIEW STAFF MAPPING
\r\n
: ''}\r\n \r\n \r\n
history.push('/githublanding')} label1='Home' isActive2={false} label2='Get Started' />\r\n The below simple “how to steps” will help you to get started quickly \r\n \r\n \r\n \r\n \r\n
As a first time visitor, we would like to redirect you to the following
page and by following the simple instructions your access may be obtained.
\r\n
If you are an Executive or have responsibility over multiple accounts and / or multiple sites / locations and /or have a regional / global function, please send us an email to \r\n
\r\n GSD Insight Support \r\n detailing your access requirements.
\r\n \r\n \r\n
Please be informed your standard access level is determined by your particular role. Should you be changing roles please apply the \r\n
RBAC \r\n model accordingly, which further defines your access rights to reports /data / metrics.
\r\n
To be able to onboard and / or administer an account, it is necessary to have Site Leader and / or Service Delivery Manager role for the particular account. \r\n
To onboard a new account please follow the
Onboard section in GSD Insight. \r\n
To administer an account please contact your Site Leader and / or Service Delivery Manager [responsible for the particular account/s] located in the
Administration section in GSD Insight.
\r\n
\r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default GetStarted","export default __webpack_public_path__ + \"static/media/Architecture_HeroBanner.c4fa2f81.png\";","export default __webpack_public_path__ + \"static/media/Conceptual_Architecture_Flow_Thumnail_Image.dec9442f.png\";","export default __webpack_public_path__ + \"static/media/Functional_Architecture_Flow_Thumnail_Image.1867d09e.png\";","export default __webpack_public_path__ + \"static/media/Technical_Architecture_Flow_Thumnail_Image.fdadad2f.png\";","export default __webpack_public_path__ + \"static/media/AdminRole_InformationArchitecture_Thumbnail.c4902d82.png\";","export default __webpack_public_path__ + \"static/media/SiteLeaderRole_InformationArchitecture_Thumbnail.e80d92f3.png\";","export default __webpack_public_path__ + \"static/media/ServicetDeliveryManagerRole_InformationArchitecture_Thumbnaile.1948d4ff.png\";","export default __webpack_public_path__ + \"static/media/ServiceDeliverySpecialistRole_InformationArchitecture_Thumbnail.be7a6e1f.png\";","export default __webpack_public_path__ + \"static/media/Functional_Architecture.fa931ba8.png\";","export default __webpack_public_path__ + \"static/media/Technical_Architecture.751e8def.png\";","export default __webpack_public_path__ + \"static/media/Conceptual_Architecture.daa14a10.png\";","export default __webpack_public_path__ + \"static/media/Account_Delivery_Role.6dd6525b.svg\";","export default __webpack_public_path__ + \"static/media/Administrator_Role.1911f683.svg\";","export default __webpack_public_path__ + \"static/media/Agent_Role.72496acd.svg\";","export default __webpack_public_path__ + \"static/media/Coach_Trainer_Role.b28211f9.svg\";","export default __webpack_public_path__ + \"static/media/Executive_Role.154b4225.svg\";","export default __webpack_public_path__ + \"static/media/Operations_Delivery_Manager_Role.2c11f242.svg\";","export default __webpack_public_path__ + \"static/media/Operations_Manager_Role.9a1b3c85.svg\";","export default __webpack_public_path__ + \"static/media/Service_Delivery_Manager_Role.11b31532.svg\";","export default __webpack_public_path__ + \"static/media/Serviced_Delivery_Specialist_Role.980c0096.svg\";","export default __webpack_public_path__ + \"static/media/Site_Leader_Role.e5102bba.svg\";","export default __webpack_public_path__ + \"static/media/Site_Viewer_Role.2ff324dd.svg\";","export default __webpack_public_path__ + \"static/media/Subject_Matter_Expert_Role.9f04bdc5.svg\";","export default __webpack_public_path__ + \"static/media/Team_Leader_Role.5fec9668.svg\";","import React from 'react'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb'\r\nimport { Footer } from '../HeaderFooter'\r\nimport Architecture_HeroBanner from './../../../assets/images/Architecture_HeroBanner.png';\r\nimport Conceptual from './../../../assets/images/Conceptual_Architecture_Icon.png';\r\nimport Conceptual_Architecture from './../../../assets/images/Conceptual_Architecture_Flow_Thumnail_Image.png';\r\nimport Functional from './../../../assets/images/Functional_Architecture_Icon.png';\r\nimport Functional_Architecture from './../../../assets/images/Functional_Architecture_Flow_Thumnail_Image.png';\r\nimport Technical from './../../../assets/images/Technical_Architecture_Icon.png';\r\nimport Technical_Architecture from './../../../assets/images/Technical_Architecture_Flow_Thumnail_Image.png';\r\nimport Information from './../../../assets/images/Information_Architecture_Icon.png';\r\nimport AdminRole_InformationArchitecture from './../../../assets/images/AdminRole_InformationArchitecture_Thumbnail.png';\r\nimport ExecutiveRole_InformationArchitecture from './../../../assets/images/ExecutiveRole_InformationArchitecture_Thumbnail.png';\r\nimport AccountDeliveryRole_InformationArchitecture from './../../../assets/images/AccountDeliveryRole_InformationArchitecture_Thumbnail.png';\r\nimport SiteLeaderRole_InformationArchitecture from './../../../assets/images/SiteLeaderRole_InformationArchitecture_Thumbnail.png';\r\nimport ServicetDeliveryManagerRole_InformationArchitecture from './../../../assets/images/ServicetDeliveryManagerRole_InformationArchitecture_Thumbnaile.png';\r\nimport OperationsDeliveryManagerRole from './../../../assets/images/OperationsDeliveryManagerRole_InformationArchitecture_Thumbnail.png';\r\nimport OperationsManagerRole from './../../../assets/images/OperationsManagerRole_InformationArchitecture_Thumbnail.png';\r\nimport TeamLeaderRole from './../../../assets/images/TeamLeaderRole_InformationArchitecture_Thumbnail.png';\r\nimport ServiceDeliverySpecialistRole from './../../../assets/images/ServiceDeliverySpecialistRole_InformationArchitecture_Thumbnail.png';\r\nimport SubjectMatterExpertRole from './../../../assets/images/SubjectMatterExpertRole_InformationArchitecture_Thumbnail.png';\r\nimport CoachTrainerRole from './../../../assets/images/CoachTrainerRole_InformationArchitecture_Thumbnail.png';\r\nimport AgentRole from './../../../assets/images/AgentRole_InformationArchitecture_Thumbnail.png';\r\nimport SiteViewerRole from './../../../assets/images/SiteViewerRole_InformationArchitecture_Thumbnail.png';\r\nimport { Carousel, CarouselItem } from 'react-bootstrap';\r\nimport FunctionalArchitecture from './../../../assets/images/Functional_Architecture.png';\r\nimport TechnicalArchitecture from './../../../assets/images/Technical_Architecture.png';\r\nimport ConceptualArchitecture from './../../../assets/images/Conceptual_Architecture.png';\r\nimport Account_Delivery_Role from './../../../assets/github-images/Account_Delivery_Role.svg';\r\nimport Administrator_Role from './../../../assets/github-images/Administrator_Role.svg';\r\nimport Agent_Role from './../../../assets/github-images/Agent_Role.svg';\r\nimport Coach_Trainer_Role from './../../../assets/github-images/Coach_Trainer_Role.svg';\r\nimport Executive_Role from './../../../assets/github-images/Executive_Role.svg';\r\nimport Operations_Delivery_Manager_Role from './../../../assets/github-images/Operations_Delivery_Manager_Role.svg';\r\nimport Operations_Manager_Role from './../../../assets/github-images/Operations_Manager_Role.svg';\r\nimport Service_Delivery_Manager_Role from './../../../assets/github-images/Service_Delivery_Manager_Role.svg';\r\nimport Serviced_Delivery_Specialist_Role from './../../../assets/github-images/Serviced_Delivery_Specialist_Role.svg';\r\nimport Site_Leader_Role from './../../../assets/github-images/Site_Leader_Role.svg';\r\nimport Site_Viewer_Role from './../../../assets/github-images/Site_Viewer_Role.svg';\r\nimport Subject_Matter_Expert_Role from './../../../assets/github-images/Subject_Matter_Expert_Role.svg';\r\nimport Team_Leader_Role from './../../../assets/github-images/Team_Leader_Role.svg';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useDispatch } from 'react-redux';\r\nimport { setGithubSolutionCarouselData } from '../../../actions/welcomePage.action';\r\nimport { Zoom } from '@material-ui/core';\r\n\r\n\r\n\r\n\r\nconst Architecture = () => {\r\n const Architecture_Cards = [\r\n {\r\n id: 1,\r\n imgsrc1: Conceptual,\r\n title: 'Conceptual Architecture',\r\n imgsrc2: Conceptual_Architecture,\r\n display: ConceptualArchitecture,\r\n imgWidth:1500,\r\n imgHeight:'',\r\n },\r\n {\r\n id: 2,\r\n imgsrc1: Functional,\r\n title: 'Functional Architecture',\r\n imgsrc2: Functional_Architecture,\r\n display: FunctionalArchitecture,\r\n width:1160,\r\n height:600,\r\n imgWidth:2000,\r\n imgHeight:710,\r\n },\r\n {\r\n id: 3,\r\n imgsrc1: Technical,\r\n title: 'Technical Architecture',\r\n imgsrc2: Technical_Architecture,\r\n display: TechnicalArchitecture,\r\n width:1160,\r\n height:600,\r\n }\r\n ]\r\n const Carousal_Cards = [\r\n [\r\n {\r\n id: 1,\r\n title: 'Administrator',\r\n thumbnail: AdminRole_InformationArchitecture,\r\n display: Administrator_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:4000,\r\n imgHeight:2000,\r\n },\r\n {\r\n id: 2,\r\n title: 'Executive',\r\n thumbnail: ExecutiveRole_InformationArchitecture,\r\n display: Executive_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n },\r\n {\r\n id: 3,\r\n title: 'Account Delivery',\r\n thumbnail: AccountDeliveryRole_InformationArchitecture,\r\n display: Account_Delivery_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n }\r\n ],\r\n [{\r\n id: 4,\r\n title: 'Site Leader',\r\n thumbnail: SiteLeaderRole_InformationArchitecture,\r\n display: Site_Leader_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:3000,\r\n imgHeight:2000,\r\n },\r\n {\r\n id: 5,\r\n title: 'Service Delivery Manager',\r\n thumbnail: ServicetDeliveryManagerRole_InformationArchitecture,\r\n display: Service_Delivery_Manager_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:2500,\r\n imgHeight:1500,\r\n },\r\n {\r\n id: 6,\r\n title: 'Operations Delivery Manager',\r\n thumbnail: OperationsDeliveryManagerRole,\r\n display: Operations_Delivery_Manager_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n }],\r\n [{\r\n id: 7,\r\n title: 'Operations Manager',\r\n thumbnail: OperationsManagerRole,\r\n display: Operations_Manager_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n },\r\n {\r\n id: 8,\r\n title: 'Team Leader',\r\n thumbnail: TeamLeaderRole,\r\n display: Team_Leader_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n },\r\n {\r\n id: 9,\r\n title: 'Serviced Delivery Specialist',\r\n thumbnail: ServiceDeliverySpecialistRole,\r\n display: Serviced_Delivery_Specialist_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:3500,\r\n imgHeight:2000,\r\n }],\r\n\r\n [{\r\n id: 10,\r\n title: 'Subject Matter Expert',\r\n thumbnail: SubjectMatterExpertRole,\r\n display: Subject_Matter_Expert_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n },\r\n {\r\n id: 11,\r\n title: 'Coach & Trainer',\r\n thumbnail: CoachTrainerRole,\r\n display: Coach_Trainer_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n },\r\n\r\n {\r\n id: 12,\r\n title: 'Agent',\r\n thumbnail: AgentRole,\r\n display: Agent_Role,\r\n width:1160,\r\n height:600,\r\n imgWidth:1500,\r\n imgHeight:1500,\r\n }],\r\n\r\n [{\r\n id: 13,\r\n title: 'Site Viewer',\r\n thumbnail: SiteViewerRole,\r\n display: Site_Viewer_Role,\r\n width:1160,\r\n height:300,\r\n imgWidth:1400,\r\n imgHeight:600,\r\n }]\r\n ]\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const onClickCarouselCard = card => {\r\n history.push('/architecture/card')\r\n let temp_obj = {\r\n title: card.title,\r\n display: card.display,\r\n width:card.width,\r\n height:card.height,\r\n imgWidth:card.imgWidth,\r\n imgHeight:card.imgHeight,\r\n }\r\n dispatch(setGithubSolutionCarouselData(temp_obj));\r\n }\r\n return (\r\n <>\r\n \r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Solution - Architecture' />\r\n \r\n
Architecture
A comprehensive architectural design and development has been executed to envision and build the GSD Insight solution to address our Capability’s reporting needs.
\r\n
\r\n \r\n \r\n {Architecture_Cards.map((link, index) => (
onClickCarouselCard(link)}>\r\n
{link.title}
\r\n
))}
\r\n \r\n \r\n \r\n Information Architecture
Based on the requirements the following user profiles were architected.
\r\n \r\n \r\n
\r\n {Carousal_Cards.map((carousel, index) => (\r\n \r\n \r\n {carousel.map(card => (\r\n onClickCarouselCard(card)}> {card.title}
\r\n ))}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Architecture","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAH8AAACcCAYAAABWbXQ/AAAABHNCSVQICAgIfAhkiAAAFlJJREFUeF7tnXmQFMW2h3OAYRnZBkYRQRZFlkE2N56CwkX0QgAPMLzX9YUvnuglwhD5Q59x1XDf0BDcQXBH1EBlUdzAXUNFBXdkUVQ2mQfIKiqLvv5yOG12dfdUdVV1dQ2dJ6KjursyqzLzlyfz5MlzTpaMHz/+T2Wp6Fqgft1GVSWAv3ler6KrfDFXuKTBHtVqyEoLfjF2AsA/yA38dt1aqJ3bdqmKto3VxjU7VFnT+mrj2sS1Sf3k94o2jXUa7kF837k98TuRBiLvqm9+1t/lP9LyIS0kz5T3SD7eybMkXTEClY86ewK//2mdqgHdBwBAL124XgNqgq3BStwDRK6ALfe5kgfgu/Y9WKfRgCeAlefoDrYvv/m/Bj9xT/LkoyGK8ZmewC/GhimGOlvwiwHlLHW04Bc5+FbaL9IOkML5pSVlRdoMxVvtOnX+rCr5+eefrYavCPvA3r17l5X8maAirLutslJLLPjF2w0s+MWLveX8IsY+ZPAXL1ilVbGn/ndlMTdqbal7uMP+8kVVas3SzarnwLZJfTw6ez6WYtcC4YL/3qxvkzt+bOLIJpAFP3bAU6BwwWc3D8DZjSttUFc1OKCe6v23QxVbw5Zi1wI1g//DDz8kS9y8eXPFZ8uWLfoqJL+5Ckk6fjvTkq5Dhw6KZ3O1VLAWqBn8OXPmqIEDB6rPPvtMl7B3794aNAB966239H/SKQRIuS9X0pB/1KhRyY7Db9LzPEsFa4Fwh32qAciTJk1SHTt2LFit7Is9tUD44MPRb775pgXfU/sXNFH44JeXl6vFixdb8AuKq6eXhw/+YYcdpl5//XULvqf2L2gi/+DvWjlf7d26Kq30N0yeq/7rP/upDm0q0u416jOmoLW1L09pgWDg73jjirT2bNB5hNqzaZnau2l5yr2GPc5VZX3H2/aPTwuED362ulnw44P6vpL4B1/9+UfG2hx2eCf1+msLMs/5JXVi1wJFXKAA4GdptYMPPli99NJL6qijjiridq0VVQ8f/IqKCvXxxx9baT/++IcPvl3qxR/1wHP+whe/V/OmfJlW03VbVqiy+k1V87JWKfe6n9BanfnvY2tsme3bt+fcck2aNMk5j82gW8A/5wP+5PFvp7Qje/jakzexpSueuZKgdf9tasAZnbO2+xdffKF+XL1W/b5rTzJNRcuWauOmTVnzXPXv/01sELW3WPprgeDgs1cvrtV41LarrHbrFrdt9vehvZ0/Uxv/WJa1mN99953q0bOXKm95UDJNn9691OrVa9Shh7ZVO3fuVKvXrElcf03et+D7Qz2UYR/OT7pi7/PZN33p6QjY9UFD/qe767D/5lvv5FSbjgmut5yfU5OZif1z/pYNf3Gg+cTex1SqubNeUu3bdUgrVfMDG/kuqc0Yegv4Bz9bUay0HzpI+Xpg+OAfeeSR6oEHHlD9+vXLV6Htc8NpgfDBR8nz9ttvq+7du4dTRPuUfLWAf/AnTrpTff5F+jp/yddfq85duqp69eqmFLpp06bqnrsm5asi9rm5t0Aw8JcsXZHyyn4n/IdqmVibszxjabZs+V/3GzWsb8HPHaB85ggG/qLF1Va9Jm3ftk2V1KmjGjdO9dJp0aLcgp9PKHN/tn/wrbSfe2vHLEf44B9wwAHqq6++srt6MUM6Q3H8g79t21ZVVfVT2jMJ9FFSUpL2f3l5Qg1c8ZfqNv5ts9+XMBj469evUzNmPOXaSp07d1J///sQC75rS0WaIDj4lZU91IUXXpi11F9++aUaO/YCC36kuHp6WTjg//7776pu3dR1vbz+xBNPtOB7wiLyROGAP3PmTLUtscTDTw8HTRwx8cbFyfPiiy+24EeOq6cXhgO+5XxPjR23ROGAP3z48KwV25SwxLFzftxw1+UJDv78+Qtca1Ze3twKfK6tFHmCYOBv3LghrcQbN27U/7G7ZxIbO3adHznANb3QP/jZnmqNOWIFcLTgl5WVqQ8//FD17Nmz1rRCkRbUP+ej3t2woSqt3aqqqlSLFi1UaWlpyr1mzZrbYT9evSwY+Kh3oW++WarWrl2rvzdtWu1EwX/HHXec6tatq/7dokVLC/7+Br7XiO0tW1ZY8Pc38NHt//FHZndtqev06Y/apV68gKc0wYd9wGeeR7ePWldi6/Ed9a7V7ccP9X0lCgd8Ue+izzcjaxKg0YJfBODjYStRNyXkqgU/tsCHN+y/8sor6vPPP9c1Pfzww/UVA06cL5944gmr249nHwg+7J9/fnZDDqmz3diJJfrBwfdaLbvO99pSkaXzD/7u3dXHnzupd+8+as6c2RnDqZeWVh+rbikWLeAf/GzFx2OHwMtWtx8LgGsqhH/w0e1v3bo57eETJ05S//jH6YloGoem3GvUqMxq+OLVH4KBL7p96jRr1mzVt+9xST2/qdfnvp3z44V8ojThge9WNRP8PXv2KDH6cMuX7T7BHk1CxbxrV2Y5xOs76tevr+ok/AyhlStXes0W23TYVtRAwcEfOjS7/Z68+JJLxqnKym6qU6fqaFyJQ3wV0bew7M1m8p2t0IA8f/587RV00EF/eQDx/08//aR+++03X2C0bdtWtWrVKgk+ZwagokZfgQvaL7/8op+7Y8cOnQ7iP/nNd9LJ//LdV2FCyHTEEUeozp2zRz8LhfO7dKlU5513nkqcxp1sHL7AmXDSggULVJMmjRP6//9Tu3fv1vv8cD7x87Zu3ZomGLZu3VqddNJJulFffPHFtGZYvny53khCpVyvXr2k3QDP5V3HHnusatCgQUq+Zs2aKT7QqlXpYeLpjCijsEOgUy1dulQdffTR6r333tN1aNeunS4rxHf+54pQi0pb7nG/ffv2+l4h6f3339e+knkH/4wzznat54gRw9W4cRere++9XzfulVdeqZ5//nl1ww03uObNlIDYvnQSk+gQXycCQwB+mzZtUu7B1fLfwoUL0x7JxhThZKDvv/9eaynPPfdc1aNHj1p5CFRk4LOrN3jwYN1wv/76q+ZqOLJRo+rIW3jsTphws97SBfynn35a/3/ggQfqeXXcuHFq3bp1eiSAOKUDYbFLly7qjTfeUF27dtWGIoDH/sGTTz6pp4xs4GNC5ocwP2c0GTRokC4Xwz5DeW08ASxS8Bk2a6IHH3xAjRw5SoO/YsUKdeqpp6o1iYCKV111VVo280y+TM9Ej4D/XybwZV72Az558DEwwZ8wYYJatix74EjyYKX8+OOP61fSWadNm6buv/9+/ds8g/DHH39MTnN8l+nh3Xff1VMSv+nUTCUyRfmtR6Tgl5bW0+VMeGcnhvX0Ij/44NQk58NVQ4cOTdj/bVCXXXZZMjGVp1Gc5OwMmIBn4ny/DWXmY8g/+eSTk5wP+J9++qk65JBD1JAhQ9T69ev1h++PPvqo2rx5s5Zj6MgQI1+nTp3URx99FEZxfD8jUvD79++vC4qQRm+XZRjD/7fffpsy7CNYMe8jXDFHMx9DDPUM6/j8yfwM0PxGAOMq3Bkl+NTJjWQqQ7P58MMPJ0a4e3UHhZxcLNvdwuUIhzNmzNDyBQwwb948xRQUhPsjA3/QoFPc2iYxlA5UEydOTBH4GB6vvfZa17yZErAEcw77vh7kyOTk/BdeeMHTka+nnXaafhLgMxrI7zDK5OcZkYHftWt37Z+PggXBTYi5GSFu9uzZifvnq0suGa/Bv++++/Q6H4EQRU/fvn2TeVibsq6G2xC0GGKZE03iIAemjijAZ9hftGiRfn23bt30yMSohAAqQz1LQVYYEEfMcq7g5ZdfnuRcloHCxVzhfLib0RJOp35wv/x/zjnnBOJ6yhEZ+H37nuDaOUeMGJbkfPQBdJZnn31W3XHHHa55MyVgrR8V+C+//LIuggAk5ZFhHQDHjh2r/yYty0YEv0JSZOCz1BPrHWLvoWwxHTaQwM2lHpzLMg416pQpU5KnbBOxk3mdeV5I5vnVq1cn/2M5FtWczzTgJZKoyCjUDULLCJeL8oerjACiGBJlEzaOpsTPqBCU+yMFXyovJtyiH6chGOJN8OEO0bjx3VSDyk6gdAKu/IeuQIh3RAV+rut85nyIw6VMgc0c+qMYESID34vAN3bshXpodGr4LrroIl9tgQImimHfD/h33nmnXvcDOFOFTA9wPBwOp+ebIgOfYR9VKMSyDgGIeV00Y6+99loK59944416NGBThsZliSMEx8iRbMzrfKcxTeIdUXE+Ah8KpZqIZe1DDz2kk7A6eOaZZ9RTTz3lKrTJaJCPUSEy8L3o9ocPH5qU9lnjX3HFFVq3T0fwQ5l0+36e48yTTckju3gop1iJyAqEaQklDworiNUA8g8ximTYp6MiFELkYz6H+N+UA8IovzwjMvCdun2WcKLfpzBO3T5m3qhEmevZtevQoUNKvVk2sWQcOXKkPp9PhChJhDQdJecDrhs99thjOglzvgz7psAnHcHc/QuixHErT6Tgu+n2p02bkojUNVqbcd19990Ja59v9Dp/0qTcQ7DTcaIC3++cf8899yQ5X6R34XauMhLkqwNECj5LOwm76rxSWTZ2zAicjAwyVLr14mz34yzwzZ07Vxfb67we9rwfKfgcqcLaFl2+eUVrhdeOLPUkJg/ge3Xtzga+M/iD305k5nPO+blyPkYekOgqZFMKTjeHfDawROrPx2ogMvD/+c8zXdsdDR/q3bgHZAoKPnM+yhuCUToth/iNSjiT0kg6RljTQGTgI/BdcMEFyQ6ABg6pV6Jxsfxxcr5rbylQgjDAR+C7+eab9XIWgvuXLFmijj/+eH0VhVimPf2wdAGRgT9w4MmuUA0ePEjr9ouB8wHfFPjMpR7b3UwBshLgykghNoKZOB8HWJaUuSiHIgOfXT2RXtnZY96HRMWLvl929Wob+O+88442znCjAQMG6CSy1BPwzeUe9+F28WQSff/kyZPTDE7N97FTyHKTdOQV/QBpxADG2WnQRURiwAn4YkJtCnFy4AK6+H/9a0ytnPPR8MFFzNOm5C57D8zhbFuffvrpGi+mODo/Vj6yfyHGGdyHy+F+QBSOZ0SsiehQ5MHgA5LnojAS0y/+M0eGyDh/wIC/uTGGGj16lLr++utr3bAP+DS+cBabTKbUzm4jso3EHsb4lBHPBF8sdpzguzbavgQM+yi90C56pcjAR+DDzl68ZdB1o9vHKIMPQ2dtFfhoeLaf3Uj2J0wNn4Bujhgy9Ofbtj8y8M88091uf9iwat1+bZvzc13nm+ADtADv3Ns3nUjcOpaf+5GBD+efckq1HR/Wq3xQ3YrdPrtitZXzg4AP8OZGDnM8oCP0sfzLp1dPpOC7xeGbOnVyUrfvpydHlSesdb5I+yLdi2QvApt5zUfdIgVfdPtURKR884g1p24/HxUO45lBwTfLYJpuybAvcoAoeGSdL51BDECC1iVS8EW3j14fIQ/dPd+z6faDVi5f+YOCz5yPwwZWS7IqQNsJ4Z/A0lD8FEz1r8gAsvwLWr/IwJ8581nXsnbs2L5WhF91go8NvpfwMg0bNtRtIAIfThuMfKzPMeVGL4Cu4IMPPki4qlfqtNm4n9EhF21epsaPBHwvhg5m4Qi+HGfKZMkza9aspIUxYDqJZR52+hAmXICK6bZpuQv3s9OHXkA2dvAWxglVnilq3zC4P+/gxxlEv2XLBD5rfRQ3AAUBJN9xIZMw86hSIRw80HOgjTOHchniM6l387Hss+D76AFO8KdPn56co2t6nJwoKsO+acxhDuN8Rw4yPXh8FNM1iwXftYnSE4Qh8Dl39aLidrM2FvwCgo/dvizjzO1bU9UrSh7x3OF3GPM91bbgFwB8CQaFQYuQrN2dOn7TolfSWPB9gBZWFuewT1QOvHPdSHwVsVeExIpJ3M1Etcs9p1GnjBAIkqwEwugAlvPdEMtwP5O0T9g3SKRy4Vjx5MGKeMyYMToN7uhwP1cUOgCNUgdg2fcnXpBpG8B39P/sh7CCME27fBQ/mcWC76P1MoEvIVZYpwOkaOqwx4PYwJLIJGxfA7Ks83M1yAzLhNuCHwL4r776qjaHcqNhw4bpJBIQCvU2QIrNnnC07OiRVpaAdBCsfdAkSogWcelye2+2+xZ8Hy0XdKnn45V5yWLB99GsmYZ95m/IjApmfu/Tp08ythDRRuBoMeOS8GtwtwRi4j9+y54BXC82eGG5cFvwQwKf4E+9evXS5lwSLBIBjvBsaPIY4ok/BOGDiF2+eO74KEIoWSz4PprRyfmEjfHiE3jppZfqt4lHMS7dpuQu+/hivcsoIJo/mfPD5H4LfgjgI8A54/j6eGzkWYhymle7/chrFMELnZzPOYG1lQgknbeo27W1UWoqtwn+/lg/R538H7awPzaOBX9/RNVjnUzwMcxwizji8bEFS0Y84xrIcr7ZOE7wkdKx4sEoFcIBko94I8l/EjLWXBlInkIhTzkJbW/B94iAE3xCxziPiBPHCx4p3smZAi3lqtf3WERPyRBUOW/Igu+puaoTOcFntw0FT20jC74PxMIAHydVzhKA5NAp+U1ngtgJ5B5X/pP7PoqcMYsF30dLooE75phjNLfjeIGmLlfOJ0IoBKAYd2C3L36LZpHkPyyASRumMsmC7wN8shBKFR39WWedpbkyF/A5P4CwsQh74oxpWuyG5Y7lVjULvlsLudxnqYf9vbhX1ZRcAlJh+EFo2eeeey4tGleYBppuVbPgu7WQB/Bvv/12faomEj8WOnK8G1kZrsVpAxcsPJU/+eQTVVZWpgg2bTphkl6seMVql+1bibGDe1Y2Kx5iFPNMOb7OS7Us+F5aqYY0cD7gw8VCmY59w8CTqQGbPc4KxOiTs//E5s8ZfNEZkOmWW27RkcozER2K8PKEpqcDyrEsPBsbQix+ZMdQrlgPYXJml3oBOgDg05BmSPhsjwNsAkwTmIlI4py2Zbpli+OlBFEyQ6898sgjNZaSznf22Wdr8EV3YHZCbAeICWQGe7CcHwB4sgK+V4EPIRHwOVXr1ltv1WHTwvLPw7MXIoijV7Lge22pLOn8gD969GgdffO2225L0f6JIac5BeRTALTgFwB8zgggrh4OnkJmXF1GA4nIKQJhPmLzWPALAD5++ghi7KZlk/blfF0BPR96AAt+AcCXwyPM4d1cwokQKEs/rvlw1LTgFwh81LtE4GDZx6ncrNFZytEJUBez1YrFL7YC7BoyVZjBmcPQAlrwCwR+prnedNQ07+fLTduCHzH4U6dO1dGx4W5UvBIRm6sEWw5YJM/ZLfiemypzwlyXeihj2NBBGeP3jOCARU5mt+AHbMlcwUfJc91112m1qpdgzQGLV2N2C37A1s0V/KuvvloLcmz+3HXXXSkHIUiYtYBF8pzdgu+5qcIZ9omrhw6ePX05fCFgEXxnt+D7brrqjLlyPps2nB+MD555WGRYARdyqY4FP5fWypA2V/A5SYRhnyCMROaAzFM2orTmteBHDD4CH3Z/kBX4AjZ+obPnyvns6RNunoBM7LEz3DMFQFbgKzSaOb4/F/AZ7q+55hrFMWh169ZVN910k46cHfZJmV6rYId9ry2VJR3gE3S5thKGp9Zjxyd6Ek3TZ/ZYZJNzALIUxjpqxgKlwhTCgl+Ydo/FWy34sYChMIWw4Bem3WPxVg1+nVgUxRYi8hb4f5lxVkrc4vx4AAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAH0AAACYCAYAAADJCeYUAAAABHNCSVQICAgIfAhkiAAAFiFJREFUeF7tnQeQVMW6xxtBkgQJVySIiSgG8IoIKooKBlB5Ys5cr5Th+R5WKYoCWoZXxUWfPMArgiAoSJCgJJEkohcEJShIUBBFgpYECYKCyptf7/2G3jOzM3P6nD07u9NdNbU7c/qc0/39++v+Un9dqnv37oeVKzlDgYsuuqhaKUDfNe2snOl0Lne0VseNqvXFLRzouTQIMgK9Zt1KmiYVq5RVm9bsVE1aHa+2b96n9u89qP/fv+fgkeurd+p6fMwi9aVuLhE52/qaEej1m1aPA7t9yz7FIABwAARc/d0AXn6nbsXKR8CXe7KNCLnWnoxAzzWilPT+OtBLOsJJ+udAz3XQd88+LQdJkHtd/stlm/NUtscffcIZZ3II/1ZtWlYrdThWcqjPrqsxDdyBnnvDwIGee5g7Ts9BzEMEHSscRUy3uUjNYtLn8Kb3ZbM36T6f3b5+Mel7zjYzHNCxua/8aIs6tflf1NrFP2hux0HT4W6n/2fh0AoHdLi8Zr1KasvXP6sadY5Rf/55WO3ffdBxfRYiHmtSOKCLpw0up4h7FS+d19WanXTIqVYFA/3bb79VfJo3b67/zp8/X1188cX6f8pJJ52kr7mSVRQIDvrPP/8cB33jxo26d9WqVVPHHnuskmtZ1WXXmGCge+n3zjvvqJEjR6rJkyc70mYvBcIFvVevXmrs2LFq/fr12dtl17JwQYfThwwZombMmOFIm70UsAf98O+/JnTr3SlT1YiRb6rJE8cnXCtVpnz2kiG3WmYP+r55T6iD38zKR65SZSurwwf3JpLwqDKq+t8+yS3SZm9vwwW9XKOr1aFtS1XpSrX133hxoGfTELAH/bc1ExI6MnXup2r2v1aoAX3uTbhWrun12dTxXG6LPejJqOZUtmIxlsIFfdiwYerll19Wy5YtKxa9z9FGhgu64/RiMYzsQZ/8f8sTerhk5Xy1ftOX6taODyZc+4//blEsKJIDjbQH/ZXuH6rF0/Ns7RQ8arhXKZtimxklkobvpUofVkNX3ZGSnnPmfqA+W5Y4kAq66c7bb1H1TzghBzAKvYvBQZdNjTTNuzMVtyq/AfqoDd0KbD1R2A0bNlLnt20Xr1OzRg1Vo0Z1/b1ixYpq+YrP893fp9fjDnS78RAO6GxbJlJGfOf83/m/musoGgIsSpc5Sg1bc2fKJs6eM09t/LdLNpO+XHF5ewd6JoRKrGMP+tJZ3yU8bv7CWWr6nEmqX5/BCdf+2uFEuya6u8KmgD3oyVripPew8SmU54UL+mOPPaYWLVqkFixYUCitdQ8NhQLhgt6/f381ZcoUNW/evFBa5x5SKBSwB/0/H+qe0KKdu3aqbVu3qmbNTk+4Nmhg/0LpgXuobwrYg35X17+ro8uWi7+x/aXt1KbvN+vvO3bE9PQdO+LXdu3cqVavWpFx68444ww1fnyiTz7jB7iKqSgQDPQ/PbucSx91lDpw4IAqW+7IYODte/bsVn3/57mMoPjjjz/UWWedpX7//feM6rtKvilgD3phSe+AXi42aBzovsHM9IZwQe/bt69644031JdffplpAxLqAfrRRx8d2yXzp/Uz3I0pKWAP+tatm9X+/b9kTN8GDRon1P3ss89Uq1at4jHyUqFq1apq9+7d8foSQ//iiy+qWFrTjN/pKialQDDQJ0yYoLZvPyKwFUTkO+64LWZbb5IU9A4dOqiWLVuqJk2aqL179+rPli1b1CWXXKLrr1u3Tv/99NNPNeAO9MBDOTjoCxZ8pGrVOr7Alqxbt1a98srLBYLuR6cvW7asAz0w5gE2MDK9w+mAPmHCxKRNmTZtmurf/6UCQQ/efvcECwqEw+n16p2gOnfurFasWKE3LbIGs4mxZs2aDnQLVAr5lnBAd5xeyDCF+/jgoA8fPiJlk2rWrOGm93BBC/q0YKAvWbI4owY0a9YsqSCX0c2uUtgUCAa614CyaFHe1qXWrc9LaGi9ei4BUdjoWT7PHvRkL3RBFJYwRHubPeiHDh1KaOrQoUMVnyVLliRcw7TqSlZQwB509PR9+5LsUE3Sr1KlSrk1PSvw1o0IDvqePXt1upHNm7fE7OjnahMqv9WtW0dddtllqkqVysqBnj2IBwb9/fdnZtSbCy64wHF6RpSKpFIwTscMO2XKtKQtxR9epkyZ2LXDTk+PBMuMXxIcdLG9k0MOEywf+X/VqlXODJsxFpFVDA90mgzY2NxJIAj4zuESGZB+XhQO6L169dYgU0gYKJ99+/Y5TvcDRzR1wwGdBMAUdPFffvlF4fc+ePCgOuaYY2KRsdvdmh4NmJm+JTjoxLSlK506dXTSezoiRXc9GOjeg54WLlykm96mTeuELtSt6/aSR4dryjfZg57ssc72niWwpm6GPegHDuxPeDSJhoYNG64WLvxXwrUKFSoWC4rkQCPtQTdt75hdKZhcKZhi69atG6efM8Nm1VAKB3SxtwN65cpVNOhNmx4JefaCjoQfpKAVuGJNgWCgjxs3Tv32229p396ly3X5pPft27erUaNGpb0vWYWbbrpJ1a5dO98lTL67du2yeh43YS7mYAIpY8aMsX5WUd5YunRpdeONN6ZrQnDQBw36p4563b9/v+KlFAZClSpV9P/o68TJsSkCwv7www/quOOOU19//bWqUKFCQgPZ8VKvXj21ePHimOcubxeslB9//FFdeeWVihMk6tevH5tV8pYTIni6du2q+vXrl67DCdd5F9uxTNAHDx6sbQ5szzohlsHqtNNO08kW+J/y/fffx6KDWuv27dmzR+/GISSMPvO3KAo0+OSTTwof9NGjR6uePZ9M2UeI0K3b32Pu1dKqd+/e6sEHH1Snnnqq6tOnTwKobGeSLUw81NzaxHeyTD3//POa6KeffmQPPB3GInjNNdcotjl7y9lnn613zjDQzMIA5L4NGzbogcP7eS5m5FtvvVW7hL2FNlFPivd7UQDOO5npIgGd6b1Hj8fj/URv9xKqbdsL1eDB/4wBVllvQb7//vtVo0aNNOjMDHLID2BTMOECBL/LAOD7iSeeqLc2sc0p2fT+0UcfqSeeeMI3zevUqaOuu+46HRPQtGlT1bFjRx2/XxDovl8Q0Q2RgY5rtX//AXp6xzLHi5lymdJl6kW4Y1sToDdu3FhPkUzvmzZtUjfccIOeHvlIgSMhPmXNmjXx5/D7hx9+WCDoO4wkCH7pjNm4Z8+eihmhW7dueplgu3QyTjeffffdd+uvyCiEiRE3cOGFF8ZnqO++y8vAxYCVTZnMDCxNX3zxhTrzzDM1HfgetEQGOo4Wdp6mKxMnvq1BZ71mHYRITKE2Zfbs2QmcbvMc7z333XdfPtA5j0bAQP1kXRcZg8GIhiJ9ADjkDGYhc+oHWGYr73LAc2VZCGt5iAx04fRLL71Uc7dI8jtj6UYY3RDp0KGD+TidtZNpndkBgqB+MV0ff3zBmyCXL1+uZxIEq2TTe2GA3qNHj5SPRQgdMWKEroPQ+dprrymkfjidQSBAC6jC6eZfBgV0YkaA64OUyEC//fY7YiczbUjb1rlzZ2lOZ0syacFxubZt21YdFUtX4rewrnvXdL/PSFbf5PSBAwcqVMN003v58nnn0vz6a955Ngx6QE0GurwzGfhhcHtkoDO9z5kzV6+7EhItQIr6hiFm9uyZGnT2oCNdI9Chp4taB0FEHeI3iADB+Wuu9z/99JPmisIGnTWdNZ5iCpimZoEc8Oqrr+o6CxcuVGgyHE8mnM7vcDKF6RyOpj+0nzoInubfoAM3UtBHjRqt2+v1uAmXIB0L6KhvLAUtWrTQujFJicwigRjymwRjyHcGVFSgs6ajwzMIkUVYx7t06aJef/11PRC3bdumLr/8ct20b775Rp9FhwpYVCUy0IcMGaqeey511iiMGMOHv6Y5HekYKRdC3nXXXXHByKuuATZF/goh0dO/+uqrSDjdnIUKAhK1joJgSq4dli/hXjhb+iDCnKzdIrHD7azlzAjcF6REBroIcnAzBXMo07kprZYvXy6fIMdSAHgIdLLrBekYroKbxFED0ak7Z86cOC3gpCgEOSxyfvR08SUUpU8gMtBZ05dlkJj/7bfHJqhsTPM2ZebMmYXO6X5Bh9PPPfdcNWDAAN2lTp06xddsgkP5XtglMtCF0zFKoKYh3FD4ywfBy6uywb1wBCoY0x5GEArCmXxYL8W4g0FGyurVqyPhdAS5pUuXppXeOWJUpndAZ20vqhIZ6M8880ws7PkIKMk6XL58BSWczprOaU7o6HfeeWcccD+EIsN0FNI7ghxaBgWzMR8KnEshpl+mc1Q2tBcSIrM+41+QIgYe8SOYFjmRZYqVRU44XfRV6ShcLCpbnTq142s60jtOEQhIlI03K6R4qHCooMJ5kxBCsCjWdDgdFSxVoe1Tp07VVZjlSI0mfgQ/gzisupFxOqD37v1UvN3icDEdLy1bnqNBr1q1unaywAnY1kklxvRvFpF4RRAUPVfqoLJFAbrtmv7ss8/q/t12221aKhddXIw1DFo0Er6Hvc5HBjrc2rdvng87GeD83qJFc62ymckDEXzgZpuCubawp3db0HNiTZfp/eSTT46bIgVIolH44JL2Jg/MJNom1YAQ4c9m0BR0j2mGtQH9448/jp0uVSNukROO5n2s2eJR43dzFghLuo+M01HZ8D2nK+PGjcn6zQ5BQUfARA0VQU0MMObUHobAVhCtIwNdOB11hYJ7EYlWPhBAVLZkuWHTDZYorwcFHRo88sgjeq1GtUTtZBCIPR7jE8CYPnRZ88Pg9shAf+ihh2KxY6nTilWqVElNnz6lxHM6oOMCFk43Q73kfwRUr5dN6nsHOMsFBRtIJiUy0Jne339/Vlw9Q1WTfO3icEHixuFSnDgdla1BgwZpjTNiVRSLHNI70/kDDzygHUMSMcNvFPEloJ9LECfySTIZBRfyeeedp9q3b6+fI7OCVyZAtWR2iSwwEtAnTZqcbyCaOjoX6GBxBB3jDAGc4vKlL+LmRfNANyfej/L555/roMS1a9fGI2L43QygMH3sXMNBk6rA6YSXAbrpjDFdsjxfVL/IOJ2RPX782ykbj7t07Ni3ih2nAzocyBoMd5meQADEOMM5dBSEWRxDcC/X0NMpAET8gETHyDPEp56KcNxLydT7FhnoIsjRKdQzghcJIyI+vXr16lp3r1ChfLHYn+6NkbvqqqvSTu8yC8j0TiYO81QKpHWZ2mV6DxoWVdBAiQx0p7LlQSCgs2sXbjajYJHM4XymYqx1YVviZBBEBrpwOo4JkVDFR47PPM8RkRcYWZwEORvjjCm9i5QuXO6V2lOuh5YXIwP9pZdeiq3XRw7NQ4L0BjtiMh09+o0SDzqhVI8++qiGjCkcoOFyWdNNVc0S15S3RQY6nN6v34taXeDDui6es7wcciomgTYq8ZwuaJiczW9mbLvEuvO7RMzKmi8DIojFLlLQ//GPF3Sf8SfLeWqiq/N7kyaNSzzorOkPP/ywOuWUU7QgiyqHNI9lkn1yqH5XXHGFluZlJuB/ibARfd4MM/M7G0QGeklK8u+V3s0NkgUBINYyU3oXKV3cxN57vVxucrvMAn4Bp34koPs5iI9GVayY3YkEkm1rQu2EQ2U7Mv2QwA6m7nvvvVfjg1SOBQ1uZ08dUbHEDBDoiRrLBkk4H2GPZ0mQCCre1Vdfnc96Z8vtkYBuMxqz+Z5koKOBwInmrhXA5oN7+Mkn87ZpY5whYHNr7BjxoioOdAvKe0Fv165dWuOMxM2Z0bCs1RI5IztTTYGOpsl6btHMAm9xoFtQMwzXaomPnLGga1bfEhR0JHYybYiZFfUNTmdp4DfxuplSuxlBY7uWC1Edp1sMryCgW7wu9Fsc6BYk9a7prNPptiqLIEdddrCyK5cjTCQpEYkLyHPDhk0iZ9ivD0ezkQPPHWs9GgJuWrHiWTRd3+JAt6BcMukdQQ31iwKAsqkRvzlGl4YNG+prqGl8ALhEZ6KwoGtW3+IF/YUXXkjJ6Zib3333Xd0nBDgiWGRN9wZMUKdEZKLIagQtGhfGmi6qmd9MFGEkG3LTe0DQiYBhPU+3ppOJisKaPmnSJG29E6eJGTwhplYzq5TkmxFd3knvFqAFvSXZmn7++edrcyrrOcIXJlX+p2CObdOmjf4fAQ2QSZjg1vSgSER4vxd0kcwLagKu47feektfZgcrnP7mm2/mW7u5hn5uZqIw9+uZ2aXE02bbZTe9W1AuijXdm2YszFxyDvQQQGcPfXErBLIUahbo4kaQdO01OZ1o3uJaatWqla7p9qm/0z25uF03QS9ubffZXge6EExAJzCCjJbFtRCYmibLlQM9GejY0YsyPZjtgGNNv/7669O13YFeEOhI2pLcj61FmFnNHSvkhV+5cqV2n4pKRsxcYe1gyWQgoDY60DOh1L/rmNM7nC770Xw8osirOtB9QuBA90mwklCdUxqI2yc1GG5Sv5yOeRa/OP5xAiRJnUrCY4wm/MVFy3WuEQdPfDyWPHHdhkFDx+k+qcj6/NRTTymSJuEn9wM6u3PJD4uLlfU9mYPFZ3OsqjvQrciWlxoNX3omaT9kQwQbNbGdc9QIRTI7S473INuV/HTDge6HWkZdAV3yvQuwEvvOZgU8apxD9/TTT+s7OceGgApOraDILtVkTTCzTqUaDCwDpCjzkz7NgR4C6KKKmbnfZbcLbtZrr71WkUqM5YD0I3PnzlWkDTGXBjPFmDkgBg0aFD/kADnALIRikRcf9y3pzhkoZrIimUkYNCxLDDL2xTnQA4J+zjnnpH0CO2DuueceNWvWLB0USUBkMk43I2MkqkZmiWQvwT//wQcf6IHEs9nuDNAAb6YhY3CZ/nsHelrIkldges9UTydfHKCzpYllYPr06ZrT4Tq4UACSN4kr1ft7spaMHDlS3XzzzW56t8TR1202oM+YMUM1b948vrnB+0JvTrnCEuwcp/uC+khlG9DhcHLZs74Tz25Gx8DVZlRMQckCLZub7zYHuiUVbUAnjfnw4cP1tmNvUn9Zc70Rr/JdAiMtm+tAD4NwNqCLAOcFlpwzgG6etSo55CQ+LkzOd5xuOQJsQccMC6AcHmyeN4c6hrkVsyyuT3bNUJdTqTjkwAyLtmxy/DYHuiUFbUHndeZ5a7Kue89RNdOPmNyeyqCTaVcc6JlSylPPL+idO3eOn/dOti1KmEdk++mGA90PtYy6fkEn+pQjtcnvPnHiRMu3hnObA92Sjn5BxziDqsZx2pk4aSybldFtDvSMyJRYyS/o7Efn7Hj2vWF7RxonvEpOmooyfMqBHhHoXbt2Ve+9954+coz4tKIsDnRL6vvldNb0W265RS1ZskQNHDgwX+rvMCRyP91woPuhVgBBjpMXyPvOoUUEUUjkjOSbKyw7e7LuOdAjAl0EOV4nac8tXx34Nge6JQn9TO/r169XxL+T3pyUoGa4FIaaTI7tsGxm0tsc6JbUFNBxnmRSJk+erI/mIlRKTlzO5L7CqEP+WbfZwYKygD5mzBiLO7PjFkK43F627MAim1rh9rJlExoRtcWBHhGhs+k1DvRsQiOitmjQ/zeil7nXZAcFnvx/hv68/3427KkAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAATIAAABmCAYAAABIrh2QAAAABHNCSVQICAgIfAhkiAAACLpJREFUeF7tnU1sVFUUgE9Ra5j+2Aw1xQAjpaUWFlpZgJUihMifMYoQjYALYrqooIiuiBrFhKjEKEmREHVBF4IbxaZqqpSYQOgCEqAba6uEhAkoi1KRlrFUEux5cHGoKJ3Xafvuvd9Nmvm75757vnPny50305mcjRs3XhEaBCAAAUsJVFdX1+SoyH7/5gFLU2DaEICAzwTi1b/JQ4+XITKfFwG5Q8B2AojM9goyfwhAQBAZiwACELCeACKzvoQkAAEIIDLWAAQgYD0BRGZ9CUkAAhCwWmTFk/Kl60wvVYQABDwnkFWRbdi5UA7tPREgTbZ3S+WciXJsf1JqVpRL6kL/DdKJFeYG/fR+vd51uje41JjEjLg01rcFl+mi6jh8NhhL++n1WYsSQZz2SVTGJdnRLSq3VE9/MK42Hc/00fv0tsYmf+qWTbuXyp4tR6Ry9sQgVo9XPDlfjrUkg+vaR8fT/hoXzHdgbM1N+2nTxzVHczzP1xPpQ2BMCGRVZKtfnx1IRQWgsql5qlwat7cFT3oVgxGRPq4S0kttsYLcQAYqkOUbqoJYIzi9T+Wl46rc9HEdxzSVUGJmXPY1tF+XjRlTpWN2bemy1MfNsfQ4Kl8jPCMo7aMC1Pt1ntpPjxO0gf+B0LF1jMVrZwbHNrmMSRU5KAQ8J5BVkZknvRGJysM8wc1OyTxmuAe7qWs7L5XF4H4qDBOjfdMfNzsis2tTIaY3IzKzW9Lb6X3Sjz14XqavyUGPa5oRrYlHYp4/i0h/zAlkVWRjng0TgAAEvCSAyLwsO0lDwC0CiMytepINBLwkgMi8LDtJQ8AtAojMrXqSDQS8JIDIvCw7SUPALQKIzK16kg0EvCSAyLwsO0lDwC0CiMytepINBLwkgMi8LDtJQ8AtAojMrXqSDQS8JHCDyMb9cbeXEEgaAhCwn8CcpeU1OUePHuV3Le2vJRlAwFsCJ0+enJtzZaB5S4DEIQABFwhUIDIXykgOEPCbACLzu/5kDwEnCCAyJ8pIEhDwmwAi87v+ZA8BJwggMifKSBIQ8JsAIvO7/mQPAScIIDInykgSEPCbACLzu/5kDwEnCCAyJ8pIEhDwmwAi87v+ZA8BJwjYKbI9W44EPwCsP/C7+o3ZTlSCJCAAgdAE7BOZCuzQlycCganQZi1KiP7SOQ0CEPCWgH0i6zh8Vo61JBGZt2uWxCHwLwL2iUxTqH/hB0n19IsMfG/Hpt1LqSsEIOA3AftEdmjvCek60ys1K8qleFJ+UD697/td7ZJXmHtDOS9e6Jd5K8tl8dqZfpeZ7CHgNgG7RBZI7HRvcJJ/X0O7bNi5MNiZ6bkyvT646c6tdmuNxAYJzu2akh0EvCNgl8hUTCos3ZGlBnZbjfVt10/2m92ZKaGeR9N+7Ma8W9Qk7B8Bu0T23prvgnNiuhvTpvL6akBmeXflSqIyfnXnlXO1isn27pvu0vyrMRlDwHkCdoksfUf25hNNwXkylZfuzvTdTH3JaZreb15SLn+pyvlKkiAEPCZgl8hMoVRc+nmyoTY+ZzZUUvSDgJUE7BSZlaiZNAQgMFIEoiGyhoYGmTp1qhQVFUlbW5ssWLBAzp8/H/xVVVVJY2Pj9ftMv5EiwrgQgIB1BKIhMuuwMWEIQCBKBBBZlKrBXCAAgVAEEFkobARBAAJRIuCGyJYsWSI7duyQ8vLyKMFlLhCAwOgQcENk06dPl+bmZkQ2OouGo0AgagQQWdQqwnwgAIGMCSCyjJERAAEIRI2A/SLbtWuX1NXVSW1tbXCejAYBCHhHwH6Racny8vLk+PHjUlFR4V0FSRgCEBA3RFZaWiotLS2c7GdFQ8BPAm6IjHct/Vy9ZA2BawQQGUsBAhCwngAis76EJAABCERLZBcPvh2qJJ81t8nD9ydk2qR/vlhxqAPlPfLWULvSDwIQiCaBaImsp3m9/HXm8KihGpdXIkWrvh2143EgCEBgRAjYK7LbJlz9qMXtE+6TSz9/HYoOIguFjSAIRI2AvSLLBklElg2KjAGBMSeAyHhpOeaLkAlAYLgEEBkiG+4aIh4CY04gWiK71LE3FJEXN38srzz/pJQlJmYcf2flioxjCIAABCJFIFoiC4uGT/aHJUccBJwggMicKCNJQMBvAojM7/qTPQScIGC/yDZv3izbt2+XNWvWSH19vRNVIQkIQCAjAvaLrK+vTwoKCqSpqUmWLVuWUfZ0hgAEnCBgv8i0DCUlJdLa2sr3kTmxJkkCAhkTcENkvGuZceEJgIBLBBCZS9UkFwh4SgCReVp40oaASwSiJbLP3zkSCu4X+z+ReQ8+JiUTJmccv+q12RnHEAABCESKQLRE9v7affJj66+jRih+T558ePDpUTseB4IABEaEgL0iixXmyqxHE5Lq6ZdjLclQdEZCZJcvX5Z3t34Qaj5hg0pL75XnVj8bNpw4CNhOwF6RZYP8SImsbv3Lt5xeLDZeUqk/xVzeMuB/OiyYPw+RDQcgsbYT8Ftkd8T75NWG+Vkr4rZt22TdunXy0c5PbznmlCmTJTZ+fNCvuHiCdHb+Il3nzt0y7mYdEFkobAS5QyD6ItOXkLGCXCmenC9dp3uDl5Lpt7vO9IYuh4qstSd7/9bU2dkphYWFsvKZ1aHnFCYQkYWhRoxDBKIvMoWdmBEXFVrqQr+ouFRk6bfDFiTbLy0PHDggc+fOlaG8tAw7Z3Zk2STHWI4QsENkIwU72yLTeerJfkQ2UhVjXAjclAAiy/bHL1Rkp06Fexd1OIu0rGzacMKJhYDNBKInsuGc8wpTia0tfNV1GG7EQCBCBKIlsgiBYSoQgIA9BBCZPbViphCAwH8QQGQsDQhAwHoCiMz6EpIABCCAyFgDEICA9QQQmfUlJAEIQACRsQYgAAHrCSAy60tIAhCAACJjDUAAAtYTQGTWl5AEIAABRMYagAAErCeAyKwvIQlAAAKIjDUAAQhYTwCRWV9CEoAABCpyYAABCEDAdgJ/A/hJSAZJjho8AAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,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\"","export default __webpack_public_path__ + \"static/media/ProductRequirement_HeroBanner.2e28ab2c.png\";","export default __webpack_public_path__ + \"static/media/UserExperienceEnsurance_Image.0956364a.png\";","import React from 'react'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb';\r\nimport { Footer } from './../HeaderFooter';\r\nimport ProductRequirement_HeroBanner from './../../../assets/images/ProductRequirement_HeroBanner.png';\r\nimport UserExperienceEnsurance from './../../../assets/images/UserExperienceEnsurance_Image.png';\r\nimport ToolTip from 'react-power-tooltip';\r\nimport { useState } from 'react';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nconst Functional_Cards= [\r\n {\r\n id: 1,\r\n title:'Bottom to Top - Top to Bottom',\r\n text:'Users can drill down in more depth levels within the data structure.'\r\n },\r\n {\r\n id: 2,\r\n title:'Export capability',\r\n text:'Export data in multiple formats (e.g., xls, pdf, csv).'\r\n },\r\n {\r\n id: 3,\r\n title:'Graphical Visualization',\r\n text:'The dashboard need to graphically display the reports.'\r\n },\r\n {\r\n id: 4,\r\n title:'Connectivity',\r\n text:'Connection to the Reporting platform by various Report display solutions should be supported (eg. PowerBI).'\r\n},\r\n{\r\n id: 5,\r\n title:'Access',\r\n text:'The platform must have the ability to assure Role Based Access Control (RBAC).'\r\n},\r\n{\r\n id: 6,\r\n title:'Access audit',\r\n text:'Real time access to audit all kind of access.'\r\n},\r\n{\r\n id: 7,\r\n title:'Normalisation & Standardisation',\r\n text:'Standardize and normalize the data (fields) and have a common taxonomy defined.'\r\n},\r\n{\r\n id: 8,\r\n title:'Data Anonymization',\r\n text:'Anonymize data wherever required to be compliant with legal and other regulations (eg. GDPR).'\r\n},\r\n{\r\n id: 9,\r\n title:'Data Ingestion On Schedule',\r\n text:'The platform need to be able to run scheduled data fetch/ingestion.'\r\n},\r\n{\r\n id: 10,\r\n title:'Data Access Management',\r\n text:'Data owners should have the ability to flexibly manage Accesses for Users with regards of their own data.'\r\n},\r\n{\r\n id: 11,\r\n title:'Data Validation',\r\n text:'Validation of data before injection into the database (logic for the data source and checks to be developed).'\r\n},\r\n{\r\n id: 12,\r\n title:'Report Parametrisation',\r\n text:'Data owners should have the ability to change certain parameters of reports or create custom ones.'\r\n},\r\n{\r\n id: 13,\r\n title:'Time Zone Coverage',\r\n text:'The platform need to be able to manage data in different time zones.'\r\n},\r\n{\r\n id: 14,\r\n title:'Language Localisation',\r\n text:'The platform need to be able to handle language localization (if required).'\r\n},\r\n{\r\n id: 15,\r\n title:'Support & Enhancement Interface',\r\n text:'The platform should have an interface for Users being able to apply for support (incident management, change management) or enter enhancement requests.'\r\n}\r\n]\r\nconst NonFunctional_Cards= [\r\n {\r\n id: 1,\r\n title:'Audit',text1:'Audit – User Activity',text2:'Audit – Database (backup, retention)',text3:'Source code (vulnerability, patching)', text4:'',text5:'',text6:'',text7:''\r\n },\r\n {\r\n id: 2,\r\n title:'Documentation',text1:'Architecture guide',text2:'Data & Security design',text3:'Functional design', text4:'End User manual',text5:'Cost Model inputs (deploy, run)',text6:'API guide',text7:''\r\n },\r\n {\r\n id: 3,\r\n title:'Design Principles',text1:'Privacy',text2:'Centralization', text3:'Language',text4:'Data processing model',text5:'Accessibility (API)',text6:''\r\n },\r\n {\r\n id: 4,\r\n title:'Integrity',text1:'Application integrity',text2:'Data integrity',text3:'', text4:'',text5:'',text6:'',text7:''\r\n},\r\n{\r\n id: 5,\r\n title:'Usability',text1:'Accessibility (User access)',text2:'User standards (Look / Feel)',text3:'Localisation (Language, spellings, keyboard – EN only)', text4:'',text5:'',text6:'',text7:''\r\n},\r\n{\r\n id: 6,\r\n title:'Security',text1:'Access permissions (Admin, User)',text2:'Data classification / System Accreditation (Data protection)',text3:'PW requirements', text4:'System network Access (Int/Ext)',text5:'Risks – Mitigating factors',text6:'Security Testing (regular)',text7:'System - Data backup'\r\n},\r\n{\r\n id: 7,\r\n title:'Reporting',text1:'Client consumption',text2:'Utilization (Servic and Cost)',text3:'', text4:'',text5:'',text6:'',text7:''\r\n},\r\n{\r\n id: 8,\r\n title:'Compatibility',text1:'Compatibility (UI with common browsers)',text2:'',text3:'', text4:'',text5:'',text6:'',text7:''\r\n},\r\n{\r\n id: 9,\r\n title:'Continuous Delivery',text1:'Rolling updates and changes',text2:'',text3:'', text4:'',text5:'',text6:'',text7:''\r\n},\r\n{\r\n id: 10,\r\n title:'Delivery Kit',text1:'Control and Manage (Centrally)',text2:'',text3:'', text4:'',text5:'',text6:'',text7:''\r\n},\r\n{\r\n id: 11,\r\n title:'Automation',text1:'Accept, digest data (fully, semi, minimal manual)',text2:'Output reports to e-mail (scheduled)',text3:'System Access review notifications', text4:'',text5:'',text6:'',text7:''\r\n}\r\n]\r\n\r\nconst user_exp= [\r\n {\r\n id: 1,\r\n title:'Availability',\r\n text1:'Globally' ,\r\n text2:'7x24x365',\r\n text3:'Aim 95% minimum, 98% expected',\r\n text4:''\r\n },\r\n {\r\n id: 2,\r\n title:'Recoverability',\r\n text1:'Backup frequencies',\r\n text2:'Recovery process',\r\n text3:'RPO (Recovery Point Objectives)',\r\n text4:'RTO (Recovery Time Objectives)'\r\n },\r\n {\r\n id: 3,\r\n title:'Reliability',\r\n text1:'Functionality under stated conditions',\r\n text2:'Mean Time between failures (Downtime)',\r\n text3:'Mean time to recovery',\r\n text4:''\r\n },\r\n {\r\n id: 4,\r\n title:'Capacity',\r\n text1:'Forecasting (Growth/Reduction Audit, Forecast)',\r\n text2:'Monitoring (Storage, Throughput, Memory)',\r\n text3:'Optimisation (Cascaded)',\r\n text4:''\r\n},\r\n{\r\n id: 5,\r\n title:'Usability',\r\n text1:'Performance',\r\n text2:'Processing times (Response, Processing, Calculations)',\r\n text3:'Query and Reporting times (Initial load)',\r\n text4:''\r\n}\r\n]\r\nconst ProductRequirements = () => {\r\n const history = useHistory();\r\n const [nonFunctionalTooltip, setNonFunctionalTooltip] = useState(false)\r\n const [nonFuctionalIndex, setNonFunctionalIndex] = useState(null);\r\n const [functionalTooltip, setFunctionalTooltip] = useState(false)\r\n const [dropdownIndex, setDropdownIndex] = useState(null);\r\n const onClickFunctional =(link,index) =>{\r\n setDropdownIndex(index);\r\n setFunctionalTooltip(true)\r\n }\r\n const onClickNonFunctional =(link,index) =>{\r\n setNonFunctionalIndex(index);\r\n setNonFunctionalTooltip(true)\r\n }\r\n return (\r\n <>\r\n \r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Solution - Product Requirements' />\r\n \r\n
Product Requirements
A systematic preparation and thorough decision making process assured to develop our GSD Insight solution conforming all the layers of requirements.
\r\n
\r\n \r\n \r\n
Functional Requirements
\r\n
\r\n {Functional_Cards.map((link, index) => (
onClickFunctional(link, index)} onMouseLeave={() =>setFunctionalTooltip(false) }>{link.title}
\r\n {(functionalTooltip && dropdownIndex === index) &&
\r\n {link.text} \r\n }
))}\r\n
\r\n \r\n \r\n
Non Functional Requirements
\r\n
\r\n {NonFunctional_Cards.map((link, index) => (
onClickNonFunctional(link, index)} onMouseLeave={() =>setNonFunctionalTooltip(false) }>{link.title}
\r\n {(nonFunctionalTooltip && nonFuctionalIndex === index) &&
\r\n {link.text1}
{link.text2}
{link.text3}
{link.text4}
{link.text5}
\r\n {link.text6}
{link.text7}
\r\n }
))}\r\n
\r\n \r\n \r\n
User Experience Ensurance
\r\n
\r\n
\r\n
\r\n {user_exp.map((data, index) => ( {data.title}
{data.text1}
\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ProductRequirements","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAABHNCSVQICAgIfAhkiAAAAPhJREFUSEutlY0RwiAMha07uoQOYR2iTuFkOgS+IOkBDfnh5K7HlZbvQcgLywktpXRFty1o9D7bwFlpLjC/nsEF+MSH2wy8gO9l7oMECJ46WFigAzPunMOAjxs6Cg03t4AAfmHVlxwWps0IaOAGHt2BBT7AvQIesAi3BLzgIXwkgPEPHk43+m0/PCl9VdMIh1wzVLC6ciWLzBXzXNPuA4O4fGCFZe1iXIfFFBjCpawA+R1xsgjX0i3i5APck8degQbuAUdqUV24+sMz89jaAZfcMNizA7ospsGa0ejK7OFmKKQaItSi7IEmLH+4oOnK3M1l2n+0Us/4FzTGvRavoOyPAAAAAElFTkSuQmCC\"","import React from 'react';\r\nimport Download_Normal from './../../../assets/images/Download_Icon.png';\r\nimport Close_NormalState from './../../../assets/images/CloseWindow_Icon.png';\r\nimport './Solution.css'\r\nimport * as htmlToImage from 'html-to-image';\r\nimport { useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useState } from 'react';\r\n\r\n\r\nfunction ArchitectCards(props) {\r\n const history = useHistory();\r\n let displayInfo = useSelector((state) => state.welcomePageReducer.githubCarouselData);\r\n const [isActive, setIsActive] = useState(false)\r\n console.log(isActive)\r\n const exportAsPicture = (image) => {\r\n htmlToImage.toPng(document.getElementById('whatever'), {\r\n quality: 0.90,\r\n })\r\n .then(function (dataUrl) {\r\n let link = document.createElement('a');\r\n link.download = image;\r\n link.href = dataUrl;\r\n link.click()\r\n })\r\n .catch(function (error) {\r\n console.error('oops, something went wrong!', error);\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
setIsActive(!isActive)} marginLeft={isActive ? '-100px' :'auto'} className={!isActive ? 'margin_auto' :'margin_100' }/>\r\n \r\n \r\n\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArchitectCards","export default __webpack_public_path__ + \"static/media/Developer_HeroImage.ffa4d5d0.png\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAQCAYAAAAvf+5AAAAABHNCSVQICAgIfAhkiAAAAKFJREFUKFNjfPXqlQEDA0M/KytroKCg4AcgGytgfPHixQFGRkZ7oOwFNjY2R1yKGd+/fy/w69evA0CF+vgUM4LsIUYxWCExiuEKCSlGUYhPMYZCJMUXgGx5kAfFxcUNsSoEhm3C////54M0AYMuUUxMbAGGQmyKwBqQowGXIhSF+BTBFRJSBFZIjCIUhTDf4Uw9IInnz58rSEpKPsClCCQOAFq5fBH5R4kdAAAAAElFTkSuQmCC\"","import React from 'react';\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb';\r\nimport { Footer } from '../HeaderFooter';\r\nimport './Developer.css';\r\nimport Developer_HeroImage from './../../../assets/github-images/Developer_HeroImage.png';\r\nimport RightArrow_Hover from './../../../assets/github-images/RightArrow_Hover.png';\r\nimport { useDispatch } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { setDeveloperCard } from '../../../actions/github.action';\r\n\r\n\r\nconst Developer_Cards = [\r\n { id: 1, title: 'Infrastructure', text: 'infra' },\r\n {\r\n id: 2,\r\n title: 'Developer Access',\r\n text: 'access'\r\n },\r\n {\r\n id: 3,\r\n title: 'Developer Guidelines',\r\n text: 'guidelines'\r\n },\r\n {\r\n id: 4,\r\n title: 'Development Environment',\r\n text: 'environment'\r\n },\r\n {\r\n id: 5,\r\n title: 'Documentation Standards',\r\n text: 'standard'\r\n },\r\n {\r\n id: 6,\r\n title: 'Release and Build Guides',\r\n text: 'release'\r\n },\r\n {\r\n id: 7,\r\n title: 'Product Maintenance',\r\n text: 'product'\r\n },\r\n {\r\n id: 8,\r\n title: 'Developer Support',\r\n text: 'support'\r\n },\r\n {\r\n id: 9,\r\n title: 'Design Principles',\r\n text: 'principle'\r\n }\r\n]\r\n\r\nconst DeveloperLanding = () => {\r\n const dispatch = useDispatch();\r\n const history= useHistory();\r\n const onClickDeveloperCards=(card)=>{\r\n dispatch(setDeveloperCard(card));\r\n history.push('/developer/card')\r\n }\r\n return (\r\n <>\r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Developer' />\r\n \r\n
Developer
This repository contains information, guidance and processes for developers, including coding, design, application management, maintenance and technical support of the GSD Insight application.
\r\n
\r\n \r\n \r\n
\r\n {Developer_Cards.map((link, index) => (
onClickDeveloperCards(link)}>
{link.title}
))}\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default DeveloperLanding","import React, { useState } from 'react'\r\nimport { Offcanvas } from 'react-bootstrap';\r\nimport { useDispatch } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { setDeveloperCard } from '../../../actions/github.action';\r\nimport Menu_Hover from './../../../assets/images/Menu_Hover.png'\r\nimport { Redirect } from 'react-router-dom';\r\n\r\nconst Developer_Cards = [\r\n { id: 1, title: 'Infrastructure',\r\n text: 'infra' },\r\n {\r\n id: 2,\r\n title: 'Developer Access',\r\n text: 'access'\r\n },\r\n {\r\n id: 3,\r\n title: 'Developer Guidelines',\r\n text: 'guidelines'\r\n },\r\n {\r\n id: 4,\r\n title: 'Development Environment',\r\n text: 'environment'\r\n },\r\n {\r\n id: 5,\r\n title: 'Documentation Standards',\r\n text: 'standard'\r\n },\r\n {\r\n id: 6,\r\n title: 'Release and Build Guides',\r\n text: 'release'\r\n },\r\n {\r\n id: 7,\r\n title: 'Product Maintenance',\r\n text: 'product'\r\n },\r\n {\r\n id: 8,\r\n title: 'Developer Support',\r\n text: 'support'\r\n },\r\n {\r\n id: 9,\r\n title: 'Design Principles ',\r\n text: 'principle'\r\n }\r\n]\r\nconst DeveloperOffcanvas = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const [show, setShow] = useState();\r\n const handleClose = () => setShow(false);\r\n const handleShow = () => setShow(true);\r\n const onClickDeveloperCards = (card) => {\r\n dispatch(setDeveloperCard(card));\r\n // history.push('/developer/card');\r\n \r\n \r\n Developer \r\n \r\n {Developer_Cards.map((link, index) => ( onClickDeveloperCards(link)} className='offcanvas_list'>{link.title}
))}\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default DeveloperOffcanvas","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAZ0lEQVRIidXWwQ2AQAhE0Y+hFAvRSizFtRJLUSvDGjjMJsMZeAksyUZVoYw41lsqLMrmU4AEdjXwKgH/HfgDCQxAdmwJnKrmMGlElxoYSsD/mfoDCWz0Du3rAk+nAIhOsv8OQv1t+QFJeg8ZEHhF9AAAAABJRU5ErkJggg==\"","export default __webpack_public_path__ + \"static/media/BackupRetention.31966faa.png\";","export default __webpack_public_path__ + \"static/media/Maintenance.7062be5a.png\";","import React from 'react'\r\nimport { Accordion } from 'react-bootstrap';\r\nimport './InfraStructure.css';\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\nimport BackupRetention from './../../../../assets/github-images/BackupRetention.png';\r\nimport Maintenance from './../../../../assets/github-images/Maintenance.png';\r\n\r\n\r\nconst sql_headers = [\r\n { id: '1', caption: \"Instance\" },\r\n { id: '2', caption: \"Role\" },\r\n { id: '3', caption: \"FQDN\" },\r\n { id: '4', caption: \"Operating System\" }\r\n]\r\nconst SQL_DATA = [\r\n { id: '1', 'Instance': 'DEV', 'Role': 'SQL Database', 'FQDN': 'zc4w02439.itcs.houston.dxccorp.net', 'OperatingSystem': 'Server 2019' },\r\n { id: '2', 'Instance': 'UAT', 'Role': 'SQL Database', 'FQDN': 'zc4w02440.itcs.houston.dxccorp.net', 'OperatingSystem': 'Server 2019' }\r\n]\r\n\r\nconst window_platform = [\r\n { id: '1', caption: \"Instance\" },\r\n { id: '2', caption: \"Role\" },\r\n { id: '3', caption: \"FQDN\" },\r\n {id:'4',caption:'IP'},\r\n { id: '5', caption: \"Operating System\" },\r\n { id: '6', caption: \"RDP\" }\r\n]\r\nconst window_platform_data = [\r\n { id: '1', 'Instance': 'DEV', 'Role': 'IIS Web Server', 'FQDN': 'zc4w02443.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.135.88','OperatingSystem': 'Server 2016 R2','RDP':'zc4w02443.rdp',\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/images/zc4w02443.rdp'\r\n},\r\n { id: '2', 'Instance': 'UAT', 'Role': 'SQL Database', 'FQDN': 'zc4w02439.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.143.93', 'OperatingSystem': 'Server 2019','RDP':'zc4w02439.rdp',\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/images/zc4w02439.rdp' \r\n},\r\n { id: '3', 'Instance': 'UAT', 'Role': 'IIS Web Server', 'FQDN': 'zc4w02443.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.135.88', 'OperatingSystem': 'Server 2016 R2','RDP':'zc4w02443.rdp',\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/images/zc4w02443.rdp'\r\n },\r\n { id: '4', 'Instance': 'PROD', 'Role': 'SQL Database', 'FQDN': 'zc4w02440.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.135.87', 'OperatingSystem': 'Server 2019','RDP':'zc4w02440.rdp' ,\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/images/zc4w02440.rdp'\r\n},\r\n { id: '5', 'Instance': 'PROD', 'Role': 'IIS Web Server', 'FQDN': 'zc4w02441.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.143.95', 'OperatingSystem': 'Server 2016 R2','RDP':'zc4w02441.rdp',\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/images/zc4w02441.rdp' \r\n},\r\n { id: '6', 'Instance': 'PROD', 'Role': 'IIS Web Server', 'FQDN': 'zc4w02442.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.143.96', 'OperatingSystem': 'Server 2016 R2','RDP':'zc4w02442.rdp',\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/servers/images/zc4w002442.rdp' \r\n},\r\n { id: '7', 'Instance': 'BACKUP', 'Role': 'Backup Server', 'FQDN': 'zc4w01327.itcs.houston.dxccorp.net',\r\n 'IP':'15.140.131.24', 'OperatingSystem': 'Server 2012 R2','RDP':'zc4w01327.rdp',\r\n 'href':'https://github.dxc.com/pages/MWSGSD/GSD-Insight/developer/infrastructure/images/zc4w01327.rdp'\r\n },\r\n]\r\n\r\nconst AWS_Instance = [\r\n { id: '1', caption: \"Instance Name\" },\r\n { id: '2', caption: \"Instance Region\" }\r\n]\r\nconst AWS_Instance_DATA = [\r\n { id: '1', 'InstanceName': 'dxc-ito-mws-asia', 'InstanceRegion':'eu-central-1'},\r\n { id: '2', 'InstanceName': 'dxc-ito-mws-india-e', 'InstanceRegion':'eu-central-1'},\r\n { id: '3', 'InstanceName': 'interim-dxc-ito-mws-nce-se', 'InstanceRegion':'eu-central-1'},\r\n { id: '4', 'InstanceName': 'dxc-ito-mws-uki', 'InstanceRegion':'eu-central-1'},\r\n { id: '5', 'InstanceName': 'dxc-ito-mws-amr-us-wr', 'InstanceRegion':'dxc-ito-mws-amr-us-wr'},\r\n]\r\n\r\nconst AWS_Instance_DATA2 = [\r\n { id: '1', 'InstanceName': 'dxc-ito-mws-anz', 'InstanceRegion':'ap-southeast-2'},\r\n { id: '2', 'InstanceName': 'dxc-ito-mws-amr', 'InstanceRegion':'us-west-2'},\r\n { id: '3', 'InstanceName': 'dxc-ito-mws-nce-se', 'InstanceRegion':'eu-central-1'},\r\n { id: '4', 'InstanceName': 'dxc-ito-mws-asia-ml', 'InstanceRegion':'eu-central-1'}\r\n]\r\n\r\nconst Balancer = [\r\n { id: '1', caption: \"IP Address\" },\r\n { id: '2', caption: \"Name\" }\r\n]\r\nconst Balancer_DATA = [\r\n { id: '1', 'IPAddress': '15.140.145.114', 'Name':'gsdinsightlb.itcs.houston.dxccorp.net'}\r\n]\r\n\r\nconst SERVER='https://dxcportal.sharepoint.com/:w:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7B446F54B9-952F-43B5-A53B-D850035A2E12%7D&file=GSD_Insight_Server_Maintenance_Process_v20220328.docx&action=default&mobileredirect=true&wdOrigin=TEAMS-ELECTRON.teams.files&wdExp=TEAMS-CONTROL&wdhostclicktime=1648474113072&cid=ed3cd107-5935-4e85-9f2a-ed4a13a08d91';\r\nconst SERVER_APP='https://dxcportal.sharepoint.com/:w:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BA42B84C3-0C9D-42A2-A2ED-B046A16B4062%7D&file=GSD_Insight_Devenv_Runtime_Update_Process_v20220531.docx&action=default&mobileredirect=true';\r\nfunction InfraStructure() {\r\n return (\r\n <>\r\n \r\n \r\n
Infrastructure
\r\n
\r\n
\r\n \r\n \r\n Servers \r\n \r\n <>\r\n \r\n The GSD Insight solution is architected to run on Windows platform.
\r\n \r\n \r\n {window_platform.map(header => ({header.caption} \r\n {window_platform_data.map((data, index) => (\r\n {data?.Instance} \r\n {data?.Role} \r\n {data?.FQDN} \r\n {data?.IP} \r\n {data?.OperatingSystem} \r\n {data?.RDP} ))} \r\n
\r\n \r\n AWS [ASD] Synchronized Instances
\r\n \r\n \r\n \r\n \r\n {AWS_Instance.map(header => ({header.caption} \r\n {AWS_Instance_DATA.map((data, index) => (\r\n {data?.InstanceName} \r\n {data?.InstanceRegion} \r\n ))} \r\n
\r\n \r\n \r\n \r\n \r\n {AWS_Instance.map(header => ({header.caption} \r\n {AWS_Instance_DATA2.map((data, index) => (\r\n {data?.InstanceName} \r\n {data?.InstanceRegion} \r\n ))} \r\n
\r\n \r\n \r\n \r\n \r\n Balancer
\r\n \r\n \r\n {Balancer.map(header => ({header.caption} \r\n {Balancer_DATA.map((data, index) => (\r\n {data?.IPAddress} \r\n {data?.Name} \r\n ))} \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n SQL Database \r\n \r\n <>\r\n \r\n The selected database platform is Microsoft SQL Server 2019 due to Reliability, Scalability, and Security out of the box features. \r\n \r\n \r\n {sql_headers.map(header => ({header.caption} \r\n {SQL_DATA.map((data, index) => (\r\n {data?.Instance} \r\n {data?.Role} \r\n {data?.FQDN} \r\n {data?.OperatingSystem} \r\n ))} \r\n
\r\n \r\n Backup & Retention
On both instance the following settings are configured:
\r\n \r\n \r\n Daily full backup from all user databases - running at 01:00 AM UTCBackups are kept for 2 weeks on local drive (F:\\SQLBackups folder) \r\n Backups are automatically copied to a 2nd location (scheduled task copy job) \r\n \r\n \r\n \r\n Maintenance
Automatic maintenance is configured to run every Sunday at 6:00 PM UTC.
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Server Maintenance \r\n \r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n )\r\n}\r\n\r\nexport default InfraStructure","export default __webpack_public_path__ + \"static/media/DeveloperAccess_domain_account_image_1.d63c42bd.png\";","export default __webpack_public_path__ + \"static/media/DeveloperAccess_domain_account_image_2.f51ce0cc.png\";","export default __webpack_public_path__ + \"static/media/DeveloperAccess_domain_account_image_3.b9457c30.png\";","import React from 'react'\r\nimport { Accordion } from 'react-bootstrap'\r\nimport './DeveloperAccess.css';\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\nimport DeveloperAccess_logo from './../../../../assets/github-images/DeveloperAccess_domain_account_image_1.png';\r\nimport DeveloperAccess_step1 from './../../../../assets/github-images/DeveloperAccess_domain_account_image_2.png';\r\nimport DeveloperAccess_step2 from './../../../../assets/github-images/DeveloperAccess_domain_account_image_3.png';\r\nimport { Link } from 'react-router-dom';\r\n\r\nconst CREATE_ACCOUNT = [\r\n { id: '1', caption: \"Set a password, this will need to change every 2 months and needs to be at least 25 characters long so it’s recommended to use the password generator. \" },\r\n { id: '2', caption: \"On the right box under Unix Information, click yes to enable Unix.\" },\r\n { id: '3', caption: \"Verify your information. it will fill automatically except for the optional fields.\" },\r\n { id: '4', caption: \"Click next to go to submit your account.\" }\r\n]\r\nconst REQUEST_ACCOUNT = [\r\n { id: '1', caption: \"After all approvals are in place - your account will be created\" },\r\n { id: '2', caption: \"Send the account name (x-username) to project architect\" },\r\n { id: '3', caption: \"Architect will grant access to the required servers and SQL databases\" }\r\n]\r\nconst VERIFY_ACCOUNT = [\r\n { id: '1', caption: \"Connect to Secure Pulse\" },\r\n { id: '2', caption: \"Use RDP from your PC and connect using the provided IP address or FQDN of the servers\" },\r\n { id: '3', caption: \"Login to the server using your “SSZ / x-username” & related password\" }\r\n]\r\nconst DeveloperAccess = () => {\r\n\r\n const VIRTUALSM = 'https://virtualsm.houston.dxccorp.net/';\r\n return (\r\n <>\r\n \r\n \r\n
Developer Access
\r\n
\r\n
\r\n \r\n \r\n Developer Access Guide \r\n \r\n <>\r\n \r\n New members (developer / support) should follow the steps below to get the required accesses:
\r\n \r\n
\r\n If you have been nominated / contacted to start working on this application & platform - please get approval from your direct manager & the project leaders. \r\n Request your special administrator account by following the New Member - Access request. \r\n After account is ready - send it to Architect & Lead developer - so they can grant the required access \r\n Follow their instructions and tests to validate your access \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n New Member - Access Request \r\n \r\n <>\r\n \r\n In order to access all the different environments for GSD Insight you will need the following: \r\n DXC Email & UID Secure Pulse VPN If you don’t have one or more of the previous requirements please contact your onboarding contact or manager. After following this process you will be able to do the following tasks: \r\n \r\n Connect via RDP to GSD Insight environments (UAT / PROD) \r\n Start developing a tile/module as required \r\n \r\n Requesting an Admin Account in VirtualSM
\r\n \r\n If you already have a VirtualSM account please skip this process
\r\n \r\n Connect to Secure Pulse VPN to your nearest location (or Houston) \r\n Go to window.open(VIRTUALSM, '_blank')}>https://virtualsm.houston.dxccorp.net/ \r\n On the left menu, under Domain Services, click Create Domain Account \r\n You are going to create a user for all the different servers that you'll be accessing \r\n On the main box under domain, select SSZ \r\n Select Admin Account \r\n On the right box, create a username, most people use the same as their username in the DXC email. (! do NOT remove the \"x-\" part ! - example: x-username) \r\n Click next to configure the new user \r\n \r\n \r\n \r\n {CREATE_ACCOUNT.map((data, index) => ({data.caption} ))} Verify all information and click on Request Account. \r\n The request require approval from your direct manager! \r\n Request Access to Servers
{REQUEST_ACCOUNT.map((data, index) => ({data.caption} ))} \r\n \r\n Request Access to Servers
{VERIFY_ACCOUNT.map((data, index) => ({data.caption} ))} Password Reset
\r\n Check if your password has expired in VirtualSM. Go to Account Domains, manage Accounts. Then go to the tab “Domain Accounts” and check the password status for your account. Under password, you can reset the password. Set automatic notification so the tool to remind you to change the password before expiration.
\r\n SRPA Request Expired or Deleted
\r\n Important that you will need to renew your admin account in VirtualSM periodically. If not renewed it will get expired and deleted resulting in access removal from the servers.
\r\n \r\n \r\n\r\n \r\n \r\n \r\n\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default DeveloperAccess","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAqCAYAAADf/ynVAAAABHNCSVQICAgIfAhkiAAAAMdJREFUWEftmFEKgCAQRNOLFHQD8f4n8ApBnaQ0+hCz3FVUivGnIGuH1zbMJga7jDGrPYzuvMWSUk5Kqe2tlrCi9hZi/BoQxiWeRUxrLbiFauy/9RiEJTB/m1gPnyMRg7Cr75yd/IsYxSA53ha2SjYxCPOxx5w/hjoVW/Aq/SCJHkOPPXwR8DGOVcSmNDh/iiB6LEUovA5iIIbYUzqMIPYg9jBjzxwQWyjOXH0YoZhhF7vIEUa5p2TPmccoD+jytwfCKAQ85z8Aey+SbL0U2YkAAAAASUVORK5CYII=\"","export default __webpack_public_path__ + \"static/media/DeveloperGuidelines_TyporaDefendorerror.92a95176.png\";","export default __webpack_public_path__ + \"static/media/DeveloperGuidelines_Summary.21ab214b.png\";","export default __webpack_public_path__ + \"static/media/Developer_Guidelines_pushorigin.7d6158f6.png\";","export default __webpack_public_path__ + \"static/media/DeveloperGuidelines_fetchorigin.e3eba93e.png\";","export default __webpack_public_path__ + \"static/media/DeveloperGuidelines_syncupstreammaster.a15272e7.png\";","import React, { useState } from 'react'\r\nimport { Accordion, ListGroup } from 'react-bootstrap'\r\nimport './DeveloperGuidelines.css';\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\nimport CopyToClipboard from './../../../../assets/github-images/CopyToClipboard.png';\r\nimport Developerguidelines from './../../../../assets/github-images/DeveloperGuidelines_TyporaDefendorerror.png';\r\nimport FORK_REPO from './../../../../assets/github-images/FORK_REPO.png';\r\nimport DeveloperGuidelines_Summary from './../../../../assets/github-images/DeveloperGuidelines_Summary.png';\r\nimport Developer_Guidelines_pushorigin from './../../../../assets/github-images/Developer_Guidelines_pushorigin.png';\r\nimport fetchorigin from './../../../../assets/github-images/DeveloperGuidelines_fetchorigin.png';\r\nimport syncupstreammaster from './../../../../assets/github-images/DeveloperGuidelines_syncupstreammaster.png';\r\nimport ToolTip from 'react-power-tooltip';\r\n\r\nconst DEDICATED_TOOLS = [\r\n { id: '1', title: \"Visual Studio 2017 / 2019\" },\r\n { id: '2', title: \"SQL Server Management Studio\" },\r\n { id: '3', title: \"Exchange Web Services\" },\r\n { id: '4', title: \"Powershell\" }\r\n]\r\n\r\nconst GENERIC_ONES = [\r\n { id: '1', title: \"Windows RDP\" },\r\n { id: '2', title: \"Notepad++\" },\r\n { id: '3', title: \"IIS Manager\" },\r\n { id: '4', title: \"GitHub Desktop\" },\r\n { id: '5', title: \"Visual Studio Code\" },\r\n { id: '6', title: \"Typora\" }\r\n]\r\nconst CODE_ETIQUETTE = [\r\n { id: '1', caption: \"Acknowledge that our Development Environment is shared amongst multiple developers.\" },\r\n { id: '2', caption: \"If you want to enhance (either because of a new project requirement - or a break fix scenario) - please talk with the other developers + the Lead developers. If they are not available - please seek guidance from the project team leaders/managers. \" },\r\n { id: '3', caption: \"We encourage review and scrutiny of ALL code in GSD Insight. We need to ensure that your suggestions do not conflict and will not potentially break other components that you may not be aware of.\" },\r\n { id: '4', caption: \"Approaching the lead developers with suggested code already well thought out is desirable.\" },\r\n { id: '5', caption: \"Try to write code in a manner consistent with existing code. Study the standard coding practices to ensure alignment. Code that looks like everyone is aware of consistency is much easier to maintain.\" },\r\n { id: '6', caption: \"Check your code into git (git add ; git commit ) regularly (note this needs to be done as your user and not root). Don’t check in broken code - so choose your moments carefully. \" },\r\n { id: '7', caption: \"You write code - YOU are responsible for keeping the Developers Wiki up-to-date.\" },\r\n { id: '8', caption: \"Release to production is controlled. Normally weekly. Don’t release stuff outside of this process without approval from project manager (or his delegate). Break-Fix releases still require approval (and are normally approved).\" }\r\n]\r\nconst NAMING_CONVENTIONS = [\r\n { id: '1', title: \"Module names are lowercase_with_underscores\" },\r\n { id: '2', title: \"Constants are UPPERCASE_WITH_UNDERSCORES\" },\r\n { id: '3', title: \"Package wide variables are Mixed_Case_With_Underscores\" },\r\n { id: '4', title: \"Function variables are lowercase_with_underscores\" }\r\n]\r\nconst BASIC_REFERENCES = [\r\n { id: '1', caption: \"Term\" },\r\n { id: '2', caption: \"Description\" }\r\n]\r\nconst BASIC_REFERENCES_DATA = [\r\n { id: '1', 'Term': 'upstream/master', 'Description': 'This is the master branch of the upstream repo. In our case this is Platform-DXC/intelligence-oc This is final location for our content and where our users will reference the articles from' },\r\n { id: '2', 'Term': 'clone', 'Description': 'This is the local copy of your forked repo. It will reside on your PC at the location that you have chosen. eg: documents/intelligence-oc . This the the location that you will locally edit/add markdown files.' },\r\n { id: '3', 'Term': 'forked repo', 'Description': 'This process requires you to fork the Platform-DXC/intelligence-oc repo to a repo that you own. This is where your github desktop will push its origin to' },\r\n { id: '4', 'Term': 'Pull request', 'Description': 'This is the process by which you initiate the changes in your forked repo to the upstream/master. This process involves you initating the PULL request - and an approver approving the merge. Depending on what you have changed - this approver may need to resolve merge conflicts.' }\r\n]\r\n\r\nconst MARKDOWN_FILES = [\r\n { id: '1', caption: \"Location of Developer articles (.md files)\" },\r\n { id: '2', caption: \"docs/developer/\" }\r\n]\r\nconst MARKDOWN_FILES_DATA = [\r\n { id: '1', 'location': 'Location of Developer images (.png files)', 'docs': 'docs/developer/images/' },\r\n { id: '2', 'location': 'Report manuals are named', 'docs': 'report_manual_*.md' },\r\n { id: '3', 'location': 'Markdown case', 'docs': 'Lower case – no spaces' },\r\n { id: '4', 'location': 'Markdown references', 'docs': './images/…. Use relative referencing for github content' }\r\n]\r\nconst MARKDOWN_LIST = [\r\n { id: '1', title: \"I created a new business_overview.md file (and took that section out of architecture.md)\" },\r\n { id: '2', title: \"Added this new md file to docs/README.md (as it is one of the few really important ones)\" },\r\n { id: '3', title: \"Added this new md file to docs/developers/README.md\" }\r\n]\r\nconst DeveloperGuidelines = () => {\r\n const [tooltipText, setTooltipText] = useState(false);\r\n const [showUseStrictTooltip,setShowUseStrictTooltip] = useState(false);\r\n const [showUseStrict2Tooltip,setShowUseStrict2Tooltip] = useState(false);\r\n const [showPreferredTooltip,setShowPreferredTooltip] = useState(false);\r\n const [showNormalIfTooltip,setShowNormalIfTooltip] = useState(false);\r\n const [showDoubleIfTooltip,setShowDoubleIfTooltip] = useState(false);\r\n \r\n function copyElementToClipboard(element) {\r\n window.getSelection().removeAllRanges();\r\n let range = document.createRange();\r\n range.selectNode(typeof element === 'string' ? document.getElementById(element) : element);\r\n window.getSelection().addRange(range);\r\n document.execCommand('copy');\r\n window.getSelection().removeAllRanges();\r\n }\r\n\r\n const APP_SECURITY = 'https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?id=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FApplications%20Security%20Standards%20DXC%2Epdf&parent=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation';\r\n const SECURE_CODING ='https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?id=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FOWASP%5FSCP%5FQuick%5FReference%5FGuide%5Fv2%2Epdf&parent=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation';\r\n const GITHUB_DESKTOP ='https://desktop.github.com/';\r\n const TYPORA ='https://www.typora.io/';\r\n const VISUAL_STUDIO ='https://code.visualstudio.com/docs/?dv=win64';\r\n const MASTER_REPO ='https://github.dxc.com/MWSGSD/GSD-Insight';\r\n const CLONED_REPOSITORY ='https://github.dxc.com/rgraham33/intelligence-oc';\r\n const GITHUB_DOCUMENTATION ='https://github.dxc.com/pages/Platform-DXC/devcloud-docs/github/';\r\n const SECURITY_TRAINING ='https://dxcportal.sharepoint.com/:b:/r/sites/GSDInsight/Shared Documents/General/Documentation/Security Trainings.pdf?csf=1&web=1&e=NE5FAM'\r\n\r\n\r\n\r\n return (\r\n <>\r\n \r\n \r\n
Developer Guidelines
\r\n
\r\n
\r\n \r\n \r\n Application Security Standards \r\n \r\n <>\r\n The Application Security Standards document is located here:
\r\n window.open(APP_SECURITY, '_blank')}> Applications Security Standards DXC.pdf
\r\n \r\n \r\n \r\n \r\n \r\n Secure Coding Guideline \r\n \r\n <>\r\n OWASP Secure Coding Practices Quick Reference Guide is located here:
\r\n window.open(SECURE_CODING, '_blank')}> OWASP_SCP_Quick_Reference_Guide_v2.pdf
\r\n \r\n \r\n \r\n \r\n \r\n Security Training Plan \r\n \r\n <>\r\n The Security Training Plan for developers is located here:
\r\n window.open(SECURITY_TRAINING, '_blank')}>Security Training Plan.pdf
\r\n \r\n \r\n \r\n \r\n \r\n Coding Standards and Etiquette \r\n \r\n <>\r\n \r\n GSD Insight is currently developed in a SHARED development environment. Therefore the we ask each and every developer to tred carefully and respectfully. We currently have NOT worked out a way of each developer to have their own development environment in which they can clone standard code and proceed to crash and burn any way they like…
\r\n \r\n {CODE_ETIQUETTE.map((data, index) => ({data.caption} ))} Strictness Enabled
\r\n Enable the following at the top of your scripts. This prevents you from making spelling mistakes in variable names that would otherwise go un-noticed.
\r\n \r\n use strict;
\r\n {copyElementToClipboard('UseStrict');setTooltipText('Copied')}} onMouseOver={() => {setShowUseStrictTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowUseStrictTooltip(false)}/>\r\n
{tooltipText} \r\n There isn’t an official style document but perlstyle offers some advice on naming conventions, and there are some other conventions:
\r\n \r\n {NAMING_CONVENTIONS.map((data, index) => ({data.title} ))}\r\n \r\n Eg: \r\n \r\n sub function_name { my ($var1, $var2, $var3) = @_; }
\r\n {copyElementToClipboard('UseStrict2');setTooltipText('Copied')}} onMouseOver={() => {setShowUseStrict2Tooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowUseStrict2Tooltip(false)}/>\r\n
{tooltipText} \r\n Is preferred over: \r\n \r\n sub functionName { my $var1 = @_[0]; my $var2 = @_[1]; my $var3 = @_[3]; }
\r\n {copyElementToClipboard('PreferredOver');setTooltipText('Copied')}} onMouseOver={() => {setShowPreferredTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowPreferredTooltip(false)}/>\r\n
{tooltipText} \r\n Brackets \r\n 1. Normal If statement - noting position of { \r\n \r\n if ($a eq “something”)
{ }
{copyElementToClipboard('NormalIf');setTooltipText('Copied')}} onMouseOver={() => {setShowNormalIfTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowNormalIfTooltip(false)}/>\r\n
{tooltipText} \r\n 2. Double line if statement - noting position of { \r\n \r\n if (($a eq “something” and $b eq “stuff”) or
($d eq “nothing”))
{
}
{copyElementToClipboard('DoubleIf');setTooltipText('Copied')}} onMouseOver={() => {setShowDoubleIfTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowDoubleIfTooltip(false)}/>\r\n
{tooltipText} \r\n \r\n \r\n \r\n \r\n \r\n \r\n Create Wiki Article \r\n \r\n <>\r\n \r\n # Creating and updating content
\r\n This article describes the process of creating and updating documentation for GSD Insight on GitHub.
This solution is currently centered around the use of GitHub Desktop and Typora / Visual Studio Code. This allows users to get going with their documentation requirements without the need for extreme git command line skills (which notably all of you who are DevOps trained would be perfectly capable of doing!)
Before venturing into the process and where to get the tools from - this is a reminder that anytime you start your journey of updating or creating an article - please make sure you have sync’d your local clone with the upstream master. You are NOT the only person contributing to these repositories and therefore it is important to ensure that you START when-ever possible - with the latest commits from the upstream master. If you DONT do this - then your PULL request is likely to be denied with suitable appended comments. (NOTE the section on how to do this in the article below)
Remember too - basic references relate to
\r\n \r\n {BASIC_REFERENCES.map(header => ({header.caption} \r\n {BASIC_REFERENCES_DATA.map((data, index) => (\r\n {data?.Term} \r\n {data?.Description} ))} \r\n
\r\n This process has been designed around the use of desktop UI tools to perform the git processes. It uses github desktop to perform the cloning and the push, pull functions. Clearly this process could be implemented using native git commands.
To start : Download the following applications and follow their native installation instructions to complete their install:
\r\n \r\n window.open(GITHUB_DESKTOP, '_blank')}>GitHub Desktop \r\n window.open(TYPORA, '_blank')}>Typora \r\n window.open(VISUAL_STUDIO, '_blank')}>Visual Studio Code for Windows x64 \r\n \r\n Note: On DXC COE PC’s you may encounter a “Windows Defender Error” while installing TYPORA: Eg:
\r\n To remediate this: right click on the .exe file - go to Properties - check the Unblock option and hit Apply and rerun the installation, it will work.
\r\n This step will require you to fork your master repo ( window.open(MASTER_REPO, '_blank')}>https://github.dxc.com/MWSGSD/GSD-Insight ) to make a repo that is owned by you. This will be the location from which you will CLONE the repo to your local PC and the location you will in the future initiate PULL requests from when you have completed your updates.
To fork the master repo navigate to window.open(MASTER_REPO, '_blank')}>https://github.dxc.com/MWSGSD/GSD-Insight. Many of you may have already performed this function previously and you will be able to see the name of your fork if you click on the number next to the “fork” icon.
This typically will be in the form of https://github.dxc.com//intelligence-oc
If you don’t already have the forked repo – do so… (Again: Please make sure you are forking the repo from window.open(MASTER_REPO, '_blank')}>https://github.dxc.com/MWSGSD/GSD-Insight)
\r\n Navigate to your forked repo: \r\n \r\n Click Clone or Download (selecting Open In Desktop ). \r\n Open Github desktop client and go to File > Clone Repository \r\n In confirmation dialog, select Open Github Desktop app. \r\n Github desktop should launch with a Clone Repository dialog box and show location of where it wants to save it \r\n Click URL tab and then paste in the clone URL \r\n Click Clone \r\n \r\n You should now be ready to create and edit the markdown files.
\r\n The following table shows a short example of some standards that we should ALL follow when editing and creating our markdown files.
\r\n \r\n \r\n {MARKDOWN_FILES.map(header => ({header.caption} \r\n {MARKDOWN_FILES_DATA.map((data, index) => (\r\n {data?.location} \r\n {data?.docs} ))} \r\n
\r\n Example \r\n \r\n {MARKDOWN_LIST.map((data, index) => ({data.title} ))}\r\n \r\n These changes are automatically detected by github desktop
\r\n And then click on Commit to master and push origin (this box should disappear when done)
\r\n You should be able to verify your changes in your CLONED git repo pull request
\r\n \r\n Go to your cloned repository eg: window.open(CLONED_REPOSITORY, '_blank')}>https://github.dxc.com/rgraham33/intelligence-oc \r\n Select Pull requests tab \r\n Select New Pull request” \r\n Select Create Pull request” \r\n Enter your title, and select create pull request \r\n \r\n Team process will approve or reject your pull request based on the review results.
\r\n Remember: YOU ARE NOT the ONLY person contributing to the repo. It is highly likely - if not 100% guaranteed - the upstream/master branch will be several commits INFRONT of your clone. You should endeavor to sync your clone with the upstream/master before commencement of your amendments/additions.
To do this - within your github desktop application - follow these instructions (VERY CAREFULLY)
Click on the ‘current branch’ tab and first select ‘master’ as the current branch (if it’s not already selected). Click on the ‘fetch origin’ button.
\r\n Click on the ‘current branch’ tab again and click the ‘choose a branch to merge into master’ button at the bottom.
\r\n * NOTE: Looking down this list, you will find 2 entries for every branch. Those that are prefixed with origin/ are the branches in your fork, and those prefixed with upstream/ are those in the original repository on GitHub. Select upstream/master from this list (and click merge upstream master button), and this pull the changes down from the master repository to bring your local clone up to date.
\r\n Once your local clone has finished pulling the updates from the master repo - your local PC (aka the clone) will contain all of the latest files from the upstream/master. You may now proceed with editing.
You can choose to push all of these changes to your forked repo NOW or AFTER you have finished your changes.
To push these new changes to your fork, stored on GitHub, using the push origin button on GitHub desktop. (once push function complete - this button disappears).
Refer window.open(GITHUB_DOCUMENTATION, '_blank')}>GitHub Documentation for more details about DXC GitHub & DevOps documentation.
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Tools We Use \r\n \r\n <>\r\n \r\n \r\n Dedicated Tools {list.title} ))}\r\n
\r\n \r\n Generic Ones {list.title} ))}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n )\r\n}\r\n\r\nexport default DeveloperGuidelines","export default \"data:image/png;base64,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\"","import React from 'react'\r\nimport './Development_env.css'\r\n\r\nconst headers = [\r\n {id:'1', caption: \"Instance\"},\r\n {id:'2', caption: \"Role\"},\r\n {id:'3', caption: \"FQDN\"},\r\n {id:'4', caption: \"Operating System\"}\r\n]\r\nconst DATA =[\r\n {id:'1', 'Instance':'DEV', 'Role':'IIS Web Server', 'FQDN':'zc4w02443.itcs.houston.dxccorp.net', 'OperatingSystem':'Server 2016 R2'},\r\n {id:'2', 'Instance':'UAT', 'Role':'SQL Database', 'FQDN':'zc4w02439.itcs.houston.dxccorp.net', 'OperatingSystem':'Server 2019'},\r\n {id:'3', 'Instance':'UAT', 'Role':'IIS Web Server', 'FQDN':'zc4w02443.itcs.houston.dxccorp.net', 'OperatingSystem':'Server 2016 R2'}\r\n]\r\nconst CODE_REPOSITORY ='https://github.dxc.com/MWSGSD/GSD-Insight-Code';\r\n\r\nconst DevelopmentEnvironment = () => {\r\n return (\r\n <> \r\n \r\n \r\n
Development Environment
\r\n
The GSD Insight solution development environment is setup as described:
\r\n
\r\n The code development is done on the developers PC \r\n The generated code & build files are uploaded to the GitHub window.open(CODE_REPOSITORY, '_blank')}>Code Repository \r\n The build files are copied manually to the DEV & UAT server \r\n \r\n
Note: Important to notice that UAT and DEV instances are running on the same server, but under different web instances So changes to any of the instance does not affect the other one! Both instance is connected to the same database server / databases
\r\n
\r\n \r\n \r\n \r\n {headers.map(header => ({header.caption} \r\n \r\n \r\n {\r\n DATA.map((data, index) => (\r\n \r\n {data?.Instance} \r\n {data?.Role} \r\n {data?.FQDN} \r\n {data?.OperatingSystem} \r\n \r\n ))\r\n }\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n )\r\n}\r\n\r\nexport default DevelopmentEnvironment","export default __webpack_public_path__ + \"static/media/DocumentationStandards_commits.fb292dad.png\";","import React from 'react'\r\nimport { Accordion } from 'react-bootstrap'\r\nimport './DocumentationStandards.css';\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\nimport DocumentationStandards_commits from './../../../../assets/github-images/DocumentationStandards_commits.png';\r\nimport CopyToClipboard from './../../../../assets/github-images/CopyToClipboard.png';\r\nimport ToolTip from 'react-power-tooltip';\r\nimport { useState } from 'react';\r\n\r\n\r\nconst DOC_LOCATION = [\r\n { id: '1', caption: \"Document\" },\r\n { id: '2', caption: \"Description\" }\r\n]\r\nconst DOC_LOCATION_DATA = [\r\n { id: '1', Document: 'How to Create/Update Articles in github',\r\n Description: 'A documented process for the contribution of documentation to this github repository',\r\n href:'https://github.dxc.com/pages/Innovation-Automation/innovation_team/standards/documentation/create_wiki_article/'\r\n }\r\n]\r\nconst ARTICLE = [\r\n { id: '1', caption: \"Other Articles\" },\r\n { id: '2', caption: \"Description\" }\r\n]\r\nconst ARTICLE_DATA = [\r\n { id: '1', OtherArticles: 'mkdocs-awesome-pages-plugin',\r\n Description: 'This module is used to control the layout of your pages (using .pages files) located in your repo',\r\n href:'https://github.com/lukasgeiter/mkdocs-awesome-pages-plugin' },\r\n { id: '2', OtherArticles: 'docs-mkdocs-template',\r\n Description: 'This is the initial instructions that have been used to originally configure your github repo and to link all required automation to build github pages via the jenkins pipeline',\r\n href:'https://github.dxc.com/Platform-DXC/docs-mkdocs-template#setup'\r\n }\r\n]\r\n\r\nconst GITHUB='https://github.dxc.com/MWSGSD/GSD-Insight';\r\n\r\nconst arrange_list = [\r\n { id: '1', caption: \"- Team\" },\r\n { id: '2', caption: \"- enhancement_questionaire.md\" },\r\n { id: '3', caption: \"- product_release_notes.md\" },\r\n { id: '4', caption: \"- Product_status_reports\" },\r\n { id: '5', caption: \"- roadmaps\" }\r\n]\r\nconst DocumentationStandards = () => {\r\n const [showArrangeTooltip,setShowArrangeTooltip] = useState(false);\r\n const [showTooltip, setShowTooltip] = useState(false);\r\n const [showArchiveTooltip, setShowArchiveTooltip] = useState(false);\r\n const [tooltipText, setTooltipText] = useState(false);\r\n function copyElementToClipboard(element) {\r\n window.getSelection().removeAllRanges();\r\n let range = document.createRange();\r\n range.selectNode(typeof element === 'string' ? document.getElementById(element) : element);\r\n window.getSelection().addRange(range);\r\n document.execCommand('copy');\r\n window.getSelection().removeAllRanges();\r\n }\r\n\r\n \r\n return (\r\n <>\r\n \r\n \r\n
Documentation Standards
\r\n
\r\n
\r\n \r\n \r\n Documentation Location \r\n \r\n <>\r\n Some standards are located in alternate github locations. Please refer:
\r\n \r\n \r\n {DOC_LOCATION.map(header => ({header.caption} \r\n {DOC_LOCATION_DATA.map((data, index) => (\r\n {data.Document} {data?.Description} ))} \r\n
\r\n \r\n \r\n \r\n \r\n \r\n GitHub Pages \r\n \r\n <>\r\n \r\n Our documentation, whilst created in markdown and stored in github is linked to an automated jenkins pipeline - and is typically presented to our users via github pages. This process doesn’t necessarily need to be understood in great detail - as this process is fully automated - but there are a few items that you should be aware of:
\r\n \r\n \r\n {ARTICLE.map(header => ({header.caption} \r\n {ARTICLE_DATA.map((data, index) => (\r\n {data?.OtherArticles} {data?.Description} ))} \r\n
\r\n Our documentation, whilst created in markdown and stored in github is linked to an automated jenkins pipeline - and is typically presented to our users via github pages. This process doesn’t necessarily need to be understood in great detail - as this process is fully automated - but there are a few items that you should be aware of:
\r\n Sometimes you may want to change the behavior of github pages and change the order of articles/folders, hide articles/folders or change the name of the menus. This is done via .pages files that are placed strategically in the folder structure within the repository.
\r\n A .pages file - may contain something like:
\r\n \r\n title: Product Management
\r\n arrange:
\r\n {arrange_list.map((data, index) => ({data.caption} ))} \r\n {copyElementToClipboard('productManagementList');setTooltipText('Copied')}} onMouseOver={() => {setShowArrangeTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowArrangeTooltip(false)}/>\r\n
{tooltipText} \r\n Note: This is an awesome-pages file in YAML format. Therefore you must follow the YAML rules relating to spaces (not tabs).
\r\n The title: Product Management instructs for this page to be known as “Product Management” and NOT by its folder name “product_management”. Hopefully the reason why you would want this is obvious.
\r\n The arrange: section allows both folders and markdown files to be ordered to your liking.
\r\n If you want article1.md to come first followed by article2.md - and then everything else present to come after that - use … as below
\r\n \r\n title: Example Section
\r\n arrange:
\r\n - article1.md - article2.md - ... {copyElementToClipboard('ArrangeArticle');setTooltipText('Copied')}} onMouseOver={() => {setShowTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowTooltip(false)}/>\r\n
{tooltipText} \r\n If you have a folder - that you would like to keep in the repo - but do NOT want it shown in the menu structure In the archive folder - create a .pages file and include
\r\n \r\n title: Archive
\r\n hide: true
\r\n {copyElementToClipboard('ArchiveTitle');setTooltipText('Copied')}} onMouseOver={() => {setShowArchiveTooltip(true);setTooltipText('Copy')}} onMouseLeave={() => setShowArchiveTooltip(false)}/>\r\n
{tooltipText} \r\n After a successful github merge request - you can verify the progress of publishing github pages by clicking on the Commits:
\r\n Step1 \r\n Step2 Click on the green / or / red sign near to the release and select Details
\r\n One thing to be careful about is the contents of your .pages must be syntactically correct AND valid. If you reference files/foldersthat do NOT exist - you will break the publishing process. Easiest way to check this is to follow the instructions above to see your “failed” publish
\r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n
\r\n\r\n \r\n )\r\n}\r\n\r\nexport default DocumentationStandards","export default __webpack_public_path__ + \"static/media/ReleaseandBuildGuides_release_process.9c347061.png\";","import React from 'react'\r\nimport { Accordion } from 'react-bootstrap'\r\nimport './ReleaseandBuild.css'\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\nimport ReleaseandBuild from './../../../../assets/github-images/ReleaseandBuildGuides_release_process.png';\r\nconst List =[\r\n { id:'1', text:'The developer completes a change on its local PC development environment.'},\r\n { id:'2', text:'After initial testing - compiles the build'},\r\n { id:'3', text:'Both the code & the build is synchronized to GitHub code repository via GitHub Desktop'},\r\n { id:'4', text:'The build files are manually copied to the respective WEB server location (dev, uat, prod)'},\r\n { id:'5', text:'In case of need restart of the IIS can be required to pickup the changes… '}\r\n]\r\nconst process_list =[\r\n { id:'1', text:'Receive of the change / request in GitHub'},\r\n { id:'2', text:'Evaluation & decision & prioritization + adding to the JIRA backlog'},\r\n { id:'3', text:'Development and release to DEV for internal validation'},\r\n { id:'4', text:'Release to UAT for end user validation & testing '},\r\n { id:'5', text:'Release to PROD environment + adding to release notes description'}\r\n]\r\nconst Enhancement =[\r\n { id:'1', text:'Check your code into github'},\r\n { id:'2', text:'TAG your code with the JIRA number associated with your release'},\r\n { id:'3', text:'Update your JIRA task with INSTALLATION INSTRUCTIONS'},\r\n { id:'4', text:'Update your JIRA task with RELEASE NOTES'},\r\n { id:'5', text:'Move your JIRA task into Release to UAT Status'}\r\n]\r\nconst Enhancement_UAT =[\r\n { id:'1', text:'JIRA must be updated by COB each Tuesday'},\r\n { id:'2', text:'A team member will assemble the FULL release instructions from ALL JIRA requests in Release to UAT status on following day (Wednesday)'},\r\n { id:'3', text:'Consolidated instructions will be sent and reviewed in daily SCRUM meeting'},\r\n { id:'4', text:'If instructions are approved - release to UAT will occur the following day (Thursday)'}\r\n]\r\nconst ReleaseandBuildGuides = () => {\r\n return (\r\n <>\r\n \r\n \r\n
Release and Build Guides
\r\n
\r\n
\r\n \r\n \r\n Deployment to Servers \r\n \r\n <>\r\n \r\n Security Properties
\r\n
\r\n {List.map((list, index) => ( {list.text} ))}\r\n \r\n
In the future to have the CI/CD pipeline implemented which will automatically push the changes from the GitHub repository to the respective WEB server(s).
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n Release Process \r\n \r\n <>\r\n \r\n Our team implements a structured process for releasing enhancements and fixes to production
\r\n This process involves:
\r\n \r\n {process_list.map((list, index) => ( {list.text} ))}\r\n \r\n \r\n There are typically two types of release: \r\n Enhancement: this is the normal situation where product development leads to a point where some NEW feature or functionality is added and released. Hotfix: this situation occurs if during a previous releases - we have introduced an issue (deemed urgent) that was NOT present prior. This process allows for Production to be patched immediately.\r\n \r\n {Enhancement.map((list, index) => ( {list.text} ))}\r\n \r\n {Enhancement_UAT.map((list, index) => ( {list.text} ))}\r\n \r\n You should seek approval from your technical lead for application of hotfixes. Hotfix needs to be tested on UAT first before to be release to production.
\r\n After successful release, release notes needs to be published under GitHub documentation - related section.
\r\n \r\n \r\n \r\n\r\n \r\n
\r\n\r\n \r\n )\r\n}\r\n\r\nexport default ReleaseandBuildGuides","import React from 'react'\r\nimport './ProductMaintenance.css';\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\n\r\n\r\nconst ProductMaintenance = () => {\r\n\r\n const DATA_RETENTION='https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?id=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FGSD%5FInsight%5FData%5FRetention%5FPolicy%5FProcess%5Fv20220314%2Epdf&parent=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation';\r\n const SIRCC = 'https://my.dxc.com/departments/got/global-cyber-security/incident-reporting';\r\n return (\r\n <> \r\n \r\n \r\n
Product Maintenance \r\n \r\n
\r\n Data Retention Policy and Process
Data Retention Policy and Process document is described and located \r\n here \r\n \r\n
\r\n Security Patching
For each server, the Windows OS upgrades are installed automatically by DXC IT with BigFix. The maintenance window is sent out via email for each server in scope by \r\n
\r\n DXCIT Server Patching Team \r\n \r\n in the form of a change request. The patching always takes place during out of office business hours, usually on the first Sunday of the month. After the patching process is completed, the servers are rebooted.
\r\n
\r\n Security Properties
Specific security properties related to ITAR countries/accounts will be defined later
\r\n \r\n
\r\n Security Vulnerability Incidents
Please refer to DXC standard process (
SIRCC ).
\r\n\r\n \r\n )\r\n}\r\n\r\nexport default ProductMaintenance","export default __webpack_public_path__ + \"static/media/DeveloperSupport_general_cloud_support_process_incident.41d0b99e.png\";","export default __webpack_public_path__ + \"static/media/DeveloperSupport_general_cloud_support_process_create_new_inc.6f1520a8.png\";","export default __webpack_public_path__ + \"static/media/DeveloperSupport_general_cloud_support_process_ticket.bde0a915.png\";","import React, { useState } from 'react'\r\nimport { Accordion } from 'react-bootstrap';\r\nimport './DeveloperSupport.css';\r\nimport VerticalLine from './../../../../assets/images/VerticalLine_Headings.png';\r\nimport DeveloperSupportIcon from './../../../../assets/github-images/DeveloperSupport_general_cloud_support_process_incident.png';\r\nimport Developercreatenew from './../../../../assets/github-images/DeveloperSupport_general_cloud_support_process_create_new_inc.png';\r\nimport CloudSupport from './../../../../assets/github-images/DeveloperSupport_general_cloud_support_process_ticket.png';\r\nimport CopyToClipboard from './../../../../assets/github-images/CopyToClipboard.png';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { RequestTab, RequestTabPopup } from '../../GitHub_LandingPage/Models';\r\n\r\nconst APP_SUPPORT_TEAM = [\r\n { id: '1', caption: \"IF the problem is application related a check and fix it.\" },\r\n { id: '2', caption: \"IF the problem is platform related a check the platform availability for possible issues and a inform the respective Development team & Attila Szabo to check and fix the issue.\" },\r\n { id: '3', caption: \"When platform problem is fixed check the application and confirm that all is back to normal operation.\" },\r\n { id:'4',caption:\"IF the platform can’t be fixed by you and Attila is NOT available a follow this guide to open a ticket to the Cloud IT support team.\"}\r\n]\r\nconst REQUIREMENTS =[\r\n {id:'1',main:\"Network Requirements:\",description:'All users accessing the application need to be connected to the corporate network from the office or from home via Secure Pulse VPN. Browsers network settings to be set for the right settings (corporate standard).'},\r\n {id:'2',main:\"Browser Requirements:\",description:'Although Microsoft Internet Explorer is the preferred web browser for DXC, Google Chrome is also supported by IT and Cyber Security. If your account or organization allows the use of Chrome, you can install it from Google.'},\r\n {id:'3',main:\"Step by step instructions for Support teams, Developers, Technical & Business owners\",description:'Please go step by step to identify the root cause and the respective actions:'},\r\n]\r\nconst CLOUD_V2 =[\r\n {id:'1',description:'Always mention the affected **SERVERNAME** - Configuration Item'},\r\n {id:'2',description:'Always mention the related **EPR** **ID:** **206921** - Correlation ID'},\r\n {id:'3',description:'Always mention who is the contact person for the issue – **EMAIL** **ADDRESS** + attilas@dxc.com'},\r\n]\r\n\r\nconst DeveloperSupport = () => {\r\n const history = useHistory();\r\n const [showRequestModel, setShowRequestModel] = useState(false);\r\n return (\r\n <>\r\n \r\n \r\n
Developer Support
\r\n
\r\n
\r\n \r\n \r\n Cloud Servers Support Process \r\n \r\n <>\r\n \r\n How to open a ticket to DXC SSZ - Cloud support?
Target Audience
\r\n \r\n
Application Owners Application Developers \r\n Business Owners Prerequisite checks before opening the ticket \r\n The following checks to be executed before a ticket is opened:Note: Applications are running on servers located in the DXC SSZ Cloud infrastructure – located physically in USA (Houston). The users are authenticated based UID policy and requirements.
\r\n {REQUIREMENTS.map((data, index) => (<>{data.main} \r\n {data.description}
))}\r\n Application Support team: \r\n {APP_SUPPORT_TEAM.map((data, index) => ({data.caption} ))} Generic Situation: \r\n IF the application development team members are not available à application owners should open the ticket based on the description to have the platform checked by IT.
\r\n Communication: \r\n All communications to end users to be handled by the Application owners.
\r\n \r\n \r\n 1. Select Create New or the New push button on the top
\r\n 1. A new incident form appears. Fill out the form as required
\r\n Business Service is always to be Cloud V2 Services | Cloud V2 AND
\r\n \r\n {CLOUD_V2.map((data, index) => ({data.description} ))} \r\n Submit the ticketIf you need to elevate the ticket (or if a major outage – create an MI) you can call the OMC along with the ticket number with business impact justification and they can elevate the ticket (an eNote alert will be sent to the proper support team). \r\n !!! Elevate only in case there is a major impact on the end users !!!
\r\n \r\n \r\n \r\n \r\n \r\n \r\n GSD Insight Application Support \r\n \r\n <>\r\n Please see the relevant content under \r\n history.push('/user')}>User section or you can raise \r\n setShowRequestModel(true)}>Request/Incident . \r\n \r\n \r\n \r\n\r\n \r\n
\r\n\r\n {showRequestModel && \r\n setShowRequestModel(false)}\r\n />\r\n }\r\n\r\n \r\n\r\n \r\n )\r\n}\r\n\r\n\r\nexport default DeveloperSupport","import React from 'react'\r\nimport './DesignPrinciples.css'\r\nconst DesignPrinciples = () => {\r\n\r\n const OFFICE_SITE = 'https://github.dxc.com/pages/ArchitectureOffice/Standards/Design_Principles/';\r\n return (\r\n \r\n \r\n
\r\n \r\n
Design Principles
\r\n
DXC Technology’s design principles guide DXC technologists and partners who are designing or developing a DXC product, offering, solution or service.
\r\n
The design principles also offer a look into the heart and soul of DXC - how we work and approach problems. All contributors should understand the principles and adhere to them in their projects.
\r\n
For the latest principles and guidelines please visit the
Architecture Office site \r\n
\r\n
\r\n \r\n \r\n history.push('/githublanding')}>Home \r\n history.push('/developer')} >{` / `} Developer \r\n {` / `} {developerCard.title} \r\n \r\n \r\n
\r\n {DeveloperCardDisplay()}\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default DeveloperCards","export default __webpack_public_path__ + \"static/media/User_HeroBanner.29a3d0cb.png\";","import React from 'react'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb'\r\nimport { Footer } from '../HeaderFooter';\r\nimport User_HeroBanner from './../../../assets/github-images/User_HeroBanner.png';\r\nimport VerticalLine from './../../../assets/images/VerticalLine_Headings.png';\r\nimport './User.css';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nconst security_Cards= [\r\n {\r\n id: 1,\r\n title:'Where are our toolsets hosted?',\r\n text:'The servers are physically hosted in the USA within the DXC SSZ infrastructure in the Houston Data Centre.'\r\n },\r\n {\r\n id: 2,\r\n title:'What Security policies govern this framework?',\r\n text:'The servers databases, mailboxes and supporting CODE is hosted in accordance with DXC security policies, requiring an annual Security review to remain within this hosted environment.'\r\n },\r\n {\r\n id: 3,\r\n title:'Who supports and has accesss to the data residing on the servers?',\r\n text:'Database and back-end access is restricted solely to tool administrators and developers.'\r\n },\r\n {\r\n id: 4,\r\n title:'Who can access the data through the user interface?',\r\n text:'GSD Insight is available only for Internal DXC staff. Connection to the DXC network is required (physically within an DXC office or via a Secure Pulse VPN).The role based access model is described in a separate document.'\r\n },\r\n {\r\n id: 5,\r\n title:'What data is collected?',\r\n text:'A multitude of GSD related data sources are required to make a truly useful governance platform.'\r\n }]\r\n\r\n const GSD_URL = [\r\n { id: '1', caption: \"Environment\" },\r\n { id: '2', caption: \"GSD UI URL\" }\r\n]\r\nconst GSD_URL_LIST = [\r\n { id: '1', 'Environment': 'Production Instance', 'GSD_UI_URL':'https://gsd-insight.houston.dxccorp.net',href:'https://gsd-insight.houston.dxccorp.net'}\r\n]\r\n\r\nconst GLOBAL_SLA_KPI = [\r\n { id: '1', caption: \"Global Standard SLAs\",href:'https://dxcportal.sharepoint.com/:x:/r/sites/GSDInsight/_layouts/15/Doc.aspx?action=edit&sourcedoc=%7B66f9ae2d-1a43-4fad-9ad3-054a0cd9d811%7D&wdOrigin=TEAMS-ELECTRON.teamsSdk.openFilePreview&wdExp=TEAMS-CONTROL&cid=e2623342-1ebe-4bde-8cf2-53566bafba2a' },\r\n { id: '2', caption: \"Global KPI Standards and Metrics\",href:'https://dxcportal.sharepoint.com/:w:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7B4B4C0E9A-ECF7-45AB-80BB-32CF46D67105%7D&file=MWS_GSD_WFM_KPIs-Standards_and_Metric.docx&action=default&mobileredirect=true' }\r\n]\r\n\r\nconst MS_TEAMS ='https://teams.microsoft.com/l/team/19%3aI-wF3DALEKei_jMiwPbiE4IDvpni3HCHbbZajBRyNk81%40thread.tacv2/conversations?groupId=b47fd5cb-2b61-4939-9254-7be4518dd717&tenantId=93f33571-550f-43cf-b09f-cd331338d086';\r\nconst User = () => {\r\n const history = useHistory();\r\n return (\r\n <>\r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='User' />\r\n \r\n
User
This section provides high-level information to all users about access to GSD Insight Portal, standard definition of metrics, security model and other MS Teams links, which will connect the users to all relevant details.
\r\n
\r\n \r\n \r\n
\r\n \r\n GSD Insight solution is available within DXC internal network running from the DXC IT centralized instance in Houston. Please refer the below tables for details:\r\n
\r\n \r\n {GSD_URL.map(header => ({header.caption} \r\n {GSD_URL_LIST.map((data, index) => (\r\n {data?.Environment} \r\n {data?.GSD_UI_URL} ))} \r\n
\r\n
In order to successfully access GSD Insight the following requirements need to be met: \r\n
\r\n User needs to possess Universal ID \r\n User needs to log into Appgate or Pulse VPN and select the Houston Server option \r\n \r\n
For further details we would like to redirect you to
\r\n
history.push('/getstarted')} >How to Get Started.
\r\n
\r\n \r\n Standard Definition and Metric Calculation for Global Service Desk is detailed in the following official documents:\r\n
\r\n {GLOBAL_SLA_KPI.map((data, index) => ( {data.caption} \r\n
Under our
MS TEAMs channel you will find all relevant informations and documentation.
\r\n \r\n GSD Insight Security Model
\r\n {security_Cards.map((link, index) => (
{link.title}
{link.text}
))}\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default User","export default __webpack_public_path__ + \"static/media/Security_HeroBanner_Image.932b1d4b.png\";","import React from 'react'\r\nimport AdminBreadcrumb from '../Administration/General/Admin-breadcrumb';\r\nimport Security_HeroBanner_Image from './../../assets/github-images/Security_HeroBanner_Image.png';\r\nimport VerticalLine from './../../assets/images/VerticalLine_Headings.png';\r\nimport { Footer } from './HeaderFooter';\r\nimport './../GitHub/user/User.css';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nconst RBAC_LIST= [\r\n {\r\n id: 1,\r\n title:'Role Assignment',\r\n text:'A user can exercise a permission only if has been selected or been assigned a role.'\r\n },\r\n {\r\n id: 2,\r\n title:'Role Authorisation ',\r\n text:'A user’s active role must be authorized. Can’t just assign itself to a role. Authorization is required.'\r\n },\r\n {\r\n id: 3,\r\n title:'Permission Authorisation',\r\n text:'A user can exercise a permission only if the permission is authorized for the user’s active role. With rules 1 and 2, this rule ensures that users can only exercise permissions for which they are authorized.'\r\n }]\r\n\r\n const Benefits= [\r\n { id: 1, title:'Enhances security & compliance'},\r\n { id: 2, title:'Reduces IT and administration effort'},\r\n { id: 3, title:'Maximizes the operational efficiency'},\r\n { id: 4, title:'Decreases the risk of breaches and data leakage'},\r\n { id: 5, title:'Reduces cost'},\r\n ]\r\n const Implementing= [\r\n { id: 1, title:'Define the services which will be provided to end users'},\r\n { id: 2, title:'Create the mapping of the roles to specific resources'},\r\n { id: 3, title:'Create security groups which represent each role'},\r\n { id: 4, title:'Assign the users to the created roles'},\r\n { id: 5, title:'Apply the groups to access the required services / resources'},\r\n ]\r\n const Documents= [\r\n { id: 1, title:'ROLE BASED ACCESS REPOSITORY is located ',href:'https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?RootFolder=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FRBAC'},\r\n { id: 2, title:'Main overview is captured ',href:'https://dxcportal.sharepoint.com/:w:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7B000EF271-60FC-4424-BD92-8589F678F509%7D&file=GSD%20Insight_RBAC_1.0.docx&action=default&mobileredirect=true&cid=fbe28c33-0698-459e-871f-f4578483ddf7'},\r\n { id: 3, title:'Implementation control details are captured ',href:'https://dxcportal.sharepoint.com/:w:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7B57279015-93EE-4CC9-8A72-F8D6B3B7E06C%7D&file=RBAC-Implementation_Control.docx&action=default&mobileredirect=true&wdOrigin=TEAMS-ELECTRON.teams.files&wdExp=TEAMS-CONTROL&wdhostclicktime=1637860520099&cid=70f7c771-1e04-4c0a-893f-dc7183d4fb64'}\r\n ]\r\n \r\n const UID='https://my.dxc.com/departments/got/global-cyber-security/security-enhancement/universal-id'\r\n const OKTA ='https://csc.service-now.com/sp?sys_kb_id=fa9d78711b003090bb25eca0604bcbae&id=kb_article_view&sysparm_rank=2&sysparm_tsqueryId=2c4cc5131b397c945c6eedb2604bcb00';\r\n\r\n const Security = () => {\r\n const history = useHistory();\r\n return (\r\n <>\r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Security' />\r\n \r\n
Security
Overview of global DXC security prerequisites and the correlating access authorisations and role-based-access-control mechanisms. Account restrictions, storage and security requirements aligned with DXC standards are managed through the GSD Insight platform.
\r\n
\r\n \r\n \r\n
\r\n \r\n Reporting and Auditing of GSD Insight Access UID here \r\n \r\n \r\n What is RBAC
\r\n \r\n Role-Based Access Control (RBAC) is a security solution whereby users are granted access to specific resources based on their role in the company or department.
\r\n \r\n {RBAC_LIST.map((link, index) => (
{link.title} - {link.text}\r\n
The Benefits of RBAC \r\n {Benefits.map((link, index) => (
{link.title} ))}\r\n \r\n
Implementing RBAC \r\n { Implementing.map((link, index) => (
{link.title} ))}\r\n \r\n
Role Based Access Documents \r\n {Documents.map((link, index) => (
{link.title} here ))}\r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Security","export default __webpack_public_path__ + \"static/media/Overview_Product_Selection_Image.26b63954.png\";","import React from 'react';\r\nimport './OverView.css';\r\nimport { Accordion } from 'react-bootstrap';\r\nimport VerticalLine from './../../../assets/images/VerticalLine_Headings.png';\r\nimport Overview_Product_Selection_Image from './../../../assets/github-images/Overview_Product_Selection_Image.png';\r\nimport { Footer } from '../HeaderFooter';\r\n\r\nconst BUSINESS_REQUIREMENTS= [\r\n {\r\n id: 1,\r\n title:'Comprehensive Reporting Platform',\r\n text:'Integrated data, reporting and analytics for GSD capability.'\r\n },\r\n {\r\n id: 2,\r\n title:'SLA/KPI Reporting and Dashboarding',\r\n text:'Applied standard definitions and metric calculations for Global Service Desk Service Level Agreements & Key Performance Indicators. Detailed reporting views developed with download option.'\r\n },\r\n {\r\n id: 3,\r\n title:'Multiple Data Sources',\r\n text:'Handle multiple data sources and integrate into a Central Reporting & Analytics system.'\r\n },\r\n {\r\n id: 4,\r\n title:'Data Ingestion and Processing',\r\n text:'Data ingestion standardization and normalization should happen automatically (non-human). Ability to develop seamless data ingestion mechanism.'\r\n },\r\n {\r\n id: 5,\r\n title:'RBAC Access Model',\r\n text:'Role based access to data and reports.'\r\n }]\r\n\r\n const DATA_SOURCE= [\r\n {\r\n id: 1,\r\n title:'Ticketing System',\r\n text:'Tools for managing customer incident, requests related tickets.'\r\n },\r\n {\r\n id: 2,\r\n title:'Customer Satisfaction Survey Tool',\r\n text:'Tools of Surveying customer’s End User’s satisfaction related to the service and handled incident, request ticket.'\r\n },\r\n {\r\n id: 3,\r\n title:'Chat Tool',\r\n text:'Tools for managing chat based inbound channel for End Users.'\r\n },\r\n {\r\n id: 4,\r\n title:'Transaction Monitoring Tool',\r\n text:'Tools for managing Transaction (voice, ticket) quality evaluations.'\r\n },\r\n {\r\n id: 5,\r\n title:'Web Portal Tool',\r\n text:'Tools for managing Portal based inbound channel for End Users.'\r\n },\r\n {\r\n id: 6,\r\n title:'E-mail Tool',\r\n text:'Tools for managing E-mail based inbound channel for End Users as well as managing outbound e-mail interactions.'\r\n },\r\n {\r\n id: 7,\r\n title:'Workforce Management Tool (Scheduling)',\r\n text:'Tools for managing Work Force scheduling (time, attendance).'\r\n },\r\n {\r\n id: 8,\r\n title:'Financial Tools (P/L mapping, Cost Center)',\r\n text:'Tools for managing and allocating Work Force to financial regions, Cost Centers, Labor rates.'\r\n },\r\n {\r\n id: 9,\r\n title:'Time tracking tool (DXC Time)',\r\n text:'Tool for managing Work Force time tracking.'\r\n },\r\n {\r\n id: 10,\r\n title:'Work Force / HR tool (RMT)',\r\n text:'Tool for managing Work Force related data (FTE, Job level, Job code, Organization.'\r\n }\r\n]\r\n\r\n const AWS_Instance = [\r\n { id: '1', caption: \"\" },\r\n { id: '2', caption: \"GSD Insight\" },\r\n { id: '3', caption: \"Aceyus\" }\r\n]\r\nconst AWS_Instance_DATA = [\r\n { id: '1',data:'Back-end data modelling',GSDInsight:'Same effort in both options',Aceyus:'Same effort in both options'},\r\n { id: '2',data:'Infrastructure',GSDInsight:'Same effort in both options',Aceyus:'Same effort in both options'},\r\n { id: '3',data:'Integration with data sources not in AWS Connect',GSDInsight:'Effort needs to be done for this, but probability of usage is low',Aceyus:'Some ready-made plug-ins for SFDC/ Qfiniti / Verint available'},\r\n { id: '4',data:'Data Visualization',GSDInsight:'Limited to our imagination and usage of Power BI. Enhance and invest in WEB based UI / UX solution.',Aceyus:'Many ready-made options available. Far superior. Easy to customize and configure.'},\r\n { id: '5',data:'Long-Term Support',GSDInsight:'Needs planning to build solid documentation, put it up in GitHub and provide for support teams.',Aceyus:'Dependence on Aceyus and with additional cost'},\r\n { id: '5',data:'Usability',GSDInsight:'Needs push from Site Leadership to drive common standards and not resort to many local variations.',Aceyus:'Attractiveness of UI to pull more users of the platform'},\r\n { id: '5',data:'Cost',GSDInsight:'US$ ~240K for 3 years, with slightly higher investment/implementation costs in the first 1.5 years. Need to ring-fence a support/ enhancement team to maintain and enhance',Aceyus:'US$ 330K in FY22 and US$ 300K for 2 more years (US$1M over 3 years)'},\r\n]\r\nconst OverView = () => {\r\n return (\r\n <>\r\n \r\n \r\n \r\n
Overview
\r\n
\r\n
\r\n \r\n \r\n Product Selection \r\n \r\n <>\r\n \r\n GSD Insight Security Model
\r\n {BUSINESS_REQUIREMENTS.map((link, index) => (
{link.title}
{link.text}
))}\r\n
\r\n \r\n
\r\n Value for money / Cost (consumption approach) \r\n Meet business needs and DXC long term strategy \r\n Conformity of Functional / Non-functional requirements \r\n \r\n
\r\n \r\n {AWS_Instance.map(header => ({header.caption} \r\n {AWS_Instance_DATA.map((data, index) => (\r\n {data?.data} \r\n {data?.GSDInsight} \r\n {data?.Aceyus} \r\n ))} \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n Data Source \r\n \r\n <>\r\n Below is the list of data source used in GSD Insight for getting the data and using the data out of these data source as input to report creation and display.
\r\n \r\n GSD Insight Security Model
\r\n {DATA_SOURCE.map((link, index) => (
{link.title}
{link.text}
))}\r\n
\r\n \r\n \r\n \r\n\r\n \r\n
\r\n \r\n \r\n\r\n )\r\n}\r\n\r\nexport default OverView","export default __webpack_public_path__ + \"static/media/Training_HeroBanner.9800d324.png\";","export default __webpack_public_path__ + \"static/media/Training_Materials.53148af6.png\";","import React, { useState } from 'react'\r\nimport './Training.css';\r\nimport AdminBreadcrumb from './../../Administration/General/Admin-breadcrumb';\r\nimport Training_HeroBanner from './../../../assets/github-images/Training_HeroBanner.png';\r\nimport Training_Materials from './../../../assets/github-images/Training_Materials.png';\r\nimport VerticalLine from './../../../assets/images/VerticalLine_Headings.png';\r\nimport { Footer } from '../HeaderFooter';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { VideoModelPopup } from '../GitHub_LandingPage/Models';\r\nimport PlatformVideo from '../GitHub_LandingPage/PlatformVideo';\r\n\r\nconst RECORDED_CARDS = [\r\n {\r\n id: 1,\r\n title: 'GSD Insight Wave 1 Closure Meeting',\r\n text: 'GSD Insight introduction meeting after completion of Wave 1 (telephony data onboarding) as the going forward GSD solution containing the global standard repository of reporting and analytics.',\r\n href:' https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?FolderCTID=0x012000E6B3722E8FCB1A4BB398EDB8F620E4AC&id=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FTraining%20Materials%2FWave%201%20Closing%20Video%2FGSD%20Insight%20%2D%20Wave%201%20Closure%20%E2%80%93%20First%20Session%2D20211013%5F153308%2DMeeting%20Recording%2Emp4&parent=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FTraining%20Materials%2FWave%201%20Closing%20Video'\r\n },\r\n {\r\n id: 2,\r\n title: 'GSD Insight Wave 1 Production Release Demo',\r\n text:'Training guide for GSD Insight Wave 1 production, introduction of current Landing Page, Menus, Regional/Site Selection Page, DTM Report and Site Level SLA Dashboard.',\r\n href:'https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?csf=1&web=1&e=sDyVrf&cid=22a54140%2De5a0%2D4b9b%2Dbfdd%2Ddc4d12e175fa&FolderCTID=0x012000E6B3722E8FCB1A4BB398EDB8F620E4AC&id=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FTraining%20Materials%2FWave%201%20Release%20Recordings%2FDEMO%20Recording%20%2D%20GSD%20Insight%5F%20Wave%201%20Production%20Release%2Emp4&parent=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FTraining%20Materials%2FWave%201%20Release%20Recordings'\r\n },\r\n {\r\n id: 3,\r\n title: \"GSD Insight Wave 1 Next Steps Demo\",\r\n text:'FMO Design concept introduction for Landing Page and Widget Setup, Regional/Site Selection Page, DTM Report, DTM Report detailed analytics and Executive Dashboard.',\r\n href:'https://dxcportal.sharepoint.com/sites/GSDInsight/Shared%20Documents/Forms/AllItems.aspx?csf=1&web=1&e=sDyVrf&cid=22a54140%2De5a0%2D4b9b%2Dbfdd%2Ddc4d12e175fa&FolderCTID=0x012000E6B3722E8FCB1A4BB398EDB8F620E4AC&id=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FTraining%20Materials%2FWave%201%20Release%20Recordings%2FDEMO%20Recording%20%2D%20GSD%20Insight%5F%20Next%20Steps%2Emp4&parent=%2Fsites%2FGSDInsight%2FShared%20Documents%2FGeneral%2FDocumentation%2FTraining%20Materials%2FWave%201%20Release%20Recordings'\r\n }\r\n]\r\n\r\nconst TRAINING_MATERIAL= [\r\n {\r\n id: 1,\r\n title:'GSD Insight Introduction',\r\n href:'/notinproduction'\r\n },\r\n {\r\n id: 2,\r\n title:'Navigation',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BDC8D92B3-5160-46EA-B326-8656F22930C8%7D&file=Training_Navigation.pptx&action=edit&mobileredirect=true'\r\n },\r\n {\r\n id: 3,\r\n title:'Day-To-Month Report',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BFA6CA7CF-3436-48FD-9C3A-E75BCF824FD6%7D&file=Training_DTM.pptx&wdLOR=c43A27992-9331-4FAB-8F5E-CFF4B06175C4&action=edit&mobileredirect=true'\r\n },\r\n {\r\n id: 4,\r\n title:'Executive Dashboard',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7B9263C8CF-0E02-434E-8723-1A93D08C98A1%7D&file=Training_Guide_Executive_Dashboard.pptx&action=edit&mobileredirect=true'\r\n},\r\n{\r\n id: 5,\r\n title:'Landing Page',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BF487ACAF-6E97-407B-B4E2-70C9DD5222B3%7D&file=Training_Guide_Landing_Page.pptx&action=edit&mobileredirect=true'\r\n},\r\n{\r\n id: 6,\r\n title:'Onboard',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BFD69EC0A-516A-41B5-A425-98373BFA45FA%7D&file=Training_Guide_Onboard.pptx&wdLOR=cC1724915-0F72-4236-BCF4-E9372221E08A&action=edit&mobileredirect=true'\r\n},\r\n{\r\n id: 7,\r\n title:'Administration',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BAE2D11B7-0112-4694-9B7B-11EB6BA08D0C%7D&file=Training_Guide_Administration_StaffAdministration.pptx&action=edit&mobileredirect=true'\r\n},\r\n{\r\n id: 8,\r\n title:'Request/Incident',\r\n href:'https://dxcportal.sharepoint.com/:p:/r/sites/GSDInsight/_layouts/15/Doc.aspx?sourcedoc=%7BB007558A-B43F-4379-A2A9-1B28FE5080B0%7D&file=Training_Guide_Request_Incident.pptx&wdLOR=cE55853D7-C2F6-4C10-A7D0-9BC015A7C79C&action=edit&mobileredirect=true'\r\n}\r\n]\r\n\r\nconst Training = () => {\r\n const history = useHistory();\r\n const [showVideoModel, setShowVideoModel] = useState(false);\r\n return (\r\n <>\r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Training' />\r\n \r\n
Training
The training section refers to learning activities which GSD Insight users can undertake with the aim to acquire the overview and necessary skills for the easy navigation on the portal. The training content on this page offers recorded sessions and decks with presentation materials.
\r\n
\r\n \r\n \r\n
\r\n \r\n Recorded Sessions
{RECORDED_CARDS?.map((grid, id) =>\r\n {grid.text}\r\n
)} \r\n \r\n \r\n
\r\n \r\n \r\n Training Materials
\r\n \r\n {TRAINING_MATERIAL.map((link, index) => (
\r\n {(link.title === 'GSD Insight Introduction') ?
setShowVideoModel(true)} style={{cursor:'pointer'}}> {link.title} : \r\n
{link.title} }\r\n
\r\n
))}\r\n
\r\n \r\n \r\n \r\n\r\n {showVideoModel && \r\n setShowVideoModel(false)}\r\n />\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default Training","export default __webpack_public_path__ + \"static/media/Design_HeroBanner_Image.4fe70c4d.png\";","import React from 'react'\r\nimport './Design.css'\r\nimport AdminBreadcrumb from './../../Administration/General/Admin-breadcrumb';\r\nimport Design_HeroBanner_Image from './../../../assets/github-images/Design_HeroBanner_Image.png';\r\nimport RightArrow_Hover from './../../../assets/github-images/RightArrow_Hover.png';\r\nimport { Footer } from '../HeaderFooter';\r\nimport { useDispatch } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { setDesignCard } from '../../../actions/github.action';\r\n\r\nconst DESIGN_CARDS = [\r\n { id: 1, title: 'Database Design', text: 'database' },\r\n {\r\n id: 2,\r\n title: 'MS Team Design',\r\n text: 'msteam'\r\n }\r\n ]\r\n \r\n \r\nconst Design = () => {\r\n const dispatch = useDispatch();\r\n const history= useHistory();\r\n const onClickDesignCards=(card)=>{\r\n dispatch(setDesignCard(card));\r\n history.push('/design/card')\r\n }\r\n return (\r\n <>\r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Design' />\r\n \r\n
Design
This section includes information about the database models and organisation / classification of data determining what data must be stored and how the data elements are connected. Database design involves also identification of all the interrelationships.
\r\n
\r\n \r\n \r\n
\r\n
history.push('/database')}>
Database Design
\r\n
\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Design","export default __webpack_public_path__ + \"static/media/user-db.9e385268.png\";","export default __webpack_public_path__ + \"static/media/Organizational.f7f74eff.png\";","export default __webpack_public_path__ + \"static/media/RBAC.5cb7d90d.png\";","export default __webpack_public_path__ + \"static/media/Measure.32492acc.png\";","export default __webpack_public_path__ + \"static/media/OLAP.e5cb7fcd.png\";","import React from 'react'\r\nimport { Accordion } from 'react-bootstrap';\r\nimport user from './../../../assets/github-images/user-db.png';\r\nimport Organizational from './../../../assets/github-images/Organizational.png';\r\nimport RBAC from './../../../assets/github-images/RBAC.png';\r\nimport Measure from './../../../assets/github-images/Measure.png';\r\nimport OLAP from './../../../assets/github-images/OLAP.png';\r\nimport VerticalLine from './../../../assets/images/VerticalLine_Headings.png';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { Footer } from '../HeaderFooter';\r\n\r\nconst List = [\r\n { id: '1', text: 'If not otherwise noted all text are nvarcar (240)' },\r\n { id: '2', text: 'All primary keys are integers (int)' },\r\n { id: '3', text: 'If we need GUID it will be added as a new column' },\r\n { id: '4', text: 'No complex key in use' },\r\n { id: '5', text: 'If we need complex key (or -ish) it will be a unique index' },\r\n { id: '6', text: 'Matrix type tables are denormalized (UserMembership, WidgetPreference, GenericDim, and any further dimension tables)' }\r\n]\r\nconst Database = () => {\r\n const history = useHistory();\r\n return (\r\n <>\r\n \r\n \r\n \r\n history.push('/githublanding')}>Home \r\n history.push('/design')} >{` / `} Design \r\n {` / `} Database Design \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
Database Design
\r\n
\r\n \r\n
The ultimate goal is to have a normalised database for analytical purpose. It includes data tables for user management, organisational,analytical processing, role-based access control, user preferences and the session data.
\r\n
Current State
The initial set of tables, database diagrams, and relations between them have been created.\r\n
Principles
The structure was designed with the aim to fulfil the requirement of avoiding the redundancy especially applicable for the text type objects.\r\n
Constrains
\r\n \r\n
{List.map((list, index) => ({list.text} ))} \r\n
The database plan is too large to fit in one page, it is subdivided into multiple functional areas:
\r\n \r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Database","import React from 'react'\r\n\r\nconst MsTeams = () => {\r\n return (\r\n
\r\n )\r\n}\r\n\r\nexport default MsTeams","import React from 'react'\r\nimport { useHistory } from 'react-router-dom';\r\nimport { useSelector } from 'react-redux';\r\nimport Database from './Database';\r\nimport MsTeams from './MsTeams';\r\nimport { Footer } from '../HeaderFooter';\r\n\r\nconst DesignCards = () => {\r\n const history = useHistory();\r\n const designCard = useSelector(state => state.githubReducer.designCard)\r\n const DesignCardDisplay = () => {\r\n switch (designCard.text) {\r\n case 'database': return \r\n \r\n \r\n history.push('/githublanding')}>Home \r\n history.push('/design')} >{` / `} Design \r\n {` / `} {designCard.title} \r\n \r\n {/* */}\r\n
\r\n {DesignCardDisplay()}\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default DesignCards","export default __webpack_public_path__ + \"static/media/Features_HeroBanner_Image.285755e9.png\";","export default __webpack_public_path__ + \"static/media/Features_Recommendation_Image.63ed845f.png\";","import React from 'react'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb'\r\nimport { Footer } from '../HeaderFooter'\r\nimport VerticalLine from './../../../assets/images/VerticalLine_Headings.png';\r\nimport Features_HeroBanner from './../../../assets/github-images/Features_HeroBanner_Image.png';\r\nimport Features_Recommendation from './../../../assets/github-images/Features_Recommendation_Image.png';\r\nimport Vertical_Strip_Icon from './../../../assets/images/Vertical_Strip_Icon.png'\r\nimport './Features.css';\r\nimport { Link, useHistory } from 'react-router-dom';\r\n\r\nconst reports= [\r\n {\r\n id: 1,\r\n title:'ASD Cost Recovery',\r\n text:'Specific limited financial based data reports for designated audience.',\r\n href:'finance'\r\n },\r\n {\r\n id: 2,\r\n title:'Executive Dashboard',\r\n text:'Global high level data of ASD consumption and GSD KPI metrics.',\r\n href:'eDashboard'\r\n },\r\n {\r\n id: 3,\r\n title:'DTM (Day-To-Month) Report',\r\n text:'Essential breakdown of all SLA and KPI metrics for operations / delivery purposes.',\r\n href:'regional'\r\n },\r\n {\r\n id: 4,\r\n title:'Heat Map',\r\n text:'Utilization report of GSD Insight platform displaying different logs generated by users.',\r\n href:'https://gsd-insight.houston.dxccorp.net/ReportServer?%2fReports%2fGeneric%2fIISLog%2fLOGIIS&rs:Command=Render&rc:Toolbar=false&rs:embed=true'\r\n },\r\n {\r\n id: 5,\r\n title:'Agent Score Card',\r\n text:'Agent level granular operational SLA and KPI reports.',\r\n href:'/notinproduction'\r\n }]\r\n\r\n const INFO_CARDS = [\r\n {\r\n id: 1,\r\n title:'Onboard',\r\n name: 'Self-service function allowing the users themselves to onboard new accounts/clients.',\r\n href:'/onboard'\r\n },\r\n {\r\n id: 2,\r\n title:'Requests / Incidents',\r\n name: 'Specific requests not supported by self-service functionality and any other related business/ideas/enhancements.',\r\n href:'/request'\r\n },\r\n {\r\n id: 3,\r\n title:'Administration',\r\n name: 'Self-service function allowing the users themselves to administer existing accounts/clients/staff.',\r\n href:'/notinproduction'\r\n }\r\n]\r\nconst Features = () => {\r\n const history = useHistory();\r\n return (\r\n <>\r\n \r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Features' />\r\n \r\n
Features
The overview on the distinctive attributes and aspects of GSD Insight Platform such as onboard and administration, requests & incidents, and various reporting options can be further explored below and there is also space for enhancements and improvement suggestions.
\r\n
\r\n \r\n \r\n
\r\n \r\n Reports
\r\n {reports.map((link, index) => (
{link.text}
))}\r\n
\r\n \r\n
\r\n \r\n \r\n {INFO_CARDS.map((cards, i) =>\r\n
{cards.title}
\r\n
{cards.name}
\r\n
EXPLORE
\r\n
\r\n )}\r\n
\r\n \r\n \r\n
Do you have improvement suggestion or feature recommendation?
\r\n
GET IN TOUCH WITH US
\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Features","import React from 'react'\r\nimport { Footer } from '../HeaderFooter';\r\nimport './NotDesigned.css';\r\nconst NotDesigned = () => {\r\n return (\r\n <> \r\n \r\n
\r\n \r\n
This Page is not in production yet, links will be available later.
\r\n
\r\n
\r\n \r\n history.push('/githublanding')} label1='Home' isActive2={false} label2='Security' />\r\n \r\n
FAQ
This part of the website provides answers to the most common user \r\n issues and queries related to the usage of the GSD Insight Tool, to overcome any concerns.
\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n Select a category below \r\n \r\n
\r\n \r\n \r\n General \r\n \r\n \r\n The \r\n setShowRequestModel(true)}>Request/Incident can be raised directly on the GSD Insight platform. \r\n Detailed information can be found here . \r\n Detailed information can be found here . \r\n \r\n There are various forms how to get in touch: setShowEmailModel(true)}>Email \r\n \r\n MS Team channel \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Tools / Access \r\n \r\n \r\n GSD Insight production \r\n \r\n link / URL . \r\n Detailed information can be found here . \r\n Yes \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Content / Reporting \r\n \r\n \r\n \r\n No, GSD Insight Platform has been designed for Global Standard Reporting. Accounts/Sites custom reporting needs to be addressed individually through specific solutions.\r\n here . \r\n\r\n\r\n \r\n To be able to onboard and / or administer an account, it is necessary to have Site Leader and / or Service Delivery Manager role \r\n for the particular account. To onboard a new account please follow the Onboard section in GSD Insight. To administer an account please \r\n contact your Site Leader and / or Service Delivery Manager [responsible for the particular account/s] located in the Administration section in GSD Insight.\r\n \r\n \r\n This component of the administration module is available only to authorized resources (people managers, team leads/supervisors and site managers). \r\n Data synchronization with Workday/Smart-Labor database is established and executed on monthly basis to manage joiner/leaver process (active/inactive). \r\n Agent onboard and administration can be performed here . \r\n \r\n Telephony (voice) with established data connection to AWS. Non-voice data in the pipeline and it will be subject of data provisioner how and in which format they can supply the\r\n non-voice data (manual, database connection, semi-automatic, etc.). \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n\r\n {showRequestModel && \r\n setShowRequestModel(false)}\r\n />\r\n }\r\n {showEmailModel && \r\n setShowEmailModel(false)}\r\n />\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default FAQ","import React, { useEffect } from 'react';\r\nimport Expand_DownArrow from './../../../assets/onboard-images/Expand_DownArrow.png';\r\nimport Collapse_UpArrow from './../../../assets/onboard-images/Collapse_UpArrow.png';\r\nimport Edit_Icon from './../../../assets/onboard-images/Edit_Icon.png';\r\nimport { useState } from 'react';\r\n\r\nconst AdminTableHandle = ({ info, HandleEditRequestClick }) => {\r\n\r\n const [ID,SetID] = useState();\r\n const urlfile = `${process.env.REACT_APP_BASE_URL}/api/file/${ID}`\r\n\r\n useEffect(()=>{\r\n if(ID){\r\n window.open(urlfile);\r\n }\r\n },[ID,urlfile])\r\n \r\n\r\n const [showAccordion, setShowAccordion] = useState(false);\r\n function RequestDateFormat(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n \r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n \r\n return [month, day, year].join('/');\r\n }\r\n function formatTime(time) {\r\n var d = new Date(time),\r\n hours = '' + d.getHours() ,\r\n min = '' + d.getMinutes(),\r\n sec = d.getSeconds();\r\n\r\n if (hours.length < 2)\r\n hours = '0' + hours;\r\n if (min.length < 2)\r\n min = '0' + min;\r\n if (sec.length < 2)\r\n sec = '0' + sec;\r\n\r\n return [hours, min, sec].join(':');\r\n}\r\n return (\r\n <>\r\n \r\n {info?.['Request / Incident']} \r\n {info?.['Created By']} \r\n {RequestDateFormat(info?.['Created Date'])} \r\n {info?.Type} \r\n {info?.Assignee} \r\n {info?.Status} \r\n \r\n {info?.Status === 'Completed' || info?.View === '0' ? '' : \r\n \r\n {info?.View === '0' ? '' : \r\n \r\n\r\n {(showAccordion) &&\r\n \r\n \r\n \r\n Last Updated Date \r\n Comments \r\n File Attachments \r\n
\r\n \r\n {info?.UserComments?.map((update, i) => (\r\n
\r\n {RequestDateFormat(update?.['Last Updated Date'])} \r\n {update.Comments} \r\n {SetID(update.FileStore)}} style={{ width: '30%', color: '#5F249F', textDecoration: 'underline',cursor: 'pointer' }}>{update.FileName} \r\n
\r\n ))}\r\n
\r\n \r\n
{update.Comments}
\r\n
\r\n
\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default AdminTableHandle","import React from 'react'\r\nimport AdminBreadcrumb from '../../Administration/General/Admin-breadcrumb';\r\nimport filterIcon from '../../../assets/images/Filter_Icon.png';\r\nimport RefreshIcon from '../../../assets/images/Reset_Icon.png';\r\nimport { KeyboardDatePicker } from '@material-ui/pickers';\r\nimport RequestDropdown from '../../Onboard/OnboardComponents/Dropdown/RequestDropdown';\r\nimport Button from './../../ReportTables/ReportFilters/Button';\r\nimport searchIcon from './../../../assets/onboard-images/Search_Icon.png';\r\nimport { useState } from 'react';\r\nimport AdminTableHandle from './AdminTableHandle';\r\nimport { AdminRequestModel, AdminRequestPopup } from './../RequestModals';\r\nimport ADMIN_DATA from './RequestData.json'\r\nimport DATA from './../DATA.json'\r\nimport { useSelector } from 'react-redux';\r\nimport { getUserData } from '../../../actions/user.action';\r\nimport { useEffect } from 'react';\r\nimport { useDispatch } from 'react-redux';\r\nimport { getAdminRequestData } from '../../../actions/request.action';\r\nimport { updateEditAdminRequestStart, getRequestDropdownData } from './../../../actions/request.action';\r\nimport Dropdown from './../../ReportTables/ReportFilters/Dropdown';\r\nimport ClearFilter from './../../ReportTables/ClearFilters/ClearFilter';\r\nimport { useHistory } from 'react-router-dom';\r\nimport axios from 'axios';\r\nconst AdminRequestMain = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let userInfo = useSelector((state) => state.userReducer.userInfo);\r\n let AdminRequestData = useSelector((state) => state.requestReducer.AdminRequestData);\r\n let RequestDropdownData = useSelector((state) => state.requestReducer.RequestDropdownData);\r\n \r\n useEffect(() => {\r\n dispatch(getUserData());\r\n dispatch(getAdminRequestData(\"\",'',''));\r\n // dispatch(getAdminRequestData());\r\n dispatch(getRequestDropdownData())\r\n }, [dispatch]);\r\n useEffect(() => {\r\n setRequestIncidentData(AdminRequestData)\r\n }, [AdminRequestData])\r\n\r\n // const [showAddAdminRequestModel, setShowAddAdminRequestModel] = useState(false);\r\n const [showEditAdminRequestModel, setShowEditAdminRequestModel] = useState(false);\r\n // const [AddRequestForm, setAddRequestForm] = useState({});\r\n const [editRequestID, setEditRequestID] = useState(null);\r\n const [EditRequestForm, setEditrequestForm] = useState();\r\n const [isRefreshClicked, setIsRefreshedClicked] = useState(false);\r\n const [filterSelected, setFilterSelected] = useState();\r\n const [statusSelected, setStatusSelected] = useState('');\r\n const [selectedType, setSelectedType] = useState('')\r\n const [assigneeSelected, setAssigneeSelected] = useState()\r\n const [RequestIncidentData, setRequestIncidentData] = useState([]);\r\n const [reuqestDate, setRequestDate] = useState(new Date(''));\r\n const [filter, setFilter] = useState('');\r\n const [validation, setValidation] = useState('');\r\n const [searchColumns, setSearchColumns] = useState(['Request / Incident']);\r\n const [updatedFileData, setUpdatedFileData] = useState()\r\n\r\n\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n }\r\n\r\n function formatDate() {\r\n var d = new Date(),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n };\r\n // function formatTime() {\r\n // return new Date().getHours() + ':' + new Date().getMinutes() + ':' + new Date().getSeconds();\r\n // }\r\n function formatTime() {\r\n var d = new Date(),\r\n hours = '' + d.getHours() ,\r\n min = '' + d.getMinutes(),\r\n sec = d.getSeconds();\r\n \r\n if (hours.length < 2)\r\n hours = '0' + hours;\r\n if (min.length < 2)\r\n min = '0' + min;\r\n if (sec.length < 2)\r\n sec = '0' + sec;\r\n \r\n return [hours, min, sec].join(':');\r\n }\r\n \r\n\r\n const HandleEditRequestClick = (info) => {\r\n setEditRequestID(info?.IncidentID)\r\n setShowEditAdminRequestModel(true)\r\n const formValues = {\r\n type: info?.Type,\r\n status: info?.Status,\r\n title: info?.['Request / Incident'],\r\n createdBy: info?.['Created By'],\r\n createdDate: info?.['Created Date'] ,\r\n comments: '',\r\n assignee:info?.Assignee,\r\n file: info?.UserAttachedFiles,\r\n UserDetails:info?.TaskDetails?.[0]?.UserDetails,\r\n ValidUntil:info?.TaskDetails?.[0]?.ValidUntil,\r\n };\r\n setEditrequestForm(formValues);\r\n }\r\n\r\n function RequestDateFormat(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n const handleEditRequestCancel = event =>{\r\n event.preventDefault();\r\n setValidation('')\r\n setShowEditAdminRequestModel(false);\r\n }\r\n\r\n const editValueToRequest = (name, value) => {\r\n const newFormData = { ...EditRequestForm };\r\n if (value !== 'Select') {\r\n newFormData[name] = value;\r\n setEditrequestForm(newFormData);\r\n }\r\n }\r\n\r\n const onClickSelect = (name) => {\r\n const newFormData = { ...EditRequestForm };\r\n newFormData[name] = '';\r\n setEditrequestForm(newFormData)\r\n\r\n }\r\n\r\n const handleUserEditRequest = event => {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute(\"name\");\r\n const fieldValue = event.target.value;\r\n const newFormData = { ...EditRequestForm };\r\n newFormData[fieldName] = fieldValue;\r\n setEditrequestForm(newFormData);\r\n }\r\n\r\n \r\nconst[uploadedFileId,setUploadedFileId] = useState();\r\nconst[uploadedFileName,setUploadedFileName] = useState()\r\nuseEffect(()=>{\r\n if(updatedFileData){\r\n const formData = new FormData();\r\n\r\n formData.append('File', updatedFileData);\r\n\r\n fetch(\r\n `${\r\n process.env.REACT_APP_BASE_URL\r\n }/api/file`,\r\n {\r\n method: 'POST',\r\n body: formData,\r\n }\r\n )\r\n .then((response) => response.json())\r\n .then((result) => {\r\n console.log('Success:', result);\r\n setUploadedFileId(result.id);\r\n })\r\n .catch((error) => {\r\n console.error('Error:', error);\r\n });\r\n\r\n }\r\n},[updatedFileData]) \r\n\r\nconst deleteFile = async (fileId) => {\r\n try {\r\n const response = await axios.delete(`/api/file/${fileId}`);\r\n if (response.status === 200) {\r\n setUploadedFileId(null);\r\n setUploadedFileName(null)\r\n } else {\r\n alert('file not deleted')\r\n }\r\n } catch (error) {\r\n // Handle error.\r\n }\r\n };\r\n \r\nconst DeleteUploadedFile = () =>{\r\n deleteFile(uploadedFileId);\r\n }\r\n \r\n\t\r\n \r\n\r\n console.log('uploadedFileId',uploadedFileId,uploadedFileName)\r\n\r\n\r\n\r\n const handleRequesEditSubmit = event => {\r\n event.preventDefault();\r\n const temp_details = {\r\n id: editRequestID,\r\n 'Request / Incident': EditRequestForm.title,\r\n 'Created By': EditRequestForm.createdBy,\r\n 'Created Date': EditRequestForm.createdDate,\r\n Type: EditRequestForm.type,\r\n Assignee:EditRequestForm.assignee,\r\n Status: EditRequestForm.status,\r\n TaskDetails:[\r\n {\r\n UserDetails :EditRequestForm.UserDetails,\r\n ValidUntil: EditRequestForm.ValidUntil\r\n }\r\n ]\r\n }\r\n console.log('temp_details::::::' ,temp_details)\r\n let temp_updates = {\r\n UpdatedTS: `${formatDate()}, ${formatTime()}`,\r\n Comments: EditRequestForm.comments,\r\n FileStore: uploadedFileId,\r\n FileName: uploadedFileName\r\n }\r\n console.log('tempupdates',temp_updates)\r\n const dispatchEditObj ={\r\n Assignee:EditRequestForm.assignee,\r\n Status:EditRequestForm.status,\r\n Comments:EditRequestForm.comments,\r\n IncidentID:editRequestID,\r\n ValidUntil:EditRequestForm.ValidUntil,\r\n FileStore: uploadedFileId,\r\n FileName: uploadedFileName\r\n }\r\n console.log(dispatchEditObj)\r\n const newRequests = [...RequestIncidentData];\r\n const temp_Arr = {\r\n status: EditRequestForm.status,\r\n assignee: EditRequestForm.assignee,\r\n comments: EditRequestForm.comments\r\n }\r\n console.log('nnnnnnnnnnnn',EditRequestForm.type, EditRequestForm.status ,EditRequestForm)\r\n const isEmptyInput = Object.values(temp_Arr).some(x => (x === null || x === '' || x === undefined));\r\n if (isEmptyInput) {\r\n setShowEditAdminRequestModel(true);\r\n setValidation('Please Ensure you filled all the inputs with \" * \" mark ')\r\n }\r\n else if(EditRequestForm.type === 'Task' && EditRequestForm.status !== 'Completed'){\r\n setShowEditAdminRequestModel(true);\r\n setValidation('Please Ensure that Status Selected is set to Completed to Update the Role Validity')\r\n }\r\n else {\r\n const index = RequestIncidentData.findIndex((data, index) => data.IncidentID === editRequestID);\r\n let editedRequestUpdates = newRequests[index]?.AdminComments;\r\n editedRequestUpdates.unshift(temp_updates)\r\n let obj2 = { AdminComments: editedRequestUpdates }\r\n let UserRequestUpdates = newRequests[index]?.UserComments;\r\n let userData = { UserComments: UserRequestUpdates }\r\n const newRequest = Object.assign(temp_details, obj2, userData)\r\n newRequests[index] = newRequest;\r\n setRequestIncidentData(newRequests);\r\n dispatch(updateEditAdminRequestStart(dispatchEditObj))\r\n setEditRequestID(null);\r\n setShowEditAdminRequestModel(false)\r\n setValidation('');\r\n }\r\n }\r\n\r\n function formatcreatedDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n\r\n\r\n const AssigneeFilter = () => {\r\n const arr1 = [...RequestIncidentData];\r\n if(assigneeSelected === null || assigneeSelected === undefined || assigneeSelected === '') {\r\n return arr1; \r\n }\r\n else {\r\n const filterData = arr1.filter(obj => obj.Assignee === assigneeSelected);\r\n return filterData;\r\n }\r\n }\r\n\r\n\r\nconst [filters, setFilters] = useState([]);\r\nconst [clearFilters, setClearFilters] = useState(false);\r\nconst [region_data, setRegion_data] = useState([]);\r\nconst RegionInfo = ADMIN_DATA.Status;\r\n\r\n\r\n\r\nuseEffect(() => {\r\n if (RegionInfo?.length > 0) {\r\n RegionInfo.map(info => info.isChecked = false);\r\n setRegion_data(RegionInfo);\r\n }\r\n }, [RegionInfo])\r\n const clearFilterHandler = (option) => {\r\n setFilters([]);\r\n setClearFilters(true);\r\n let temp_arr = [...region_data];\r\n temp_arr.map((itm, i) => {\r\n itm.isChecked = false;\r\n \r\n return '';\r\n });\r\n }\r\n return (\r\n <>\r\n \r\n \r\n \r\n history.push('/welcome')} label1='Home' isActive1={false} label2='Requests' />\r\n \r\n \r\n \r\n {filters?.length > 0 ? (\r\n \r\n\r\n \r\n \r\n \r\n {ADMIN_DATA.UserHeader.map(data => ({data.value} ))} \r\n \r\n {searchRows(AssigneeFilter())?.map((info, i) =>\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n\r\n \r\n {/* {showAddAdminRequestModel && \r\n { }}\r\n EditRequestForm={EditRequestForm}\r\n buttonOne='UPDATE' buttonTwo='CANCEL'\r\n />\r\n \r\n } */}\r\n {showEditAdminRequestModel && \r\n \r\n setUpdatedFileData(data)} dispatchFileName={data => setUploadedFileName(data)} DeleteUploadedFile={DeleteUploadedFile}\r\n />\r\n \r\n }\r\n\r\n \r\n )\r\n}\r\n\r\nexport default AdminRequestMain","import React from 'react';\r\n\r\nexport function AdminViewDeleteModel(props) {\r\n return <>\r\n \r\n \r\n
\r\n {props.modalName}\r\n
\r\n
\r\n
\r\n Are you sure you want to delete the {props.InformationText} {props.AfterInfoText}\r\n
\r\n
\r\n {props.buttonOne}\r\n \r\n {props.buttonTwo} \r\n \r\n \r\n \r\n \r\n}\r\n\r\nexport function AdminViewCannotDeleteModel(props) {\r\n return <>\r\n \r\n \r\n
\r\n {props.modalName}\r\n
\r\n
\r\n
\r\n {props.InformationText}\r\n
\r\n
\r\n CLOSE\r\n \r\n \r\n \r\n \r\n}","import React, { useState } from 'react';\r\n\r\nimport Expand_DownArrow from './../../../../assets/onboard-images/Expand_DownArrow.png';\r\nimport Collapse_UpArrow from './../../../../assets/onboard-images/Collapse_UpArrow.png';\r\nimport Edit_Icon from './../../../../assets/onboard-images/Edit_Icon.png';\r\nimport deleteIcon from './../../../../assets/onboard-images/Delete_Icon.png'\r\nimport { Link } from 'react-router-dom';\r\nimport { useDispatch} from 'react-redux';\r\nimport { getAdminRoles, updateRoleDeleteStart } from '../../../../actions/Administration/adminView.action';\r\nimport { DeleteModalPopup } from '../../../Onboard/OnboardComponents/Modals/DeleteModalPopup';\r\nimport { AdminViewCannotDeleteModel, AdminViewDeleteModel } from '../AdminViewModels';\r\n\r\nconst RolesTableAdminView = ({info,key}) => {\r\n let dispatch = useDispatch();\r\n console.log('info:::::::::',info,info?.['Access Group'])\r\n const AccessGroupData = info?.['Access Group']\r\n const [showAccordion, setShowAccordion] = useState(false);\r\n const [showDeleteRoleModal, setShowDeleteRoleModal] = useState(false);\r\n const [showCannotDeleteModal, setShowCannotDeleteModal] = useState(false);\r\n\r\n const editData = {\r\n Mode: 'Edit',\r\n editInfo: info\r\n };\r\n \r\n\r\n const handleDeleteRole = () =>{\r\n console.log('roleid::::::::',info.RoleID)\r\n let deleteObj = [{\"RoleID\":info.RoleID}]\r\n dispatch(updateRoleDeleteStart(deleteObj))\r\n setShowDeleteRoleModal(false)\r\n dispatch(getAdminRoles());\r\n }\r\n return (\r\n <>\r\n \r\n {info?.['Role Name']} \r\n \r\n \r\n {info?.Delete === 'Y' ? setShowDeleteRoleModal(true) : setShowCannotDeleteModal(true)}}/>
\r\n {\r\n setShowAccordion(!showAccordion)\r\n }} />
\r\n \r\n \r\n \r\n {(showAccordion) &&\r\n \r\n \r\n Role Descriptions: {info.Description}\r\n
\r\n \r\n \r\n Access Group Name \r\n Operation \r\n \r\n {AccessGroupData?.map(data => (\r\n \r\n \r\n {data.AccessGroup} \r\n \r\n {(data?.OperationList)?.map((data,i,row)=>({data.Operation} {i+1 === row.length ? '' : '|' } ))}\r\n \r\n
\r\n \r\n ))}\r\n \r\n \r\n }\r\n\r\n {showDeleteRoleModal && \r\n setShowDeleteRoleModal(false)}\r\n />\r\n }\r\n\r\n {showCannotDeleteModal && \r\n {setShowCannotDeleteModal(false)}}\r\n \r\n />\r\n }\r\n\r\n \r\n\r\n )\r\n}\r\n\r\nexport default RolesTableAdminView","import React, { useEffect, useState } from 'react'\r\nimport searchIcon from './../../../../assets/onboard-images/Search_Icon.png';\r\nimport './../../AdminFirstPage/AdminFirstPage.css';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport RolesTableAdminView from './RolesTableAdminView';\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\nimport { getAdminRoles } from './../../../../actions/Administration/adminView.action';\r\nimport { Link} from 'react-router-dom';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nconst AdminRolesFlow = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const [filter, setFilter] = useState('');\r\n const [searchColumns, setSearchColumns] = useState(['Role Name']);\r\n \r\n let adminViewRoleData = useSelector((state) => state.adminViewReducer.adminViewRoleData);\r\nconsole.log('adminViewRoleData',adminViewRoleData)\r\n\r\nconst mode = {\r\n Mode : 'Add'\r\n };\r\n\r\nuseEffect(() => {\r\n dispatch(getAdminRoles());\r\n \r\n}, [dispatch]);\r\n\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n }\r\n return (\r\n \r\n
history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={false} label3='Roles'\r\n />\r\n \r\n \r\n \r\n {searchRows(adminViewRoleData).map((info, i) => )}\r\n \r\n history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={true} label3='Roles' value3={() => history.push('/admin/roles')} isActive4={false} label4={Mode === 'Edit' ? 'Edit Role' : 'Add Role'}\r\n />\r\n {Mode === 'Edit' ? 'Edit Role' : 'Add Role'}
\r\n {validation && Please Ensure you filled all the inputs with \" * \" mark
}\r\n \r\n \r\n Name * \r\n
\r\n \r\n Descriptions * \r\n
\r\n \r\n \r\n setShowAccessGroupModal(true)}>ADD ACCESS GROUP & OPERATIONS \r\n \r\n \r\n {addTableRow.length === 0 ? \r\n \r\n\r\n \r\n \r\n \r\n Access Group Name \r\n Operation \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n No records found. This data grid enables adding/editing/deleting the Access Group and Operations.
\r\n
\r\n \r\n\r\n : \r\n \r\n \r\n \r\n Access Group Name \r\n Operation \r\n \r\n \r\n \r\n \r\n {\r\n (addTableRow).map((data, index) => (\r\n \r\n {data.AccessGroup} \r\n {data.OperationList !== undefined ? (data.OperationList).map((data,i,row)=>( {data.Operation} {i+1 === row.length ? '' : '|' } )) : ''} \r\n \r\n ))\r\n }\r\n \r\n
}\r\n\r\n \r\n dispobj()}>{Mode === 'Edit' ? 'UPDATE' : 'ADD'} \r\n history.push('/admin/roles')}>CANCEL \r\n \r\n\r\n\r\n {showAccessGroupModal && \r\n {setShowAccessGroupModal(false)}}\r\n addValueToTable={addValueToTable}\r\n />\r\n }\r\n\r\n {showDeleteRoleModal && \r\n index === deleteRoleID)].AccessGroup} \r\n AfterInfoText='access group and operations?'\r\n handleDeleteYes={handleDeleteRole}\r\n handleDeleteNo={handleDeleteRoleCancel}\r\n />\r\n }\r\n\r\n\r\n )\r\n}\r\n\r\nexport function AccessGroupDropdownModel(props) {\r\n const dispatch = useDispatch();\r\n let accessGroupData = useSelector((state) => state.adminViewReducer.accessGroupData);\r\n useEffect(() => {\r\n dispatch(getAccessGroup());\r\n\r\n }, [dispatch]);\r\n\r\n\r\n const [addselectedAccessGroup, setAddselectedAccessGroup] = useState()\r\n\r\n const addValueToAccessGroup = (name, value) => {\r\n if (value !== 'Select') {\r\n const newFormData = { ...addselectedAccessGroup };\r\n newFormData[name] = value;\r\n setAddselectedAccessGroup(newFormData)\r\n }\r\n }\r\n \r\n let operationlist = addselectedAccessGroup === undefined ? {} : accessGroupData.filter((el) =>{\r\n return el.AccessGroup === addselectedAccessGroup.AccessGroup \r\n }\r\n );\r\n\r\n const [validation, setValidation] = useState()\r\n const handleSubmit = (e) => {\r\n e.preventDefault();\r\n console.log('addselectedAccessGroup',addselectedAccessGroup)\r\n\r\n if(addselectedAccessGroup === undefined){\r\n setValidation(true)\r\n }\r\n else{\r\n props.addValueToTable(operationlist?.[0])\r\n setValidation(false)\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n )\r\n}\r\n\r\nexport function AccessModalPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '25%',\r\n left: '35%',\r\n width: '400px',\r\n height: '420px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n","import React, { useState } from 'react'\r\nimport ReactModal from \"react-modal\";\r\nimport { getOperationsData, updateOperationsDataStart } from '../../../../actions/Administration/adminView.action';\r\nimport { useDispatch } from 'react-redux';\r\n\r\n\r\n\r\n\r\n\r\nexport function OperationsAddModel(props) {\r\n const dispatch = useDispatch();\r\n const {Mode,editOperationData} = props\r\n const [addOperation, setAddOperation] =useState(Mode === 'Edit' ? editOperationData : {});\r\n const HandleAddOperations = (event) => {\r\n event.preventDefault();\r\n const fieldName = event.target.getAttribute('name');\r\n const fieldValue = event.target.value;\r\n if (fieldValue !== 'Select') {\r\n const newFormData = { ...addOperation };\r\n newFormData[fieldName] = fieldValue;\r\n setAddOperation(newFormData)\r\n }\r\n }\r\n\r\n const [validation, setValidation] = useState(false);\r\n\r\n const handleSubmit = (e) => {\r\n e.preventDefault();\r\n let temparr = { \r\n ID : Mode === 'Edit' ? editOperationData.ID :'',\r\n OperationName : addOperation?.OperationName,\r\n Description : addOperation.Description,\r\n }\r\n const temp_Arr = {\r\n OperationName : addOperation?.OperationName,\r\n Description : addOperation.Description,\r\n }\r\n const isEmptyInput = Object.values(temp_Arr).some(x => (x === null || x === '' || x === undefined));\r\n if(isEmptyInput){\r\n setValidation(true);\r\n }\r\n else{\r\n dispatch(updateOperationsDataStart([temparr]))\r\n props.handleSubmitOperation()\r\n dispatch(getOperationsData());\r\n setValidation(false)\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n )\r\n}\r\n\r\nexport function OperationsModalPopup({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n position: 'fixed',\r\n top: '25%',\r\n left: '33%',\r\n width: '550px',\r\n height: '350px',\r\n background: ' #FFFFFF 0% 0% no-repeat padding-box',\r\n boxShadow: ' 6px 6px 45px #00000066',\r\n border: ' 1px solid #ECEEF1',\r\n opacity: '1',\r\n },\r\n content: {\r\n position: 'absolute',\r\n top: '0',\r\n left: '-22em',\r\n right: '40px',\r\n bottom: '40px',\r\n border: 'none',\r\n background: 'none',\r\n overflow: 'none',\r\n WebkitOverflowScrolling: 'touch',\r\n borderRadius: '4px',\r\n outline: 'none',\r\n padding: '2em'\r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n\r\n","import React, { useEffect, useState } from 'react'\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\nimport searchIcon from './../../../../assets/onboard-images/Search_Icon.png';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getOperationsData, updateOperationsDeleteStart } from '../../../../actions/Administration/adminView.action';\r\nimport Edit_Icon from './../../../../assets/onboard-images/Edit_Icon.png';\r\nimport deleteIcon from './../../../../assets/onboard-images/Delete_Icon.png'\r\nimport TooltipHandler from '../../../Onboard/OnboardComponents/TooltipHandler';\r\nimport { OperationsAddModel, OperationsModalPopup } from './OperationsModels';\r\nimport { DeleteModalPopup } from '../../../Onboard/OnboardComponents/Modals/DeleteModalPopup';\r\nimport { AdminViewDeleteModel } from '../AdminViewModels';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nconst OperationsMain = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let operationsMainData = useSelector((state) => state.adminViewReducer.operationsData);\r\n const [editOperationData, setEditOperationData] = useState()\r\n const [mode,setMode] = useState('')\r\n const [showDeleteRoleModal, setShowDeleteRoleModal] = useState(false);\r\n const [deleteRoleID, setDeleteRoleID] = useState(null);\r\n \r\n \r\n\r\n\r\n useEffect(() => {\r\n dispatch(getOperationsData());\r\n\r\n }, [dispatch]);\r\n\r\n const [showOperationAddModal, setShowOperationAddModal] = useState(false)\r\n const [filter, setFilter] = useState('');\r\n const [searchColumns, setSearchColumns] = useState(['OperationName']);\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n }\r\n\r\n const handleDeleteRole = () => {\r\n let delete_arr = [{\"OperationID\":deleteRoleID.ID}]\r\n dispatch(updateOperationsDeleteStart(delete_arr))\r\n dispatch(getOperationsData())\r\n setShowDeleteRoleModal(false)\r\n dispatch(getOperationsData());\r\n}\r\n\r\nconsole.log('delete',deleteRoleID)\r\n\r\n return (\r\n \r\n
history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={false} label3='Operations'\r\n />\r\n \r\n \r\n \r\n \r\n \r\n Operation Name Descriptions {' '} \r\n \r\n \r\n \r\n {\r\n searchRows(operationsMainData).map((data, index) => (\r\n \r\n {data?.['OperationName']} \r\n {(data?.Description)} \r\n \r\n \r\n {setShowOperationAddModal(true);setEditOperationData(data);setMode('Edit')}}>\r\n \r\n\r\n {setShowDeleteRoleModal(true);setDeleteRoleID(data)}}>\r\n \r\n \r\n \r\n \r\n )) }\r\n \r\n
\r\n\r\n {showOperationAddModal && \r\n {setShowOperationAddModal(false)}}\r\n handleSubmitOperation={()=>{setShowOperationAddModal(false);dispatch(getOperationsData())}}\r\n />\r\n }\r\n\r\n {showDeleteRoleModal && \r\n setShowDeleteRoleModal(false)}\r\n />\r\n }\r\n \r\n history.push('/welcome')} label1='Home' isActive2={false} label2='Administration' />\r\n \r\n \r\n \r\n {Developer_Cards.map((link, index) => (
history.push(link.path)}>\r\n
\r\n
{link.title}
{link.value}
\r\n
\r\n
))}\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default AdminViewFirstPage","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEoAAAA4CAYAAABaOm67AAAABHNCSVQICAgIfAhkiAAABydJREFUeF7tW9FxGzcQBSjlO3YFkcfyTP4iV5BTBZEaiHhpwHQFYSoIVcFRasB0BaErMP2XGcsTpYKQ36GIvMXhEACHA3AieWd7eDMajXQgsHjYXezbXXLW8zM8LUaCsR8hRoafJ/hZ4mcuhJjdfvrlpmfx9PK8L0GGL4ozsWFvGGcnjTIIds8H7HL6MV/0JWe1bi9AQYsyaNEfiZtfcs7O+warc6CGJ8UTccz+UmYmseKCXUOzZuyY3bM1NIyzoRDsSgNJmvXAXk7vczLLXp7ugXpeTARnr9RuV9CWzKctrtZB0N+md/m4F5ToMLte+OfT4h6Lfic1ibHX2PykSQaANYaJ/qreL27u8pddy9uLjxp+X5yItTS70uTW7GnInKTDF+x9NR5AdX6w/QBlOHFoyt+3d/lJTEOuTgsMVcBy+KmebsBOT8j0O9j9OwCVtQKK4fa7y+exz+zj/QGoRFS/LKAiPi1xz48a1i1QZQz1z8GZJ5wVwoMFTueHpPDgRTGtAk985i3800XCEnsZkqxRw+fFxYaXG6RnwCH4I24gXPkUdRdqmkZ64oxjCExzrDfdCwoJk0aBUuyegj5i9vZD1II20PImMrUKEy5xA04q4OlAELkTfdHag/cfcEOeJeynNkTetESHuJzP3MOsTYaiESjFyd5g8iwmYNvTVoHkHPN+G5ub3gO40e3H/DplrDkG62jTDXx2jsD3MsYjm4E6LWY4yZ+MBVYgr1OcDBHTM+ddkmlQZL5ZsyvMMwymV/y7WjLBZjiUmxQNTgSpWmkBsM5DYHmB8viHG/iHoXVa5aZnlWMmE8Jiz5oWU7yNyHDdhNuqChJ7/Bgm/2d+7/uoche/V+/IdAeCjdkDm5N8ZI54RwlDrQjyAJw9mnN7gbKIa2ACZZ4krDQhH8NXYyj3VPMxFJ0PsGm8m1OKpdo4fQZ/nymtIx9D/sU10yXWu/RpF2gPaX0lU+Nt6QIKsBopUg0ol4gmEFfzFqsxfIA+xyKU6pUPcTyAM0HeaRrzC5YGl7fuyJxLHo6zOXUZkG+lZwX5T0LrmPJRXmz6KR/5tLQOlE1co3zMzQiYDN9nwuxfNmoDkCu0AmJqaJh1OGZqJoVPpo73AUW2K+07ZSEaZzJ8CyjjQthlwFjTekOrzI2nJPtSiboPKJ0s2xYoS613zPydCF9nFboEamcatWegtO/DafcClK6QpGhUKAv5RQBVMgHp/EP7jd16S/icp75boPqfecu4WctegDK4ZIpfhPy62BGKpVLiqCAZtWIu53rtBSg3Lx+IjdzSWYiK+SNzu/rhZfhykSPcjqjBVdqFaPmZGS2TWUKfy0h8zRaxsIDmfDgWMkNxtOYfYoWHprnh0E365aUnnkB4BetpZA1+oCDw5phR3kiWldQz2TAxK4M8fsY3bGTytVCwFjJdeqfiLaI3bvS+AMOftO1BULEdleGraH4JPzTGXLI0P2CcIn06YA1MjNiHSHGbsjeDEMPBA38b0xoTtBC9ccCNklb3MJyaYOyskOqB/Gv+rkn+psicTvex2UQiytcxhh8AaaV25XK7JLAC2hkDq3rvlV8DpdSVMo9Z6oyRcWGG7+SK6IYCER5pYgynDL82SWX4Sd0x7TY2g899XckjgVKxEDF8y5lJAoscEP4/Z9/AGTtpDQIX3I38SgbCeuH4NJp6Cd+Vg2hK31Y9tYpxoK/ANSH3wlDym8Rcr6PSK3PZAOK5TORlU/rFbCNY5pVfddJwX3eJSn+MY+ZT8wvlwiOrE4XActp2zPRGSsU41K/gBrwkE8VD+DVpm9NXdQE7Q6E6abgZcKlFtk7iK6JJWlT5mTmu3nOtUXZ1JdqlYgWF9VhNV3Uwf2N3TBurq+Wp2GDM23SXtFzMujXNrIIViCZUV5pSIcoa/q8T7rA3wQZLvOdWE8SOK7HW3AZxbRuxNwL1iKaP1MN2/KiwgNp1W00SUALpXMfZ13yfwRRM4pqaS0oFxx1nyN8PUGaFJDG5pnNkJnH9+oEqW6ZlFjVW/ZDXv50p1V16Xz9QTiedLzbSN6TTQWwWEzoFStW4pFxt46aY7ZtzuwGfU51ZAKzLWkBbAqoDYTexpstaUjXZsm3c1Eb+RlIcm2Tb956yOtXipiCn83LffIhfFt8M1d22lSf2+d6Akr4nrTeg3AMiZDFAM8cRumgaKsSxzW7zvnOgyFyQ63qFhanQ+NjyOhUWKKKX2tfF0ylQwRYitVvyQ9XGIRxxx1DHSzBDsUsAOwOqwcyIm5XZiSM0UDQ3XWQYk21grSGGv0tg3Lk6AcolmRBihYWp/2DSJiMq/RrCBQA2xud1PwP5r31/V6YToMzuEpkjWuP7L1t+AajW1xD5usi22rZ3oMygkISNdce02VBqg0WbOZvGdgpUSuW5zab2HZmbshyASjyZA1AHoBIRSBx20KjPBahEOT77Yf8BqwxBSU9pmbEAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAABKCAYAAADwpadnAAAABHNCSVQICAgIfAhkiAAABHFJREFUaEPtm71y00AQx0+KZygoSGboMRN7hg7zBDgtMJPkBWLpDZwGCgpCTUF4AaTwAoSCGTrME+B0zCQZzBskRTrj47/yneZ88cn6uMhWkLrIp7373e7t7e5dHK8VHHDG3rBqPQNnzHbDkX9hGrbTawXgquQzBNyWCa7KYKQNI9wM2NGZ76y67rx24HHOAmWcc+FWHgw+oPuXAQXP2tg5IdNLA7fyYKoPgDlthWf+gCAXwVUWbBFcpcFMcHcmd7uVBzPAfbsVYBFcK+jDw7wX3vKqUmDcYX3O+VDfkshbsgbrAOx7JcGM4RO8Jf1mBQzutjPhbBsuuAOJF9xlQ3eNfQl/+SObm/xeKxihjwdJMmkbKAzmNYN13oh2/h1DZ4eIYPZtwdF+hQk8SIKzAoYZHELQ4wUDPwbcri24NHIoQsltinqKA0EnLmPH1PGEsS6An8pBOA7zw1M/TDMoG20Kgan27nD2ITz3++qgIPwYsNvi3RBae2Jj0Glk5AbzHgVNPma/Y42M2YaeC+ltyswW8oMpNgyt/Pl05jfnzaQatFYR7AfAurcODEAX0MZGXrC9dvAVazR2NGnWkN4GjuqFTGHot9ymSB+bciPZqbcZ7CDs+Sz+vgT8+rxBC7BneYDiNa7kZoXBsFmGyGV7kXDORo6LStGpH8VuYsYIKoKBuz/Cb141wKaekUDuKQOmEpiumUtUkJqmChKil7mOJ6sGIX8UW0veDVpohOqP3ZQDGEBr+1KjKb/J3SzXGtNynUydlxWBZAbTHIJYXnEoNYgpOczRYR2EVjt6LKkWYai9cB73M82Q1hgyXxXyivCEtIaiNSViw74qcN7gaPYAGMYRORzN0bn/ULZduleknAte8KccEBzCtTDKNOtJIdjywWbDKGO0YYIz7Xu9dvi8iBnStw7nV7lNUV2QMENrYEWhTOafOh/7L8AwS+RErlWIFsx+vOepnrG3GaiHCqkUCOfjJzXM5O61xqkGYGqkgmV2HpyFNdh0ZpMLpuSy2Zh5hVQlP26wUJbmeu2PL3WZDvxcUj8Izd5ZM0UrQCUJybTGShqTlW5qMCvTWKKQWmN5J5uqxYjsEz2c20DZwPLhxY1rLM2FGD0/yzuJ6nc1WN5ZVDVGiamIMZFc4xxNJKyV19hMfNgKBvI0ZulgIoOWB9ZGJaIwGp0o0mNKLnFSs0Jgs7W6JLD4DlYNJq4O5V3L+neZvKKWQdPppTzoo6sHsYmqx0WV05ha89AT0BpMnFEv3ysaym+1xpQzrJV19ze1xtLcIk9T0yziFeOCqU1TrMEMh/lyP1tpjcFbvkU9/oAGq2qy8qZYg82Jw2pTFHYeX5Urw93XplibopgB/baa6eDvpjbo2hRrUzSZ4vQK+iH97HI2lFdlxdX06D096t1FiuLlexf/ABBfItsMDie44BLJUt9Pb2l74n0o7xGL29vT90rfplJCpn3MVj2iDDk1WBmzbLOPRI3Z7GjJsmYP15c8GJvdXzlpMlibPZYhy2Hu63/6Gl3eIO6V1gAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAzCAYAAACE92h3AAAABHNCSVQICAgIfAhkiAAAAP5JREFUWEe91t0NgkAQBGCvmku0CO1ErExsSgPFeMJhMETg9mfm5m2fvszLZsJhSN+/mpTe5xhPt/FmJkxYuk9Iatlo6LpnO0jXXysuGkaoJprBmugM1kIXYA30D2SjqyAT3QRZ6C7IQIsgGhWBSFQMolAViEDVoBc1gR7UDFpRF2hB3aAWhYAaFAZKUSgoQeFgCaWAeygNXO7dvNMeMR4bCriFjSoc3MPgYAmDghIMBkoxCKjB3KAWc4EWzAxaMRPowdSgF1OBCEwMojARiMSKIBrbBRnYJsjCVkEm9geysQVYA5vBWlgGa2JrYJ5yedSRklfbt+WFjRU/DaPkB+NkYUNPcf37AAAAAElFTkSuQmCC\"","import React, { useEffect, useState } from 'react'\r\nimport Expand_DownArrow from './../../../../assets/onboard-images/Expand_DownArrow.png';\r\nimport Collapse_UpArrow from './../../../../assets/onboard-images/Collapse_UpArrow.png';\r\nimport Edit_Icon from './../../../../assets/onboard-images/Edit_Icon.png';\r\nimport deleteIcon from './../../../../assets/onboard-images/Delete_Icon.png'\r\nimport { DeleteModalPopup } from '../../../Onboard/OnboardComponents/Modals/DeleteModalPopup';\r\nimport { AdminViewDeleteModel } from '../AdminViewModels';\r\nimport { getAccessGroupData, getAccessGroupEditData, updateAccessGroupDeleteStart } from '../../../../actions/Administration/adminView.action';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { Link } from 'react-router-dom';\r\n\r\nconst AccessGroupTableView = ({info,key}) => {\r\n const dispatch = useDispatch();\r\n \r\n \r\n const [showAccordion, setShowAccordion] = useState(false);\r\n const [showDeleteAccessGroupModal, setShowDeleteAccessGroupModal] = useState(false);\r\n\r\n const handleDeleteAccessGroup = () =>{\r\n let deleteObj = [{\"AccessGroupID\": info.AccessGroupID}]\r\n dispatch(updateAccessGroupDeleteStart(deleteObj))\r\n dispatch(getAccessGroupData());\r\n setShowDeleteAccessGroupModal(false)\r\n dispatch(getAccessGroupData());\r\n }\r\n\r\n const editData = {\r\n Mode: 'Edit',\r\n editInfo: info\r\n };\r\n return (\r\n <>\r\n \r\n {info?.['Access Group']} \r\n \r\n \r\n
\r\n
\r\n \r\n
setShowDeleteAccessGroupModal(true)}/>
\r\n {\r\n setShowAccordion(!showAccordion)\r\n }} />
\r\n \r\n \r\n \r\n {(showAccordion) &&\r\n \r\n \r\n Access Group Descriptions: {info.Description}\r\n
\r\n \r\n \r\n Operations \r\n \r\n \r\n \r\n \r\n \r\n {(info?.OperationList)?.map((data,i,row)=>({data.Operation} {i+1 === row.length ? '' : '|' } ))}\r\n \r\n
\r\n \r\n \r\n }\r\n \r\n \r\n {showDeleteAccessGroupModal && \r\n setShowDeleteAccessGroupModal(false)}\r\n />\r\n }\r\n \r\n )\r\n}\r\n\r\nexport default AccessGroupTableView","import React, { useEffect, useState } from 'react';\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\nimport { Link } from 'react-router-dom';\r\nimport searchIcon from './../../../../assets/onboard-images/Search_Icon.png';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getAccessGroupAddData, getAccessGroupData } from '../../../../actions/Administration/adminView.action';\r\nimport AccessGroupTableView from './AccessGroupTableView';\r\nimport { useHistory } from 'react-router-dom';\r\n\r\nconst AccessGroupMain = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n let accessGroupMainData = useSelector((state) => state.adminViewReducer.accessGroupMainData);\r\n let accessGroupAddData = useSelector((state) => state.adminViewReducer.accessGroupAddData);\r\nconsole.log('accessGroupMainData',accessGroupMainData)\r\n\r\nuseEffect(() => {\r\n dispatch(getAccessGroupData());\r\n dispatch(getAccessGroupAddData());\r\n}, [dispatch]);\r\n\r\n const [filter, setFilter] = useState('');\r\n const [searchColumns, setSearchColumns] = useState(['Access Group']);\r\n function searchRows(rows) {\r\n return rows.filter((row) =>\r\n searchColumns.some(\r\n (column) =>\r\n row[column]\r\n .toString()\r\n .toLowerCase()\r\n .indexOf(filter.toLowerCase()) > -1,\r\n ),\r\n );\r\n }\r\n const mode = {\r\n Mode : 'Add',\r\n addData : accessGroupAddData?.[0]?.OperationList\r\n };\r\n\r\n \r\n return (\r\n \r\n
history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={false} label3='Access Groups'\r\n />\r\n \r\n \r\n {searchRows(accessGroupMainData).map((info, i) => )}\r\n \r\n \r\n
history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={true} label3='Access Groups' value3={() => history.push('/admin/accessgroup')} isActive4={false} label4={Mode === 'Edit' ? 'Edit Access Group' : 'Add Access Group'}\r\n />\r\n {Mode === 'Edit' ? 'Edit' : 'Add'} Access Group
\r\n {validation}
\r\n \r\n \r\n Name * \r\n
\r\n \r\n Descriptions * \r\n
\r\n \r\n \r\n Select Operations *
\r\n \r\n
\r\n
\r\n Select All
\r\n
\r\n
\r\n
\r\n \r\n {filterQuery(data)?.map((item, index) => (\r\n
\r\n \r\n \r\n {item.Operation} \r\n
\r\n ))\r\n }\r\n
}\r\n \r\n \r\n dispobj()}>{Mode === 'Edit' ? 'UPDATE' : 'ADD'} \r\n history.push('/admin/accessgroup')}>CANCEL \r\n \r\n \r\n
history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={false} label3='Users'\r\n />\r\n \r\n \r\n\r\n {showDeleteRoleModal && \r\n setShowDeleteRoleModal(false)}\r\n />\r\n }\r\n \r\n
history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={()=>history.push('/adminviewlanding')}\r\n isActive3={true} label3='Users' value3={() => history.push('/admin/users')} isActive4={false} label4={Mode === 'Edit' ? 'Edit Role' : 'Add Role'}\r\n />\r\n\r\n {Mode === 'Edit' ? 'Edit User' : 'Add User' }
\r\n {validation}
\r\n\r\n \r\n \r\n Name * \r\n\r\n
\r\n \r\n UPN * \r\n\r\n
\r\n \r\n\r\n \r\n \r\n Email ID * \r\n\r\n
\r\n \r\n ValidUntilDateHandler(date)}\r\n />\r\n
\r\n \r\n\r\n \r\n \r\n Country \r\n \r\n
\r\n \r\n City \r\n\r\n
\r\n \r\n\r\n \r\n \r\n Time Zone \r\n
\r\n BlockedYes \r\n No \r\n
\r\n\r\n \r\n \r\n\r\n {Mode !== 'Edit' ?
: \r\n \r\n Photo Upload
\r\n You can upload only PNG, GIF and JPEG files. Maximum upload file size: 1MB.
\r\n \r\n BROWSE your files. \r\n
\r\n {error}
\r\n {datacard && {file.name} \r\n
{(file.size) / 1024} KB \r\n
}\r\n }\r\n\r\n {Mode !== 'Edit' ?
: <> \r\n Role and Account Assignment
\r\n {setShowAddRoleAccountModel(true);setMode('Add');setEditRoleAccountData([])}}>ADD ROLE AND ACCOUNT
\r\n \r\n\r\n\r\n \r\n {(addUserTableData).length === 0 ?\r\n\r\n \r\n \r\n \r\n {headers.map(header => (\r\n {header.caption} {' '} \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n No records found.
\r\n
\r\n \r\n: \r\n \r\n \r\n {headers.map(header => (\r\n {header.caption} {' '} \r\n \r\n \r\n \r\n {\r\n (addUserTableData).map((data, index) => (\r\n \r\n {data?.Role} \r\n {(data?.Customer)} \r\n {data?.Servicedesk} \r\n {data?.Region} \r\n {data?.['Valid From']} \r\n {data?.['Valid To']} \r\n \r\n {setShowAddRoleAccountModel(true);setEditRoleAccountData(data);setMode('Edit');setTableRow({ ...data, index })}}>\r\n \r\n\r\n {setDeleteRowid(index);setDeleteRowData(data);setShowDeleteRoleModal(true)}}>\r\n \r\n \r\n \r\n \r\n ))\r\n }\r\n \r\n
}\r\n }\r\n \r\n \r\n {Mode === 'Edit' ? dispEditobj() : dispobj()}}>{Mode === 'Edit' ? 'UPDATE' : 'ADD' } \r\n history.push('/admin/users')}>CANCEL \r\n \r\n\r\n{showAddRoleAccountModel && \r\nsetShowAddRoleAccountModel(false)}\r\nsaveHandler={()=>setShowAddRoleAccountModel(false)} addValueToTable={addValueToTable} editRoleAccountData={editRoleAccountData}\r\nmode={mode}\r\n/>\r\n }\r\n\r\n{showDeleteRoleModal && \r\n setShowDeleteRoleModal(false)}\r\n />\r\n }\r\n \r\n \r\n {agentsKPIAccountsData?.[0]?.Agent}
\r\n \r\n \r\n {TableHeader.map(header => (\r\n {header.title} \r\n ))\r\n }\r\n \r\n \r\n \r\n \r\n {agentsKPIAccountsData?.[0]?.Accounts.map(data => (\r\n {data.AccountName} \r\n {data.MonthYear} \r\n {data?.['Valid From']} \r\n {data?.['Valid To']} \r\n ))\r\n }\r\n \r\n \r\n
\r\n \r\n\r\n \r\n}\r\n\r\n\r\nexport function AssignedAccountsTblPopUp({ isOpen, setShowModal, children }) {\r\n return (<>\r\n setShowModal(false)}\r\n portalClassName='backdrop'\r\n style={{\r\n overlay: {\r\n background: ' #63666A66 0% 0% no-repeat padding-box',\r\n opacity: '1',\r\n },\r\n content: {\r\n top: '50%',\r\n left: '50%',\r\n right: 'auto',\r\n bottom: 'auto',\r\n marginRight: '-30%',\r\n transform: 'translate(-50%, -50%)',\r\n margin:'20px',\r\n padding:'30px',\r\n \r\n }\r\n }}>\r\n {children}\r\n \r\n\r\n )\r\n}\r\n","import React, { useState } from 'react';\r\nimport './AgentsTableComponent.css';\r\nimport TableData from './FilterTable.json';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { AssignedAccountsTblModel, AssignedAccountsTblPopUp } from '../AgentsKPIModels/AgentsKPIModels';\r\nimport { Line } from 'react-chartjs-2';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { AgentsKPIAccountsData, getAgentsGraphData, saveSelectedAgentScoreCardDate} from '../../../actions/ScoreCard&TeamKPI.action';\r\nimport AboveRequiredTarget_Status from \"../../../assets/images/AboveRequiredTarget_Status.png\"\r\nimport BelowMinimalTarget_Status from \"../../../assets/images/BelowMinimalTarget_Status.png\"\r\nimport BelowMinimalTargetIcon from \"../../../assets/images/BelowMinimalTarget_Status.png\";\r\nimport CloseWindow_Normal from '../../../assets/images/CloseWindow_Normal.png';\r\n\r\nconst AgentsTableComponent = (props) => {\r\nconst history = useHistory();\r\nconst dispatch = useDispatch();\r\nlet agentsKPISummaryData = useSelector((state) => state.ScoreCardReducer.agentsKPISummaryData);\r\nlet selectedTab = useSelector((state) => state.ScoreCardReducer.selectedTab);\r\nlet selectedDate = useSelector((state) => state.ScoreCardReducer.selectedDate);\r\nlet agentsGraphData = useSelector((state) => state.ScoreCardReducer.agentsGraphData);\r\nconsole.log('agentsKPISummaryData',agentsGraphData,agentsGraphData?.[0]?.YAxis)\r\n\r\n\r\n\r\nconst [showAccAsgnMdl,SetShowAccAsgnMdl] = useState(false);\r\nconst [showStaffedTimeMdl,SetShowStaffedTimeMdl] = useState(false);\r\n\r\n const TableHeaderHandler = () => {\r\n switch (props.SelectedTab) {\r\n case 'Schedule / Attendance': return TableData.ScheduleHeader\r\n case 'Customer Experience': return TableData.CustomerHeader\r\n case 'Quantitative': return TableData.QuantitativeHeader\r\n case 'Qualitative': return TableData.QualitativeHeader\r\n case 'Account Specific KPIs': return TableData.AccountHeader\r\n case 'AWS Telephony': return TableData.AWSHeader\r\n default: { }\r\n }\r\n }\r\n\r\n const ArrowHandler = (color) => {\r\n switch (color) {\r\n case 'Red': return BelowMinimalTarget_Status;\r\n case 'Green': return AboveRequiredTarget_Status;\r\n case 'Yellow': return BelowMinimalTargetIcon;\r\n default: return;\r\n }\r\n }\r\n\r\n\r\n\r\n\r\n\r\nconst options = {\r\n responsive: true,\r\n plugins: {\r\n legend: {\r\n position: 'top' \r\n },\r\n title: {\r\n display: true,\r\n text: 'Chart.js Line Chart',\r\n },\r\n tooltip: {\r\n //yAlign: 'bottom',\r\n displayColors: false,\r\n backgroundColor: 'white',\r\n bodyColor: 'black',\r\n titleMarginBottom: 0,\r\n borderColor: '#969696',\r\n borderWidth: 1,\r\n titleColor: '#63666A',\r\n titleAlign: 'center',\r\n titleFont: {weight: '400'},\r\n displayColors: false,\r\n padding: 10,\r\n cornerRadius: 0,\r\n caretSize:5,\r\n bodyFont: {weight: 'bolder'},\r\n callbacks: {\r\n label: (context) => { \r\n let label = context.parsed.y; \r\n return label; \r\n }\r\n }\r\n\r\n } \r\n },\r\n scales:{\r\n x: {\r\n stacked: true,\r\n title:{\r\n display: true,\r\n }\r\n },\r\n y: {\r\n beginAtZero: true,\r\n grid: {\r\n display: false,\r\n borderColor: 'white'\r\n },\r\n ticks: {\r\n display: false\r\n }\r\n }\r\n}, \r\n \r\n};\r\n\r\n const setLabels = agentsGraphData?.[0]?.details.map((data)=>{return data.YearMonth})\r\n const setData = agentsGraphData?.[0]?.details.map((data)=>{return data.Value2})\r\n\r\n\r\nconst data = {\r\n labels: setLabels,\r\n datasets: [ \r\n {\r\n type: \"line\",\r\n label: \"Met %\",\r\n borderColor: \"#6CC24A\",\r\n tension: 0.1, \r\n fill: false,\r\n data: setData,\r\n order: 1,\r\n yAxisID: 'metprcnt'\r\n }\r\n ]\r\n};\r\n\r\nconst DisplayGraphHandler = (Agent,Metric) =>{\r\n SetShowStaffedTimeMdl(true);\r\n dispatch(getAgentsGraphData(Agent,selectedTab,Metric,selectedDate))\r\n}\r\n\r\n\r\n\r\n// // working solution.................................................................................................\r\n\r\n// const durations = ['01:30:00', '02:15:45', '00:45:30', '03:00:00', '01:00:15'];\r\n\r\n// // Function to convert hh:mm:ss to seconds\r\n// const timeToSeconds = (time) => {\r\n// const [hours, minutes, seconds] = time.split(':').map(Number);\r\n// return hours * 3600 + minutes * 60 + seconds;\r\n// };\r\n\r\n// // Function to convert seconds to hh:mm:ss\r\n// const secondsToTime = (seconds) => {\r\n// const hrs = Math.floor(seconds / 3600);\r\n// const mins = Math.floor((seconds % 3600) / 60);\r\n// const secs = seconds % 60;\r\n// return `${hrs.toString().padStart(2, '0')}:${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;\r\n// };\r\n\r\n// // Convert durations to seconds for Chart.js\r\n// const durationsInSeconds = durations.map(time => timeToSeconds(time));\r\n\r\n// // Prepare data for Chart.js format\r\n// const data = {\r\n// labels: ['Data Point 1', 'Data Point 2', 'Data Point 3', 'Data Point 4', 'Data Point 5'],\r\n// datasets: [\r\n// {\r\n// label: 'Time Durations',\r\n// data: durationsInSeconds,\r\n// borderColor: 'green',\r\n// fill: false\r\n// }\r\n// ]\r\n// };\r\n\r\n// // Chart options\r\n// const options = {\r\n// plugins: {\r\n// legend: {\r\n// position: 'top' \r\n// },\r\n// title: {\r\n// display: true,\r\n// text: 'Chart.js Line Chart',\r\n// },\r\n// tooltip: {\r\n// //yAlign: 'bottom',\r\n// displayColors: false,\r\n// backgroundColor: 'white',\r\n// bodyColor: 'black',\r\n// titleMarginBottom: 0,\r\n// borderColor: '#969696',\r\n// borderWidth: 1,\r\n// titleColor: '#63666A',\r\n// titleAlign: 'center',\r\n// titleFont: {weight: '400'},\r\n// displayColors: false,\r\n// padding: 10,\r\n// cornerRadius: 0,\r\n// caretSize:5,\r\n// bodyFont: {weight: 'bolder'},\r\n// callbacks: {\r\n// label: (context) => { \r\n// let label = context.parsed.y; \r\n// return secondsToTime(label); \r\n// }\r\n// }\r\n\r\n// } \r\n// },\r\n// scales: {\r\n// y: {\r\n// title: {\r\n// display: true,\r\n// text: 'Time (hh:mm:ss)'\r\n// },\r\n// ticks: {\r\n// // Custom callback to format y-axis labels as hh:mm:ss\r\n// callback: function(value) {\r\n// return secondsToTime(value);\r\n// }\r\n// }\r\n// }\r\n// }\r\n// };\r\n\r\n\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n {''} \r\n {TableHeaderHandler().map(header => (\r\n {header.caption} \r\n \r\n \r\n <> {agentsKPISummaryData?.[0]?.Agent && agentsKPISummaryData?.[0]?.Agent.map((info, i) =>\r\n \r\n \r\n \r\n {history.push('/agent');dispatch(saveSelectedAgentScoreCardDate(info?.Agent))}}>{info?.Agent}
\r\n {SetShowAccAsgnMdl(true);dispatch(AgentsKPIAccountsData(info?.Agent))}}>Assigned Accounts: {info?.['Assigned Accounts']}
\r\n Score: {info?.Score}
\r\n {info?.['for Last Month']}
for Last Month \r\n DisplayGraphHandler(value['Agent'],value['Metric'])} style={{cursor:'pointer'}}>\r\n { (value['Value1']) } {value['Color2'] !== null ? \r\n })}\r\n
\r\n\r\n\r\n {showAccAsgnMdl &&
\r\n {SetShowAccAsgnMdl(false)}}\r\n />\r\n }\r\n\r\n {showStaffedTimeMdl &&
\r\n \r\n
{agentsGraphData?.[0]?.Agent}
SetShowStaffedTimeMdl(false)} style={{cursor:'pointer'}}>
\r\n
{agentsGraphData?.[0]?.widget} - {agentsGraphData?.[0]?.metric}
\r\n
{agentsGraphData?.[0]?.YAxis}
\r\n
Year/Month
\r\n
}\r\n \r\n
\r\n
\r\n \r\n
\r\n \r\n \r\n
Account Assigned
\r\n {selectedvalues.length === 0 ?
:
setShowOffCanvas(true)} className='Accounts_Details'>{teamleaderAccounts.length}
}\r\n
setShowOffCanvas(false)} show={showOffCanvas} Title='Account Assignment'/>\r\n \r\n Year & Month \r\n
\r\n\r\n \r\n
\r\n
\r\n
{selectedArray}
\r\n clearfilterHandler()}>Clear filters
{selectedAccountArray}
\r\n {selectedvalues.length === 0 ? clearfilterHandlerAccounts()}>Clear filters
: ''}\r\n \r\n history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={() => history.push('/adminviewlanding')}\r\n isActive3={false} label3='Audit Role'\r\n />\r\n Audit Role \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n Role \r\n { setSelectedRole(value);setIsRefreshedClicked(false) }} refresh={isRefreshClicked}/>\r\n \r\n \r\n User \r\n { setSelectedUser(emailIDhandler(value));setIsRefreshedClicked(false) }} refresh={isRefreshClicked}/>\r\n \r\n \r\n Account \r\n { setSelectedAccount(value);setIsRefreshedClicked(false) }} refresh={isRefreshClicked}/>\r\n \r\n \r\n Site \r\n { setSelectedSite(value);setIsRefreshedClicked(false) }} refresh={isRefreshClicked}/>\r\n \r\n \r\n Region \r\n { setSelectedRegion(value);setIsRefreshedClicked(false) }} refresh={isRefreshClicked}/>\r\n \r\n
\r\n \r\n {\r\n setSelectedRole(undefined);\r\n setSelectedUser(undefined);\r\n setSelectedAccount(undefined);\r\n setSelectedSite(undefined);\r\n setSelectedRegion(undefined);\r\n setAuditRoleData([]);\r\n setIsRefreshedClicked(true)\r\n }} icon={RefreshIcon} />
\r\n \r\n\r\n {auditRoleData.length === 0 ? No records found.\r\n
: \r\n \r\n \r\n \r\n {headers.map(header => (\r\n {header.caption} \r\n \r\n {\r\n (auditRoleData).map((data, index) => (\r\n \r\n {data.role} \r\n {data.user} \r\n {data.account} \r\n {data.site} \r\n {data.region} \r\n {data.validSince === null ? '' : formatDate(data.validSince)} \r\n {data.validUntil === null ? '' : formatDate(data.validUntil)} \r\n \r\n ))\r\n }\r\n \r\n
}\r\n \r\n )\r\n}\r\n\r\nexport default AuditRole","import React, { useEffect, useState } from 'react';\r\nimport AdminBreadcrumb from '../../General/Admin-breadcrumb';\r\n\r\nimport { useHistory } from 'react-router-dom';\r\nimport './Audit.css';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { getAccessGroup, getAdminRoles, getAuditRBACData, getOperationsData } from '../../../../actions/Administration/adminView.action';\r\nimport Filter_Icon from './../../../../assets/images/Filter_Icon.png';\r\nimport Button from '../../../ReportTables/ReportFilters/Button';\r\nimport RefreshIcon from './../../../../assets/images/Reset_Icon.png';\r\nimport { OnboardSelect } from '../../../Onboard/OnboardComponents/Dropdown/Select';\r\n\r\n\r\nconst headers = [\r\n {\r\n caption: \"Role\",\r\n id: \"1\"\r\n }, {\r\n caption: \"Access Group\",\r\n id: \"2\"\r\n },\r\n {\r\n caption: \"Operation\",\r\n id: \"3\"\r\n }\r\n]\r\n\r\n\r\nconst AuditRBAC = () => {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n let adminViewRoleData = useSelector((state) => state.adminViewReducer.adminViewRoleData);\r\n let accessGroupData = useSelector((state) => state.adminViewReducer.accessGroupData);\r\n let operationsMainData = useSelector((state) => state.adminViewReducer.operationsData);\r\n let auditRBACTableData = useSelector((state) => state.adminViewReducer.auditRBACData);\r\n useEffect(() => {\r\n dispatch(getAccessGroup());\r\n dispatch(getAdminRoles());\r\n dispatch(getOperationsData());\r\n\r\n }, [dispatch]);\r\n\r\n const [selectedRole, setselectedRole] = useState();\r\n const [selectedAccessGroup, setselectedAccessGroup] = useState();\r\n const [selectedOperation, setselectedOperation] = useState();\r\n const [isRefreshClicked, setIsRefreshedClicked] = useState(false);\r\n const [auditRBACData,setAuditRBACData] = useState([])\r\n\r\n useEffect(() => {\r\n if (selectedRole === undefined && selectedAccessGroup === undefined && selectedOperation === undefined) {\r\n setAuditRBACData([])\r\n }\r\n else{\r\n setAuditRBACData(auditRBACTableData)\r\n }\r\n }, [auditRBACTableData, selectedAccessGroup, selectedOperation, selectedRole]);\r\n \r\n\r\n \r\n\r\n console.log('selectedRole',selectedRole,selectedAccessGroup,selectedOperation)\r\n return (\r\n \r\n \r\n history.push('/welcome')} label1='Home' isActive2={true} label2='Administration' value2={() => history.push('/adminviewlanding')}\r\n isActive3={false} label3='Audit RBAC'\r\n />\r\n Audit RBAC \r\n \r\n\r\n \r\n
\r\n \r\n
\r\n Role \r\n {setselectedRole(value); dispatch(getAuditRBACData(value,selectedAccessGroup ? selectedAccessGroup : '' , selectedOperation ? selectedOperation : ''));setIsRefreshedClicked(false)}} />\r\n \r\n
\r\n Access Group \r\n {setselectedAccessGroup(value); dispatch(getAuditRBACData(selectedRole ? selectedRole : '', value , selectedOperation ? selectedOperation : ''));setIsRefreshedClicked(false)}} />\r\n \r\n
\r\n Operation \r\n {setselectedOperation(value); dispatch(getAuditRBACData(selectedRole ? selectedRole : '' , selectedAccessGroup ? selectedAccessGroup : '' , value));setIsRefreshedClicked(false)}} />\r\n \r\n
\r\n {\r\n setselectedRole(undefined);\r\n setselectedAccessGroup(undefined);\r\n setselectedOperation(undefined);\r\n setIsRefreshedClicked(true);\r\n setAuditRBACData([]);\r\n }} icon={RefreshIcon} />
\r\n
No records found.\r\n
: \r\n \r\n \r\n \r\n {headers.map(header => (\r\n {header.caption} \r\n \r\n {\r\n (auditRBACData).map((data, index) => (\r\n \r\n {data.role} \r\n {data.accessGroup} \r\n {data.operation} \r\n \r\n ))\r\n }\r\n \r\n
}\r\n \r\n )\r\n}\r\n\r\nexport default AuditRBAC\r\n\r\n","export default __webpack_public_path__ + \"static/media/AQuAA_Logo.01f8736c.PNG\";","import React from 'react';\r\nimport './Applications.css';\r\nimport { Fragment } from 'react';\r\nimport { useHistory } from 'react-router-dom';\r\nimport AQuAA_Logo from './../assets/images/AQuAA_Logo.PNG'\r\n\r\nconst Apps = [\r\n {\r\n id: 1,\r\n \"Name\": \"AQuAA ASD\",\r\n path:'/aquaa',\r\n img:AQuAA_Logo\r\n },\r\n {\r\n id: 2,\r\n \"Name\": \"AQuAA Non-ASD\",\r\n path:'/aquaa',\r\n img:AQuAA_Logo\r\n },\r\n {\r\n id: 3,\r\n \"Name\": \"APP 3\",\r\n },\r\n {\r\n id: 4,\r\n \"Name\": \"APP 4\",\r\n }\r\n]\r\n\r\nconst Applications = () => {\r\n const history = useHistory();\r\n return (\r\n \r\n \r\n {Apps.map((App,i) => (
history.push(App.path)}>
\r\n
{App.Name}
)) }\r\n
\r\n )\r\n}\r\n\r\nexport default Applications","const AquaaActionTypes = {\r\n GET_AQUAA_ACCOUNTS_DATA: \"GET_AQUAA_ACCOUNTS_DATA\",\r\n AQUAA_ACCOUNTS_DATA: \"AQUAA_ACCOUNTS_DATA\",\r\n\r\n GET_AQUAA_AGENTS_DATA: \"GET_AQUAA_AGENTS_DATA\",\r\n AQUAA_AGENTS_DATA: \"AQUAA_AGENTS_DATA\",\r\n\r\n GET_AQUAA_CHANNELS_DATA: \"GET_AQUAA_CHANNELS_DATA\",\r\n AQUAA_CHANNELS_DATA: \"AQUAA_CHANNELS_DATA\",\r\n\r\n GET_AQUAA_LANGUAGES_DATA: \"GET_AQUAA_LANGUAGES_DATA\",\r\n AQUAA_LANGUAGES_DATA: \"AQUAA_LANGUAGES_DATA\",\r\n\r\n GET_AQUAA_LOCATIONS_DATA: \"GET_AQUAA_LOCATIONS_DATA\",\r\n AQUAA_LOCATIONS_DATA: \"AQUAA_LOCATIONS_DATA\",\r\n\r\n GET_AQUAA_AWS_DATA: \"GET_AQUAA_AWS_DATA\",\r\n AQUAA_AWS_DATA: \"AQUAA_AWS_DATA\",\r\n\r\n GET_EVALUATION_FORM_DATA: \"GET_EVALUATION_FORM_DATA\",\r\n EVALUATION_FORM_DATA: \"EVALUATION_FORM_DATA\",\r\n\r\n UPDATE_EVALUATION_FORM_DATA_START: \"UPDATE_EVALUATION_FORM_DATA_START\",\r\n UPDATE_EVALUATION_FORM_DATA_SUCCESS: \"UPDATE_EVALUATION_FORM_DATA_SUCCESS\",\r\n\r\n\r\n };\r\n \r\n export default AquaaActionTypes;\r\n ","import AquaaActionTypes from \"../../constants/Applications/aquaa-actionTypes\";\r\n\r\n\r\nexport const getAquaaAccountsData = () => ({\r\n type: AquaaActionTypes.GET_AQUAA_ACCOUNTS_DATA\r\n });\r\n\r\nexport const getAquaaAgentsData = (account) => ({\r\n type: AquaaActionTypes.GET_AQUAA_AGENTS_DATA,\r\n account: account\r\n });\r\n\r\nexport const getAquaaChannelsData = (account,agent) => ({\r\n type: AquaaActionTypes.GET_AQUAA_CHANNELS_DATA,\r\n account: account,\r\n agent: agent\r\n });\r\n\r\nexport const getAquaaLanguagesData = (account,agent,channel) => ({\r\n type: AquaaActionTypes.GET_AQUAA_LANGUAGES_DATA,\r\n account: account,\r\n agent: agent,\r\n channel: channel\r\n });\r\n\r\nexport const getAquaaLocationsData = (account,agent,channel,language) => ({\r\n type: AquaaActionTypes.GET_AQUAA_LOCATIONS_DATA,\r\n account: account,\r\n agent: agent,\r\n channel: channel,\r\n language:language\r\n });\r\n\r\n export const getAquaaAWSData = (account,agent,channel,language,location) => ({\r\n type: AquaaActionTypes.GET_AQUAA_AWS_DATA,\r\n account: account,\r\n agent: agent,\r\n channel: channel,\r\n language:language,\r\n location:location\r\n });\r\n\r\n export const getEvaluationFormData = (contactId) => ({\r\n type: AquaaActionTypes.GET_EVALUATION_FORM_DATA,\r\n contactId:contactId\r\n });\r\n\r\n export const updateEvaluationFormDataStart= (data) => (\r\n {\r\n type: AquaaActionTypes.UPDATE_EVALUATION_FORM_DATA_START,\r\n payload: data,\r\n }\r\n )\r\n \r\n export const updateEvaluationFormDataSuccess = () => (\r\n {\r\n type: AquaaActionTypes.UPDATE_EVALUATION_FORM_DATA_SUCCESS,\r\n }\r\n )\r\n","import React, { useEffect, useState } from 'react'\r\nimport { useDispatch } from 'react-redux';\r\nimport { useSelector } from 'react-redux';\r\nimport { getAquaaAccountsData, getAquaaAgentsData, getAquaaAWSData, getAquaaChannelsData, getAquaaLanguagesData, getAquaaLocationsData } from '../../actions/Applications/aquaa.action';\r\nimport Filter_Icon from './../../assets/images/Filter_Icon.png';\r\nimport { OnboardSelect } from '../../components/Onboard/OnboardComponents/Dropdown/Select';\r\nimport DatePickerHandle from '../../components/Onboard/OnboardComponents/KeyboardDatePicker';\r\nimport './Aquaa.css'\r\nimport { useHistory } from 'react-router-dom';\r\nimport { Link } from 'react-router-dom';\r\n\r\n\r\nconst Aquaa = () => {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const aquaaAccounts = useSelector((state) => state.aquaaReducer.aquaaAccounts);\r\n const aquaaAgents = useSelector((state) => state.aquaaReducer.aquaaAgents);\r\n const aquaaChannels = useSelector((state) => state.aquaaReducer.aquaaChannels);\r\n const aquaaLanguages = useSelector((state) => state.aquaaReducer.aquaaLanguages);\r\n const aquaaLocations = useSelector((state) => state.aquaaReducer.aquaaLocations);\r\n const aquaaAWS = useSelector((state) => state.aquaaReducer.aquaaAWS);\r\n\r\n \r\n const [isRefreshClicked, setIsRefreshedClicked] = useState(false); \r\n const [selectedRole, setSelectedRole] = useState();\r\n const [selectedAccount, setSelectedAccount] = useState();\r\n const [selectedChannel, setSelectedChannel] = useState();\r\n const [selectedLanguage, setSelectedLanguage] = useState();\r\n const [selectedLocation, setSelectedLocation] = useState();\r\n \r\n const [sortConfig, setSortConfig] = useState({ key: '', direction: 'asc' }); // Added sorting state\r\n \r\n useEffect(()=> {\r\n dispatch(getAquaaAccountsData());\r\n }, [dispatch, selectedAccount]);\r\n\r\n useEffect(() => {\r\n if (selectedAccount) {\r\n dispatch(getAquaaAgentsData(selectedAccount));\r\n }\r\n }, [dispatch, selectedAccount]); \r\n\r\n useEffect(() => {\r\n if (selectedAccount && selectedRole) {\r\n dispatch(getAquaaChannelsData(selectedAccount, selectedRole));\r\n }\r\n }, [dispatch, selectedAccount, selectedRole]); \r\n\r\n useEffect(() => {\r\n if (selectedAccount && selectedRole && selectedChannel) {\r\n dispatch(getAquaaLanguagesData(selectedAccount, selectedRole, selectedChannel));\r\n }\r\n }, [dispatch, selectedAccount, selectedRole, selectedChannel]); \r\n\r\n useEffect(() => {\r\n if (selectedAccount && selectedRole && selectedChannel && selectedLanguage) {\r\n dispatch(getAquaaLocationsData(selectedAccount, selectedRole, selectedChannel, selectedLanguage));\r\n }\r\n }, [dispatch, selectedAccount, selectedRole, selectedChannel, selectedLanguage]); \r\n\r\n const columns = aquaaAWS && aquaaAWS.length > 0 ? Object.keys(aquaaAWS[0]) : [];\r\n\r\n // Sorting function to handle sorting of columns\r\n const sortedData = React.useMemo(() => {\r\n if (!sortConfig.key) return aquaaAWS;\r\n \r\n const sortedArray = [...aquaaAWS].sort((a, b) => {\r\n if (a[sortConfig.key] < b[sortConfig.key]) {\r\n return sortConfig.direction === 'asc' ? -1 : 1;\r\n }\r\n if (a[sortConfig.key] > b[sortConfig.key]) {\r\n return sortConfig.direction === 'asc' ? 1 : -1;\r\n }\r\n return 0;\r\n });\r\n return sortedArray;\r\n }, [aquaaAWS, sortConfig]); // Re-sort when `sortConfig` changes\r\n\r\n // Handle header click to toggle sorting order\r\n const handleSort = (column) => {\r\n setSortConfig((prevState) => {\r\n if (prevState.key === column) {\r\n // If same column is clicked again, toggle direction\r\n return { key: column, direction: prevState.direction === 'asc' ? 'desc' : 'asc' };\r\n } else {\r\n // Otherwise, sort by the new column and set to ascending\r\n return { key: column, direction: 'asc' };\r\n }\r\n });\r\n };\r\n\r\n function formatDate(date) {\r\n var d = new Date(date),\r\n month = '' + (d.getMonth() + 1),\r\n day = '' + d.getDate(),\r\n year = d.getFullYear();\r\n if (month.length < 2)\r\n month = '0' + month;\r\n if (day.length < 2)\r\n day = '0' + day;\r\n\r\n return [month, day, year].join('/');\r\n }\r\n\r\n console.log('selectedAccount',selectedAccount)\r\n\r\n return (\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n Account \r\n { setSelectedAccount(value); setIsRefreshedClicked(false) }} refresh={isRefreshClicked} />\r\n \r\n \r\n Agent \r\n { setSelectedRole(value); setIsRefreshedClicked(false) }} refresh={isRefreshClicked} />\r\n \r\n \r\n Channel \r\n { setSelectedChannel(value); setIsRefreshedClicked(false) }} refresh={isRefreshClicked} />\r\n \r\n \r\n Language \r\n { setSelectedLanguage(value); setIsRefreshedClicked(false) }} refresh={isRefreshClicked} />\r\n \r\n \r\n Location \r\n { setSelectedLocation(value); setIsRefreshedClicked(false) }} refresh={isRefreshClicked} />\r\n \r\n \r\n \r\n \r\n \r\n {\r\n dispatch(getAquaaAWSData(selectedAccount, selectedRole, selectedChannel, selectedLanguage, selectedLocation));\r\n }}>LOAD \r\n
\r\n \r\n\r\n
\r\n \r\n {selectedAccount === undefined ? 'No Data Found' :
\r\n \r\n \r\n {columns.map((col, index) => (\r\n col === 'talktime' && handleSort(col)}>\r\n {col}\r\n {col === 'talktime' && sortConfig.key === col ? (\r\n sortConfig.direction === 'asc' ? ' ↑' : ' ↓'\r\n ) : null}\r\n \r\n ))}\r\n \r\n \r\n \r\n {sortedData && sortedData.length > 0 ? (\r\n sortedData.map((row, rowIndex) => (\r\n \r\n {columns.map((col, colIndex) => {\r\n const cellData = row[col];\r\n\r\n if (col === 'Row_date') {\r\n return {formatDate(cellData)} ;\r\n }\r\n\r\n return \r\n {col === 'contactid' ? ;\r\n })}\r\n \r\n ))\r\n ) : (\r\n No data available \r\n
}\r\n
\r\n
\r\n \r\n \r\n {/* Inputs for Ticket Number, Title, Agent Email, etc. */}\r\n \r\n
Ticket Number
\r\n
handleFormDataChange('ticketNumber', e.target.value)} // Bind to formData.ticketNumber\r\n />\r\n \r\n
Contact id \r\n
{contactid}
\r\n
\r\n
Agent Email \r\n
{evaluationData?.[0]?.AccountDetails?.[0]?.Agent}
\r\n
\r\n
Account \r\n
{evaluationData?.[0]?.AccountDetails?.[0]?.Account}
\r\n
\r\n
Evaluation Form \r\n
{evaluationData?.[0]?.AccountDetails?.[0]?.ContactTypeForm}
\r\n
\r\n
Evaluation Date \r\n
{[formatDate(Date())]}
\r\n
\r\n\r\n \r\n \r\n
Soft Skills
Scored
{sectionwiseTotalMinusNotMet?.['Soft Skills']}
Max Points
{sectionScores?.['Soft Skills']}
\r\n
{sectionPercentages?.['Soft Skills']}
\r\n \r\n \r\n \r\n
Process
Scored
{sectionwiseTotalMinusNotMet?.['Process']}
Max Points
{sectionScores?.['Process']}
\r\n
{sectionPercentages?.['Process']}
\r\n \r\n \r\n \r\n
Resolution
Scored
{sectionwiseTotalMinusNotMet?.['Resolution']}
Max Points
{sectionScores?.['Resolution']}
\r\n
{sectionPercentages?.['Resolution']}
\r\n \r\n \r\n \r\n
Summary
Fatal Errors
{feNotMetCount}
Non Fatal Errors
{nfNotMetCount}
Overall Score
{summaryPercentage < 90 ? 'Fail' : 'pass'}
\r\n
\r\n \r\n \r\n {Object.keys(sections).map((sectionName) => (\r\n \r\n
{sectionName}
\r\n {sectionName === 'Summary' ? (\r\n <>\r\n
\r\n \r\n \r\n Tracking Questions \r\n \r\n \r\n \r\n {sections[sectionName].map((row) => (\r\n \r\n {row.description} \r\n \r\n resp.questionId === row.id && resp.sectionName === sectionName)?.assessment || row.defaultassessment}\r\n onChange={(e) => handleResponseChange(sectionName, row.id, row.assessments[0]?.AssessmentId, 'assessment', e.target.value)}\r\n >\r\n {row.assessments?.length > 0 ? (\r\n row.assessments.map((assessment) => (\r\n {assessment.Assessment} \r\n ))\r\n ) : (\r\n N/A \r\n )}\r\n \r\n \r\n \r\n ))}\r\n \r\n
\r\n
\r\n
\r\n {Overall.map((data) => (\r\n
\r\n {data.iName} \r\n {data.iName === 'Voice Analytics' ? (\r\n \r\n handleFormDataChange('voiceAnalytics', e.target.value)}\r\n />\r\n \r\n ) : (\r\n \r\n \r\n handleFormDataChange('overallMapData', { ...formData.overallMapData, [data.iName]: !formData.overallMapData[data.iName] })}\r\n />\r\n \r\n \r\n )}\r\n
\r\n ))}\r\n
\r\n
\r\n item.name === sectionName)?.comments || ''}\r\n onChange={(e) => handleSectionCommentChange(sectionName, e.target.value)}\r\n />\r\n
\r\n
\r\n \r\n ) : (\r\n <>\r\n
\r\n \r\n \r\n Parameter Type \r\n Description \r\n Assessment \r\n \r\n \r\n \r\n {sections[sectionName].map((row) => (\r\n \r\n {row.parameterType} \r\n {row.description} \r\n \r\n resp.questionId === row.id && resp.sectionName === sectionName)?.assessment || row.defaultassessment}\r\n onChange={(e) => handleResponseChange(sectionName, row.id, row.assessments[0]?.AssessmentId, 'assessment', e.target.value)}\r\n >\r\n {row.assessments?.length > 0 ? (\r\n row.assessments.map((assessment) => (\r\n {assessment.Assessment} \r\n ))\r\n ) : (\r\n N/A \r\n )}\r\n \r\n \r\n handleToggle(sectionName, row.id)}\r\n />\r\n \r\n {activeRows[`${sectionName}-${row.id}`] && (\r\n handleResponseChange(sectionName, row.id, row.assessments[0]?.AssessmentId, 'comment', e.target.value)}\r\n placeholder=\"Enter comment\"\r\n />\r\n )}\r\n \r\n \r\n ))}\r\n \r\n
\r\n
\r\n item.name === sectionName)?.comments || ''}\r\n onChange={(e) => handleSectionCommentChange(sectionName, e.target.value)}\r\n />\r\n
\r\n \r\n )}\r\n
\r\n \r\n \r\n \r\n \r\n dispatchHandler('Submitted')}>SUBMIT \r\n \r\n\r\n {/* \r\n
Tracked Responses \r\n
{JSON.stringify(responses, null, 2)} \r\n
Section Comments \r\n
{JSON.stringify(sectionComments, null, 2)} \r\n
\r\n );\r\n};\r\n\r\nexport default EvaluationForm;\r\n","import React, { useEffect, lazy, Suspense } from \"react\";\r\nimport { Route, Switch, useLocation } from \"react-router-dom\";\r\nimport { withRouter } from 'react-router';\r\nimport \"bootstrap/dist/css/bootstrap.min.css\";\r\nimport Container from \"./components/Container/container\";\r\nimport SiteLanding from \"./components/RegionalSiteLanding/regionalSiteLanding\";\r\nimport RegionalSite from \"./components/RegionalSiteLanding/regionalSite\";\r\nimport AccountGlobal from \"./components/RegionalSiteLanding/Account-Global/account-global\";\r\nimport GlobalSummary from \"./components/RegionalSiteLanding/GlobalSummary/global-summary\";\r\nimport RegionalSummary from \"./components/RegionalSiteLanding/RegionalSummary/regional-summary\";\r\nimport FinanceHandler from \"./components/Finance/FinanceHandler/FinanceHandler\";\r\nimport WelcomePage from './components/LandingPage/Welcome-LandingPage/WelcomePage';\r\nimport Roleselectionpage from './components/LandingPage/RoleSelection/Roleselectionpage';\r\nimport Profilepage from './components/LandingPage/ProfilePage/ProfileDetails';\r\nimport Navigationbar from \"./components/Onboard/Navigation/Navigationbar\";\r\nimport ExecutiveDashboard from \"./components/ExecutiveDashBoard/executive-dashboard\";\r\nimport KPIReportHandler from \"./components/ReportTables/ReportHandler/KPIReportHandler\";\r\nimport LandingPage from \"./components/LandingPage/CustomWidget/LandingPage\";\r\nimport AccountSelect from \"./components/LandingPage/Welcome-LandingPage/AccountSelect\";\r\nimport EmployeeAssign from \"./components/Administration/Staff-Administration/Employee-Assignment/EmployeeAssign\";\r\nimport ReleaseHandler from \"./components/LandingPage/Releases/ReleaseHandler\";\r\nimport EmployeeDetails from \"./components/Administration/Staff-Administration/EmployeeDetails/EmployeeDetails\";\r\nimport UserLandingPage from \"./components/LandingPage/FirstTimeVisitor/UserLandingPage\";\r\nimport SLAExemptionHandler from \"./components/Administration/SLA-Administration/SLA-Exemption/SLAExemptionHandler\";\r\nimport SLAExclusionHandler from \"./components/Administration/SLA-Administration/SLA-Exclusion/SLAExclusionHandler\";\r\nimport FirstVisitor from \"./components/LandingPage/FirstTimeVisitor/FirstVisitor\";\r\nimport AgentScoreCard from \"./components/Agent-ScoreCard/AgentScoreCard\";\r\nimport OnboardLanding from \"./components/Onboard/OnboardComponents/onboardLanding/OnboardLanding\";\r\nimport RequestIncidentMain from \"./components/Requests/RequestIncidentMain\";\r\nimport WhyGsd from \"./components/GitHub/WhyGsd\";\r\nimport GitHubPage from \"./components/GitHub/GitHub_LandingPage/GitHubPage\";\r\nimport UploadAccountList from './components/Uploads/Upload-Navigation/UploadAccountList';\r\nimport UploadNavigation from './components/Uploads/Upload-Navigation/UploadNavigation';\r\nimport DataAdministration from \"./components/Uploads/Data-Administration/DataAdministration\";\r\nimport DTMAnalyticsHandler from \"./components/DTM-Analytics/DTM-Analytics-NonSLA\";\r\nimport DTMAnalyticsSLA from \"./components/DTM-Analytics/DTM-Analytics-SLA\";\r\nimport AdminLanding from \"./components/Administration/Administration_firstpage.js/AdminLanding\";\r\nimport ReactTrails from \"./components/DTM-Analytics/trails\";\r\nimport GetStarted from \"./components/GitHub/GetStarted\";\r\nimport Architecture from './components/GitHub/Solutions/Architecture';\r\nimport ProductRequirements from \"./components/GitHub/Solutions/ProductRequirements\";\r\nimport ArchitectCards from \"./components/GitHub/Solutions/ArchitectCards\";\r\nimport DeveloperLanding from \"./components/GitHub/Developer/DeveloperLanding\";\r\nimport DeveloperCards from \"./components/GitHub/Developer/DeveloperCards\";\r\nimport User from './components/GitHub/user/User';\r\nimport Security from \"./components/GitHub/Security\";\r\nimport OverView from \"./components/GitHub/Overview/OverView\";\r\nimport Training from \"./components/GitHub/Training/Training\";\r\nimport Design from './components/GitHub/Design/Design';\r\nimport DesignCards from './components/GitHub/Design/DesignCards';\r\nimport Features from \"./components/GitHub/Features/Features\";\r\nimport NotDesigned from \"./components/GitHub/NotDesigned/NotDesigned\";\r\nimport Database from './components/GitHub/Design/Database';\r\nimport FAQ from \"./components/GitHub/FAQ/FAQ\";\r\nimport AdminRequestMain from './components/Requests/AdminRequest/AdminRequestMain';\r\nimport AdminRolesFlow from \"./components/Administration/AdminFirstPage/Roles/Roles\";\r\nimport { AddAdminViewRolePage } from \"./components/Administration/AdminFirstPage/Roles/AddRolesModel\";\r\nimport OperationsMain from \"./components/Administration/AdminFirstPage/Operations/OperationsMain\";\r\nimport AdminViewFirstPage from \"./components/Administration/AdminFirstPage/AdminViewFirstPage\";\r\nimport AccessGroupMain from \"./components/Administration/AdminFirstPage/AccessGroups/AccessGroupMain\";\r\nimport AccessGroupAddEdit from \"./components/Administration/AdminFirstPage/AccessGroups/AccessGroupAddEdit\";\r\nimport UsersMain from \"./components/Administration/AdminFirstPage/Users/UsersMain\";\r\nimport AddUsers from \"./components/Administration/AdminFirstPage/Users/AddUsers\";\r\nimport AgentsKPISummaryTabs from './components/TeamLeaderView/AgentsKPISummary/AgentsKPISummaryTabs';\r\nimport AuditRole from \"./components/Administration/AdminFirstPage/Audit/AuditRole\";\r\nimport AuditRBAC from \"./components/Administration/AdminFirstPage/Audit/AuditRBAC\";\r\nimport Applications from \"./Applications/Applications\";\r\nimport Aquaa from \"./Applications/Aquaa/Aquaa\";\r\nimport EvaluationForm from \"./Applications/EvaluationForm/EvaluationForm\";\r\n\r\n\r\nfunction AppRoutes(props) {\r\n const location = useLocation();\r\n useEffect(() => {\r\n props.localPathnameHandler(location.pathname);\r\n }, [location.pathname]);\r\n return (\r\n <>\r\n Loading...}>\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default withRouter(AppRoutes);\r\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAZCAYAAAAv3j5gAAAABHNCSVQICAgIfAhkiAAAAPlJREFUSEvtlNEVgjAMRc0EruAIjKCTKJ+FeYBPGcURGMEVnKC+nEM5sbQ08ZNDfyg0j9u8pqGTcfR9P3qMtm1ri5QswQxB/J01YI0WmBokIWFzFpgKlIJYYUVQZFdNRM/ZOjkv2rgJiiE4kxHfPIOapqGu6x4CvAnLglIQBkgQv2thSVAOkgJpYSvQMAwXVNOEH5zxrNkueQXijMKayOwDOyvn3FvqkhlBVCGoiiG5jCQM8wk63ujPKFZdLMhlVLr4B2hV3iXLwvoOrUMVvbjro6XcNDbM8dyCroZ4T/+WqwYi790B0jq2xIWj2bF1Zk+MgsU6o84c/gUcleCj2/40LwAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAcCAYAAAAAwr0iAAAABHNCSVQICAgIfAhkiAAAAsxJREFUSEvFVm1u2kAQzYKE+Fd6gjonCD1BzAmSnKDkJx8S5gSlJyD8AH7GOUHgBLgnKD0B5Ab9CUhA37Nm0WLZ6yWQ1pJlez2eefPmzazV1ZnHcDisKqW+w839fr+f4xq2Wq2Bq1vlaphmNx6Pvd1u9wsAfiN4BJsK7ju4/wEQPRffZwFA9k/MHME8HQxrPTLSbDadfDsZZWUyGo0i0g4AgbYBKz7WZji/Yp0lsR5nA4D3JbKtJwGAhetGo7H8UAAsAQLdAcD1fykBRQiqFwg+gRjDYrFYxXPvn4gQ2ZP2DhioptC8xHq4Wq0G3W73j60M79IAxEdx3eD8iWzDQqGwRLB5qVTyEJgdcc8T7/a41mxiPBkAM0eQZzh+QO0nWdn1+/0KABEou4SAUo/3AGCf+wju5yk8ORNkcN2Bscp2u5232+3pyQDY5xCch6zCPABi63MqGsxdoTJvSOILvo+cAIjab6W+cVyAmLoMGtrq4YTbl/V6HVCY0NEMz8oKQAKz3ll0RwD1aBs4wkIfPj7rka3Z4LTMBMBdDh/NEEDBMNhsNhOzpcRxKFQmqxG3IUuFa52UsyvImIhzgfUpJ+gBAF+Uy+UOe5ftJMHfQJmf1cvijAqnvXnoXZGBe6ZeQP0r1mrw69FvDEAcMVtOMrYOkVuD5wkQDMbbtLlPaOqxXkPZIvpQRnCyHQAAe/tT3mbCEsDuNg2Iph7vDrNCl5RCNHdPRaQUCGpcJSXyh8NtdoG1Whb9kk3dwsSTHlSil1ddd/MbhZqEWPiGgI+6Vq4g8srA90b/v5jl0N/GGvgoEHnBYw1oJHkgMD4fMD5vuOW6ZA5GaccNaWDWPPnt0RywgaAwXQJrGxm3gW3DOmLAgQmKlb9fh7+fUwBl2aZOwiQTqOWzTLSDUC8RPJWBJBN4jnDyT/fiwa0AsrrjUpkftaHNKSdl3n/dOaD+AtMz+R6ZqEbDAAAAAElFTkSuQmCC\"","import React, { useState, useRef, useEffect } from \"react\";\r\nimport \"./hamburger-menu.css\";\r\nimport Tooltip from \"react-power-tooltip\";\r\nimport HomeImg from \"../../assets/images/Home_Normal.png\";\r\nimport HomeHovImg from \"../../assets/images/Home_Hover.png\";\r\nimport ReportsImg from \"../../assets/images/Reports_Normal.png\";\r\nimport ReportsHovImg from \"../../assets/images/Reports_Hover.png\";\r\nimport UploadsImg from \"../../assets/images/Uploads_Normal.png\";\r\nimport UploadsHovImg from \"../../assets/images/Uploads_Hover.png\";\r\nimport AccountImg from \"../../assets/images/Account_Normal.png\";\r\nimport AccountHovImg from \"../../assets/images/Account_Hover.png\";\r\nimport OnboardImg from \"../../assets/images/Onboard_Normal.png\";\r\nimport OnboardHovImg from \"../../assets/images/Onboard_Hover.png\";\r\nimport RequestsImg from \"../../assets/images/Requests_Normal.png\";\r\nimport RequestsHovImg from \"../../assets/images/Requests_Hover.png\";\r\nimport AdministrationImg from \"../../assets/images/Administration_Normal.png\";\r\nimport AdministrationHovImg from \"../../assets/images/Administration_Hover.png\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { saveSelectedMenuItem } from \"../../actions/tabMenu.action\";\r\nimport { getRoleBasedView } from \"../../actions/Administration/admin.action\";\r\nimport { getRegionalSiteData } from \"../../actions/regionalSite.action\";\r\nconst Panel = (ref) => {\r\n let activClasses, activTooltip;\r\n let url = window.location.href;\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const roleSelected = localStorage.getItem('RoleSelected');\r\n const RoleBasedView = useSelector((state) => state.adminAccountReducer.RoleBasedView);\r\n useEffect(() => {\r\n dispatch(getRoleBasedView())\r\n }, [dispatch])\r\n const [isOpen, setOpen] = React.useState(true);\r\n const [showHoverEffect, setHoverEffect] = React.useState([]);\r\n const [activeMenu, setActiveMenu] = useState([\r\n true,\r\n false,\r\n false,\r\n false,\r\n false,\r\n false,\r\n false,\r\n ]);\r\n const [tltpMenu, setTltpMenu] = useState([\r\n false,\r\n false,\r\n false,\r\n false,\r\n false,\r\n false,\r\n false,\r\n ]);\r\n const [actvBtn, setActvBtn] = useState(false);\r\n const [pnlWdth, setPnlWdth] = useState(false);\r\n const selectedMenuName = useSelector((state) => state.tabReducer.selectedMenuName);\r\n\r\n useEffect(() => {\r\n switch (selectedMenuName) {\r\n case 'home': {\r\n setActiveMenu([true, false, false, false, false, false, false]);\r\n break;\r\n }\r\n case 'reports': {\r\n setActiveMenu([false, true, false, false, false, false, false]);\r\n break;\r\n }\r\n case 'upload': {\r\n setActiveMenu([false, false, true, false, false, false, false]);\r\n break;\r\n }\r\n case 'account': {\r\n setActiveMenu([false, false, false, true, false, false, false]);\r\n break;\r\n }\r\n case 'onboard': {\r\n setActiveMenu([false, false, false, false, true, false, false]);\r\n break;\r\n }\r\n case 'request': {\r\n setActiveMenu([false, false, false, false, false, true, false]);\r\n break;\r\n }\r\n case 'admin': {\r\n setActiveMenu([false, false, false, false, false, false, true]);\r\n break;\r\n }\r\n default: { }\r\n }\r\n\r\n }, [selectedMenuName]);\r\n\r\n const addActiveClass = (index, mnName) => {\r\n activClasses = activeMenu.map((element) => (element = false));\r\n activClasses = [\r\n ...activClasses.slice(0, index),\r\n !activClasses[index],\r\n activClasses.slice(index + 1),\r\n ].flat();\r\n switch (mnName) {\r\n case 'home': {\r\n dispatch(saveSelectedMenuItem('home'));\r\n history.push(\"/welcome\");\r\n // history.push('/');\r\n break;\r\n }\r\n case 'reports': {\r\n // if(url.includes('/reports')){\r\n // dispatch(saveSelectedMenuItem('reports'));\r\n // history.push(\"/reports\"); \r\n // }else{\r\n dispatch(saveSelectedMenuItem(''));\r\n history.push(\"/regional\");\r\n dispatch(getRegionalSiteData());\r\n //}\r\n break;\r\n }\r\n case 'upload': {\r\n if(RoleBasedView?.[0]?.['File Upload']?.[0]?.Read === 0){\r\n\r\n }\r\n else{\r\n dispatch(saveSelectedMenuItem('upload'));\r\n history.push('/upload')\r\n }\r\n break;\r\n }\r\n case 'account': {\r\n dispatch(saveSelectedMenuItem('account'));\r\n history.push('/applications')\r\n break;\r\n }\r\n case 'onboard': {\r\n if(RoleBasedView?.[0]?.AccountOnboard?.[0]?.ReadWrite === 0){\r\n\r\n }\r\n else{\r\n dispatch(saveSelectedMenuItem('onboard'));\r\n history.push('/onboard')\r\n }\r\n break;\r\n }\r\n case 'request': {\r\n dispatch(saveSelectedMenuItem('request'));\r\n if(roleSelected !== 'Admin'){\r\n history.push('/request')\r\n }\r\n else{\r\n history.push('/adminrequest')\r\n }\r\n break;\r\n }\r\n case 'admin': {\r\n dispatch(saveSelectedMenuItem('admin'));\r\n if(roleSelected !== 'Admin'){\r\n history.push('/admin')\r\n }\r\n else{\r\n history.push('/adminviewlanding')\r\n }\r\n break;\r\n }\r\n \r\n default: { }\r\n }\r\n setActiveMenu(activClasses);\r\n };\r\n\r\n const showTooltip = (bool, index) => {\r\n activTooltip = activeMenu.map((element) => (element = false));\r\n activTooltip = [\r\n ...activTooltip.slice(0, index),\r\n (activTooltip[index] = bool),\r\n activTooltip.slice(index + 1),\r\n ].flat();\r\n setTltpMenu(activTooltip);\r\n };\r\n\r\n const setActBtn = (bool) => {\r\n setActvBtn(bool);\r\n };\r\n\r\n const setPnlWidth = (bool) => {\r\n if (bool) setPnlWdth(bool);\r\n };\r\n\r\n useEffect(() => {\r\n if (tltpMenu && tltpMenu.length > 0) {\r\n setHoverEffect(tltpMenu);\r\n }\r\n }, [tltpMenu]);\r\n\r\n // useEffect(() => {\r\n // /**\r\n // * Alert if clicked on outside of element\r\n // */\r\n // const handleClickOutside = (event) => {\r\n // if (ref.current && !ref.current.contains(event.target)) {\r\n // setPnlWidth(false);\r\n // }\r\n // }\r\n\r\n // // Bind the event listener\r\n // document.addEventListener(\"mousedown\", handleClickOutside);\r\n // return () => {\r\n // // Unbind the event listener on clean up\r\n // document.removeEventListener(\"mousedown\", handleClickOutside);\r\n // };\r\n // }, [ref]);\r\n\r\n return (\r\n \r\n
{\r\n setOpen(!isOpen);\r\n }}\r\n className={\r\n (`hamburger-button ${isOpen ? \"open\" : \"close\"}`,\r\n actvBtn ? \"hamburger-hover-button\" : \"hamburger-button\")\r\n }\r\n onMouseOver={() => setActBtn(true)}\r\n onMouseLeave={() => setActBtn(false)}\r\n />\r\n {/* className={`panel ${isOpen ? \"open\" : \"close\"}`} */}\r\n \r\n \r\n addActiveClass(0, 'home')}\r\n style={{ position: \"relative\" }}\r\n onMouseOver={() => { showTooltip(true, 0) }}\r\n onMouseLeave={() => { showTooltip(false, 0) }}\r\n >\r\n {isOpen ? (\r\n \r\n Home \r\n \r\n ) : null}\r\n \r\n \r\n Home\r\n \r\n ) : null}\r\n \r\n addActiveClass(1, 'reports')}\r\n onMouseOver={() => { showTooltip(true, 1) }}\r\n onMouseLeave={() => { showTooltip(false, 1) }}\r\n >\r\n {isOpen ? (\r\n \r\n Reports \r\n \r\n ) : null}\r\n \r\n \r\n Reports\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n addActiveClass(2, 'upload')}\r\n onMouseOver={() => showTooltip(true, 2)}\r\n onMouseLeave={() => showTooltip(false, 2)}\r\n >\r\n {isOpen ? (\r\n \r\n Uploads \r\n \r\n ) : null}\r\n \r\n \r\n Uploads\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n addActiveClass(3, 'account')}\r\n onMouseOver={() => showTooltip(true, 3)}\r\n onMouseLeave={() => showTooltip(false, 3)}\r\n >\r\n {isOpen ? (\r\n \r\n Applications \r\n \r\n ) : null}\r\n \r\n \r\n Applications\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n addActiveClass(4, 'onboard')}\r\n onMouseOver={() => showTooltip(true, 4)}\r\n onMouseLeave={() => showTooltip(false, 4)}\r\n >\r\n {isOpen ? (\r\n \r\n Onboard \r\n \r\n ) : null}\r\n \r\n \r\n Onboard\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n addActiveClass(5, 'request')}\r\n onMouseOver={() => showTooltip(true, 5)}\r\n onMouseLeave={() => showTooltip(false, 5)}\r\n >\r\n {isOpen ? (\r\n \r\n Request / Incident \r\n \r\n ) : null}\r\n \r\n \r\n Requests\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n addActiveClass(6, 'admin')}\r\n onMouseOver={() => showTooltip(true, 6)}\r\n onMouseLeave={() => showTooltip(false, 6)}\r\n >\r\n {isOpen ? (\r\n \r\n Administration \r\n \r\n ) : null}\r\n \r\n \r\n Administration\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nconst MnApp = (props) => {\r\n const wrapperRef = useRef(null);\r\n Panel(wrapperRef);\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default MnApp;\r\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAbCAYAAABr/T8RAAAACXBIWXMAAAsTAAALEwEAmpwYAAABcklEQVRIicXW/1HCMBTA8W85/qdsoHf8L04g3UAmAEZwAmEC3QCdAJxA2KBuIBNYJ9A/8t5d+0xpEwu8u1xJSPIhP5qQzEZrIiIFNsAnsIjpoB+JvgMJcCtlwXgdXAADkx8adAJcAbsYvFdTPgAyATIBLVoAuXyeAkFrFjLVFtVQfCf5ViOvG7EvymgqP2Rj8NYjb4JT4An48KBD4LoEBeHHYAV8I9WyCW5nB+PH4HUDWkiKwn1wKs9DA6oRhVtYAd+a+tBovAz7gDZoFK7wf9FgvNchGoT3gLGkZQdoE/4MzIFxH3fUvUqFAndgKApw5+n4gLsSx1Qvk3LoBt1J33vgEXek5knpPn4BZlR39FIq29hLnZ8aFGAl7VPgS8oW4lR29VyeW6rTu8fNgKaVATLzfSJtNLSvB0UtfOrIy5lzwpWI+etj44a/a1234TqD33Dv5tSUf2Omtmv4Prbhxdb4YnAyG62PHQIniz7uADh7/AKzQn6NvGK2qwAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAbCAYAAABr/T8RAAAABHNCSVQICAgIfAhkiAAAAeFJREFUSEvVlcFxwjAQRW0O9jHQAR0k6cCpIOMKMhwxl7gCSAXmAhyhA0gFQAWBDkgF8dFccP56tIxQZLBkT2bwCWTvPu3X/pXrWDxJkrR931/meX4YDAY9ixSOaxpEUM/z1i4exHYBX9rAteDpdJoi6QNvCslTJO/I0OPxGGADXfA3NvAycI6EL/1+fzObzQIkXgPU4UoJGscxbc6ZTCZPNvDKYMB3JK8MZUVs4JXBgOwZys2FtTSKotCm8qvgLMt2qrxKczlQ4ouby6TyUjCqCJF0KMurNhdVCltRcxnDS8HUyYB+y/LqmkvIbgz/AxaJftQz1UG5uWzgF2BVSrKMbk03dEzhZ3AdqE3lBbgJqCncbRJqAnd5JJJ9MAxWVc/01uVScuYjOGUIxzwXUuNSWODPa6vVCk+nU8LeFT59VCFkM8zxgxgY58tE/g423Ms+x+8t4ubg9DBwFufmIjhevsk2QuJih5rqtlAnQExeVjkAHwCMJHvSlCugFHNhJ0rEAWL+EjggCAPEZoo1+p5vMXkDWKeBsiGwUJQ2GCNmzN/9G1jd4P2CIek7qtnJUmONJP2UpW60Ypz3CgnbJQ02JnvyGTcKvuVlfq9rwlpnfJ/ga0OgakU23xWz2iawbswvA4a/78VIsXIAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAcCAYAAACdz7SqAAAABHNCSVQICAgIfAhkiAAAAiFJREFUSEvtltFx2kAQhv9VXAAlyAPvcQdRCU4Bxjo3EDqwU0FwA5aQCwgdoHRgvyMP7oACQJtdYTE6+ZCieG4mD7kXBt1pP3b/f/cgeFjTyUNOoC+u0Ax8Jw9MXI2TmAjhMTZzSETX+t0btJlIHCYX/AkrJn49PKell0xraBMY7Cgqz3gpUCn9gDWdJHfBDst0Y576XmsD5Z2taj0IOh0/pLUuJcM8FiY9BVZNA+AHg38Fe4oVqGcHQWugwggcKZxLzLIXc98GV0BCwsyLrLiJm/t/BJUSjfgMKzCfSwvEaWFEE/nF42Qu7vwmVkwXhTF14C6gntGSy8f2pKYWcE9RW8caIEFy2uHrPkAcBFJSR4btajihAgwlw59Vhg7g0Z3j5FJ0E22JQRhpD2Zrc9dnsndQl+u6ghzOc16CZl3masawoEOBjX4cNR3aNQK1Ekfo0ebEz9LIl3WQvlK19yuHMjYBkdVSUvpVXf4K2uW6t71qbrYXM56zwsxcbdHW9noiXfSmOfXZXKcQMc+YYE0hsc6FPsvWN9FgqDY+Mz09vpi5KxuFyt0QuYMDfwXt0+yfgxLTZ+lPe/gfyn7fqelHMq11tXqwgtLcG1RhH9L0ZGswQr31vRipag3gVu9Aq+QCFd02XqGLtVyZjeXVvXWm/6FeNRU583dGAkauIVCdcwwHebpV87VmQGTdMroZT5KoBKzh3Tc4hu7LP8Q8XZv8N5Y6FOF2uxgRAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAcCAYAAACdz7SqAAAACXBIWXMAAAsTAAALEwEAmpwYAAABjUlEQVRIieWWzVHDMBBGn5kUQAeYCmwqwCVABSgVABXgVACnXGNXQFIBTgU4FQAduAM4rDSRFcme+OfEN6OD5LXeane1o2i9XjODKuA28G21mIMIFBpsFAMPZjIn1CgFPoCDWbiYCeoCf4AMaIZAc73RYOC50AJ4AT4B1WOrNHDvAs+BFkghLIES2ACPHcANsAPuXCD0F9Il4vE1cA9stQMN8IaEcOkBlvij8QQ0XVAbmAG183OtAbF2SAGvHUDMHiFoDLwHgEYFcuIC+NJOrpBi65QvpylSLJGG+4BGW+1UhIS5F+iDpgTKvEO1dq7Q8wr4DYwc2uFVSE4OBKquQ65tSbsrgRwGG6oIV53C6puODkhRufqm3XtbWvQAQUJ3w2luUySXZ2uB5O4ZuXch1drOVjUEaKBq6M9joGOUYBWItVbNCY04zWtvnsdCawbk2r2nvqsRI81iMtkdKebY0twxqXzhzZx57lkbpbnfSP8c6supe9ljjq8IW0nAPgGuCL/wW9AqYLOfcL0C+AOi1V97SFPWOAAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAZCAYAAAAv3j5gAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAt0lEQVRIie3V0Q2CMBSF4V/TQXxwADcAN9AJ0MlkFNyAEdykPgjJtVY4F6IxhvNEQ2+/9JLSVbW94EwNRODsKQoTkMqMZWw9AzkBcjtUKEXcmAJZxLaqf5awMShF6uSdjA1BQ4gbewcpiAvLQRvgICI57Nit8ZTcOboBJbATEYsBtN0ao1A/uXUgKfYSz4GdlQX6fSgADY/7ZS/WXJ1GA8QAFM7C0jm/gH/8Rgs0OfanGj8JfW1Hd/+9JxyxrS8zAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAcCAYAAAAAwr0iAAAABHNCSVQICAgIfAhkiAAABDNJREFUSEulV0tS20AQ7Za9yC5OLoArZh/nBIgT2BwgYFHZxzlBtM/GXAAJc4DYJ8A5QcQeU+YEIctUWeq8bn0iy7IMZKqoQppRf997PWb6jzXqBp2kJQNm7sNMn4S6xPgrL6EV3q3wKhKRyIl5Hq68x/wIv8Q/HPelRV9heKjfC8kPEo7w/CgJPbYcivR9nFCfHergQIdY+kx8ZP6EQo7pAoFEzw5g1AuGwvRdnYpw2IppVs6oKSGtWNyiIbOMNBgWOnl2AKe9SyvndHlu2b90wc4MQbx/dgBnhwGSp9nV0jt5qXP9zgJgHrwsgNSzgmpSBdW+FmSgHRtosZ4dwOlh4DtEi0TQR+azzOHCAiIydKNE+gzj7GZOOplDe0bgV0K8cJiCnQEYxdoC1HIfYOnah0YniaZ353N91jPUIjchchXlSkMEdVCuApw9pDSEQwE7YlooaD/2glFtAGpU2qAYkZYppdi/1VHgpO/Jd9ZGpYLTZce7/k8To8/I3NdKbFQg4/eN5poQj+sollPJIZkgKwGfj5XPeUWqAanNuC2vtR2oZN+0Q+Q3qhnh64MigILfiArAGu/LLFPBieJA+ZwwRIescvVLnQI70I5FK6GQ2tTH840FAGNdKNtPlHsOfo+eUsr8DOgUIruB/FkfOa/ab+u+De+8Rfm9+WubmP22AE4PL/VAB+AyalRXtk/Yd3fsQ1L519Wdd9zQ+y4oeGTMYMqTXLD1vU0/EclxNVI19vFdMAZarbQi5E/vvYuqk9Fh4Fo51/Qhdsh1HBpUzhSBFxIOZtg3p70AYJIhSt+tGk6di6+A0T0FUSLsX997+GZzpRLNMwS5YkcymWYrfTGg1hTl2FLbmAljtvJikk2XntGuvKqlb2qFJQIt2NWm3G4G9s94do2Gqu1JQl/qsirKzxifa7rK6VaPg8BXFgAHrC2J0bAmJSTmlZ63AJRG4dKb7TIMWyq7B1CfVcZ7lHtz5TRWHCim8t1CCVFllfAtJbTeMYfTO8+vC6AoHcAKFCNIntW3K/A10Dosle1uKWGKAVrV8T8FKFHusBkDl6Fex6oY2KuEeZ8x399sIzuYoE8D9MgACumcgDoQq23AnvUuH5UhQLarc36rmlUlxBDTm5XqAFRQojp6ZRNRby52l1MOO2seVmVaRzQLKBXb5bQDmdXxW6wnKKEawIQqDZYmOlZ6qhfUG2Rz0YQjTTRTwqEOJCRzq8nks0Bn/wKZClCs021jxGof1WmVhtnovoEx5kS+keN82gFkt8SKOS4js+ulF1pbSyhPg9ARyaBlZYBs0U7lVzBQWB6QiTroYs7rqNWRm7VgUwnrbFbvA/pDI8xAhNEpIUbzbWneKxXfY38Eh6pkc+yP9o3uJnrXXslUyXDnG2MTk4tfbxjI0OwwT/ZVqclxvrf3UqrBNCH6KU6azvwF0KSO8iMrEkgAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAcCAYAAAAAwr0iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAC+UlEQVRIiaWXz3XaQBDGf/hxjzqwOrBcAXIFxhVEqcByBcYVWL5wBVdgqMCiAuRzDoEKgitIDvPt22XREoLnvX3aXc3/+WYQg+l0yhcoA26BQivXCmmj1WktgZ17OTzTcAE8AmOdV1K+kvIu4Mu0roFa93PgBejOcWAMvMnYD2BBEFFEbXTOJF8Ba+BucEYJNliE4/8VjGgBXF2cIXgJ/PmicUf5OQ6ARb8GvmNpPZUyyawx8J4FwiesthUGJnTu8Fho9SwDw0VwfsVAODvmQAaM8O0FVv+1DLQYqkuta/FdRnq2kmtltJWjFfRnIMNarNZ5Fby7BibaT6RwoXUqOf0T4DV2oADegQHpFsswDDRy8gbf91kPfwF8w7JUSPYTC2wUgnCMpXeJpXLeowzdzcWzlMxYEf3GOiRcrmQPCuxBshMgdxnIgRkGjqrHaB/tAt4Zhpc2wRvf58AzsHIOzDGwpIw7BWXPuworwQtWjhTlcrIM7LRDrC6jI8I1cKX9vQz18bzjW+02el8GezfCN8D7UN5s6U9fjdWq0/kJq2MT8bX4DG7E4+7BsNKxPytqYOsysOgxDgauLoigxXdATAvpqhPvQ5330vk6xNKfcmCB9ewzBtAywQcW2Uj7EusAx59xOAmfgEcHwk1CaSPhCotsg2Glj7/Ts8Dw4MhNwo6eSXghhiLhAKhfsSk4wE/ImArp6sTnVo5FXuMz/Yjafijv8oTSRs9aijdHnM3pz0zBPybhgsO2Cek2WJf4VMc0xv8unDIJGyAfTKfTXEonHKI3k0IHrpUM7SK+CZalAv8NGFIbnXPss+7TlaDB6tKyH+EOS51TUHJIBdZWDWkwO6MjLIAx8AFUrgsaXc4wlO8i4TqhNJPMFvjJPvpDKoP9EpuEc/DfAzt8pL+AO/bT1iWUvsl4iUW4wpcBDidhqJPQgdCJORZJq/0H+z1+hfVwKcUV/r9An6NHKf4g2WGlKLG0v2AtFNKnnLsh/fN7tgOOWtLA+7LRkP4C1KnhtQMGV3kAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAcCAYAAAAAwr0iAAAACXBIWXMAAAsTAAALEwEAmpwYAAACNElEQVRIib2W0VHjQAyGvzB5x1cBzgzvZyrAqQBTQZwKDipIqOBIBU4qIFSArwJMBbl04KuAe5B2LBbHXuIJmvEko7Wlb39LWo9mlwUDLQEWQAZUwBpYhT58NjB5DLwAP4AH4A/wCCxDA4wHAtwB/4DU+GpEkSCIoQokwNbzlWbt5AAA0QF//R0AFXDt+VL9/fsdAI9IIT4BN8i7XyAFGWRDijAHfun/TC9nM+Adace6K8ixClRAgXTAHJgirXgF3CLteA/s6CnGYxTIgZ+aaNsCVqk/0v9LPqozGCBGdugn961GpuLCe/bGwD0fA1ASWOE0MwFEOTf398AFUIYCxEi7xcaXILvoAyiR1iyADTI9a2SEj/oAYn0wbVlbavA53YqkwG9k17n6cvVfdXVBArwilT1HqnxkrikwQSr93bt2yLsvaA6rTONGCrQBKqtAhPT1iuaU2ytp3QJYKmTGx1fjYi31+TlSjM4K3cAdNF0QaUIbsCu5s9oLbu0aePPWc40/dXHHJrmTdQucI9J3JU/5fA44i5HN2JGcINKvMN0xpnlHiSZM9YYnS3ogybQD0A6qVOM9o9JbgDdkdmeIXJWBeOmAWHNYfms5TQvm/uKZOjd6k7vBQUwUIgpI9OXk0BShW3STas1nJW6RMyAJTJ4gqq7wZG8DCIHYBSZ2tqf9wDoI0Afxiky8yRdBOq1tFLdBuA+P4C+dIQA+xAxRwJ9oJwWwELNTJYf+T7IcGVInSQ7wH1HVj0GVexzfAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAeCAYAAADQBxWhAAAACXBIWXMAAAsTAAALEwEAmpwYAAABv0lEQVRIic3WP24TQRTH8U8sU7M3wEhIiIrNDZYTxOno8AkgKaiTnCChR4qPYCR6QpOW5QQsBQ1NTIeEEBQzq2wcz/rPxlZ+0tPs7PPsd968NzPeefXkPMMpRjavMQ778SHHPqYbBGY4w7iPPZxgskFgrRxHvS2AbuleQV/ib0e7TEH7ifcf8XTVCGb0e1XoI6Gau+gHzleBPsSzjtAHKUcKeqklJ121qHrf4k+LvV4Hmoq01nt8aPH/3AT0KtqdahE0x3NU+LwN6BhDlBjgmzu6FHr4LkTT1IEQ5QBFfN7BcUdejq894R59gX/RCiHCseuophG4F/tF4/ezE8nwpeFvWoGDPi7iDGqr4uC6bWrQ8J24ffFn+ITH0d9UGa2qc1pFmzT6Qzfv2Nx1MVVChEUCWETAXKUK6TgOOhJWohDynDqPlwaSPpGqOHgX74Sc78cJdALSvmVKYYkX6Q1+LQtMQTNhCxWxPxVyOe+DQ2HZJ8sCZ6GZkMORMPMqAjOhEq9w6GZxTa2xd5vQi9imcjcS9u7ZOqB50ELYgwPpY24c29Ou0Gb1li3AWpWw3J10r/6CbgVaCqW/SKVwUHTSf46IfgagRCsNAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAeCAYAAADQBxWhAAAABHNCSVQICAgIfAhkiAAAAoRJREFUSEvtlj1v2kAYx2MGYKhUMlTq6Mwdwpwl9BuQrSMrICFQ1RmyZDWqeBnD0p1vABk7lQ9QqQzt0qXJFkBAf3/rbFmuTa6xmFpLJ9uP757fPa9nx/O8Uj6f9xzHqZ0c+drv95P1et1xhsPhFFYZaJtxfywuwBKjj/6FMxqNeN5fN5vN3rGAgV4M7GFY9x+Hjsfjd7vd7lNGd38mZBdRHQfdy8cXTH6dBbrdbh9brdZ3a+hgMHiTy+WuskBZ+6PRaNxaQ7H0gixrZoR+Bdq1hmaEpS63Khlq+AM1fJOmhRC8r9frH203aQs9JYtfpSndbDY/O52OdRezgtpaYDvPCsok9eRzlC5Jijtb5WnznoQSzwmLq2rQxNUF/m21Wl39jTvj8BDKwxKFX7AkrEuAbRbUgFQE0fFXKBSmwBd0GX171qUTDZbr0PIqKNPx9lKaEL7lvcfjlI3oKPIvM+8W2Zl5nkkeP6HM+TxDTzlhZw/Iq45R6LK4rEEZTHTYIu8D0Gai0BkybdQlq2vyBmMSHIsR4Jk5O0MusIUGJbb0ofHLxPMEgJT6l3F5FVklIpujfC5oDFhBtkjSLVkiVJYofuzMk1LuFSxrqx+z03kcyi9In18euVQWHgSmQvVB5cJNJ73L/Z57Lwo01stSWXRpCzwITXNNVI7LZfUl48HGwmDtH+415XEul2oSblWbu0uKkYmjSmh6KIZxA0KogXXZcU07B7rkWW4t8S5X/2J0ohlt442kOSEUV/nZpl/ReOxMjGt866sUsv45BnXqNwg6kHuozZFc8oIH9PS5VoaJZDpML1qDSUqDTqQG8R9q4wHfTSb13afSXvOKxWI5KdFsYMGc3xAn/773i9lSAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAaCAYAAADWm14/AAAACXBIWXMAAAsTAAALEwEAmpwYAAACu0lEQVRIia2W0ZHaQAyGP254j6+Cc2buPU4FZyo4qACuAujgnAriVGCnAnwVYCrAVHBOBTEVkAdpZ8ViuIOgmR1saaX/t6TVMpg+FtxISmBq3t+A8UdOd7dCB2JgC4yA30D0GadrCeTAJgCJgQaogQr4ZmwRsNJ1QOwaAiUwB+6Bd33eAA9Aq3taBdqofQV813VA4lICGVLnFyBB6pwDO9Vluq9BSrFV+wBIdX0Fli7g8EICrXnugJkCND17a12Z7u2U9F6JXUWg1CCFkqlPgFtp9TdC0r8FFs54TQ/k+htf6BfpKq2yj0AE/ETYLpEvtrIA/oSBkPqukBRvkPJYaZHjOT9HIFLnCbBGOn2jwUHqOUeOmZVYye6Mb8HxIKrwfbAHVmEPzJCOTZCmcU6Zkijpr/sMyYoDrPRjFgHZCjkdzmcaEkiRVHVGVyFfg9pajsUSdtLSP4prg3WzUVwjky/R9wh4NmAY/SvSK9M+Ao0GioxujDm3JyRHSuDG7QYZOItg3wwp5xppyNEguA1jJbFH6p0iXzXhuPH6ZKExOiXVBfZW44+dIuyBVkEzDba+ABz8jOiTFLkvSqu0JYiAJ+CLEnDzOwQf44/RRysxfjVyd7xavctAwvFV+RKyVXuB1C+0Wcnw5XTxG6QHGsW6twQqJN0zfP0K3eyCoKA7pDzdCfAEyaQ97wXyQSBlcM8M8bVJTdAF/vIY4RvnWd9PgaPk3/BHsMRnDoLMDvH1aINAMwVeIn8kYuAXx2c79Ek4vj9yE7+yhqGyWxtdhsyCCZKVGp+J7gx4hFxiFsxK1aPjrodtpWC5Ao6RofKXww7P8fV+UvAd/l/Rp8RloDa6BukB14SlAsVmjyOXK7iTEReK6wFLIEaaslESD4FPhJToHT96nbhsWPlxjsBg+likCtapLg2C/q8Mzhn/Aa3vyDAl5CsUAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAaCAYAAADWm14/AAAABHNCSVQICAgIfAhkiAAAA3RJREFUSEutVstx4lAQRByAm3EEiyMAIkBEYIjA7BE4ABFYGwH4ABzNRrA4AkME4AhsZ8DegANst2pGNRKShbasKpWk9+bTr+cnJ/dN12w2W8DUg5o7n88v/X6/lWbeSRO4dh8AVpAtO44zhPMO3iu9Xs9N0/8vANPpdALDjePx2ByNRjs6wdoHnK/gtAMwLYB4BgO33BuPx+VisfiH74fDoa06/M4MQKmGg0/o3+D2cHfgvIa1X3DqAUwN3xt8b7HH0HD/jg6x9m6BZwIAwx4MPcLITxhZ4lRkgnFfY20B53TmX/P53JVQcP9N3nNkCd8bMNXMzAAA8CTPBKDOeFq886SxF4BU9vv9jrRTFkKvuH9DZ5gZABUYf4AY4G52u12e5qqLeVAoFN6h92aTM1MIhNoK42hZuAYBmYjTuwAgGfsIo6RrJ4kVUCwV0AKFFetYYk49xp7yTzYnKMsExl4V63XVDQEQ58xeri9Al4tnQ+k2SUjjfgyVldPptMH7GrJ04jJM+G6D7qXKsTzx7pejXKsQAAiwiQyR4TVT30sYKzNupBGKTKqtrWUB1oIMWfMvKdeLZkSmuK8VEgIAQ4EzNaSZD+OJ+ZKgx5IdQq9sThy8KpvfAkCYY/ybLEnJeJbbp50HXC+VSgOGiEzyjgLwsDhACO4iISCVAb1xJwKILQz/wKmZgDR+y+6IUv0wYWHejJnYXMvn8+EckFKhobNJJjoOJVMcAIk7c4jOdzjExOYJ9zkv8NhaVi7iKt2K8buH8Br3xGZykvO0dSnTV50XKh8AkBKscgNCf5Paa0wpJfqGnbq1I8l6b9d9ANqjWW5qLa7TmXb6whAleYaux1Bos9J5IfrMkRsd1QrAjw3i1pGh4ff7uBNArmb7RBSEjmLTvIIBRtnoMHM0NpzXkYxlR2Me+KWl1KcNIf4ZQW9nE41lCjtjCW8wSX1AuhnXaFhapAt/MXXM/o7QGrTgmNPztGQvVH6UkwPkogntSEdydUTKdxXfbUlMnuhs/2LiYq/5gT3OCS+tKoIqiLZRiSGd8g9nqL2BTFij2H/CNweWvy69neGqXOtcQ0BnK4s6+uejQ8hUyAQ6nBsu1hrBaTL+pCgAzvyJAhBnDxivLcYSd4hOyLJUmQcEkPgrpqCQ2H7bTbr8KrDjVasiC41fyX41Ran3D3n0kgI4AK3DAAAAAElFTkSuQmCC\"","import React from 'react';\r\nimport { Link, withRouter } from 'react-router-dom';\r\nimport { useHistory } from 'react-router-dom';\r\nimport MyprofileImg from \"../../assets/images/MyProfile_Icon.png\";\r\nimport CustomWidgets from \"../../assets/images/CustomWidgets_Icon.png\";\r\nimport Heatmap from \"../../assets/images/HeatMap.png\"\r\nimport GSD from \"../../assets/images/GSDInsight_Logo.png\"\r\nimport './styles.css'\r\n\r\nconst settinglinks = (props) => {\r\n const { closeSettings, openModal } = props;\r\n const GetLinks = () => {\r\n\r\n const history = useHistory();\r\n const redirectTo = (path) => {\r\n closeSettings();\r\n history.push(path);\r\n }\r\n\r\n const handleHeatmapUrl = () => {\r\n \r\n window.open(`${process.env.REACT_APP_BASE_URL}/nav/to/heatmap`);\r\n }\r\n const heatMapURL = 'https://gsd-insight.houston.dxccorp.net/ReportServer?%2fReports%2fGeneric%2fIISLog%2fLOGIIS&rs:Command=Render&rc:Toolbar=false&rs:embed=true';\r\n const aboutURL = 'https://github.dxc.com/pages/MWSGSD/GSD-Insight/'\r\n // switch (props.location.pathname) {\r\n // case '/welcome':\r\n // case '/welcome/profile':\r\n // case '/welcome/filter':\r\n return (\r\n \r\n
{\r\n redirectTo(\"/welcome/profile\");\r\n }} >
My Profile \r\n
redirectTo('/welcome/filter')}>
Custom Widgets \r\n
handleHeatmapUrl()}>
Heat Map \r\n
\r\n
About \r\n
\r\n
\r\n //
My Profile \r\n //
Custom Widgets \r\n //
window.open(heatMapURL, '_blank')}>
Heat Map \r\n //
\r\n //
About \r\n //
\r\n //
\r\n {/* {Error ?
{Error}
: ''} */}\r\n
\r\n {props.isMenu ? (\r\n \r\n
\r\n
\r\n
\r\n Hi, {userInfo.name} \r\n Time zone: {userInfo.timezone} ({d.substring(25, index)}) \r\n
\r\n
\r\n
\r\n
\r\n {/*
\r\n
*/}\r\n
\r\n
\r\n
{\r\n // setOpenSettings(!openSettings);\r\n dispatch(toggleSettingsModal(!showSettingsModal))\r\n //event.preventDefault()\r\n }} src={settingsImage} alt=\"set\"\r\n className=\"settings-icon\" />\r\n {showSettingsModal && (\r\n
dispatch(toggleSettingsModal(false))}\r\n openModal={() => {\r\n setShowModal(true);\r\n dispatch(toggleSettingsModal(false));\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 {props.isMenu ? (\r\n
\r\n
\r\n ) : null}\r\n
\r\n
\r\n
history.push('/welcome')} src={gsdLogoImg} alt=\"GSD logo\" />\r\n
\r\n
\r\n
\r\n
history.push('/welcome')}>{\"GSD Insight\"}
\r\n
\r\n
\r\n {props.isInfo ? (\r\n
\r\n\r\n
\r\n\r\n ) : null}\r\n
\r\n
\r\n
\r\n {props.logo === true ? <>
\r\n
\r\n
\r\n
\r\n
\r\n
GSD Insight \r\n
\r\n
\r\n Welcome,{userInfo.name}\r\n
\r\n
:\r\n <> {\r\n props.introPage === false &&
\r\n
}\r\n }\r\n
\r\n \r\n \r\n {HeaderHandler(localPath)}\r\n
\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default AppLayout;","const reportWebVitals = onPerfEntry => {\r\n if (onPerfEntry && onPerfEntry instanceof Function) {\r\n import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\r\n getCLS(onPerfEntry);\r\n getFID(onPerfEntry);\r\n getFCP(onPerfEntry);\r\n getLCP(onPerfEntry);\r\n getTTFB(onPerfEntry);\r\n });\r\n }\r\n};\r\n\r\nexport default reportWebVitals;\r\n","import axios from \"axios\";\r\nimport ConstructURLs from \"../constants/urls\";\r\n\r\nlet requestCounter = 0;\r\n\r\nlet axInstance = axios.create({\r\n baseURL: process.env.REACT_APP_BASE_URL,\r\n withCredentials: false,\r\n crossDomain: true,\r\n});\r\n\r\naxInstance.interceptors.request.use(function (config) {\r\n requestCounter++;\r\n document.body.classList.add('loading-indicator');\r\n \r\n // You can add token handling here if needed\r\n \r\n return config;\r\n}, function (error) {\r\n console.log(\"error 1 ---->\", error.message);\r\n return Promise.reject(error);\r\n});\r\n\r\naxInstance.interceptors.response.use(\r\n function (response) {\r\n requestCounter--;\r\n if (requestCounter === 0) {\r\n document.body.classList.remove('loading-indicator');\r\n }\r\n if (response.config.headers && response.config.headers.Location) {\r\n window.localStorage.clear();\r\n window.location.href = ConstructURLs(\"LOG_OUT_URL\");\r\n }\r\n return response;\r\n },\r\n function (error) {\r\n requestCounter--;\r\n console.log(error);\r\n if (requestCounter === 0) {\r\n document.body.classList.remove('loading-indicator');\r\n }\r\n // Handle error cases here if needed\r\n return Promise.reject(error);\r\n }\r\n);\r\n\r\nexport default axInstance;\r\n","import API from \"../api\";\r\n\r\nlet token = localStorage.getItem(\"token\");\r\nexport const getUserDataService = async (requestUrl) => {\r\n return API.get(requestUrl, {\r\n headers: {\r\n Authorization: token,\r\n },\r\n })\r\n .then((resp) => resp)\r\n .catch((error) => error.response);\r\n};\r\n\r\nexport const getUserTokenService = (requestUrl) => {\r\n return API.get(requestUrl)\r\n .then((resp) => resp)\r\n .catch((error) => error.response);\r\n};\r\n\r\nexport const getRegionalDataService = (requestUrl) => {\r\n return API.get(requestUrl, {\r\n headers: {\r\n Authorization: token,\r\n }})\r\n .then((resp) => resp)\r\n .catch((error) => error.response);\r\n};\r\n\r\n","import { all, call, put, takeEvery } from \"redux-saga/effects\";\r\nimport actionTypes from \"../constants/actionTypes\";\r\nimport ConstructURLs from \"../constants/urls\";\r\nimport {\r\n getUserDataService,\r\n getUserTokenService,\r\n getRegionalDataService\r\n} from \"../services/user.service\";\r\n\r\n// function* fetchUserDetails(action) {\r\n// try {\r\n// const response = yield call(getUserDataService, ConstructURLs('GET_USER_DATA'));\r\n// console.log(\"Fetching user details API is success\");\r\n// console.log(response);\r\n// if (response.data) {\r\n// yield put({\r\n// type: actionTypes.USER_DATA,\r\n// payload: response.data,\r\n// });\r\n// }\r\n// } catch (error) {\r\n// console.log(\"Error while fetching userdetails\"); \r\n// }\r\n// }\r\n\r\n\r\n // import { Redirect, useHistory, useLocation } from \"react-router-dom\";\r\n// import { browserHistory } from 'react-router';\r\n// import {useNavigate} from 'react-router-dom';\r\n\r\n\r\n// const RedirectTo = (path) => { \r\n// const navigate = useNavigate();\r\n// navigate.push(`/${path}`);\r\n// }\r\nconsole.log('location', window.location.hash);\r\n\r\nfunction* fetchUserDetails(action) {\r\n try {\r\n const response = yield call(getUserDataService, ConstructURLs('GET_USER_DATA'));\r\n console.log(\"Fetching user details API is success\");\r\n console.log(response);\r\n if (response.data && response.data.statusCode === 200) {\r\n yield put({\r\n type: actionTypes.USER_DATA,\r\n payload: response.data,\r\n });\r\n } else if(response.data && response.data.statusCode === 500) {\r\n \r\n console.log(\"======>\", response.data.path) \r\n window.location.href = (response.data.path);\r\n // return \r\n \r\n \r\n \r\n \r\n ,\r\n document.getElementById(\"root\")\r\n);\r\n\r\n// If you want to start measuring performance in your app, pass a function\r\n// to log results (for example: reportWebVitals(console.log))\r\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\r\nreportWebVitals();\r\n"],"sourceRoot":""}