\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n );\r\n });\r\n\r\n","/*!\r\n\r\n=========================================================\r\n* Argon Dashboard React - v1.1.0\r\n=========================================================\r\n\r\n* Product Page: https://www.creative-tim.com/product/argon-dashboard-react\r\n* Copyright 2019 Creative Tim (https://www.creative-tim.com)\r\n* Licensed under MIT (https://github.com/creativetimofficial/argon-dashboard-react/blob/master/LICENSE.md)\r\n\r\n* Coded by Creative Tim\r\n\r\n=========================================================\r\n\r\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r\n\r\n*/\r\n/*eslint-disable*/\r\nimport React, { useState } from \"react\";\r\nimport { NavLink as NavLinkRRD, Link } from \"react-router-dom\";\r\n// nodejs library to set properties for components\r\n// reactstrap components\r\nimport { Collapse, Navbar, NavItem, NavLink, Nav, Container } from \"reactstrap\";\r\n\r\nimport \"./Sidebar.scss\";\r\nvar ps;\r\n\r\nconst Sidebar = (props) => {\r\n const [collapseOpen, setcollapseOpen] = useState(false);\r\n\r\n const headerLink = (icon, label, link) => {\r\n return (\r\n <>\r\n \r\n {Title}\r\n
\r\n \r\n \r\n ×\r\n \r\n
\r\n \r\n {title}\r\n
\r\n\r\n
\r\n \r\n\r\n
\r\n \r\n \r\n Cancel\r\n \r\n \r\n
\r\n \r\n \r\n );\r\n}\r\n","import React, { useState, useEffect, useRef, useContext } from \"react\";\r\nimport queryString from 'query-string'\r\nimport moment from \"moment\";\r\nimport { UncontrolledTooltip } from \"reactstrap\";\r\nimport _ from \"lodash\";\r\nimport \"./Timetable.scss\";\r\nimport DataService from \"infrastructure/Services/DataService\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport ApiService from \"infrastructure/Services/ApiService\";\r\nimport UserContext from \"context/UserContext\";\r\nimport AlertModal from \"components/Common/AlertModal\";\r\nimport StorageService from 'infrastructure/StorageService';\r\nconst cellPadding = 10;\r\nconst bookingHeight = 20;\r\nlet isMouseDown = false;\r\nexport default (props) => {\r\n const user = useContext(UserContext);\r\n const [periods, setPeriods] = useState([]);\r\n const [startHour, setStartHour] = useState(8);\r\n const [endHour, setEndHour] = useState(17);\r\n const [bookings, setBookings] = useState([]);\r\n const [days, setDays] = useState([]);\r\n const [now, setNow] = useState(new Date());\r\n const [newBooking, setNewBooking] = useState(null);\r\n const newBookingRef = React.useRef(newBooking);\r\n const [completeBooking, setCompleteBooking] = useState(null);\r\n const [showAlertModal, setShowAlertModal] = useState(false);\r\n const [cutOff, setCutoff] = useState(new moment().add(3, \"days\").set({hour:0,minute:0,second:0,millisecond:0}));\r\n\r\n const setIsMouseDown = (v) => { isMouseDown = v; }\r\n const history = useHistory();\r\n const table = useRef(null);\r\n const containerRef = useRef(null);\r\n const [terms, setTerms] = useState(null);\r\n\r\n \r\n useEffect(() => {\r\n if (completeBooking) {\r\n const search = queryString.stringify(completeBooking);\r\n history.push({ pathname: `/bookings/create`, search });\r\n }\r\n }, [completeBooking]);\r\n\r\n useEffect(() => {\r\n loadData();\r\n const timer = setInterval(() => {\r\n setNow(new Date());\r\n }, 10000);\r\n\r\n calculateCutOff();\r\n\r\n return () => clearInterval(timer);\r\n }, []);\r\n\r\n useEffect(() => {\r\n const _bookings = props.bookings || [];\r\n _bookings.forEach((booking) => {\r\n const _bookingDate = new Date(booking.date);\r\n booking.date = _bookingDate;\r\n booking.dayNumber = _bookingDate.getDay();\r\n booking.periodNumbers = [];\r\n if (!booking.colour) {\r\n booking.colour = \"#17a1eb\";\r\n }\r\n for (var i = booking.startPeriod; i <= booking.endPeriod; i++) {\r\n booking.periodNumbers.push(i);\r\n }\r\n });\r\n setBookings(_bookings);\r\n }, [props.bookings]);\r\n\r\n const calculateCutOff = async (date) => {\r\n if (!user.isAdmin){\r\n const leadTime = await DataService.leadTime();\r\n var dt = (date || new Date());\r\n dt.setHours(0,0,0,0);\r\n var newCutOff = DataService.addBusinessDays(dt, leadTime);\r\n \r\n setCutoff(newCutOff.set({hour:0,minute:0,second:0,millisecond:0}));\r\n }else\r\n setCutoff(new moment().add(-1, \"years\").set({hour:0,minute:0,second:0,millisecond:0}));\r\n };\r\n\r\n const loadData = async () => {\r\n const tempPeriods = await DataService.periods();\r\n const tempTerms = await DataService.terms();\r\n if (!user.isAdmin){\r\n await calculateCutOff();\r\n }\r\n setTerms(tempTerms);\r\n\r\n tempPeriods.forEach((period) => {\r\n period.startHour = period.startTime.substring(0, 2);\r\n period.startMinute = period.startTime.substring(3, 5);\r\n period.endHour = period.endTime.substring(0, 2);\r\n period.endMinute = period.endTime.substring(3, 5);\r\n });\r\n\r\n setPeriods(tempPeriods || []);\r\n\r\n const firstPeriod = tempPeriods.sort(\r\n (a, b) => parseFloat(a.startHour) - parseFloat(b.startHour)\r\n )[0];\r\n\r\n const _startHour = firstPeriod ? firstPeriod.startHour : 0;\r\n\r\n const lastPeriod = tempPeriods.sort(\r\n (a, b) => parseFloat(b.endHour) - parseFloat(a.endHour)\r\n )[0];\r\n const _endHour = lastPeriod ? parseInt(lastPeriod.endHour) + 1 : 1;\r\n const _days = [1, 2, 3, 4, 5, 6, 7].filter(\r\n (x) => tempPeriods.findIndex((p) => p.dayNumber == x) > -1\r\n );\r\n setStartHour(_startHour);\r\n setEndHour(_endHour);\r\n setDays(_days);\r\n };\r\n\r\n const getDayName = (dayIndex) => {\r\n const dayNames = [\"Mon\", \"Tues\", \"Weds\", \"Thurs\", \"Fri\", \"Sat\", \"Sun\"];\r\n return dayNames[dayIndex - 1];\r\n };\r\n\r\n const getHeight = (period) => {\r\n const minutes =\r\n (period.endHour - period.startHour) * 60 +\r\n (period.endMinute - period.startMinute);\r\n return minutes * 6;\r\n };\r\n\r\n const getWidth = (period) => {\r\n const minutes = getHeight(period);\r\n const divider = period.isBreak === true ? 2 : 1;\r\n\r\n const width = (minutes / divider);\r\n\r\n return props.zoomLevel > 0 ? width / props.zoomLevel : width * (0 - props.zoomLevel);\r\n };\r\n\r\n const editBooking = async (e, booking) => {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n //get booking\r\n const tempPeriods = await DataService.periods();\r\n const campuses = await DataService.labBookings.campuses();\r\n const bookingDate = new moment(booking.date).format(\"YYYY-MM-DD\");\r\n ApiService.get(`booking/lab/${bookingDate}/${booking.id}`)\r\n .then(resp => {\r\n //get periods\r\n var startPeriod = tempPeriods.find(m => m.id === resp.startPeriod);\r\n var endPeriod = tempPeriods.find(m => m.id === resp.endPeriod);\r\n var campus = campuses.find(m => m.id === resp.campusId);\r\n resp.startPeriod = startPeriod.order;\r\n resp.campus = campus.name;\r\n var startTime = startPeriod.startTime.split(':');\r\n resp.startHour = startTime[0];\r\n resp.startMinute = startTime[1];\r\n resp.startPeriodName = startPeriod.name;\r\n\r\n var endtime = endPeriod.startTime.split(':');\r\n resp.endHour = endtime[0];\r\n resp.endMinute = endtime[1];\r\n resp.endPeriod = endPeriod.order;\r\n resp.endPeriodName = endPeriod.name;\r\n resp.type = 'lab';\r\n props.onNewBooking(resp);\r\n })\r\n\r\n }\r\n\r\n const createNewBooking = (day, period, isClick) => {\r\n // let localCutOff = cutOff;\r\n // localCutOff.set({hour:0,minute:0,second:0,millisecond:0});\r\n\r\n const bookingDate = new moment(props.startDate)\r\n .add(day, \"days\")\r\n .set({hour:0,minute:0,second:0,millisecond:0});\r\n\r\n console.log(bookingDate.format('yyyy-MM-DD hh:mm:ss'))\r\n console.log(cutOff.format('yyyy-MM-DD hh:mm:ss'))\r\n\r\n \r\n const diff = bookingDate.diff(cutOff, 'days');\r\n\r\nconsole.log(diff);\r\n if (diff < 0) return;\r\n\r\n document.addEventListener(\"mouseup\", handleMouseUp);\r\n\r\n setNewBooking(() => {\r\n setIsMouseDown(true);\r\n var newState = {\r\n dayNumber: day,\r\n startPeriod: period,\r\n endPeriod: period,\r\n originalStart: period,\r\n periodNumbers: [period],\r\n colour: \"#c00\",\r\n };\r\n newBookingRef.current = newState;\r\n return newState;\r\n });\r\n };\r\n\r\n const mouseOverBooking = (e) => {\r\n e.stopPropagation();\r\n };\r\n\r\n const mouseOverPeriod = _.debounce((e, day, period) => {\r\n if (\r\n !isMouseDown ||\r\n !newBooking ||\r\n !day ||\r\n !period ||\r\n !e ||\r\n !e.target ||\r\n !e.target.hasAttribute(\"data-period\")\r\n )\r\n return;\r\n\r\n\r\n if (newBooking.dayNumber === day) {\r\n setNewBooking((prevState) => {\r\n var newState = { ...prevState };\r\n\r\n if (period >= prevState.startPeriod) {\r\n newState.endPeriod = period;\r\n } else {\r\n newState.startPeriod = period;\r\n }\r\n\r\n newState.periodNumbers = [];\r\n for (var i = newState.startPeriod; i <= newState.endPeriod; i++) {\r\n newState.periodNumbers.push(i);\r\n }\r\n newBookingRef.current = newState;\r\n return newState;\r\n });\r\n }\r\n }, 10);\r\n\r\n const handleMouseUp = () => {\r\n\r\n\r\n document.removeEventListener(\"mouseup\", handleMouseUp);\r\n setIsMouseDown(false);\r\n\r\n if (terms !== '') {\r\n setShowAlertModal(true);\r\n } else {\r\n handleBookingConfirm();\r\n }\r\n\r\n };\r\n\r\n const handleBookingCancel = () => {\r\n setShowAlertModal(false);\r\n setNewBooking(null);\r\n }\r\n\r\n const handleBookingConfirm = () => {\r\n setShowAlertModal(false);\r\n const bookingObject = {};\r\n const current = { ...newBookingRef.current };\r\n const bookingDate = new moment(props.startDate)\r\n .add(current.dayNumber, \"days\")\r\n .format(\"YYYY-MM-DD\");\r\n bookingObject.bookingDate = bookingDate;\r\n //get startPeriod\r\n const startPeriodObject = periods.find(x => x.dayNumber === current.dayNumber && x.order === current.startPeriod);\r\n const endPeriodObject = periods.find(x => x.dayNumber === current.dayNumber && x.order === current.endPeriod);\r\n bookingObject.startPeriod = startPeriodObject.id;\r\n bookingObject.endPeriod = endPeriodObject.id;\r\n bookingObject.startPeriodName = startPeriodObject.name;\r\n bookingObject.endPeriodName = endPeriodObject.name;\r\n bookingObject.type = props.type || \"lab\";\r\n if (props.onNewBooking) {\r\n props.onNewBooking(bookingObject);\r\n setNewBooking(null);\r\n }\r\n };\r\n\r\n const compare = (arr1, arr2) => {\r\n return arr1.reduce((a, c) => a + arr2.includes(c), 0);\r\n };\r\n\r\n const renderBooking = (booking) => {\r\n //get width:\r\n let width = 0;\r\n\r\n for (var i = booking.startPeriod; i <= booking.endPeriod; i++) {\r\n var bookingPeriod = periods.find(\r\n (period) => period.dayNumber === booking.dayNumber && period.order === i\r\n );\r\n if (bookingPeriod) {\r\n width += getWidth(bookingPeriod);\r\n }\r\n }\r\n\r\n width =\r\n width -\r\n cellPadding * 2 +\r\n cellPadding * Math.max(0, booking.periodNumbers.length - 1);\r\n\r\n //const foundBookings = (booking.id ? bookings.filter(b => b.dayNumber == booking.dayNumber && booking.startPeriod != b.startPeriod && (b.periodNumbers.indexOf(booking.startPeriod) > -1)).length : 0);\r\n const foundBookings = (booking.id ? bookings.filter(b => b.dayNumber == booking.dayNumber && booking.startPeriod != b.startPeriod && booking.startPeriod < b.startPeriod && compare(booking.periodNumbers, b.periodNumbers) > 0).length : 0);\r\n\r\n let offsetHeight = (Math.max(foundBookings, 0) * 220) + 0;\r\n if (booking.id && foundBookings > 0)\r\n offsetHeight += 30;\r\n\r\n let d = booking.date;\r\n if (d)\r\n d.setHours(0,0,0, 0);\r\n const bookingDateMoment = new moment(d);\r\n\r\n return (\r\n \r\n {booking.name} • {booking.room} • {booking.yearLevel} • {booking.class}
\r\n {user.isAdmin && {booking.technicianNotes || '\\u00A0'}}}}\r\n \r\n );\r\n };\r\n\r\n const renderRow = (day) => {\r\n return renderRowPeriods(day);\r\n };\r\n\r\n const renderRowHeader = (day) => {\r\n return (\r\n
\r\n \r\n {new moment(props.startDate).add(day, \"days\").format(\"dddd, LL\")}\r\n \r\n
\r\n );\r\n };\r\n\r\n const renderRowPeriods = (day) => {\r\n const periodDivs = [];\r\n periodDivs.push(renderRowHeader(day));\r\n const dayBookings = bookings.filter((booking) => booking.dayNumber === day);\r\n periods\r\n .filter((period) => period.dayNumber === day)\r\n .sort((a, b) => a.order - b.order)\r\n .forEach((period) => {\r\n const currentBookings = dayBookings.filter(\r\n (booking) => booking.startPeriodId === period.id\r\n );\r\n let offsetHeight = 0;\r\n let bookingOverlapsExistingBookings = false;\r\n\r\n if (newBooking) {\r\n for (var i = 0; i <= newBooking.periodNumbers.length - 1; i++) {\r\n const p = newBooking.periodNumbers[i];\r\n if (\r\n dayBookings.filter((b) => b.periodNumbers.includes(p)).length > 0\r\n ) {\r\n bookingOverlapsExistingBookings = true;\r\n break;\r\n }\r\n }\r\n }\r\n\r\n const overlapsPeriods =\r\n newBooking &&\r\n newBooking.dayNumber === day &&\r\n bookingOverlapsExistingBookings;\r\n\r\n offsetHeight = overlapsPeriods ? bookingHeight * 1.25 : 0;\r\n let periodStyle = { ...styles.period };\r\n\r\n if (now.getDay() === day) {\r\n const periodStartDate = new Date();\r\n periodStartDate.setHours(period.startHour);\r\n periodStartDate.setMinutes(period.startMinute);\r\n periodStartDate.setSeconds(0);\r\n\r\n const periodEndDate = new Date();\r\n periodEndDate.setHours(period.endHour);\r\n periodEndDate.setMinutes(period.endMinute);\r\n periodEndDate.setSeconds(0);\r\n // if (period.isBreak){\r\n // periodStyle = {...periodStyle, ...styles.breakPeriod};\r\n // }\r\n if (\r\n now.getDay() === day &&\r\n periodStartDate < now &&\r\n periodEndDate > now &&\r\n new moment(props.startDate).format(\"dddd, LL\") === new moment(new Date()).startOf(\"week\").format(\"dddd, LL\")\r\n ) {\r\n var difference =\r\n periodEndDate.getTime() - periodStartDate.getTime();\r\n var elapsed = periodEndDate.getTime() - now.getTime();\r\n var percentage = 100 - (elapsed * 100) / difference;\r\n periodStyle = {\r\n ...periodStyle,\r\n ...styles.now,\r\n backgroundPosition: `${percentage.toFixed(0)}%`,\r\n };\r\n }\r\n }\r\n periodDivs.push(\r\n \r\n
\r\n {getDayName(day)}
\r\n {period.startTime} - {period.endTime}\r\n \r\n \r\n
\r\n {newBooking &&\r\n newBooking.dayNumber === day &&\r\n newBooking.startPeriod === period.order &&\r\n renderBooking(newBooking)}\r\n
\r\n | \r\n | \r\nDate | \r\nTime | \r\nYear | \r\nRoom | \r\nStaff | \r\nPractical Name | \r\n {user.isAdmin &&Technician Notes | }\r\n\r\n |
|---|---|---|---|---|---|---|---|---|
| \r\n \r\n | \r\n\r\n | \r\n \r\n {periodString} \r\n {bookingTime}\r\n | \r\n {booking.yearLevel} | \r\n{booking.room} | \r\n{booking.name} | \r\n{booking.practicalName} | \r\n {user.isAdmin &&{booking.technicianNotes} | }\r\n\r\n | \r\n
\r\n})","\r\nimport Loader from \"components/Common/Loader\";\r\nimport UserContext from \"context/UserContext\";\r\nimport ApiService from \"infrastructure/Services/ApiService\";\r\nimport React, { useContext, useEffect } from \"react\";\r\nimport { useHistory } from \"react-router-dom\";\r\n\r\n\r\n\r\nexport default ({ location, onCancel }) => {\r\n \r\n const userContext = useContext(UserContext);\r\nconst history = useHistory();\r\n useEffect(() => {\r\n const code = (location.search.match(/code=([^&]+)/) || [])[1];\r\n const state = (location.search.match(/state=([^&]+)/) || [])[1];\r\n const data = {code, state};\r\n\r\n ApiService.post(\"auth/oauth_token\", data, () => {\r\n onCancel(`Your login attempt was unsuccessful. Please try again.`)\r\n })\r\n .then(json => {\r\n userContext.login(json);\r\n history.push('/lab/bookings');\r\n });\r\n }, []);\r\n \r\n return
Dates
\r\n\r\n \r\n setOpenDatePicker(true)}\r\n >\r\n {dates.startDate.format(\"LL\")}{dates.endDate && <> - {dates.endDate.format(\"LL\")}}\r\n\r\n \r\n\r\n \r\n \r\n \r\n\r\n \r\n
\r\n {title}
\r\n \r\n| \r\n Likelyhood \r\n (likelihood of harm caused given the circumstances)\r\n | \r\n \r\n Consequences\r\n | \r\n||||
| \r\n Insignificant \r\n (no injuries)\r\n | \r\n Minor \r\n 1st aid/immediate containment\r\n | \r\n Moderate \r\n Medical treatment/ release contained with outside help\r\n | \r\n Major \r\n Extensive injuries/ off site release with no detrimental effect\r\n | \r\n Catastrophic \r\n Death / toxic release off site with detrimental effect\r\n | \r\n |
| A Almost certain | \r\n High | \r\nHigh | \r\nExtreme | \r\nExtreme | \r\nExtreme | \r\n
| B likely | \r\n Moderate | \r\nHigh | \r\nHigh | \r\nExtreme | \r\nExtreme | \r\n
| C possible | \r\n Low | \r\nModerate | \r\nHigh | \r\nExtreme | \r\nExtreme | \r\n
| D unlikely | \r\n Low | \r\nLow | \r\nModerate | \r\nHigh | \r\nExtreme | \r\n
| E rare | \r\n Low | \r\nLow | \r\nModerate | \r\nHigh | \r\nHigh | \r\n
\r\n setListValue('controlMeasures', method.name, e.target.checked)}\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 {renderHazards}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {renderControlMethods}
\r\n \r\n
\r\n \r\n
\r\n
\r\n );\r\n};\r\n","import React, { useEffect, useState, useContext } from \"react\";\r\nimport moment from \"moment\";\r\nimport FormColumn from \"../../../../components/Common/FormColumn\";\r\nimport FormStepHeader from \"../../../../components/Common/FormStepHeader\";\r\nimport Select from \"react-select\";\r\nimport Creatable from \"react-select/creatable\";\r\nimport DataService from \"infrastructure/Services/DataService\";\r\nimport Datetime from 'react-datetime';\r\nimport UserContext from \"context/UserContext\";\r\nimport {\r\n Col,\r\n Row,\r\n Input\r\n} from \"reactstrap\";\r\nimport ApiService from \"infrastructure/Services/ApiService\";\r\nexport default ({ booking, onUpdateValues, currentStep, index }) => {\r\n const user = useContext(UserContext);\r\n const [quantities, setQuantities] = useState([]);\r\n const [cutOff, setCutoff] = useState(new moment().add(3, \"days\"));\r\n const [data, setData] = useState(null);\r\n const [periodData, setPeriodData] = useState();\r\n const [periods, setPeriods] = useState();\r\n const [isNewPractical, setIsNewPractical] = useState(false);\r\n const [savedBookings, setSavedBookings] = useState(null);\r\n const [users, setUsers] = useState(null);\r\n useEffect(() => {\r\n const newQuantities = [];\r\n for (var i = 1; i <= 100; i++) {\r\n newQuantities.push({ value: i, label: i });\r\n }\r\n\r\n setQuantities(newQuantities);\r\n getData();\r\n\r\n if (booking && booking.id) {\r\n booking.newBookingDate = booking.bookingDate;\r\n }\r\n\r\n if (user.isAdmin){\r\n ApiService.get('users')\r\n .then(resp => {\r\n setUsers(resp.items);\r\n })\r\n }\r\n }, []);\r\n\r\n useEffect(() => {\r\n\r\n }, [booking]);\r\n\r\n const calculateCutOff = async (date) => {\r\n if (!user.isAdmin){\r\n const leadTime = await DataService.leadTime();\r\n var newCutOff = DataService.addBusinessDays(date || new Date(), leadTime);\r\n return newCutOff;\r\n }\r\n return new moment().add(-1, \"years\");\r\n };\r\n\r\n const getData = async () => {\r\n const campusData = await DataService.labBookings.campuses();\r\n\r\n //const leadTime = await DataService.leadTime();\r\n var newCutOff = await calculateCutOff();\r\n setCutoff(newCutOff);\r\n\r\n const newData = { campuses: campusData };\r\n if (campusData.length === 1)\r\n onUpdateValues({ campusId: campusData[0].id, campusName: campusData[0].name });\r\n setData(newData);\r\n\r\n const p = await DataService.periods();\r\n setPeriodData(p);\r\n bindPeriods(p);\r\n\r\n\r\n ApiService.get(`savedbookings/lab/`)\r\n .then(resp => {\r\n setSavedBookings(resp.items);\r\n })\r\n };\r\n\r\n const setSavedPractical = (id) => {\r\n if (!id) {\r\n onUpdateValue(\"attachments\", null);\r\n onUpdateValue(\"risks\", null);\r\n onUpdateValue(\"notes\", null);\r\n onUpdateValue('practicalId', null);\r\n onUpdateValue(\"technicianAssistanceRequired\", null);\r\n return;\r\n }\r\n\r\n var savedPractical = savedBookings.find(x => x.id === id);\r\n if (!savedPractical) {\r\n onUpdateValue(\"attachments\", null);\r\n onUpdateValue(\"risks\", null);\r\n onUpdateValue(\"notes\", null);\r\n onUpdateValue('practicalId', null);\r\n onUpdateValue(\"technicianAssistanceRequired\", null);\r\n return;\r\n }\r\n\r\n ApiService.get(`savedbooking/lab/${id}`, { personalStore: savedPractical.isUser }).then(resp => {\r\n onUpdateValue(\"attachments\", resp.attachments);\r\n onUpdateValue(\"risks\", resp.risks);\r\n onUpdateValue(\"notes\", resp.notes);\r\n onUpdateValue('practicalId', id);\r\n onUpdateValue('bookReference', resp.bookReference);\r\n onUpdateValue(\"technicianAssistanceRequired\", resp.technicianAssistanceRequired);\r\n })\r\n }\r\n\r\n const bindPeriods = (pd) => {\r\n const dayPeriods = (pd) && (pd).filter(x => x.dayNumber == new Date(booking.newBookingDate).getDay()).map((x) => {\r\n return { value: x.order, label: x.name };\r\n });\r\n\r\n setPeriods(dayPeriods);\r\n }\r\n\r\n const onUpdateValue = (prop, value) => {\r\n const args = {};\r\n args[prop] = value;\r\n\r\n onUpdateValues(args)\r\n }\r\n\r\n const rooms = (data && data.campuses.find(x => x.id === booking.campusId)?.rooms || []).map((x) => {\r\n return { value: x, label: x };\r\n });\r\n\r\n const campuses = data && data.campuses.map((x) => {\r\n return { value: x.id, label: x.name };\r\n });\r\n\r\n const yearLevels = (data && data.campuses.find(x => x.id === booking.campusId)?.yearLevels || []).map((x) => {\r\n return { value: x, label: x };\r\n })\r\n\r\n const classes = (data && data.campuses.find(x => x.id === booking.campusId)?.classes || []).filter(x => x.yearLevel === booking.yearLevel).map((x) => {\r\n return { value: x.name, label: x.name };\r\n })\r\n\r\n const usersValue = (users || []).map((x) => {\r\n return { value: x.id, label: x.name };\r\n })\r\n\r\n const practicals = savedBookings && savedBookings.filter(x => x.yearLevel === booking.yearLevel).map((x) => {\r\n return { value: x.id, label: `${x.name} (${x.year} - ${x.userName})` };\r\n });\r\n\r\n let className = `step`;\r\n\r\n if (currentStep < index) {\r\n className += ` next`;\r\n } else if (currentStep > index) {\r\n className += ` prev`;\r\n } else {\r\n className += ` current`;\r\n }\r\n\r\n var valid = function (current) {\r\n if (user.isAdmin) return true;\r\n \r\n return current.isAfter(cutOff);\r\n };\r\n\r\n return (\r\n {`${toTitleCase(riskTemplate.name)} Risks`}
\r\n\r\n \r\n
\r\n \r\n
\r\n
\r\n );\r\n};\r\n\r\n","import React, { useEffect, useState, useMemo } from \"react\";\r\nimport FormColumn from \"../../../../components/Common/FormColumn\";\r\nimport FormStepHeader from \"../../../../components/Common/FormStepHeader\";\r\nimport ApiService from \"infrastructure/Services/ApiService\";\r\nimport { useDropzone } from \"react-dropzone\";\r\nimport moment from \"moment\";\r\nimport {\r\n Table,\r\n Col,\r\n Input,\r\n Row,\r\n\r\n} from \"reactstrap\";\r\n\r\n\r\nexport default ({ booking, onUpdateValues, currentStep, index }) => {\r\n const [quantities, setQuantities] = useState([]);\r\n const [data, setData] = useState(null);\r\nuseEffect(() => {\r\n\r\n}, [booking])\r\n const {\r\n acceptedFiles,\r\n getRootProps,\r\n getInputProps,\r\n isDragActive,\r\n isDragAccept,\r\n isDragReject,\r\n } = useDropzone({\r\n onDrop: files => updateFiles(files)\r\n });\r\n\r\n\r\n const onUpdateValue = (prop, value) => {\r\n const args = {};\r\n args[prop] = value;\r\n\r\n onUpdateValues(args)\r\n }\r\n\r\n const style = useMemo(\r\n () => ({\r\n ...styles.baseStyle,\r\n ...(isDragActive ? styles.activeStyle : {}),\r\n ...(isDragAccept ? styles.acceptStyle : {}),\r\n ...(isDragReject ? styles.rejectStyle : {}),\r\n }),\r\n [isDragActive, isDragReject, isDragAccept]\r\n );\r\n\r\n\r\n const files = acceptedFiles.map((file) => (\r\n \r\n {data && (\r\n <>\r\n \r\n {\r\n const newBookingDate = e.toDate();\r\n const newBookingDay = newBookingDate.getDay();\r\n const currentBookingDay = new Date(booking.bookingDate).getDay();\r\n\r\n\r\n\r\n const currentStartPeriod = periodData.find(x => x.order == booking.startPeriod && x.dayNumber == currentBookingDay);\r\n const currentEndPeriod = periodData.find(x => x.order == booking.endPeriod && x.dayNumber == currentBookingDay);\r\n\r\n\r\n const dayPeriods = periodData.filter(x => x.dayNumber == new Date(newBookingDate).getDay()).map((x) => {\r\n return { value: x.order, label: x.name };\r\n });\r\n\r\n setPeriods(dayPeriods);\r\n\r\n let newStartPeriod = periodData.find(x => x.dayNumber == newBookingDay && x.order == currentStartPeriod.order);\r\n\r\n if (newStartPeriod == null) {\r\n newStartPeriod = periodData.filter(x => x.dayNumber == newBookingDay)[0];\r\n }\r\n\r\n let newEndPeriod = periodData.find(x => x.dayNumber == newBookingDay && x.order == currentEndPeriod.order);\r\n if (newEndPeriod == null) {\r\n newEndPeriod = newStartPeriod;\r\n }\r\n\r\n booking.startPeriod = newStartPeriod.id;\r\n booking.endPeriod = newEndPeriod.id;\r\n\r\n onUpdateValues({ newBookingDate: e.toISOString() })\r\n onUpdateValue(\"startPeriod\", newStartPeriod.order)\r\n onUpdateValue(\"startPeriodId\", newStartPeriod.id)\r\n onUpdateValue(\"endPeriod\", newEndPeriod.order)\r\n onUpdateValue(\"endPeriodId\", newEndPeriod.id)\r\n\r\n\r\n }} />}\r\n \r\n option.value === booking.startPeriod)}\r\n onChange={(element) => {\r\n onUpdateValue(\"startPeriod\", element.value)\r\n const startPeriod = periodData.find(x => x.order == element.value && x.dayNumber == new Date(booking.newBookingDate).getDay());\r\n onUpdateValue(\"startPeriodId\", startPeriod.id)\r\n if (element.value > booking.endPeriod) {\r\n onUpdateValue(\"endPeriod\", element.value)\r\n const endPeriod = periodData.find(x => x.order == element.value && x.dayNumber == new Date(booking.newBookingDate).getDay());\r\n onUpdateValue(\"endPeriodId\", endPeriod.id)\r\n }\r\n\r\n }}\r\n > x.value >= booking.startPeriod)}\r\n value={periods.filter(option => option.value === booking.endPeriod)}\r\n onChange={(element) => {\r\n onUpdateValue(\"endPeriod\", element.value);\r\n const endPeriod = periodData.find(x => x.order == element.value && x.dayNumber == new Date(booking.newBookingDate).getDay());\r\n onUpdateValue(\"endPeriodId\", endPeriod.id)\r\n }}\r\n >\r\n |
:
\r\n \r\n {data.campuses.length > 1 && (\r\n \r\n \r\n onUpdateValue(\"campusId\", element.value)\r\n }\r\n >\r\n \r\n )}\r\n\r\n \r\n option.value === booking.room)}\r\n onChange={(element) => onUpdateValue(\"room\", element.value)}\r\n >\r\n \r\n\r\n \r\n option.value === booking.yearLevel)}\r\n isDisabled={!booking.room}\r\n onChange={(element) => {\r\n onUpdateValue(\"yearLevel\", element.value)\r\n onUpdateValue(\"class\", null);\r\n }\r\n }\r\n >\r\n \r\n \r\n option.value === booking.class)}\r\n isDisabled={!booking.yearLevel}\r\n onChange={(element) =>\r\n onUpdateValue(\"class\", element.value)\r\n }\r\n >\r\n \r\n
\r\n {booking.id && user.isAdmin && <>\r\n \r\n \r\n x.value == (booking.bookingUserId || booking.userId))}\r\n onChange={(element) => {\r\n onUpdateValue(\"bookingUserId\", element.value)\r\n onUpdateValue(\"bookingUserName\", element.label)\r\n }}\r\n >\r\n \r\n
\r\n }\r\n
\r\n\r\n\r\n {booking.id ? \r\n \r\n\r\n :\r\n \r\n {\r\n setIsNewPractical(e.__isNew__);\r\n //find practical\r\n if (e.__isNew__) {\r\n onUpdateValue('practicalName', e.label);\r\n setSavedPractical(null);\r\n }\r\n else {\r\n var saved = savedBookings.find(x => x.id === e.value);\r\n onUpdateValue('practicalName', saved.name);\r\n setSavedPractical(e.value);\r\n }\r\n\r\n }}\r\n >\r\n }\r\n\r\n {booking.practicalName && !booking.practicalName.isNew && (<>\r\n \r\n { onUpdateValues({ setsRequired: e.target.value }); }} />\r\n \r\n \r\n { onUpdateValues({ bookReference: e.target.value }); }} />\r\n \r\n )}\r\n {booking.practicalName && isNewPractical && (\r\n
\r\n
\r\n\r\n
\r\n
\r\n\r\n \r\n onUpdateValues({ bookingNotes: e.target.value })} />\r\n \r\n
\r\n \r\n )}
\r\n Date
\r\n {(!booking.id) ?\r\n{new moment(booking.bookingDate).format(\"dddd, LL\")}
:\r\nTime
\r\n {booking.id && periods ?\r\n {booking.startPeriodName}\r\n {booking.endPeriodName &&\r\n booking.endPeriodName != booking.startPeriodName && (\r\n <> - {booking.endPeriodName}\r\n )}\r\n
}\r\n \r\n\r\n\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {booking.attachments &&\r\n <>\r\n \r\n \r\n
\r\n\r\n {booking.attachments.map(a => \r\n
)}\r\n \r\n } \r\n
\r\n );\r\n};\r\n\r\n\r\nconst styles = {\r\n\r\n baseStyle: {\r\n flex: 1,\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n alignItems: \"center\",\r\n padding: \"20px\",\r\n marginTop: 20,\r\n marginBottom: 20,\r\n borderWidth: 2,\r\n borderRadius: 2,\r\n borderColor: \"#eeeeee\",\r\n borderStyle: \"dashed\",\r\n backgroundColor: \"#fafafa\",\r\n color: \"#bdbdbd\",\r\n outline: \"none\",\r\n transition: \"border .24s ease-in-out\",\r\n },\r\n activeStyle: {\r\n borderColor: \"#2196f3\",\r\n },\r\n acceptStyle: {\r\n borderColor: \"#00e676\",\r\n },\r\n\r\n rejectStyle: {\r\n borderColor: \"#ff1744\"\r\n }\r\n}\r\n\r\n\r\n","import React, { useEffect, useState, useMemo } from \"react\";\r\n\r\nimport FormStepHeader from \"../../../components/Common/FormStepHeader\";\r\n\r\nimport ApiService from \"infrastructure/Services/ApiService\";\r\n\r\nimport {\r\n Table,\r\n Col,\r\n Input,\r\n Row,\r\n\r\n} from \"reactstrap\";\r\nimport Loader from \"components/Common/Loader\";\r\n\r\n\r\nexport default ({ booking, onUpdateValues, currentStep, index, onBookingSaved, error, setError }) => {\r\n const save = () => { \r\n setError(false);\r\n if (booking.id){\r\n ApiService.put(`bookings/${booking.type}/${booking.id}`, booking)\r\n .then(resp => {\r\n if (resp && resp.id && resp.id != '00000000-0000-0000-0000-000000000000'){\r\n onBookingSaved();\r\n }else{\r\n setError(true);\r\n }\r\n })\r\n } else{ \r\n ApiService.post(`bookings/${booking.type}`, booking)\r\n .then(resp => {\r\n if (resp && resp.id && resp.id != '00000000-0000-0000-0000-000000000000'){\r\n onBookingSaved();\r\n }else{\r\n setError(true);\r\n }\r\n })\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n \r\n if (currentStep === index) save(); \r\n }, [currentStep]);\r\n\r\n\r\n let className = `step`\r\n\r\n if (currentStep < index){\r\n className += ` next`;\r\n }else if (currentStep > index){ \r\n className += ` prev`;\r\n }else{\r\n className += ` current`;\r\n\r\n }\r\n\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n Drag and drop some files here, or click to select files\r\n
\r\n\r\n |
\r\n
\r\n );\r\n};\r\n\r\n","import React, { useEffect, useState, useMemo } from \"react\";\r\n\r\nimport { Col, Input, Row, Button, CarouselItem } from \"reactstrap\";\r\nimport RiskAssessmentStep from \"./RiskAssessmentStep\";\r\nimport DataService from \"infrastructure/Services/DataService\";\r\nimport Step1 from \"./Step1\";\r\nimport Step2 from \"./Step2\";\r\nimport \"../Form.scss\";\r\nimport FormColumn from \"../../../../components/Common/FormColumn\";\r\nimport Submit from \"../Submit\";\r\nimport AlertModal from \"components/Common/AlertModal\";\r\nimport ApiService from \"infrastructure/Services/ApiService\";\r\nimport moment from \"moment\";\r\nimport FormStepHeader from \"../../../../components/Common/FormStepHeader\";\r\nimport RiskMatrix from \"components/Common/RiskMatrix\";\r\n\r\nexport default ({ booking, onCloseButtonPress }) => {\r\n const [isValid, setIsValid] = useState(false);\r\n\r\n const [error, setError] = useState(false);\r\n const baseForm = { campusId: null };\r\n const [newBooking, setNewBooking] = useState({ ...booking, ...baseForm });\r\n const [step, setStep] = useState(1);\r\n const [riskTemplates, setRiskTemplates] = useState(null);\r\n const [showModal, setShowModal] = useState(false);\r\n\r\n const getData = async () => {\r\n const riskData = await DataService.labBookings.riskTemplate();\r\n const timetable = await DataService.periods();\r\n\r\n //get firstPeriod \r\n setRiskTemplates(riskData);\r\n };\r\n\r\n const copy = () => {\r\n var d = new moment(booking.bookingDate).format('yyyy-MM-DD');\r\n ApiService.post(`bookings/lab/${d}/${booking.id}/copy`)\r\n .then(() => {\r\n setShowModal(false);\r\n onCloseButtonPress(true);\r\n });\r\n }\r\n\r\n const updateValues = (args) => {\r\n setNewBooking((prevState) => {\r\n const newState = { ...prevState, ...args };\r\n return newState;\r\n });\r\n };\r\n\r\n const updateRiskValue = (item, args) => {\r\n setNewBooking((prevState) => {\r\n const newState = { ...prevState };\r\n if (!newBooking.risks) {\r\n newState.risks = [args];\r\n return newState;\r\n }\r\n\r\n const index = newState.risks.findIndex((x) => x.id === item.id);\r\n\r\n if (index > -1) {\r\n newState.risks.splice(index, 1);\r\n }\r\n newState.risks.push(args);\r\n return newState;\r\n });\r\n };\r\n\r\n const next = () => {\r\n setStep((prevState) => {\r\n return prevState + 1;\r\n });\r\n };\r\n const prev = () => {\r\n setStep((prevState) => {\r\n if (prevState === 1) return prevState;\r\n return prevState - 1;\r\n });\r\n };\r\n\r\n const deleteBooking = () => {\r\n var d = new moment(booking.bookingDate).format('yyyy-MM-DD');\r\n ApiService.delete(`booking/lab/${d}/${booking.id}`)\r\n .then(() => {\r\n setShowModal(false);\r\n onCloseButtonPress(true);\r\n });\r\n }\r\n\r\n useEffect(() => {\r\n getData();\r\n }, []);\r\n\r\n const renderRiskSteps = () => {\r\n let className = `step`;\r\n\r\n if (step < 3) {\r\n className += ` next`;\r\n } else if (step > 3) {\r\n className += ` prev`;\r\n } else {\r\n className += ` current`;\r\n }\r\n\r\n return \r\n
}\r\n There was an error saving your booking. Please check your details and try again.
\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 \r\n \r\n updateValues({ notes: e.target.value })} />\r\n \r\n
\r\n
\r\n Risk Matrix
\r\n\r\n \r\n onCloseButtonPress(true)}\r\n />\r\n
\r\n \r\n \r\n setOpenDatePicker(true)}\r\n >\r\n {dates.startDate.format(\"LL\")} -{\" \"}\r\n {dates.endDate.format(\"LL\")}\r\n \r\n \r\n \r\n \r\n \r\n setOpenDatePicker((prevstate) => !prevstate)\r\n }\r\n >\r\n \r\n \r\n \r\n \r\n
\r\n Bookings
\r\n <>\r\n \r\n\r\n \r\n
\r\n Date
\r\n{new moment(booking.bookingDate).format(\"dddd, LL\")}
\r\n \r\nTime
\r\n\r\n {booking.startPeriodName}\r\n {booking.endPeriodName &&\r\n booking.endPeriodName != booking.startPeriodName && (\r\n <> - {booking.endPeriodName}\r\n )}\r\n
\r\n \r\n{booking.userName}
\r\n{new moment(booking.createdOn).format(\"dddd, LL hh:mm:ss A\")}
\r\n{booking.campus}
\r\n{booking.room}
\r\n{booking.yearLevel}
\r\n{booking.class}
\r\n{booking.practicalName}
\r\n{booking.setsRequired}
\r\n{booking.bookReference}
\r\n{booking.technicianAssistanceRequired == true ? 'Yes' : 'No'}
\r\n{booking.bookingNotes}
\r\n\r\n
\r\n
Attachments
\r\n {booking.attachments.map(attachment => {\r\n return <>\r\n{e.preventDefault(); getAttachment(attachment.id);}}>{attachment.name}
\r\n \r\n })}\r\n \r\n\r\n
{risk.name} Risks
\r\n \r\nControl Measures
\r\n \r\nNotes
\r\n \r\n{booking.notes}
\r\n\r\n }\r\n
Administration
\r\n \r\n \r\nLead In Time
\r\n\r\n
\r\n \r\n \r\n {\r\n const v = parseInt(e.target.value);\r\n setLeadTime(v);\r\n setDirty(true);\r\n }}\r\n />\r\n
\r\n \r\n \r\n {\" \"}\r\n days\r\n \r\n
\r\n {campus.name}
\r\n \r\n }\r\nYear Levels
\r\n {campus.yearLevels.map((year, i) => (\r\n\r\n {\r\n const v = e.target.value;\r\n setNewYear(v);\r\n }}\r\n />\r\n\r\n 0)}\r\n onClick={() => {\r\n setData((prevState) => {\r\n const newState = [...prevState];\r\n newState[ci].yearLevels.push(newYear);\r\n return newState;\r\n });\r\n setNewYear(\"\");\r\n }}\r\n >\r\n Add Year Level\r\n \r\n
\r\n \r\n\r\n Classes
\r\n {campus.classes.map((cls, i) => (\r\n\r\n {\r\n const v = e.target.value;\r\n setNewClass((prevState) => {\r\n const newState = { ...prevState };\r\n newState.name = v;\r\n return newState;\r\n });\r\n }}\r\n />\r\n {\r\n const v = e.target.value;\r\n setNewClass((prevState) => {\r\n const newState = { ...prevState };\r\n newState.yearLevel = v;\r\n return newState;\r\n });\r\n }}\r\n >\r\n \r\n {campus.yearLevels.map((yl) => (\r\n \r\n ))}\r\n \r\n 0 &&\r\n newClass.yearLevel &&\r\n newClass.yearLevel.length > 0\r\n )\r\n }\r\n onClick={() => {\r\n setData((prevState) => {\r\n const newState = [...prevState];\r\n newState[ci].classes.push(newClass);\r\n return newState;\r\n });\r\n setNewClass({ name: \"\", yearLevel: \"\" });\r\n setDirty(true);\r\n }}\r\n >\r\n Add Class\r\n \r\n
\r\n \r\n Rooms
\r\n {campus.rooms.map((room, i) => (\r\n\r\n {\r\n const v = e.target.value;\r\n setNewRoom(v);\r\n }}\r\n />\r\n\r\n 0)}\r\n onClick={() => {\r\n setData((prevState) => {\r\n const newState = [...prevState];\r\n newState[ci].rooms.push(newRoom);\r\n return newState;\r\n });\r\n setDirty(true);\r\n setNewRoom(\"\");\r\n }}\r\n >\r\n Add Room\r\n \r\n
\r\n \r\n Administration > Saved Bookings
\r\n\r\n \r\n| Year Level | \r\nPracticalName | \r\nUser | \r\nYear | \r\n\r\n |
|---|---|---|---|---|
| {savedBooking.yearLevel} | \r\n{savedBooking.name} | \r\n{savedBooking.userName} | \r\n{savedBooking.year} | \r\n\r\n | \r\n
{campus.name}
\r\n \r\n\r\n }Year Levels
\r\n {campus.yearLevels.map((year, i) =>\r\n\r\n {year}\r\n {\r\n setData((prevState) => {\r\n const newState = [...prevState];\r\n newState[ci].yearLevels.splice(i, 1);\r\n return newState;\r\n\r\n })\r\n }}\r\n >\r\n
\r\n )}\r\n\r\n\r\n \r\n\r\n {\r\n const v = e.target.value;\r\n setNewYear(v)\r\n }} />\r\n\r\n \r\n
\r\n \r\n\r\n\r\n Classes
\r\n {campus.classes.map((cls, i) =>\r\n\r\n {cls.name} - {cls.yearLevel}\r\n {\r\n setData((prevState) => {\r\n const newState = [...prevState];\r\n newState[ci].classes.splice(i, 1);\r\n return newState;\r\n\r\n })\r\n }}\r\n >\r\n
\r\n )}\r\n\r\n\r\n \r\n\r\n {\r\n const v = e.target.value;\r\n setNewClass(prevState => {\r\n const newState = { ...prevState };\r\n newState.name = v\r\n return newState;\r\n })\r\n }} />\r\n \r\n \r\n
\r\n\r\n \r\n Rooms
\r\n {campus.rooms.map((room, i) =>\r\n\r\n {room}\r\n {\r\n setData((prevState) => {\r\n const newState = [...prevState];\r\n newState[ci].rooms.splice(i, 1);\r\n return newState;\r\n })\r\n }}\r\n >\r\n
\r\n )}\r\n\r\n\r\n \r\n\r\n {\r\n const v = e.target.value;\r\n setNewRoom(v)\r\n }} />\r\n\r\n \r\n
\r\n \r\n Administration > Booking Terms
\r\n \r\n \r\n- \r\n {errors.map(error =>
- {error} )}\r\n
\r\n Sign in to your account\r\n
\r\n {}\r\n\r\n \r\n \r\n {sectionName}\r\n
;\r\n }\r\n\r\n return <>{section()}\r\n};\r\n\r\nconst styles = {\r\n icon: { maxWidth: 40, float: `left`, display: `block`, float: `left` },\r\n h1: { lineHeight: 1 }\r\n};\r\n","/*!\r\n\r\n=========================================================\r\n* Argon Dashboard React - v1.1.0\r\n=========================================================\r\n\r\n* Product Page: https://www.creative-tim.com/product/argon-dashboard-react\r\n* Copyright 2019 Creative Tim (https://www.creative-tim.com)\r\n* Licensed under MIT (https://github.com/creativetimofficial/argon-dashboard-react/blob/master/LICENSE.md)\r\n\r\n* Coded by Creative Tim\r\n\r\n=========================================================\r\n\r\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r\n\r\n*/\r\nimport React from \"react\";\r\nimport { Route, Switch, Redirect } from \"react-router-dom\";\r\n// reactstrap components\r\nimport { Container } from \"reactstrap\";\r\n// core components\r\nimport AdminNavbar from \"components/Navbars/AdminNavbar.js\";\r\nimport AdminFooter from \"components/Footers/AdminFooter.js\";\r\nimport Sidebar from \"components/Sidebar/Sidebar.js\";\r\nimport Header from \"components/Headers/Header.js\";\r\nimport { ToastContainer, toast } from 'react-toastify';\r\n import 'react-toastify/dist/ReactToastify.css';\r\nimport routes from \"routes.js\";\r\nimport Title from \"components/Title/Title\";\r\n\r\nclass Layout extends React.Component {\r\n componentDidUpdate(e) {\r\n document.documentElement.scrollTop = 0;\r\n document.scrollingElement.scrollTop = 0;\r\n this.refs.mainContent.scrollTop = 0;\r\n }\r\n getRoutes = routes => {\r\n return routes.map((prop, key) => {\r\n if (prop.layout === \"/layout\") {\r\n return (\r\n {title}
\r\n\r\n\r\n \r\n {this.getRoutes(routes)}\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default Layout;\r\n","/*!\r\n\r\n=========================================================\r\n* Argon Dashboard React - v1.1.0\r\n=========================================================\r\n\r\n* Product Page: https://www.creative-tim.com/product/argon-dashboard-react\r\n* Copyright 2019 Creative Tim (https://www.creative-tim.com)\r\n* Licensed under MIT (https://github.com/creativetimofficial/argon-dashboard-react/blob/master/LICENSE.md)\r\n\r\n* Coded by Creative Tim\r\n\r\n=========================================================\r\n\r\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r\n\r\n*/\r\nimport React from \"react\";\r\nimport { Route, Switch, Redirect } from \"react-router-dom\";\r\n// reactstrap components\r\nimport { Container, Row, Col } from \"reactstrap\";\r\nimport routes from \"routes.js\";\r\n\r\nclass Auth extends React.Component {\r\n componentDidMount() {\r\n //document.body.classList.add(\"bg-default\");\r\n }\r\n componentWillUnmount() {\r\n //document.body.classList.remove(\"bg-default\");\r\n }\r\n getRoutes = routes => {\r\n return routes.map((prop, key) => {\r\n if (prop.layout === \"/auth\") {\r\n return (\r\n \r\n {/* \r\n \r\n \r\n {this.getRoutes(routes)}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\n\r\nconst styles ={\r\n wyvernContainer: {\r\n position: 'absolute',\r\n zIndex: -10,\r\n left: -300,\r\n top: 0,\r\n width: '100%'\r\n\r\n },\r\n wyvern: {\r\n opacity: 0.2,\r\n width: 700,\r\n position: 'absolute',\r\n left: '80%',\r\n top:'60%'\r\n }\r\n}\r\nexport default Auth;\r\n","/*!\r\n\r\n=========================================================\r\n* Argon Dashboard React - v1.1.0\r\n=========================================================\r\n\r\n* Product Page: https://www.creative-tim.com/product/argon-dashboard-react\r\n* Copyright 2019 Creative Tim (https://www.creative-tim.com)\r\n* Licensed under MIT (https://github.com/creativetimofficial/argon-dashboard-react/blob/master/LICENSE.md)\r\n\r\n* Coded by Creative Tim\r\n\r\n=========================================================\r\n\r\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r\n\r\n*/\r\nimport React, { useContext, useEffect, useState } from \"react\";\r\nimport { BrowserRouter, Route, Switch, Redirect } from \"react-router-dom\";\r\nimport UserContext, { UserContextProvider } from \"./context/UserContext\";\r\nimport PrivateRoute from \"./infrastructure/ProtectedRoute\";\r\nimport { HotKeys } from \"react-hotkeys\";\r\nimport Layout from \"layouts/Layout.js\";\r\nimport AuthLayout from \"layouts/Auth.js\";\r\nimport StorageService from \"infrastructure/StorageService\";\r\nexport const App = () => {\r\n return (\r\n \r\n
\r\n {/* Page content */}\r\n \r\n })
\r\n
\r\n \r\n \r\n \r\n
\r\n